// Agentic Component Factory — build multiple Kiso components in parallel using builder and reviewer agents in isolated worktrees. Usage: /factory #47 #48 or /factory #47 #48 #49 (pass issue numbers)
Build UIs with Kiso — accessible Rails UI components with Tailwind CSS theming. Use when creating interfaces, customizing themes, building forms, or composing page layouts in Rails + Hotwire apps.
Kiso component conventions and development workflow. Points to the right docs for building, reviewing, and shipping components.
Audit all documentation for staleness after code changes. Checks docs site, CLAUDE.md, skills references, contributing skill, agents, and project/ files. Use after completing a feature, merging a PR, or when asked to check docs.
Guide through releasing a new version of kiso. Use when cutting a release, publishing a new version, or running bin/release.
Build a Kiso component from scratch. Reads shadcn/Nuxt UI sources, creates theme module, ERB partials, Lookbook previews, docs, E2E tests. Use when building a new component or picking up where a previous attempt left off.
Review a Kiso component for quality and consistency. Runs the 12-point checklist against shadcn source, design system rules, and deliverables. Use on a PR, branch, or working directory.
| name | component-factory |
| description | Agentic Component Factory — build multiple Kiso components in parallel using builder and reviewer agents in isolated worktrees. Usage: /factory #47 #48 or /factory #47 #48 #49 (pass issue numbers) |
Build components in parallel using the builder and reviewer agents.
Parse the issue numbers from the user's input (e.g., /factory #47 #48).
For each issue, read it with gh issue view N to get the component name.
For each issue, spawn a builder agent in a worktree:
Agent(
subagent_type: "component-builder",
isolation: "worktree",
mode: "bypassPermissions",
prompt: "Build the component for issue #N. Run `gh issue view N` for requirements."
)
Spawn all builders in parallel (one Agent call per issue, all in the same message).
When a builder completes, you receive:
worktree_path and branch — returned automatically by the Agent
tool's worktree isolation. These are in the structured tool result, not the
text output.Derive the ports (the builder left servers running):
cd <worktree_path> && bin/worktree port lookbook
cd <worktree_path> && bin/worktree port docs
From the worktree, push the branch and create the PR:
cd <worktree_path> && git push -u origin <branch>
Then create the PR using the title and body from the builder's output.
The body MUST include Closes #N:
cd <worktree_path> && gh pr create --title "<title>" --body "$(cat <<'EOF'
<body from builder output>
EOF
)"
Print the Lookbook and docs URLs clearly so the user can click to review each component visually. Format:
Preview servers ready:
- ComponentA
Lookbook → http://localhost:<lb_port_a>/lookbook/inspect/kiso/<name_a>/playground
Docs → http://localhost:<docs_port_a>/components/<name_a>
- ComponentB
Lookbook → http://localhost:<lb_port_b>/lookbook/inspect/kiso/<name_b>/playground
Docs → http://localhost:<docs_port_b>/components/<name_b>
For each PR created, spawn a reviewer agent. The reviewer does NOT need
worktree isolation — it reads the PR diff via gh:
Agent(
subagent_type: "component-reviewer",
mode: "bypassPermissions",
prompt: "Review PR #<pr_number> for the <ComponentName> component. Use `gh pr diff <pr_number>` to read the changes."
)
Spawn reviewers in the background so the user can start reviewing in Lookbook while reviews run.
Summarize for each component:
After the user is done reviewing and all PRs are merged or closed, stop Lookbook in each worktree:
cd <worktree_path> && bin/worktree stop
The builder starts Lookbook and docs in its worktree (bin/worktree start)
and leaves them running. The factory does NOT restart them. Instead:
cd <worktree_path> && bin/worktree port lookbook and bin/worktree port docsEach worktree gets deterministic ports (Lookbook 4101-4600, docs 4601-5100) based on its directory name. No port conflicts. The user can open all components side-by-side.
/factory #47 #48
/factory #47 #48 #49 #50