@growthub/cli 0.3.53 → 0.3.55

package/assets/worker-kits/growthub-ai-website-cloner-v1/kit.json

@@ -0,0 +1,105 @@
+{
+  "schemaVersion": 2,
+  "kit": {
+    "id": "growthub-ai-website-cloner-v1",
+    "version": "1.0.0",
+    "name": "Growthub Agent Worker Kit — AI Website Cloner",
+    "description": "Self-contained local workspace for cloning any website into a clean Next.js 16 + shadcn/ui + Tailwind CSS v4 codebase using AI coding agents. Produces pixel-perfect component clones from a target URL via multi-phase reconnaissance, spec writing, parallel builder dispatch, and visual QA — all driven by the ai-website-cloner-template fork.",
+    "type": "worker",
+    "visibility": "public-open-source",
+    "sourceRepo": "growthub-local",
+    "family": "studio"
+  },
+  "entrypoint": {
+    "workerId": "ai-website-cloner-operator",
+    "path": "workers/ai-website-cloner-operator/CLAUDE.md"
+  },
+  "workerIds": [
+    "ai-website-cloner-operator"
+  ],
+  "agentContractPath": "workers/ai-website-cloner-operator/CLAUDE.md",
+  "brandTemplatePath": "brands/_template/brand-kit.md",
+  "publicExampleBrandPaths": [
+    "brands/growthub/brand-kit.md"
+  ],
+  "frozenAssetPaths": [
+    "QUICKSTART.md",
+    ".env.example",
+    "skills.md",
+    "output-standards.md",
+    "runtime-assumptions.md",
+    "validation-checklist.md",
+    "workers/ai-website-cloner-operator/CLAUDE.md",
+    "brands/_template/brand-kit.md",
+    "brands/growthub/brand-kit.md",
+    "brands/NEW-CLIENT.md",
+    "setup/clone-fork.sh",
+    "setup/verify-env.mjs",
+    "setup/check-deps.sh",
+    "output/README.md",
+    "templates/clone-brief.md",
+    "templates/reconnaissance-report.md",
+    "templates/component-spec.md",
+    "templates/builder-dispatch-plan.md",
+    "templates/asset-manifest.md",
+    "templates/visual-qa-checklist.md",
+    "templates/platform-handoff.md",
+    "templates/design-token-extraction.md",
+    "examples/clone-brief-sample.md",
+    "examples/component-spec-sample.md",
+    "examples/visual-qa-sample.md",
+    "examples/platform-handoff-sample.md",
+    "docs/ai-website-cloner-fork-integration.md",
+    "docs/multi-phase-pipeline.md",
+    "docs/parallel-builder-dispatch.md",
+    "docs/design-token-system.md",
+    "growthub-meta/README.md",
+    "growthub-meta/kit-standard.md"
+  ],
+  "setupPaths": {
+    "quickstart": "QUICKSTART.md",
+    "envExample": ".env.example",
+    "setupDir": "setup/",
+    "outputDir": "output/"
+  },
+  "outputStandard": {
+    "type": "working-directory",
+    "description": "Exported folder is intended to be pointed at directly by the agent Working Directory. All outputs are Markdown files written to output/<client-slug>/<project-slug>/.",
+    "requiredPaths": [
+      "QUICKSTART.md",
+      ".env.example",
+      "kit.json",
+      "bundles/growthub-ai-website-cloner-v1.json",
+      "skills.md",
+      "workers/ai-website-cloner-operator/CLAUDE.md",
+      "brands/_template/brand-kit.md",
+      "brands/growthub/brand-kit.md",
+      "brands/NEW-CLIENT.md",
+      "setup/clone-fork.sh",
+      "setup/verify-env.mjs",
+      "setup/check-deps.sh",
+      "output/README.md",
+      "templates",
+      "docs",
+      "growthub-meta"
+    ]
+  },
+  "bundles": [
+    {
+      "id": "growthub-ai-website-cloner-v1",
+      "version": "1.0.0",
+      "path": "bundles/growthub-ai-website-cloner-v1.json"
+    }
+  ],
+  "executionMode": "export",
+  "activationModes": [
+    "export"
+  ],
+  "compatibility": {
+    "cliMinVersion": "0.3.54"
+  },
+  "provenance": {
+    "sourceRepo": "growthub-local",
+    "frozenAt": "2026-04-15T00:00:00.000Z"
+  }
+}

