update dependencies storybook

.github/workflows/build.yml

@@ -15,7 +15,7 @@ jobs:
         run: echo "::set-output name=PACKAGE::yarn"
 
       - name: Use Node.js
-        uses: actions/setup-node@v3.5.1
+        uses: actions/setup-node@v3.6.0
         with:
           node-version-file: ".nvmrc"
           cache: ${{ steps.cache.outputs.PACKAGE }}
@@ -41,7 +41,7 @@ jobs:
         run: echo "::set-output name=PACKAGE::yarn"
 
       - name: Use Node.js
-        uses: actions/setup-node@v3.5.1
+        uses: actions/setup-node@v3.6.0
         with:
           node-version-file: ".nvmrc"
           cache: ${{ steps.cache.outputs.PACKAGE }}
@@ -70,7 +70,7 @@ jobs:
         run: echo "::set-output name=PACKAGE::yarn"
 
       - name: Use Node.js
-        uses: actions/setup-node@v3.5.1
+        uses: actions/setup-node@v3.6.0
         with:
           node-version-file: ".nvmrc"
           cache: ${{ steps.cache.outputs.PACKAGE }}
@@ -101,7 +101,7 @@ jobs:
         run: echo "::set-output name=PACKAGE::yarn"
 
       - name: Use Node.js
-        uses: actions/setup-node@v3.5.1
+        uses: actions/setup-node@v3.6.0
         with:
           node-version-file: ".nvmrc"
           cache: ${{ steps.cache.outputs.PACKAGE }}

package.json

@@ -15,9 +15,9 @@
   "author": "Vio <vio@moonwalker.tech>",
   "license": "MIT",
   "devDependencies": {
-    "@moonwalker/pre-flight-check": "1.4.8",
+    "@moonwalker/pre-flight-check": "1.5.3",
     "dotenv": "16.0.3",
     "gh-pages": "4.0.0",
-    "lerna": "6.0.3"
+    "lerna": "6.6.1"
   }
 }

packages/ui-react/package.json

@@ -36,33 +36,33 @@
     "react-dom": "^16.6.3 || ^17.0.0"
   },
   "devDependencies": {
-    "@babel/cli": "7.19.3",
-    "@babel/core": "7.20.2",
+    "@babel/cli": "7.20.7",
+    "@babel/core": "7.20.12",
     "@babel/plugin-transform-runtime": "7.19.6",
     "@babel/preset-env": "7.20.2",
     "@babel/preset-react": "7.18.6",
     "@moonwalker/orbit-ui": "^1.14.33",
     "@moonwalker/orbit-ui-stylus": "^1.14.33",
-    "@storybook/addon-actions": "6.5.13",
-    "@storybook/addon-essentials": "6.5.13",
+    "@storybook/addon-actions": "6.5.15",
+    "@storybook/addon-essentials": "6.5.15",
     "@storybook/addon-knobs": "6.4.0",
-    "@storybook/addon-storyshots": "6.5.13",
-    "@storybook/addons": "6.5.13",
-    "@storybook/react": "6.5.13",
-    "@testing-library/react": "^13.3.0",
+    "@storybook/addon-storyshots": "6.5.15",
+    "@storybook/addons": "6.5.15",
+    "@storybook/react": "6.5.15",
+    "@testing-library/react": "^14.0.0",
     "autoprefixer": "10.0.1",
     "babel-core": "7.0.0-bridge.0",
-    "babel-jest": "29.3.1",
+    "babel-jest": "29.5.0",
     "babel-loader": "8.2.5",
     "babel-plugin-require-context-hook": "1.0.0",
     "classnames": "2.3.2",
-    "css-loader": "3.6.0",
-    "downshift": "7.0.4",
+    "css-loader": "6.7.3",
+    "downshift": "7.2.0",
     "identity-obj-proxy": "3.0.0",
     "jest": "26.6.3",
     "lodash": "4.17.21",
-    "mini-css-extract-plugin": "2.7.0",
-    "postcss": "8.4.19",
+    "mini-css-extract-plugin": "2.7.2",
+    "postcss": "8.4.21",
     "postcss-loader": "4.3",
     "prop-types": "15.8.1",
     "react": "18.2.0",
@@ -74,8 +74,8 @@
     "stylus": "0.59.0",
     "stylus-loader": "4.3.3",
     "webpack": "5.75.0",
-    "webpack-bundle-analyzer": "4.7.0",
-    "webpack-cli": "5.0.0",
+    "webpack-bundle-analyzer": "4.8.0",
+    "webpack-cli": "5.0.1",
     "webpack-merge": "5.8.0"
   }
 }

