@design-parity/catalog-export 0.1.20 → 0.1.22
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 +6 -0
- package/dist/index.d.ts +4 -1
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +2 -0
- package/dist/index.js.map +1 -1
- package/dist/ingest.d.ts.map +1 -1
- package/dist/ingest.js +2 -0
- package/dist/ingest.js.map +1 -1
- package/dist/manifest.d.ts +3 -1
- package/dist/manifest.d.ts.map +1 -1
- package/dist/manifest.js +1 -0
- package/dist/manifest.js.map +1 -1
- package/dist/redlines.d.ts +28 -0
- package/dist/redlines.d.ts.map +1 -0
- package/dist/redlines.js +65 -0
- package/dist/redlines.js.map +1 -0
- package/dist/spec.d.ts +74 -0
- package/dist/spec.d.ts.map +1 -0
- package/dist/spec.js +107 -0
- package/dist/spec.js.map +1 -0
- package/dist/types.d.ts +26 -0
- package/dist/types.d.ts.map +1 -1
- package/package.json +2 -2
package/README.md
CHANGED
|
@@ -26,6 +26,12 @@ For each component, in its primary modes (state × theme × size):
|
|
|
26
26
|
*issue* greenlines from the renderer's a11y / contrast / i18n findings, and
|
|
27
27
|
`info` *spec* greenlines documenting each interactive node's role and measured
|
|
28
28
|
touch-target size.
|
|
29
|
+
- **A redline layer** — the layout spacing spec: for each node with geometry, its
|
|
30
|
+
box plus the content `padding`, inter-slot `gap` (`Arrangement.spacedBy`), and
|
|
31
|
+
corner radius — so a component and its slots each carry an importable box +
|
|
32
|
+
spacing, not just a picture. (Walks the semantics tree, so a slot with no
|
|
33
|
+
semantics — a decorative icon — has no box; full slot coverage is a
|
|
34
|
+
renderer-side follow-up.)
|
|
29
35
|
- **A token set** — the system's resolved `colors` / `typography` / `radius`
|
|
30
36
|
(shapes), exported as a W3C **DTCG** file plus a **Figma variable-collection**
|
|
31
37
|
projection (light/dark as modes).
|
package/dist/index.d.ts
CHANGED
|
@@ -12,14 +12,17 @@
|
|
|
12
12
|
* `docs/design-artifacts/REFERENCE_KITS.md`). Depends only on
|
|
13
13
|
* `@design-parity/core`.
|
|
14
14
|
*/
|
|
15
|
-
export type { Catalog, CatalogComponent, CatalogMeta, ComponentReference, ComponentVariants, Greenline, } from "./types.js";
|
|
15
|
+
export type { Catalog, CatalogComponent, CatalogMeta, ComponentReference, ComponentVariants, Greenline, Redline, RedlinePadding, } from "./types.js";
|
|
16
16
|
export { buildCatalog, buildComponent, } from "./ingest.js";
|
|
17
17
|
export type { ComponentSource } from "./ingest.js";
|
|
18
18
|
export { INTERACTIVE_ROLES, MIN_TOUCH_TARGET_DP, buildGreenlines, findingToGreenline, findingsToGreenlines, specGreenlines, } from "./greenlines.js";
|
|
19
|
+
export { buildRedlines } from "./redlines.js";
|
|
19
20
|
export { imagePath, slug, toCatalogManifest, } from "./manifest.js";
|
|
20
21
|
export type { CatalogManifest, CatalogManifestComponent, CatalogManifestImage, ManifestOptions, VariantKind, } from "./manifest.js";
|
|
21
22
|
export { toFigmaVariables } from "./figma.js";
|
|
22
23
|
export type { FigmaVariable, FigmaVariableCollection, FigmaVariableType, } from "./figma.js";
|
|
23
24
|
export { writeCatalog } from "./write.js";
|
|
24
25
|
export type { WriteOptions, WriteResult } from "./write.js";
|
|
26
|
+
export { catalogFromCandidates } from "./spec.js";
|
|
27
|
+
export type { CatalogSpec, CatalogSpecComponent, CatalogSpecGroup, FromCandidatesOptions, FromCandidatesResult, } from "./spec.js";
|
|
25
28
|
//# sourceMappingURL=index.d.ts.map
|
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;GAaG;AACH,YAAY,EACV,OAAO,EACP,gBAAgB,EAChB,WAAW,EACX,kBAAkB,EAClB,iBAAiB,EACjB,SAAS,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;GAaG;AACH,YAAY,EACV,OAAO,EACP,gBAAgB,EAChB,WAAW,EACX,kBAAkB,EAClB,iBAAiB,EACjB,SAAS,EACT,OAAO,EACP,cAAc,GACf,MAAM,YAAY,CAAC;AAEpB,OAAO,EACL,YAAY,EACZ,cAAc,GACf,MAAM,aAAa,CAAC;AACrB,YAAY,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AAEnD,OAAO,EACL,iBAAiB,EACjB,mBAAmB,EACnB,eAAe,EACf,kBAAkB,EAClB,oBAAoB,EACpB,cAAc,GACf,MAAM,iBAAiB,CAAC;AAEzB,OAAO,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AAE9C,OAAO,EACL,SAAS,EACT,IAAI,EACJ,iBAAiB,GAClB,MAAM,eAAe,CAAC;AACvB,YAAY,EACV,eAAe,EACf,wBAAwB,EACxB,oBAAoB,EACpB,eAAe,EACf,WAAW,GACZ,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAE,gBAAgB,EAAE,MAAM,YAAY,CAAC;AAC9C,YAAY,EACV,aAAa,EACb,uBAAuB,EACvB,iBAAiB,GAClB,MAAM,YAAY,CAAC;AAEpB,OAAO,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAC1C,YAAY,EAAE,YAAY,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AAE5D,OAAO,EAAE,qBAAqB,EAAE,MAAM,WAAW,CAAC;AAClD,YAAY,EACV,WAAW,EACX,oBAAoB,EACpB,gBAAgB,EAChB,qBAAqB,EACrB,oBAAoB,GACrB,MAAM,WAAW,CAAC"}
|
package/dist/index.js
CHANGED
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
export { buildCatalog, buildComponent, } from "./ingest.js";
|
|
2
2
|
export { INTERACTIVE_ROLES, MIN_TOUCH_TARGET_DP, buildGreenlines, findingToGreenline, findingsToGreenlines, specGreenlines, } from "./greenlines.js";
|
|
3
|
+
export { buildRedlines } from "./redlines.js";
|
|
3
4
|
export { imagePath, slug, toCatalogManifest, } from "./manifest.js";
|
|
4
5
|
export { toFigmaVariables } from "./figma.js";
|
|
5
6
|
export { writeCatalog } from "./write.js";
|
|
7
|
+
export { catalogFromCandidates } from "./spec.js";
|
|
6
8
|
//# sourceMappingURL=index.js.map
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAyBA,OAAO,EACL,YAAY,EACZ,cAAc,GACf,MAAM,aAAa,CAAC;AAGrB,OAAO,EACL,iBAAiB,EACjB,mBAAmB,EACnB,eAAe,EACf,kBAAkB,EAClB,oBAAoB,EACpB,cAAc,GACf,MAAM,iBAAiB,CAAC;AAEzB,OAAO,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AAE9C,OAAO,EACL,SAAS,EACT,IAAI,EACJ,iBAAiB,GAClB,MAAM,eAAe,CAAC;AASvB,OAAO,EAAE,gBAAgB,EAAE,MAAM,YAAY,CAAC;AAO9C,OAAO,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAG1C,OAAO,EAAE,qBAAqB,EAAE,MAAM,WAAW,CAAC"}
|
package/dist/ingest.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ingest.d.ts","sourceRoot":"","sources":["../src/ingest.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AACH,OAAO,KAAK,EACV,YAAY,EACZ,OAAO,EACP,KAAK,EACL,YAAY,EACb,MAAM,qBAAqB,CAAC;
|
|
1
|
+
{"version":3,"file":"ingest.d.ts","sourceRoot":"","sources":["../src/ingest.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AACH,OAAO,KAAK,EACV,YAAY,EACZ,OAAO,EACP,KAAK,EACL,YAAY,EACb,MAAM,qBAAqB,CAAC;AAI7B,OAAO,KAAK,EACV,OAAO,EACP,gBAAgB,EAChB,WAAW,EACX,kBAAkB,EACnB,MAAM,YAAY,CAAC;AAEpB,8EAA8E;AAC9E,MAAM,WAAW,eAAe;IAC9B,WAAW,EAAE,MAAM,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,kBAAkB,CAAC;IAC/B,yDAAyD;IACzD,KAAK,EAAE,KAAK,EAAE,CAAC;IACf,oEAAoE;IACpE,MAAM,CAAC,EAAE,KAAK,EAAE,CAAC;IACjB,oEAAoE;IACpE,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB,gFAAgF;IAChF,SAAS,CAAC,EAAE,YAAY,CAAC;IACzB,0EAA0E;IAC1E,QAAQ,CAAC,EAAE,OAAO,EAAE,CAAC;CACtB;AAED,4EAA4E;AAC5E,wBAAgB,cAAc,CAAC,MAAM,EAAE,eAAe,GAAG,gBAAgB,CAoBxE;AAED;;;;;GAKG;AACH,wBAAgB,YAAY,CAC1B,IAAI,EAAE,WAAW,EACjB,OAAO,EAAE,SAAS,eAAe,EAAE,EACnC,WAAW,CAAC,EAAE,YAAY,GACzB,OAAO,CAQT"}
|
package/dist/ingest.js
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { buildGreenlines } from "./greenlines.js";
|
|
2
|
+
import { buildRedlines } from "./redlines.js";
|
|
2
3
|
/** Assemble one {@link CatalogComponent}, computing its greenline layer. */
|
|
3
4
|
export function buildComponent(source) {
|
|
4
5
|
if (source.ideal.length === 0) {
|
|
@@ -10,6 +11,7 @@ export function buildComponent(source) {
|
|
|
10
11
|
? { ideal: source.ideal, layout: source.layout }
|
|
11
12
|
: { ideal: source.ideal },
|
|
12
13
|
greenlines: buildGreenlines(source.findings, source.semantics),
|
|
14
|
+
redlines: buildRedlines(source.semantics),
|
|
13
15
|
};
|
|
14
16
|
if (source.group !== undefined)
|
|
15
17
|
component.group = source.group;
|
package/dist/ingest.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ingest.js","sourceRoot":"","sources":["../src/ingest.ts"],"names":[],"mappings":"AAkBA,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;
|
|
1
|
+
{"version":3,"file":"ingest.js","sourceRoot":"","sources":["../src/ingest.ts"],"names":[],"mappings":"AAkBA,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAClD,OAAO,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AA0B9C,4EAA4E;AAC5E,MAAM,UAAU,cAAc,CAAC,MAAuB;IACpD,IAAI,MAAM,CAAC,KAAK,CAAC,MAAM,KAAK,CAAC,EAAE,CAAC;QAC9B,MAAM,IAAI,KAAK,CACb,8BAA8B,MAAM,CAAC,WAAW,uBAAuB,CACxE,CAAC;IACJ,CAAC;IACD,MAAM,SAAS,GAAqB;QAClC,WAAW,EAAE,MAAM,CAAC,WAAW;QAC/B,QAAQ,EAAE,MAAM,CAAC,MAAM;YACrB,CAAC,CAAC,EAAE,KAAK,EAAE,MAAM,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE;YAChD,CAAC,CAAC,EAAE,KAAK,EAAE,MAAM,CAAC,KAAK,EAAE;QAC3B,UAAU,EAAE,eAAe,CAAC,MAAM,CAAC,QAAQ,EAAE,MAAM,CAAC,SAAS,CAAC;QAC9D,QAAQ,EAAE,aAAa,CAAC,MAAM,CAAC,SAAS,CAAC;KAC1C,CAAC;IACF,IAAI,MAAM,CAAC,KAAK,KAAK,SAAS;QAAE,SAAS,CAAC,KAAK,GAAG,MAAM,CAAC,KAAK,CAAC;IAC/D,IAAI,MAAM,CAAC,OAAO,KAAK,SAAS;QAAE,SAAS,CAAC,OAAO,GAAG,MAAM,CAAC,OAAO,CAAC;IACrE,IAAI,MAAM,CAAC,SAAS,KAAK,SAAS;QAAE,SAAS,CAAC,SAAS,GAAG,MAAM,CAAC,SAAS,CAAC;IAC3E,IAAI,MAAM,CAAC,MAAM,KAAK,SAAS;QAAE,SAAS,CAAC,MAAM,GAAG,MAAM,CAAC,MAAM,CAAC;IAClE,IAAI,MAAM,CAAC,SAAS,KAAK,SAAS;QAAE,SAAS,CAAC,SAAS,GAAG,MAAM,CAAC,SAAS,CAAC;IAC3E,OAAO,SAAS,CAAC;AACnB,CAAC;AAED;;;;;GAKG;AACH,MAAM,UAAU,YAAY,CAC1B,IAAiB,EACjB,OAAmC,EACnC,WAA0B;IAE1B,MAAM,UAAU,GAAG,OAAO,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAC/C,MAAM,cAAc,GAClB,WAAW;QACX,UAAU,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,SAAS,EAAE,WAAW,CAAC,EAAE,SAAS,EAAE,WAAW,CAAC;IAC3E,MAAM,OAAO,GAAY,EAAE,IAAI,EAAE,UAAU,EAAE,CAAC;IAC9C,IAAI,cAAc;QAAE,OAAO,CAAC,WAAW,GAAG,cAAc,CAAC;IACzD,OAAO,OAAO,CAAC;AACjB,CAAC"}
|
package/dist/manifest.d.ts
CHANGED
|
@@ -13,7 +13,7 @@
|
|
|
13
13
|
* {@link writeCatalog} step materializes the bytes those paths point at.
|
|
14
14
|
*/
|
|
15
15
|
import type { DesignTokens, Image, Theme } from "@design-parity/core";
|
|
16
|
-
import type { Catalog, ComponentReference, Greenline } from "./types.js";
|
|
16
|
+
import type { Catalog, ComponentReference, Greenline, Redline } from "./types.js";
|
|
17
17
|
/** Which sticker-sheet variant an image belongs to. */
|
|
18
18
|
export type VariantKind = "ideal" | "layout";
|
|
19
19
|
/** One image entry in the manifest — bundle-relative path + variant keys. */
|
|
@@ -36,6 +36,8 @@ export interface CatalogManifestComponent {
|
|
|
36
36
|
images: CatalogManifestImage[];
|
|
37
37
|
tokens?: DesignTokens;
|
|
38
38
|
greenlines: Greenline[];
|
|
39
|
+
/** Layout spacing spec — per-node box + padding + gap + corner radius. */
|
|
40
|
+
redlines: Redline[];
|
|
39
41
|
}
|
|
40
42
|
/** The parsed/serializable `catalog.json`. */
|
|
41
43
|
export interface CatalogManifest {
|
package/dist/manifest.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"manifest.d.ts","sourceRoot":"","sources":["../src/manifest.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;GAaG;AACH,OAAO,KAAK,EAAE,YAAY,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,qBAAqB,CAAC;AAEtE,OAAO,KAAK,
|
|
1
|
+
{"version":3,"file":"manifest.d.ts","sourceRoot":"","sources":["../src/manifest.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;GAaG;AACH,OAAO,KAAK,EAAE,YAAY,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,qBAAqB,CAAC;AAEtE,OAAO,KAAK,EACV,OAAO,EAEP,kBAAkB,EAClB,SAAS,EACT,OAAO,EACR,MAAM,YAAY,CAAC;AAEpB,uDAAuD;AACvD,MAAM,MAAM,WAAW,GAAG,OAAO,GAAG,QAAQ,CAAC;AAE7C,6EAA6E;AAC7E,MAAM,WAAW,oBAAoB;IACnC,OAAO,EAAE,WAAW,CAAC;IACrB,kDAAkD;IAClD,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;CAChB;AAED,2CAA2C;AAC3C,MAAM,WAAW,wBAAwB;IACvC,WAAW,EAAE,MAAM,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,kBAAkB,CAAC;IAC/B,MAAM,EAAE,oBAAoB,EAAE,CAAC;IAC/B,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB,UAAU,EAAE,SAAS,EAAE,CAAC;IACxB,0EAA0E;IAC1E,QAAQ,EAAE,OAAO,EAAE,CAAC;CACrB;AAED,8CAA8C;AAC9C,MAAM,WAAW,eAAe;IAC9B,MAAM,EAAE,0BAA0B,CAAC;IACnC,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,8EAA8E;IAC9E,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,EAAE,wBAAwB,EAAE,CAAC;CACxC;AAED,MAAM,WAAW,eAAe;IAC9B,yEAAyE;IACzE,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAID,qEAAqE;AACrE,wBAAgB,IAAI,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,CAO1C;AAED;;;;;GAKG;AACH,wBAAgB,SAAS,CACvB,WAAW,EAAE,MAAM,EACnB,OAAO,EAAE,WAAW,EACpB,KAAK,EAAE,KAAK,GACX,MAAM,CAMR;AAqCD,mFAAmF;AACnF,wBAAgB,iBAAiB,CAC/B,OAAO,EAAE,OAAO,EAChB,IAAI,GAAE,eAAoB,GACzB,eAAe,CAcjB"}
|
package/dist/manifest.js
CHANGED
|
@@ -48,6 +48,7 @@ function manifestComponent(component) {
|
|
|
48
48
|
componentId: component.componentId,
|
|
49
49
|
images: manifestImages(component),
|
|
50
50
|
greenlines: component.greenlines,
|
|
51
|
+
redlines: component.redlines,
|
|
51
52
|
};
|
|
52
53
|
if (component.group !== undefined)
|
|
53
54
|
out.group = component.group;
|
package/dist/manifest.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"manifest.js","sourceRoot":"","sources":["../src/manifest.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"manifest.js","sourceRoot":"","sources":["../src/manifest.ts"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Build the **slot redline** layer for a component — the spacing spec.
|
|
3
|
+
*
|
|
4
|
+
* Where the greenlines annotate accessibility, the redlines annotate **layout**:
|
|
5
|
+
* for each node that carries layout geometry, a {@link Redline} records its
|
|
6
|
+
* bounding box plus the padding it insets its content by, the gap it spaces its
|
|
7
|
+
* children by (`Arrangement.spacedBy`), and its corner radius. So a component and
|
|
8
|
+
* its slots each get a box, and the padding *between* slots is captured as a
|
|
9
|
+
* number — the redline a designer reads off a spec.
|
|
10
|
+
*
|
|
11
|
+
* The data is already on the {@link SemanticTree} the renderer produced
|
|
12
|
+
* (`@design-parity/candidate` maps `compose/semantics`' per-node `padding` / `gap`
|
|
13
|
+
* / `cornerRadius` into `tokens.spacing` / `tokens.radius`); this module just
|
|
14
|
+
* surfaces it as a flat, importable layer. Pure functions over core types.
|
|
15
|
+
*
|
|
16
|
+
* Coverage note: this walks the **semantics** tree, so a slot that carries no
|
|
17
|
+
* semantics (a decorative icon, a spacer) produces no node and so no redline.
|
|
18
|
+
* Full slot coverage needs the layout/placeable tree — a renderer-side follow-up.
|
|
19
|
+
*/
|
|
20
|
+
import type { SemanticTree } from "@design-parity/core";
|
|
21
|
+
import type { Redline } from "./types.js";
|
|
22
|
+
/**
|
|
23
|
+
* Walk a {@link SemanticTree} and emit a {@link Redline} for every node that
|
|
24
|
+
* carries layout geometry (a box plus padding / gap / corner radius), in
|
|
25
|
+
* depth-first order — the component box first, then its slots.
|
|
26
|
+
*/
|
|
27
|
+
export declare function buildRedlines(semantics: SemanticTree | undefined): Redline[];
|
|
28
|
+
//# sourceMappingURL=redlines.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"redlines.d.ts","sourceRoot":"","sources":["../src/redlines.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;GAkBG;AACH,OAAO,KAAK,EAAgB,YAAY,EAAE,MAAM,qBAAqB,CAAC;AAEtE,OAAO,KAAK,EAAE,OAAO,EAAkB,MAAM,YAAY,CAAC;AAuC1D;;;;GAIG;AACH,wBAAgB,aAAa,CAAC,SAAS,EAAE,YAAY,GAAG,SAAS,GAAG,OAAO,EAAE,CAU5E"}
|
package/dist/redlines.js
ADDED
|
@@ -0,0 +1,65 @@
|
|
|
1
|
+
/** Read per-edge padding out of a node's resolved `spacing` token bag. */
|
|
2
|
+
function readPadding(spacing) {
|
|
3
|
+
if (!spacing)
|
|
4
|
+
return undefined;
|
|
5
|
+
// Uniform padding is also emitted as `padding`; expand it to all four edges
|
|
6
|
+
// unless a specific edge overrides it.
|
|
7
|
+
const uniform = spacing["padding"];
|
|
8
|
+
const out = {};
|
|
9
|
+
const edge = (key) => spacing[key] !== undefined ? spacing[key] : uniform;
|
|
10
|
+
const start = edge("paddingStart");
|
|
11
|
+
const top = edge("paddingTop");
|
|
12
|
+
const end = edge("paddingEnd");
|
|
13
|
+
const bottom = edge("paddingBottom");
|
|
14
|
+
if (start !== undefined)
|
|
15
|
+
out.start = start;
|
|
16
|
+
if (top !== undefined)
|
|
17
|
+
out.top = top;
|
|
18
|
+
if (end !== undefined)
|
|
19
|
+
out.end = end;
|
|
20
|
+
if (bottom !== undefined)
|
|
21
|
+
out.bottom = bottom;
|
|
22
|
+
return Object.keys(out).length > 0 ? out : undefined;
|
|
23
|
+
}
|
|
24
|
+
/** A node carries a redline when it has a box and any spacing/shape spec. */
|
|
25
|
+
function nodeRedline(node) {
|
|
26
|
+
if (!node.bounds)
|
|
27
|
+
return undefined;
|
|
28
|
+
const padding = readPadding(node.tokens?.spacing);
|
|
29
|
+
const gap = node.tokens?.spacing?.["gap"];
|
|
30
|
+
const cornerRadius = node.tokens?.radius?.["corner"];
|
|
31
|
+
if (!padding && gap === undefined && cornerRadius === undefined)
|
|
32
|
+
return undefined;
|
|
33
|
+
const out = { bounds: node.bounds };
|
|
34
|
+
if (node.role !== undefined)
|
|
35
|
+
out.role = node.role;
|
|
36
|
+
if (node.label !== undefined)
|
|
37
|
+
out.label = node.label;
|
|
38
|
+
if (padding)
|
|
39
|
+
out.padding = padding;
|
|
40
|
+
if (gap !== undefined)
|
|
41
|
+
out.gap = gap;
|
|
42
|
+
if (cornerRadius !== undefined)
|
|
43
|
+
out.cornerRadius = cornerRadius;
|
|
44
|
+
return out;
|
|
45
|
+
}
|
|
46
|
+
/**
|
|
47
|
+
* Walk a {@link SemanticTree} and emit a {@link Redline} for every node that
|
|
48
|
+
* carries layout geometry (a box plus padding / gap / corner radius), in
|
|
49
|
+
* depth-first order — the component box first, then its slots.
|
|
50
|
+
*/
|
|
51
|
+
export function buildRedlines(semantics) {
|
|
52
|
+
if (!semantics)
|
|
53
|
+
return [];
|
|
54
|
+
const out = [];
|
|
55
|
+
const visit = (node) => {
|
|
56
|
+
const redline = nodeRedline(node);
|
|
57
|
+
if (redline)
|
|
58
|
+
out.push(redline);
|
|
59
|
+
for (const child of node.children ?? [])
|
|
60
|
+
visit(child);
|
|
61
|
+
};
|
|
62
|
+
visit(semantics.root);
|
|
63
|
+
return out;
|
|
64
|
+
}
|
|
65
|
+
//# sourceMappingURL=redlines.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"redlines.js","sourceRoot":"","sources":["../src/redlines.ts"],"names":[],"mappings":"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"}
|
package/dist/spec.d.ts
ADDED
|
@@ -0,0 +1,74 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Build a {@link Catalog} from a rendered preview's {@link CandidateRender}s and
|
|
3
|
+
* a catalog **spec** — the bridge from "a module was rendered" to "here is the
|
|
4
|
+
* importable sticker sheet".
|
|
5
|
+
*
|
|
6
|
+
* The spec ({@link CatalogSpec}, the committed `catalog.spec.json` next to a
|
|
7
|
+
* catalog module) declares the inventory: which preview function fills which
|
|
8
|
+
* component slot, its group, caption, and seed-kit reference. This module is the
|
|
9
|
+
* pure join: match each spec component to the candidate whose preview produced
|
|
10
|
+
* it (by function name), and assemble the {@link ComponentSource}s. The caller
|
|
11
|
+
* obtains the `CandidateRender[]` however it likes — `@design-parity/candidate`'s
|
|
12
|
+
* `loadPreviewBundle` for a static render, or the live daemon source.
|
|
13
|
+
*
|
|
14
|
+
* `CandidateRender` is a `@design-parity/core` type, so this stays core-only.
|
|
15
|
+
*/
|
|
16
|
+
import type { CandidateRender, DesignTokens } from "@design-parity/core";
|
|
17
|
+
import type { Catalog, ComponentReference } from "./types.js";
|
|
18
|
+
/** One component slot in a {@link CatalogSpec} group. */
|
|
19
|
+
export interface CatalogSpecComponent {
|
|
20
|
+
/** Stable component id, e.g. `"Button/Filled"`. */
|
|
21
|
+
componentId: string;
|
|
22
|
+
/** The `@Preview` **function name** that renders it, e.g. `"FilledButton"`. */
|
|
23
|
+
preview: string;
|
|
24
|
+
caption?: string;
|
|
25
|
+
/** Published-kit reference (URL or `figma:` handle) for the seed import. */
|
|
26
|
+
reference?: ComponentReference;
|
|
27
|
+
}
|
|
28
|
+
/** A named group of components in a {@link CatalogSpec}. */
|
|
29
|
+
export interface CatalogSpecGroup {
|
|
30
|
+
name: string;
|
|
31
|
+
components: CatalogSpecComponent[];
|
|
32
|
+
}
|
|
33
|
+
/** The committed `catalog.spec.json` for a design-system catalog module. */
|
|
34
|
+
export interface CatalogSpec {
|
|
35
|
+
system: string;
|
|
36
|
+
title: string;
|
|
37
|
+
library?: string[];
|
|
38
|
+
groups: CatalogSpecGroup[];
|
|
39
|
+
}
|
|
40
|
+
export interface FromCandidatesOptions {
|
|
41
|
+
/** `compose-preview` version, recorded as provenance. */
|
|
42
|
+
renderer?: string;
|
|
43
|
+
/** Generation timestamp; defaults to now (ISO-8601). */
|
|
44
|
+
generatedAt?: string;
|
|
45
|
+
/** Explicit system token set; otherwise lifted from a component's semantics. */
|
|
46
|
+
themeTokens?: DesignTokens;
|
|
47
|
+
}
|
|
48
|
+
export interface FromCandidatesResult {
|
|
49
|
+
catalog: Catalog;
|
|
50
|
+
/** Spec components with no matching rendered preview (a coverage gap). */
|
|
51
|
+
missing: string[];
|
|
52
|
+
/**
|
|
53
|
+
* Components that rendered but carry no semantics tree — the render produced
|
|
54
|
+
* pixels but the `*.semantics.json` sidecar is absent (e.g. a best-effort
|
|
55
|
+
* `bundle pack --with-semantics` whose daemon/semantics capture silently
|
|
56
|
+
* failed). Without semantics there are no token, contrast, or greenline data,
|
|
57
|
+
* so a publishing job should treat this as an incomplete render, not ship it.
|
|
58
|
+
*/
|
|
59
|
+
withoutSemantics: string[];
|
|
60
|
+
}
|
|
61
|
+
/**
|
|
62
|
+
* Join rendered {@link CandidateRender}s to a {@link CatalogSpec} into a
|
|
63
|
+
* {@link Catalog}. Each spec component is matched to the candidate whose preview
|
|
64
|
+
* **function name** equals its `preview`; its captures become the `ideal`
|
|
65
|
+
* variant and its semantics carry the bounds/tokens the greenline + token export
|
|
66
|
+
* read. Components with no rendered preview are reported in `missing` rather than
|
|
67
|
+
* dropped silently, so a coverage gap is visible.
|
|
68
|
+
*
|
|
69
|
+
* The `layout` (wireframe) variant and native a11y findings are not part of a
|
|
70
|
+
* static capture bundle — they come from the daemon's `compose/semantics-wireframe`
|
|
71
|
+
* and `a11y/*` products and can be layered on by a daemon-backed caller.
|
|
72
|
+
*/
|
|
73
|
+
export declare function catalogFromCandidates(candidates: readonly CandidateRender[], spec: CatalogSpec, opts?: FromCandidatesOptions): FromCandidatesResult;
|
|
74
|
+
//# sourceMappingURL=spec.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"spec.d.ts","sourceRoot":"","sources":["../src/spec.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;GAcG;AACH,OAAO,KAAK,EAAE,eAAe,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AAIzE,OAAO,KAAK,EAAE,OAAO,EAAE,kBAAkB,EAAE,MAAM,YAAY,CAAC;AAE9D,yDAAyD;AACzD,MAAM,WAAW,oBAAoB;IACnC,mDAAmD;IACnD,WAAW,EAAE,MAAM,CAAC;IACpB,+EAA+E;IAC/E,OAAO,EAAE,MAAM,CAAC;IAChB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,4EAA4E;IAC5E,SAAS,CAAC,EAAE,kBAAkB,CAAC;CAChC;AAED,4DAA4D;AAC5D,MAAM,WAAW,gBAAgB;IAC/B,IAAI,EAAE,MAAM,CAAC;IACb,UAAU,EAAE,oBAAoB,EAAE,CAAC;CACpC;AAED,4EAA4E;AAC5E,MAAM,WAAW,WAAW;IAC1B,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB,MAAM,EAAE,gBAAgB,EAAE,CAAC;CAC5B;AA0CD,MAAM,WAAW,qBAAqB;IACpC,yDAAyD;IACzD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,wDAAwD;IACxD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,gFAAgF;IAChF,WAAW,CAAC,EAAE,YAAY,CAAC;CAC5B;AAED,MAAM,WAAW,oBAAoB;IACnC,OAAO,EAAE,OAAO,CAAC;IACjB,0EAA0E;IAC1E,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB;;;;;;OAMG;IACH,gBAAgB,EAAE,MAAM,EAAE,CAAC;CAC5B;AAcD;;;;;;;;;;;GAWG;AACH,wBAAgB,qBAAqB,CACnC,UAAU,EAAE,SAAS,eAAe,EAAE,EACtC,IAAI,EAAE,WAAW,EACjB,IAAI,GAAE,qBAA0B,GAC/B,oBAAoB,CA4CtB"}
|
package/dist/spec.js
ADDED
|
@@ -0,0 +1,107 @@
|
|
|
1
|
+
import { buildCatalog } from "./ingest.js";
|
|
2
|
+
/**
|
|
3
|
+
* The `@Preview` function name a spec component matches on. Prefers the
|
|
4
|
+
* candidate's {@link CandidateRender.functionName} — the stable identity the
|
|
5
|
+
* bundle reader carries — so a function's theme/size multipreview variants
|
|
6
|
+
* (`FilledButton_Light`, `FilledButton_Dark`) all resolve to one key
|
|
7
|
+
* (`FilledButton`). Falls back to the dotted-id tail for hand-authored
|
|
8
|
+
* candidates with no function name; that tail keeps any `_<mode>` suffix, which
|
|
9
|
+
* is why the bundle path sets `functionName`.
|
|
10
|
+
*/
|
|
11
|
+
function functionOf(candidate) {
|
|
12
|
+
if (candidate.functionName)
|
|
13
|
+
return candidate.functionName;
|
|
14
|
+
const id = candidate.previewId ?? candidate.componentId;
|
|
15
|
+
return id.split(".").pop() ?? id;
|
|
16
|
+
}
|
|
17
|
+
/** Fold a function's theme/size variants into one render: concatenate every
|
|
18
|
+
* variant's images and keep a light-themed semantics tree (the token/greenline
|
|
19
|
+
* reader keys off one). Mirrors `mergeCandidateRenders` but stays core-only so
|
|
20
|
+
* catalog-export keeps its single `@design-parity/core` dependency. */
|
|
21
|
+
function mergeByFunction(a, b) {
|
|
22
|
+
const semantics = a.semantics.theme === "light"
|
|
23
|
+
? a.semantics
|
|
24
|
+
: b.semantics.theme === "light"
|
|
25
|
+
? b.semantics
|
|
26
|
+
: a.semantics;
|
|
27
|
+
const merged = {
|
|
28
|
+
componentId: a.componentId,
|
|
29
|
+
images: [...a.images, ...b.images],
|
|
30
|
+
semantics,
|
|
31
|
+
};
|
|
32
|
+
if (a.previewId ?? b.previewId)
|
|
33
|
+
merged.previewId = a.previewId ?? b.previewId;
|
|
34
|
+
if (a.functionName ?? b.functionName)
|
|
35
|
+
merged.functionName = a.functionName ?? b.functionName;
|
|
36
|
+
return merged;
|
|
37
|
+
}
|
|
38
|
+
/** A semantics tree carries real signal (not the empty `{ root: {} }` fallback). */
|
|
39
|
+
function hasSemantics(candidate) {
|
|
40
|
+
const tree = candidate.semantics;
|
|
41
|
+
if (!tree)
|
|
42
|
+
return false;
|
|
43
|
+
if (tree.themeTokens)
|
|
44
|
+
return true;
|
|
45
|
+
const r = tree.root;
|
|
46
|
+
return Boolean(r &&
|
|
47
|
+
((r.children && r.children.length > 0) || r.role || r.label || r.bounds || r.tokens));
|
|
48
|
+
}
|
|
49
|
+
/**
|
|
50
|
+
* Join rendered {@link CandidateRender}s to a {@link CatalogSpec} into a
|
|
51
|
+
* {@link Catalog}. Each spec component is matched to the candidate whose preview
|
|
52
|
+
* **function name** equals its `preview`; its captures become the `ideal`
|
|
53
|
+
* variant and its semantics carry the bounds/tokens the greenline + token export
|
|
54
|
+
* read. Components with no rendered preview are reported in `missing` rather than
|
|
55
|
+
* dropped silently, so a coverage gap is visible.
|
|
56
|
+
*
|
|
57
|
+
* The `layout` (wireframe) variant and native a11y findings are not part of a
|
|
58
|
+
* static capture bundle — they come from the daemon's `compose/semantics-wireframe`
|
|
59
|
+
* and `a11y/*` products and can be layered on by a daemon-backed caller.
|
|
60
|
+
*/
|
|
61
|
+
export function catalogFromCandidates(candidates, spec, opts = {}) {
|
|
62
|
+
// Fold each function's theme/size multipreview variants into one render, so a
|
|
63
|
+
// spec component picks up every variant's image (light + dark, small + large)
|
|
64
|
+
// as captures of the same sticker rather than the last one winning.
|
|
65
|
+
const byFunction = new Map();
|
|
66
|
+
for (const candidate of candidates) {
|
|
67
|
+
const fn = functionOf(candidate);
|
|
68
|
+
const existing = byFunction.get(fn);
|
|
69
|
+
byFunction.set(fn, existing ? mergeByFunction(existing, candidate) : candidate);
|
|
70
|
+
}
|
|
71
|
+
const sources = [];
|
|
72
|
+
const missing = [];
|
|
73
|
+
const withoutSemantics = [];
|
|
74
|
+
for (const group of spec.groups) {
|
|
75
|
+
for (const component of group.components) {
|
|
76
|
+
const candidate = byFunction.get(component.preview);
|
|
77
|
+
if (!candidate || candidate.images.length === 0) {
|
|
78
|
+
missing.push(component.componentId);
|
|
79
|
+
continue;
|
|
80
|
+
}
|
|
81
|
+
if (!hasSemantics(candidate))
|
|
82
|
+
withoutSemantics.push(component.componentId);
|
|
83
|
+
const source = {
|
|
84
|
+
componentId: component.componentId,
|
|
85
|
+
group: group.name,
|
|
86
|
+
ideal: [...candidate.images],
|
|
87
|
+
};
|
|
88
|
+
if (component.caption !== undefined)
|
|
89
|
+
source.caption = component.caption;
|
|
90
|
+
if (component.reference !== undefined)
|
|
91
|
+
source.reference = component.reference;
|
|
92
|
+
if (candidate.semantics)
|
|
93
|
+
source.semantics = candidate.semantics;
|
|
94
|
+
sources.push(source);
|
|
95
|
+
}
|
|
96
|
+
}
|
|
97
|
+
const meta = {
|
|
98
|
+
system: spec.system,
|
|
99
|
+
title: spec.title,
|
|
100
|
+
...(spec.library ? { library: spec.library } : {}),
|
|
101
|
+
...(opts.renderer ? { renderer: opts.renderer } : {}),
|
|
102
|
+
generatedAt: opts.generatedAt ?? new Date().toISOString(),
|
|
103
|
+
};
|
|
104
|
+
const catalog = buildCatalog(meta, sources, opts.themeTokens);
|
|
105
|
+
return { catalog, missing, withoutSemantics };
|
|
106
|
+
}
|
|
107
|
+
//# sourceMappingURL=spec.js.map
|
package/dist/spec.js.map
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"spec.js","sourceRoot":"","sources":["../src/spec.ts"],"names":[],"mappings":"AAiBA,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AA6B3C;;;;;;;;GAQG;AACH,SAAS,UAAU,CAAC,SAA0B;IAC5C,IAAI,SAAS,CAAC,YAAY;QAAE,OAAO,SAAS,CAAC,YAAY,CAAC;IAC1D,MAAM,EAAE,GAAG,SAAS,CAAC,SAAS,IAAI,SAAS,CAAC,WAAW,CAAC;IACxD,OAAO,EAAE,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,IAAI,EAAE,CAAC;AACnC,CAAC;AAED;;;wEAGwE;AACxE,SAAS,eAAe,CACtB,CAAkB,EAClB,CAAkB;IAElB,MAAM,SAAS,GACb,CAAC,CAAC,SAAS,CAAC,KAAK,KAAK,OAAO;QAC3B,CAAC,CAAC,CAAC,CAAC,SAAS;QACb,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,KAAK,KAAK,OAAO;YAC7B,CAAC,CAAC,CAAC,CAAC,SAAS;YACb,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;IACpB,MAAM,MAAM,GAAoB;QAC9B,WAAW,EAAE,CAAC,CAAC,WAAW;QAC1B,MAAM,EAAE,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC,MAAM,CAAC;QAClC,SAAS;KACV,CAAC;IACF,IAAI,CAAC,CAAC,SAAS,IAAI,CAAC,CAAC,SAAS;QAAE,MAAM,CAAC,SAAS,GAAG,CAAC,CAAC,SAAS,IAAI,CAAC,CAAC,SAAS,CAAC;IAC9E,IAAI,CAAC,CAAC,YAAY,IAAI,CAAC,CAAC,YAAY;QAClC,MAAM,CAAC,YAAY,GAAG,CAAC,CAAC,YAAY,IAAI,CAAC,CAAC,YAAY,CAAC;IACzD,OAAO,MAAM,CAAC;AAChB,CAAC;AAyBD,oFAAoF;AACpF,SAAS,YAAY,CAAC,SAA0B;IAC9C,MAAM,IAAI,GAAG,SAAS,CAAC,SAAS,CAAC;IACjC,IAAI,CAAC,IAAI;QAAE,OAAO,KAAK,CAAC;IACxB,IAAI,IAAI,CAAC,WAAW;QAAE,OAAO,IAAI,CAAC;IAClC,MAAM,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC;IACpB,OAAO,OAAO,CACZ,CAAC;QACC,CAAC,CAAC,CAAC,CAAC,QAAQ,IAAI,CAAC,CAAC,QAAQ,CAAC,MAAM,GAAG,CAAC,CAAC,IAAI,CAAC,CAAC,IAAI,IAAI,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,MAAM,IAAI,CAAC,CAAC,MAAM,CAAC,CACvF,CAAC;AACJ,CAAC;AAED;;;;;;;;;;;GAWG;AACH,MAAM,UAAU,qBAAqB,CACnC,UAAsC,EACtC,IAAiB,EACjB,OAA8B,EAAE;IAEhC,8EAA8E;IAC9E,8EAA8E;IAC9E,oEAAoE;IACpE,MAAM,UAAU,GAAG,IAAI,GAAG,EAA2B,CAAC;IACtD,KAAK,MAAM,SAAS,IAAI,UAAU,EAAE,CAAC;QACnC,MAAM,EAAE,GAAG,UAAU,CAAC,SAAS,CAAC,CAAC;QACjC,MAAM,QAAQ,GAAG,UAAU,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC;QACpC,UAAU,CAAC,GAAG,CAAC,EAAE,EAAE,QAAQ,CAAC,CAAC,CAAC,eAAe,CAAC,QAAQ,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC;IAClF,CAAC;IAED,MAAM,OAAO,GAAsB,EAAE,CAAC;IACtC,MAAM,OAAO,GAAa,EAAE,CAAC;IAC7B,MAAM,gBAAgB,GAAa,EAAE,CAAC;IACtC,KAAK,MAAM,KAAK,IAAI,IAAI,CAAC,MAAM,EAAE,CAAC;QAChC,KAAK,MAAM,SAAS,IAAI,KAAK,CAAC,UAAU,EAAE,CAAC;YACzC,MAAM,SAAS,GAAG,UAAU,CAAC,GAAG,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC;YACpD,IAAI,CAAC,SAAS,IAAI,SAAS,CAAC,MAAM,CAAC,MAAM,KAAK,CAAC,EAAE,CAAC;gBAChD,OAAO,CAAC,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;gBACpC,SAAS;YACX,CAAC;YACD,IAAI,CAAC,YAAY,CAAC,SAAS,CAAC;gBAAE,gBAAgB,CAAC,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;YAC3E,MAAM,MAAM,GAAoB;gBAC9B,WAAW,EAAE,SAAS,CAAC,WAAW;gBAClC,KAAK,EAAE,KAAK,CAAC,IAAI;gBACjB,KAAK,EAAE,CAAC,GAAG,SAAS,CAAC,MAAM,CAAC;aAC7B,CAAC;YACF,IAAI,SAAS,CAAC,OAAO,KAAK,SAAS;gBAAE,MAAM,CAAC,OAAO,GAAG,SAAS,CAAC,OAAO,CAAC;YACxE,IAAI,SAAS,CAAC,SAAS,KAAK,SAAS;gBAAE,MAAM,CAAC,SAAS,GAAG,SAAS,CAAC,SAAS,CAAC;YAC9E,IAAI,SAAS,CAAC,SAAS;gBAAE,MAAM,CAAC,SAAS,GAAG,SAAS,CAAC,SAAS,CAAC;YAChE,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;QACvB,CAAC;IACH,CAAC;IAED,MAAM,IAAI,GAAG;QACX,MAAM,EAAE,IAAI,CAAC,MAAM;QACnB,KAAK,EAAE,IAAI,CAAC,KAAK;QACjB,GAAG,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,OAAO,EAAE,IAAI,CAAC,OAAO,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;QAClD,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;QACrD,WAAW,EAAE,IAAI,CAAC,WAAW,IAAI,IAAI,IAAI,EAAE,CAAC,WAAW,EAAE;KAC1D,CAAC;IAEF,MAAM,OAAO,GAAG,YAAY,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC;IAC9D,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,gBAAgB,EAAE,CAAC;AAChD,CAAC"}
|
package/dist/types.d.ts
CHANGED
|
@@ -70,6 +70,26 @@ export interface ComponentReference {
|
|
|
70
70
|
/** Human URL to the kit / frame. */
|
|
71
71
|
url?: string;
|
|
72
72
|
}
|
|
73
|
+
/** Per-edge content padding, in dp. */
|
|
74
|
+
export interface RedlinePadding {
|
|
75
|
+
start?: number;
|
|
76
|
+
top?: number;
|
|
77
|
+
end?: number;
|
|
78
|
+
bottom?: number;
|
|
79
|
+
}
|
|
80
|
+
/**
|
|
81
|
+
* One **redline**: a layout annotation for a node — its box plus the spacing
|
|
82
|
+
* spec a designer reads off (content `padding`, inter-child `gap`, corner
|
|
83
|
+
* radius). Where greenlines annotate accessibility, redlines annotate layout.
|
|
84
|
+
*/
|
|
85
|
+
export interface Redline {
|
|
86
|
+
role?: string;
|
|
87
|
+
label?: string;
|
|
88
|
+
bounds: Bounds;
|
|
89
|
+
padding?: RedlinePadding;
|
|
90
|
+
gap?: number;
|
|
91
|
+
cornerRadius?: number;
|
|
92
|
+
}
|
|
73
93
|
/** One component on the sticker sheet, in its primary modes. */
|
|
74
94
|
export interface CatalogComponent {
|
|
75
95
|
/** Stable component id, e.g. `"Button/Filled"`. */
|
|
@@ -85,6 +105,12 @@ export interface CatalogComponent {
|
|
|
85
105
|
tokens?: DesignTokens;
|
|
86
106
|
/** Accessibility annotation layer for this component. */
|
|
87
107
|
greenlines: Greenline[];
|
|
108
|
+
/**
|
|
109
|
+
* Layout annotation layer — per-node box + padding + inter-slot gap + corner
|
|
110
|
+
* radius (the spacing spec / redlines), walked from {@link semantics}. Empty
|
|
111
|
+
* when the component carries no semantics geometry.
|
|
112
|
+
*/
|
|
113
|
+
redlines: Redline[];
|
|
88
114
|
/**
|
|
89
115
|
* The component's semantic tree — bounds, roles, and per-node tokens — so the
|
|
90
116
|
* layout is identified, not just pictured. Optional; absent for hand-authored
|
package/dist/types.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;GAYG;AACH,OAAO,KAAK,EACV,MAAM,EACN,YAAY,EACZ,WAAW,EACX,KAAK,EACL,YAAY,EACZ,QAAQ,EACT,MAAM,qBAAqB,CAAC;AAE7B,iFAAiF;AACjF,MAAM,WAAW,WAAW;IAC1B,yDAAyD;IACzD,MAAM,EAAE,MAAM,CAAC;IACf,gDAAgD;IAChD,KAAK,EAAE,MAAM,CAAC;IACd,uFAAuF;IACvF,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,oEAAoE;IACpE,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAED;;;;;;;;GAQG;AACH,MAAM,WAAW,iBAAiB;IAChC,KAAK,EAAE,KAAK,EAAE,CAAC;IACf,MAAM,CAAC,EAAE,KAAK,EAAE,CAAC;CAClB;AAED;;;;;;;GAOG;AACH,MAAM,WAAW,SAAS;IACxB,IAAI,EAAE,WAAW,CAAC;IAClB,QAAQ,EAAE,QAAQ,CAAC;IACnB,gCAAgC;IAChC,OAAO,EAAE,MAAM,CAAC;IAChB,mFAAmF;IACnF,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,gFAAgF;IAChF,MAAM,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;CAClC;AAED;;;;;GAKG;AACH,MAAM,WAAW,kBAAkB;IACjC,sEAAsE;IACtE,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,wDAAwD;IACxD,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,oCAAoC;IACpC,GAAG,CAAC,EAAE,MAAM,CAAC;CACd;AAED,gEAAgE;AAChE,MAAM,WAAW,gBAAgB;IAC/B,mDAAmD;IACnD,WAAW,EAAE,MAAM,CAAC;IACpB,sDAAsD;IACtD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,6CAA6C;IAC7C,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,8EAA8E;IAC9E,SAAS,CAAC,EAAE,kBAAkB,CAAC;IAC/B,QAAQ,EAAE,iBAAiB,CAAC;IAC5B,iFAAiF;IACjF,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB,yDAAyD;IACzD,UAAU,EAAE,SAAS,EAAE,CAAC;IACxB;;;;OAIG;IACH,SAAS,CAAC,EAAE,YAAY,CAAC;CAC1B;AAED,0EAA0E;AAC1E,MAAM,WAAW,OAAO;IACtB,IAAI,EAAE,WAAW,CAAC;IAClB;;;;OAIG;IACH,WAAW,CAAC,EAAE,YAAY,CAAC;IAC3B,UAAU,EAAE,gBAAgB,EAAE,CAAC;CAChC"}
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;GAYG;AACH,OAAO,KAAK,EACV,MAAM,EACN,YAAY,EACZ,WAAW,EACX,KAAK,EACL,YAAY,EACZ,QAAQ,EACT,MAAM,qBAAqB,CAAC;AAE7B,iFAAiF;AACjF,MAAM,WAAW,WAAW;IAC1B,yDAAyD;IACzD,MAAM,EAAE,MAAM,CAAC;IACf,gDAAgD;IAChD,KAAK,EAAE,MAAM,CAAC;IACd,uFAAuF;IACvF,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,oEAAoE;IACpE,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAED;;;;;;;;GAQG;AACH,MAAM,WAAW,iBAAiB;IAChC,KAAK,EAAE,KAAK,EAAE,CAAC;IACf,MAAM,CAAC,EAAE,KAAK,EAAE,CAAC;CAClB;AAED;;;;;;;GAOG;AACH,MAAM,WAAW,SAAS;IACxB,IAAI,EAAE,WAAW,CAAC;IAClB,QAAQ,EAAE,QAAQ,CAAC;IACnB,gCAAgC;IAChC,OAAO,EAAE,MAAM,CAAC;IAChB,mFAAmF;IACnF,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,gFAAgF;IAChF,MAAM,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;CAClC;AAED;;;;;GAKG;AACH,MAAM,WAAW,kBAAkB;IACjC,sEAAsE;IACtE,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,wDAAwD;IACxD,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,oCAAoC;IACpC,GAAG,CAAC,EAAE,MAAM,CAAC;CACd;AAED,uCAAuC;AACvC,MAAM,WAAW,cAAc;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED;;;;GAIG;AACH,MAAM,WAAW,OAAO;IACtB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,cAAc,CAAC;IACzB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED,gEAAgE;AAChE,MAAM,WAAW,gBAAgB;IAC/B,mDAAmD;IACnD,WAAW,EAAE,MAAM,CAAC;IACpB,sDAAsD;IACtD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,6CAA6C;IAC7C,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,8EAA8E;IAC9E,SAAS,CAAC,EAAE,kBAAkB,CAAC;IAC/B,QAAQ,EAAE,iBAAiB,CAAC;IAC5B,iFAAiF;IACjF,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB,yDAAyD;IACzD,UAAU,EAAE,SAAS,EAAE,CAAC;IACxB;;;;OAIG;IACH,QAAQ,EAAE,OAAO,EAAE,CAAC;IACpB;;;;OAIG;IACH,SAAS,CAAC,EAAE,YAAY,CAAC;CAC1B;AAED,0EAA0E;AAC1E,MAAM,WAAW,OAAO;IACtB,IAAI,EAAE,WAAW,CAAC;IAClB;;;;OAIG;IACH,WAAW,CAAC,EAAE,YAAY,CAAC;IAC3B,UAAU,EAAE,gBAAgB,EAAE,CAAC;CAChC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@design-parity/catalog-export",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.22",
|
|
4
4
|
"description": "Turn a rendered Compose component system (compose-preview data products) into an importable design-artifact catalog: per-component sticker sheets in two variants (ideal + layout), a W3C DTCG token set, and an accessibility 'greenline' annotation layer — laid out for Figma / Stitch / Claude Design import.",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"type": "module",
|
|
@@ -17,7 +17,7 @@
|
|
|
17
17
|
"test": "vitest run"
|
|
18
18
|
},
|
|
19
19
|
"dependencies": {
|
|
20
|
-
"@design-parity/core": "^0.1.
|
|
20
|
+
"@design-parity/core": "^0.1.22"
|
|
21
21
|
},
|
|
22
22
|
"repository": {
|
|
23
23
|
"type": "git",
|