chore: update storybook to a non-beta version (#3172)

* chore: update storybook to a non-beta version * chore: babel deps * chore: babel deps * chore: changeset
twilio-labs · Apr 20, 2023 · 80c9f85 · 80c9f85
1 parent 8d4c337
commit 80c9f85
Show file tree

Hide file tree

Showing 6 changed files with 1,407 additions and 2,508 deletions.
diff --git a/.changeset/bright-kings-cheer.md b/.changeset/bright-kings-cheer.md
@@ -0,0 +1,6 @@
+---
+'@twilio-paste/codemods': patch
+'@twilio-paste/core': patch
+---
+
+[Codemods] babel dependency update
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -15,6 +15,7 @@ module.exports = {
     'plugin:promise/recommended',
     'plugin:unicorn/recommended',
     'plugin:paste-internal/all',
+    'plugin:storybook/recommended',
   ],
   env: {
     node: true,
@@ -104,20 +105,23 @@ module.exports = {
         ],
       },
     ],
-
     /**
      * TEMPORARY TWILIO STYLE OVERRIDES
      * There are PRs open to update these rules in twilio-style
      */
-    'react/no-multi-comp': ['error', {ignoreStateless: true}],
+    'react/no-multi-comp': [
+      'error',
+      {
+        ignoreStateless: true,
+      },
+    ],
     'jsx-a11y/label-has-associated-control': [
       2,
       {
         assert: 'either',
         depth: 3,
       },
     ],
-
     /**
      * FIXES FOR ANOTHER TICKET
      * these take a little more work to fix (there are 535 errors)
@@ -141,21 +145,23 @@ module.exports = {
     complexity: 'off',
     // this rule should be kept warning once it is fixed
     'sonarjs/no-duplicate-string': 'warn',
-
     /** MISC OVERRIDES */
 
     // Too restrictive, writing ugly code to defend against a very unlikely scenario: https://eslint.org/docs/rules/no-prototype-builtins
     'no-prototype-builtins': 'off',
-
     '@typescript-eslint/comma-dangle': ['error', 'only-multiline'],
-    '@typescript-eslint/no-shadow': ['error', {ignoreFunctionTypeParameterNameValueShadow: true}],
+    '@typescript-eslint/no-shadow': [
+      'error',
+      {
+        ignoreFunctionTypeParameterNameValueShadow: true,
+      },
+    ],
     // This rule tells people to do something (import foo = require('foo')) which doesn't work
     // with babel compiled typescript.
     '@typescript-eslint/no-var-requires': 'off',
     // Warn about incorrect type imports
     // https://github.com/typescript-eslint/typescript-eslint/blob/master/packages/eslint-plugin/docs/rules/consistent-type-imports.md
     '@typescript-eslint/consistent-type-imports': 'warn',
-
     // Common abbreviations are known and readable
     'unicorn/prevent-abbreviations': 'off',
     // We don't really have a style yet.  To be discussed
