@cronus-ui/ai-kit 0.6.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +21 -0
- package/README.md +8 -0
- package/dist/ai-kit.d.ts +78 -0
- package/dist/ai-kit.js +172 -0
- package/dist/index.d.ts +8 -0
- package/dist/index.js +2 -0
- package/package.json +57 -0
- package/templates/AGENTS.agency.md +80 -0
- package/templates/AGENTS.base.md +188 -0
- package/templates/AGENTS.fintech.md +116 -0
- package/templates/AGENTS.oss.md +78 -0
- package/templates/AGENTS.saas.md +88 -0
- package/templates/CLAUDE.md +52 -0
- package/templates/claude/agents/code-reviewer.md +80 -0
- package/templates/claude/settings.json +62 -0
- package/templates/claude/skills/code-review/SKILL.md +65 -0
- package/templates/claude/skills/compose/SKILL.md +156 -0
- package/templates/claude/skills/evidence-check/SKILL.md +39 -0
- package/templates/claude/skills/ship-pr/SKILL.md +66 -0
- package/templates/claude/skills/theme/SKILL.md +94 -0
- package/templates/claude/skills/ui-add/SKILL.md +96 -0
- package/templates/cursor/rules/00-doctrine.mdc +17 -0
- package/templates/cursor/rules/10-cronus-ui.mdc +20 -0
- package/templates/gemini/GEMINI.md +32 -0
- package/templates/github/copilot-instructions.md +27 -0
- package/templates/mcp.json +9 -0
- package/templates/windsurf/rules/doctrine.md +25 -0
|
@@ -0,0 +1,156 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: compose
|
|
3
|
+
description: Scaffold or grow a Cronus UI product (create-cronus-app templates, cronus-ui compose, add-page). Use when the user wants a new app, a new page, a SaaS/store/landing, or to assemble blocks into routes — not when they only want a single primitive.
|
|
4
|
+
argument-hint: "[saas|store|landing|/route]"
|
|
5
|
+
allowed-tools: Bash, Read, Edit, Write
|
|
6
|
+
---
|
|
7
|
+
|
|
8
|
+
# Scaffold or grow a Cronus UI product
|
|
9
|
+
|
|
10
|
+
Cronus UI is a **product UI system**. Prefer assembling a validated app (templates →
|
|
11
|
+
pages of installed blocks) over hand-rolling screens or calling `cronus-ui add` for
|
|
12
|
+
every primitive. One control (button, dialog) is a different skill — defer to `ui-add`.
|
|
13
|
+
|
|
14
|
+
Request: `$ARGUMENTS`
|
|
15
|
+
|
|
16
|
+
## Product loop (preference order)
|
|
17
|
+
|
|
18
|
+
1. **New app** — scaffold a template.
|
|
19
|
+
2. **Grow** — add a page of installed blocks to an already-composed app.
|
|
20
|
+
3. **Theme** — `theme` skill / `npx cronus-ui theme set` / MCP `set_theme` (Create Studio → `apply_theme`).
|
|
21
|
+
4. **One piece** — `npx cronus-ui add <slug>` / MCP `install_component` (the `ui-add` skill).
|
|
22
|
+
5. **Hand-roll** only if the registry has no matching component or block — then with semantic tokens.
|
|
23
|
+
6. **Never** inline a Tailwind palette class (`bg-zinc-900`) or a raw hex.
|
|
24
|
+
7. **Upgrade** — `npx cronus-ui upgrade --all --dry-run` first, then
|
|
25
|
+
`npx cronus-ui upgrade --all`. That pulls **component AND composed page/layout**
|
|
26
|
+
updates without losing local edits (3-way vs `.cronus-ui/base`).
|
|
27
|
+
Do NOT run `compose --overwrite` / `compose -o` to "upgrade" an existing app —
|
|
28
|
+
that wipes page edits. `--overwrite` is only for a fresh re-compose the user
|
|
29
|
+
asked to replace. MCP: `upgrade_components { "dryRun": true }` first, then
|
|
30
|
+
without dryRun. When the app was composed with `--manifest`, include
|
|
31
|
+
`"manifest": "path/to.json"`. Never `shadcn add` or overwrite blindly.
|
|
32
|
+
|
|
33
|
+
If the cronus-ui MCP server is connected, prefer its write tools (`compose_app`,
|
|
34
|
+
`add_page`, `set_theme`, `upgrade_components`) over shelling out. They spawn the same pinned CLI.
|
|
35
|
+
|
|
36
|
+
## 1. New app
|
|
37
|
+
|
|
38
|
+
Default marketing / product CTA is **`saas`**. If the user does **not** name a
|
|
39
|
+
template, pass `--template saas`. **Never** run `create-cronus-app` without
|
|
40
|
+
`--template`: the CLI default is `default` (an empty starter), which is the
|
|
41
|
+
wrong CTA. `--yes` / `-y` without `--template` also falls through to `default`,
|
|
42
|
+
so `-y` must go **together** with `--template saas`.
|
|
43
|
+
|
|
44
|
+
Other composed templates: `store`, `landing`. Bundled (non-composed) starters:
|
|
45
|
+
`default`, `dashboard`, `marketing` — only when the user explicitly asks for a
|
|
46
|
+
minimal starter or those names.
|
|
47
|
+
|
|
48
|
+
```sh
|
|
49
|
+
npx create-cronus-app <name> --template saas
|
|
50
|
+
npx create-cronus-app <name> --template saas -y
|
|
51
|
+
npx create-cronus-app <name> --template store
|
|
52
|
+
npx create-cronus-app <name> --template landing --theme sunset
|
|
53
|
+
npx create-cronus-app <name> --template saas --no-install
|
|
54
|
+
```
|
|
55
|
+
|
|
56
|
+
Theme and mode belong on the **same** scaffold command (`DEFAULT_MODE` is already
|
|
57
|
+
`dark`; pass `--mode dark` only to be explicit):
|
|
58
|
+
|
|
59
|
+
```sh
|
|
60
|
+
npx create-cronus-app <name> --template landing --theme sunset
|
|
61
|
+
npx create-cronus-app <name> --template landing --theme sunset --mode dark
|
|
62
|
+
```
|
|
63
|
+
|
|
64
|
+
`--no-install` is a **create-cronus-app** flag (files only, skip `pm install`).
|
|
65
|
+
`cronus-ui compose` / `add` / `add-page` use `--skip-install`, not `--no-install`.
|
|
66
|
+
Do not mix them.
|
|
67
|
+
|
|
68
|
+
This scaffolds the project **and** composes the template (pages + chrome from registry
|
|
69
|
+
blocks). Do not recreate that tree by hand.
|
|
70
|
+
|
|
71
|
+
## 2. Existing inited project (`cronus-ui.json` already there)
|
|
72
|
+
|
|
73
|
+
```sh
|
|
74
|
+
npx cronus-ui compose saas
|
|
75
|
+
npx cronus-ui compose store --brand Acme -y
|
|
76
|
+
npx cronus-ui compose landing --variant login=split --dry-run
|
|
77
|
+
```
|
|
78
|
+
|
|
79
|
+
Real flags (do not invent others):
|
|
80
|
+
|
|
81
|
+
- `-y` / `--yes` — non-interactive (pick the first template if none is given).
|
|
82
|
+
**Always pass `-y` as an agent.** This is `cronus-ui compose`, not
|
|
83
|
+
`create-cronus-app` — on scaffold, `-y` still needs `--template saas`.
|
|
84
|
+
- `-b, --brand <name>` — brand wordmark baked into chrome/hero.
|
|
85
|
+
- `--variant <slug>=<id>` — repeatable, e.g. `--variant login=split`.
|
|
86
|
+
- `--pages <list>` — comma-separated route subset, e.g. `--pages /,pricing`.
|
|
87
|
+
- `--skip-install` — do not install npm dependencies. Not `--no-install`.
|
|
88
|
+
- `--dry-run` — print the validated plan + per-file preview, write nothing.
|
|
89
|
+
- `-o, --overwrite` — replace existing generated files. Only for a fresh
|
|
90
|
+
re-compose the user asked to replace — not how you pull template updates
|
|
91
|
+
(use `upgrade --all`).
|
|
92
|
+
- `-r, --registry <source>` — registry URL or local directory.
|
|
93
|
+
- `-m, --manifest <file>` — compose from an explicit manifest instead of a bundled template.
|
|
94
|
+
|
|
95
|
+
MCP: `compose_app { "template": "saas", "brand": "Acme", "dryRun": false }`.
|
|
96
|
+
|
|
97
|
+
## 3. Grow by one page
|
|
98
|
+
|
|
99
|
+
```sh
|
|
100
|
+
npx cronus-ui add-page --route /pricing --blocks pricing,cta --nav Pricing
|
|
101
|
+
npx cronus-ui add-page --route /faq --blocks faq,cta --title FAQ --chrome site --dry-run
|
|
102
|
+
npx cronus-ui add-page --route /login --blocks login=split --nav Login
|
|
103
|
+
npx cronus-ui add-page --route /settings --blocks settings,account-security --nav Settings
|
|
104
|
+
```
|
|
105
|
+
|
|
106
|
+
The registry item is also `login--split`: `npx cronus-ui add login--split`.
|
|
107
|
+
|
|
108
|
+
Real flags:
|
|
109
|
+
|
|
110
|
+
- `--route <route>` — required, starts with `/` (e.g. `/faq`).
|
|
111
|
+
- `--blocks <list>` — required, comma-separated slugs, or `slug=variant` (`login=split`).
|
|
112
|
+
- `--nav <label>` — add the page to the chrome nav.
|
|
113
|
+
- `--title <title>` — page `<title>` (default: title-cased route).
|
|
114
|
+
- `--chrome <group>` — chrome group (default: the app's first group).
|
|
115
|
+
- `--app <name>` — which composed app to extend (required if the project has more than one).
|
|
116
|
+
- `--dry-run` / `--skip-install` / `-o, --overwrite` / `-r, --registry` / `-m, --manifest`.
|
|
117
|
+
|
|
118
|
+
MCP: `add_page { "route": "/pricing", "blocks": "pricing,cta", "nav": "Pricing" }`.
|
|
119
|
+
When the app was composed with `--manifest`, include `"manifest": "path/to.json"`.
|
|
120
|
+
|
|
121
|
+
Requires an already-composed app. If there isn't one, compose (or scaffold) first.
|
|
122
|
+
|
|
123
|
+
## Golden rule
|
|
124
|
+
|
|
125
|
+
Generated pages are **only** imports of installed blocks plus a `<main>` that stacks
|
|
126
|
+
them. Do **not** invent a new page architecture, extra layout chrome, or hand-written
|
|
127
|
+
sections beside the blocks. Every visible pixel comes from a registry item.
|
|
128
|
+
|
|
129
|
+
After compose / add-page, switch look via the `theme` skill:
|
|
130
|
+
|
|
131
|
+
```sh
|
|
132
|
+
npx cronus-ui theme set sunset --mode dark
|
|
133
|
+
```
|
|
134
|
+
|
|
135
|
+
## Keep using Cronus (AI Kit)
|
|
136
|
+
|
|
137
|
+
If the project does not yet have the AI Kit (`AGENTS.md`, compose / ui-add /
|
|
138
|
+
theme skills, MCP):
|
|
139
|
+
|
|
140
|
+
```sh
|
|
141
|
+
npx cronus-ui ai
|
|
142
|
+
```
|
|
143
|
+
|
|
144
|
+
Never write a shadcn `components.json` or run `shadcn init`.
|
|
145
|
+
|
|
146
|
+
## 4. One control → `ui-add`
|
|
147
|
+
|
|
148
|
+
If they asked for a single primitive or block (`button`, `dialog`, `data-table`, a
|
|
149
|
+
lone `hero`), stop and use the `ui-add` skill (`npx cronus-ui add <slug>` / MCP
|
|
150
|
+
`install_component`). Do not compose a whole app for a widget.
|
|
151
|
+
|
|
152
|
+
## 5. Tokens, if you must hand-roll
|
|
153
|
+
|
|
154
|
+
`bg-primary`, `text-fg`, `text-fg-secondary`, `border-border`, `rounded-lg`. Never
|
|
155
|
+
palette scales or hex. If they ask for `zinc-*` / `slate-*` / `gray-*`, refuse
|
|
156
|
+
and offer `bg-surface-*` or `setOverrides`.
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: evidence-check
|
|
3
|
+
description: Tag each claim in an answer with an evidence level (L0–L4) and list what is NOT verified, before the answer is trusted or acted on. Use before making confident technical or financial assertions, when reconciling data or numbers, or when the user asks how sure you are.
|
|
4
|
+
allowed-tools: Bash, Read, Grep, Glob
|
|
5
|
+
---
|
|
6
|
+
|
|
7
|
+
# Tag claims with evidence levels
|
|
8
|
+
|
|
9
|
+
The L0–L4 scale and the confidence gates are defined in **`AGENTS.md`** — this skill
|
|
10
|
+
applies them, it does not re-teach them. Quick anchor: **L0** context/opinion, **L1**
|
|
11
|
+
single signal, **L2** read of code/config/data, **L3** cross-referenced across independent
|
|
12
|
+
sources, **L4** end-to-end verified with a closed reconciliation.
|
|
13
|
+
|
|
14
|
+
The answer or claim to grade: `$ARGUMENTS`
|
|
15
|
+
|
|
16
|
+
## Do this
|
|
17
|
+
|
|
18
|
+
1. Split the answer into discrete, checkable claims; separate **fact** from **inference**
|
|
19
|
+
from **assumption**.
|
|
20
|
+
2. Tag each claim with the highest level you can actually justify — not the one you hope
|
|
21
|
+
for. A single screenshot is L1, not L3. Use the read-only tools to raise a level where
|
|
22
|
+
cheap (read the code, grep the source, run a query) rather than guessing.
|
|
23
|
+
3. Name, for each load-bearing claim, the one check that would move it up a level.
|
|
24
|
+
|
|
25
|
+
## Output
|
|
26
|
+
|
|
27
|
+
- **Table** — `claim → level → basis` (the concrete artifact behind the tag).
|
|
28
|
+
- **NOT VERIFIED** — an explicit list of every claim that is assumed, inferred, or
|
|
29
|
+
unchecked, stated plainly. Do not omit or soften this set.
|
|
30
|
+
- **Next check** — the single verification that would raise the weakest load-bearing claim.
|
|
31
|
+
|
|
32
|
+
## Gates
|
|
33
|
+
|
|
34
|
+
- Block any confident technical or financial claim below **L3**; money, production, or
|
|
35
|
+
irreversible actions need **L4**.
|
|
36
|
+
- Never invent numbers, sources, rankings, or receipts. If you lack access, say exactly
|
|
37
|
+
what was not verified instead of filling the gap.
|
|
38
|
+
- Do not label something "visual only", "harmless", or "already fine" before it has been
|
|
39
|
+
reconciled against the source.
|
|
@@ -0,0 +1,66 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: ship-pr
|
|
3
|
+
description: Commit the working changes and open a pull request for __APP_NAME__. Use when the user asks to ship, commit, push, or open a PR — stage the change, write a small Conventional Commit with no AI attribution, push a dedicated branch, and open a PR whose body covers objective, changes, tests, risks, and rollback.
|
|
4
|
+
argument-hint: ""
|
|
5
|
+
allowed-tools: Bash, Read
|
|
6
|
+
---
|
|
7
|
+
|
|
8
|
+
# Commit and open a PR
|
|
9
|
+
|
|
10
|
+
Turn the reviewed working changes into a clean, reviewable pull request.
|
|
11
|
+
|
|
12
|
+
Optional PR title / scope: `$ARGUMENTS`
|
|
13
|
+
|
|
14
|
+
## 1. Gate before shipping
|
|
15
|
+
|
|
16
|
+
- Review the diff first if it hasn't been reviewed: run the `code-review` skill (inline, in
|
|
17
|
+
this session) or delegate to the `code-reviewer` subagent (fresh, isolated context).
|
|
18
|
+
Nothing P0/P1 ships below the 95% confidence gate (see `AGENTS.md`).
|
|
19
|
+
- Confirm no debug instrumentation, secrets, or unrelated files are in the diff:
|
|
20
|
+
`git status` and `git diff`.
|
|
21
|
+
|
|
22
|
+
## 2. Branch
|
|
23
|
+
|
|
24
|
+
Never commit on the default branch. If you're on it, create a dedicated branch first:
|
|
25
|
+
|
|
26
|
+
```sh
|
|
27
|
+
git checkout -b <type>/<short-topic> # feat/…, fix/…, chore/…, docs/…, refactor/…
|
|
28
|
+
```
|
|
29
|
+
|
|
30
|
+
## 3. Stage intentionally
|
|
31
|
+
|
|
32
|
+
Add only the files that belong to this change — don't `git add -A` a dirty tree. Split
|
|
33
|
+
unrelated work into separate commits or PRs.
|
|
34
|
+
|
|
35
|
+
## 4. Commit
|
|
36
|
+
|
|
37
|
+
Small commits in **Conventional Commits** form:
|
|
38
|
+
|
|
39
|
+
```
|
|
40
|
+
<type>(<scope>): <imperative summary>
|
|
41
|
+
```
|
|
42
|
+
|
|
43
|
+
`type` ∈ `feat | fix | refactor | docs | chore | test | perf`. Keep the subject short.
|
|
44
|
+
**No AI attribution and no "generated by" trailers** anywhere in the message.
|
|
45
|
+
|
|
46
|
+
## 5. Push and open the PR
|
|
47
|
+
|
|
48
|
+
```sh
|
|
49
|
+
git push -u origin HEAD
|
|
50
|
+
gh pr create --title "<title>" --body "<body>"
|
|
51
|
+
```
|
|
52
|
+
|
|
53
|
+
The PR body must have these sections:
|
|
54
|
+
|
|
55
|
+
- **Objective** — the problem and why this change.
|
|
56
|
+
- **Changes** — what was done, key files/areas touched.
|
|
57
|
+
- **Tests** — objective evidence: build/typecheck green, tests run, real flow exercised,
|
|
58
|
+
error path checked.
|
|
59
|
+
- **Risks & attention points** — blast radius, shared contracts, anything a reviewer
|
|
60
|
+
should scrutinize.
|
|
61
|
+
- **Rollback** — the named path back (e.g. revert this PR / this commit), safe to run.
|
|
62
|
+
|
|
63
|
+
## 6. Deploy discipline
|
|
64
|
+
|
|
65
|
+
Staging before production when applicable. Production or any environment mutation happens
|
|
66
|
+
**only with explicit approval, a clear window, and the rollback named up front.**
|
|
@@ -0,0 +1,94 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: theme
|
|
3
|
+
description: Preview or switch the Cronus UI theme in __APP_NAME__. Use when the user wants to change the look, try a preset, toggle dark/light, or tweak brand color or radius — set the theme via the CLI, MCP, or useTheme, and never by inlining raw colors.
|
|
4
|
+
argument-hint: "[preset]"
|
|
5
|
+
allowed-tools: Read, Edit, Bash
|
|
6
|
+
---
|
|
7
|
+
|
|
8
|
+
# Preview or switch the app theme
|
|
9
|
+
|
|
10
|
+
Cronus UI is themed entirely through CSS custom properties driven by the active preset,
|
|
11
|
+
mode, and any token overrides. Changing them re-skins the whole app instantly — no
|
|
12
|
+
per-component edits, no raw colors.
|
|
13
|
+
|
|
14
|
+
Request: `$ARGUMENTS`
|
|
15
|
+
|
|
16
|
+
## Presets and modes
|
|
17
|
+
|
|
18
|
+
- Presets: **`aurora`** (default), **`neutral`**, **`midnight`**, **`sunset`**,
|
|
19
|
+
**`emerald`**.
|
|
20
|
+
- Modes: **`light`**, **`dark`** (default `dark`).
|
|
21
|
+
|
|
22
|
+
## Switch a baked-in preset (do this first)
|
|
23
|
+
|
|
24
|
+
```sh
|
|
25
|
+
npx cronus-ui theme set aurora
|
|
26
|
+
npx cronus-ui theme set sunset --mode dark
|
|
27
|
+
npx cronus-ui theme set neutral --mode light
|
|
28
|
+
```
|
|
29
|
+
|
|
30
|
+
`theme set` rewrites `defaultThemeName` / `defaultModeName` on the layout and records
|
|
31
|
+
the choice in `cronus-ui.json`.
|
|
32
|
+
|
|
33
|
+
MCP: `set_theme { "name": "sunset", "mode": "dark" }`. Use this for the five shipped
|
|
34
|
+
presets. Before generating screens, call `get_design_context` (or read `DESIGN.md`)
|
|
35
|
+
so the palette and look stay Cronus.
|
|
36
|
+
|
|
37
|
+
## Apply a Create Studio theme
|
|
38
|
+
|
|
39
|
+
```sh
|
|
40
|
+
npx cronus-ui theme add <permalink|c=payload|file.json>
|
|
41
|
+
npx cronus-ui theme add https://cronus-ui.dev/studio?c=... --dry-run
|
|
42
|
+
```
|
|
43
|
+
|
|
44
|
+
MCP: `apply_theme { "source": "<permalink|c=payload|file.json>", "dryRun": false }`.
|
|
45
|
+
Prefer `apply_theme` for Studio permalinks; `set_theme` is only the baked-in presets.
|
|
46
|
+
|
|
47
|
+
## Set the app default by editing the layout (only if the CLI is not an option)
|
|
48
|
+
|
|
49
|
+
Edit `app/layout.tsx`. The `defaultThemeName` / `defaultModeName` on **`<CronusThemeScript>`**
|
|
50
|
+
and **`<CronusUIProvider>`** must match, and both must use the same `storageKey`:
|
|
51
|
+
|
|
52
|
+
```tsx
|
|
53
|
+
<CronusThemeScript storageKey="theme" defaultThemeName="midnight" defaultModeName="dark" />
|
|
54
|
+
...
|
|
55
|
+
<CronusUIProvider asRoot storageKey="theme" defaultThemeName="midnight" defaultModeName="dark">
|
|
56
|
+
```
|
|
57
|
+
|
|
58
|
+
Also update the `theme` block in `cronus-ui.json` so newly added components scaffold with
|
|
59
|
+
the same default. Keep `suppressHydrationWarning` on `<html>` and keep `<CronusThemeScript>`
|
|
60
|
+
in `<head>` — it applies the persisted theme before first paint (anti-flash).
|
|
61
|
+
|
|
62
|
+
## Change the theme at runtime
|
|
63
|
+
|
|
64
|
+
Inside a client component under the provider, use `useTheme()`:
|
|
65
|
+
|
|
66
|
+
```tsx
|
|
67
|
+
const { theme, mode, setTheme, setMode, toggleMode, setOverrides } = useTheme();
|
|
68
|
+
setTheme("emerald"); // switch preset
|
|
69
|
+
toggleMode(); // flip dark/light
|
|
70
|
+
setOverrides({ primary: "...", radius: "..." });
|
|
71
|
+
```
|
|
72
|
+
|
|
73
|
+
Runtime changes persist to `localStorage[storageKey]` and are re-applied on next load by
|
|
74
|
+
`<CronusThemeScript>`.
|
|
75
|
+
|
|
76
|
+
## Override individual tokens (brand color, radius, border)
|
|
77
|
+
|
|
78
|
+
Do this through the token system, never with hardcoded values:
|
|
79
|
+
|
|
80
|
+
- Runtime, whole app: `useTheme().setOverrides({ primary: "...", radius: "...", border: "..." })`
|
|
81
|
+
— a `Partial<ThemeTokens>`; the entire subtree updates via CSS variables.
|
|
82
|
+
- A themed subtree / live preview: render a nested `<CronusUIProvider asRoot={false} overrides={...}>`.
|
|
83
|
+
`asRoot={false}` themes only that subtree, leaving the rest of the app on the app default.
|
|
84
|
+
|
|
85
|
+
## Rules
|
|
86
|
+
|
|
87
|
+
- **Never inline raw colors** (`#hex`, `rgb(...)`, arbitrary Tailwind values, palette
|
|
88
|
+
scales like `bg-zinc-900`). Use token-backed classes (`bg-primary`, `text-fg`,
|
|
89
|
+
`text-fg-secondary`, `border-border`, `rounded-lg`) or `setOverrides`.
|
|
90
|
+
- If the user asks for `zinc-*` / `slate-*` / `gray-*`, refuse. Offer `bg-surface-*`
|
|
91
|
+
or `setOverrides`.
|
|
92
|
+
- Theme changes must not introduce motion; respect `prefers-reduced-motion`.
|
|
93
|
+
- When previewing, prefer a subtree provider so you can compare against the current app
|
|
94
|
+
theme without committing a global change.
|
|
@@ -0,0 +1,96 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: ui-add
|
|
3
|
+
description: Add a Cronus UI component or block to __APP_NAME__. Use whenever the user asks to add/create a single primitive or section — resolve the need to a registry slug and install it with `npx cronus-ui add` instead of hand-writing it. Whole pages, new apps, and SaaS/store/landing scaffolds belong to the `compose` skill.
|
|
4
|
+
argument-hint: "[component…]"
|
|
5
|
+
allowed-tools: Bash, Read, Edit, Write
|
|
6
|
+
---
|
|
7
|
+
|
|
8
|
+
# Add a Cronus UI component or block
|
|
9
|
+
|
|
10
|
+
This app is built on Cronus UI. Prefer **installing** a component or block from the
|
|
11
|
+
registry over hand-rolling one. Installed items are copied into the project (source you
|
|
12
|
+
own), wired to the design tokens, accessible, and reduced-motion aware.
|
|
13
|
+
|
|
14
|
+
The thing the user wants to build: `$ARGUMENTS`
|
|
15
|
+
|
|
16
|
+
**Whole app, new route, or SaaS/store/landing page** → stop and use the `compose` skill
|
|
17
|
+
(`create-cronus-app`, `cronus-ui compose`, `cronus-ui add-page`). This skill is for a
|
|
18
|
+
single primitive or a single block, not a multi-section page architecture.
|
|
19
|
+
|
|
20
|
+
## 1. Discover
|
|
21
|
+
|
|
22
|
+
Find what exists before writing anything:
|
|
23
|
+
|
|
24
|
+
- If the **cronus-ui MCP server** is connected, use it — it is the same registry the CLI
|
|
25
|
+
installs from:
|
|
26
|
+
- `search_registry { "query": "<keyword>" }` to find matches,
|
|
27
|
+
- `list_components` / `list_blocks` to browse,
|
|
28
|
+
- `get_component { "name": "<slug>" }` for the source, deps, and exact install command.
|
|
29
|
+
- Otherwise run `npx cronus-ui list` to print the registry.
|
|
30
|
+
|
|
31
|
+
Pick the smallest thing that covers the need:
|
|
32
|
+
|
|
33
|
+
- **Components** are single primitives — `button`, `input`, `dialog`, `data-table`,
|
|
34
|
+
`dropdown-menu`, `tabs`, `card`, `badge`.
|
|
35
|
+
- **Blocks** are composed sections — `hero`, `pricing`, `login`, `signup`, `dashboard`,
|
|
36
|
+
`settings`, `account-security`, `checkout`, `payouts`, `faq`, `footer`, `navbar`. Reach for a block when the
|
|
37
|
+
user describes a whole section, not a single control.
|
|
38
|
+
|
|
39
|
+
If several slugs together model one section, install them together. If they model a
|
|
40
|
+
**page of stacked blocks**, that is `compose` / `add-page`, not this skill.
|
|
41
|
+
|
|
42
|
+
## 2. Install
|
|
43
|
+
|
|
44
|
+
```sh
|
|
45
|
+
npx cronus-ui add <slug> [<slug> ...]
|
|
46
|
+
```
|
|
47
|
+
|
|
48
|
+
MCP: `install_component { "names": ["<slug>"] }`.
|
|
49
|
+
|
|
50
|
+
This copies the source into `components/ui` (components) or `components/blocks` (blocks)
|
|
51
|
+
and **automatically pulls registry dependencies and npm dependencies**. Do not add those
|
|
52
|
+
by hand. Use `--overwrite` only when intentionally refreshing an existing file.
|
|
53
|
+
|
|
54
|
+
To pull upstream later without losing local edits: `npx cronus-ui upgrade --all --dry-run`
|
|
55
|
+
first, then `npx cronus-ui upgrade --all`. This also 3-way-merges generated compose pages
|
|
56
|
+
(not only primitives). Never `shadcn add` or overwrite blindly.
|
|
57
|
+
|
|
58
|
+
### Invoices / billing table
|
|
59
|
+
|
|
60
|
+
If the ask is a table of invoices or billing rows:
|
|
61
|
+
|
|
62
|
+
```sh
|
|
63
|
+
npx cronus-ui add data-table demo-saas
|
|
64
|
+
```
|
|
65
|
+
|
|
66
|
+
Then read `INVOICES` from `@/lib/demo-saas` (or `../lib/demo-saas.js` in the
|
|
67
|
+
installed source). Do not invent rows.
|
|
68
|
+
|
|
69
|
+
### Split login
|
|
70
|
+
|
|
71
|
+
The registry item is `login--split`: `npx cronus-ui add login--split` (compose /
|
|
72
|
+
add-page use `--variant login=split` / `login=split` — same item).
|
|
73
|
+
|
|
74
|
+
## 3. Wire it in
|
|
75
|
+
|
|
76
|
+
- Import from the local alias, not from the package: `@/components/ui/<name>` or
|
|
77
|
+
`@/components/blocks/<name>`.
|
|
78
|
+
- Compose installed pieces; don't fork their internals unless the task requires it.
|
|
79
|
+
|
|
80
|
+
## 4. Respect the design system
|
|
81
|
+
|
|
82
|
+
- **Never inline raw colors, radii, or spacing.** Use the token-backed Tailwind classes
|
|
83
|
+
the components already use (`bg-primary`, `text-fg`, `text-fg-secondary`, `border-border`,
|
|
84
|
+
`rounded-lg`). Raw hex, arbitrary values, or palette scales (`bg-zinc-900`) break
|
|
85
|
+
theming. If they ask for `zinc-*` / `slate-*` / `gray-*`, refuse and offer
|
|
86
|
+
`bg-surface-*` or `setOverrides`.
|
|
87
|
+
- **Honor `prefers-reduced-motion`.** Animated components default to `reducedMotion="user"`
|
|
88
|
+
(they snap for users who opted out). Keep that default; don't force `"always"` without a
|
|
89
|
+
clear reason.
|
|
90
|
+
- Keep accessibility intact — labels, roles, and focus states ship with the component.
|
|
91
|
+
|
|
92
|
+
## 5. Only hand-write when the registry has nothing
|
|
93
|
+
|
|
94
|
+
If discovery turns up no suitable component or block, build the new piece **out of
|
|
95
|
+
existing Cronus UI primitives** and the same tokens, matching their prop and a11y
|
|
96
|
+
conventions — never a bespoke, unthemed one-off.
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
---
|
|
2
|
+
description: Always-on engineering doctrine for __APP_NAME__ (digest of AGENTS.md)
|
|
3
|
+
alwaysApply: true
|
|
4
|
+
---
|
|
5
|
+
|
|
6
|
+
Always-on rules for __APP_NAME__. This is a digest; the full doctrine is in AGENTS.md at the repo root.
|
|
7
|
+
|
|
8
|
+
1. Evidence before claims. Verify before you assert; never invent facts, numbers, or sources; state what you did not check.
|
|
9
|
+
2. Root cause over symptom. Separate fact from inference from assumption.
|
|
10
|
+
3. Preserve shared contracts. Read the surrounding context, map the blast radius, and find every caller before changing code; do not break other consumers in the same diff.
|
|
11
|
+
4. No unbounded work: no retry without a ceiling, infinite polling, unthrottled fan-out, or boot that crashes on a missing dependency; no silent fallback that hides an error.
|
|
12
|
+
5. Reliability gate. Anything critical (P0/P1) is not done until code review and QA reach high confidence — build green, relevant tests passing, error paths exercised. After three failed cycles, stop and escalate.
|
|
13
|
+
6. Commit cleanly: dedicated branch, small Conventional Commits, no AI attribution, no debug leftovers in the final diff.
|
|
14
|
+
7. Production is read-only. Any deploy, migration, or data change needs explicit approval and a named rollback first.
|
|
15
|
+
8. Ask when unsure; state assumptions instead of guessing.
|
|
16
|
+
|
|
17
|
+
See AGENTS.md for the full doctrine.
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
---
|
|
2
|
+
description: Cronus UI product loop and design-system rules for __APP_NAME__
|
|
3
|
+
alwaysApply: true
|
|
4
|
+
---
|
|
5
|
+
|
|
6
|
+
Cronus UI product loop for __APP_NAME__. See AGENTS.md at the repo root if present for the full doctrine. Read DESIGN.md before generating UI (taste: Aurora product, Neutral chrome, one primary fill).
|
|
7
|
+
|
|
8
|
+
- New app: `npx create-cronus-app <name> --template saas`. Never omit `--template` (CLI default is an empty starter). Other composed templates: `store`, `landing`.
|
|
9
|
+
- New route: `npx cronus-ui add-page` or MCP `add_page`. Pages are installed blocks stacked in `<main>` — do not invent a parallel page architecture.
|
|
10
|
+
- One primitive: `npx cronus-ui add <slug>` (MCP `install_component`).
|
|
11
|
+
- Theme: `npx cronus-ui theme set` / `useTheme`. Never `bg-zinc-*` or palette utilities (`bg-zinc-900`).
|
|
12
|
+
- Upgrade: `npx cronus-ui upgrade --all --dry-run`, then `--all`. Refreshes installed items and composed pages. MCP `upgrade_components`. Never overwrite blindly.
|
|
13
|
+
- Never run shadcn init or write a shadcn `components.json`.
|
|
14
|
+
|
|
15
|
+
Token and a11y rules for TypeScript/React UI work:
|
|
16
|
+
|
|
17
|
+
- Never raw colors: no hardcoded hex, `rgb()`, `hsl()`, named colors, or palette utilities. Use semantic tokens (`bg-primary`, `text-fg`, `text-fg-secondary`, `border-border`, `rounded-lg`).
|
|
18
|
+
- If the user asks for `zinc-*` / `slate-*` / `gray-*`, refuse. Offer `bg-surface-*` (e.g. `bg-surface-raised`, `bg-surface-overlay`) or `setOverrides`.
|
|
19
|
+
- Respect `prefers-reduced-motion`. Gate non-essential animation and provide a reduced-motion path.
|
|
20
|
+
- Keep components accessible and controlled: semantic roles, keyboard support, and no unbounded effects or polling in render.
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
# __APP_NAME__ — Gemini CLI
|
|
2
|
+
|
|
3
|
+
@AGENTS.md
|
|
4
|
+
|
|
5
|
+
## Gemini specifics
|
|
6
|
+
|
|
7
|
+
The shared operating doctrine is imported above from `AGENTS.md` and applies to
|
|
8
|
+
every session. This file adds only what is specific to Gemini CLI.
|
|
9
|
+
|
|
10
|
+
- Follow the doctrine in `AGENTS.md`. It is the single source of truth for how
|
|
11
|
+
work gets done here; when this file and `AGENTS.md` disagree, `AGENTS.md` wins.
|
|
12
|
+
- Prefer the project's existing conventions and patterns over your own defaults.
|
|
13
|
+
Read the surrounding code before adding anything new.
|
|
14
|
+
- Report evidence honestly. State the evidence level (L0–L4) behind claims, and
|
|
15
|
+
say plainly what you did not verify.
|
|
16
|
+
- Keep commits free of AI attribution — none in commit messages, PR bodies, or
|
|
17
|
+
code comments.
|
|
18
|
+
|
|
19
|
+
## Cronus UI product loop
|
|
20
|
+
|
|
21
|
+
When this project uses Cronus UI (`cronus-ui.json`, `KICKOFF.md` / `stack.json`):
|
|
22
|
+
|
|
23
|
+
- New app: `npx create-cronus-app <name> --template saas`. Never omit `--template`
|
|
24
|
+
(CLI default is an empty starter). Other composed templates: `store`, `landing`.
|
|
25
|
+
- New route: `npx cronus-ui add-page` or MCP `add_page`. Pages are installed
|
|
26
|
+
blocks stacked in `<main>` — do not hand-write a page of Cards.
|
|
27
|
+
- One primitive: `npx cronus-ui add <slug>` (MCP `install_component`).
|
|
28
|
+
- Theme: `npx cronus-ui theme set` / `useTheme`. Never `bg-zinc-*` or palette
|
|
29
|
+
utilities.
|
|
30
|
+
- Upgrade: `npx cronus-ui upgrade --all --dry-run`, then `--all`. Refreshes
|
|
31
|
+
installed items and composed pages. MCP `upgrade_components`.
|
|
32
|
+
- Never run shadcn init or write a shadcn `components.json`.
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
# Copilot instructions for __APP_NAME__
|
|
2
|
+
|
|
3
|
+
These are the core rules for suggesting code in this repository. The full engineering doctrine lives in AGENTS.md at the repo root — read it for evidence levels, the reliability gate, and criticality (P0–P3).
|
|
4
|
+
|
|
5
|
+
## Core rules
|
|
6
|
+
|
|
7
|
+
- **Evidence before claims.** Verify before asserting. Never invent facts, numbers, APIs, files, or sources. Say what you did not check.
|
|
8
|
+
- **Root cause over symptom.** Separate fact from inference from assumption. Attack the underlying cause, not the surface.
|
|
9
|
+
- **Preserve shared contracts.** Before changing code, read the surrounding context, map the blast radius, and find every caller. Do not break other consumers in the same change; if you cannot fix them all in one diff, stop and report.
|
|
10
|
+
- **No unbounded work.** No retry without a ceiling, no infinite polling or loops, no unthrottled fan-out, no boot that crashes on a missing dependency, and no silent fallback that hides an error.
|
|
11
|
+
- **Meet the reliability gate.** Anything critical (P0/P1) is not done until code review and QA reach high confidence: build green, relevant tests passing, error paths exercised, correct target verified. After three failed correction cycles, stop and escalate.
|
|
12
|
+
- **Commit cleanly.** Use a dedicated branch and small Conventional Commits. No AI attribution in commit messages or PRs. No debug instrumentation in the final diff. PRs state objective, changes, tests, risks, and rollback.
|
|
13
|
+
- **Production is read-only.** Any deploy, migration, restart, or data change needs explicit approval and a named rollback first.
|
|
14
|
+
- **Ask when unsure.** State assumptions instead of guessing.
|
|
15
|
+
|
|
16
|
+
## UI work
|
|
17
|
+
|
|
18
|
+
Follow the UI library selected in `KICKOFF.md` / `stack.json`. If Cronus UI is selected:
|
|
19
|
+
|
|
20
|
+
- New app: `npx create-cronus-app <name> --template saas`. Never omit `--template` (CLI default is an empty starter). Other composed templates: `store`, `landing`.
|
|
21
|
+
- New route: `npx cronus-ui add-page` or MCP `add_page`. Pages are installed blocks stacked in `<main>` — do not hand-write a page of Cards.
|
|
22
|
+
- One primitive: `npx cronus-ui add <slug>` (MCP `install_component`).
|
|
23
|
+
- Theme: `npx cronus-ui theme set` / `useTheme`. Never `bg-zinc-*` or palette utilities.
|
|
24
|
+
- Upgrade: `npx cronus-ui upgrade --all --dry-run`, then `--all`. Refreshes installed items and composed pages. MCP `upgrade_components`.
|
|
25
|
+
- Never run shadcn init or write a shadcn `components.json`.
|
|
26
|
+
|
|
27
|
+
If another UI library or no UI library is selected, do not import Cronus UI packages unless the project explicitly adds them. Never inline raw colors and respect `prefers-reduced-motion`.
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
---
|
|
2
|
+
trigger: always_on
|
|
3
|
+
---
|
|
4
|
+
|
|
5
|
+
Always-on engineering doctrine for __APP_NAME__ (digest).
|
|
6
|
+
|
|
7
|
+
- Evidence before claims. Verify before you assert; never invent facts, numbers, or sources, and say what you did not check.
|
|
8
|
+
- Preserve shared contracts. Read the surrounding context, map the blast radius, and find every caller before changing code; don't break other consumers in the same diff.
|
|
9
|
+
- No unbounded work. No retry without a ceiling, no infinite polling or effect loop, no unthrottled fan-out, no boot that crashes on a missing dependency, no silent fallback that hides an error.
|
|
10
|
+
- Commit cleanly. Dedicated branch, small Conventional Commits, no AI attribution, no debug leftovers.
|
|
11
|
+
- Ask when unsure. State assumptions instead of guessing.
|
|
12
|
+
- Read before you write. Open the file and understand it before editing it.
|
|
13
|
+
|
|
14
|
+
See AGENTS.md at the repo root for the full doctrine.
|
|
15
|
+
|
|
16
|
+
## Cronus UI product loop
|
|
17
|
+
|
|
18
|
+
When this project uses Cronus UI (`cronus-ui.json`, `KICKOFF.md` / `stack.json`):
|
|
19
|
+
|
|
20
|
+
- New app: `npx create-cronus-app <name> --template saas`. Never omit `--template` (CLI default is an empty starter). Other composed templates: `store`, `landing`.
|
|
21
|
+
- New route: `npx cronus-ui add-page` or MCP `add_page`. Pages are installed blocks stacked in `<main>` — do not hand-write a page of Cards.
|
|
22
|
+
- One primitive: `npx cronus-ui add <slug>` (MCP `install_component`).
|
|
23
|
+
- Theme: `npx cronus-ui theme set` / `useTheme`. Never `bg-zinc-*` or palette utilities.
|
|
24
|
+
- Upgrade: `npx cronus-ui upgrade --all --dry-run`, then `--all`. Refreshes installed items and composed pages. MCP `upgrade_components`.
|
|
25
|
+
- Never run shadcn init or write a shadcn `components.json`.
|