@codedrifters/configulator 0.0.306 → 0.0.307

package/lib/index.mjs

@@ -32721,8 +32721,88 @@ var JsiiFaker = class _JsiiFaker extends Component13 {
   }
 };
 
-// src/projects/astro-project.ts
+// src/projects/add-playwright.ts
 import { SampleFile as SampleFile2 } from "projen";
+function addPlaywright(project) {
+  project.addDevDeps("@playwright/test");
+  project.tasks.addTask("e2e:install", {
+    description: "Install Playwright browsers",
+    steps: [{ exec: "npx playwright install --with-deps" }]
+  });
+  project.tasks.addTask("e2e", {
+    description: "Run Playwright E2E tests (headless)",
+    steps: [{ exec: "npx playwright test" }]
+  });
+  project.tasks.addTask("e2e:ui", {
+    description: "Run Playwright in UI mode",
+    steps: [{ exec: "npx playwright test --ui" }]
+  });
+  project.tasks.addTask("e2e:report", {
+    description: "Open last HTML report",
+    steps: [{ exec: "npx playwright show-report" }]
+  });
+  project.setScript("e2e:install", "npx projen e2e:install");
+  project.setScript("e2e", "npx projen e2e");
+  project.setScript("e2e:ui", "npx projen e2e:ui");
+  project.setScript("e2e:report", "npx projen e2e:report");
+  new SampleFile2(project, "playwright.config.ts", {
+    contents: `import { defineConfig, devices } from '@playwright/test';
+
+export default defineConfig({
+  testDir: './tests',
+  reporter: [['html', { open: 'never' }]],
+  use: {
+    baseURL: process.env.PLAYWRIGHT_BASE_URL || 'http://localhost:5173',
+    trace: 'on-first-retry',
+  },
+  projects: [{ name: 'chromium', use: { ...devices['Desktop Chrome'] } }],
+});
+`
+  });
+  project.gitignore.addPatterns("test-results/", "playwright-report/");
+}
+
+// src/projects/add-storybook.ts
+import { SampleFile as SampleFile3 } from "projen";
+function addStorybook(project, options = {}) {
+  const withDocs = options.withDocs ?? true;
+  project.addDevDeps(
+    "storybook",
+    "@storybook/react@^9",
+    "@storybook/react-vite@^9",
+    ...withDocs ? ["@storybook/addon-docs@^9"] : []
+  );
+  project.tasks.addTask("storybook", {
+    description: "Run Storybook (Vite)",
+    steps: [{ exec: "storybook dev -p 6006" }]
+  });
+  project.tasks.addTask("build-storybook", {
+    description: "Build static Storybook",
+    steps: [{ exec: "storybook build" }]
+  });
+  project.setScript("storybook", "npx projen storybook");
+  project.setScript("build-storybook", "npx projen build-storybook");
+  new SampleFile3(project, ".storybook/main.ts", {
+    contents: `import type { StorybookConfig } from '@storybook/react-vite';
+
+const config: StorybookConfig = {
+  stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|jsx|ts|tsx)'],
+  addons: [${withDocs ? `'@storybook/addon-docs'` : ""}],
+  framework: { name: '@storybook/react-vite', options: {} },
+};
+export default config;
+`
+  });
+  new SampleFile3(project, ".storybook/preview.ts", {
+    contents: `import '../src/index.css';
+const preview = { parameters: { controls: { expanded: true } } };
+export default preview;
+`
+  });
+}
+
+// src/projects/astro-project.ts
+import { SampleFile as SampleFile4 } from "projen";
 import { merge as merge3 } from "ts-deepmerge";
 
 // src/projects/monorepo-layout.ts