@@ -173,7 +179,6 @@ module.exports = {
     'unicorn/prefer-module': 'warn',
     // This conflicts with consistent-return
     'unicorn/no-useless-undefined': 'off',
-
     // New rules
     'unicorn/no-array-reduce': 'off',
     'unicorn/no-array-for-each': 'off',
@@ -188,7 +193,6 @@ module.exports = {
     'unicorn/prefer-regexp-test': 'off',
     'unicorn/no-new-array': 'off',
     'unicorn/prefer-object-from-entries': 'off',
-
     // We don't use jasmine and this clashes with danger js
     'jest/no-jasmine-globals': 'off',
     'jest/no-conditional-expect': 'off',

diff --git a/.storybook/main.ts b/.storybook/main.ts
@@ -2,7 +2,6 @@ import type {StorybookConfig} from '@storybook/react-vite';
 import {mergeConfig} from 'vite';
 import turbosnap from 'vite-plugin-turbosnap';
 import path from 'path';
-
 const config: StorybookConfig = {
   stories: [
     '../packages/**/*.stories.@(js|jsx|ts|tsx|mdx)',
@@ -14,6 +13,7 @@ const config: StorybookConfig = {
     '@storybook/addon-a11y',
     '@storybook/addon-interactions',
     './addons/google-analytics/register',
+    '@storybook/addon-mdx-gfm',
   ],
   framework: '@storybook/react-vite',
   features: {
@@ -31,7 +31,14 @@ const config: StorybookConfig = {
   async viteFinal(config, {configType}) {
     const isTest = process.env.NODE_ENV === 'test';
     return mergeConfig(config, {
-      plugins: configType === 'PRODUCTION' ? [turbosnap({rootDir: config.root ?? process.cwd()})] : [],
+      plugins:
+        configType === 'PRODUCTION'
+          ? [
+              turbosnap({
+                rootDir: config.root ?? process.cwd(),
+              }),
+            ]
+          : [],
       resolve: {
         alias: {
           'next/link': path.resolve(__dirname, './next'),
@@ -46,13 +53,14 @@ const config: StorybookConfig = {
           'react-syntax-highlighter': path.resolve(__dirname, '../node_modules/react-syntax-highlighter/dist/cjs'),
         },
         // Use source files for HMR and TurboSnap dependency map
-        ...(!isTest && {mainFields: ['main:dev', 'browser', 'module', 'main']}),
+        ...(!isTest && {
+          mainFields: ['main:dev', 'browser', 'module', 'main'],
+        }),
       },
       optimizeDeps: {
         include: ['@storybook/addon-viewport', 'chromatic', '@emotion/react/jsx-dev-runtime'],
       },
     });
   },
 };
-
 export default config;
diff --git a/package.json b/package.json
@@ -21,7 +21,7 @@
     "prestart": "yarn prebuild",
     "start": "yarn prestart && yarn build:tokens && concurrently \"yarn:start:tokens\" \"yarn:start:storybook\"",
     "start:all": "yarn build:tokens && concurrently \"yarn:start:tokens\" \"yarn:start:storybook:quiet\" \"yarn:start:website\"",
-    "start:storybook": "sb dev -p 9001",
+    "start:storybook": "storybook dev -p 9001",
     "start:storybook:quiet": "yarn start:storybook --quiet",
     "start:tokens": "yarn workspace @twilio-paste/design-tokens build:watch",
     "start:website": "yarn workspace @twilio-paste/website dev",
@@ -36,7 +36,7 @@
     "build:codemods": "yarn nx run @twilio-paste/codemods:build",
     "build:tokens": "yarn nx run @twilio-paste/design-tokens:tokens",
     "build:icons": "yarn nx run @twilio-paste/icons:build",
-    "build:storybook": "sb build -c .storybook -o ./docs",
+    "build:storybook": "storybook build -c .storybook -o ./docs",
     "build:website": "yarn nx run @twilio-paste/website:build",
     "build:theme-designer": "yarn nx run @twilio-paste/theme-designer:build",
     "build:nextjs-template": "yarn nx run @twilio-paste/nextjs-template:build",
@@ -82,15 +82,16 @@
     "nx": "nx"
   },
   "dependencies": {
-    "@babel/cli": "^7.17.6",
-    "@babel/core": "^7.17.8",
-    "@babel/plugin-proposal-class-properties": "^7.16.7",
-    "@babel/plugin-proposal-object-rest-spread": "^7.17.3",
-    "@babel/plugin-proposal-optional-chaining": "7.16.7",
-    "@babel/plugin-proposal-private-property-in-object": "^7.16.7",
-    "@babel/preset-env": "^7.16.11",
-    "@babel/preset-react": "^7.16.7",
-    "@babel/preset-typescript": "^7.16.7",
+    "@babel/cli": "^7.21.0",
+    "@babel/core": "^7.21.4",
+    "@babel/plugin-proposal-class-properties": "^7.18.6",
+    "@babel/plugin-proposal-object-rest-spread": "^7.20.7",
+    "@babel/plugin-proposal-optional-chaining": "7.21.0",
+    "@babel/plugin-proposal-private-property-in-object": "^7.21.0",
+    "@babel/preset-env": "^7.21.4",
+    "@babel/preset-react": "^7.18.6",
+    "@babel/preset-typescript": "^7.21.4",
+    "@babel/types": "^7.21.4",
     "@changesets/changelog-github": "^0.2.8",
     "@changesets/cli": "^2.13.1",
     "@commitlint/cli": "16.2.1",
@@ -105,17 +106,18 @@
     "@percy/cli": "^1.10.1",
     "@percy/cypress": "^3.1.2",
     "@sparticuz/chromium": "^110.0.0",
-    "@storybook/addon-a11y": "7.0.0-beta.45",
-    "@storybook/addon-actions": "7.0.0-beta.45",
-    "@storybook/addon-essentials": "7.0.0-beta.45",
-    "@storybook/addon-interactions": "7.0.0-beta.45",
-    "@storybook/addon-links": "7.0.0-beta.45",
-    "@storybook/addons": "7.0.0-beta.45",
-    "@storybook/cli": "7.0.0-beta.45",
-    "@storybook/react": "7.0.0-beta.45",
-    "@storybook/react-vite": "7.0.0-beta.45",
-    "@storybook/test-runner": "0.9.3",
-    "@storybook/testing-library": "0.0.13",
+    "@storybook/addon-a11y": "7.0.6",
+    "@storybook/addon-actions": "7.0.6",
+    "@storybook/addon-essentials": "7.0.6",
+    "@storybook/addon-interactions": "7.0.6",
+    "@storybook/addon-links": "7.0.6",
+    "@storybook/addon-mdx-gfm": "7.0.6",
+    "@storybook/addons": "7.0.6",
+    "@storybook/cli": "7.0.6",
+    "@storybook/react": "7.0.6",
+    "@storybook/react-vite": "7.0.6",
+    "@storybook/test-runner": "0.10.0",
+    "@storybook/testing-library": "0.1.0",
     "@swc/core": "^1.2.160",
     "@swc/jest": "^0.2.20",
     "@testing-library/jest-dom": "^5.16.5",
@@ -167,6 +169,7 @@
     "eslint-plugin-promise": "6.0.0",
     "eslint-plugin-react": "7.29.4",
     "eslint-plugin-react-hooks": "4.4.0",
+    "eslint-plugin-storybook": "^0.6.11",
     "eslint-plugin-unicorn": "40.1.0",
     "evergreen-ui": "^6.13.2",
     "git-branch-is": "^3.0.0",
@@ -196,6 +199,7 @@
     "search-in-file": "^1.2.2",
     "shelljs": "^0.8.3",
     "start-server-and-test": "^1.15.2",
+    "storybook": "7.0.6",
     "terser": "^5.3.0",
     "theo": "^8.1.5",
     "ts-node": "^10.0.0",

diff --git a/packages/paste-codemods/package.json b/packages/paste-codemods/package.json
@@ -22,9 +22,9 @@
     "meow": "8.0.0"
   },
   "devDependencies": {
-    "@babel/core": "^7.17.8",
-    "@babel/plugin-proposal-object-rest-spread": "^7.17.3",
-    "@babel/preset-env": "^7.16.11",
+    "@babel/core": "^7.21.4",
+    "@babel/plugin-proposal-object-rest-spread": "^7.20.7",
+    "@babel/preset-env": "^7.21.4",
     "@twilio-paste/core": "^19.0.0"
   }
 }