Merge pull request #414 from mashmatrix/story-to-csf3

Convert stories to CSF 3.0

Author: stomita

.storybook/main.js

@@ -1,7 +1,7 @@
 const path = require('path');
 
 module.exports = {
-  stories: ['../stories/**/*Stories.tsx'],
+  stories: ['../stories/**/*.stories.tsx'],
   addons: [
     '@storybook/addon-docs',
     '@storybook/addon-actions',

stories/Badge.stories.tsx

@@ -0,0 +1,32 @@
+import React from 'react';
+import { action } from '@storybook/addon-actions';
+import { Badge } from '../src/scripts';
+export default {
+  title: 'Badge',
+};
+export const Default = {
+  render: () => <Badge onClick={action('click')}>Badge Label</Badge>,
+  parameters: {
+    info: 'Default badge',
+  },
+};
+export const Shade = {
+  render: () => (
+    <Badge type='shade' onClick={action('click')}>
+      Badge Label
+    </Badge>
+  ),
+  parameters: {
+    info: 'Badge with type: shade',
+  },
+};
+export const Inverse = {
+  render: () => (
+    <Badge type='inverse' onClick={action('click')}>
+      Badge Label
+    </Badge>
+  ),
+  parameters: {
+    info: 'Badge with type: inverse',
+  },
+};

stories/BadgeStories.tsx

@@ -0,0 +1,17 @@
+import React from 'react';
+import { action } from '@storybook/addon-actions';
+import { BreadCrumbs, Crumb } from '../src/scripts';
+export default {
+  title: 'BreadCrumbs',
+};
+export const Default = {
+  render: () => (
+    <BreadCrumbs>
+      <Crumb onClick={action('crumb1#click')}>Parent Entity</Crumb>
+      <Crumb onClick={action('crumb2#click')}>Parent Record Name</Crumb>
+    </BreadCrumbs>
+  ),
+  parameters: {
+    info: 'Default BreadCrumbs',
+  },
+};