Update npm packages

.gitignore

@@ -20,9 +20,6 @@ gen
 # npm
 npm-debug.log
 
-# nvm
-.nvmrc
-
 # Project
 .env
 /stats/

.npmrc

@@ -1,2 +1,7 @@
+# Replace default '^' prefix with '~' to allow only minor package updates
 save-prefix=~
 legacy-peer-deps=true
+
+# If set to true, then npm will stubbornly refuse to install (or even consider
+# installing) any package that claims to not be.
+engine-strict=true

.nvmrc

@@ -1 +1 @@
-18
+20

.storybook/main.ts

@@ -1,8 +1,9 @@
 /* eslint-disable import/no-import-module-exports */
-import { UserConfig, mergeConfig, UserConfigExport } from 'vite';
+import { mergeConfig } from 'vite';
+import type { StorybookConfig } from '@storybook/vue3-vite';
 import { alias } from '../vite.config';
 
-module.exports = {
+const config: StorybookConfig = {
   stories: [ // @see https://storybook.js.org/docs/react/configure/overview#configure-story-loading
     '../src/stories/**/*.stories.mdx', // Currently not supported because of a bug in the vite builder. @see https://github.com/storybookjs/builder-vite/pull/556
     {
@@ -20,17 +21,23 @@ module.exports = {
     '@storybook/addon-links',
     '@storybook/addon-essentials',
     '@storybook/preset-scss',
+    '@storybook/addon-mdx-gfm',
   ],
-  framework: '@storybook/vue3',
-  core: {
-    builder: '@storybook/builder-vite',
+  framework: {
+    name: '@storybook/vue3-vite',
+    options: {},
   },
   staticDirs: ['../static'],
-  async viteFinal(config: UserConfig): Promise<UserConfigExport> {
-    return mergeConfig(config, {
+  async viteFinal(viteConfig) {
+    return mergeConfig(viteConfig, {
       resolve: {
         alias,
       },
     });
   },
+  docs: {
+    autodocs: true,
+  },
 };
+
+export default config;

.storybook/preview.tsx

@@ -0,0 +1,24 @@
+import type { Preview } from '@storybook/vue3';
+import { setup } from '@storybook/vue3';
+import '../src/setup/scss/themes/theme-01.scss';
+import '../src/setup/styles.scss';
+import vuePlugins from '../src/setup/plugins';
+
+setup((app) => {
+  // @see https://storybook.js.org/docs/vue/writing-stories/decorators#context-for-mocking
+  vuePlugins.forEach(({ plugin, options }) => app.use(plugin, options));
+});
+
+const preview: Preview = {
+  parameters: {
+    actions: { argTypesRegex: '^on[A-Z].*' },
+    controls: {
+      matchers: {
+        color: /(background|color)$/i,
+        date: /Date$/,
+      },
+    },
+  }
+};
+
+export default preview;

.stylelintrc.js

@@ -1,12 +1,4 @@
 module.exports = {
-  processors: ['postcss-html'],
+  customSyntax: 'postcss-html',
   extends: 'stylelint-config-valantic',
-  rules: {
-    'indentation': [
-      2,
-      {
-        ignore: ['inside-parens'] // Stylelint seems to fail on maps
-      }
-    ]
-  }
 };