packages/ui-stylus/.storybook/main.js

@@ -1,9 +1,15 @@
-const path = require('path');
+import path from 'path';
 
-const orbitUI = require('../lib');
+import orbitUI from '../lib';
 
-module.exports = {
-  stories: ['../lib/**/*.stories.@(js|mdx)'],
+/** @type {import('@storybook/html-webpack5').StorybookConfig} */
+const config = {
+  stories: [
+    {
+      directory: '../lib',
+      files: '**/*.stories.@(mdx|tsx|ts|jsx|js)'
+    }
+  ],
   addons: [
     {
       name: path.join(__dirname, './preset-stylus'),
@@ -20,9 +26,16 @@ module.exports = {
           }
         }
       }
-    },
-    '@storybook/addon-links',
-    '@storybook/addon-essentials'
+    }
+    // '@storybook/addon-links',
+    // '@storybook/addon-essentials'
   ],
-  framework: '@storybook/html'
+  framework: {
+    name: '@storybook/html-webpack5',
+    options: {
+      builder: { lazyCompilation: true }
+    }
+  }
 };
+
+export default config;

packages/ui-stylus/.storybook/preset-stylus.js

@@ -7,39 +7,32 @@ function wrapLoader(loader, options) {
   return [
     {
       loader,
-      options,
-    },
+      options
+    }
   ];
 }
 
 module.exports = {
   webpack: (webpackConfig = {}, options = {}) => {
-    const { module = {} } = webpackConfig;
-    const {
-      styleLoaderOptions,
-      cssLoaderOptions,
-      stylusLoaderOptions,
-      rule = {},
-    } = options;
+    const { styleLoaderOptions, cssLoaderOptions, stylusLoaderOptions, rule = {} } = options;
 
     return {
       ...webpackConfig,
       module: {
-        ...module,
+        ...webpackConfig.module,
         rules: [
-          ...(module.rules || []),
+          ...(webpackConfig.module.rules || []),
           {
-            test: /\.styl$/,
+            test: /\.styl$/i,
             ...rule,
             use: [
-
               ...wrapLoader(require.resolve('style-loader'), styleLoaderOptions),
               ...wrapLoader(require.resolve('css-loader'), cssLoaderOptions),
               ...wrapLoader(require.resolve('stylus-loader'), stylusLoaderOptions)
-            ],
-          },
-        ],
-      },
+            ]
+          }
+        ]
+      }
     };
   }
 };

packages/ui-stylus/.storybook/preview.js

@@ -1,11 +1,16 @@
 import '../lib/orbit-ui/base/index.styl';
 
-export const parameters = {
-  actions: { argTypesRegex: '^on[A-Z].*' },
-  controls: {
-    matchers: {
-      color: /(background|color)$/i,
-      date: /Date$/
+/** @type {import('@storybook/html').Preview} */
+const preview = {
+  parameters: {
+    actions: { argTypesRegex: '^on[A-Z].*' },
+    controls: {
+      matchers: {
+        color: /(background|color)$/i,
+        date: /Date$/
+      }
     }
   }
 };
+
+export default preview;

packages/ui-stylus/package.json

@@ -17,25 +17,28 @@
   },
   "scripts": {
     "prebuild": "npm run lint && npm run test",
-    "build": "build-storybook",
+    "build": "storybook build",
     "lint": "npm run lint:styl && npm run lint:js",
     "lint:js": "../../node_modules/.bin/eslint lib/**/*.js",
     "lint:styl": "stylint lib",
     "test": "echo \"Error: no test specified\" && exit 0",
-    "start": "start-storybook -p 6006"
+    "start": "storybook dev -p 6006"
   },
   "dependencies": {
     "@moonwalker/orbit-mixins-stylus": "^1.14.33",
-    "classnames": "2.3.1"
+    "classnames": "2.3.2"
   },
   "devDependencies": {
-    "@storybook/addon-actions": "6.5.13",
-    "@storybook/addon-essentials": "6.5.13",
-    "@storybook/addon-links": "6.5.13",
-    "@storybook/html": "6.5.13",
-    "classnames": "2.3.1",
+    "@storybook/addon-actions": "7.0.2",
+    "@storybook/addon-essentials": "7.0.2",
+    "@storybook/addon-links": "7.0.2",
+    "@storybook/html-webpack5": "7.0.2",
+    "classnames": "2.3.2",
+    "react": "18.2.0",
+    "react-dom": "18.2.0",
+    "storybook": "7.0.2",
     "stylint": "2.0.0",
     "stylus": "0.59.0",
-    "stylus-loader": "4.3.3"
+    "stylus-loader": "^7.1.0"
   }
 }