Allow component composition and some cleanup

Author: craquet

.storybook/main.ts

@@ -2,16 +2,11 @@ import type { StorybookConfig } from "@storybook/react-vite"
 
 const config: StorybookConfig = {
     stories: ["../src/**/*.mdx", "../src/**/*.stories.@(js|jsx|mjs|ts|tsx)"],
-    addons: [
-        "@storybook/addon-essentials",
-        "@chromatic-com/storybook",
-        "@storybook/addon-interactions",
-        "@storybook/addon-themes",
-    ],
+    addons: ["@storybook/addon-essentials", "@chromatic-com/storybook", "@storybook/addon-interactions", "@storybook/addon-themes"],
     framework: {
         name: "@storybook/react-vite",
-        options: {},
+        options: {}
     },
-    staticDirs: [{ from: "../public", to: "/" }],
+    staticDirs: [{ from: "../public", to: "/" }]
 }
 export default config

.storybook/preview.ts

@@ -8,21 +8,21 @@ const preview: Preview = {
         controls: {
             matchers: {
                 color: /(background|color)$/i,
-                date: /Date$/i,
-            },
-        },
+                date: /Date$/i
+            }
+        }
     },
 
     decorators: [
         withThemeByClassName({
             themes: {
                 // nameOfTheme: 'classNameForTheme',
                 light: "",
-                dark: "dark",
+                dark: "dark"
             },
-            defaultTheme: "light",
-        }),
-    ],
+            defaultTheme: "light"
+        })
+    ]
 }
 
 export default preview

eslint.config.js

@@ -1,28 +1,27 @@
-import js from '@eslint/js'
-import globals from 'globals'
-import reactHooks from 'eslint-plugin-react-hooks'
-import reactRefresh from 'eslint-plugin-react-refresh'
-import tseslint from 'typescript-eslint'
+import js from "@eslint/js"
+import globals from "globals"
+import reactHooks from "eslint-plugin-react-hooks"
+import reactRefresh from "eslint-plugin-react-refresh"
+import tseslint from "typescript-eslint"
 
 export default tseslint.config(
-  { ignores: ['dist'] },
-  {
-    extends: [js.configs.recommended, ...tseslint.configs.recommended],
-    files: ['**/*.{ts,tsx}'],
-    languageOptions: {
-      ecmaVersion: 2020,
-      globals: globals.browser,
-    },
-    plugins: {
-      'react-hooks': reactHooks,
-      'react-refresh': reactRefresh,
-    },
-    rules: {
-      ...reactHooks.configs.recommended.rules,
-      'react-refresh/only-export-components': [
-        'warn',
-        { allowConstantExport: true },
-      ],
-    },
-  },
+    { ignores: ["dist"] },
+    {
+        extends: [js.configs.recommended, ...tseslint.configs.recommended],
+        files: ["**/*.{ts,tsx}"],
+        languageOptions: {
+            ecmaVersion: 2020,
+            globals: globals.browser
+        },
+        plugins: {
+            "react-hooks": reactHooks,
+            "react-refresh": reactRefresh
+        },
+        rules: {
+            ...reactHooks.configs.recommended.rules,
+            "react-refresh/only-export-components": ["warn", { allowConstantExport: true }],
+            "no-unused-vars": ["off"],
+            "@typescript-eslint/no-unused-vars": ["warn"]
+        }
+    }
 )