fix(atoms): fox code numeric

8base · Nov 6, 2018 · f9da6d4 · f9da6d4
1 parent 273a8e8
commit f9da6d4
Show file tree

Hide file tree

Showing 3 changed files with 27 additions and 18 deletions.
diff --git a/src/atoms/Code/Code.js b/src/atoms/Code/Code.js
@@ -21,7 +21,7 @@ class Code extends PureComponent<CodeProps> {
   }
 
   getLinesCount = (codeText: mixed) => typeof codeText === 'string'
-    ? codeText.split(/\r\n|\r|\n/).length
+    ? codeText.replace(/\n$/, '').split(/\r\n|\r|\n/).length
     : 0;
 
   renderNumbs = () => {

diff --git a/src/atoms/Code/Code.stories.js b/src/atoms/Code/Code.stories.js
@@ -13,6 +13,7 @@ export default (asStory) => {
         <Code height={ 200 }>{
           `npm i -g 8base
 8base init my-project
+
 npm i -g 8base
 8base init my-project
 npm i -g 8base
@@ -30,7 +31,8 @@ npm i -g 8base
 npm i -g 8base
 8base init my-project
 npm i -g 8base
-8base init my-project`
+8base init my-project
+`
 	     }
         </Code>
       ));

diff --git a/storybook/__tests__/__snapshots__/storyshots.test.js.snap b/storybook/__tests__/__snapshots__/storyshots.test.js.snap
@@ -2497,11 +2497,11 @@ exports[`Storyshots ATOMS/Code default 1`] = `
 `;
 
 exports[`Storyshots ATOMS/Code with custom height 1`] = `
-.emotion-54 {
+.emotion-56 {
   margin: 2rem;
 }
 
-.emotion-50 {
+.emotion-52 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -2514,15 +2514,15 @@ exports[`Storyshots ATOMS/Code with custom height 1`] = `
   align-items: stretch;
 }
 
-.emotion-42 {
+.emotion-44 {
   height: 100%;
   display: block;
   width: 3rem;
   position: absolute;
   overflow: hidden;
 }
 
-.emotion-46 {
+.emotion-48 {
   overflow: auto;
   padding: 2rem;
   font-family: Courier;
@@ -2532,14 +2532,14 @@ exports[`Storyshots ATOMS/Code with custom height 1`] = `
   height: 100%;
 }
 
-.emotion-52 {
+.emotion-54 {
   height: 200px;
   border: 1px solid #d0d7dd;
   border-radius: .5rem;
   overflow: hidden;
 }
 
-.emotion-44 {
+.emotion-46 {
   height: 200px;
   display: block;
   width: 3rem;
@@ -2549,7 +2549,7 @@ exports[`Storyshots ATOMS/Code with custom height 1`] = `
   position: relative;
 }
 
-.emotion-40 {
+.emotion-42 {
   height: auto;
   padding: 2rem 0 4rem;
   background-color: #f4f7f9;
@@ -2567,29 +2567,29 @@ exports[`Storyshots ATOMS/Code with custom height 1`] = `
   text-align: center;
 }
 
-.emotion-48 {
+.emotion-50 {
   overflow: hidden;
   height: 200px;
   width: 100%;
 }
 
 <div
-  className="emotion-54 emotion-55"
+  className="emotion-56 emotion-57"
 >
   <div
-    className="emotion-52 emotion-1"
+    className="emotion-54 emotion-1"
   >
     <div
-      className="emotion-50 emotion-1"
+      className="emotion-52 emotion-1"
     >
       <div
-        className="emotion-44 emotion-1"
+        className="emotion-46 emotion-1"
       >
         <div
-          className="emotion-42 emotion-1"
+          className="emotion-44 emotion-1"
         >
           <div
-            className="emotion-40 emotion-1"
+            className="emotion-42 emotion-1"
           >
             <div
               className="emotion-0 emotion-1"
@@ -2691,19 +2691,25 @@ exports[`Storyshots ATOMS/Code with custom height 1`] = `
             >
               20
             </div>
+            <div
+              className="emotion-0 emotion-1"
+            >
+              21
+            </div>
           </div>
         </div>
       </div>
       <div
-        className="emotion-48 emotion-1"
+        className="emotion-50 emotion-1"
       >
         <pre
-          className="emotion-46 emotion-1"
+          className="emotion-48 emotion-1"
           insideRef={[Function]}
           onScroll={[Function]}
         >
           npm i -g 8base
 8base init my-project
+
 npm i -g 8base
 8base init my-project
 npm i -g 8base
@@ -2722,6 +2728,7 @@ npm i -g 8base
 8base init my-project
 npm i -g 8base
 8base init my-project
+
         </pre>
       </div>
     </div>