diff --git a/e2e-tests/dyad_tags_parsing.spec.ts b/e2e-tests/dyad_tags_parsing.spec.ts index 1936149..8924008 100644 --- a/e2e-tests/dyad_tags_parsing.spec.ts +++ b/e2e-tests/dyad_tags_parsing.spec.ts @@ -4,5 +4,5 @@ testSkipIfWindows("dyad tags handles nested < tags", async ({ po }) => { await po.setUp({ autoApprove: true }); await po.importApp("minimal"); await po.sendPrompt("tc=dyad-write-angle"); - await po.snapshotAppFiles(); + await po.snapshotAppFiles({ name: "angle-tags-handled" }); }); diff --git a/e2e-tests/helpers/test_helper.ts b/e2e-tests/helpers/test_helper.ts index 55719e7..cc87c6d 100644 --- a/e2e-tests/helpers/test_helper.ts +++ b/e2e-tests/helpers/test_helper.ts @@ -285,7 +285,7 @@ export class PageObject { await expect(this.page.getByRole("dialog")).toMatchAriaSnapshot(); } - async snapshotAppFiles({ name }: { name?: string } = {}) { + async snapshotAppFiles({ name }: { name: string }) { const currentAppName = await this.getCurrentAppName(); if (!currentAppName) { throw new Error("No app selected"); diff --git a/e2e-tests/partial_response.spec.ts b/e2e-tests/partial_response.spec.ts index cd10860..09c5081 100644 --- a/e2e-tests/partial_response.spec.ts +++ b/e2e-tests/partial_response.spec.ts @@ -8,5 +8,5 @@ test("partial message is resumed", async ({ po }) => { // This is a special test case which triggers a dump. await po.snapshotServerDump("all-messages"); await po.snapshotMessages({ replaceDumpPath: true }); - await po.snapshotAppFiles(); + await po.snapshotAppFiles({ name: "message-resumed" }); }); diff --git a/e2e-tests/select_component.spec.ts b/e2e-tests/select_component.spec.ts index d87d902..be45c27 100644 --- a/e2e-tests/select_component.spec.ts +++ b/e2e-tests/select_component.spec.ts @@ -61,7 +61,7 @@ testSkipIfWindows("upgrade app to select component", async ({ po }) => { await po.expectAppUpgradeButtonIsNotVisible({ upgradeId: "component-tagger", }); - await po.snapshotAppFiles(); + await po.snapshotAppFiles({ name: "app-upgraded" }); await po.clickOpenInChatButton(); // There should be another version from the upgrade being committed. await expect(po.page.getByText("Version 2")).toBeVisible(); diff --git a/e2e-tests/snapshots/dyad_tags_parsing.spec.ts_dyad-tags-handles-nested-tags-1.txt b/e2e-tests/snapshots/dyad_tags_parsing.spec.ts_angle-tags-handled.txt similarity index 100% rename from e2e-tests/snapshots/dyad_tags_parsing.spec.ts_dyad-tags-handles-nested-tags-1.txt rename to e2e-tests/snapshots/dyad_tags_parsing.spec.ts_angle-tags-handled.txt diff --git a/e2e-tests/snapshots/partial_response.spec.ts_partial-message-is-resumed-2.txt b/e2e-tests/snapshots/partial_response.spec.ts_message-resumed.txt similarity index 100% rename from e2e-tests/snapshots/partial_response.spec.ts_partial-message-is-resumed-2.txt rename to e2e-tests/snapshots/partial_response.spec.ts_message-resumed.txt diff --git a/e2e-tests/snapshots/select_component.spec.ts_app-upgraded.txt b/e2e-tests/snapshots/select_component.spec.ts_app-upgraded.txt new file mode 100644 index 0000000..142366b --- /dev/null +++ b/e2e-tests/snapshots/select_component.spec.ts_app-upgraded.txt @@ -0,0 +1,494 @@ +=== .gitignore === +# Logs +logs +*.log +npm-debug.log* +yarn-debug.log* +yarn-error.log* +pnpm-debug.log* +lerna-debug.log* + +node_modules +dist +dist-ssr +*.local + +# Editor directories and files +.vscode/* +!.vscode/extensions.json +.idea +.DS_Store +*.suo +*.ntvs* +*.njsproj +*.sln +*.sw? + + +=== AI_RULES.md === +# AI RULES placeholder + + +=== components.json === +{ + "$schema": "https://ui.shadcn.com/schema.json", + "style": "new-york", + "rsc": false, + "tsx": true, + "tailwind": { + "config": "", + "css": "src/styles/globals.css", + "baseColor": "neutral", + "cssVariables": true, + "prefix": "" + }, + "aliases": { + "components": "@/components", + "utils": "@/lib/utils", + "ui": "@/components/ui", + "lib": "@/lib", + "hooks": "@/hooks" + }, + "iconLibrary": "lucide" +} + + +=== index.html === + + + + + + dyad-generated-app + + + +
+ + + + + +=== package.json === +{ + "name": "vite_react_shadcn_ts", + "private": true, + "version": "0.0.0", + "type": "module", + "scripts": { + "dev": "vite", + "build": "vite build", + "build:dev": "vite build --mode development", + "lint": "eslint .", + "preview": "vite preview" + }, + "dependencies": { + "@radix-ui/react-slot": "^1.2.3", + "@tailwindcss/vite": "^4.1.8", + "class-variance-authority": "^0.7.1", + "clsx": "^2.1.1", + "lucide-react": "^0.514.0", + "react": "^18.3.1", + "react-dom": "^18.3.1", + "react-router-dom": "^6.26.2", + "tailwind-merge": "^3.3.1", + "tailwindcss": "^4.1.8" + }, + "devDependencies": { + "@dyad-sh/react-vite-component-tagger": "^0.8.0", + "@types/node": "^22.5.5", + "@types/react": "^18.3.3", + "@types/react-dom": "^18.3.0", + "@vitejs/plugin-react-swc": "^3.9.0", + "tw-animate-css": "^1.3.4", + "typescript": "^5.5.3", + "vite": "^6.3.4" + }, + "packageManager": "" +} + +=== src/App.tsx === +import { BrowserRouter, Routes, Route } from "react-router-dom"; +import Index from "./pages/Index"; + +const App = () => ( + + + } /> + + +); + +export default App; + + +=== src/components/ui/button.tsx === +import * as React from "react"; +import { Slot } from "@radix-ui/react-slot"; +import { cva, type VariantProps } from "class-variance-authority"; + +import { cn } from "@/lib/utils"; + +const buttonVariants = cva( + "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive", + { + variants: { + variant: { + default: + "bg-primary text-primary-foreground shadow-xs hover:bg-primary/90", + destructive: + "bg-destructive text-white shadow-xs hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60", + outline: + "border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50", + secondary: + "bg-secondary text-secondary-foreground shadow-xs hover:bg-secondary/80", + ghost: + "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50", + link: "text-primary underline-offset-4 hover:underline", + }, + size: { + default: "h-9 px-4 py-2 has-[>svg]:px-3", + sm: "h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5", + lg: "h-10 rounded-md px-6 has-[>svg]:px-4", + icon: "size-9", + }, + }, + defaultVariants: { + variant: "default", + size: "default", + }, + }, +); + +function Button({ + className, + variant, + size, + asChild = false, + ...props +}: React.ComponentProps<"button"> & + VariantProps & { + asChild?: boolean; + }) { + const Comp = asChild ? Slot : "button"; + + return ( + + ); +} + +export { Button, buttonVariants }; + + +=== src/lib/utils.ts === +import { clsx, type ClassValue } from "clsx"; +import { twMerge } from "tailwind-merge"; + +export function cn(...inputs: ClassValue[]) { + return twMerge(clsx(inputs)); +} + + +=== src/main.tsx === +import { createRoot } from "react-dom/client"; +import App from "./App.tsx"; +import "./styles/globals.css"; + +createRoot(document.getElementById("root")!).render(); + + +=== src/pages/Index.tsx === +import { Button } from "@/components/ui/button"; +import { Rocket, ShieldCheck, Sparkles } from "lucide-react"; + +const features = [ + { + icon: , + title: "Fast & Modern", + description: "Built with the latest tech for blazing fast performance.", + }, + { + icon: , + title: "Secure by Design", + description: "Security best practices baked in from the start.", + }, + { + icon: , + title: "Easy to Customize", + description: "Effortlessly adapt the template to your needs.", + }, +]; + +const Index = () => { + return ( +
+ {/* Hero Section */} +
+

+ Launch Your Next Project +

+

+ A simple, modern landing page template built with React, shadcn/ui, + and Tailwind CSS. +

+ +
+ + {/* Features Section */} +
+
+
+ {features.map((feature, idx) => ( +
+ {feature.icon} +

+ {feature.title} +

+

{feature.description}

+
+ ))} +
+
+
+
+ ); +}; + +export default Index; + + +=== src/styles/globals.css === +@import "tailwindcss"; +@import "tw-animate-css"; + +@custom-variant dark (&:is(.dark *)); + +@theme inline { + --radius-sm: calc(var(--radius) - 4px); + --radius-md: calc(var(--radius) - 2px); + --radius-lg: var(--radius); + --radius-xl: calc(var(--radius) + 4px); + --color-background: var(--background); + --color-foreground: var(--foreground); + --color-card: var(--card); + --color-card-foreground: var(--card-foreground); + --color-popover: var(--popover); + --color-popover-foreground: var(--popover-foreground); + --color-primary: var(--primary); + --color-primary-foreground: var(--primary-foreground); + --color-secondary: var(--secondary); + --color-secondary-foreground: var(--secondary-foreground); + --color-muted: var(--muted); + --color-muted-foreground: var(--muted-foreground); + --color-accent: var(--accent); + --color-accent-foreground: var(--accent-foreground); + --color-destructive: var(--destructive); + --color-border: var(--border); + --color-input: var(--input); + --color-ring: var(--ring); + --color-chart-1: var(--chart-1); + --color-chart-2: var(--chart-2); + --color-chart-3: var(--chart-3); + --color-chart-4: var(--chart-4); + --color-chart-5: var(--chart-5); + --color-sidebar: var(--sidebar); + --color-sidebar-foreground: var(--sidebar-foreground); + --color-sidebar-primary: var(--sidebar-primary); + --color-sidebar-primary-foreground: var(--sidebar-primary-foreground); + --color-sidebar-accent: var(--sidebar-accent); + --color-sidebar-accent-foreground: var(--sidebar-accent-foreground); + --color-sidebar-border: var(--sidebar-border); + --color-sidebar-ring: var(--sidebar-ring); +} + +:root { + --radius: 0.625rem; + --background: oklch(1 0 0); + --foreground: oklch(0.145 0 0); + --card: oklch(1 0 0); + --card-foreground: oklch(0.145 0 0); + --popover: oklch(1 0 0); + --popover-foreground: oklch(0.145 0 0); + --primary: oklch(0.205 0 0); + --primary-foreground: oklch(0.985 0 0); + --secondary: oklch(0.97 0 0); + --secondary-foreground: oklch(0.205 0 0); + --muted: oklch(0.97 0 0); + --muted-foreground: oklch(0.556 0 0); + --accent: oklch(0.97 0 0); + --accent-foreground: oklch(0.205 0 0); + --destructive: oklch(0.577 0.245 27.325); + --border: oklch(0.922 0 0); + --input: oklch(0.922 0 0); + --ring: oklch(0.708 0 0); + --chart-1: oklch(0.646 0.222 41.116); + --chart-2: oklch(0.6 0.118 184.704); + --chart-3: oklch(0.398 0.07 227.392); + --chart-4: oklch(0.828 0.189 84.429); + --chart-5: oklch(0.769 0.188 70.08); + --sidebar: oklch(0.985 0 0); + --sidebar-foreground: oklch(0.145 0 0); + --sidebar-primary: oklch(0.205 0 0); + --sidebar-primary-foreground: oklch(0.985 0 0); + --sidebar-accent: oklch(0.97 0 0); + --sidebar-accent-foreground: oklch(0.205 0 0); + --sidebar-border: oklch(0.922 0 0); + --sidebar-ring: oklch(0.708 0 0); +} + +.dark { + --background: oklch(0.145 0 0); + --foreground: oklch(0.985 0 0); + --card: oklch(0.205 0 0); + --card-foreground: oklch(0.985 0 0); + --popover: oklch(0.205 0 0); + --popover-foreground: oklch(0.985 0 0); + --primary: oklch(0.922 0 0); + --primary-foreground: oklch(0.205 0 0); + --secondary: oklch(0.269 0 0); + --secondary-foreground: oklch(0.985 0 0); + --muted: oklch(0.269 0 0); + --muted-foreground: oklch(0.708 0 0); + --accent: oklch(0.269 0 0); + --accent-foreground: oklch(0.985 0 0); + --destructive: oklch(0.704 0.191 22.216); + --border: oklch(1 0 0 / 10%); + --input: oklch(1 0 0 / 15%); + --ring: oklch(0.556 0 0); + --chart-1: oklch(0.488 0.243 264.376); + --chart-2: oklch(0.696 0.17 162.48); + --chart-3: oklch(0.769 0.188 70.08); + --chart-4: oklch(0.627 0.265 303.9); + --chart-5: oklch(0.645 0.246 16.439); + --sidebar: oklch(0.205 0 0); + --sidebar-foreground: oklch(0.985 0 0); + --sidebar-primary: oklch(0.488 0.243 264.376); + --sidebar-primary-foreground: oklch(0.985 0 0); + --sidebar-accent: oklch(0.269 0 0); + --sidebar-accent-foreground: oklch(0.985 0 0); + --sidebar-border: oklch(1 0 0 / 10%); + --sidebar-ring: oklch(0.556 0 0); +} + +@layer base { + * { + @apply border-border outline-ring/50; + } + body { + @apply bg-background text-foreground; + } +} + + +=== src/vite-env.d.ts === +/// + + +=== tsconfig.app.json === +{ + "compilerOptions": { + "target": "ES2020", + "useDefineForClassFields": true, + "lib": ["ES2020", "DOM", "DOM.Iterable"], + "module": "ESNext", + "skipLibCheck": true, + + /* Bundler mode */ + "moduleResolution": "bundler", + "allowImportingTsExtensions": true, + "isolatedModules": true, + "moduleDetection": "force", + "noEmit": true, + "jsx": "react-jsx", + + /* Linting */ + "strict": false, + "noUnusedLocals": false, + "noUnusedParameters": false, + "noImplicitAny": false, + "noFallthroughCasesInSwitch": false, + + "baseUrl": ".", + "paths": { + "@/*": ["./src/*"] + } + }, + "include": ["src"] +} + + +=== tsconfig.json === +{ + "files": [], + "references": [ + { "path": "./tsconfig.app.json" }, + { "path": "./tsconfig.node.json" } + ], + "compilerOptions": { + "baseUrl": ".", + "paths": { + "@/*": ["./src/*"] + }, + "noImplicitAny": false, + "noUnusedParameters": false, + "skipLibCheck": true, + "allowJs": true, + "noUnusedLocals": false, + "strictNullChecks": false + } +} + + +=== tsconfig.node.json === +{ + "compilerOptions": { + "target": "ES2022", + "lib": ["ES2023"], + "module": "ESNext", + "skipLibCheck": true, + + /* Bundler mode */ + "moduleResolution": "bundler", + "allowImportingTsExtensions": true, + "isolatedModules": true, + "moduleDetection": "force", + "noEmit": true, + + /* Linting */ + "strict": true, + "noUnusedLocals": false, + "noUnusedParameters": false, + "noFallthroughCasesInSwitch": true + }, + "include": ["vite.config.ts"] +} + + +=== vite.config.ts === +import { defineConfig } from "vite"; +import tailwindcss from "@tailwindcss/vite"; +import react from "@vitejs/plugin-react-swc"; +import path from "path"; +import dyadComponentTagger from '@dyad-sh/react-vite-component-tagger'; + +export default defineConfig(() => ({ + server: { + host: "::", + port: 8080, + }, + plugins: [dyadComponentTagger(), react(), tailwindcss()], + resolve: { + alias: { + "@": path.resolve(__dirname, "./src"), + }, + }, +})); diff --git a/e2e-tests/snapshots/select_component.spec.ts_upgrade-app-to-select-component-1.txt b/e2e-tests/snapshots/select_component.spec.ts_upgrade-app-to-select-component-1.txt index 142366b..640213e 100644 --- a/e2e-tests/snapshots/select_component.spec.ts_upgrade-app-to-select-component-1.txt +++ b/e2e-tests/snapshots/select_component.spec.ts_upgrade-app-to-select-component-1.txt @@ -1,494 +1,14 @@ -=== .gitignore === -# Logs -logs -*.log -npm-debug.log* -yarn-debug.log* -yarn-error.log* -pnpm-debug.log* -lerna-debug.log* +=== +role: user +message: [dump] make it smaller -node_modules -dist -dist-ssr -*.local +Selected component: h1 (file: src/pages/Index.tsx) -# Editor directories and files -.vscode/* -!.vscode/extensions.json -.idea -.DS_Store -*.suo -*.ntvs* -*.njsproj -*.sln -*.sw? - - -=== AI_RULES.md === -# AI RULES placeholder - - -=== components.json === -{ - "$schema": "https://ui.shadcn.com/schema.json", - "style": "new-york", - "rsc": false, - "tsx": true, - "tailwind": { - "config": "", - "css": "src/styles/globals.css", - "baseColor": "neutral", - "cssVariables": true, - "prefix": "" - }, - "aliases": { - "components": "@/components", - "utils": "@/lib/utils", - "ui": "@/components/ui", - "lib": "@/lib", - "hooks": "@/hooks" - }, - "iconLibrary": "lucide" -} - - -=== index.html === - - - - - - dyad-generated-app - - - -
- - - - - -=== package.json === -{ - "name": "vite_react_shadcn_ts", - "private": true, - "version": "0.0.0", - "type": "module", - "scripts": { - "dev": "vite", - "build": "vite build", - "build:dev": "vite build --mode development", - "lint": "eslint .", - "preview": "vite preview" - }, - "dependencies": { - "@radix-ui/react-slot": "^1.2.3", - "@tailwindcss/vite": "^4.1.8", - "class-variance-authority": "^0.7.1", - "clsx": "^2.1.1", - "lucide-react": "^0.514.0", - "react": "^18.3.1", - "react-dom": "^18.3.1", - "react-router-dom": "^6.26.2", - "tailwind-merge": "^3.3.1", - "tailwindcss": "^4.1.8" - }, - "devDependencies": { - "@dyad-sh/react-vite-component-tagger": "^0.8.0", - "@types/node": "^22.5.5", - "@types/react": "^18.3.3", - "@types/react-dom": "^18.3.0", - "@vitejs/plugin-react-swc": "^3.9.0", - "tw-animate-css": "^1.3.4", - "typescript": "^5.5.3", - "vite": "^6.3.4" - }, - "packageManager": "" -} - -=== src/App.tsx === -import { BrowserRouter, Routes, Route } from "react-router-dom"; -import Index from "./pages/Index"; - -const App = () => ( - - - } /> - - -); - -export default App; - - -=== src/components/ui/button.tsx === -import * as React from "react"; -import { Slot } from "@radix-ui/react-slot"; -import { cva, type VariantProps } from "class-variance-authority"; - -import { cn } from "@/lib/utils"; - -const buttonVariants = cva( - "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive", - { - variants: { - variant: { - default: - "bg-primary text-primary-foreground shadow-xs hover:bg-primary/90", - destructive: - "bg-destructive text-white shadow-xs hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60", - outline: - "border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50", - secondary: - "bg-secondary text-secondary-foreground shadow-xs hover:bg-secondary/80", - ghost: - "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50", - link: "text-primary underline-offset-4 hover:underline", - }, - size: { - default: "h-9 px-4 py-2 has-[>svg]:px-3", - sm: "h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5", - lg: "h-10 rounded-md px-6 has-[>svg]:px-4", - icon: "size-9", - }, - }, - defaultVariants: { - variant: "default", - size: "default", - }, - }, -); - -function Button({ - className, - variant, - size, - asChild = false, - ...props -}: React.ComponentProps<"button"> & - VariantProps & { - asChild?: boolean; - }) { - const Comp = asChild ? Slot : "button"; - - return ( - - ); -} - -export { Button, buttonVariants }; - - -=== src/lib/utils.ts === -import { clsx, type ClassValue } from "clsx"; -import { twMerge } from "tailwind-merge"; - -export function cn(...inputs: ClassValue[]) { - return twMerge(clsx(inputs)); -} - - -=== src/main.tsx === -import { createRoot } from "react-dom/client"; -import App from "./App.tsx"; -import "./styles/globals.css"; - -createRoot(document.getElementById("root")!).render(); - - -=== src/pages/Index.tsx === -import { Button } from "@/components/ui/button"; -import { Rocket, ShieldCheck, Sparkles } from "lucide-react"; - -const features = [ - { - icon: , - title: "Fast & Modern", - description: "Built with the latest tech for blazing fast performance.", - }, - { - icon: , - title: "Secure by Design", - description: "Security best practices baked in from the start.", - }, - { - icon: , - title: "Easy to Customize", - description: "Effortlessly adapt the template to your needs.", - }, -]; - -const Index = () => { - return ( -
- {/* Hero Section */} +Snippet: +```
-

+

// <-- EDIT HERE Launch Your Next Project

- A simple, modern landing page template built with React, shadcn/ui, - and Tailwind CSS. -

- -
- - {/* Features Section */} -
-
-
- {features.map((feature, idx) => ( -
- {feature.icon} -

- {feature.title} -

-

{feature.description}

-
- ))} -
-
-
-
- ); -}; - -export default Index; - - -=== src/styles/globals.css === -@import "tailwindcss"; -@import "tw-animate-css"; - -@custom-variant dark (&:is(.dark *)); - -@theme inline { - --radius-sm: calc(var(--radius) - 4px); - --radius-md: calc(var(--radius) - 2px); - --radius-lg: var(--radius); - --radius-xl: calc(var(--radius) + 4px); - --color-background: var(--background); - --color-foreground: var(--foreground); - --color-card: var(--card); - --color-card-foreground: var(--card-foreground); - --color-popover: var(--popover); - --color-popover-foreground: var(--popover-foreground); - --color-primary: var(--primary); - --color-primary-foreground: var(--primary-foreground); - --color-secondary: var(--secondary); - --color-secondary-foreground: var(--secondary-foreground); - --color-muted: var(--muted); - --color-muted-foreground: var(--muted-foreground); - --color-accent: var(--accent); - --color-accent-foreground: var(--accent-foreground); - --color-destructive: var(--destructive); - --color-border: var(--border); - --color-input: var(--input); - --color-ring: var(--ring); - --color-chart-1: var(--chart-1); - --color-chart-2: var(--chart-2); - --color-chart-3: var(--chart-3); - --color-chart-4: var(--chart-4); - --color-chart-5: var(--chart-5); - --color-sidebar: var(--sidebar); - --color-sidebar-foreground: var(--sidebar-foreground); - --color-sidebar-primary: var(--sidebar-primary); - --color-sidebar-primary-foreground: var(--sidebar-primary-foreground); - --color-sidebar-accent: var(--sidebar-accent); - --color-sidebar-accent-foreground: var(--sidebar-accent-foreground); - --color-sidebar-border: var(--sidebar-border); - --color-sidebar-ring: var(--sidebar-ring); -} - -:root { - --radius: 0.625rem; - --background: oklch(1 0 0); - --foreground: oklch(0.145 0 0); - --card: oklch(1 0 0); - --card-foreground: oklch(0.145 0 0); - --popover: oklch(1 0 0); - --popover-foreground: oklch(0.145 0 0); - --primary: oklch(0.205 0 0); - --primary-foreground: oklch(0.985 0 0); - --secondary: oklch(0.97 0 0); - --secondary-foreground: oklch(0.205 0 0); - --muted: oklch(0.97 0 0); - --muted-foreground: oklch(0.556 0 0); - --accent: oklch(0.97 0 0); - --accent-foreground: oklch(0.205 0 0); - --destructive: oklch(0.577 0.245 27.325); - --border: oklch(0.922 0 0); - --input: oklch(0.922 0 0); - --ring: oklch(0.708 0 0); - --chart-1: oklch(0.646 0.222 41.116); - --chart-2: oklch(0.6 0.118 184.704); - --chart-3: oklch(0.398 0.07 227.392); - --chart-4: oklch(0.828 0.189 84.429); - --chart-5: oklch(0.769 0.188 70.08); - --sidebar: oklch(0.985 0 0); - --sidebar-foreground: oklch(0.145 0 0); - --sidebar-primary: oklch(0.205 0 0); - --sidebar-primary-foreground: oklch(0.985 0 0); - --sidebar-accent: oklch(0.97 0 0); - --sidebar-accent-foreground: oklch(0.205 0 0); - --sidebar-border: oklch(0.922 0 0); - --sidebar-ring: oklch(0.708 0 0); -} - -.dark { - --background: oklch(0.145 0 0); - --foreground: oklch(0.985 0 0); - --card: oklch(0.205 0 0); - --card-foreground: oklch(0.985 0 0); - --popover: oklch(0.205 0 0); - --popover-foreground: oklch(0.985 0 0); - --primary: oklch(0.922 0 0); - --primary-foreground: oklch(0.205 0 0); - --secondary: oklch(0.269 0 0); - --secondary-foreground: oklch(0.985 0 0); - --muted: oklch(0.269 0 0); - --muted-foreground: oklch(0.708 0 0); - --accent: oklch(0.269 0 0); - --accent-foreground: oklch(0.985 0 0); - --destructive: oklch(0.704 0.191 22.216); - --border: oklch(1 0 0 / 10%); - --input: oklch(1 0 0 / 15%); - --ring: oklch(0.556 0 0); - --chart-1: oklch(0.488 0.243 264.376); - --chart-2: oklch(0.696 0.17 162.48); - --chart-3: oklch(0.769 0.188 70.08); - --chart-4: oklch(0.627 0.265 303.9); - --chart-5: oklch(0.645 0.246 16.439); - --sidebar: oklch(0.205 0 0); - --sidebar-foreground: oklch(0.985 0 0); - --sidebar-primary: oklch(0.488 0.243 264.376); - --sidebar-primary-foreground: oklch(0.985 0 0); - --sidebar-accent: oklch(0.269 0 0); - --sidebar-accent-foreground: oklch(0.985 0 0); - --sidebar-border: oklch(1 0 0 / 10%); - --sidebar-ring: oklch(0.556 0 0); -} - -@layer base { - * { - @apply border-border outline-ring/50; - } - body { - @apply bg-background text-foreground; - } -} - - -=== src/vite-env.d.ts === -/// - - -=== tsconfig.app.json === -{ - "compilerOptions": { - "target": "ES2020", - "useDefineForClassFields": true, - "lib": ["ES2020", "DOM", "DOM.Iterable"], - "module": "ESNext", - "skipLibCheck": true, - - /* Bundler mode */ - "moduleResolution": "bundler", - "allowImportingTsExtensions": true, - "isolatedModules": true, - "moduleDetection": "force", - "noEmit": true, - "jsx": "react-jsx", - - /* Linting */ - "strict": false, - "noUnusedLocals": false, - "noUnusedParameters": false, - "noImplicitAny": false, - "noFallthroughCasesInSwitch": false, - - "baseUrl": ".", - "paths": { - "@/*": ["./src/*"] - } - }, - "include": ["src"] -} - - -=== tsconfig.json === -{ - "files": [], - "references": [ - { "path": "./tsconfig.app.json" }, - { "path": "./tsconfig.node.json" } - ], - "compilerOptions": { - "baseUrl": ".", - "paths": { - "@/*": ["./src/*"] - }, - "noImplicitAny": false, - "noUnusedParameters": false, - "skipLibCheck": true, - "allowJs": true, - "noUnusedLocals": false, - "strictNullChecks": false - } -} - - -=== tsconfig.node.json === -{ - "compilerOptions": { - "target": "ES2022", - "lib": ["ES2023"], - "module": "ESNext", - "skipLibCheck": true, - - /* Bundler mode */ - "moduleResolution": "bundler", - "allowImportingTsExtensions": true, - "isolatedModules": true, - "moduleDetection": "force", - "noEmit": true, - - /* Linting */ - "strict": true, - "noUnusedLocals": false, - "noUnusedParameters": false, - "noFallthroughCasesInSwitch": true - }, - "include": ["vite.config.ts"] -} - - -=== vite.config.ts === -import { defineConfig } from "vite"; -import tailwindcss from "@tailwindcss/vite"; -import react from "@vitejs/plugin-react-swc"; -import path from "path"; -import dyadComponentTagger from '@dyad-sh/react-vite-component-tagger'; - -export default defineConfig(() => ({ - server: { - host: "::", - port: 8080, - }, - plugins: [dyadComponentTagger(), react(), tailwindcss()], - resolve: { - alias: { - "@": path.resolve(__dirname, "./src"), - }, - }, -})); +``` \ No newline at end of file diff --git a/e2e-tests/snapshots/select_component.spec.ts_upgrade-app-to-select-component-2.txt b/e2e-tests/snapshots/select_component.spec.ts_upgrade-app-to-select-component-2.txt deleted file mode 100644 index 640213e..0000000 --- a/e2e-tests/snapshots/select_component.spec.ts_upgrade-app-to-select-component-2.txt +++ /dev/null @@ -1,14 +0,0 @@ -=== -role: user -message: [dump] make it smaller - -Selected component: h1 (file: src/pages/Index.tsx) - -Snippet: -``` -
-

// <-- EDIT HERE - Launch Your Next Project -

-

-``` \ No newline at end of file diff --git a/e2e-tests/snapshots/supabase_client.spec.ts_supabase-client-is-generated-1.txt b/e2e-tests/snapshots/supabase_client.spec.ts_supabase-client-generated.txt similarity index 100% rename from e2e-tests/snapshots/supabase_client.spec.ts_supabase-client-is-generated-1.txt rename to e2e-tests/snapshots/supabase_client.spec.ts_supabase-client-generated.txt diff --git a/e2e-tests/supabase_client.spec.ts b/e2e-tests/supabase_client.spec.ts index 9509d6f..3e8013a 100644 --- a/e2e-tests/supabase_client.spec.ts +++ b/e2e-tests/supabase_client.spec.ts @@ -11,5 +11,5 @@ testSkipIfWindows("supabase client is generated", async ({ po }) => { await po.clickBackButton(); await po.sendPrompt("tc=generate-supabase-client"); - await po.snapshotAppFiles(); + await po.snapshotAppFiles({ name: "supabase-client-generated" }); });