Add project files

This commit is contained in:
Kunthawat Greethong
2025-12-05 09:26:53 +07:00
parent 3b43cb52ef
commit 11986a0196
814 changed files with 141076 additions and 1 deletions

View File

@@ -0,0 +1,9 @@
- paragraph: tc=write-index
- paragraph: OK, I'm going to do some writing now...
- img
- text: Index.tsx
- img
- text: "src/pages/Index.tsx Summary: write-description"
- paragraph: And it's done!
- button "Retry":
- img

View File

@@ -0,0 +1,13 @@
- paragraph: tc=write-index
- paragraph: OK, I'm going to do some writing now...
- img
- text: Index.tsx
- img
- text: "src/pages/Index.tsx Summary: write-description"
- paragraph: And it's done!
- img
- text: Approved
- button "Undo":
- img
- button "Retry":
- img

View File

@@ -0,0 +1,4 @@
- region "Notifications (F8)":
- list
- region "Notifications alt+T"
- text: Testing:write-index!

View File

@@ -0,0 +1,230 @@
===
role: system
message:
${BUILD_SYSTEM_PREFIX}
# Tech Stack
- You are building a React application.
- Use TypeScript.
- Use React Router. KEEP the routes in src/App.tsx
- Always put source code in the src folder.
- Put pages into src/pages/
- Put components into src/components/
- The main page (default page) is src/pages/Index.tsx
- UPDATE the main page to include the new components. OTHERWISE, the user can NOT see any components!
- ALWAYS try to use the shadcn/ui library.
- Tailwind CSS: always use Tailwind CSS for styling components. Utilize Tailwind classes extensively for layout, spacing, colors, and other design aspects.
Available packages and libraries:
- The lucide-react package is installed for icons.
- You ALREADY have ALL the shadcn/ui components and their dependencies installed. So you don't need to install them again.
- You have ALL the necessary Radix UI components installed.
- Use prebuilt components from the shadcn/ui library after importing them. Note that these files shouldn't be edited, so make new components if you need to change them.
${BUILD_SYSTEM_POSTFIX}
If the user wants to use supabase or do something that requires auth, database or server-side functions (e.g. loading API keys, secrets),
tell them that they need to add supabase to their app.
The following response will show a button that allows the user to add supabase to their app.
<dyad-add-integration provider="supabase"></dyad-add-integration>
# Examples
## Example 1: User wants to use Supabase
### User prompt
I want to use supabase in my app.
### Assistant response
You need to first add Supabase to your app.
<dyad-add-integration provider="supabase"></dyad-add-integration>
## Example 2: User wants to add auth to their app
### User prompt
I want to add auth to my app.
### Assistant response
You need to first add Supabase to your app and then we can add auth.
<dyad-add-integration provider="supabase"></dyad-add-integration>
===
role: user
message: This is my codebase. <dyad-file path=".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?
</dyad-file>
<dyad-file path="file1.txt">
// File contents excluded from context
</dyad-file>
<dyad-file path="index.html">
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>dyad-generated-app</title>
</head>
<body>
<div id="root"></div>
<script type="module" src="/src/main.tsx"></script>
</body>
</html>
</dyad-file>
<dyad-file path="src/App.tsx">
const App = () => <div>Minimal imported app</div>;
export default App;
</dyad-file>
<dyad-file path="src/foo.astro">
---
// Component script (runs at build time)
const greeting = "Hello World";
const currentTime = new Date().toLocaleString();
---
<div class="hello-world">
<h1>{greeting}</h1>
<p>Welcome to Astro!</p>
<p class="timestamp">Generated at: {currentTime}</p>
</div>
<style>
.hello-world {
padding: 2rem;
text-align: center;
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
color: white;
border-radius: 8px;
max-width: 500px;
margin: 2rem auto;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}
h1 {
font-size: 2.5rem;
margin-bottom: 1rem;
font-weight: bold;
}
p {
font-size: 1.1rem;
margin-bottom: 0.5rem;
}
.timestamp {
font-size: 0.9rem;
opacity: 0.8;
font-style: italic;
}
</style>
</dyad-file>
<dyad-file path="src/main.tsx">
import { createRoot } from "react-dom/client";
import App from "./App.tsx";
createRoot(document.getElementById("root")!).render(<App />);
</dyad-file>
<dyad-file path="src/vite-env.d.ts">
/// <reference types="vite/client" />
</dyad-file>
<dyad-file path="tsconfig.app.json">
// File contents excluded from context
</dyad-file>
<dyad-file path="tsconfig.json">
// File contents excluded from context
</dyad-file>
<dyad-file path="tsconfig.node.json">
// File contents excluded from context
</dyad-file>
<dyad-file path="vite.config.ts">
import { defineConfig } from "vite";
import react from "@vitejs/plugin-react-swc";
import path from "path";
export default defineConfig(() => ({
server: {
host: "::",
port: 8080,
},
plugins: [react()],
resolve: {
alias: {
"@": path.resolve(__dirname, "./src"),
},
},
}));
</dyad-file>
===
role: assistant
message: OK, got it. I'm ready to help
===
role: user
message: Generate an AI_RULES.md file for this app. Describe the tech stack in 5-10 bullet points and describe clear rules about what libraries to use for what.
===
role: assistant
message: <dyad-write path="file1.txt">
A file (2)
</dyad-write>
More
EOM
===
role: user
message: [dump] hi

View File

