Add story example for addon info large object props

storybookjs · Apr 16, 2018 · 69710bf · 69710bf
1 parent 8b15dbf
commit 69710bf
Showing 1 changed file with 54 additions and 0 deletions.
diff --git a/examples/official-storybook/stories/addon-info.stories.js b/examples/official-storybook/stories/addon-info.stories.js
@@ -158,3 +158,57 @@ storiesOf('Addons|Info.GitHub issues', module).add(
     </div>
   ))
 );
+
+storiesOf('Addons|Info.Options.maxPropsIntoLine', module).add(
+  'Object and array props are broken to lines',
+  withInfo({
+    text: 'Component should be inlined between description and PropType table',
+    inline: true,
+    maxPropsIntoLine: 0,
+  })(() => (
+    <BaseButton
+      label="Button"
+      object={{
+        one: 'Object and array properties',
+        two: 'will be broken to different lines',
+        three: 'if greater than `maxPropsIntoLine` option threshold.',
+      }}
+      array={['one', 'two', 'three', 'four']}
+      arrayOfObjects={[
+        {
+          one: 'Object and array properties will be broken to different lines',
+          two: 'if greater than `maxPropsIntoLine` option threshold.',
+          object: {
+            object1: {
+              one: 'one',
+              two: 'two',
+              three: 'three',
+            },
+            array: ['one', 'two', 'three'],
+            object2: {
+              object: {
+                one: 'one',
+                two: 'two',
+                three: 'three',
+              },
+              array: [
+                'one',
+                'two',
+                {
+                  object: {
+                    object: {
+                      one: 'one',
+                      two: 'two',
+                      three: 'three',
+                    },
+                    array: ['one', 'two', 'three'],
+                  },
+                },
+              ],
+            },
+          },
+        },
+      ]}
+    />
+  ))
+);