package/assets/worker-kits/growthub-ai-website-cloner-v1/output/README.md

@@ -0,0 +1,26 @@
+# Output Directory
+
+This directory holds all work products from the AI Website Cloner operator.
+
+## Structure
+
+```
+output/
+  <client-slug>/
+    <project-slug>/
+      research/
+        reconnaissance-report.md   # Screenshots documented, design tokens noted
+        design-token-extraction.md  # Complete token set with oklch conversions
+        asset-inventory.md          # All external assets collected
+      specs/
+        <section-slug>.md           # One file per cloned section (exact CSS values)
+      qa/
+        visual-qa-checklist.md      # QA results vs. original screenshots
+      platform-handoff.md           # Deployment-ready instructions
+```
+
+## Notes
+
+- Never commit client brand assets or proprietary content to this repository.
+- All files in `output/` are generated work products, not source-controlled code.
+- Add `output/<client-slug>/` to `.gitignore` for client-confidential projects.

package/assets/worker-kits/growthub-ai-website-cloner-v1/output-standards.md

@@ -0,0 +1,75 @@
+# Output Standards — AI Website Cloner
+
+**Kit:** `growthub-ai-website-cloner-v1`
+
+---
+
+## Output directory structure
+
+All work products are stored inside the `ai-website-cloner-template` fork repository:
+
+```
+~/ai-website-cloner-template/
+  output/
+    <client-slug>/
+      <project-slug>/
+        research/
+          reconnaissance-report.md
+          design-token-extraction.md
+          asset-inventory.md
+        specs/
+          <section-slug>.md       (one per identified section)
+        qa/
+          visual-qa-checklist.md
+        platform-handoff.md
+```
+
+---
+
+## Naming conventions
+
+| Artifact | Naming pattern |
+|---|---|
+| Client slug | lowercase-kebab-case, e.g. `acme-corp` |
+| Project slug | lowercase-kebab-case, e.g. `homepage-clone` |
+| Section slug | lowercase-kebab-case matching section name, e.g. `hero-section` |
+| Component files | PascalCase under `src/components/<section-slug>/`, e.g. `HeroSection.tsx` |
+
+---
+
+## Required deliverables per project
+
+Every completed clone project must have:
+
+1. `reconnaissance-report.md` — screenshots documented, tokens noted
+2. `design-token-extraction.md` — complete token set with oklch conversions
+3. One `specs/<section-slug>.md` per section cloned
+4. `asset-inventory.md` — all external assets downloaded to `public/`
+5. `qa/visual-qa-checklist.md` — completed with pass/deviation notes
+6. `platform-handoff.md` — deployment-ready instructions
+
+---
+
+## Quality gates
+
+Before producing the platform handoff, the following must pass:
+
+- `npm run build` — TypeScript compilation and Next.js build succeeds
+- `npm run lint` — ESLint passes with no errors
+- `npm run typecheck` — TypeScript strict mode passes
+- Visual diff — all sections visually reviewed against original screenshots
+
+---
+
+## Deviation logging
+
+If a section cannot be cloned exactly (auth-gated content, missing assets, proprietary fonts), log the deviation in `visual-qa-checklist.md` under the "Deviations" section:
+
+```markdown
+## Deviations
+
+| Section | Type | Reason | Resolution |
+|---|---|---|---|
+| hero-section | Font | Proprietary font not available | Replaced with closest system font; documented |
+| pricing-table | Auth | Pricing content behind login | Placeholder content with noted limitation |
+```

package/assets/worker-kits/growthub-ai-website-cloner-v1/runtime-assumptions.md

