chore(storybook): switch to yarn and fix Storybook compatibility

- Switch from bun to yarn with node_modules linker
- Downgrade Svelte to 5.46.1 for Storybook compatibility
- Switch Storybook framework from @storybook/sveltekit to @storybook/svelte-vite
- Downgrade Storybook packages to 10.1.11
- Add FSD path aliases to vite.config.ts
- Add Svelte plugin to Storybook viteFinal to handle .svelte files

.gitignore

@@ -1,4 +1,5 @@
 node_modules
+.yarn
 
 # Output
 .output
@@ -27,4 +28,3 @@ package-lock.json
 
 # Git worktrees
 .worktrees
-

.yarnrc.yml

@@ -0,0 +1,3 @@
+# Disable Plug'n'Play, use node_modules
+nodeLinker: node-modules
+enableGlobalCache: false

config/storybook/main.ts

@@ -1,17 +1,59 @@
-import type { StorybookConfig } from '@storybook/sveltekit';
+import type { StorybookConfig } from '@storybook/svelte-vite';
+import {
+  dirname,
+  resolve,
+} from 'path';
+import { fileURLToPath } from 'url';
+import {
+  loadConfigFromFile,
+  mergeConfig,
+} from 'vite';
+
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = dirname(__filename);
 
 const config: StorybookConfig = {
-  "stories": [
+  stories: [
-    "../src/**/*.mdx",
+    '../../src/**/*.mdx',
-    "../src/**/*.stories.@(js|ts|svelte)"
+    '../../src/**/*.stories.@(js|ts|svelte)',
   ],
-  "addons": [
+  addons: [
-    "@storybook/addon-svelte-csf",
+    {
-    "@chromatic-com/storybook",
+      name: '@storybook/addon-svelte-csf',
-    "@storybook/addon-vitest",
+      options: {
-    "@storybook/addon-a11y",
+        // Use modern template syntax for better performance
-    "@storybook/addon-docs"
+        legacyTemplate: false,
+      },
+    },
+    '@chromatic-com/storybook',
+    '@storybook/addon-vitest',
+    '@storybook/addon-a11y',
+    '@storybook/addon-docs',
   ],
-  "framework": "@storybook/sveltekit"
+  framework: '@storybook/svelte-vite',
+  async viteFinal(config) {
+    // This attempts to find your actual vite.config.ts
+    const { config: userConfig } = await loadConfigFromFile(
+      { command: 'serve', mode: 'development' },
+      resolve(__dirname, '../../vite.config.ts'),
+    ) || {};
+
+    const mergedConfig = mergeConfig(config, {
+      // Merge resolve/alias parts to maintain path aliases
+      resolve: userConfig?.resolve || {},
+    });
+
+    const { svelte } = await import('@sveltejs/vite-plugin-svelte');
+    mergedConfig.plugins = mergedConfig.plugins || [];
+
+    // Add Svelte plugin to process @storybook's .svelte files
+    // This prevents Vite from trying to parse them before compilation
+    mergedConfig.plugins.unshift(svelte({
+      include: [/node_modules\/@storybook\/.+\.svelte$/],
+    }));
+
+    return mergedConfig;
+  },
 };
-export default config;
+
+export default config;

package.json

@@ -1,6 +1,7 @@
 {
 	"name": "allmywork",
 	"private": true,
+	"packageManager": "yarn@4.11.0",
 	"version": "0.0.1",
 	"type": "module",
 	"scripts": {
@@ -17,43 +18,46 @@
 		"test": "vitest",
 		"test:watch": "vitest --watch",
 		"test:e2e": "playwright test",
-		"test:all": "bun run test && bun run test:e2e",
+		"test:all": "yarn test && yarn test:e2e",
 		"test:coverage": "vitest --coverage",
 		"storybook": "storybook dev -p 6006 --config-dir config/storybook",
 		"build-storybook": "storybook build --config-dir config/storybook"
 	},
 	"devDependencies": {
 		"@biomejs/biome": "^2.4.5",
+		"@chromatic-com/storybook": "4.1.3",
 		"@playwright/test": "^1.58.2",
+		"@storybook/addon-a11y": "10.1.11",
+		"@storybook/addon-docs": "10.1.11",
+		"@storybook/addon-svelte-csf": "5.0.10",
+		"@storybook/addon-vitest": "10.1.11",
 		"@sveltejs/adapter-auto": "^7.0.0",
 		"@sveltejs/kit": "^2.50.2",
 		"@sveltejs/vite-plugin-svelte": "^6.2.4",
 		"@tailwindcss/postcss": "^4.2.1",
 		"@testing-library/svelte": "^5.3.1",
 		"@types/node": "^25.3.3",
+		"@vitest/browser-playwright": "^4.0.18",
 		"@vitest/coverage-v8": "^4.0.18",
 		"@vitest/ui": "^4.0.18",
 		"autoprefixer": "^10.4.27",
 		"jsdom": "^28.1.0",
+		"playwright": "^1.58.2",
 		"postcss": "^8.5.8",
-		"svelte": "^5.51.0",
+		"storybook": "10.1.11",
+		"svelte": "5.46.1",
 		"svelte-adapter-bun": "^1.0.1",
 		"svelte-check": "^4.4.2",
 		"tailwindcss": "^4.2.1",
 		"typescript": "^5.9.3",
 		"vite": "^7.3.1",
-		"vitest": "^4.0.18",
+		"vitest": "^4.0.18"
-		"storybook": "^10.2.16",
-		"@storybook/sveltekit": "^10.2.16",
-		"@storybook/addon-svelte-csf": "^5.0.11",
-		"@chromatic-com/storybook": "^5.0.1",
-		"@storybook/addon-vitest": "^10.2.16",
-		"@storybook/addon-a11y": "^10.2.16",
-		"@storybook/addon-docs": "^10.2.16",
-		"playwright": "^1.58.2",
-		"@vitest/browser-playwright": "^4.0.18"
 	},
 	"dependencies": {
+		"@storybook/builder-vite": "10.1.11",
+		"@storybook/csf-plugin": "10.1.11",
+		"@storybook/svelte": "10.1.11",
+		"@storybook/svelte-vite": "10.1.11",
 		"clsx": "^2.1.1",
 		"tailwind-merge": "^3.5.0"
 	}

vite.config.ts

@@ -7,6 +7,12 @@ export default defineConfig({
 	resolve: {
 		alias: {
 			$lib: path.resolve("./src/shared/lib"),
+			$shared: path.resolve("./src/shared"),
+			$pages: path.resolve("./src/pages"),
+			$features: path.resolve("./src/features"),
+			$entities: path.resolve("./src/entities"),
+			$widgets: path.resolve("./src/widgets"),
+			"$/*": "./src/*",
 		},
 	},
 });