jig-ui 0.8.2 → 0.10.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/CHANGELOG.md +111 -0
- package/README.md +38 -7
- package/dist/index.js +1368 -158
- package/layers.json +100 -0
- package/package.json +3 -2
- package/rules/00-anti-patterns.md +89 -3
- package/rules/01-modes.md +6 -6
- package/rules/02-tokens.md +13 -10
- package/rules/03-patterns.md +44 -4
- package/rules/04-principles.md +12 -12
- package/rules/05-copy.md +1 -1
- package/rules.index.json +252 -95
- package/templates/COMMAND.md.tmpl +1052 -17
- package/templates/SKILL.md.tmpl +52 -13
- package/templates/command-metadata.json +43 -3
package/templates/SKILL.md.tmpl
CHANGED
|
@@ -3,25 +3,51 @@ cite the number when you follow or deliberately break one.
|
|
|
3
3
|
|
|
4
4
|
## Before generating or reviewing any UI
|
|
5
5
|
|
|
6
|
-
0.
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
6
|
+
0. **Two preconditions. Check both, and stop on either.**
|
|
7
|
+
|
|
8
|
+
a. `{{config_file}}` exists. If it does not, this project has no token layer:
|
|
9
|
+
run `init` and stop until it has been run. Do not proceed by writing token
|
|
10
|
+
definitions of your own — a `:root` block you author, however clearly you
|
|
11
|
+
label it, is an invented design system wearing this one's names, and it
|
|
12
|
+
will not be replaced when the real tokens arrive.
|
|
13
|
+
|
|
14
|
+
b. `DECISIONS.md` exists beside the token files — `jig/DECISIONS.md` by
|
|
15
|
+
default, or wherever `brand` in `{{config_file}}` puts them — and has
|
|
16
|
+
substance: not empty, no `[TODO]` markers left in it, more than a few
|
|
17
|
+
lines. If it does not, run `{{command_prefix}}decide` and stop until it has
|
|
18
|
+
been written. Do not write it yourself from this task's prompt — it records
|
|
19
|
+
decisions the project has made, and a file you author alone records
|
|
20
|
+
decisions *you* have made, which is the opposite thing wearing the same
|
|
21
|
+
name.
|
|
11
22
|
1. Load `{{rules_path}}/00-anti-patterns.md` and `{{rules_path}}/01-modes.md`.
|
|
12
23
|
2. Determine the mode from `{{config_file}}`, or infer it using the procedure in
|
|
13
24
|
`{{rules_path}}/01-modes.md` and state the inference in one line before building.
|
|
14
|
-
3.
|
|
15
|
-
|
|
16
|
-
|
|
25
|
+
3. **Building a page, feature or functionality?** Run it through
|
|
26
|
+
`{{command_prefix}}spec` → `{{command_prefix}}mockup` (low fidelity) →
|
|
27
|
+
`{{command_prefix}}make` (high fidelity) → `{{command_prefix}}critique`, one at a
|
|
28
|
+
time. Never design the whole product up front. Critique findings go back to
|
|
29
|
+
`make`, then `critique` again, until clean or accepted by the user — then the
|
|
30
|
+
next feature.
|
|
31
|
+
**Building a screen rather than a single component?** Read `L-01 · Layout
|
|
32
|
+
method` in `{{rules_path}}/03-patterns.md` and run its five steps before
|
|
33
|
+
writing any markup. It is a procedure, not a component, so step 4 never
|
|
34
|
+
selects it and nothing else will. (`explain L-01` prints it too, but the
|
|
35
|
+
file is the source — do not skip the step if the command is unavailable.)
|
|
36
|
+
4. Load the relevant section of `{{rules_path}}/03-patterns.md` for the component you are building.
|
|
37
|
+
5. Load `{{rules_path}}/05-copy.md` whenever you write a label, button, heading, error or empty state.
|
|
38
|
+
6. Consume tokens by semantic name only. Never write a raw colour or pixel value
|
|
17
39
|
at a call site, and never resolve a name yourself: if a token you need has no
|
|
18
40
|
value, that is a finding to report, not a number to supply.
|
|
19
|
-
|
|
41
|
+
7. Run `check` for the rules the CLI can detect, then run the self-check `L-04` at the
|
|
20
42
|
end of `{{rules_path}}/00-anti-patterns.md` for the rules it cannot. Both
|
|
21
43
|
halves, every time — a clean `check` is not a clean review.
|
|
22
|
-
|
|
44
|
+
8. Cite any rule you deliberately break, with the reason, in one line.
|
|
23
45
|
|
|
24
|
-
|
|
46
|
+
When two rules conflict, fetch the tiebreaker rather than the file:
|
|
47
|
+
`explain R-06`…`R-12` resolve one conflict each. When no rule covers the
|
|
48
|
+
situation at all, the five frames `R-01`…`R-05` are the method for recognising
|
|
49
|
+
what kind of failure it is. `{{rules_path}}/04-principles.md` holds them all if
|
|
50
|
+
you would rather read the whole thing.
|
|
25
51
|
|
|
26
52
|
## If the project uses Tailwind v4
|
|
27
53
|
|
|
@@ -78,12 +104,25 @@ changed since, do not re-run it.
|
|
|
78
104
|
Before you finish a task that generated or modified UI, emit this line:
|
|
79
105
|
|
|
80
106
|
```text
|
|
81
|
-
JIG_CHECK: version=<version> mode=<mode> mechanical=<pass|fail|skipped>:<n> judgment=<ran|skipped> files=<n> styled=<n>
|
|
107
|
+
JIG_CHECK: version=<version> mode=<mode> mechanical=<pass|fail|skipped>:<n> warnings=<n> judgment=<ran|skipped>:<n> files=<n> styled=<n>
|
|
82
108
|
```
|
|
83
109
|
|
|
110
|
+
`warnings=` counts the findings `check` reported as warnings. `mechanical=pass`
|
|
111
|
+
means no errors, and nothing more: a page that is not usable on a phone can
|
|
112
|
+
carry `pass:0` with several warnings, because the mobile detectors warn rather
|
|
113
|
+
than fail CI. A record that says `pass` with warnings above zero is not a clean
|
|
114
|
+
page — say what the warnings were.
|
|
115
|
+
|
|
84
116
|
`jig check` emits this same line for the half it can do, with
|
|
85
117
|
`judgment=not-run`. Take `mechanical=` from its output rather than counting by
|
|
86
|
-
hand; fill `judgment=` yourself.
|
|
118
|
+
hand; fill `judgment=` yourself.
|
|
119
|
+
|
|
120
|
+
**The line you emit is your own, not a copy of the CLI's.** `judgment=not-run` is
|
|
121
|
+
the CLI truthfully describing itself — it cannot judge. If you did the judgment
|
|
122
|
+
work, your line says `ran:` with the number of rules you gave a verdict. A live run
|
|
123
|
+
copied the CLI's line verbatim after doing the work, and dropped `files=` and
|
|
124
|
+
`styled=` as well, so its record claimed less than it had done and could not be
|
|
125
|
+
compared with any other. If `check` could not run at all, that is
|
|
87
126
|
`mechanical=skipped:0` — never `pass`, which would report a clean result for a
|
|
88
127
|
check that never inspected anything.
|
|
89
128
|
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"install": {
|
|
3
3
|
"description": "Install Jig rules and the agent skill file into a repository.",
|
|
4
|
-
"argumentHint": "--agent <name> [--scope project|global]",
|
|
4
|
+
"argumentHint": "--agent <name> [--scope project|global] [--hook]",
|
|
5
5
|
"status": "available"
|
|
6
6
|
},
|
|
7
7
|
"update": {
|
|
@@ -14,14 +14,54 @@
|
|
|
14
14
|
"argumentHint": "[--yes]",
|
|
15
15
|
"status": "available"
|
|
16
16
|
},
|
|
17
|
+
"decide": {
|
|
18
|
+
"description": "Write the project-wide design decisions to DECISIONS.md beside the token layer — the choices that need a reason, which the tokens hold the values for but cannot explain. Runs once per project, by interviewing you. spec, mockup, make and critique need it; nothing else does. No CLI — the agent does this.",
|
|
19
|
+
"argumentHint": "",
|
|
20
|
+
"status": "agent"
|
|
21
|
+
},
|
|
17
22
|
"check": {
|
|
18
23
|
"description": "Check the repo against the mechanical and hybrid rules the CLI can detect. Reports findings by rule id; the judgment rules remain yours to apply.",
|
|
19
24
|
"argumentHint": "[--all] [--ci] [--json]",
|
|
20
25
|
"status": "available"
|
|
21
26
|
},
|
|
27
|
+
"verdicts": {
|
|
28
|
+
"description": "Verify a critique's verdict files: every rule in each pass judged once, no id that does not exist, no rule in the wrong arm, rendered only with a screenshot. Computes the counts the critique reports, so the agent never writes them.",
|
|
29
|
+
"argumentHint": "<surface>",
|
|
30
|
+
"status": "available"
|
|
31
|
+
},
|
|
32
|
+
"probe": {
|
|
33
|
+
"description": "Print the render probe: a script the critique runs in a browser at 360, 768 and 1280px. It opens the phone menu, presses Escape, measures sideways scroll and whether styles and tokens applied; `verdicts` refuses verdicts it contradicts.",
|
|
34
|
+
"argumentHint": "",
|
|
35
|
+
"status": "available"
|
|
36
|
+
},
|
|
37
|
+
"gate": {
|
|
38
|
+
"description": "Run by the Claude Code Stop hook that `install` adds: blocks finishing while `check` fails on changed files or a critique's verdict files fail. Not run by hand.",
|
|
39
|
+
"argumentHint": "",
|
|
40
|
+
"status": "available"
|
|
41
|
+
},
|
|
22
42
|
"explain": {
|
|
23
|
-
"description": "Explain a rule, or find the rules you cannot name. Given an id, prints the rule's full text, its correction, the version it arrived in and who checks it — including the P-/M- pattern and mode specs, which no rule index contains. Given a word instead, searches every title and body and lists what matches. `--list` prints every id, or one section's.",
|
|
24
|
-
"argumentHint": "<rule-id | search term> [--list]",
|
|
43
|
+
"description": "Explain a rule, or find the rules you cannot name. Given an id, prints the rule's full text, its correction, the version it arrived in and who checks it — including the P-/M- pattern and mode specs, which no rule index contains. Given a word instead, searches every title and body and lists what matches. `--list` prints every id, or one section's. `--layer` names the six layers — principles, anti-patterns, tokens, components, layout, patterns — and lists one by name, which is how to find a rule when you know what you are trying to do but not its number.",
|
|
44
|
+
"argumentHint": "<rule-id | search term | layer name> [--list] [--layer]",
|
|
25
45
|
"status": "available"
|
|
46
|
+
},
|
|
47
|
+
"spec": {
|
|
48
|
+
"description": "Say exactly what is being built — a page, feature or functionality — scoped to its smallest useful version and specified at every screen size, then confirmed. Writes .jig/specs/<surface>.spec.md. No CLI — the agent does this.",
|
|
49
|
+
"argumentHint": "<page, feature or functionality, in your own words>",
|
|
50
|
+
"status": "agent"
|
|
51
|
+
},
|
|
52
|
+
"mockup": {
|
|
53
|
+
"description": "Low-fidelity design: a grayscale drawing of the confirmed spec at every screen size, reviewed before any code. Asks whether to draw it in HTML, Figma or Google Stitch, and tells you to connect that tool's MCP server if needed. No CLI — the agent does this.",
|
|
54
|
+
"argumentHint": "<page, feature or functionality, in your own words>",
|
|
55
|
+
"status": "agent"
|
|
56
|
+
},
|
|
57
|
+
"make": {
|
|
58
|
+
"description": "High-fidelity: build the actual page or feature from its confirmed spec and approved mockup — matching the mockup's structure, never copying its markup — recording any deviation back into the spec. No CLI — the agent does this.",
|
|
59
|
+
"argumentHint": "<page, feature or functionality, in your own words>",
|
|
60
|
+
"status": "agent"
|
|
61
|
+
},
|
|
62
|
+
"critique": {
|
|
63
|
+
"description": "Scrutinise what was built against the rules, its spec and its mockup: render it, judge what check cannot, and report by rule id. Needs DECISIONS.md. No CLI — the agent does this.",
|
|
64
|
+
"argumentHint": "<page, feature or functionality, in your own words>",
|
|
65
|
+
"status": "agent"
|
|
26
66
|
}
|
|
27
67
|
}
|