@@ -0,0 +1,70 @@
+# Runtime Assumptions — AI Website Cloner
+
+**Kit:** `growthub-ai-website-cloner-v1`
+
+---
+
+## Fork assumptions
+
+This kit assumes the `ai-website-cloner-template` fork is checked out and installed:
+
+| Assumption | Default | Override |
+|---|---|---|
+| Fork directory | `~/ai-website-cloner-template` | `AI_CLONER_FORK_PATH` env var |
+| Fork repo URL | `https://github.com/JCodesMore/ai-website-cloner-template` | n/a |
+| Node.js version | 24+ (strict) | n/a — minimum requirement |
+| Package manager | npm | n/a |
+| Dev server port | 3000 | Configurable via Next.js CLI |
+
+---
+
+## Tech stack (locked by fork)
+
+The fork uses a locked stack. Do not deviate inside the clone output:
+
+| Layer | Version |
+|---|---|
+| Next.js | 16 (App Router, React 19) |
+| TypeScript | strict mode |
+| shadcn/ui | Latest at fork commit |
+| Tailwind CSS | v4 |
+| Design tokens | oklch color space |
+| Icons | Lucide React (default) + extracted SVGs |
+
+---
+
+## Agent assumptions
+
+- The AI coding agent is running in the fork's root directory
+- The agent can access the internet for screenshots and asset downloads
+- The agent can spawn parallel subagents / worktrees for builder dispatch
+- Claude Code with `--chrome` flag is the recommended setup (enables browser automation)
+
+---
+
+## What the fork's `/clone-website` skill does
+
+The skill is defined in `.claude/skills/clone-website/SKILL.md` (and synced to other agents).
+When invoked by the operator, it:
+
+1. Opens Chrome DevTools (via `--chrome` flag for Claude Code, or Playwright for other agents)
+2. Navigates to the target URL
+3. Captures screenshots at all viewports
+4. Extracts design tokens via `getComputedStyle()` console calls
+5. Downloads all external assets to `public/`
+6. Writes component specs to `docs/research/components/`
+7. Dispatches builder subagents in git worktrees
+8. Merges and assembles the page
+9. Runs visual QA
+
+---
+
+## Ethical use constraints
+
+This kit must not be used to:
+- Create phishing pages or impersonation sites
+- Clone sites with explicit prohibitions on reproduction in their Terms of Service
+- Redistribute proprietary brand assets or copy
+- Pass off cloned designs as original work
+
+These constraints are enforced by operator instruction, not technical controls. The operator must verify site terms before initiating a clone.

package/assets/worker-kits/growthub-ai-website-cloner-v1/setup/check-deps.sh

@@ -0,0 +1,50 @@
+#!/usr/bin/env bash
+# check-deps.sh — Verify all dependencies for the AI Website Cloner
+set -e
+
+echo "=== AI Website Cloner — Dependency Check ==="
+echo ""
+
+OK=0
+
+check_cmd() {
+  local cmd="$1"
+  local label="$2"
+  local hint="$3"
+  if command -v "$cmd" &>/dev/null; then
+    echo "  OK   $label ($cmd: $(command -v "$cmd"))"
+  else
+    echo "  MISS $label — $hint"
+    OK=1
+  fi
+}
+
+check_version() {
+  local cmd="$1"
+  local label="$2"
+  local min_major="$3"
+  local hint="$4"
+  if command -v "$cmd" &>/dev/null; then
+    local version
+    version=$("$cmd" --version 2>&1 | head -1)
+    echo "  OK   $label ($version)"
+  else
+    echo "  MISS $label (required: $min_major+) — $hint"
+    OK=1
+  fi
+}
+
+check_version "node" "Node.js 24+" "24" "https://nodejs.org/"
+check_cmd "npm" "npm" "Included with Node.js"
+check_cmd "git" "git" "https://git-scm.com/"
+
+echo ""
+echo "Optional — recommended for Chrome/screenshot automation:"
+check_cmd "claude" "Claude Code" "npm install -g @anthropic-ai/claude-code"
+
+echo ""
+if [ "$OK" -eq 0 ]; then
+  echo "All required dependencies are present."
+else
+  echo "Some dependencies are missing. Install them before running the fork setup."
+fi