@@ -0,0 +1,3 @@
===
role: user
message: [{"type":"text","text":"[dump]\n\nAttachments:\n- logo.png (image/png)"},{"type":"image_url","image_url":{"url":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAhGVYSWZNTQAqAAAACAAFARIAAwAAAAEAAQAAARoABQAAAAEAAABKARsABQAAAAEAAABSASgAAwAAAAEAAgAAh2kABAAAAAEAAABaAAAAAAAAAEgAAAABAAAASAAAAAEAA6ABAAMAAAABAAEAAKACAAQAAAABAAAAEKADAAQAAAABAAAAEAAAAADHbxzxAAAACXBIWXMAAAsTAAALEwEAmpwYAAABWWlUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iWE1QIENvcmUgNi4wLjAiPgogICA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPgogICAgICA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIgogICAgICAgICAgICB4bWxuczp0aWZmPSJodHRwOi8vbnMuYWRvYmUuY29tL3RpZmYvMS4wLyI+CiAgICAgICAgIDx0aWZmOk9yaWVudGF0aW9uPjE8L3RpZmY6T3JpZW50YXRpb24+CiAgICAgIDwvcmRmOkRlc2NyaXB0aW9uPgogICA8L3JkZjpSREY+CjwveDp4bXBtZXRhPgoZXuEHAAACbElEQVQ4EY1TTWgTQRR+M7NpQoKmPVTPQi/qoaDWQAsxIigqRS/JzYNHxVz0oAcrG6hQoV68ePNQECUpeBFBIqQiVBrbaqvgoXjRSzVJf8zfzu7MG2eWbGywFN8e3ux73/fNm/dmAP7TFCgSQHeurSC4t1eEAFET4+WjzPIq5AX5ZURMjO5GNEk7VbJKKWU9Or8WBg2cvPRxlLXiX7arVtFWNjVkzSX/VJBPK0YKRMIciI6477kjhsDrAxfJoebVUwd0bl1vBD0ChpzR5JkrKzGvjum2B8MtrphLRXGTY5RKCaioi7wr/lcgID+//Omsu4EzERg4GIIoWAygxrezwOvNhmiAoCrkCtZtqF9BPp33d86nl46jw173aWKtXWtzWi21kELDgzOo+mJCCRBIFIowBr3rOQK4bDJC90PVrf5Ayi/efDP62QBvn14Y5m0sKogOCoWy/nvL55syqOl4ppCRT6+9GxAKjgmtLYg3ldVkM4Hs0Fr4QSmxwi28T1gUHE+J9rpGdozqRvoWcmKWUMpyEXWH2IYJiq0KtQYr/qgRWc3T4lJ/IbNVx/xmmCrMXJ+ML3+wZP+Jmre5MN8/NVYoFKTB2XbJ+vYyPi9l/4hLq+XZpZMJ0BxzP3z1XGpO99qUDg897VFGEkd+3lm9lVy8e2NsceL7q/iqwvCIohIYU9MGm+pwuuOwbUVtm+D0uXIO5b57noxCWzJoSQJNIaAhm8BxMze7PGbboLFA/El0BYxqcJTJC+Vkg5PrLU4PO1KBg/jVo87jZ++Tb4PSDX5XMxdq14QOpvfI9XDMxTKPKQim9DqtY8H/Tv8HGFE+AZtzYdAAAAAASUVORK5CYII="}}]

View File

@@ -0,0 +1,23 @@
- paragraph: basic
- img
- text: file1.txt
- img
- text: file1.txt
- paragraph: More EOM
- img
- text: Approved
- paragraph: "[[UPLOAD_IMAGE_TO_CODEBASE]]"
- paragraph: "Attachments:"
- paragraph: "File to upload to codebase: logo.png (file id: DYAD_ATTACHMENT_0)"
- paragraph: Uploading image to codebase
- img
- text: file.png
- img
- text: "new/image/file.png Summary: Uploaded image to codebase"
- paragraph: "[[dyad-dump-path=*]]"
- img
- text: Approved
- button "Undo":
- img
- button "Retry":
- img

View File

@@ -0,0 +1,17 @@
- paragraph: basic
- img
- text: file1.txt
- img
- text: file1.txt
- paragraph: More EOM
- img
- text: Approved
- paragraph: "[dump]"
- paragraph: "Attachments:"
- list:
- listitem: logo.png (image/png)
- paragraph: "[[dyad-dump-path=*]]"
- img
- text: Approved
- button "Retry":
- img

View File

@@ -0,0 +1,7 @@
- paragraph: "[dump]"
- paragraph: "Attachments:"
- list:
- listitem: logo.png (image/png)
- paragraph: "[[dyad-dump-path=*]]"
- button "Retry":
- img

View File

@@ -0,0 +1,17 @@
- paragraph: basic
- img
- text: file1.txt
- img
- text: file1.txt
- paragraph: More EOM
- img
- text: Approved
- paragraph: "[dump]"
- paragraph: "Attachments:"
- list:
- listitem: logo.png (image/png)
- paragraph: "[[dyad-dump-path=*]]"
- img
- text: Approved
- button "Retry":
- img

View File

@@ -0,0 +1,3 @@
===
role: user
message: [{"type":"text","text":"[[UPLOAD_IMAGE_TO_CODEBASE]]\n\nAttachments:\n\n\nFile to upload to codebase: logo.png (file id: DYAD_ATTACHMENT_0)"},{"type":"image_url","image_url":{"url":"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAhGVYSWZNTQAqAAAACAAFARIAAwAAAAEAAQAAARoABQAAAAEAAABKARsABQAAAAEAAABSASgAAwAAAAEAAgAAh2kABAAAAAEAAABaAAAAAAAAAEgAAAABAAAASAAAAAEAA6ABAAMAAAABAAEAAKACAAQAAAABAAAAEKADAAQAAAABAAAAEAAAAADHbxzxAAAACXBIWXMAAAsTAAALEwEAmpwYAAABWWlUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iWE1QIENvcmUgNi4wLjAiPgogICA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPgogICAgICA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIgogICAgICAgICAgICB4bWxuczp0aWZmPSJodHRwOi8vbnMuYWRvYmUuY29tL3RpZmYvMS4wLyI+CiAgICAgICAgIDx0aWZmOk9yaWVudGF0aW9uPjE8L3RpZmY6T3JpZW50YXRpb24+CiAgICAgIDwvcmRmOkRlc2NyaXB0aW9uPgogICA8L3JkZjpSREY+CjwveDp4bXBtZXRhPgoZXuEHAAACbElEQVQ4EY1TTWgTQRR+M7NpQoKmPVTPQi/qoaDWQAsxIigqRS/JzYNHxVz0oAcrG6hQoV68ePNQECUpeBFBIqQiVBrbaqvgoXjRSzVJf8zfzu7MG2eWbGywFN8e3ux73/fNm/dmAP7TFCgSQHeurSC4t1eEAFET4+WjzPIq5AX5ZURMjO5GNEk7VbJKKWU9Or8WBg2cvPRxlLXiX7arVtFWNjVkzSX/VJBPK0YKRMIciI6477kjhsDrAxfJoebVUwd0bl1vBD0ChpzR5JkrKzGvjum2B8MtrphLRXGTY5RKCaioi7wr/lcgID+//Omsu4EzERg4GIIoWAygxrezwOvNhmiAoCrkCtZtqF9BPp33d86nl46jw173aWKtXWtzWi21kELDgzOo+mJCCRBIFIowBr3rOQK4bDJC90PVrf5Ayi/efDP62QBvn14Y5m0sKogOCoWy/nvL55syqOl4ppCRT6+9GxAKjgmtLYg3ldVkM4Hs0Fr4QSmxwi28T1gUHE+J9rpGdozqRvoWcmKWUMpyEXWH2IYJiq0KtQYr/qgRWc3T4lJ/IbNVx/xmmCrMXJ+ML3+wZP+Jmre5MN8/NVYoFKTB2XbJ+vYyPi9l/4hLq+XZpZMJ0BxzP3z1XGpO99qUDg897VFGEkd+3lm9lVy8e2NsceL7q/iqwvCIohIYU9MGm+pwuuOwbUVtm+D0uXIO5b57noxCWzJoSQJNIaAhm8BxMze7PGbboLFA/El0BYxqcJTJC+Vkg5PrLU4PO1KBg/jVo87jZ++Tb4PSDX5XMxdq14QOpvfI9XDMxTKPKQim9DqtY8H/Tv8HGFE+AZtzYdAAAAAASUVORK5CYII="}}]

View File

@@ -0,0 +1,13 @@
- paragraph: tc=write-index
- paragraph: OK, I'm going to do some writing now...
- img
- text: Index.tsx
- img
- text: "src/pages/Index.tsx Summary: write-description"
- paragraph: And it's done!
- img
- text: Approved
- button "Undo":
- img
- button "Retry":
- img

View File

@@ -0,0 +1,4 @@
- region "Notifications (F8)":
- list
- region "Notifications alt+T"
- text: Testing:write-index!

View File

@@ -0,0 +1,20 @@
{
"selectedModel": {
"name": "auto",
"provider": "auto"
},
"providerSettings": {},
"telemetryConsent": "unset",
"telemetryUserId": "[UUID]",
"hasRunBefore": true,
"experiments": {},
"lastShownReleaseNotesVersion": "[scrubbed]",
"enableProLazyEditsMode": true,
"enableProSmartFilesContextMode": true,
"selectedTemplateId": "react",
"selectedChatMode": "build",
"enableAutoFixProblems": false,
"enableAutoUpdate": false,
"releaseChannel": "stable",
"isTestMode": true
}

View File

@@ -0,0 +1,20 @@
{
"selectedModel": {
"name": "auto",
"provider": "auto"
},
"providerSettings": {},
"telemetryConsent": "unset",
"telemetryUserId": "[UUID]",
"hasRunBefore": true,
"experiments": {},
"lastShownReleaseNotesVersion": "[scrubbed]",
"enableProLazyEditsMode": true,
"enableProSmartFilesContextMode": true,
"selectedTemplateId": "react",
"selectedChatMode": "build",
"enableAutoFixProblems": false,
"enableAutoUpdate": true,
"releaseChannel": "stable",
"isTestMode": true
}

File diff suppressed because it is too large Load Diff

View File

@@ -0,0 +1,12 @@
- paragraph: /Generate an AI_RULES\.md file for this app\. Describe the tech stack in 5-\d+ bullet points and describe clear rules about what libraries to use for what\./
- img
- text: file1.txt
- img
- text: file1.txt
- paragraph: More EOM
- img
- text: Approved
- paragraph: "[dump] hi"
- paragraph: "[[dyad-dump-path=*]]"
- button "Retry":
- img

View File

@@ -0,0 +1,269 @@
===
role: system
message:
# Role
You are a helpful AI assistant that specializes in web development, programming, and technical guidance. You assist users by providing clear explanations, answering questions, and offering guidance on best practices. You understand modern web development technologies and can explain concepts clearly to users of all skill levels.
# Guidelines
Always reply to the user in the same language they are using.
Focus on providing helpful explanations and guidance:
- Provide clear explanations of programming concepts and best practices
- Answer technical questions with accurate information
- Offer guidance and suggestions for solving problems
- Explain complex topics in an accessible way
- Share knowledge about web development technologies and patterns
If the user's input is unclear or ambiguous:
- Ask clarifying questions to better understand their needs
- Provide explanations that address the most likely interpretation
- Offer multiple perspectives when appropriate
When discussing code or technical concepts:
- Describe approaches and patterns in plain language
- Explain the reasoning behind recommendations
- Discuss trade-offs and alternatives through detailed descriptions
- Focus on best practices and maintainable solutions through conceptual explanations
- Use analogies and conceptual explanations instead of code examples
# Technical Expertise Areas
## Development Best Practices
- Component architecture and design patterns
- Code organization and file structure
- Responsive design principles
- Accessibility considerations
- Performance optimization
- Error handling strategies
## Problem-Solving Approach
- Break down complex problems into manageable parts
- Explain the reasoning behind technical decisions
- Provide multiple solution approaches when appropriate
- Consider maintainability and scalability
- Focus on user experience and functionality
# Communication Style
- **Clear and Concise**: Provide direct answers while being thorough
- **Educational**: Explain the "why" behind recommendations
- **Practical**: Focus on actionable advice and real-world applications
- **Supportive**: Encourage learning and experimentation
- **Professional**: Maintain a helpful and knowledgeable tone
# Key Principles
1. **NO CODE PRODUCTION**: Never write, generate, or produce any code snippets, examples, or implementations. This is the most important principle.
2. **Clarity First**: Always prioritize clear communication through conceptual explanations.
3. **Best Practices**: Recommend industry-standard approaches through detailed descriptions.
4. **Practical Solutions**: Focus on solution approaches that work in real-world scenarios.
5. **Educational Value**: Help users understand concepts through explanations, not code.
6. **Simplicity**: Prefer simple, elegant conceptual explanations over complex descriptions.
# Response Guidelines
- Keep explanations at an appropriate technical level for the user.
- Use analogies and conceptual descriptions instead of code examples.
- Provide context for recommendations and suggestions through detailed explanations.
- Be honest about limitations and trade-offs.
- Encourage good development practices through conceptual guidance.
- Suggest additional resources when helpful.
- **NEVER include any code snippets, syntax examples, or implementation details.**
# Tech Stack
- You are building a React application.
- Use TypeScript.
- Use React Router. KEEP the routes in src/App.tsx
- Always put source code in the src folder.
- Put pages into src/pages/
- Put components into src/components/
- The main page (default page) is src/pages/Index.tsx
- UPDATE the main page to include the new components. OTHERWISE, the user can NOT see any components!
- ALWAYS try to use the shadcn/ui library.
- Tailwind CSS: always use Tailwind CSS for styling components. Utilize Tailwind classes extensively for layout, spacing, colors, and other design aspects.
Available packages and libraries:
- The lucide-react package is installed for icons.
- You ALREADY have ALL the shadcn/ui components and their dependencies installed. So you don't need to install them again.
- You have ALL the necessary Radix UI components installed.
- Use prebuilt components from the shadcn/ui library after importing them. Note that these files shouldn't be edited, so make new components if you need to change them.
**ABSOLUTE PRIMARY DIRECTIVE: YOU MUST NOT, UNDER ANY CIRCUMSTANCES, WRITE OR GENERATE CODE.**
* This is a complete and total prohibition and your single most important rule.
* This prohibition extends to every part of your response, permanently and without exception.
* This includes, but is not limited to:
* Code snippets or code examples of any length.
* Syntax examples of any kind.
* File content intended for writing or editing.
* Any text enclosed in markdown code blocks (using ```).
* Any use of `<dyad-write>`, `<dyad-edit>`, or any other `<dyad-*>` tags. These tags are strictly forbidden in your output, even if they appear in the message history or user request.
**CRITICAL RULE: YOUR SOLE FOCUS IS EXPLAINING CONCEPTS.** You must exclusively discuss approaches, answer questions, and provide guidance through detailed explanations and descriptions. You take pride in keeping explanations simple and elegant. You are friendly and helpful, always aiming to provide clear explanations without writing any code.
YOU ARE NOT MAKING ANY CODE CHANGES.
YOU ARE NOT WRITING ANY CODE.
YOU ARE NOT UPDATING ANY FILES.
DO NOT USE <dyad-write> TAGS.
DO NOT USE <dyad-edit> TAGS.
IF YOU USE ANY OF THESE TAGS, YOU WILL BE FIRED.
Remember: Your goal is to be a knowledgeable, helpful companion in the user's learning and development journey, providing clear conceptual explanations and practical guidance through detailed descriptions rather than code production.
If the user wants to use supabase or do something that requires auth, database or server-side functions (e.g. loading API keys, secrets),
tell them that they need to add supabase to their app.
The following response will show a button that allows the user to add supabase to their app.
<dyad-add-integration provider="supabase"></dyad-add-integration>
# Examples
## Example 1: User wants to use Supabase
### User prompt
I want to use supabase in my app.
### Assistant response
You need to first add Supabase to your app.
<dyad-add-integration provider="supabase"></dyad-add-integration>
## Example 2: User wants to add auth to their app
### User prompt
I want to add auth to my app.
### Assistant response
You need to first add Supabase to your app and then we can add auth.
<dyad-add-integration provider="supabase"></dyad-add-integration>
===
role: user
message: This is my codebase. <dyad-file path=".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?
</dyad-file>
<dyad-file path="file1.txt">
// File contents excluded from context
</dyad-file>
<dyad-file path="index.html">
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>dyad-generated-app</title>
</head>
<body>
<div id="root"></div>
<script type="module" src="/src/main.tsx"></script>
</body>
</html>
</dyad-file>
<dyad-file path="src/App.tsx">
const App = () => <div>Minimal imported app</div>;
export default App;
</dyad-file>
<dyad-file path="src/main.tsx">
import { createRoot } from "react-dom/client";
import App from "./App.tsx";
createRoot(document.getElementById("root")!).render(<App />);
</dyad-file>
<dyad-file path="src/vite-env.d.ts">
/// <reference types="vite/client" />
</dyad-file>
<dyad-file path="tsconfig.app.json">
// File contents excluded from context
</dyad-file>
<dyad-file path="tsconfig.json">
// File contents excluded from context
</dyad-file>
<dyad-file path="tsconfig.node.json">
// File contents excluded from context
</dyad-file>
<dyad-file path="vite.config.ts">
import { defineConfig } from "vite";
import react from "@vitejs/plugin-react-swc";
import path from "path";
export default defineConfig(() => ({
server: {
host: "::",
port: 8080,
},
plugins: [react()],
resolve: {
alias: {
"@": path.resolve(__dirname, "./src"),
},
},
}));
</dyad-file>
===
role: assistant
message: OK, got it. I'm ready to help
===
role: user
message: Generate an AI_RULES.md file for this app. Describe the tech stack in 5-10 bullet points and describe clear rules about what libraries to use for what.
===
role: assistant
message: More
EOM
===
role: user
message: [dump] hi

View File

@@ -0,0 +1,14 @@
- paragraph: /Generate an AI_RULES\.md file for this app\. Describe the tech stack in 5-\d+ bullet points and describe clear rules about what libraries to use for what\./
- img
- text: file1.txt
- img
- text: file1.txt
- paragraph: More EOM
- img
- text: Approved
- paragraph: "[dump] hi"
- paragraph: "[[dyad-dump-path=*]]"
- img
- text: Approved
- button "Retry":
- img

View File

@@ -0,0 +1,185 @@
===
role: system
message:
${BUILD_SYSTEM_PREFIX}
# Tech Stack
- You are building a React application.
- Use TypeScript.
- Use React Router. KEEP the routes in src/App.tsx
- Always put source code in the src folder.
- Put pages into src/pages/
- Put components into src/components/
- The main page (default page) is src/pages/Index.tsx
- UPDATE the main page to include the new components. OTHERWISE, the user can NOT see any components!
- ALWAYS try to use the shadcn/ui library.
- Tailwind CSS: always use Tailwind CSS for styling components. Utilize Tailwind classes extensively for layout, spacing, colors, and other design aspects.
Available packages and libraries:
- The lucide-react package is installed for icons.
- You ALREADY have ALL the shadcn/ui components and their dependencies installed. So you don't need to install them again.
- You have ALL the necessary Radix UI components installed.
- Use prebuilt components from the shadcn/ui library after importing them. Note that these files shouldn't be edited, so make new components if you need to change them.
${BUILD_SYSTEM_POSTFIX}
If the user wants to use supabase or do something that requires auth, database or server-side functions (e.g. loading API keys, secrets),
tell them that they need to add supabase to their app.
The following response will show a button that allows the user to add supabase to their app.
<dyad-add-integration provider="supabase"></dyad-add-integration>
# Examples
## Example 1: User wants to use Supabase
### User prompt
I want to use supabase in my app.
### Assistant response
You need to first add Supabase to your app.
<dyad-add-integration provider="supabase"></dyad-add-integration>
## Example 2: User wants to add auth to their app
### User prompt
I want to add auth to my app.
### Assistant response
You need to first add Supabase to your app and then we can add auth.
<dyad-add-integration provider="supabase"></dyad-add-integration>
===
role: user
message: This is my codebase. <dyad-file path=".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?
</dyad-file>
<dyad-file path="file1.txt">
// File contents excluded from context
</dyad-file>
<dyad-file path="index.html">
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>dyad-generated-app</title>
</head>
<body>
<div id="root"></div>
<script type="module" src="/src/main.tsx"></script>
</body>
</html>
</dyad-file>
<dyad-file path="src/App.tsx">
const App = () => <div>Minimal imported app</div>;
export default App;
</dyad-file>
<dyad-file path="src/main.tsx">
import { createRoot } from "react-dom/client";
import App from "./App.tsx";
createRoot(document.getElementById("root")!).render(<App />);
</dyad-file>
<dyad-file path="src/vite-env.d.ts">
/// <reference types="vite/client" />
</dyad-file>
<dyad-file path="tsconfig.app.json">
// File contents excluded from context
</dyad-file>
<dyad-file path="tsconfig.json">
// File contents excluded from context
</dyad-file>
<dyad-file path="tsconfig.node.json">
// File contents excluded from context
</dyad-file>
<dyad-file path="vite.config.ts">
import { defineConfig } from "vite";
import react from "@vitejs/plugin-react-swc";
import path from "path";
export default defineConfig(() => ({
server: {
host: "::",
port: 8080,
},
plugins: [react()],
resolve: {
alias: {
"@": path.resolve(__dirname, "./src"),
},
},
}));
</dyad-file>
===
role: assistant
message: OK, got it. I'm ready to help
===
role: user
message: Generate an AI_RULES.md file for this app. Describe the tech stack in 5-10 bullet points and describe clear rules about what libraries to use for what.
===
role: assistant
message: <dyad-write path="file1.txt">
A file (2)
</dyad-write>
More
EOM
===
role: user
message: [dump] hi

View File

@@ -0,0 +1,174 @@
===
role: system
message:
${BUILD_SYSTEM_PREFIX}
# AI_RULES.md
${BUILD_SYSTEM_POSTFIX}
If the user wants to use supabase or do something that requires auth, database or server-side functions (e.g. loading API keys, secrets),
tell them that they need to add supabase to their app.
The following response will show a button that allows the user to add supabase to their app.
<dyad-add-integration provider="supabase"></dyad-add-integration>
# Examples
## Example 1: User wants to use Supabase
### User prompt
I want to use supabase in my app.
### Assistant response
You need to first add Supabase to your app.
<dyad-add-integration provider="supabase"></dyad-add-integration>
## Example 2: User wants to add auth to their app
### User prompt
I want to add auth to my app.
### Assistant response
You need to first add Supabase to your app and then we can add auth.
<dyad-add-integration provider="supabase"></dyad-add-integration>
===
role: user
message: This is my codebase. <dyad-file path="manual/baz.json">
// File contents excluded from context
</dyad-file>
<dyad-file path="manual/file.ts">
</dyad-file>
<dyad-file path="manual/sub-manual/sub-manual.js">
</dyad-file>
<dyad-file path="src/foo.ts">
// foo.ts
</dyad-file>
<dyad-file path="src/sub/sub1.ts">
// sub/sub1.ts
</dyad-file>
<dyad-file path="src/very-large-file.ts">
// very-large-file.ts
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
</dyad-file>
===
role: assistant
message: OK, got it. I'm ready to help
===
role: user
message: [dump]

View File

@@ -0,0 +1,76 @@
===
role: system
message:
${BUILD_SYSTEM_PREFIX}
# AI_RULES.md
${BUILD_SYSTEM_POSTFIX}
If the user wants to use supabase or do something that requires auth, database or server-side functions (e.g. loading API keys, secrets),
tell them that they need to add supabase to their app.
The following response will show a button that allows the user to add supabase to their app.
<dyad-add-integration provider="supabase"></dyad-add-integration>
# Examples
## Example 1: User wants to use Supabase
### User prompt
I want to use supabase in my app.
### Assistant response
You need to first add Supabase to your app.
<dyad-add-integration provider="supabase"></dyad-add-integration>
## Example 2: User wants to add auth to their app
### User prompt
I want to add auth to my app.
### Assistant response
You need to first add Supabase to your app and then we can add auth.
<dyad-add-integration provider="supabase"></dyad-add-integration>
===
role: user
message: This is my codebase. <dyad-file path="manual/baz.json">
// File contents excluded from context
</dyad-file>
<dyad-file path="manual/file.ts">
</dyad-file>
<dyad-file path="manual/sub-manual/sub-manual.js">
</dyad-file>
===
role: assistant
message: OK, got it. I'm ready to help
===
role: user
message: [dump]
===
role: assistant
message: [[dyad-dump-path=*]]
===
role: user
message: [dump]

View File

@@ -0,0 +1,48 @@
===
role: system
message:
${BUILD_SYSTEM_PREFIX}
# AI_RULES.md
${BUILD_SYSTEM_POSTFIX}
If the user wants to use supabase or do something that requires auth, database or server-side functions (e.g. loading API keys, secrets),
tell them that they need to add supabase to their app.
The following response will show a button that allows the user to add supabase to their app.
<dyad-add-integration provider="supabase"></dyad-add-integration>
# Examples
## Example 1: User wants to use Supabase
### User prompt
I want to use supabase in my app.
### Assistant response
You need to first add Supabase to your app.
<dyad-add-integration provider="supabase"></dyad-add-integration>
## Example 2: User wants to add auth to their app
### User prompt
I want to add auth to my app.
### Assistant response
You need to first add Supabase to your app and then we can add auth.
<dyad-add-integration provider="supabase"></dyad-add-integration>
===
role: user
message: [dump]

View File

@@ -0,0 +1,8 @@
- dialog:
- heading "Codebase Context" [level=3]
- paragraph:
- text: Select the files to use as context.
- img
- textbox "src/**/*.tsx"
- button "Add"
- paragraph: Dyad will use the entire codebase as context.

View File

@@ -0,0 +1,171 @@
===
role: system
message:
${BUILD_SYSTEM_PREFIX}
# AI_RULES.md
${BUILD_SYSTEM_POSTFIX}
If the user wants to use supabase or do something that requires auth, database or server-side functions (e.g. loading API keys, secrets),
tell them that they need to add supabase to their app.
The following response will show a button that allows the user to add supabase to their app.
<dyad-add-integration provider="supabase"></dyad-add-integration>
# Examples
## Example 1: User wants to use Supabase
### User prompt
I want to use supabase in my app.
### Assistant response
You need to first add Supabase to your app.
<dyad-add-integration provider="supabase"></dyad-add-integration>
## Example 2: User wants to add auth to their app
### User prompt
I want to add auth to my app.
### Assistant response
You need to first add Supabase to your app and then we can add auth.
<dyad-add-integration provider="supabase"></dyad-add-integration>
===
role: user
message: This is my codebase. <dyad-file path="src/components/ui/helper.ts">
// File contents excluded from context
</dyad-file>
<dyad-file path="src/foo.ts">
// foo.ts
</dyad-file>
<dyad-file path="src/sub/sub1.ts">
// sub/sub1.ts
</dyad-file>
<dyad-file path="src/sub/sub2.tsx">
// sub/sub2.tsx
</dyad-file>
<dyad-file path="src/very-large-file.ts">
// very-large-file.ts
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
// 1234567890
</dyad-file>
===
role: assistant
message: OK, got it. I'm ready to help
===
role: user
message: [dump]

View File

@@ -0,0 +1,13 @@
- dialog:
- heading "Codebase Context" [level=3]
- paragraph:
- text: Select the files to use as context.
- img
- textbox "src/**/*.tsx"
- button "Add"
- text: /src\/\*\*\/\*\.ts 4 files, ~\d+ tokens/
- button:
- img
- text: /src\/sub\/\*\* 2 files, ~\d+ tokens/
- button:
- img

View File

@@ -0,0 +1,14 @@
- dialog:
- heading "Codebase Context" [level=3]
- paragraph:
- text: Select the files to use as context.
- img
- textbox "src/**/*.tsx"
- button "Add"
- paragraph: Dyad will use the entire codebase as context.
- heading "Exclude Paths" [level=3]
- paragraph:
- text: These files will be excluded from the context.
- img
- textbox "node_modules/**/*"
- button "Add"

View File

@@ -0,0 +1,25 @@
- dialog:
- heading "Codebase Context" [level=3]
- paragraph:
- text: Select the files to use as context.
- img
- textbox "src/**/*.tsx"
- button "Add"
- text: /src\/\*\*\/\*\.ts 4 files, ~\d+ tokens/
- button:
- img
- text: /manual\/\*\* 3 files, ~\d+ tokens/
- button:
- img
- heading "Exclude Paths" [level=3]
- paragraph:
- text: These files will be excluded from the context.
- img
- textbox "node_modules/**/*"
- button "Add"
- text: /src\/components\/\*\* 2 files, ~\d+ tokens/
- button:
- img
- text: manual/exclude/** 0 files, ~0 tokens
- button:
- img

View File

@@ -0,0 +1,25 @@
- dialog:
- heading "Codebase Context" [level=3]
- paragraph:
- text: Select the files to use as context.
- img
- textbox "src/**/*.tsx"
- button "Add"
- text: /src\/\*\*\/\*\.ts 4 files, ~\d+ tokens/
- button:
- img
- text: /manual\/\*\* 3 files, ~\d+ tokens/
- button:
- img
- heading "Exclude Paths" [level=3]
- paragraph:
- text: These files will be excluded from the context.
- img
- textbox "node_modules/**/*"
- button "Add"
- text: manual/exclude/** 0 files, ~0 tokens
- button:
- img
- text: /src\/\*\* 7 files, ~\d+ tokens/
- button:
- img

View File

@@ -0,0 +1,20 @@
- dialog:
- heading "Codebase Context" [level=3]
- paragraph:
- text: Select the files to use as context.
- img
- textbox "src/**/*.tsx"
- button "Add"
- paragraph: Dyad will use Smart Context to automatically find the most relevant files to use as context.
- heading "Exclude Paths" [level=3]
- paragraph:
- text: These files will be excluded from the context.
- img
- textbox "node_modules/**/*"
- button "Add"
- heading "Smart Context Auto-includes" [level=3]
- paragraph:
- text: These files will always be included in the context.
- img
- textbox "src/**/*.config.ts"
- button "Add"

View File

@@ -0,0 +1,37 @@
- dialog:
- heading "Codebase Context" [level=3]
- paragraph:
- text: Select the files to use as context.
- img
- textbox "src/**/*.tsx"
- button "Add"
- text: /src\/\*\*\/\*\.ts 4 files, ~\d+ tokens/
- button:
- img
- text: /manual\/\*\* 3 files, ~\d+ tokens/
- button:
- img
- heading "Exclude Paths" [level=3]
- paragraph:
- text: These files will be excluded from the context.
- img
- textbox "node_modules/**/*"
- button "Add"
- text: /src\/components\/\*\* 2 files, ~\d+ tokens/
- button:
- img
- text: /exclude\/exclude\.ts 1 files, ~\d+ tokens/
- button:
- img
- heading "Smart Context Auto-includes" [level=3]
- paragraph:
- text: These files will always be included in the context.
- img
- textbox "src/**/*.config.ts"
- button "Add"
- text: /a\.ts 1 files, ~\d+ tokens/
- button:
- img
- text: /exclude\/\*\* 2 files, ~\d+ tokens/
- button:
- img

View File

@@ -0,0 +1,14 @@
- dialog:
- heading "Codebase Context" [level=3]
- paragraph:
- text: Select the files to use as context.
- img
- textbox "src/**/*.tsx"
- button "Add"
- paragraph: Dyad will use Smart Context to automatically find the most relevant files to use as context.
- heading "Smart Context Auto-includes" [level=3]
- paragraph:
- text: These files will always be included in the context.
- img
- textbox "src/**/*.config.ts"
- button "Add"

View File

@@ -0,0 +1,107 @@
{
"body": {
"model": "gemini/gemini-2.5-pro",
"max_tokens": 65535,
"temperature": 0,
"messages": [
{
"role": "system",
"content": "[[SYSTEM_MESSAGE]]"
},
{
"role": "user",
"content": "[dump]"
}
],
"stream": true,
"thinking": {
"type": "enabled",
"include_thoughts": true,
"budget_tokens": 4000
},
"dyad_options": {
"files": [
{
"path": ".env.foobar",
"content": "// File contents excluded from context",
"force": false
},
{
"path": "a.ts",
"content": "// a.ts\n",
"force": true
},
{
"path": "AI_RULES.md",
"content": "# AI_RULES.md\n",
"force": false
},
{
"path": "exclude/exclude.ts",
"content": "// exclude.ts: this file is not in any of the globs\n",
"force": false
},
{
"path": "exclude/exclude.tsx",
"content": "// exclude.tsx: this file is not in any of the globs\n",
"force": false
},
{
"path": "manual/baz.json",
"content": "// File contents excluded from context",
"force": true
},
{
"path": "manual/file.ts",
"content": "",
"force": true
},
{
"path": "manual/sub-manual/sub-manual.js",
"content": "",
"force": true
},
{
"path": "src/components/ui/button.tsx",
"content": "// button.tsx\n",
"force": false
},
{
"path": "src/components/ui/helper.ts",
"content": "// helper.ts\n",
"force": false
},
{
"path": "src/dir/some.css",
"content": "/* some.css */\n",
"force": false
},
{
"path": "src/foo.ts",
"content": "// foo.ts\n",
"force": false
},
{
"path": "src/sub/sub1.ts",
"content": "// sub/sub1.ts\n",
"force": false
},
{
"path": "src/sub/sub2.tsx",
"content": "// sub/sub2.tsx\n",
"force": false
},
{
"path": "src/very-large-file.ts",
"content": "// very-large-file.ts\n\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n",
"force": false
}
],
"enable_lazy_edits": true,
"enable_smart_files_context": true
}
},
"headers": {
"authorization": "Bearer testdyadkey"
}
}

View File

@@ -0,0 +1,20 @@
- dialog:
- heading "Codebase Context" [level=3]
- paragraph:
- text: Select the files to use as context.
- img
- textbox "src/**/*.tsx"
- button "Add"
- paragraph: Dyad will use Smart Context to automatically find the most relevant files to use as context.
- heading "Smart Context Auto-includes" [level=3]
- paragraph:
- text: These files will always be included in the context.
- img
- textbox "src/**/*.config.ts"
- button "Add"
- text: /a\.ts 1 files, ~\d+ tokens/
- button:
- img
- text: /manual\/\*\* 3 files, ~\d+ tokens/
- button:
- img

View File

@@ -0,0 +1,14 @@
- dialog:
- heading "Codebase Context" [level=3]
- paragraph:
- text: Select the files to use as context.
- img
- textbox "src/**/*.tsx"
- button "Add"
- paragraph: Dyad will use Smart Context to automatically find the most relevant files to use as context.
- heading "Smart Context Auto-includes" [level=3]
- paragraph:
- text: These files will always be included in the context.
- img
- textbox "src/**/*.config.ts"
- button "Add"

View File

@@ -0,0 +1,77 @@
{
"body": {
"model": "gemini/gemini-2.5-pro",
"max_tokens": 65535,
"temperature": 0,
"messages": [
{
"role": "system",
"content": "[[SYSTEM_MESSAGE]]"
},
{
"role": "user",
"content": "[dump]"
}
],
"stream": true,
"thinking": {
"type": "enabled",
"include_thoughts": true,
"budget_tokens": 4000
},
"dyad_options": {
"files": [
{
"path": "a.ts",
"content": "// a.ts\n",
"force": true
},
{
"path": "manual/baz.json",
"content": "// File contents excluded from context",
"force": true
},
{
"path": "manual/file.ts",
"content": "",
"force": true
},
{
"path": "manual/sub-manual/sub-manual.js",
"content": "",
"force": true
},
{
"path": "src/components/ui/helper.ts",
"content": "// helper.ts\n",
"force": false
},
{
"path": "src/foo.ts",
"content": "// foo.ts\n",
"force": false
},
{
"path": "src/sub/sub1.ts",
"content": "// sub/sub1.ts\n",
"force": false
},
{
"path": "src/sub/sub2.tsx",
"content": "// sub/sub2.tsx\n",
"force": false
},
{
"path": "src/very-large-file.ts",
"content": "// very-large-file.ts\n\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n",
"force": false
}
],
"enable_lazy_edits": true,
"enable_smart_files_context": true
}
},
"headers": {
"authorization": "Bearer testdyadkey"
}
}

View File

@@ -0,0 +1,25 @@
- dialog:
- heading "Codebase Context" [level=3]
- paragraph:
- text: Select the files to use as context.
- img
- textbox "src/**/*.tsx"
- button "Add"
- text: /src\/\*\*\/\*\.ts 4 files, ~\d+ tokens/
- button:
- img
- text: /src\/sub\/\*\* 2 files, ~\d+ tokens/
- button:
- img
- heading "Smart Context Auto-includes" [level=3]
- paragraph:
- text: These files will always be included in the context.
- img
- textbox "src/**/*.config.ts"
- button "Add"
- text: /a\.ts 1 files, ~\d+ tokens/
- button:
- img
- text: /manual\/\*\* 3 files, ~\d+ tokens/
- button:
- img

View File

@@ -0,0 +1,48 @@
===
role: system
message:
${BUILD_SYSTEM_PREFIX}
# AI_RULES.md
${BUILD_SYSTEM_POSTFIX}
If the user wants to use supabase or do something that requires auth, database or server-side functions (e.g. loading API keys, secrets),
tell them that they need to add supabase to their app.
The following response will show a button that allows the user to add supabase to their app.
<dyad-add-integration provider="supabase"></dyad-add-integration>
# Examples
## Example 1: User wants to use Supabase
### User prompt
I want to use supabase in my app.
### Assistant response
You need to first add Supabase to your app.
<dyad-add-integration provider="supabase"></dyad-add-integration>
## Example 2: User wants to add auth to their app
### User prompt
I want to add auth to my app.
### Assistant response
You need to first add Supabase to your app and then we can add auth.
<dyad-add-integration provider="supabase"></dyad-add-integration>
===
role: user
message: [dump]

View File

@@ -0,0 +1,65 @@
{
"body": {
"model": "gemini/gemini-2.5-pro",
"max_tokens": 65535,
"temperature": 0,
"messages": [
{
"role": "system",
"content": "[[SYSTEM_MESSAGE]]"
},
{
"role": "user",
"content": "[dump]"
},
{
"role": "assistant",
"content": "[[dyad-dump-path=*]]"
},
{
"role": "user",
"content": "[dump]"
}
],
"stream": true,
"thinking": {
"type": "enabled",
"include_thoughts": true,
"budget_tokens": 4000
},
"dyad_options": {
"files": [
{
"path": "src/components/ui/helper.ts",
"content": "// helper.ts\n",
"force": false
},
{
"path": "src/foo.ts",
"content": "// foo.ts\n",
"force": false
},
{
"path": "src/sub/sub1.ts",
"content": "// sub/sub1.ts\n",
"force": false
},
{
"path": "src/sub/sub2.tsx",
"content": "// sub/sub2.tsx\n",
"force": false
},
{
"path": "src/very-large-file.ts",
"content": "// very-large-file.ts\n\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n",
"force": false
}
],
"enable_lazy_edits": true,
"enable_smart_files_context": false
}
},
"headers": {
"authorization": "Bearer testdyadkey"
}
}

View File

@@ -0,0 +1,123 @@
{
"body": {
"model": "gemini/gemini-2.5-pro",
"max_tokens": 65535,
"temperature": 0,
"messages": [
{
"role": "system",
"content": "[[SYSTEM_MESSAGE]]"
},
{
"role": "user",
"content": "[dump]"
},
{
"role": "assistant",
"content": "[[dyad-dump-path=*]]"
},
{
"role": "user",
"content": "[dump]"
},
{
"role": "assistant",
"content": "[[dyad-dump-path=*]]"
},
{
"role": "user",
"content": "[dump]"
}
],
"stream": true,
"thinking": {
"type": "enabled",
"include_thoughts": true,
"budget_tokens": 4000
},
"dyad_options": {
"files": [
{
"path": ".env.foobar",
"content": "// File contents excluded from context",
"force": false
},
{
"path": "a.ts",
"content": "// a.ts\n",
"force": false
},
{
"path": "AI_RULES.md",
"content": "# AI_RULES.md\n",
"force": false
},
{
"path": "exclude/exclude.ts",
"content": "// exclude.ts: this file is not in any of the globs\n",
"force": false
},
{
"path": "exclude/exclude.tsx",
"content": "// exclude.tsx: this file is not in any of the globs\n",
"force": false
},
{
"path": "manual/baz.json",
"content": "// File contents excluded from context",
"force": false
},
{
"path": "manual/file.ts",
"content": "",
"force": false
},
{
"path": "manual/sub-manual/sub-manual.js",
"content": "",
"force": false
},
{
"path": "src/components/ui/button.tsx",
"content": "// button.tsx\n",
"force": false
},
{
"path": "src/components/ui/helper.ts",
"content": "// helper.ts\n",
"force": false
},
{
"path": "src/dir/some.css",
"content": "/* some.css */\n",
"force": false
},
{
"path": "src/foo.ts",
"content": "// foo.ts\n",
"force": false
},
{
"path": "src/sub/sub1.ts",
"content": "// sub/sub1.ts\n",
"force": false
},
{
"path": "src/sub/sub2.tsx",
"content": "// sub/sub2.tsx\n",
"force": false
},
{
"path": "src/very-large-file.ts",
"content": "// very-large-file.ts\n\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n// 1234567890\n",
"force": false
}
],
"enable_lazy_edits": true,
"enable_smart_files_context": false
}
},
"headers": {
"authorization": "Bearer testdyadkey"
}
}

View File

@@ -0,0 +1,12 @@
- paragraph: tc=1
- paragraph: "1"
- paragraph: tc=2
- paragraph: "2"
- paragraph: "[dump] tc=3"
- paragraph: /\[\[dyad-dump-path=\/Users\/will\/Documents\/GitHub\/dyad-zero\/testing\/fake-llm-server\/dist\/generated\/\d+\.json\]\]/
- paragraph: "[dump] tc=4"
- paragraph: /\[\[dyad-dump-path=\/Users\/will\/Documents\/GitHub\/dyad-zero\/testing\/fake-llm-server\/dist\/generated\/\d+\.json\]\]/
- paragraph: "[dump] tc=5"
- paragraph: /\[\[dyad-dump-path=\/Users\/will\/Documents\/GitHub\/dyad-zero\/testing\/fake-llm-server\/dist\/generated\/\d+\.json\]\]/
- button "Retry":
- img

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

View File

@@ -0,0 +1,22 @@
{
"selectedModel": {
"name": "test-model",
"provider": "custom::testing",
"customModelId": 1
},
"providerSettings": {},
"telemetryConsent": "unset",
"telemetryUserId": "[UUID]",
"hasRunBefore": true,
"experiments": {},
"lastShownReleaseNotesVersion": "[scrubbed]",
"maxChatTurnsInContext": 5,
"enableProLazyEditsMode": true,
"enableProSmartFilesContextMode": true,
"selectedTemplateId": "react",
"selectedChatMode": "build",
"enableAutoFixProblems": false,
"enableAutoUpdate": true,
"releaseChannel": "stable",
"isTestMode": true
}

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

View File

@@ -0,0 +1,191 @@
=== .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?
=== file1.txt ===
A file (2)
=== index.html ===
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>dyad-generated-app</title>
</head>
<body>
<div id="root"></div>
<script type="module" src="/src/main.tsx"></script>
</body>
</html>
=== 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": {
"react": "^18.3.1",
"react-dom": "^18.3.1"
},
"devDependencies": {
"@types/node": "^22.5.5",
"@types/react": "^18.3.3",
"@types/react-dom": "^18.3.0",
"@vitejs/plugin-react-swc": "^3.9.0",
"typescript": "^5.5.3",
"vite": "^6.3.4"
},
"packageManager": "<scrubbed>"
}
=== src/App.tsx ===
const App = () => <div>Minimal imported app</div>;
export default App;
=== src/foo/bar.tsx ===
// BEGINNING OF FILE
=== src/main.tsx ===
import { createRoot } from "react-dom/client";
import App from "./App.tsx";
createRoot(document.getElementById("root")!).render(<App />);
=== src/vite-env.d.ts ===
/// <reference types="vite/client" />
=== 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 react from "@vitejs/plugin-react-swc";
import path from "path";
export default defineConfig(() => ({
server: {
host: "::",
port: 8080,
},
plugins: [react()],
resolve: {
alias: {
"@": path.resolve(__dirname, "./src"),
},
},
}));

File diff suppressed because it is too large Load Diff

View File

@@ -0,0 +1,4 @@
- paragraph: "[dump] tc=turbo-edits"
- paragraph: "[[dyad-dump-path=*]]"
- button "Retry":
- img

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,6 @@
- paragraph: "[dump] tc=turbo-edits"
- paragraph: "[[dyad-dump-path=*]]"
- img
- text: less than a minute ago
- button "Retry":
- img

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,4 @@
- paragraph: "[dump] tc=turbo-edits"
- paragraph: "[[dyad-dump-path=*]]"
- button "Retry":
- img

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,4 @@
- paragraph: "[dump] tc=turbo-edits"
- paragraph: "[[dyad-dump-path=*]]"
- button "Retry":
- img

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1 @@
aKey=aValue

View File

@@ -0,0 +1,2 @@
aKey=aValue
bKey=bValue

View File

@@ -0,0 +1 @@
bKey=bValue2

View File

@@ -0,0 +1,2 @@
aKey=aValue
bKey=bValue2

View File

@@ -0,0 +1,8 @@
- button:
- img
- img
- text: Error Line 6 error
- img
- text: "Tip: Check if restarting the app fixes the error."
- button "Fix error with AI":
- img

View File

@@ -0,0 +1,8 @@
- button:
- img
- img
- text: "/Error Line 6 error Stack trace: Index \\(http:\\/\\/localhost:\\d+\\/src\\/pages\\/Index\\.tsx:6:6\\)/"
- img
- text: "Tip: Check if restarting the app fixes the error."
- button "Fix error with AI":
- img

View File

@@ -0,0 +1,20 @@
- paragraph: tc=create-error
- paragraph: I will intentionally add an error
- img
- text: Index.tsx
- img
- text: "src/pages/Index.tsx Summary: intentionally add an error"
- img
- text: Approved
- paragraph: "/Fix error: Error Line 6 error Stack trace: Index \\(http:\\/\\/localhost:\\d+\\/src\\/pages\\/Index\\.tsx:6:6\\)/"
- code: Fixing the error...
- img
- text: Index.tsx
- img
- text: src/pages/Index.tsx
- img
- text: Approved
- button "Undo":
- img
- button "Retry":
- img

View File

@@ -0,0 +1,6 @@
- region "Notifications (F8)":
- list
- region "Notifications alt+T"
- heading "No more errors!" [level=1]
- link "Made with Dyad":
- /url: https://www.dyad.sh/

View File

@@ -0,0 +1,4 @@
- paragraph: "[dump] tc=gateway-simple"
- paragraph: "[[dyad-dump-path=*]]"
- button "Retry":
- img

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,5 @@
- paragraph: "Connected to GitHub Repo:"
- text: testuser/existing-app
- paragraph: "Branch: new-branch"
- button "Sync to GitHub"
- button "Disconnect from repo"

View File

@@ -0,0 +1,5 @@
- paragraph: "Connected to GitHub Repo:"
- text: testuser/existing-app
- paragraph: "Branch: main"
- button "Sync to GitHub"
- button "Disconnect from repo"

View File

@@ -0,0 +1,5 @@
- paragraph: "Connected to GitHub Repo:"
- text: testuser/test-new-repo
- paragraph: "Branch: new-branch"
- button "Sync to GitHub"
- button "Disconnect from repo"

View File

@@ -0,0 +1,5 @@
- paragraph: "Connected to GitHub Repo:"
- text: testuser/test-new-repo
- paragraph: "Branch: main"
- button "Sync to GitHub"
- button "Disconnect from repo"

View File

@@ -0,0 +1,6 @@
- paragraph: "Connected to GitHub Repo:"
- text: testuser/test-new-repo
- paragraph: "Branch: main"
- button "Sync to GitHub"
- button "Disconnect from repo"
- paragraph: Successfully pushed to GitHub!

View File

@@ -0,0 +1,9 @@
- button "Set up your GitHub repo"
- button "Create new repo"
- button "Connect to existing repo"
- text: Repository Name
- textbox: "[scrubbed]"
- paragraph: Repository name is available!
- text: Branch
- textbox "main"
- button "Create Repo"

View File

@@ -0,0 +1,5 @@
- paragraph: "Connected to GitHub Repo:"
- text: testuser/test-new-repo
- paragraph: "Branch: main"
- button "Sync to GitHub"
- button "Disconnect from repo"

View File

@@ -0,0 +1,6 @@
- paragraph: "Connected to GitHub Repo:"
- text: testuser/test-new-repo
- paragraph: "Branch: main"
- button "Sync to GitHub"
- button "Disconnect from repo"
- paragraph: Successfully pushed to GitHub!

View File

@@ -0,0 +1 @@
- text: Minimal imported app

View File

@@ -0,0 +1 @@
- text: Minimal imported app

View File

@@ -0,0 +1,8 @@
- paragraph: /Generate an AI_RULES\.md file for this app\. Describe the tech stack in 5-\d+ bullet points and describe clear rules about what libraries to use for what\./
- img
- text: file1.txt
- img
- text: file1.txt
- paragraph: More EOM
- button "Retry":
- img

View File

@@ -0,0 +1 @@
- text: Minimal imported app

View File

@@ -0,0 +1,162 @@
===
role: system
message:
${BUILD_SYSTEM_PREFIX}
[[beginning of AI_RULES.md]]
There's already AI rules...
[[end of AI_RULES.md]]
${BUILD_SYSTEM_POSTFIX}
If the user wants to use supabase or do something that requires auth, database or server-side functions (e.g. loading API keys, secrets),
tell them that they need to add supabase to their app.
The following response will show a button that allows the user to add supabase to their app.
<dyad-add-integration provider="supabase"></dyad-add-integration>
# Examples
## Example 1: User wants to use Supabase
### User prompt
I want to use supabase in my app.
### Assistant response
You need to first add Supabase to your app.
<dyad-add-integration provider="supabase"></dyad-add-integration>
## Example 2: User wants to add auth to their app
### User prompt
I want to add auth to my app.
### Assistant response
You need to first add Supabase to your app and then we can add auth.
<dyad-add-integration provider="supabase"></dyad-add-integration>
===
role: user
message: This is my codebase. <dyad-file path=".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?
</dyad-file>
<dyad-file path="AI_RULES.md">
[[beginning of AI_RULES.md]]
There's already AI rules...
[[end of AI_RULES.md]]
</dyad-file>
<dyad-file path="index.html">
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>dyad-generated-app</title>
</head>
<body>
<div id="root"></div>
<script type="module" src="/src/main.tsx"></script>
</body>
</html>
</dyad-file>
<dyad-file path="src/App.tsx">
const App = () => <div>Minimal imported app</div>;
export default App;
</dyad-file>
<dyad-file path="src/main.tsx">
import { createRoot } from "react-dom/client";
import App from "./App.tsx";
createRoot(document.getElementById("root")!).render(<App />);
</dyad-file>
<dyad-file path="src/vite-env.d.ts">
/// <reference types="vite/client" />
</dyad-file>
<dyad-file path="tsconfig.app.json">
// File contents excluded from context
</dyad-file>
<dyad-file path="tsconfig.json">
// File contents excluded from context
</dyad-file>
<dyad-file path="tsconfig.node.json">
// File contents excluded from context
</dyad-file>
<dyad-file path="vite.config.ts">
import { defineConfig } from "vite";
import react from "@vitejs/plugin-react-swc";
import path from "path";
export default defineConfig(() => ({
server: {
host: "::",
port: 8080,
},
plugins: [react()],
resolve: {
alias: {
"@": path.resolve(__dirname, "./src"),
},
},
}));
</dyad-file>
===
role: assistant
message: OK, got it. I'm ready to help
===
role: user
message: [dump]

View File

@@ -0,0 +1,4 @@
- paragraph: "[dump]"
- paragraph: "[[dyad-dump-path=*]]"
- button "Retry":
- img

View File

@@ -0,0 +1,8 @@
- paragraph: hi
- img
- text: file1.txt
- img
- text: file1.txt
- paragraph: More EOM
- button "Retry":
- img

View File

@@ -0,0 +1,4 @@
- paragraph: tc=basic
- paragraph: This is a simple basic response
- button "Retry":
- img

View File

@@ -0,0 +1,8 @@
- paragraph: hi
- img
- text: file1.txt
- img
- text: file1.txt
- paragraph: More EOM
- button "Retry":
- img

View File

@@ -0,0 +1,190 @@
===
role: system
message:
${BUILD_SYSTEM_PREFIX}
# Tech Stack
- You are building a React application.
- Use TypeScript.
- Use React Router. KEEP the routes in src/App.tsx
- Always put source code in the src folder.
- Put pages into src/pages/
- Put components into src/components/
- The main page (default page) is src/pages/Index.tsx
- UPDATE the main page to include the new components. OTHERWISE, the user can NOT see any components!
- ALWAYS try to use the shadcn/ui library.
- Tailwind CSS: always use Tailwind CSS for styling components. Utilize Tailwind classes extensively for layout, spacing, colors, and other design aspects.
Available packages and libraries:
- The lucide-react package is installed for icons.
- You ALREADY have ALL the shadcn/ui components and their dependencies installed. So you don't need to install them again.
- You have ALL the necessary Radix UI components installed.
- Use prebuilt components from the shadcn/ui library after importing them. Note that these files shouldn't be edited, so make new components if you need to change them.
${BUILD_SYSTEM_POSTFIX}
# Referenced Apps
The user has mentioned the following apps in their prompt: minimal-with-ai-rules. Their codebases have been included in the context for your reference. When referring to these apps, you can understand their structure and code to provide better assistance, however you should NOT edit the files in these referenced apps. The referenced apps are NOT part of the current app and are READ-ONLY.
If the user wants to use supabase or do something that requires auth, database or server-side functions (e.g. loading API keys, secrets),
tell them that they need to add supabase to their app.
The following response will show a button that allows the user to add supabase to their app.
<dyad-add-integration provider="supabase"></dyad-add-integration>
# Examples
## Example 1: User wants to use Supabase
### User prompt
I want to use supabase in my app.
### Assistant response
You need to first add Supabase to your app.
<dyad-add-integration provider="supabase"></dyad-add-integration>
## Example 2: User wants to add auth to their app
### User prompt
I want to add auth to my app.
### Assistant response
You need to first add Supabase to your app and then we can add auth.
<dyad-add-integration provider="supabase"></dyad-add-integration>
===
role: user
message:
# Referenced Apps
These are the other apps that I've mentioned in my prompt. These other apps' codebases are READ-ONLY.
=== Referenced App: minimal-with-ai-rules ===
<dyad-file path=".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?
</dyad-file>
<dyad-file path="AI_RULES.md">
[[beginning of AI_RULES.md]]
There's already AI rules...
[[end of AI_RULES.md]]
</dyad-file>
<dyad-file path="index.html">
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>dyad-generated-app</title>
</head>
<body>
<div id="root"></div>
<script type="module" src="/src/main.tsx"></script>
</body>
</html>
</dyad-file>
<dyad-file path="src/App.tsx">
const App = () => <div>Minimal imported app</div>;
export default App;
</dyad-file>
<dyad-file path="src/main.tsx">
import { createRoot } from "react-dom/client";
import App from "./App.tsx";
createRoot(document.getElementById("root")!).render(<App />);
</dyad-file>
<dyad-file path="src/vite-env.d.ts">
/// <reference types="vite/client" />
</dyad-file>
<dyad-file path="tsconfig.app.json">
// File contents excluded from context
</dyad-file>
<dyad-file path="tsconfig.json">
// File contents excluded from context
</dyad-file>
<dyad-file path="tsconfig.node.json">
// File contents excluded from context
</dyad-file>
<dyad-file path="vite.config.ts">
import { defineConfig } from "vite";
import react from "@vitejs/plugin-react-swc";
import path from "path";
export default defineConfig(() => ({
server: {
host: "::",
port: 8080,
},
plugins: [react()],
resolve: {
alias: {
"@": path.resolve(__dirname, "./src"),
},
},
}));
</dyad-file>
===
role: assistant
message: OK.
===
role: user
message: [dump] @app:minimal-with-ai-rules hi

File diff suppressed because it is too large Load Diff

View File

@@ -0,0 +1,4 @@
- paragraph: tc=chat1
- paragraph: chat1
- button "Retry":
- img

View File

@@ -0,0 +1 @@
- text: No messages yet

View File

@@ -0,0 +1,4 @@
- paragraph: tc=chat2
- paragraph: chat2
- button "Retry":
- img

View File

@@ -0,0 +1,4 @@
- paragraph: tc=chat1
- paragraph: chat1
- button "Retry":
- img

View File

@@ -0,0 +1 @@
- text: No messages yet

View File

@@ -0,0 +1,4 @@
- paragraph: tc=chat2
- paragraph: chat2
- button "Retry":
- img

View File

@@ -0,0 +1,8 @@
- paragraph: hi
- img
- text: file1.txt
- img
- text: file1.txt
- paragraph: More EOM
- button "Retry":
- img

View File

@@ -0,0 +1,192 @@
=== .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?
=== file1.txt ===
A file (2)
=== index.html ===
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>dyad-generated-app</title>
</head>
<body>
<div id="root"></div>
<script type="module" src="/src/main.tsx"></script>
</body>
</html>
=== 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": {
"react": "^18.3.1",
"react-dom": "^18.3.1"
},
"devDependencies": {
"@types/node": "^22.5.5",
"@types/react": "^18.3.3",
"@types/react-dom": "^18.3.0",
"@vitejs/plugin-react-swc": "^3.9.0",
"typescript": "^5.5.3",
"vite": "^6.3.4"
},
"packageManager": "<scrubbed>"
}
=== src/App.tsx ===
const App = () => <div>Minimal imported app</div>;
export default App;
=== src/main.tsx ===
import { createRoot } from "react-dom/client";
import App from "./App.tsx";
createRoot(document.getElementById("root")!).render(<App />);
=== src/new-file.ts ===
const a = "[[STRING_TO_BE_FINISHED]]
[[STRING_IS_FINISHED]]";
=== src/vite-env.d.ts ===
/// <reference types="vite/client" />
=== 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 react from "@vitejs/plugin-react-swc";
import path from "path";
export default defineConfig(() => ({
server: {
host: "::",
port: 8080,
},
plugins: [react()],
resolve: {
alias: {
"@": path.resolve(__dirname, "./src"),
},
},
}));

View File

@@ -0,0 +1,21 @@
- paragraph: /Generate an AI_RULES\.md file for this app\. Describe the tech stack in 5-\d+ bullet points and describe clear rules about what libraries to use for what\./
- img
- text: file1.txt
- img
- text: file1.txt
- paragraph: More EOM
- img
- text: Approved
- paragraph: tc=partial-write
- paragraph: START OF MESSAGE
- img
- text: new-file.ts
- img
- text: "src/new-file.ts Summary: this file will be partially written"
- paragraph: "[[dyad-dump-path=*]]"
- img
- text: Approved
- button "Undo":
- img
- button "Retry":
- img

View File

@@ -0,0 +1,191 @@
===
role: system
message:
${BUILD_SYSTEM_PREFIX}
# Tech Stack
- You are building a React application.
- Use TypeScript.
- Use React Router. KEEP the routes in src/App.tsx
- Always put source code in the src folder.
- Put pages into src/pages/
- Put components into src/components/
- The main page (default page) is src/pages/Index.tsx
- UPDATE the main page to include the new components. OTHERWISE, the user can NOT see any components!
- ALWAYS try to use the shadcn/ui library.
- Tailwind CSS: always use Tailwind CSS for styling components. Utilize Tailwind classes extensively for layout, spacing, colors, and other design aspects.
Available packages and libraries:
- The lucide-react package is installed for icons.
- You ALREADY have ALL the shadcn/ui components and their dependencies installed. So you don't need to install them again.
- You have ALL the necessary Radix UI components installed.
- Use prebuilt components from the shadcn/ui library after importing them. Note that these files shouldn't be edited, so make new components if you need to change them.
${BUILD_SYSTEM_POSTFIX}
If the user wants to use supabase or do something that requires auth, database or server-side functions (e.g. loading API keys, secrets),
tell them that they need to add supabase to their app.
The following response will show a button that allows the user to add supabase to their app.
<dyad-add-integration provider="supabase"></dyad-add-integration>
# Examples
## Example 1: User wants to use Supabase
### User prompt
I want to use supabase in my app.
### Assistant response
You need to first add Supabase to your app.
<dyad-add-integration provider="supabase"></dyad-add-integration>
## Example 2: User wants to add auth to their app
### User prompt
I want to add auth to my app.
### Assistant response
You need to first add Supabase to your app and then we can add auth.
<dyad-add-integration provider="supabase"></dyad-add-integration>
===
role: user
message: This is my codebase. <dyad-file path=".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?
</dyad-file>
<dyad-file path="file1.txt">
// File contents excluded from context
</dyad-file>
<dyad-file path="index.html">
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>dyad-generated-app</title>
</head>
<body>
<div id="root"></div>
<script type="module" src="/src/main.tsx"></script>
</body>
</html>
</dyad-file>
<dyad-file path="src/App.tsx">
const App = () => <div>Minimal imported app</div>;
export default App;
</dyad-file>
<dyad-file path="src/main.tsx">
import { createRoot } from "react-dom/client";
import App from "./App.tsx";
createRoot(document.getElementById("root")!).render(<App />);
</dyad-file>
<dyad-file path="src/vite-env.d.ts">
/// <reference types="vite/client" />
</dyad-file>
<dyad-file path="tsconfig.app.json">
// File contents excluded from context
</dyad-file>
<dyad-file path="tsconfig.json">
// File contents excluded from context
</dyad-file>
<dyad-file path="tsconfig.node.json">
// File contents excluded from context
</dyad-file>
<dyad-file path="vite.config.ts">
import { defineConfig } from "vite";
import react from "@vitejs/plugin-react-swc";
import path from "path";
export default defineConfig(() => ({
server: {
host: "::",
port: 8080,
},
plugins: [react()],
resolve: {
alias: {
"@": path.resolve(__dirname, "./src"),
},
},
}));
</dyad-file>
===
role: assistant
message: OK, got it. I'm ready to help
===
role: user
message: Generate an AI_RULES.md file for this app. Describe the tech stack in 5-10 bullet points and describe clear rules about what libraries to use for what.
===
role: assistant
message: <dyad-write path="file1.txt">
A file (2)
</dyad-write>
More
EOM
===
role: user
message: tc=partial-write
===
role: assistant
message: START OF MESSAGE
<dyad-write path="src/new-file.ts" description="this file will be partially written">
const a = "[[STRING_TO_BE_FINISHED]]

View File

@@ -0,0 +1,62 @@
- paragraph: tc=create-ts-errors
- paragraph: This will get a TypeScript error.
- img
- text: bad-file.ts
- img
- text: "src/bad-file.ts Summary: This will get a TypeScript error."
- paragraph: EOM
- img
- text: Auto-fix5 problems
- img
- img
- text: file1.txt
- img
- text: file1.txt
- paragraph: More EOM
- paragraph: "[[dyad-dump-path=*]]"
- img
- text: Auto-fix5 problems
- img
- img
- text: file1.txt
- img
- text: file1.txt
- paragraph: More EOM
- paragraph: "[[dyad-dump-path=*]]"
- paragraph: "Fix these 3 TypeScript compile-time errors:"
- list:
- listitem: src/bad-file.tsx:2:1 - Cannot find name 'nonExistentFunction1'. (TS2304)
- code: const App = () => <div>Minimal imported app</div>; nonExistentFunction1(); // <-- TypeScript compiler error here nonExistentFunction2();
- list:
- listitem: src/bad-file.tsx:3:1 - Cannot find name 'nonExistentFunction2'. (TS2304)
- code: nonExistentFunction1(); nonExistentFunction2(); // <-- TypeScript compiler error here nonExistentFunction3();
- list:
- listitem: src/bad-file.tsx:4:1 - Cannot find name 'nonExistentFunction3'. (TS2304)
- code: nonExistentFunction2(); nonExistentFunction3(); // <-- TypeScript compiler error here
- paragraph: Please fix all errors in a concise way.
- img
- text: file1.txt
- img
- text: file1.txt
- paragraph: More EOM
- paragraph: "[[dyad-dump-path=*]]"
- img
- text: Auto-fix3 problems
- img
- img
- text: file1.txt
- img
- text: file1.txt
- paragraph: More EOM
- paragraph: "[[dyad-dump-path=*]]"
- img
- text: Auto-fix3 problems
- img
- img
- text: file1.txt
- img
- text: file1.txt
- paragraph: More EOM
- paragraph: "[[dyad-dump-path=*]]"
- button "Retry":
- img

Some files were not shown because too many files have changed in this diff Show More