chore(deps): bump Storybook from 6.4.9 to 7.6.15 (#151)

.github/workflows/docs.yml

@@ -4,17 +4,22 @@ on:
     branches:
       - master
 
+env:
+  FORCE_COLOR: 2
+  NODE: 20
+
 jobs:
   docs:
     runs-on: ubuntu-latest
     steps:
-      - name: Checkout source code
-        uses: actions/checkout@v2
-      - name: Use Node.js
-        uses: actions/setup-node@v2
+      - name: Clone repository
+        uses: actions/checkout@v4
+      - name: Set up Node.js
+        uses: actions/setup-node@v4
         with:
-          node-version: '14.x'
-      - name: Install dependencies
+          node-version: "${{ env.NODE }}"
+          cache: npm
+      - name: Install npm dependencies
         run: npm ci
       - name: Build Storybook
         run: npm run build-storybook

.nvmrc

@@ -1 +1 @@
-14.21.3
+20.11.0

.storybook/main.js

@@ -1,16 +1,24 @@
 const path = require('path');
 const TsconfigPathsPlugin = require('tsconfig-paths-webpack-plugin');
 
-module.exports = {
-  "stories": [
-    "../src/**/*.stories.mdx",
-    "../src/**/*.stories.@(js|jsx|ts|tsx)"
-  ],
-  "addons": [
+const config = {
+  stories: ["../src/**/*.mdx", "../src/**/*.stories.@(js|jsx|mjs|ts|tsx)"],
+  addons: [
     "@storybook/addon-links",
     "@storybook/addon-essentials",
-    "@storybook/addon-knobs"
+    "@storybook/addon-interactions",
   ],
+  framework: {
+    name: "@storybook/html-webpack5",
+    options: {
+      builder: {
+        useSWC: true,
+      },
+    },
+  },
+  docs: {
+    autodocs: "tag",
+  },
   webpackFinal: async (config, {configType}) => {
     config.resolve.plugins = [
       new TsconfigPathsPlugin({
@@ -19,4 +27,5 @@ module.exports = {
     ];
     return config;
   }
-}
+};
+export default config;

.storybook/preview.js

@@ -1,4 +1,14 @@
+/** @type { import('@storybook/html').Preview } */
+const preview = {
+  parameters: {
+    actions: { argTypesRegex: "^on[A-Z].*" },
+    controls: {
+      matchers: {
+        color: /(background|color)$/i,
+        date: /Date$/i,
+      },
+    },
+  },
+};
 
-export const parameters = {
-  actions: { argTypesRegex: "^on[A-Z].*" },
-}
+export default preview;