package/assets/worker-kits/growthub-ai-website-cloner-v1/setup/clone-fork.sh

@@ -0,0 +1,66 @@
+#!/usr/bin/env bash
+# clone-fork.sh — Clone and boot the ai-website-cloner-template fork
+# Run from any location. Installs to ~/ai-website-cloner-template (or AI_CLONER_FORK_PATH).
+set -e
+
+FORK_DIR="${AI_CLONER_FORK_PATH:-$HOME/ai-website-cloner-template}"
+REPO_URL="https://github.com/JCodesMore/ai-website-cloner-template.git"
+
+echo "=== Growthub AI Website Cloner — Fork Setup ==="
+echo ""
+
+if [ -d "$FORK_DIR" ]; then
+  echo "Fork already exists at $FORK_DIR — skipping clone."
+  echo "To re-clone, remove the directory first: rm -rf $FORK_DIR"
+else
+  echo "Cloning ai-website-cloner-template → $FORK_DIR"
+  git clone "$REPO_URL" "$FORK_DIR"
+  echo "Clone complete."
+fi
+
+echo ""
+echo "Installing dependencies..."
+cd "$FORK_DIR"
+npm install
+echo "Dependencies installed."
+
+echo ""
+echo "Checking Node.js version..."
+NODE_VERSION=$(node --version | sed 's/v//' | cut -d. -f1)
+if [ "$NODE_VERSION" -lt 24 ]; then
+  echo "WARNING: Node.js $NODE_VERSION detected. Node.js 24+ is required."
+  echo "Visit https://nodejs.org/ to upgrade, or use nvm: nvm use 24"
+else
+  echo "Node.js $(node --version) — OK"
+fi
+
+echo ""
+echo "Verifying fork structure..."
+STRUCTURE_OK=0
+for item in src/app src/components src/lib package.json next.config.ts; do
+  if [ -e "$FORK_DIR/$item" ]; then
+    echo "  OK   $item"
+  else
+    echo "  MISS $item"
+    STRUCTURE_OK=1
+  fi
+done
+
+echo ""
+if [ "$STRUCTURE_OK" -eq 0 ]; then
+  echo "Fork is ready at $FORK_DIR"
+  echo ""
+  echo "Next steps:"
+  echo "  1. Point your AI agent at the Growthub kit directory (this folder)"
+  echo "  2. Start Claude Code with: claude --chrome"
+  echo "  3. Run the clone skill: /clone-website <target-url>"
+  echo ""
+  echo "Dev server (after cloning a site):"
+  echo "  cd $FORK_DIR && npm run dev"
+else
+  echo "Fork cloned at $FORK_DIR — some expected files may differ in this version."
+  echo "Check the fork's README for the current structure."
+fi
+
+echo ""
+echo "Fork location: $FORK_DIR"

package/assets/worker-kits/growthub-ai-website-cloner-v1/setup/verify-env.mjs