@@ -32741,6 +32821,7 @@ var LAYOUT_ROOT_BY_PROJECT_TYPE = {
   TypeScriptProject: MONOREPO_LAYOUT.PACKAGES,
   AwsCdkProject: MONOREPO_LAYOUT.APPS,
   AstroProject: MONOREPO_LAYOUT.SITES,
+  ReactViteSiteProject: MONOREPO_LAYOUT.SITES,
   StarlightProject: MONOREPO_LAYOUT.DOCS
 };
 function validateMonorepoLayout(root) {
@@ -32864,6 +32945,9 @@ function resolveAwsCdkProjectOutdir(packageName) {
 function resolveAstroProjectOutdir(packageName) {
   return resolveOutdirFromPackageName(packageName, MONOREPO_LAYOUT.SITES);
 }
+function resolveReactViteSiteProjectOutdir(packageName) {
+  return resolveOutdirFromPackageName(packageName, MONOREPO_LAYOUT.SITES);
+}
 
 // src/projects/typescript-project.ts
 import { typescript } from "projen";
@@ -34175,10 +34259,10 @@ var AstroProject = class extends TypeScriptProject {
       adapter: options.adapter
     });
     if (options.sampleCode === true) {
-      new SampleFile2(this, "src/pages/index.astro", {
+      new SampleFile4(this, "src/pages/index.astro", {
         contents: DEFAULT_INDEX_ASTRO
       });
-      new SampleFile2(this, "public/favicon.svg", {
+      new SampleFile4(this, "public/favicon.svg", {
         contents: DEFAULT_FAVICON_SVG
       });
     }
@@ -34883,8 +34967,305 @@ var AwsCdkProject = class extends awscdk.AwsCdkTypeScriptApp {
   }
 };
 
+// src/projects/react-vite-site-project.ts
+import { SampleFile as SampleFile5, TextFile as TextFile7 } from "projen";
+import { merge as merge5 } from "ts-deepmerge";
+var ReactViteSiteProject = class extends TypeScriptProject {
+  constructor(userOptions) {
+    const resolvedOutdir = userOptions.outdir ?? resolveReactViteSiteProjectOutdir(
+      userOptions.packageName ?? userOptions.name
+    );
+    const defaultOptions = {
+      testRunner: TestRunner.VITEST,
+      apiExtractor: false,
+      // ESLint inherited from TypeScriptProject lints `src` by default;
+      // skip projen's `.projenrc.ts` lint pass since downstream sites
+      // configure projen through their own root project.
+      eslintOptions: {
+        dirs: ["src"],
+        lintProjenRc: false
+      },
+      // VSCode workspace defaults (Prettier formatter, ESLint on save)
+      // need a project-level `.vscode/` folder. The inherited
+      // TypeScriptProject does not enable it on sub-projects by
+      // default; flip it on so the React-site VSCode wiring below
+      // actually renders.
+      vscode: true,
+      tsconfig: {
+        compilerOptions: {
+          declaration: false
+        }
+      }
+    };
+    const merged = merge5(
+      defaultOptions,
+      userOptions
+    );
+    const options = {
+      ...merged,
+      outdir: resolvedOutdir
+    };
+    super(options);
+    this.package.addField("type", "module");
+    new TextFile7(this, ".nvmrc", { lines: ["v24.11.0"] });
+    this.tsconfig?.file.addOverride("compilerOptions.target", "ES2020");
+    this.tsconfig?.file.addOverride("compilerOptions.lib", [
+      "ES2020",
+      "DOM",
+      "DOM.Iterable"
+    ]);
+    this.tsconfig?.file.addOverride("compilerOptions.module", "ESNext");
+    this.tsconfig?.file.addOverride(
+      "compilerOptions.moduleResolution",
+      "bundler"
+    );
+    this.tsconfig?.file.addOverride("compilerOptions.jsx", "react-jsxdev");
+    this.tsconfig?.file.addOverride("compilerOptions.noEmit", true);
+    this.tsconfig?.file.addOverride("compilerOptions.skipLibCheck", true);
+    this.tsconfig?.file.addOverride("compilerOptions.strict", true);
+    this.tsconfig?.file.addOverride("compilerOptions.resolveJsonModule", true);
+    this.tsconfig?.file.addOverride("compilerOptions.declaration", false);
+    this.tsconfig?.file.addOverride("compilerOptions.paths", {
+      "@/*": ["./src/*"]
+    });
+    this.tsconfig?.file.addOverride("include", ["src"]);
+    this.tsconfigDev?.file.addOverride("compilerOptions.types", [
+      "vitest/globals",
+      "vite/client"
+    ]);
+    this.tsconfigDev?.file.addOverride("include", [
+      "src",
+      "tests",
+      "**/*.test.ts",
+      "**/*.test.tsx",
+      "**/*.spec.ts",
+      "**/*.spec.tsx",
+      "vitest.config.ts"
+    ]);
+    this.tsconfigDev?.file.addOverride("exclude", [
+      "node_modules",
+      "dist",
+      "build",
+      ".turbo"
+    ]);
+    new SampleFile5(this, "vite.config.ts", {
+      contents: `import { defineConfig } from 'vite';
+import react from '@vitejs/plugin-react';
+import tailwindcss from '@tailwindcss/vite';
+import path from 'path';
+
+export default defineConfig({
+  plugins: [tailwindcss(), react()],
+  resolve: { alias: { '@': path.resolve(__dirname, 'src') } },
+});
+`
+    });
+    if (options.testRunner !== TestRunner.JEST) {
+      this.tryRemoveFile("vitest.config.ts");
+      new SampleFile5(this, "vitest.config.ts", {
+        contents: `import { defineConfig, mergeConfig } from 'vitest/config';
+import react from '@vitejs/plugin-react';
+import viteConfig from './vite.config';
+
+export default mergeConfig(
+  viteConfig,
+  defineConfig({
+    plugins: [react()],
+    test: {
+      environment: 'jsdom',
+      globals: true,
+      setupFiles: ['./src/setupTests.ts'],
+      passWithNoTests: true,
+    },
+  })
+);
+`
+      });
+    }
+    this.compileTask.reset();
+    this.compileTask.exec("vite build");
+    this.packageTask.reset();
+    this.tasks.tryFind("watch")?.reset("vite");
+    if (!this.tasks.tryFind("dev")) {
+      this.addTask("dev", {
+        description: "Start the Vite dev server",
+        exec: "vite",
+        receiveArgs: true
+      });
+    }
+    if (!this.tasks.tryFind("preview")) {
+      this.addTask("preview", {
+        description: "Preview the built site locally",
+        exec: "vite preview",
+        receiveArgs: true
+      });
+    }
+    this.addDeps("react", "react-dom", "react-router-dom");
+    this.addDevDeps(
+      "vite",
+      "@vitejs/plugin-react",
+      "@tailwindcss/vite",
+      "tailwindcss",
+      "jsdom",
+      "@testing-library/react",
+      "@testing-library/jest-dom",
+      "@testing-library/user-event",
+      "@types/react",
+      "@types/react-dom",
+      "eslint-plugin-react",
+      "eslint-plugin-react-hooks"
+    );
+    this.eslint?.addExtends("plugin:react/recommended");
+    this.eslint?.addExtends("plugin:react/jsx-runtime");
+    this.eslint?.addExtends("plugin:react-hooks/recommended");
+    this.eslint?.addOverride({
+      files: ["**/*.{tsx,jsx}"],
+      // Projen's ESLint override type does not include `settings`, but
+      // `settings` is a valid ESLint override key. Cast to `any` so the
+      // generated `.eslintrc.json` carries the React-version detection
+      // settings on the JSX glob.
+      settings: {
+        react: {
+          version: "detect"
+        }
+      }
+    });
+    this.eslint?.addRules({
+      // We use TypeScript; prop-types are unnecessary.
+      "react/prop-types": "off",
+      // New JSX transform — React no longer needs to be in scope.
+      "react/react-in-jsx-scope": "off"
+    });
+    this.eslint?.addOverride({
+      files: [
+        "**/*.{test,spec}.ts",
+        "**/*.{test,spec}.tsx",
+        "**/__tests__/**",
+        "src/setupTests.ts"
+      ],
+      rules: {
+        "import/no-extraneous-dependencies": [
+          "error",
+          { devDependencies: true }
+        ]
+      }
+    });
+    this.vscode?.settings.addSettings({
+      "editor.defaultFormatter": "esbenp.prettier-vscode",
+      "editor.formatOnSave": true,
+      // Prettier must format the whole file; "modifications" mode is
+      // known to mis-merge ranges with Prettier and can corrupt saves.
+      "editor.formatOnSaveMode": "file",
+      "prettier.requireConfig": true,
+      "eslint.useFlatConfig": false,
+      "eslint.workingDirectories": [{ directory: ".", changeProcessCWD: true }],
+      // Prettier is the default formatter; ESLint's fixAll must not
+      // re-apply prettier/prettier (would double-format).
+      "eslint.codeActionsOnSave.rules": ["!prettier/prettier", "*"],
+      "eslint.format.enable": false,
+      "[typescript]": {
+        "editor.codeActionsOnSave": {
+          "source.fixAll.eslint": "always",
+          "source.organizeImports": "always"
+        }
+      },
+      "[typescriptreact]": {
+        "editor.codeActionsOnSave": {
+          "source.fixAll.eslint": "always",
+          "source.organizeImports": "always"
+        }
+      },
+      "[javascript]": {
+        "editor.codeActionsOnSave": {
+          "source.fixAll.eslint": "always"
+        }
+      },
+      "[javascriptreact]": {
+        "editor.codeActionsOnSave": {
+          "source.fixAll.eslint": "always"
+        }
+      },
+      "eslint.validate": [
+        "javascript",
+        "javascriptreact",
+        "typescript",
+        "typescriptreact"
+      ]
+    });
+    this.vscode?.extensions.addRecommendations("dbaeumer.vscode-eslint");
+    this.vscode?.extensions.addRecommendations("esbenp.prettier-vscode");
+    const turbo = TurboRepo.of(this);
+    if (turbo?.compileTask) {
+      turbo.compileTask.inputs.push(
+        "public/**",
+        "index.html",
+        "vite.config.ts"
+      );
+    }
+    if (userOptions.sampleCode === true) {
+      const siteName = options.name;
+      new SampleFile5(this, "index.html", {
+        contents: `<!doctype html>
+<html>
+  <head>
+    <meta charset="utf-8"/>
+    <meta name="viewport" content="width=device-width, initial-scale=1"/>
+    <title>${siteName}</title>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="/src/main.tsx"></script>
+  </body>
+</html>
+`
+      });
+      new SampleFile5(this, "src/routes.tsx", {
+        contents: `import { createBrowserRouter } from 'react-router-dom';
+import App from './App';
+
+export const router = createBrowserRouter([
+  { path: '/', element: <App /> },
+]);
+`
+      });
+      new SampleFile5(this, "src/main.tsx", {
+        contents: `import React from 'react';
+import ReactDOM from 'react-dom/client';
+import { RouterProvider } from 'react-router-dom';
+import { router } from './routes';
+import './index.css';
+
+ReactDOM.createRoot(document.getElementById('root')!).render(
+  <React.StrictMode>
+    <RouterProvider router={router} />
+  </React.StrictMode>
+);
+`
+      });
+      new SampleFile5(this, "src/App.tsx", {
+        contents: `export default function App() {
+  return (
+    <main className="p-4">
+      <h1 className="text-2xl font-bold">Hello from ${siteName}</h1>
+    </main>
+  );
+}
+`
+      });
+      new SampleFile5(this, "src/index.css", {
+        contents: `@import "tailwindcss";
+`
+      });
+      new SampleFile5(this, "src/setupTests.ts", {
+        contents: `import '@testing-library/jest-dom';
+`
+      });
+    }
+  }
+};
+
 // src/projects/starlight-project.ts
-import { SampleFile as SampleFile3 } from "projen";
+import { SampleFile as SampleFile6 } from "projen";
 var STARLIGHT_ROLE = {
   DOCS: "docs",
   SITE: "site"
@@ -34926,10 +35307,10 @@ var StarlightProject = class extends AstroProject {
       turbo.compileTask.inputs.push("src/content/**");
     }
     if (userOptions.sampleContent === true) {
-      new SampleFile3(this, "src/content/docs/index.mdx", {
+      new SampleFile6(this, "src/content/docs/index.mdx", {
         contents: DEFAULT_INDEX_MDX
       });
-      new SampleFile3(this, "src/content.config.ts", {
+      new SampleFile6(this, "src/content.config.ts", {
         contents: DEFAULT_CONTENT_CONFIG_TS
       });
     }
@@ -35105,6 +35486,7 @@ export {
   REQUIREMENTS_WRITER_PATHS,
   ROOT_CI_TASK_NAME,
   ROOT_TURBO_TASK_NAME,
+  ReactViteSiteProject,
   ResetTask,
   SCHEDULED_TASK_MODEL_VALUES,
   SCOPE_CLASS_VALUES,
@@ -35131,6 +35513,8 @@ export {
   Vitest,
   addApproveMergeUpgradeWorkflow,
   addBuildCompleteJob,
+  addPlaywright,
+  addStorybook,
   addSyncLabelsWorkflow,
   agendaBundle,
   analyzeTsDocCoverage,
@@ -35258,6 +35642,7 @@ export {
   resolveOutdirFromPackageName,
   resolveOverrideForLabels,
   resolveProgressFiles,
+  resolveReactViteSiteProjectOutdir,
   resolveRunRatio,
   resolveScheduledTasks,
   resolveScopeGate,