Merge pull request #24 from idesigncode/updates

Updates: dependency updates

Author: idesigncode

.npm-init.cjs

@@ -38,7 +38,7 @@ function requiredPrompt(message) {
 
 // Use scope option (if given)
 const [scopeArg = ''] = process.argv.filter((arg) =>
-  arg.startsWith('--scope=')
+  arg.startsWith('--scope='),
 );
 const scope = scopeArg.replace('--scope=', '');
 // Use basename global as name
@@ -56,7 +56,7 @@ module.exports = {
     'GitHub repository keywords',
     '',
     // Split keywordString on spaces or commas
-    (keywordString) => keywordString.split(/[\s,]+/g)
+    (keywordString) => keywordString.split(/[\s,]+/g),
   ),
   license: optionalPrompt('License', package?.license),
   author: optionalPrompt('Author', package?.author?.name),

.npm-postprepare.cjs

@@ -49,7 +49,7 @@ function sortObjectByKey(object, order) {
             }
             return order.indexOf(accumulator) - order.indexOf(key);
           }
-        : undefined
+        : undefined,
     )
     .reduce((accumulator, key) => {
       return { ...accumulator, [key]: object[key] };
@@ -135,7 +135,7 @@ function logFileUpdate(filename) {
     const readmeUpdated = updateReadme(
       pkgUpdated.description,
       pkgUpdated.name,
-      readme
+      readme,
     );
     if (readmeUpdated !== readme) {
       await fsPromises.writeFile(README_PATH, readmeUpdated);

.storybook/main.mjs

@@ -1,5 +1,5 @@
 import packageJson from '../package.json';
-import { webpackFinal } from '@idesigncode/storybook-tools/storybookConfig.mjs';
+import webpackFinal from '@idesigncode/storybook-tools/webpackFinal.cjs';
 
 export default {
   addons: [
@@ -32,17 +32,5 @@ export default {
     options: {},
   },
   stories: ['../**/*.mdx', '../**/*.stories.*'],
-  storyIndexers: (indexers) => {
-    // Extend js story indexer for mjs
-    return indexers.map((indexer) => {
-      if (`${indexer.test}`.includes(`[tj]sx?$`)) {
-        return {
-          ...indexer,
-          test: /(stories|story)\.m?[tj]sx?$/,
-        };
-      }
-      return indexer;
-    });
-  },
   webpackFinal,
 };

__snapshots__/samplecomponent.test.js.snap

@@ -122,18 +122,13 @@ exports[`SampleComponent Example test 1`] = `
                 <span class="token punctuation">
                   )
                 </span>
-                <span class="token punctuation">
-                  ;
-                </span>
                 <span class>
                 </span>
                 <span class>
                 </span>
                 <span class="token punctuation">
                   }
                 </span>
-                <span class>
-                </span>
               </code>
             </pre>
             <button>
@@ -463,8 +458,6 @@ exports[`SampleComponent Implementation test 1`] = `
       <span class="token punctuation">
         ;
       </span>
-      <span class>
-      </span>
     </code>
   </pre>
   <button>

__snapshots__/samplefunction.test.js.snap

@@ -15,11 +15,14 @@ exports[`sampleFunction Implementation test 1`] = `
         (
       </span>
       <span class="token string">
-        'This is the argument given to sampleFunction'
+        "This is the argument given to sampleFunction"
       </span>
       <span class="token punctuation">
         )
       </span>
+      <span class="token punctuation">
+        ;
+      </span>
     </code>
   </pre>
   <button>

package.json

@@ -71,34 +71,34 @@
     "react-dom": "^18.2.0"
   },
   "devDependencies": {
-    "@babel/cli": "^7.22.5",
-    "@babel/core": "^7.22.5",
-    "@babel/preset-env": "^7.22.5",
+    "@babel/cli": "^7.22.9",
+    "@babel/core": "^7.22.9",
+    "@babel/preset-env": "^7.22.9",
     "@babel/preset-react": "^7.22.5",
-    "@idesigncode/storybook-tools": "^2.1.3",
-    "@storybook/addon-coverage": "^0.0.8",
-    "@storybook/addon-docs": "^7.0.20",
-    "@storybook/addon-interactions": "^7.0.20",
-    "@storybook/addons": "^7.0.20",
+    "@idesigncode/storybook-tools": "^3.0.1",
+    "@storybook/addon-coverage": "^0.0.9",
+    "@storybook/addon-docs": "^7.1.1",
+    "@storybook/addon-interactions": "^7.1.1",
+    "@storybook/addons": "^7.1.1",
     "@storybook/jest": "^0.1.0",
-    "@storybook/react": "^7.0.20",
-    "@storybook/react-webpack5": "^7.0.20",
-    "@storybook/test-runner": "^0.10.0",
-    "@storybook/testing-library": "^0.1.0",
+    "@storybook/react": "^7.1.1",
+    "@storybook/react-webpack5": "^7.1.1",
+    "@storybook/test-runner": "^0.12.0",
+    "@storybook/testing-library": "^0.2.0",
     "autoprefixer": "^10.4.14",
     "babel-plugin-inline-react-svg": "^2.0.2",
     "cssnano": "^6.0.1",
-    "eslint": "^8.42.0",
-    "eslint-plugin-react": "^7.32.2",
+    "eslint": "^8.46.0",
+    "eslint-plugin-react": "^7.33.1",
     "eslint-plugin-simple-import-sort": "^10.0.0",
     "husky": "^8.0.3",
-    "jest-image-snapshot": "^6.1.0",
-    "lint-staged": "^13.2.2",
-    "postcss": "^8.4.24",
+    "jest-image-snapshot": "^6.2.0",
+    "lint-staged": "^13.2.3",
+    "postcss": "^8.4.27",
     "postcss-cli": "^10.1.0",
-    "prettier": "^2.8.8",
-    "sass": "^1.63.3",
-    "storybook": "^7.0.20",
-    "storybook-dark-mode": "^3.0.0"
+    "prettier": "^3.0.0",
+    "sass": "^1.64.1",
+    "storybook": "^7.1.1",
+    "storybook-dark-mode": "^3.0.1"
   }
 }

stories/SampleComponent.stories.mjs

@@ -1,3 +1,4 @@
+import React from 'react';
 import Source from '@idesigncode/storybook-tools/Source.mjs';
 import { expect, userEvent, within } from '../test/test-utils.mjs';
 import SampleComponentExample from './SampleComponent.example.mjs';
@@ -24,5 +25,5 @@ export const Implementation = {
   args: {
     code: SampleComponentExampleRaw,
   },
-  render: Source,
+  render: (args) => <Source {...args} />,
 };

stories/sampleFunction.stories.mjs

@@ -1,3 +1,4 @@
+import React from 'react';
 import Source from '@idesigncode/storybook-tools/Source.mjs';
 import sampleFunction from '../src/sampleFunction.mjs';
 import { expect } from '../test/test-utils.mjs';
@@ -23,5 +24,5 @@ export const Implementation = {
   args: {
     code: `sampleFunction('${Example.args.arg}')`,
   },
-  render: Source,
+  render: (args) => <Source {...args} />,
 };

test/snapshotResolver.cjs

@@ -6,15 +6,15 @@ module.exports = {
     path.join(
       process.cwd(),
       '__snapshots__',
-      `${path.basename(testPath)}${snapshotExtension}`
+      `${path.basename(testPath)}${snapshotExtension}`,
     ),
   resolveTestPath: (snapshotFilePath, snapshotExtension) =>
     path.join(
       process.env.TEST_ROOT,
-      path.basename(snapshotFilePath, snapshotExtension)
+      path.basename(snapshotFilePath, snapshotExtension),
     ),
   testPathForConsistencyCheck: path.join(
     process.env.TEST_ROOT,
-    'example.test.js'
+    'example.test.js',
   ),
 };