@@ -0,0 +1,78 @@
+#!/usr/bin/env node
+// verify-env.mjs — Verify the AI Website Cloner environment is ready
+import { existsSync } from "node:fs";
+import { execSync } from "node:child_process";
+import { resolve } from "node:path";
+import { homedir } from "node:os";
+
+const FORK_PATH = process.env.AI_CLONER_FORK_PATH || resolve(homedir(), "ai-website-cloner-template");
+
+let passed = 0;
+let failed = 0;
+
+function check(label, pass, detail) {
+  if (pass) {
+    console.log(`  ✓  ${label}`);
+    passed++;
+  } else {
+    console.log(`  ✗  ${label}${detail ? ` — ${detail}` : ""}`);
+    failed++;
+  }
+}
+
+console.log("\nAI Website Cloner — Environment Check");
+console.log("─".repeat(48));
+
+// Check 1: Fork directory
+check(
+  `Fork exists at ${FORK_PATH}`,
+  existsSync(FORK_PATH),
+  `Run: bash setup/clone-fork.sh`
+);
+
+// Check 2: Fork dependencies
+check(
+  "Fork dependencies installed",
+  existsSync(resolve(FORK_PATH, "node_modules")),
+  `Run: cd ${FORK_PATH} && npm install`
+);
+
+// Check 3: Fork structure
+for (const item of ["src/app", "src/components", "src/lib", "package.json", "next.config.ts"]) {
+  check(
+    `Fork has ${item}`,
+    existsSync(resolve(FORK_PATH, item)),
+    "Unexpected fork structure — check fork README"
+  );
+}
+
+// Check 4: Node.js version
+try {
+  const version = process.versions.node.split(".")[0];
+  const isOk = parseInt(version, 10) >= 24;
+  check(
+    `Node.js 24+ (current: ${process.versions.node})`,
+    isOk,
+    "Upgrade at https://nodejs.org/ or use: nvm use 24"
+  );
+} catch {
+  check("Node.js version check", false, "Could not determine version");
+}
+
+// Check 5: Git available
+try {
+  execSync("git --version", { stdio: "ignore" });
+  check("git available", true);
+} catch {
+  check("git available", false, "Install git: https://git-scm.com/");
+}
+
+console.log("─".repeat(48));
+console.log(`  ${passed} passed · ${failed} failed`);
+
+if (failed > 0) {
+  console.log("\n  Run: bash setup/clone-fork.sh  to fix setup issues.\n");
+  process.exit(1);
+} else {
+  console.log("\n  Environment is ready. Start your AI agent and run: /clone-website <url>\n");
+}

package/assets/worker-kits/growthub-ai-website-cloner-v1/skills.md

