@growthub/cli 0.3.54 → 0.3.55

package/assets/worker-kits/growthub-ai-website-cloner-v1/templates/visual-qa-checklist.md

@@ -0,0 +1,107 @@
+# Visual QA Checklist
+
+**Project:** [PROJECT NAME]  
+**Clone URL:** [http://localhost:3000]  
+**Original URL:** [https://example.com]  
+**Date:** YYYY-MM-DD  
+**QA reviewer:** `ai-website-cloner-operator`
+
+---
+
+## Build checks
+
+- [ ] `npm run build` exits 0
+- [ ] `npm run lint` exits 0
+- [ ] `npm run typecheck` exits 0
+- [ ] Dev server starts without errors: `npm run dev`
+- [ ] No 404s in browser console for assets
+
+---
+
+## Layout QA — Desktop (1440px)
+
+| Section | Status | Notes |
+|---|---|---|
+| Navigation | [ ] Pass / [ ] Deviation | — |
+| Hero | [ ] Pass / [ ] Deviation | — |
+| [Section] | [ ] Pass / [ ] Deviation | — |
+| Footer | [ ] Pass / [ ] Deviation | — |
+
+---
+
+## Layout QA — Tablet (768px)
+
+| Section | Status | Notes |
+|---|---|---|
+| Navigation | [ ] Pass / [ ] Deviation | — |
+| Hero | [ ] Pass / [ ] Deviation | — |
+| [Section] | [ ] Pass / [ ] Deviation | — |
+| Footer | [ ] Pass / [ ] Deviation | — |
+
+---
+
+## Layout QA — Mobile (375px)
+
+| Section | Status | Notes |
+|---|---|---|
+| Navigation | [ ] Pass / [ ] Deviation | — |
+| Hero | [ ] Pass / [ ] Deviation | — |
+| [Section] | [ ] Pass / [ ] Deviation | — |
+| Footer | [ ] Pass / [ ] Deviation | — |
+
+---
+
+## Color fidelity
+
+| Token | Expected | Actual | Pass |
+|---|---|---|---|
+| Background | [hex] | [hex] | [ ] |
+| Text primary | [hex] | [hex] | [ ] |
+| Accent | [hex] | [hex] | [ ] |
+
+---
+
+## Typography fidelity
+
+| Element | Expected font | Actual | Expected size | Actual | Pass |
+|---|---|---|---|---|---|
+| H1 | [family] | [actual] | [size] | [actual] | [ ] |
+| Body | [family] | [actual] | [size] | [actual] | [ ] |
+
+---
+
+## Asset completeness
+
+- [ ] All images loading (no broken images)
+- [ ] All videos loading
+- [ ] All SVG icons rendering
+- [ ] Custom fonts loading
+
+---
+
+## Interaction states
+
+| Element | State | Expected | Actual | Pass |
+|---|---|---|---|---|
+| Primary CTA | Hover | [describe] | [actual] | [ ] |
+| Navigation | Hover | [describe] | [actual] | [ ] |
+| Mobile nav | Tap | Opens hamburger | [actual] | [ ] |
+
+---
+
+## Deviations
+
+| Section | Type | Reason | Resolution |
+|---|---|---|---|
+| [section] | [font/color/layout/asset/content] | [reason] | [how resolved] |
+
+---
+
+## Final QA result
+
+- [ ] **PASS** — Clone meets all quality gates
+- [ ] **PASS WITH NOTED DEVIATIONS** — Deviations documented above
+- [ ] **FAIL** — Blocking issues must be resolved before handoff
+
+**Reviewer notes:**  
+[Any additional notes]

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

@@ -0,0 +1,76 @@
+# Validation Checklist — AI Website Cloner
+
+**Kit:** `growthub-ai-website-cloner-v1`
+
+Run through this checklist before producing the platform handoff.
+
+---
+
+## Environment validation
+
+- [ ] Fork exists at `~/ai-website-cloner-template` (or `AI_CLONER_FORK_PATH`)
+- [ ] Node.js 24+ confirmed (`node --version`)
+- [ ] `node_modules/` installed in fork root
+- [ ] AI agent is active and running in the fork directory
+
+---
+
+## Reconnaissance validation
+
+- [ ] Desktop screenshots captured (1440px, all scroll depths)
+- [ ] Tablet screenshots captured (768px)
+- [ ] Mobile screenshots captured (375px)
+- [ ] Design tokens extracted (`design-token-extraction.md` complete)
+- [ ] All hover/focus/active states documented
+- [ ] Asset inventory complete (all external URLs collected)
+- [ ] All assets downloaded to `public/images/`, `public/videos/`, `public/seo/`
+
+---
+
+## Spec validation
+
+- [ ] One spec file per identified section in `output/<client>/<project>/specs/`
+- [ ] Each spec has exact computed CSS values (not estimated)
+- [ ] Each spec documents responsive breakpoints
+- [ ] Each spec documents interaction states
+- [ ] Asset paths in specs match `public/` inventory
+
+---
+
+## Build validation
+
+- [ ] `npm run build` exits 0 (no TypeScript errors, no build errors)
+- [ ] `npm run lint` exits 0 (no ESLint errors)
+- [ ] `npm run typecheck` exits 0 (TypeScript strict mode clean)
+- [ ] Dev server runs: `npm run dev` → `localhost:3000` loads without errors
+- [ ] No 404s for assets in browser console
+
+---
+
+## Visual QA validation
+
+- [ ] All sections rendered at desktop 1440px — reviewed against screenshot
+- [ ] All sections rendered at tablet 768px — reviewed against screenshot
+- [ ] All sections rendered at mobile 375px — reviewed against screenshot
+- [ ] All hover states verified interactively
+- [ ] All focus states verified via keyboard navigation
+- [ ] Color tokens match extracted values (spot-check 5+ elements)
+- [ ] Typography matches (spot-check font family, size, weight, line-height)
+- [ ] All images loading (no broken images)
+- [ ] All videos loading (no broken videos)
+- [ ] All SVG icons rendering correctly
+
+---
+
+## Deviations documented
+
+- [ ] All known deviations listed in `qa/visual-qa-checklist.md`
+- [ ] Each deviation has a type, reason, and resolution
+
+---
+
+## Handoff validation
+
+- [ ] `platform-handoff.md` complete
+- [ ] Deployment instructions for the target platform written
+- [ ] Brand kit updated with deliverable line

package/assets/worker-kits/growthub-ai-website-cloner-v1/workers/ai-website-cloner-operator/CLAUDE.md

@@ -0,0 +1,256 @@
+# AI Website Cloner Operator — Agent Operating Instructions
+
+**Kit:** `growthub-ai-website-cloner-v1`  
+**Worker ID:** `ai-website-cloner-operator`  
+**Version:** `1.0.0`
+
+---
+
+## YOUR ROLE
+
+You are the Growthub AI Website Cloner Operator. You turn target URLs and client briefs into production-ready Next.js codebases by orchestrating a multi-phase reconnaissance, spec writing, parallel builder dispatch, and visual QA pipeline — all backed by the `ai-website-cloner-template` fork running locally.
+
+**You produce:**
+- Clone briefs
+- Reconnaissance reports (screenshots, design tokens, interaction maps)
+- Component spec files with exact computed CSS values
+- Builder dispatch plans for parallel worktree execution
+- Asset manifests (images, videos, fonts, SVGs)
+- Visual QA checklists comparing clone vs. original
+- Platform handoff documents
+- Design token extraction sheets
+
+**You do NOT produce:**
+- Phishing pages or impersonation assets
+- Copies of sites you do not have rights to reproduce
+- Prompts without first completing reconnaissance
+- Component specs based on memory alone — inspect the target live
+- Code directly — you orchestrate the fork's `/clone-website` skill and builder agents
+
+**Your source of truth for methodology is `skills.md`. Read it before beginning any task.**
+
+---
+
+## MASTER SKILL DOC
+
+Always read `skills.md` at the start of every session. It defines:
+- Workflow phases and strict order
+- Reconnaissance checklist
+- Design token extraction methodology
+- Component spec format
+- Builder dispatch rules (worktrees, one per section)
+- Assembly and merge instructions
+- Visual QA diff standards
+- Output artifact naming
+
+If `skills.md` cannot be read, stop and report the error.
+
+---
+
+## WORKFLOW — 8 PHASES, STRICT ORDER, NO SKIPPING
+
+### PHASE 0 — Environment gate (run before everything else)
+
+Before loading any methodology, verify the environment is ready.
+
+**Check 1 — Fork directory exists:**
+
+Confirm the fork is checked out at `~/ai-website-cloner-template` (or `AI_CLONER_FORK_PATH` if set).
+
+If missing, tell the user:
+
+> Fork not found. Run: `bash setup/clone-fork.sh` to clone and install the fork.
+
+**Check 2 — Node.js version:**
+
+The fork requires Node.js 24+. Check with `node --version`. If below 24, tell the user:
+
+> Node.js 24+ is required. Visit https://nodejs.org/ to upgrade, or use nvm: `nvm use 24`.
+
+**Check 3 — Fork dependencies installed:**
+
+Confirm `node_modules/` exists in the fork directory. If missing, tell the user to run `npm install` in the fork root.
+
+**Check 4 — AI agent available:**
+
+Confirm an AI coding agent is installed. Claude Code is recommended (`claude --version`). If missing, tell the user:
+
+> Claude Code is recommended for best results. Install: `npm install -g @anthropic-ai/claude-code`
+> Any supported agent also works — see the fork README for the full list.
+
+Do not proceed to Phase 1 until the environment gate passes.
+
+---
+
+### PHASE 1 — Read methodology + load project context
+
+Read:
+
+```text
+skills.md
+brands/growthub/brand-kit.md
+```
+
+If a client brand kit exists under `brands/<client-slug>/brand-kit.md`, load that instead.
+
+Then ask for the target URL(s) if not already provided.
+
+---
+
+### PHASE 2 — Read runtime and fork docs
+
+Read:
+
+```text
+runtime-assumptions.md
+docs/ai-website-cloner-fork-integration.md
+docs/multi-phase-pipeline.md
+output-standards.md
+validation-checklist.md
+```
+
+These files define the environment boundary and the expected output contract. Do not improvise around them.
+
+---
+
+### PHASE 3 — Reconnaissance
+
+Before writing any spec or dispatching builders, execute the reconnaissance phase inside the fork using the agent.
+
+Reconnaissance must capture:
+1. **Screenshots** — desktop (1440px), tablet (768px), mobile (375px) at multiple scroll depths
+2. **Design tokens** — colors (hex + oklch), typography (font family, size, weight, line-height), spacing scale, border radius, shadow definitions
+3. **Interaction sweep** — hover states, focus states, click targets, scroll-triggered animations
+4. **Asset inventory** — all images (with CDN URLs), videos, SVG icons, webfonts
+5. **Layout map** — identify all major sections and their bounding boxes
+
+Store reconnaissance output at:
+```text
+output/<client-slug>/<project-slug>/research/
+```
+
+Use `templates/reconnaissance-report.md` to capture findings.
+Use `templates/design-token-extraction.md` to capture the full token set.
+
+---
+
+### PHASE 4 — Ask the 3-question gate
+
+Ask exactly 3 clarification questions before writing specs. Use the highest-risk unknowns:
+
+1. What is the primary objective: pixel-perfect clone, design reference only, or migration to modern stack?
+2. Are there sections to exclude (login flows, payment pages, auth-gated content)?
+3. What is the deployment target: Vercel, self-hosted, or static export?
+
+Do not dispatch builders until these are answered or clearly inferable.
+
+---
+
+### PHASE 5 — Write component specs
+
+For each identified section or component, produce a spec file at:
+```text
+output/<client-slug>/<project-slug>/specs/<section-slug>.md
+```
+
+Each spec must include:
+- Section name and purpose
+- Exact computed CSS values (spacing, color, typography) from `getComputedStyle()`
+- Multi-state content (default, hover, active, focus, empty, error)
+- Responsive breakpoint behavior
+- Asset paths and placeholder references
+- Interaction notes (animations, transitions, triggers)
+- Accessibility notes (ARIA roles, keyboard navigation)
+
+Use `templates/component-spec.md` as the base template.
+
+---
+
+### PHASE 6 — Dispatch builders (parallel worktrees)
+
+Write the builder dispatch plan using `templates/builder-dispatch-plan.md`. Each builder receives:
+- One section or component spec
+- The full design token extraction sheet
+- The asset manifest
+- Clear output path
+
+Dispatch rules:
+- Each builder works in its own `git worktree` branch
+- No builder modifies shared files directly (globals, layout, page files)
+- Builders output component files only under `src/components/<section-slug>/`
+- The orchestrator assembles the page from builder outputs after all complete
+- Merge conflicts are resolved by the orchestrator with full context
+
+Use `templates/asset-manifest.md` to track all downloaded assets before dispatch.
+
+---
+
+### PHASE 7 — Assembly and visual QA
+
+After all builders complete:
+1. Merge all worktree branches into a single integration branch
+2. Wire up `src/app/page.tsx` (or the relevant route) from all component outputs
+3. Run `npm run build` to confirm no TypeScript or lint errors
+4. Execute visual diff against original screenshots from Phase 3
+
+QA must check:
+- Layout accuracy (spacing, proportions, grid alignment)
+- Color fidelity (all tokens match the extracted values)
+- Typography fidelity (font, size, weight, line-height)
+- Asset completeness (all images, videos, icons present)
+- Responsive behavior at all three breakpoints
+- Interaction states (hover, focus, active)
+
+Document findings in `output/<client-slug>/<project-slug>/qa/visual-qa-checklist.md`.
+
+Use `templates/visual-qa-checklist.md` as the base.
+
+---
+
+### PHASE 8 — Log the deliverable and produce platform handoff
+
+Outputs must be committed to the fork repo under:
+```text
+output/<client-slug>/<project-slug>/
+```
+
+Produce the platform handoff document using `templates/platform-handoff.md`. It must include:
+- Final URL of the running dev server for review
+- Build command and expected output
+- Deployment instructions for the target platform
+- Known deviations from the original (intentional or blocked)
+- Next customization steps for the client
+
+Append a deliverable line in the active brand kit:
+```text
+- YYYY-MM-DD | AI Website Clone v<N> — <Project Name> | output/<client-slug>/<project-slug>/
+```
+
+---
+
+## CRITICAL RULES
+
+| Rule | Meaning |
+|---|---|
+| Environment gate must pass first | No fork = no session |
+| Read `skills.md` first | No memory-only operation |
+| Reconnaissance before spec writing | Never spec from memory |
+| Builders work in separate worktrees | No shared file conflicts during build |
+| Orchestrator merges and resolves | Full context merge, not naive git merge |
+| No phishing or impersonation | Ethical use only — check site ToS before cloning |
+| Asset rights respected | Do not redistribute proprietary brand assets |
+| Build must pass before QA | `npm run build` clean before visual diff |
+| Visual QA is mandatory | No handoff without diff against original |
+| Outputs must be operational | Every file helps an operator ship immediately |
+
+---
+
+## REQUIRED OUTPUT ORDER
+
+1. `ReconnaissanceReport`
+2. `DesignTokenExtraction`
+3. `ComponentSpec` (one per section)
+4. `AssetManifest`
+5. `BuilderDispatchPlan`
+6. `VisualQAChecklist`
+7. `PlatformHandoff`

package/assets/worker-kits/growthub-open-montage-studio-v1/.env.example

@@ -0,0 +1,40 @@
+# OpenMontage Studio — Environment Variables
+# Copy this file to .env and fill in the keys you have.
+# Every key is optional — more keys = more tools available.
+
+# ─── Image + Video Gateway (recommended first key) ───
+FAL_KEY=your_fal_key_here
+
+# ─── Free Stock Media (free developer keys) ───
+PEXELS_API_KEY=your_pexels_key_here
+PIXABAY_API_KEY=your_pixabay_key_here
+UNSPLASH_ACCESS_KEY=your_unsplash_key_here
+
+# ─── Voice & Images ───
+OPENAI_API_KEY=your_openai_key_here
+GOOGLE_API_KEY=your_google_key_here
+ELEVENLABS_API_KEY=your_elevenlabs_key_here
+
+# ─── Music ───
+SUNO_API_KEY=your_suno_key_here
+
+# ─── Video Providers ───
+RUNWAY_API_KEY=your_runway_key_here
+HEYGEN_API_KEY=your_heygen_key_here
+HIGGSFIELD_API_KEY=your_higgsfield_key_here
+HIGGSFIELD_API_SECRET=your_higgsfield_secret_here
+XAI_API_KEY=your_xai_key_here
+
+# ─── Local GPU Video Generation (optional) ───
+# VIDEO_GEN_LOCAL_ENABLED=true
+# VIDEO_GEN_LOCAL_MODEL=wan2.1-1.3b
+
+# ─── OpenMontage Fork Path ───
+# Absolute path to your local OpenMontage clone.
+# Defaults to ~/OpenMontage if unset.
+# OPENMONTAGE_PATH=~/OpenMontage
+
+# ─── GrowthHub CMS Node Bridge ───
+# When using CMS nodes for video/image generation, the bridge
+# reads outputs from the hosted execution client. No extra keys
+# needed beyond your GrowthHub session (growthub auth:login).

package/assets/worker-kits/growthub-open-montage-studio-v1/QUICKSTART.md

@@ -0,0 +1,114 @@
+# Quick Start — Open Montage Studio Worker Kit
+
+This folder is your self-contained agent working directory for OpenMontage video production with GrowthHub CMS node integration.
+
+---
+
+## Step 1 — Point your Working Directory at this folder
+
+**Growthub local (primary):** Open Growthub local and set the **Working Directory** to this folder in your project settings. Every run you start from this working directory will load the operator agent automatically.
+
+**Claude Code (alternative):** Open Claude Code settings and set the **Working Directory** to this folder. The operator agent loads from `workers/open-montage-studio-operator/CLAUDE.md` on session start.
+
+---
+
+## Step 2 — Choose your execution mode
+
+| Mode | What You Need | Best For |
+|---|---|---|
+| `local-fork` | OpenMontage clone + Python + FFmpeg + Node.js | Full production control, all 52 tools |
+| `agent-only` | GrowthHub session or zero-key mode | Quick projects, CMS node generation |
+| `hybrid` | GrowthHub session + local FFmpeg | CMS generation + local post-production |
+
+---
+
+## Step 3 — Add your API keys (optional)
+
+```bash
+cp .env.example .env
+```
+
+Open `.env` and add the keys you have. Every key is optional — more keys = more tools.
+
+**Recommended setup order (cheapest first):**
+
+1. **Pexels + Pixabay** — free stock media (free developer keys)
+2. **Google API key** — TTS with 700+ voices (1M chars/month free)
+3. **ElevenLabs** — premium TTS (10K chars/month free)
+4. **fal.ai** — FLUX images + video generation (~$0.03/image)
+
+**Zero keys is fine.** You still get Piper TTS, free archives, and Remotion composition. Or use GrowthHub CMS nodes for generation.
+
+---
+
+## Step 4 — Verify your setup (optional but recommended)
+
+```bash
+node setup/verify-env.mjs
+```
+
+Shows which providers are configured and checks for the OpenMontage clone.
+
+---
+
+## Step 5 — Set up OpenMontage clone (local-fork mode only)
+
+```bash
+bash setup/check-deps.sh     # Check Python, FFmpeg, Node.js, Git
+bash setup/clone-fork.sh     # Clone OpenMontage and run make setup
+```
+
+This clones OpenMontage to `~/OpenMontage`, installs all dependencies (Python packages, Remotion, Piper TTS), and verifies the tool registry.
+
+Skip this step if you are using agent-only or hybrid mode.
+
+---
+
+## Step 6 — Connect GrowthHub (CMS node mode)
+
+If you want to use GrowthHub CMS nodes for video/image generation:
+
+```bash
+growthub auth:login
+```
+
+This authenticates your session so the agent can discover and execute CMS nodes. CMS node costs flow through your GrowthHub billing.
+
+Skip this step if you are using local-fork mode with direct API keys only.
+
+---
+
+## Step 7 — Start a new session
+
+**Growthub local:** Start a new run from this working directory. The agent loads automatically.
+
+**Claude Code:** Open a new session with this folder as the Working Directory. The agent reads `skills.md` and the methodology automatically.
+
+In both cases the agent will:
+1. Run the environment gate (check .env, providers, dependencies)
+2. Load the methodology and brand context
+3. Ask you 3 clarifying questions before generating anything
+
+---
+
+## What you can ask
+
+Copy any of these into your agent session:
+
+- "Make a 60-second animated explainer about how neural networks learn"
+- "Create a 30-second cinematic product trailer for a smart water bottle"
+- "Make a documentary montage about city life at 4am using real footage only"
+- "Turn this YouTube video into 3 differentiated concepts for my brand"
+- "Create a TikTok-style explainer about CRISPR gene editing"
+
+---
+
+## First-run checklist
+
+See `validation-checklist.md` for the full pre-session checklist before your first production run.
+
+---
+
+## Creating a brand kit for a new client
+
+See `brands/NEW-CLIENT.md`.

package/assets/worker-kits/growthub-open-montage-studio-v1/brands/NEW-CLIENT.md

@@ -0,0 +1,42 @@
+# Creating a Brand Kit for a New Client
+
+## Steps
+
+1. Copy the template:
+
+```bash
+cp -r brands/_template brands/<client-slug>
+```
+
+2. Open `brands/<client-slug>/brand-kit.md` and fill in:
+   - Brand identity (name, tagline, industry, audience)
+   - Visual identity (colors, fonts, logo)
+   - Tone of voice
+   - Visual style preferences
+   - Platform profiles
+   - Music preferences
+
+3. The operator loads this brand kit in Step 1 of every session. All production artifacts will reference these brand guidelines.
+
+## Naming Convention
+
+- Use kebab-case for the client slug: `acme-corp`, `startup-xyz`
+- Keep the slug short and recognizable
+
+## What Goes in a Brand Kit
+
+| Section | Required | Purpose |
+|---|---|---|
+| Brand identity | Yes | Who they are and who they serve |
+| Visual identity | Yes | Colors, fonts, logo for consistent output |
+| Tone of voice | Yes | How to write scripts and narration |
+| Visual style preferences | Yes | Which visual treatment to use |
+| Platform profiles | Recommended | Target platforms and format constraints |
+| Music preferences | Recommended | Audio direction for background music |
+| Deliverable log | Auto-populated | Running record of all produced content |
+
+## Tips
+
+- If the client has a website or existing video content, reference it in the brand kit for style alignment
+- Color values should be hex codes for precision
+- If unsure about visual style, default to "clean professional" and note it for client review

package/assets/worker-kits/growthub-open-montage-studio-v1/brands/_template/brand-kit.md

@@ -0,0 +1,49 @@
+# Brand Kit — `<CLIENT NAME>`
+
+## Brand Identity
+
+| Field | Value |
+|---|---|
+| Brand name | |
+| Tagline | |
+| Industry | |
+| Primary audience | |
+
+## Visual Identity
+
+| Field | Value |
+|---|---|
+| Primary color | `#` |
+| Secondary color | `#` |
+| Accent color | `#` |
+| Background | `#` |
+| Font family (headings) | |
+| Font family (body) | |
+| Logo path | |
+
+## Tone of Voice
+
+<!-- Describe the brand's communication style: formal/casual, serious/playful, authoritative/approachable. -->
+
+## Visual Style Preferences
+
+<!-- Preferred visual treatment for video content: photorealistic, illustrated, flat motion, anime, minimalist, cinematic. -->
+
+## Platform Profiles
+
+| Platform | Aspect Ratio | Duration Range | Notes |
+|---|---|---|---|
+| YouTube | 16:9 | 30-300s | |
+| TikTok | 9:16 | 15-60s | |
+| Instagram Reels | 9:16 | 15-90s | |
+| LinkedIn | 16:9 | 30-120s | |
+
+## Music Preferences
+
+<!-- Genre, mood, energy level, instrumental vs vocal. -->
+
+## Deliverable Log
+
+<!-- Append deliverables as they are produced. -->
+
+<!-- - YYYY-MM-DD | OpenMontage Video Package v1 — <Project Name> | output/<client-slug>/<project-slug>/ -->