Feature/storybook v8 (#202)

* Update storybook to v8

* Added a11ly addon

kinda works

* Remove empty lines

override package version for parse-url as a critical dependency

.storybook/main.ts

@@ -0,0 +1,36 @@
+import remarkGfm from 'remark-gfm';
+import type { StorybookConfig } from '@storybook/react-webpack5';
+
+const config: StorybookConfig = {
+  stories: ['../stories/**/*.stories.@(js|jsx|ts|tsx)', '../stories/**/*.mdx'],
+  addons: [
+    '@storybook/addon-links',
+    '@storybook/addon-essentials',
+    '@storybook/addon-webpack5-compiler-babel',
+    '@storybook/addon-a11y',
+    {
+      name: '@storybook/addon-docs',
+      options: {
+        mdxPluginOptions: {
+          mdxCompileOptions: {
+            remarkPlugins: [remarkGfm],
+          },
+        },
+      },
+    },
+  ],
+  staticDirs: [{ from: '../assets', to: '/assets' }],
+  framework: {
+    name: '@storybook/react-webpack5',
+    options: {},
+  },
+  core: {
+    disableTelemetry: true,
+  },
+  docs: {},
+  typescript: {
+    reactDocgen: 'react-docgen-typescript',
+  },
+};
+
+export default config;

.storybook/manager.js

@@ -1,4 +1,4 @@
-import { addons } from '@storybook/addons';
+import { addons } from '@storybook/manager-api';
 import mdirTheme from '../themes/mdir-theme';
 import '../assets/fonts.css'
 

.storybook/preview.js

@@ -4,24 +4,24 @@ import './../assets/fonts.css';
 import './../assets/preview.css';
 
 export const parameters = {
-  actions: { argTypesRegex: '^on[A-Z].*' },
   controls: {
     expanded: true,
+    disableSaveFromUI: true,
     matchers: {
       color: /(background|color)$/i,
       date: /Date$/,
-    },
+    }
   },
   backgrounds: {
     grid: {
       disable: true,
-    }
+    },
   },
   options: {
     storySort: {
       order: ['Introduction', ['Getting started', 'Contribute'], 'Components', 'Messages', 'Chips', 'Form', 'Icons'],
-    }
-  }
+    },
+  },
 };
 
 export const decorators = [
@@ -31,3 +31,4 @@ export const decorators = [
     </div>
   ),
 ];
+export const tags = ['autodocs'];

assets/fonts.css

@@ -32,33 +32,36 @@
  * © 2020 MyFonts Inc
 */
 
-
 /* @import must be at top of file, otherwise CSS will not work */
-@import url("//hello.myfonts.net/count/3ca3a0");
 @import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600&display=swap');
 
 @font-face {
   font-family: 'SofiaPro-Regularitalic';
-  src: url('./webfonts/SofiaPro-Regularitalic/font.woff2') format('woff2'), url('./webfonts/SofiaPro-Regularitalic/font.woff') format('woff');
+  src: url('./webfonts/SofiaPro-Regularitalic/font.woff2') format('woff2'),
+    url('./webfonts/SofiaPro-Regularitalic/font.woff') format('woff');
 }
 @font-face {
   font-family: 'SofiaPro-Light';
-  src: url('./webfonts/SofiaPro-Light/font.woff2') format('woff2'), url('./webfonts/SofiaPro-Light/font.woff') format('woff');
+  src: url('./webfonts/SofiaPro-Light/font.woff2') format('woff2'),
+    url('./webfonts/SofiaPro-Light/font.woff') format('woff');
 }
 @font-face {
   font-family: 'SofiaPro-Lightitalic';
-  src: url('./webfonts/SofiaPro-Lightitalic/font.woff2') format('woff2'), url('./webfonts/SofiaPro-Lightitalic/font.woff') format('woff');
+  src: url('./webfonts/SofiaPro-Lightitalic/font.woff2') format('woff2'),
+    url('./webfonts/SofiaPro-Lightitalic/font.woff') format('woff');
 }
 @font-face {
   font-family: 'SofiaPro-Medium';
-  src: url('./webfonts/SofiaPro-Medium/font.woff2') format('woff2'), url('./webfonts/SofiaPro-Medium/font.woff') format('woff');
+  src: url('./webfonts/SofiaPro-Medium/font.woff2') format('woff2'),
+    url('./webfonts/SofiaPro-Medium/font.woff') format('woff');
 }
 @font-face {
   font-family: 'SofiaPro-Regular';
-  src: url('./webfonts/SofiaPro-Regular/font.woff2') format('woff2'), url('./webfonts/SofiaPro-Regular/font.woff') format('woff');
+  src: url('./webfonts/SofiaPro-Regular/font.woff2') format('woff2'),
+    url('./webfonts/SofiaPro-Regular/font.woff') format('woff');
 }
 @font-face {
   font-family: 'SofiaPro-Bold';
-  src: url('./webfonts/SofiaPro-Bold/font.woff2') format('woff2'), url('./webfonts/SofiaPro-Bold/font.woff') format('woff');
+  src: url('./webfonts/SofiaPro-Bold/font.woff2') format('woff2'),
+    url('./webfonts/SofiaPro-Bold/font.woff') format('woff');
 }
-

.babelrc.json → babel.config.json

@@ -11,7 +11,8 @@
         }
       }
     ],
-    "@babel/preset-typescript",
-    "@babel/preset-react"
+    "@babel/preset-flow",
+    "@babel/preset-react",
+    "@babel/preset-typescript"
   ]
-}
+}