@@ -0,0 +1,186 @@
+# AI Website Cloner Operator — Skills
+
+**Kit:** `growthub-ai-website-cloner-v1`  
+**Worker ID:** `ai-website-cloner-operator`
+
+---
+
+## SKILL: `/clone-website`
+
+The primary skill. Accepts one or more target URLs and executes the full clone pipeline.
+
+### Invocation
+
+```
+/clone-website <target-url1> [<target-url2> ...]
+```
+
+### Pipeline phases (strict order)
+
+| Phase | Name | Key output |
+|---|---|---|
+| 0 | Environment gate | Pass/fail — fork exists, Node 24+, deps installed |
+| 1 | Reconnaissance | Screenshots, design tokens, interaction map, asset inventory |
+| 2 | Foundation | Design token extraction sheet, fonts, globals, layout scaffold |
+| 3 | Component specs | One spec file per section with exact computed CSS values |
+| 4 | Asset download | All images, videos, SVGs, fonts downloaded to `public/` |
+| 5 | Builder dispatch | Parallel worktrees — one per section/component |
+| 6 | Assembly | Merge all worktrees, wire up route, resolve conflicts |
+| 7 | Visual QA | Diff against original screenshots, document deviations |
+| 8 | Platform handoff | Build verified, deployment instructions, client deliverable |
+
+---
+
+## RECONNAISSANCE CHECKLIST
+
+Before writing any spec, capture all of the following:
+
+### Screenshots
+- Desktop: 1440px wide, full scroll depth (every viewport height of content)
+- Tablet: 768px wide, same depth
+- Mobile: 375px wide, same depth
+- Interactive states: hover states on navigation, CTAs, cards
+
+### Design token extraction
+- Color palette: exact hex values + oklch equivalents for CSS
+- Typography: every font family, size, weight, line-height, letter-spacing combination in use
+- Spacing: all margin/padding values used in the layout (identify the scale)
+- Border radius: all border-radius values
+- Box shadows: all box-shadow definitions
+- Transitions: all transition/animation timing values
+
+### Interaction sweep
+- Navigation: all hover states, dropdowns, mobile hamburger
+- CTAs and buttons: hover, active, focus, disabled states
+- Cards: hover transforms, shadows
+- Scroll-triggered: parallax, fade-ins, stickiness
+- Forms: focus, validation, error states
+
+### Asset inventory
+- All `<img>` src values (CDN URLs)
+- All `<video>` src values
+- All background-image URLs
+- All SVG icons (inline or file)
+- All custom webfont sources
+
+---
+
+## DESIGN TOKEN EXTRACTION METHODOLOGY
+
+Use `getComputedStyle()` in the browser DevTools console to extract exact values:
+
+```js
+// Get all colors used in the page
+[...document.querySelectorAll('*')].flatMap(el => {
+  const s = getComputedStyle(el);
+  return [s.color, s.backgroundColor, s.borderColor].filter(c => c && c !== 'rgba(0, 0, 0, 0)');
+}).filter((v, i, a) => a.indexOf(v) === i);
+```
+
+Document all values in `templates/design-token-extraction.md`. Convert to oklch for Tailwind CSS v4.
+
+---
+
+## COMPONENT SPEC FORMAT
+
+Each spec file must include these sections:
+
+```markdown
+# <SectionName> — Component Spec
+
+## Purpose
+What this section does for the user.
+
+## Layout
+- Container max-width: <value>
+- Padding: <top> <right> <bottom> <left>
+- Display: <flex|grid|block>
+- Grid columns (desktop/tablet/mobile): <values>
+- Gap: <value>
+
+## Typography
+- Heading: <font-family>, <size>/<line-height>, weight <weight>
+- Body: <font-family>, <size>/<line-height>, weight <weight>
+- Caption: <font-family>, <size>/<line-height>, weight <weight>
+
+## Colors
+- Background: <hex> / oklch(<value>)
+- Text primary: <hex> / oklch(<value>)
+- Text secondary: <hex> / oklch(<value>)
+- Accent: <hex> / oklch(<value>)
+- Border: <hex> / oklch(<value>)
+
+## States
+- Default: [describe]
+- Hover: [describe — exact transform, color change, transition timing]
+- Active: [describe]
+- Focus: [describe — focus ring color, offset]
+
+## Responsive
+- Desktop (1440px): [layout description]
+- Tablet (768px): [layout changes]
+- Mobile (375px): [layout changes]
+
+## Assets
+- Image: public/images/<filename>.<ext> — originally from <cdn-url>
+- Icon: src/components/icons.tsx as <IconName>
+
+## Content
+[Exact text content from the target — no placeholders]
+
+## Accessibility
+- ARIA role: <role>
+- Landmark: <nav|main|aside|footer>
+- Tab order: [describe]
+- Keyboard navigation: [describe]
+```
+
+---
+
+## BUILDER DISPATCH RULES
+
+1. Each builder receives exactly one component spec
+2. Each builder works in a fresh `git worktree` on a dedicated branch: `build/<section-slug>`
+3. Builders output files ONLY to `src/components/<section-slug>/`
+4. No builder writes to: `src/app/`, `src/lib/`, `src/types/`, `globals.css`, `layout.tsx`
+5. The orchestrator owns all assembly and shared file writes
+6. After all builders complete, orchestrator merges all `build/*` branches
+7. Merge conflicts are resolved by the orchestrator with full spec context
+8. Assembly order follows the spec list in the dispatch plan
+
+---
+
+## VISUAL QA STANDARDS
+
+A clone passes QA when:
+
+| Criterion | Threshold |
+|---|---|
+| Layout accuracy | All major sections within 2px of original |
+| Color fidelity | All token values match extracted values |
+| Typography | Font family, size, weight identical for all text |
+| Asset completeness | All images, videos, icons present and loading |
+| Responsive | No layout breaks at 1440, 768, 375px |
+| Interaction | All hover/focus/active states visually match |
+| Build | `npm run build` exits 0 with no errors |
+| Lint | `npm run lint` exits 0 |
+
+Any deviation must be documented in `visual-qa-checklist.md` with a reason and resolution.
+
+---
+
+## OUTPUT NAMING
+
+All outputs use the pattern:
+```
+output/<client-slug>/<project-slug>/<artifact-type>.<extension>
+```
+
+Examples:
+```
+output/acme-corp/homepage-clone/research/reconnaissance-report.md
+output/acme-corp/homepage-clone/specs/hero-section.md
+output/acme-corp/homepage-clone/specs/navigation.md
+output/acme-corp/homepage-clone/qa/visual-qa-checklist.md
+output/acme-corp/homepage-clone/platform-handoff.md
+```