@techwavedev/agi-agent-kit 1.1.3 → 1.1.7

package/templates/skills/knowledge/stitch-loop/examples/next-prompt.md

@@ -0,0 +1,25 @@
+---
+page: contact
+---
+A warm, inviting contact page for Oakwood Furniture Co.
+
+**DESIGN SYSTEM (REQUIRED):**
+- Platform: Web, Desktop-first
+- Theme: Light, minimal, photography-first
+- Background: Warm barely-there cream (#FCFAFA)
+- Surface: Crisp very light gray (#F5F5F5) for cards
+- Primary Accent: Deep muted teal-navy (#294056) for buttons and links
+- Text Primary: Charcoal near-black (#2C2C2C) for headlines
+- Text Secondary: Soft warm gray (#6B6B6B) for body copy
+- Font: Modern sans-serif (Manrope or similar), clean and approachable
+- Buttons: Subtly rounded corners (8px), comfortable padding
+- Cards: Gently rounded corners (12px), whisper-soft shadows on hover
+- Layout: Centered content, max-width container, generous whitespace
+- No harsh shadows, no aggressive colors - serene and trustworthy
+
+**Page Structure:**
+1. **Header:** Navigation with logo, Shop, Collections, About, Contact (active)
+2. **Hero Section:** Warm headline "Get in Touch" with a brief welcome message
+3. **Contact Form:** Name, email, message fields with the teal-navy submit button
+4. **Showroom Info:** Address, hours, and an embedded map or beautiful showroom photo
+5. **Footer:** Sustainability, Craftsmanship, Shipping links, and social icons

package/templates/skills/knowledge/stitch-loop/resources/baton-schema.md

@@ -0,0 +1,61 @@
+# Baton File Schema
+
+The baton file (`next-prompt.md`) is the communication mechanism between loop iterations. It tells the next agent what to build.
+
+## Format
+
+```yaml
+---
+page: <filename-without-extension>
+---
+<prompt-content>
+```
+
+## Fields
+
+### Frontmatter (YAML)
+
+| Field | Type | Required | Description |
+|-------|------|----------|-------------|
+| `page` | string | Yes | Output filename (without `.html` extension) |
+
+### Body (Markdown)
+
+The body contains the full Stitch prompt, which must include:
+
+1. **One-line description** with vibe/atmosphere keywords
+2. **Design System block** (required) — copied from `DESIGN.md` Section 6
+3. **Page Structure** — numbered list of sections/components
+
+## Example
+
+```markdown
+---
+page: achievements
+---
+A competitive, gamified achievements page with terminal aesthetics.
+
+**DESIGN SYSTEM (REQUIRED):**
+- Platform: Web, Desktop-first
+- Theme: Dark, minimal, data-focused
+- Background: Deep charcoal/near-black (#0f1419)
+- Primary Accent: Teal/Cyan (#2dd4bf)
+- Text Primary: White (#ffffff)
+- Font: Clean sans-serif (Inter, SF Pro, or system default)
+- Layout: Centered content, max-width container
+
+**Page Structure:**
+1. Header with title "Achievements" and navigation
+2. Badge grid showing locked/unlocked states with icons
+3. Progress section with milestone bars
+4. Footer with links to other pages
+```
+
+## Validation Rules
+
+Before completing an iteration, validate your baton:
+
+- [ ] `page` frontmatter field exists and is a valid filename
+- [ ] Prompt includes the design system block
+- [ ] Prompt describes a page NOT already in `SITE.md` sitemap
+- [ ] Prompt includes specific page structure details

package/templates/skills/knowledge/stitch-loop/resources/site-template.md

@@ -0,0 +1,104 @@
+# Site Template
+
+Use these templates when setting up a new project for the build loop.
+
+## SITE.md Template
+
+```markdown
+# Project Vision & Constitution
+
+> **AGENT INSTRUCTION:** Read this file before every iteration. It serves as the project's "Long-Term Memory."
+
+## 1. Core Identity
+* **Project Name:** [Your project name]
+* **Stitch Project ID:** [Your Stitch project ID]
+* **Mission:** [What the site achieves]
+* **Target Audience:** [Who uses this site]
+* **Voice:** [Tone and personality descriptors]
+
+## 2. Visual Language
+*Reference these descriptors when prompting Stitch.*
+
+* **The "Vibe" (Adjectives):**
+    * *Primary:* [Main aesthetic keyword]
+    * *Secondary:* [Supporting aesthetic]
+    * *Tertiary:* [Additional flavor]
+
+## 3. Architecture & File Structure
+* **Root:** `site/public/`
+* **Asset Flow:** Stitch generates to `queue/` → Validate → Move to `site/public/`
+* **Navigation Strategy:** [How nav works]
+
+## 4. Live Sitemap (Current State)
+*Update this when a new page is successfully merged.*
+
+* [x] `index.html` - [Description]
+* [ ] `about.html` - [Description]
+
+## 5. The Roadmap (Backlog)
+*Pick the next task from here if available.*
+
+### High Priority
+- [ ] [Task description]
+- [ ] [Task description]
+
+### Medium Priority
+- [ ] [Task description]
+
+## 6. Creative Freedom Guidelines
+*When the backlog is empty, follow these guidelines to innovate.*
+
+1. **Stay On-Brand:** New pages must fit the established vibe
+2. **Enhance the Core:** Support the site mission
+3. **Naming Convention:** Use lowercase, descriptive filenames
+
+### Ideas to Explore
+*Pick one, build it, then REMOVE it from this list.*
+
+- [ ] `stats.html` - [Description]
+- [ ] `settings.html` - [Description]
+
+## 7. Rules of Engagement
+1. Do not recreate pages in Section 4
+2. Always update `next-prompt.md` before completing
+3. Consume ideas from Section 6 when you use them
+```
+
+## DESIGN.md Template
+
+Generate this using the `design-md` skill from an existing Stitch screen, or create manually:
+
+```markdown
+# Design System: [Project Name]
+**Project ID:** [Stitch Project ID]
+
+## 1. Visual Theme & Atmosphere
+[Describe mood, density, aesthetic philosophy]
+
+## 2. Color Palette & Roles
+- **[Descriptive Name]** (#hexcode) – [Functional role]
+- **[Descriptive Name]** (#hexcode) – [Functional role]
+
+## 3. Typography Rules
+[Font family, weights, sizes, spacing]
+
+## 4. Component Stylings
+* **Buttons:** [Shape, color, behavior]
+* **Cards:** [Corners, background, shadows]
+* **Inputs:** [Stroke, background, focus states]
+
+## 5. Layout Principles
+[Whitespace strategy, margins, grid alignment]
+
+## 6. Design System Notes for Stitch Generation
+**Copy this block into every baton prompt:**
+
+**DESIGN SYSTEM (REQUIRED):**
+- Platform: [Web/Mobile], [Desktop/Mobile]-first
+- Theme: [Dark/Light], [descriptors]
+- Background: [Description] (#hex)
+- Primary Accent: [Description] (#hex)
+- Text Primary: [Description] (#hex)
+- Font: [Description]
+- Layout: [Description]
+```

package/templates/skills/react-components/README.md

@@ -0,0 +1,36 @@
+# Stitch to React Components Skill
+
+## Install
+
+```bash
+npx add-skill google-labs-code/stitch-skills --skill react:components --global
+```
+
+## Example Prompt
+
+```text
+Convert my Landing Page screen in my Podcast Stitch Project to a React component system.
+```
+
+## Skill Structure
+
+This repository follows the **Agent Skills** open standard. Each skill is self-contained with its own logic, validation scripts, and design tokens.
+
+```text
+skills/react-components/
+├── SKILL.md           — Core instructions & workflow
+├── package.json       — Validator dependencies
+├── scripts/           — Networking & AST validation
+├── resources/         — Style guides & API references
+└── examples/          — Gold-standard code samples
+```
+
+## How it Works
+
+When activated, the agent follows a high-fidelity engineering pipeline:
+
+1. **Retrieval**: Uses a system-level `curl` script to bypass TLS/SNI issues on Google Cloud Storage.
+2. **Mapping**: Cross-references Stitch metadata with the local `style-guide.json` to ensure token consistency.
+3. **Generation**: Scaffolds components using a strict Atomic Design pattern.
+4. **Validation**: Runs an automated AST check using `@swc/core` to prevent hardcoded hex values or missing interfaces.
+5. **Audit**: Performs a final self-correction check against a 20-point architecture checklist.

package/templates/skills/react-components/SKILL.md

@@ -0,0 +1,53 @@
+---
+name: react:components
+description: Converts Stitch designs into modular Vite and React components using system-level networking and AST-based validation.
+allowed-tools:
+  - "stitch*:*"
+  - "Bash"
+  - "Read"
+  - "Write"
+  - "web_fetch"
+  - "qdrant-memory"
+---
+
+# Stitch to React Components
+
+You are a frontend engineer focused on transforming designs into clean React code. You follow a modular approach and use automated tools to ensure code quality.
+
+## Retrieval and networking
+
+1. **Namespace discovery**: Run `list_tools` to find the Stitch MCP prefix. Use this prefix (e.g., `stitch:`) for all subsequent calls.
+2. **Metadata fetch**: Call `[prefix]:get_screen` to retrieve the design JSON.
+3. **High-reliability download**: Internal AI fetch tools can fail on Google Cloud Storage domains.
+   - Use the `Bash` tool to run: `bash scripts/fetch-stitch.sh "[htmlCode.downloadUrl]" "temp/source.html"`.
+   - This script handles the necessary redirects and security handshakes.
+4. **Visual audit**: Check `screenshot.downloadUrl` to confirm the design intent and layout details.
+
+## Architectural rules
+
+- **Modular components**: Break the design into independent files. Avoid large, single-file outputs.
+- **Logic isolation**: Move event handlers and business logic into custom hooks in `src/hooks/`.
+- **Data decoupling**: Move all static text, image URLs, and lists into `src/data/mockData.ts`.
+- **Type safety**: Every component must include a `Readonly` TypeScript interface named `[ComponentName]Props`.
+- **Project specific**: Focus on the target project's needs and constraints. Leave Google license headers out of the generated React components.
+- **Style mapping**:
+  - Extract the `tailwind.config` from the HTML `<head>`.
+  - Sync these values with `resources/style-guide.json`.
+  - Use theme-mapped Tailwind classes instead of arbitrary hex codes.
+
+## Execution steps
+
+1. **Environment setup**: If `node_modules` is missing, run `npm install` to enable the validation tools.
+2. **Data layer**: Create `src/data/mockData.ts` based on the design content.
+3. **Pattern Retrieval (Optional)**: If **qdrant-memory** is available, search for existing components (`type: "code"`) to reuse patterns or interfaces.
+4. **Component drafting**: Use `resources/component-template.tsx` as a base. Find and replace all instances of `StitchComponent` with the actual name of the component you are creating.
+5. **Application wiring**: Update the project entry point (like `App.tsx`) to render the new components.
+6. **Quality check**:
+   - Run `npm run validate <file_path>` for each component.
+   - Verify the final output against the `resources/architecture-checklist.md`.
+   - Start the dev server with `npm run dev` to verify the live result.
+
+## Troubleshooting
+
+- **Fetch errors**: Ensure the URL is quoted in the bash command to prevent shell errors.
+- **Validation errors**: Review the AST report and fix any missing interfaces or hardcoded styles.

package/templates/skills/react-components/examples/gold-standard-card.tsx

@@ -0,0 +1,80 @@
+/**
+ * Copyright 2026 Google LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import React from 'react';
+// Note for Agent: The '@' alias refers to the target project's src directory.
+// Ensure src/data/mockData.ts is created before generating this component.
+import { cardData } from '../data/mockData';
+
+/**
+ * Gold Standard: ActivityCard
+ * This file serves as the definitive reference for the agent.
+ */
+interface ActivityCardProps {
+  readonly id: string;
+  readonly username: string;
+  readonly action: 'MERGED' | 'COMMIT';
+  readonly timestamp: string;
+  readonly avatarUrl: string;
+  readonly repoName: string;
+}
+
+export const ActivityCard: React.FC<ActivityCardProps> = ({
+  username,
+  action,
+  timestamp,
+  avatarUrl,
+  repoName,
+}) => {
+  const isMerged = action === 'MERGED';
+
+  return (
+    <div className="flex items-center justify-between gap-4 rounded-lg bg-surface-dark p-4 min-h-14 shadow-sm ring-1 ring-white/10">
+      <div className="flex items-center gap-4 overflow-hidden">
+        <div
+          className="aspect-square h-10 w-10 flex-shrink-0 rounded-full bg-cover bg-center bg-no-repeat"
+          style={{ backgroundImage: `url(${avatarUrl})` }}
+          aria-label={`Avatar for ${username}`}
+        />
+
+        <div className="flex flex-wrap items-center gap-x-2 gap-y-1 text-sm sm:text-base">
+          <a href="#" className="font-semibold text-primary hover:underline truncate">
+            {username}
+          </a>
+
+          <span className={`inline-block px-2 py-0.5 text-xs font-semibold rounded-full ${isMerged ? 'bg-purple-500/30 text-purple-300' : 'bg-primary/30 text-primary'
+            }`}>
+            {action}
+          </span>
+
+          <span className="text-white/60">in</span>
+
+          <a href="#" className="text-primary hover:underline truncate">
+            {repoName}
+          </a>
+        </div>
+      </div>
+
+      <div className="shrink-0">
+        <p className="text-sm font-normal leading-normal text-white/50">
+          {timestamp}
+        </p>
+      </div>
+    </div>
+  );
+};
+
+export default ActivityCard;

package/templates/skills/react-components/package-lock.json

@@ -0,0 +1,231 @@
+{
+  "name": "stitch-to-react-pro",
+  "version": "1.0.0",
+  "lockfileVersion": 3,
+  "requires": true,
+  "packages": {
+    "": {
+      "name": "stitch-to-react-pro",
+      "version": "1.0.0",
+      "dependencies": {
+        "@swc/core": "^1.3.100"
+      },
+      "engines": {
+        "node": ">=18.0.0"
+      }
+    },
+    "node_modules/@swc/core": {
+      "version": "1.15.8",
+      "resolved": "https://registry.npmjs.org/@swc/core/-/core-1.15.8.tgz",
+      "integrity": "sha512-T8keoJjXaSUoVBCIjgL6wAnhADIb09GOELzKg10CjNg+vLX48P93SME6jTfte9MZIm5m+Il57H3rTSk/0kzDUw==",
+      "hasInstallScript": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@swc/counter": "^0.1.3",
+        "@swc/types": "^0.1.25"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/swc"
+      },
+      "optionalDependencies": {
+        "@swc/core-darwin-arm64": "1.15.8",
+        "@swc/core-darwin-x64": "1.15.8",
+        "@swc/core-linux-arm-gnueabihf": "1.15.8",
+        "@swc/core-linux-arm64-gnu": "1.15.8",
+        "@swc/core-linux-arm64-musl": "1.15.8",
+        "@swc/core-linux-x64-gnu": "1.15.8",
+        "@swc/core-linux-x64-musl": "1.15.8",
+        "@swc/core-win32-arm64-msvc": "1.15.8",
+        "@swc/core-win32-ia32-msvc": "1.15.8",
+        "@swc/core-win32-x64-msvc": "1.15.8"
+      },
+      "peerDependencies": {
+        "@swc/helpers": ">=0.5.17"
+      },
+      "peerDependenciesMeta": {
+        "@swc/helpers": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@swc/core-darwin-arm64": {
+      "version": "1.15.8",
+      "resolved": "https://registry.npmjs.org/@swc/core-darwin-arm64/-/core-darwin-arm64-1.15.8.tgz",
+      "integrity": "sha512-M9cK5GwyWWRkRGwwCbREuj6r8jKdES/haCZ3Xckgkl8MUQJZA3XB7IXXK1IXRNeLjg6m7cnoMICpXv1v1hlJOg==",
+      "cpu": [
+        "arm64"
+      ],
+      "license": "Apache-2.0 AND MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/@swc/core-darwin-x64": {
+      "version": "1.15.8",
+      "resolved": "https://registry.npmjs.org/@swc/core-darwin-x64/-/core-darwin-x64-1.15.8.tgz",
+      "integrity": "sha512-j47DasuOvXl80sKJHSi2X25l44CMc3VDhlJwA7oewC1nV1VsSzwX+KOwE5tLnfORvVJJyeiXgJORNYg4jeIjYQ==",
+      "cpu": [
+        "x64"
+      ],
+      "license": "Apache-2.0 AND MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/@swc/core-linux-arm-gnueabihf": {
+      "version": "1.15.8",
+      "resolved": "https://registry.npmjs.org/@swc/core-linux-arm-gnueabihf/-/core-linux-arm-gnueabihf-1.15.8.tgz",
+      "integrity": "sha512-siAzDENu2rUbwr9+fayWa26r5A9fol1iORG53HWxQL1J8ym4k7xt9eME0dMPXlYZDytK5r9sW8zEA10F2U3Xwg==",
+      "cpu": [
+        "arm"
+      ],
+      "license": "Apache-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/@swc/core-linux-arm64-gnu": {
+      "version": "1.15.8",
+      "resolved": "https://registry.npmjs.org/@swc/core-linux-arm64-gnu/-/core-linux-arm64-gnu-1.15.8.tgz",
+      "integrity": "sha512-o+1y5u6k2FfPYbTRUPvurwzNt5qd0NTumCTFscCNuBksycloXY16J8L+SMW5QRX59n4Hp9EmFa3vpvNHRVv1+Q==",
+      "cpu": [
+        "arm64"
+      ],
+      "license": "Apache-2.0 AND MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/@swc/core-linux-arm64-musl": {
+      "version": "1.15.8",
+      "resolved": "https://registry.npmjs.org/@swc/core-linux-arm64-musl/-/core-linux-arm64-musl-1.15.8.tgz",
+      "integrity": "sha512-koiCqL09EwOP1S2RShCI7NbsQuG6r2brTqUYE7pV7kZm9O17wZ0LSz22m6gVibpwEnw8jI3IE1yYsQTVpluALw==",
+      "cpu": [
+        "arm64"
+      ],
+      "license": "Apache-2.0 AND MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/@swc/core-linux-x64-gnu": {
+      "version": "1.15.8",
+      "resolved": "https://registry.npmjs.org/@swc/core-linux-x64-gnu/-/core-linux-x64-gnu-1.15.8.tgz",
+      "integrity": "sha512-4p6lOMU3bC+Vd5ARtKJ/FxpIC5G8v3XLoPEZ5s7mLR8h7411HWC/LmTXDHcrSXRC55zvAVia1eldy6zDLz8iFQ==",
+      "cpu": [
+        "x64"
+      ],
+      "license": "Apache-2.0 AND MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/@swc/core-linux-x64-musl": {
+      "version": "1.15.8",
+      "resolved": "https://registry.npmjs.org/@swc/core-linux-x64-musl/-/core-linux-x64-musl-1.15.8.tgz",
+      "integrity": "sha512-z3XBnbrZAL+6xDGAhJoN4lOueIxC/8rGrJ9tg+fEaeqLEuAtHSW2QHDHxDwkxZMjuF/pZ6MUTjHjbp8wLbuRLA==",
+      "cpu": [
+        "x64"
+      ],
+      "license": "Apache-2.0 AND MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/@swc/core-win32-arm64-msvc": {
+      "version": "1.15.8",
+      "resolved": "https://registry.npmjs.org/@swc/core-win32-arm64-msvc/-/core-win32-arm64-msvc-1.15.8.tgz",
+      "integrity": "sha512-djQPJ9Rh9vP8GTS/Df3hcc6XP6xnG5c8qsngWId/BLA9oX6C7UzCPAn74BG/wGb9a6j4w3RINuoaieJB3t+7iQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "license": "Apache-2.0 AND MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/@swc/core-win32-ia32-msvc": {
+      "version": "1.15.8",
+      "resolved": "https://registry.npmjs.org/@swc/core-win32-ia32-msvc/-/core-win32-ia32-msvc-1.15.8.tgz",
+      "integrity": "sha512-/wfAgxORg2VBaUoFdytcVBVCgf1isWZIEXB9MZEUty4wwK93M/PxAkjifOho9RN3WrM3inPLabICRCEgdHpKKQ==",
+      "cpu": [
+        "ia32"
+      ],
+      "license": "Apache-2.0 AND MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/@swc/core-win32-x64-msvc": {
+      "version": "1.15.8",
+      "resolved": "https://registry.npmjs.org/@swc/core-win32-x64-msvc/-/core-win32-x64-msvc-1.15.8.tgz",
+      "integrity": "sha512-GpMePrh9Sl4d61o4KAHOOv5is5+zt6BEXCOCgs/H0FLGeii7j9bWDE8ExvKFy2GRRZVNR1ugsnzaGWHKM6kuzA==",
+      "cpu": [
+        "x64"
+      ],
+      "license": "Apache-2.0 AND MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/@swc/counter": {
+      "version": "0.1.3",
+      "resolved": "https://registry.npmjs.org/@swc/counter/-/counter-0.1.3.tgz",
+      "integrity": "sha512-e2BR4lsJkkRlKZ/qCHPw9ZaSxc0MVUd7gtbtaB7aMvHeJVYe8sOB8DBZkP2DtISHGSku9sCK6T6cnY0CtXrOCQ==",
+      "license": "Apache-2.0"
+    },
+    "node_modules/@swc/types": {
+      "version": "0.1.25",
+      "resolved": "https://registry.npmjs.org/@swc/types/-/types-0.1.25.tgz",
+      "integrity": "sha512-iAoY/qRhNH8a/hBvm3zKj9qQ4oc2+3w1unPJa2XvTK3XjeLXtzcCingVPw/9e5mn1+0yPqxcBGp9Jf0pkfMb1g==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@swc/counter": "^0.1.3"
+      }
+    }
+  }
+}

package/templates/skills/react-components/package.json

@@ -0,0 +1,16 @@
+{
+  "name": "react-components",
+  "version": "1.0.0",
+  "description": "Design-to-code prompt to React components for Stitch MCP",
+  "type": "module",
+  "scripts": {
+    "validate": "node scripts/validate.js",
+    "fetch": "bash scripts/fetch-stitch.sh"
+  },
+  "dependencies": {
+    "@swc/core": "^1.3.100"
+  },
+  "engines": {
+    "node": ">=18.0.0"
+  }
+}

package/templates/skills/react-components/resources/architecture-checklist.md

@@ -0,0 +1,15 @@
+# Architecture Quality Gate
+
+### Structural integrity
+- [ ] Logic extracted to custom hooks in `src/hooks/`.
+- [ ] No monolithic files; strictly Atomic/Composite modularity.
+- [ ] All static text/URLs moved to `src/data/mockData.ts`.
+
+### Type safety and syntax
+- [ ] Props use `Readonly<T>` interfaces.
+- [ ] File is syntactically valid TypeScript (no red squiggles).
+- [ ] Placeholders from templates (e.g., `StitchComponent`) have been replaced with actual names.
+
+### Styling and theming
+- [ ] Dark mode (`dark:`) applied to all color classes.
+- [ ] No hardcoded hex values; use theme-mapped Tailwind classes.