@12ui/design 0.2.4 → 0.2.6
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/README.md +16 -17
- package/dist/cli-corpus-reference-downloads.d.ts.map +1 -1
- package/dist/cli-corpus-reference-downloads.js +4 -0
- package/dist/cli-corpus-reference-downloads.js.map +1 -1
- package/dist/cli-corpus-types.d.ts +4 -0
- package/dist/cli-corpus-types.d.ts.map +1 -1
- package/dist/cli-image-batch-command.d.ts +8 -0
- package/dist/cli-image-batch-command.d.ts.map +1 -0
- package/dist/cli-image-batch-command.js +127 -0
- package/dist/cli-image-batch-command.js.map +1 -0
- package/dist/cli-image-command.d.ts.map +1 -1
- package/dist/cli-image-command.js +17 -111
- package/dist/cli-image-command.js.map +1 -1
- package/dist/cli.js +6 -1
- package/dist/cli.js.map +1 -1
- package/dist/client-auth-guidance.d.ts +3 -0
- package/dist/client-auth-guidance.d.ts.map +1 -0
- package/dist/client-auth-guidance.js +14 -0
- package/dist/client-auth-guidance.js.map +1 -0
- package/dist/config.d.ts.map +1 -1
- package/dist/config.js +2 -1
- package/dist/config.js.map +1 -1
- package/dist/conversion-client.d.ts.map +1 -1
- package/dist/conversion-client.js +2 -1
- package/dist/conversion-client.js.map +1 -1
- package/dist/corpus-client.d.ts.map +1 -1
- package/dist/corpus-client.js +2 -1
- package/dist/corpus-client.js.map +1 -1
- package/dist/image-generation-batch-manifest.d.ts +24 -0
- package/dist/image-generation-batch-manifest.d.ts.map +1 -0
- package/dist/image-generation-batch-manifest.js +91 -0
- package/dist/image-generation-batch-manifest.js.map +1 -0
- package/dist/image-generation-evidence.d.ts +9 -1
- package/dist/image-generation-evidence.d.ts.map +1 -1
- package/dist/image-generation-evidence.js.map +1 -1
- package/dist/image-generation-request.d.ts +29 -0
- package/dist/image-generation-request.d.ts.map +1 -0
- package/dist/image-generation-request.js +46 -0
- package/dist/image-generation-request.js.map +1 -0
- package/dist/image-generation-run.d.ts +35 -0
- package/dist/image-generation-run.d.ts.map +1 -0
- package/dist/image-generation-run.js +134 -0
- package/dist/image-generation-run.js.map +1 -0
- package/dist/image-generation-usage.d.ts +71 -0
- package/dist/image-generation-usage.d.ts.map +1 -0
- package/dist/image-generation-usage.js +192 -0
- package/dist/image-generation-usage.js.map +1 -0
- package/dist/legacy-skill-catalog.d.ts.map +1 -1
- package/dist/legacy-skill-catalog.js +23 -2
- package/dist/legacy-skill-catalog.js.map +1 -1
- package/dist/skill-installer.d.ts.map +1 -1
- package/dist/skill-installer.js +43 -8
- package/dist/skill-installer.js.map +1 -1
- package/package.json +2 -2
- package/skills/design/SKILL.md +108 -205
- package/skills/design/references/selection-contract.md +43 -75
- package/skills/design-convert/SKILL.md +47 -97
- package/skills/design-search/SKILL.md +26 -60
|
@@ -5,35 +5,22 @@ description: "Convert a PNG, JPEG, or WebP image into a structured LayerDoc with
|
|
|
5
5
|
|
|
6
6
|
# Design Convert
|
|
7
7
|
|
|
8
|
-
Convert one finished
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
behavior.
|
|
8
|
+
Convert one finished image once, keep its base LayerDoc conversion, and derive
|
|
9
|
+
every required format from that structured source. Integrate code output into
|
|
10
|
+
the target project and verify the real result.
|
|
12
11
|
|
|
13
12
|
## Prepare
|
|
14
13
|
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
6. Derive a stable idempotency key from the project, source-image SHA-256,
|
|
26
|
-
viewport, model, and conversion revision.
|
|
27
|
-
|
|
28
|
-
Never invent output, substitute cached results, or repeat extraction to produce
|
|
29
|
-
another format. Before dispatch, persist the exact source digest, output, model,
|
|
30
|
-
width, idempotency key, and origin in the run directory. The conversion CLI
|
|
31
|
-
prints operation/result metadata to stdout; it does not create a separate
|
|
32
|
-
request-evidence file.
|
|
33
|
-
|
|
34
|
-
## Create one base LayerDoc conversion
|
|
35
|
-
|
|
36
|
-
Create the structured source once:
|
|
14
|
+
Inspect the source dimensions and intended CSS viewport. Inspect the target
|
|
15
|
+
project's instructions, framework, routes, components, assets, styling,
|
|
16
|
+
dependencies, and validation commands. Work under the system temporary
|
|
17
|
+
directory and derive a stable idempotency key from the project, source hash,
|
|
18
|
+
viewport, model, and workflow revision.
|
|
19
|
+
|
|
20
|
+
Accepted input is a static PNG, JPEG, or WebP. Never invent output, use cached
|
|
21
|
+
results, or repeat extraction merely to obtain another format.
|
|
22
|
+
|
|
23
|
+
## Create the base LayerDoc
|
|
37
24
|
|
|
38
25
|
```bash
|
|
39
26
|
set -o pipefail
|
|
@@ -45,16 +32,10 @@ set -o pipefail
|
|
|
45
32
|
--out <run-dir>/base.layerdoc.json | tee <run-dir>/base-result.json
|
|
46
33
|
```
|
|
47
34
|
|
|
48
|
-
Preserve the
|
|
49
|
-
|
|
50
|
-
conversion ID is the source for all later exports.
|
|
51
|
-
|
|
52
|
-
For a long operation, add `--detach` to the create command and omit `--out`,
|
|
53
|
-
which is not materialized by a detached create. Capture its JSON stdout, then
|
|
54
|
-
finish the same operation with all required resume arguments:
|
|
35
|
+
Preserve the source conversion ID, LayerDoc, assets, manifest, and stdout. For
|
|
36
|
+
a detached create, capture its ID and resume that same operation:
|
|
55
37
|
|
|
56
38
|
```bash
|
|
57
|
-
set -o pipefail
|
|
58
39
|
12ui convert <source-image> \
|
|
59
40
|
--output layerdoc \
|
|
60
41
|
--model standard \
|
|
@@ -67,83 +48,52 @@ set -o pipefail
|
|
|
67
48
|
--out <run-dir>/base.layerdoc.json
|
|
68
49
|
```
|
|
69
50
|
|
|
70
|
-
If create emitted an
|
|
71
|
-
|
|
72
|
-
impossible: repeat the exact create command with the same stable idempotency key
|
|
73
|
-
so the service can return the original operation without repeating paid work.
|
|
51
|
+
If create emitted an ID, resume it. If it failed before emitting one, repeat
|
|
52
|
+
the exact request with the same idempotency key.
|
|
74
53
|
|
|
75
54
|
## Export from the base conversion
|
|
76
55
|
|
|
77
|
-
|
|
56
|
+
Use one command with comma-separated outputs. The CLI starts independent
|
|
57
|
+
exports in parallel without repeating image extraction:
|
|
78
58
|
|
|
79
59
|
```bash
|
|
80
60
|
12ui export <source-conversion-id> \
|
|
81
|
-
--output
|
|
82
|
-
--out-dir <
|
|
61
|
+
--output html,html_fixed,svg,png,jpg,webp,pdf,psd,pptx,sketch \
|
|
62
|
+
--out-dir <run-dir>/exports \
|
|
83
63
|
--idempotency-key <stable-export-key>
|
|
84
64
|
```
|
|
85
65
|
|
|
86
|
-
|
|
87
|
-
`
|
|
88
|
-
`
|
|
89
|
-
reported by `12ui capabilities --json`.
|
|
66
|
+
Request only needed outputs. The identifiers are `html`, `html_fixed`, `svg`,
|
|
67
|
+
`png`, `jpg`, `webp`, `pdf`, `psd`, `pptx`, `sketch`, `web_project`, and
|
|
68
|
+
`app_project`.
|
|
90
69
|
|
|
91
|
-
|
|
92
|
-
directories, but refuses before any API request when a selected output, its
|
|
93
|
-
asset directory, or `export-manifest.json` already exists; never remove those
|
|
94
|
-
collisions merely to force another dispatch.
|
|
95
|
-
|
|
96
|
-
Independent exports may run in parallel because they all reference the same
|
|
97
|
-
immutable base conversion. Reuse the source conversion ID; never repeat image
|
|
98
|
-
extraction for export fan-out.
|
|
99
|
-
|
|
100
|
-
Web and native project exports require an exact schema-and-matrix-derived
|
|
101
|
-
profile:
|
|
70
|
+
Project outputs require an exact profile appropriate to the inspected target:
|
|
102
71
|
|
|
103
72
|
```bash
|
|
104
73
|
12ui export <source-conversion-id> \
|
|
105
|
-
--output web_project \
|
|
74
|
+
--output web_project,app_project \
|
|
106
75
|
--web-profile '{"version":1,"framework":"react","styling":"tailwind","language":"typescript","packaging":"page"}' \
|
|
107
|
-
--out-dir <run-dir>/web-export \
|
|
108
|
-
--idempotency-key <stable-web-export-key>
|
|
109
|
-
```
|
|
110
|
-
|
|
111
|
-
```bash
|
|
112
|
-
12ui export <source-conversion-id> \
|
|
113
|
-
--output app_project \
|
|
114
76
|
--app-profile '{"version":1,"framework":"expo","styling":"native","language":"typescript","packaging":"screen"}' \
|
|
115
|
-
--out-dir <run-dir>/
|
|
116
|
-
--idempotency-key <stable-
|
|
77
|
+
--out-dir <run-dir>/projects \
|
|
78
|
+
--idempotency-key <stable-project-export-key>
|
|
117
79
|
```
|
|
118
80
|
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
- Compare the launched result with the source at the intended viewport plus
|
|
139
|
-
representative narrower and wider viewports.
|
|
140
|
-
- Render or open PDF, PSD, PPTX, and Sketch artifacts with appropriate tooling;
|
|
141
|
-
inspect their structure, dimensions, assets, and visible fidelity.
|
|
142
|
-
- Inspect SVG and raster exports at original resolution.
|
|
143
|
-
- Correct integration defects in project code. For a conversion defect,
|
|
144
|
-
preserve the conversion ID and visible evidence before deciding whether a
|
|
145
|
-
changed source or conversion revision warrants a new base conversion.
|
|
146
|
-
|
|
147
|
-
Report the source digest and base conversion ID, associated assets, every
|
|
148
|
-
export format/profile/conversion ID, integrated files, launches and
|
|
149
|
-
interactions, validation results, and remaining visual differences.
|
|
81
|
+
Do not guess or change a profile after dispatch. The CLI refuses destination
|
|
82
|
+
collisions before sending API requests; preserve existing evidence rather than
|
|
83
|
+
deleting it to force another run.
|
|
84
|
+
|
|
85
|
+
## Integrate and verify
|
|
86
|
+
|
|
87
|
+
Inspect generated files and dependencies before merging the smallest coherent
|
|
88
|
+
set into the target. Preserve project routing, tokens, components,
|
|
89
|
+
accessibility, dependency policy, and unrelated changes; remove duplicate
|
|
90
|
+
generated scaffolding.
|
|
91
|
+
|
|
92
|
+
Run focused checks in parallel when they do not contend for outputs. Launch
|
|
93
|
+
web/native examples, exercise interactions, and compare source and responsive
|
|
94
|
+
viewports. Open or render document/design exports and inspect structure,
|
|
95
|
+
dimensions, assets, and visible fidelity. Preserve conversion IDs and evidence
|
|
96
|
+
for any defect.
|
|
97
|
+
|
|
98
|
+
Report the source hash, base conversion ID and assets, each export ID/profile,
|
|
99
|
+
integrated files, launches, checks, and remaining visible differences.
|
|
@@ -5,36 +5,17 @@ description: "Search the 12UI Design Corpus from a rough UI, web, or mobile conc
|
|
|
5
5
|
|
|
6
6
|
# Design Search
|
|
7
7
|
|
|
8
|
-
Turn a rough interface concept into real
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
metrics; do not invent a second ranking.
|
|
12
|
-
|
|
13
|
-
## Prepare the query
|
|
14
|
-
|
|
15
|
-
Compose a concise query that describes:
|
|
16
|
-
|
|
17
|
-
- product, audience, and user goal;
|
|
18
|
-
- surface: UI, web, or mobile;
|
|
19
|
-
- desired personality, visual energy, and useful contrasts; and
|
|
20
|
-
- target viewport when known.
|
|
21
|
-
|
|
22
|
-
Describe the design problem rather than inventorying every section, control,
|
|
23
|
-
or exact string that the finished product will contain.
|
|
24
|
-
|
|
25
|
-
Do not name brands to imitate or ask to copy logos, names, or text. Corpus
|
|
26
|
-
images are inspiration rather than templates. Preserve the usage notice
|
|
27
|
-
returned by the service.
|
|
28
|
-
|
|
29
|
-
Verify the account with `12ui auth status`. When a local development setup has
|
|
30
|
-
a separate Login origin, include its documented `--login-origin <origin>`.
|
|
31
|
-
Keep one CLI installation and one Login/Worker pair for the entire request and
|
|
32
|
-
any resume.
|
|
8
|
+
Turn a rough interface concept into real local reference images. The corpus has
|
|
9
|
+
already explored, ranked, and diversified the design space; preserve its order
|
|
10
|
+
and returned evidence rather than inventing another ranking.
|
|
33
11
|
|
|
34
12
|
## Search
|
|
35
13
|
|
|
36
|
-
|
|
37
|
-
|
|
14
|
+
Write a concise query covering the product, audience, primary goal, surface,
|
|
15
|
+
and desired personality. Describe the design problem, not every section,
|
|
16
|
+
control, exact string, or brand to imitate.
|
|
17
|
+
|
|
18
|
+
Standalone search defaults to four results:
|
|
38
19
|
|
|
39
20
|
```bash
|
|
40
21
|
12ui corpus inspire \
|
|
@@ -42,7 +23,7 @@ count instead of forcing four:
|
|
|
42
23
|
--out-dir <references-dir>
|
|
43
24
|
```
|
|
44
25
|
|
|
45
|
-
|
|
26
|
+
Respect an explicit requested count:
|
|
46
27
|
|
|
47
28
|
```bash
|
|
48
29
|
12ui corpus inspire \
|
|
@@ -51,44 +32,29 @@ For an explicit count:
|
|
|
51
32
|
--out-dir <references-dir>
|
|
52
33
|
```
|
|
53
34
|
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
Add `--origin <origin>` only when targeting a specific verified deployment.
|
|
59
|
-
Use `--wildness` only when the user or orchestrating workflow requests it. Do
|
|
60
|
-
not add guessed filters that could turn a metered request into an empty set.
|
|
61
|
-
|
|
62
|
-
`corpus inspire` reserves the output directory, saves request and response
|
|
63
|
-
evidence, downloads full images, and writes `manifest.json`. Confirm the
|
|
64
|
-
manifest count, unique IDs, decodable image files, and digest receipts.
|
|
35
|
+
Add `--aspect landscape|portrait|square` when the target is known. Prefer
|
|
36
|
+
direct `--query`; use `--query-file` only when quoting genuinely requires it.
|
|
37
|
+
Add `--origin` only when the task deliberately targets another deployment.
|
|
65
38
|
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
39
|
+
The command reserves the output directory, records request/response evidence,
|
|
40
|
+
downloads full images in parallel, and writes `manifest.json`. Validate the
|
|
41
|
+
count, unique IDs, decodable files, and hashes. Return the exact endpoint order
|
|
42
|
+
and each reference's role, arm, cell, relevance, relevance percentile, and
|
|
43
|
+
quality percentile. Do not recalculate, reorder, average, or normalize them.
|
|
69
44
|
|
|
70
|
-
## Resume
|
|
45
|
+
## Resume
|
|
71
46
|
|
|
72
|
-
|
|
73
|
-
directory and run:
|
|
47
|
+
For an interrupted or ambiguous attempt, keep its directory and run:
|
|
74
48
|
|
|
75
49
|
```bash
|
|
76
50
|
12ui corpus resume --out-dir <references-dir>
|
|
77
51
|
```
|
|
78
52
|
|
|
79
|
-
|
|
80
|
-
the
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
If `manifest.json` already exists, verify and reuse it. If the response is
|
|
85
|
-
underfilled, duplicated, corrupt, or still ambiguous after resume, report the
|
|
86
|
-
stable idempotency key and evidence path and stop. Never fill missing slots
|
|
87
|
-
with cached or invented references.
|
|
88
|
-
|
|
89
|
-
## Handoff
|
|
53
|
+
Reuse a valid completed manifest. Never delete evidence, start a replacement
|
|
54
|
+
request for the unchanged query, or fill missing slots with cached or invented
|
|
55
|
+
references. If resume remains ambiguous or underfilled, report the stable key
|
|
56
|
+
and evidence path and stop.
|
|
90
57
|
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
references before generation can begin.
|
|
58
|
+
Hand off the manifest path, idempotency key, set ID, ordered IDs, image paths,
|
|
59
|
+
hashes, returned metrics, and usage notice. A `design` run requires exactly
|
|
60
|
+
four valid references before generation.
|