stylegallery 0.1.6 → 0.1.8

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.
Files changed (97) hide show
  1. package/AGENTS.md +13 -1
  2. package/DOMAINS.md +10 -6
  3. package/GOVERNANCE.md +14 -12
  4. package/LICENSE +28 -0
  5. package/LICENSE-DOCS +42 -0
  6. package/NOTICE +38 -0
  7. package/README.md +47 -15
  8. package/consumer-reference/agent-native/README.md +7 -7
  9. package/consumer-reference/agent-native/v2/admission-policy.json +196 -31
  10. package/consumer-reference/agent-native/v2/material-registry.json +1 -1
  11. package/consumer-reference/agent-native/v2/schema/admission-policy.schema.json +3 -3
  12. package/consumer-reference/agent-native/v2/schema/material-record.schema.json +1 -1
  13. package/design-engineering/component-contract.md +19 -3
  14. package/design-engineering/decision-tree.md +1 -0
  15. package/design-engineering/index.md +48 -0
  16. package/design-engineering/loading-and-feedback.md +91 -0
  17. package/design-engineering/native-interaction-contracts.md +94 -0
  18. package/design-engineering/state-management/decision-tree.md +60 -0
  19. package/design-engineering/state-management/index.md +61 -0
  20. package/design-engineering/state-management/patterns/derived-state.md +85 -0
  21. package/design-engineering/state-management/patterns/draft-and-baseline.md +86 -0
  22. package/design-engineering/state-management/patterns/id-selection.md +85 -0
  23. package/design-engineering/state-management/patterns/identity-reset.md +89 -0
  24. package/design-engineering/state-management/patterns/latest-request-wins.md +94 -0
  25. package/design-engineering/state-management/patterns/optimistic-overlay.md +98 -0
  26. package/design-engineering/state-management/patterns/single-flight.md +92 -0
  27. package/design-engineering/state-management/patterns/single-owner.md +89 -0
  28. package/design-engineering/state-management/patterns/submitted-snapshot.md +107 -0
  29. package/design-engineering/state-management/patterns/unsaved-navigation.md +100 -0
  30. package/design-engineering/state-management/patterns/url-state.md +96 -0
  31. package/design-engineering/state-management/patterns/versioned-restore.md +95 -0
  32. package/design-engineering/state-management/recipes/delete-undo.md +65 -0
  33. package/design-engineering/state-management/recipes/index.md +64 -0
  34. package/design-engineering/state-management/recipes/multi-step-form.md +65 -0
  35. package/design-engineering/state-management/recipes/search-detail.md +65 -0
  36. package/design-engineering/state-management/recipes/settings-save.md +64 -0
  37. package/design-engineering/state-management/state-brief.md +83 -0
  38. package/design-engineering/state-management/verification.md +65 -0
  39. package/design-engineering/text-input-and-internationalization.md +91 -0
  40. package/design-engineering/worked-examples.md +2 -0
  41. package/design-terminology/conflict-cases.md +51 -8
  42. package/design-terminology/index.md +6 -0
  43. package/design-terminology/interaction-semantics.md +87 -0
  44. package/design-terminology/source-kinds.md +1 -1
  45. package/design-terminology/source-vocabularies.md +17 -1
  46. package/design-terminology/token-semantics.md +90 -0
  47. package/design-terminology/typography-semantics.md +86 -0
  48. package/expression/brand-studies.md +50 -0
  49. package/expression/direction-brief.md +71 -0
  50. package/expression/directions/nocturne-editorial.md +80 -0
  51. package/expression/directions/warm-print.md +73 -0
  52. package/expression/index.md +40 -0
  53. package/expression/techniques/gradient-atmosphere.md +107 -0
  54. package/expression/techniques/grain-and-texture.md +83 -0
  55. package/expression/techniques/webgl-hero.md +123 -0
  56. package/guides/vocabulary.md +1 -1
  57. package/index.md +3 -3
  58. package/log.md +64 -0
  59. package/motion/accessible-motion.md +90 -0
  60. package/motion/index.md +9 -0
  61. package/motion/interaction-recipes.md +8 -2
  62. package/motion/interruption-and-retargeting.md +90 -0
  63. package/motion/observed-choreography.md +73 -0
  64. package/motion/rendering-and-performance.md +89 -0
  65. package/motion/techniques/kinetic-type.md +145 -0
  66. package/motion/techniques/scroll-choreography.md +154 -0
  67. package/package.json +76 -21
  68. package/platform-guides/adaptive-navigation.md +85 -0
  69. package/platform-guides/compatibility-matrix.md +1 -1
  70. package/platform-guides/index.md +6 -0
  71. package/platform-guides/input-and-focus.md +91 -0
  72. package/platform-guides/preferences-and-accessibility.md +90 -0
  73. package/quality/claim-records/stylegallery-multidomain-scope.md +2 -2
  74. package/quality/evidence/executable-evidence.md +1 -1
  75. package/quality/index.md +1 -2
  76. package/scripts/agent-native/v2/material-admission.mjs +1 -1
  77. package/scripts/agent-native/v2/material-identity.mjs +2 -2
  78. package/scripts/compiler/README.md +112 -0
  79. package/scripts/compiler/cli.mjs +51 -0
  80. package/scripts/compiler/mcp.mjs +53 -0
  81. package/scripts/compiler/operations.mjs +70 -0
  82. package/scripts/compiler/runtime.mjs +156 -0
  83. package/scripts/sg-entry.mjs +20 -0
  84. package/scripts/sg-server.mjs +20 -0
  85. package/showcase/README.md +113 -0
  86. package/game-ui/classification.md +0 -82
  87. package/game-ui/decision-tree.md +0 -81
  88. package/game-ui/index.md +0 -45
  89. package/game-ui/reference-record.md +0 -62
  90. package/game-ui/screen-hierarchy.md +0 -107
  91. package/game-ui/screen-recipes.md +0 -101
  92. package/game-ui/unity/architecture.md +0 -166
  93. package/game-ui/unity/cli-loop.md +0 -84
  94. package/game-ui/unity/org-wiki.md +0 -146
  95. package/game-ui/unity/repository-map.md +0 -102
  96. package/game-ui/unity/ui-systems.md +0 -85
  97. package/game-ui/verification-workflow.md +0 -100
@@ -0,0 +1,85 @@
1
+ ---
2
+ type: Domain Guide
3
+ title: Adaptive Navigation Across Platforms
4
+ description: Compare window adaptation, modal presentation, and Back ownership while preserving task identity across native and web surfaces.
5
+ domain: platform-guides
6
+ lifecycle: experimental
7
+ provenance_kind: local
8
+ platform: Apple applications, Android applications, Windows applications, and web adaptations
9
+ platform_version: dated official documentation; consumer OS, SDK, and browser versions required
10
+ reviewed_on: 2026-09-21
11
+ ---
12
+
13
+ # Adaptive Navigation Across Platforms
14
+
15
+ Primary role: comparative navigation and adaptation guide.
16
+
17
+ ## Repository Boundary
18
+
19
+ This page compares named platform conventions. It owns no CSS breakpoints, product visuals, or shared navigation implementation. Layout remains responsible for spatial constraints; [State Management](../design-engineering/state-management/index.md) owns route identity, drafts, and persistence.
20
+
21
+ ## Reusable Method
22
+
23
+ Describe the current task independently of presentation: selected object, query, draft, parent destination, and active blocking surface. Then name which of those facts must survive a window change. Choose the target presentation and its navigation contract from available space and task needs, rather than from a device label.
24
+
25
+ ### Dated Source Comparison
26
+
27
+ | Platform source | Bounded observation | Web adaptation question |
28
+ | --- | --- | --- |
29
+ | [Apple HIG layout](https://developer.apple.com/design/human-interface-guidelines/layout) | The guidance covers changing windows/displays, system safe areas, and text-size changes. | Does the task survive a changed content area and larger text? |
30
+ | [Apple HIG modality](https://developer.apple.com/design/human-interface-guidelines/modality) | Modal presentation is a scoped change of interaction context with dismissal obligations. | Which part of the workflow intentionally suspends background interaction? |
31
+ | [Apple HIG popovers](https://developer.apple.com/design/human-interface-guidelines/popovers) | Popover guidance is platform-specific and recommends a different presentation in compact iOS/iPadOS views. | Can the presentation change while preserving the same edit and explicit close policy? |
32
+ | [Android window size classes](https://developer.android.com/develop/ui/compose/layouts/adaptive/use-window-size-classes) | Width and height are classified separately from available app space. The reviewed page includes compact, medium, expanded, large, and extra-large width classes. | Does the decision consider usable height as well as width? |
33
+ | [Android predictive Back](https://developer.android.com/guide/navigation/custom-back/predictive-back-gesture) | Enabled callbacks have scoped Back responsibilities; gesture handling and observation are distinct concerns. | Which active layer consumes Back, and does observation accidentally change navigation? |
34
+ | [Windows responsive techniques](https://learn.microsoft.com/en-us/windows/apps/design/layout/responsive-design) | Adaptation can change composition and presentation of controls as available space changes. | Does every required destination remain available after the transformation? |
35
+
36
+ Read on 2026-09-21. These are live documentation snapshots, not SDK pins. Android's reviewed window guidance was updated 2026-08-04 and predictive Back guidance 2026-09-18. Apple page bodies were inspected through their official documentation JSON because the HTML reader exposed a JavaScript shell. Native implementation claims require a named OS/API and an actual native run.
37
+
38
+ ### Navigation Actions Are Different Operations
39
+
40
+ | Action | State it should address | Failure from conflation |
41
+ | --- | --- | --- |
42
+ | Browser/native Back | Navigation history according to the host contract | Closing a dialog and leaving the route in one action. |
43
+ | Parent/Up navigation | A defined parent destination | Assuming a direct-link visitor has a matching history entry. |
44
+ | Surface dismissal | Visibility and ownership of a temporary surface | Discarding a draft because a surface resized or changed form. |
45
+ | Operation cancellation | The actual pending operation and its acknowledgement | A closing animation falsely reports that a write was cancelled. |
46
+ | Selection change | Identity of the item being inspected | Selecting another item silently overwrites unsaved work. |
47
+
48
+ This table is a local comparison framework, not a common native dispatch algorithm. Each host retains its own semantics.
49
+
50
+ ### Worked Adaptation: Detail Pane Becomes A Route
51
+
52
+ A document browser shows list and detail together when both fit. With less room, the selected document occupies the primary view. Record the selection once and derive presentation from it. Preserve the list query and any draft; do not create a second editor instance solely because a presentation boundary changed.
53
+
54
+ If a selection is encoded in the URL, decide whether presenting the same selection in a second pane creates a navigation event. A resize itself should not invent a new task history entry under this proposal. Direct links, browser refresh, and a missing selected document need explicit outcomes.
55
+
56
+ When a popover becomes a modal editor, re-evaluate focus containment and dismissal. A stored boolean such as `isPopoverOpen` does not describe whether the current surface is modal, what it edits, or which host receives Back. Represent the task and presentation separately.
57
+
58
+ ## Opinionated Guidance
59
+
60
+ Prefer task-preserving transformations: keep identity and editable data stable while rearranging presentation. Define navigation with state transitions that a reviewer can inspect. Avoid copying a platform's numeric size boundaries into CSS without a separate content-fit rationale.
61
+
62
+ ## Platform-Specific Guidance
63
+
64
+ Android density-independent units, Apple points/safe areas, Windows effective sizing, and browser CSS pixels belong to different target contracts. A visual resemblance does not establish unit equivalence. On the web, use [Layout's existing routes](../layout/index.md) to choose the spatial composition and verify it at the actual parent constraints.
65
+
66
+ Predictive Back progress and cancellation are native host behavior. A browser animation cannot by itself claim equivalent integration. For keyboard and focus adaptation, continue to [Input And Focus](input-and-focus.md).
67
+
68
+ ## Unsupported Absolutes
69
+
70
+ A wide window does not identify a desktop device. A compact surface does not require a particular native component. A native Back callback is not interchangeable with browser history. A successful resize screenshot does not prove state continuity.
71
+
72
+ ## Verification Contract
73
+
74
+ Proposed cases: resize while editing; open a direct detail link; navigate Back with an inner dialog open; cancel a native Back gesture; rotate with an onscreen keyboard present; enlarge text until a two-pane arrangement no longer fits; remove the selected item remotely.
75
+
76
+ For each case, record route/history, selected identity, draft value, active surface, and focused element before and after. Native claims need native execution; browser cases establish only the browser adaptation. No native or web execution is claimed here. Re-review when a cited convention, SDK, or navigation owner changes.
77
+
78
+ ## Source, License, And Attribution
79
+
80
+ Locally authored synthesis of the linked Apple, Google, and Microsoft documentation, inspected 2026-09-21. No platform artwork, code, or distinctive source examples are reproduced. `consumer_reference: not_applicable` because no consumer navigation record is selected.
81
+
82
+ ## IA Navigation
83
+
84
+ Parent: [Platform Guides](index.md).
85
+ Next: [Preferences And Accessibility](preferences-and-accessibility.md).
@@ -75,7 +75,7 @@ Test fallback paths deliberately rather than waiting for accidental unsupported
75
75
 
76
76
  ## Platform-Specific Guidance
77
77
 
78
- Apple, Android, and Windows guide pages own their dated official-source sets. Recheck them for native claims and separately verify the target runtime. Game-engine adaptation routes to [Game UI](../game-ui/index.md).
78
+ Apple, Android, and Windows guide pages own their dated official-source sets. Recheck them for native claims and separately verify the target runtime.
79
79
 
80
80
  ## Unsupported Absolutes
81
81
 
@@ -27,6 +27,12 @@ These workflows and worked cases are usable experimental guidance. Expected-resu
27
27
 
28
28
  A platform guide names the platform, source authority, version or review date, web-adaptation boundary, and local verification protocol. Similar appearance or behavior does not establish affiliation or correctness.
29
29
 
30
+ ## Source-Backed Deep Dives
31
+
32
+ - [Adaptive Navigation Across Platforms](adaptive-navigation.md). Preserve task state across window and navigation transformations.
33
+ - [Preferences And Accessibility Across Platforms](preferences-and-accessibility.md). Compare text scaling, contrast, motion, and transparency independently.
34
+ - [Input And Focus Across Platforms](input-and-focus.md). Compare keyboard, pointer, drag alternatives, and focus contracts.
35
+
30
36
  ## Domain Contract
31
37
 
32
38
  See [StyleGallery Domains](../DOMAINS.md) for lifecycle, provenance, page membership, and staleness rules.
@@ -0,0 +1,91 @@
1
+ ---
2
+ type: Domain Guide
3
+ title: Input And Focus Across Platforms
4
+ description: Compare keyboard, pointing, dragging, focus, and target conventions using named native and web contracts.
5
+ domain: platform-guides
6
+ lifecycle: experimental
7
+ provenance_kind: local
8
+ platform: Apple applications, Android Compose, Windows applications, and web adaptations
9
+ platform_version: dated official documentation; consumer OS, input device, and browser versions required
10
+ reviewed_on: 2026-09-21
11
+ ---
12
+
13
+ # Input And Focus Across Platforms
14
+
15
+ Primary role: comparative input and focus guide.
16
+
17
+ ## Repository Boundary
18
+
19
+ This page compares platform interaction contracts. It does not make one platform's shortcuts, target dimensions, or focus model universal. Layout owns logical spatial order; Design Engineering owns the [component behavior](../design-engineering/native-interaction-contracts.md); shared quality owns accessibility evidence.
20
+
21
+ ## Reusable Method
22
+
23
+ For each task, identify the action, focused or selected object, available input paths, and owner of cancellation. Distinguish moving focus, moving selection, changing a value, and invoking a command. Then compare the target platform's expected behavior with the proposed adaptation.
24
+
25
+ ### Platform And Web Sources
26
+
27
+ | Source | Bounded finding | Adaptation question |
28
+ | --- | --- | --- |
29
+ | [Apple HIG keyboards](https://developer.apple.com/design/human-interface-guidelines/keyboards) | Keyboard guidance includes text entry and discoverable, platform-appropriate shortcuts. | Which commands remain discoverable without knowing a shortcut? |
30
+ | [Apple HIG pointing devices](https://developer.apple.com/design/human-interface-guidelines/pointing-devices) | Pointer interaction is a named platform concern alongside other input. | Does pointer feedback preserve the same task as touch or keyboard input? |
31
+ | [Android Compose keyboard actions](https://developer.android.com/develop/ui/compose/touch-input/keyboard-input/commands) | Editing components have default key behavior; key handlers can consume or propagate events. | Does a parent handler steal a key from an editor or child control? |
32
+ | [Windows keyboard interactions](https://learn.microsoft.com/en-us/windows/apps/develop/input/keyboard-interactions) | The guidance distinguishes navigation, commands, and visible focus for keyboard use. | Are command invocation and focus navigation separate and predictable? |
33
+ | [APG keyboard interface](https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/) | Composite widgets have internal navigation conventions; focus and selection are distinct. | Is the chosen widget model actually implemented, including entry and exit? |
34
+ | [Pointer Events Level 3](https://www.w3.org/TR/pointerevents3/) | Pointer events model multiple pointing inputs, capture, and cancellation. | Does cancellation leave a coherent drag state and release ownership? |
35
+
36
+ Read on 2026-09-21. Apple source bodies were inspected through the official documentation JSON. APG is informative guidance; Pointer Events is a standards-track source. Actual input behavior requires a named OS/browser/device combination.
37
+
38
+ ### Web Accessibility Conditions To Keep Separate
39
+
40
+ | Source | Bounded condition | Local probe |
41
+ | --- | --- | --- |
42
+ | [Keyboard, SC 2.1.1](https://www.w3.org/WAI/WCAG22/Understanding/keyboard.html) | Functionality needs keyboard operability, with the criterion's scoped exception. | Complete the task without a pointing device. |
43
+ | [Dragging Movements, SC 2.5.7](https://www.w3.org/WAI/WCAG22/Understanding/dragging-movements.html) | Dragging functionality needs a single-pointer alternative without dragging, subject to exceptions. | Try a click/tap alternative as well as keyboard operation. |
44
+ | [Target Size Minimum, SC 2.5.8](https://www.w3.org/WAI/WCAG22/Understanding/target-size-minimum.html) | The AA criterion specifies 24 by 24 CSS pixels or its stated exceptions, including a defined spacing alternative. | Evaluate the actual hit region and nearby targets, not only the icon. |
45
+ | [Hover Or Focus Content, SC 1.4.13](https://www.w3.org/WAI/WCAG22/Understanding/content-on-hover-or-focus.html) | Additional content has dismissibility, hoverability, and persistence conditions with scoped exceptions. | Move onto the revealed content and dismiss it without losing the task. |
46
+ | [Focus Order, SC 2.4.3](https://www.w3.org/WAI/WCAG22/Understanding/focus-order.html) | Sequential focus order must preserve meaning and operation where order matters. | Follow focus through the actual rendered structure. |
47
+ | [Focus Not Obscured Minimum, SC 2.4.11](https://www.w3.org/WAI/WCAG22/Understanding/focus-not-obscured-minimum.html) | At AA, an author-created surface must not entirely hide the focused component. | Open sticky and overlay surfaces while moving focus. |
48
+
49
+ These Understanding documents explain normative WCAG requirements. The minimum target criterion is not a universal product target size; native units and platform recommendations need their own rationale. Keyboard access and a no-drag single-pointer alternative answer different conditions.
50
+
51
+ ### Worked Adaptation: Reorder An Item
52
+
53
+ The product offers a drag handle and chooses a Move action with explicit destinations as its alternative. All paths call the same reorder operation with stable item identity. Focus stays on the moved item or on a documented successor, and the result is exposed without relying solely on movement.
54
+
55
+ | Path | Ownership decision | Failure to catch |
56
+ | --- | --- | --- |
57
+ | Pointer drag | Capture, drop eligibility, and cancelled-drag outcome | A cancelled pointer stream leaves the item detached. |
58
+ | Click/tap Move | Destination choice and confirmation | The alternative still requires a hidden drag gesture. |
59
+ | Keyboard | Widget navigation and command activation | Arrow keys move the page and item simultaneously. |
60
+ | Assistive technology | Name, action, current position, and resulting state | The visual reorder is absent from the semantic order. |
61
+
62
+ This is a local proposal. It does not prescribe one keyboard shortcut or say that every list must be a composite ARIA widget.
63
+
64
+ ## Opinionated Guidance
65
+
66
+ Use shortcuts to accelerate visible actions. Scope listeners to the intended surface, and let text editing and composition retain their own keys. Give each cancellation action one clearly documented owner before allowing it to propagate outward.
67
+
68
+ ## Platform-Specific Guidance
69
+
70
+ Primary pointer and hover media features describe capabilities, not an exclusive device category; hybrid input requires an actual interaction matrix. System/browser shortcuts and assistive-technology commands may already own a key combination. Record the platform conflict check instead of translating Control to Command mechanically.
71
+
72
+ For IME-sensitive keys, follow [Text Input And Internationalization](../design-engineering/text-input-and-internationalization.md). For drag presentation after cancellation, follow [Interruption And Retargeting](../motion/interruption-and-retargeting.md).
73
+
74
+ ## Unsupported Absolutes
75
+
76
+ Keyboard support alone does not satisfy the no-drag pointer condition. Visible focus does not prove focus order. A large icon does not prove a large hit region. A touch-capable device does not imply that hover or keyboard input is absent.
77
+
78
+ ## Verification Contract
79
+
80
+ Use actual task sequences with keyboard, pointer, touch where supported, and relevant assistive technology. Record input mode changes mid-task, cancelled drag, focus after item removal, nested Escape, hover-to-content movement, and overlays covering the focus target.
81
+
82
+ These cases are unexecuted. Synthetic events can validate handlers but do not establish physical input or assistive-technology integration. Re-review when command scope, component roles, or target input support changes.
83
+
84
+ ## Source, License, And Attribution
85
+
86
+ Locally authored synthesis of the linked first-party sources, inspected 2026-09-21. No native interaction artwork, source examples, or code are copied. `consumer_reference: not_applicable` because no consumer input record is selected.
87
+
88
+ ## IA Navigation
89
+
90
+ Parent: [Platform Guides](index.md).
91
+ Next: [Platform Compatibility Matrix](compatibility-matrix.md).
@@ -0,0 +1,90 @@
1
+ ---
2
+ type: Domain Guide
3
+ title: Preferences And Accessibility Across Platforms
4
+ description: Compare text scaling, motion, contrast, transparency, and accessibility semantics without collapsing distinct user preferences.
5
+ domain: platform-guides
6
+ lifecycle: experimental
7
+ provenance_kind: local
8
+ platform: Apple applications, Android Compose, Windows applications, and web adaptations
9
+ platform_version: dated official documentation; consumer OS, framework, and browser versions required
10
+ reviewed_on: 2026-09-21
11
+ ---
12
+
13
+ # Preferences And Accessibility Across Platforms
14
+
15
+ Primary role: comparative preference and accessibility adaptation guide.
16
+
17
+ ## Repository Boundary
18
+
19
+ This guide compares what named platforms expose and the questions a consumer must answer. Shared [accessibility evidence](../quality/evidence/accessibility.md) governs conformance. Product color, typography, transparency, and motion remain consumer-owned; this page supplies no visual defaults to Layout.
20
+
21
+ ## Reusable Method
22
+
23
+ Inventory each preference as a separate input. Name its source, application override policy, affected components, and update behavior. Specify a usable base presentation for targets that do not expose a particular signal. Then test meaningful combinations rather than treating “accessibility mode” as one boolean.
24
+
25
+ ### Source Findings
26
+
27
+ | Source | Bounded finding | Transfer boundary |
28
+ | --- | --- | --- |
29
+ | [Apple HIG accessibility](https://developer.apple.com/design/human-interface-guidelines/accessibility) | The guidance addresses larger text, VoiceOver descriptions, multiple information channels, and response to Reduce Motion. | Native support depends on the implementation; a web font choice does not implement Dynamic Type. |
30
+ | [Apple HIG materials](https://developer.apple.com/design/human-interface-guidelines/materials) | Material behavior can respond to appearance and accessibility settings, including transparency and contrast. | A CSS blur copied from a screenshot does not inherit native material behavior. |
31
+ | [Android Compose accessibility](https://developer.android.com/develop/ui/compose/accessibility) | Compose exposes semantics and accessibility support that custom components must preserve. | A drawn label is not by itself an accessibility semantic node. |
32
+ | [Windows contrast themes](https://learn.microsoft.com/en-us/windows/apps/design/accessibility/high-contrast-themes) | Contrast themes use system color roles and can change while an app runs. | A single hard-coded dark palette is not the Windows contrast-theme contract. |
33
+ | [Media Queries Level 5](https://www.w3.org/TR/mediaqueries-5/#mf-user-preferences) | Color scheme, reduced motion, contrast, and reduced transparency are separate preference features. | Support must be checked per feature and target; one query does not imply another. |
34
+ | [CSS Color Adjustment](https://www.w3.org/TR/css-color-adjust-1/#forced-colors-mode) | Forced colors can replace author colors with a user-selected palette and adjust effects. | Preserve meaningful distinctions when author decoration changes or disappears. |
35
+
36
+ Read on 2026-09-21. Apple documentation bodies were inspected through the official documentation JSON. These living platform pages and standards-track publications are dated readings, not proof that all named features exist in a selected OS/browser release.
37
+
38
+ ### Preference Resolution
39
+
40
+ Record “follow system” separately from an explicit in-product selection. Define which setting currently determines the presentation and how users return to system behavior. Do not use one persisted theme name to infer motion, contrast, or text-size preferences.
41
+
42
+ For web forced colors, verify semantic system-color pairings and visible boundaries rather than preserving brand appearance at any cost. Any local exception to automatic color adjustment needs a stated reason and target evidence. For reduced transparency without a supported media feature, the base surface still needs to make its content legible.
43
+
44
+ ### Text Scaling Is A Behavior Change
45
+
46
+ [Reflow](https://www.w3.org/WAI/WCAG22/Understanding/reflow.html) concerns preserving information and function when content is presented in a narrow equivalent viewport, with scoped exceptions. [Text Spacing](https://www.w3.org/WAI/WCAG22/Understanding/text-spacing.html) concerns loss of content or function when users override specified spacing. Neither criterion means that every interface must have the same default type scale.
47
+
48
+ Local proposal: treat text scaling as a reason to reconsider composition, not merely multiply font sizes. A toolbar can need wrapping or a different command presentation; a dialog may need a scrollable reading area; a short title can become several lines. Those spatial choices go to Layout, while label priorities and command availability stay in the product.
49
+
50
+ ### Combination Matrix
51
+
52
+ | Combination | Failure to probe | Observable result to retain |
53
+ | --- | --- | --- |
54
+ | Dark appearance with forced colors | The app assumes its dark palette remains authoritative. | Text, selection, links, and focus remain distinguishable. |
55
+ | Larger text with compact window | Fixed control bounds clip names or actions. | Full task remains possible without losing required information. |
56
+ | Reduced motion during pending work | The indicator disappears without an equivalent waiting state. | Pending and completed states remain understandable. |
57
+ | Reduced transparency over rich content | A custom surface depends on blur alone for separation. | Foreground content remains legible with the chosen fallback. |
58
+ | Screen reader with changing result set | Decorative text changes lack meaningful semantics. | The selected task and concise result status are exposed correctly. |
59
+ | Runtime preference change | Only newly mounted components update. | Existing dialogs, portals, and embedded surfaces follow their declared policy. |
60
+
61
+ These are proposed probes, not a statement that all combinations are exposed by every OS. Record unavailable combinations as not applicable with a reason.
62
+
63
+ ## Opinionated Guidance
64
+
65
+ Make preference ownership explicit and keep the base experience usable. Avoid adding a single “accessible theme” that quietly overrides unrelated preferences. Use product settings to provide clear user control where platform signals are absent or insufficient.
66
+
67
+ ## Platform-Specific Guidance
68
+
69
+ Native text scaling, browser zoom, author font settings, and OS display scaling can affect different layers. Name which mechanism was changed in a test. Likewise, simulated CSS media features establish a code path, while an actual OS setting additionally exercises host integration.
70
+
71
+ Use [Accessible Motion](../motion/accessible-motion.md) for motion replacement and [Typography Semantics](../design-terminology/typography-semantics.md) for source-specific type-style meanings.
72
+
73
+ ## Unsupported Absolutes
74
+
75
+ Dark mode is not forced colors. A contrast preference is not a contrast measurement. Removing blur does not guarantee legibility. Passing one text-size case does not prove all localization and scaling combinations.
76
+
77
+ ## Verification Contract
78
+
79
+ Record the actual system setting, application override, media/API observation, and effective component state. Test before load and while a dialog or asynchronous operation is active. Compare semantic and visual evidence for the same state; do not substitute an accessibility-tree snapshot for an announcement test.
80
+
81
+ This documentation defines unexecuted cases. It makes no native accessibility or browser conformance claim. Re-review when a source, preference-resolution rule, or target platform changes.
82
+
83
+ ## Source, License, And Attribution
84
+
85
+ Locally authored synthesis of the linked first-party sources, inspected 2026-09-21. No platform values or assets are imported. `consumer_reference: not_applicable` because no consumer preference or profile record is selected.
86
+
87
+ ## IA Navigation
88
+
89
+ Parent: [Platform Guides](index.md).
90
+ Next: [Input And Focus](input-and-focus.md).
@@ -8,11 +8,11 @@ description: Decision to supersede the layout-only repository identity with a go
8
8
 
9
9
  ## Decision
10
10
 
11
- StyleGallery supersedes the repository-wide `layout-gallery` identity with five explicit domains: Layout, Motion, Design Engineering, Game UI, and Platform Guides. The prior layout-only rules remain authoritative inside Layout instead of being deleted or silently weakened.
11
+ StyleGallery supersedes the repository-wide `layout-gallery` identity with six explicit domains: Layout, Motion, Design Engineering, Platform Guides, Design Terminology, and Expression. The prior layout-only rules remain authoritative inside Layout instead of being deleted or silently weakened.
12
12
 
13
13
  ## Context
14
14
 
15
- The repository name and intended collection now exceed a single spatial corpus. Treating motion, interface craft, game-interface knowledge, engine-specific Game UI implementation, or platform comparison as Layout patterns would violate the existing pattern boundary, while leaving them ungoverned would bypass source-of-truth, ownership, lifecycle, and evidence rules.
15
+ The repository name and intended collection now exceed a single spatial corpus. Treating motion, interface craft, art direction, terminology comparison, or platform comparison as Layout patterns would violate the existing pattern boundary, while leaving them ungoverned would bypass source-of-truth, ownership, lifecycle, and evidence rules.
16
16
 
17
17
  ## Warrant
18
18
 
@@ -37,7 +37,7 @@ Executable evidence identifies which claims are machine-enforced, which are only
37
37
  | Promotion governance remains a closed JSON-only, invariant-scoped, deferred example contract. | `scripts/validate-promotion-rfc.mjs` and `scripts/test-validate-promotion-rfc.mjs` | `node scripts/validate-promotion-rfc.mjs --json`; `node scripts/test-validate-promotion-rfc.mjs --json` | The manifest-declared policy and two canonical examples pass with deferred decisions, zero attestations, exact support commitment, and no promotion claim. | Manifest-declared invalid fixtures plus forged, unregistered, duplicate, path, extension, support, evidence, canonical-drift, and lifecycle mutations exit non-zero with named findings. | Synthetic validation does not authenticate adoption, organizations, owners, support capacity, provenance, or a promotion decision; the current canonical inventory supplies no real independent consumers. |
38
38
  | Portable token source and generated CSS agree through the pinned restricted adapter. | `scripts/build-reference-artifacts.mjs`, `scripts/validate-reference-artifacts.mjs`, and `scripts/test-reference-adapters.mjs` | Build with `--fail-on-warning`, validate the generated manifest, then run the adapter fixture harness. | Dimension, color, duration, tested border values, and whole-token curly aliases emit nonzero CSS declarations with matching counts and hashes; output references remain CSS variable references. | `$extends`, JSON Pointer, resolver/modifier/theme documents, unknown reserved fields, non-string descriptions, adapter-unsafe path segments, untested type/unit, partial/dangling/cyclic/type-mismatched aliases, missing output, zero count, warning, scaffold/unknown manifest fields, missing/duplicate declaration, object sentinel, unresolved or forged value, and count drift must fail with named findings and non-zero child exit. | Proves the pinned adapter preserves this tested subset and that committed artifacts independently rebuild from their canonical source, not that tokens are product defaults, portable beyond the tested adapters, visually suitable, or adopted by a consumer. |
39
39
  | The proposed Chromium sentinel preserves canonical card-grid geometry and truth-derived calibration evidence. | `tests/consumer-reference-sentinels.spec.mjs`, `scripts/test-consumer-reference-sentinel.mjs`, `scripts/validate-baseline-manifest.mjs`, and strict raw calibration harnesses. | Run the ordinary sentinel and semantic negatives in the digest-pinned nonblocking Chromium job; validate manifest/raw evidence in the contract job. | Computed visibility/cardinality/grid/gap/geometry/overflow checks precede a locator screenshot; raw DOM and AX bytes are recorded and hash-checked across runs; completion and zero diff derive only from a zero child exit, the exact passing Playwright identity, verified raw hashes, and post-assertion comparison proof. | Hidden layout, long-content overflow, fake/malformed Playwright, missing or nonzero exit, absent comparison/artifact, tampered hash, duplicate/unknown metadata, malformed recursive records, and incomplete run sets must fail without writing a completed aggregate. | Local DOM/AX/rendered evidence does not prove semantic DOM/AX conformance, product suitability, accessibility, or owner approval. Completed-CI repository, workflow, run ID and attempt, SHA, and artifact-name fields are workflow-recorded, self-asserted metadata, not an external attestation. The self-asserted repository field names the canonical upstream changeroa/StyleGallery; the self-asserted execution_repository field names the actual GitHub Actions repository and is limited to changeroa/StyleGallery or ark-jo/StyleGallery. The committed calibration's external_verification object records an independently checked GitHub Actions run and artifact API identity; artifact.api_digest is distinct from committed_ci.raw_evidence_sha256. Future CI aggregates remain awaiting_external_verification until their uploaded artifact API identity is independently checked. Linux/amd64 repeatability is externally verified only for committed run 29260372260; it does not establish baseline-owner approval or product suitability. Baseline-owner approval remains unclaimed until the named owner explicitly approves it. Synthetic fixtures validate rejection and acceptance behavior only; they are not authenticated provenance. Both Chromium jobs are nonblocking and CI never updates snapshots. |
40
- | Governed-local button states retain source-bound visual, DOM, and accessibility-tree evidence across both example profiles. | `scripts/create-component-state-session.mjs`, `scripts/finalize-component-state-evidence.mjs`, `scripts/validate-component-state.mjs`, and the component-state source, contract, artifact, generator, and sentinel harnesses. | `npm run test:component-state`; `npm run validate:component-state`; run the digest-pinned component-state browser capture and `npm run test:component-state:runtime-negative`. | Editorial and terminal each declare the five compound scenarios `action-disabled-busy`, `action-focused`, `action-loading-busy`, `disclosure-expanded-loading`, and `toggle-focused-pressed`; their environment-scoped approved PNG hashes and dimensions are canonical pre-capture inputs; the generated state, keyboard, and evidence matrices match their records; one clean capture session binds the browser artifacts to the governed source inventory. | Missing or altered source bindings, missing executable source manifests, invalid state/profile records, scenario drift, coordinated PNG/manifest/sidecar substitution, unapproved environment-specific raster identity, malformed or replayed runtime artifacts, hash/count mismatch, insufficient focus clearance, and sentinel mutations must exit non-zero with named findings. | Proves the declared examples and captured channels agree for an explicitly approved browser environment. Legacy source-less receipts are intentionally rejected by the capture receipt, `session_link`, and `completed_session` schemas and by executable finalization and validation. Environment-scoped PNG identity does not imply cross-platform pixel equivalence. It does not prove product suitability, independent adoption, full accessibility, cross-browser behavior, or owner approval; synthetic negative fixtures are not authenticated provenance. |
40
+ | Governed-local button states retain source-bound visual, DOM, and accessibility-tree evidence across both example profiles. | `scripts/create-component-state-session.mjs`, `scripts/finalize-component-state-evidence.mjs`, `scripts/validate-component-state.mjs`, and the component-state source, contract, artifact, generator, and sentinel harnesses. | `bun run test:component-state`; `bun run validate:component-state`; run the digest-pinned component-state browser capture and `bun run test:component-state:runtime-negative`. | Editorial and terminal each declare the five compound scenarios `action-disabled-busy`, `action-focused`, `action-loading-busy`, `disclosure-expanded-loading`, and `toggle-focused-pressed`; their environment-scoped approved PNG hashes and dimensions are canonical pre-capture inputs; the generated state, keyboard, and evidence matrices match their records; one clean capture session binds the browser artifacts to the governed source inventory. | Missing or altered source bindings, missing executable source manifests, invalid state/profile records, scenario drift, coordinated PNG/manifest/sidecar substitution, unapproved environment-specific raster identity, malformed or replayed runtime artifacts, hash/count mismatch, insufficient focus clearance, and sentinel mutations must exit non-zero with named findings. | Proves the declared examples and captured channels agree for an explicitly approved browser environment. Legacy source-less receipts are intentionally rejected by the capture receipt, `session_link`, and `completed_session` schemas and by executable finalization and validation. Environment-scoped PNG identity does not imply cross-platform pixel equivalence. It does not prove product suitability, independent adoption, full accessibility, cross-browser behavior, or owner approval; synthetic negative fixtures are not authenticated provenance. |
41
41
 
42
42
  ## Validator Severity Contract
43
43
 
package/quality/index.md CHANGED
@@ -1,6 +1,6 @@
1
1
  # Quality Gates
2
2
 
3
- `quality/` is shared StyleGallery infrastructure for deciding whether Layout, Motion, Design Engineering, Game UI, Platform Guides, and Design Terminology claims are admissible.
3
+ `quality/` is shared StyleGallery infrastructure for deciding whether Layout, Motion, Design Engineering, Platform Guides, Design Terminology, and Expression claims are admissible.
4
4
 
5
5
  This shared layer does not make the repository a visual design system. Layout pattern files still own spatial structure only; domain guidance cannot bypass these gates. Quality gates explain how claims are framed, what evidence can support them, and when review or debt is required.
6
6
 
@@ -50,6 +50,5 @@ Use this script for lightweight tree tests:
50
50
  | Compare an Apple interaction convention. | [README](../README.md) | [Apple Interaction](../platform-guides/apple-interaction.md) | The first selected route is Platform Guides and source/version limits are reached within two hops. |
51
51
  | Declare whether a consumer reference applies. | [README](../README.md) | [Consumer Reference](../consumer-reference/index.md) | The handoff reaches the shared contract without classifying it as a seventh domain. |
52
52
  | Prove a consumer migration preserves declared behavior. | [README](../README.md) | [Consumer Migration Readiness](../design-engineering/consumer-migration-readiness.md) | The reader reaches the Design Engineering method and its evidence gate within two hops. |
53
- | Find the authority route for uGUI, UI Toolkit, or NGUI. | [README](../README.md) | [Unity UI Systems](../game-ui/unity/ui-systems.md) | The first selected route is Game UI, and the system-specific source and version boundary is reached within three hops. |
54
53
 
55
54
  Record `PASS` only when the expected primary route is the first route selected. A link resolving successfully is not enough; the selected route must match the task intent.
@@ -17,7 +17,7 @@ const MANIFEST_REF = "sg:manifest/material-admission-v2";
17
17
  const MATERIAL_REF_PATTERN = /^sg:material\/path-sha256-[a-f0-9]{64}$/;
18
18
  const MATERIAL_VERSION_PATTERN = /^sg:material\/path-sha256-[a-f0-9]{64}@sha256:[a-f0-9]{64}$/;
19
19
  const HASH_PATTERN = /^[a-f0-9]{64}$/;
20
- const DOMAINS = new Set(["layout", "motion", "design-engineering", "game-ui", "platform-guides", "design-terminology", "shared"]);
20
+ const DOMAINS = new Set(["layout", "motion", "design-engineering", "platform-guides", "design-terminology", "expression", "shared"]);
21
21
  const LIFECYCLES = new Set(["draft", "stable", "deprecated", "experimental", "generated"]);
22
22
  const RECORD_KEYS = new Set(["schema_version", "record_kind", "stable_ref", "version_id", "repository_path", "media_type", "source_sha256", "byte_length", "lifecycle", "domain"]);
23
23
  const MANIFEST_KEYS = new Set(["schema_version", "record_kind", "stable_ref", "version_id", "admission_policy_ref", "admission_policy_version_id", "materials"]);
@@ -6,7 +6,7 @@ export const MATERIAL_STABLE_REF_KINDS = Object.freeze(["domain", "page", "patte
6
6
  const KIND_SET = new Set(MATERIAL_STABLE_REF_KINDS);
7
7
  const KEBAB = /^[a-z0-9]+(?:-[a-z0-9]+)*$/;
8
8
  const PATH_ID = /^path-sha256-[a-f0-9]{64}$/;
9
- const DOMAIN_IDS = new Set(["layout", "motion", "design-engineering", "game-ui", "platform-guides", "design-terminology"]);
9
+ const DOMAIN_IDS = new Set(["layout", "motion", "design-engineering", "platform-guides", "design-terminology", "expression"]);
10
10
  const MATERIAL_ID = PATH_ID;
11
11
 
12
12
  export class MaterialIdentityError extends TypeError {
@@ -56,7 +56,7 @@ export function materialIdentityForRecord(record) {
56
56
  if (typeof repositoryPath !== "string") fail("material_record_identity_invalid", "record has no bound source path");
57
57
  let kind = "page";
58
58
  let id = `path-sha256-${sha256(Buffer.from(repositoryPath, "utf8"))}`;
59
- const domainMatch = /^(layout|motion|design-engineering|game-ui|platform-guides|design-terminology)\/index\.md$/.exec(repositoryPath);
59
+ const domainMatch = /^(layout|motion|design-engineering|platform-guides|design-terminology|expression)\/index\.md$/.exec(repositoryPath);
60
60
  if (domainMatch) { kind = "domain"; id = domainMatch[1]; }
61
61
  else if (/^patterns\/[^/]+\/[^/]+\.md$/.test(repositoryPath)) kind = "pattern";
62
62
  return deepFreeze({
@@ -0,0 +1,112 @@
1
+ ---
2
+ type: Interface Guide
3
+ title: SG Website Compilation
4
+ description: Run a separately installed website compiler through the SG CLI and MCP server.
5
+ ---
6
+
7
+ # SG Website Compilation
8
+
9
+ Primary role: compiler setup and execution reference.
10
+
11
+ Use `sg compile`, `sg timeline`, and the other commands below directly. The `stylegallery-mcp` server exposes the same names alongside `discover`, `resolve`, `claims`, `context`, `ops`, and `retrieve`. Compiler operations can write files, open websites, and invoke a model; each tool declares those effects. The original [v1 knowledge interface](../../consumer-reference/agent-native/README.md) remains available separately.
12
+
13
+ ## Setup
14
+
15
+ Install StyleGallery with Node.js 22 or newer using `npm install --global stylegallery`. For an unreleased StyleGallery checkout, run commands from that checkout as `bun run sg -- <command>` instead. If another program already owns the `sg` command, use the equivalent `stylegallery` executable or the npm script. The compiler is a [separate private repository](https://github.com/changeroa/site-compiler); an account with access must install it once:
16
+
17
+ ```sh
18
+ gh repo clone changeroa/site-compiler /absolute/path/to/site-compiler
19
+ cd /absolute/path/to/site-compiler
20
+ bun install --frozen-lockfile --ignore-scripts
21
+ bunx playwright install chromium
22
+ export SG_COMPILER_ROOT=/absolute/path/to/site-compiler
23
+ sg discover --format json
24
+ ```
25
+
26
+ Set `SG_COMPILER_ROOT` in your shell profile for CLI use and in your MCP server environment for MCP use. A CLI invocation can override it with `--compiler-root /absolute/path/to/site-compiler`. `discover` preserves the knowledge response and adds a top-level `compiler` object containing installation status, the actual Git revision, tracked changes, and available operations. Missing compiler setup leaves knowledge queries usable.
27
+
28
+ The verified upstream revision is declared in [scripts/compiler/operations.mjs](operations.mjs). `matches_verified_revision` is true only for that revision without tracked modifications; a mismatch is reported but does not block execution. Use that revision when reproducing the verified workflow. To use a newer upstream version, update your compiler checkout with `git pull --ff-only` and `npm ci`, then inspect `sg discover` and `sg workflow`; SG does not fetch or upgrade code during a tool call. The compiler source, browser binaries, captured frames, and private pack data are not included in the StyleGallery npm package.
29
+
30
+ ## CLI
31
+
32
+ Run these from the consumer project's working directory:
33
+
34
+ ```sh
35
+ sg workflow
36
+ sg workflow --document readme
37
+ sg compile --url https://example.com --out ./captures/example
38
+ sg timeline --url https://example.com --out ./captures/example --step 500 --grow
39
+ sg transcribe --in ./captures --only example
40
+ sg sale --in ./captures/example --out ./captures/example/sale
41
+ sg gate --in ./captures/example --sale ./captures/example/sale --json ./captures/example/qa-report.json
42
+ sg build --packs ./captures --out ./builds --only example
43
+ sg shots --builds ./builds --slug example
44
+ ```
45
+
46
+ `compile` captures scenes and frames; it does not produce a SceneBook by itself. A SceneBook describes scene geometry and content; its Timeline companion describes observed scroll behavior. `transcribe` produces these documents. Transcription and the optional sale-preview builder require an installed, authenticated `claude` CLI and can incur model usage. Their input roots contain one subdirectory per pack. Supply `--stylegallery` only when a different SG corpus should be used; the installed StyleGallery package is the default.
47
+
48
+ Read `sg workflow` before selecting stages. Its installed compiler document owns the task policy: faithful reconstruction, adaptation for a new design, or sale-package production. These are task purposes, not CLI flags. Reconstruction uses available source media and direct observation to fill document gaps; the current implementation agent remains the builder. A media record carries source URLs, responsive variants, reuse or replacement decisions, and playback checks separately from the observation document.
49
+
50
+ `sale` replaces observed copy with structural descriptors. `build` consumes only those sale editions and intentionally restricts original-page and external-media access. It is a package preview, not the faithful-reconstruction route. Use sale, build, and release operations when that package purpose is requested. A document-only evaluation is an explicit experiment, not the default website workflow. The SG skill only retrieves this workflow; it does not duplicate these policies.
51
+
52
+ By default, `sale` writes its private audit to `copy-audit.private.json` in the parent of `--out`. Override this with `--audit`; it must remain outside the sale directory. The resolved destination is returned in `result.paths.audit`.
53
+
54
+ | Command | Input and output |
55
+ | --- | --- |
56
+ | `compile` | `--url`, `--out`; writes `scenes.json` and `frames/` |
57
+ | `timeline` | `--url`, `--out`; writes `timeline-curve.json` and `dense/` |
58
+ | `transcribe` | `--in` pack root; writes documents and `transcribe.json` |
59
+ | `sale` | `--in`, `--out`; writes sale documents and a private audit outside `out` |
60
+ | `gate` | `--in`; optionally `--sale`, `--json`; returns failure when the upstream gate fails |
61
+ | `build` | `--packs`, `--out`; writes sale-edition previews and `build.json` |
62
+ | `shots` | `--builds`, `--slug`; writes screenshots and a report under each build |
63
+ | `probe` | `--url`; logs scroll geometry; optional `--chrome` |
64
+ | `batch-triage` | `--candidates`, `--out`; captures candidate curves and writes `runs.json` |
65
+ | `triage` | `--in`; writes heuristic rankings |
66
+ | `batch-capture` | `--candidates`, `--out`; captures scenes/timelines and writes `capture.json` |
67
+ | `pack-status` | `--candidates`, `--in`; generates sale editions, runs gates, and updates status |
68
+ | `pack-release` | `--products`; uses the compiler checkout's `out/packs` and `out/builds`, replacing matching files in `out/release` |
69
+ | `workflow` | Reads the installed `SKILL.md`, or `README.md` with `--document readme` |
70
+
71
+ All CLI results are one JSON envelope on stdout, including failures. Child logs are returned in `result.stdout` and `result.stderr`, with a 64 KiB tail per stream and truncation flags. Relative path options resolve from the caller's working directory; upstream scripts execute from the compiler checkout. `pack-release` is the upstream exception with fixed checkout-relative directories, and produces local archives without publishing them.
72
+
73
+ Use `sg discover` or `sg ops` for the full input schemas. CLI options use hyphens (`--max-height`); MCP inputs use underscores (`max_height`). Unknown options, repeated CLI options, missing required paths, and invalid numeric values fail before execution. `--format json` is optional. `--runner-timeout-ms` bounds the entire process tree, defaults to 30 minutes, and accepts up to six hours; `--timeout-ms` on model operations instead controls upstream per-job timeouts. Interrupting the CLI or cancelling an MCP request terminates its running process tree.
74
+
75
+ `ok` reports process success. Batch scripts can exit zero with failed individual jobs: use the returned ledger path to inspect each pack. A gate pass is an upstream consistency check, not SG conformance, accessibility proof, or rights clearance. Each result records the compiler revision, tracked-change status, executed script hash, and normalized arguments. Captures and generated documents remain consumer-owned outputs and are not admitted to the governed material registry.
76
+
77
+ ## MCP
78
+
79
+ ```json
80
+ {
81
+ "mcpServers": {
82
+ "stylegallery": {
83
+ "command": "npx",
84
+ "args": ["--yes", "--package", "stylegallery", "stylegallery-mcp"],
85
+ "env": { "SG_COMPILER_ROOT": "/absolute/path/to/site-compiler" }
86
+ }
87
+ }
88
+ }
89
+ ```
90
+
91
+ Call `compile` with `{"url":"https://example.com","out":"/absolute/path/to/captures/example"}` or `gate` with `{"in":"/absolute/path/to/captures/example"}`. Prefer absolute paths because the MCP client's launch directory may differ from your terminal. Long captures require a client request timeout longer than the capture; the runner's timeout does not change client settings. `workflow` and the knowledge tools are read-only; execution tools are marked as potentially destructive and non-idempotent because existing artifacts may be replaced.
92
+
93
+ From the StyleGallery checkout, use `bun run sg -- compile ...` and `bun run sg:mcp` for local development. To connect an MCP client to that unreleased checkout, use `"command": "node"` and `"args": ["/absolute/path/to/StyleGallery/scripts/sg-server.mjs"]` with the same environment settings. The frozen six-tool v1 server is `bun run sg:mcp:v1`, and its CLI is `bun run sg:v1 -- ...`.
94
+
95
+ ## Contracts And Verification
96
+
97
+ The adapter follows the handoff fields in [Component Contract](../../design-engineering/component-contract.md): explicit inputs, outputs, process ownership, cancellation, and observable failure. Motion transcription remains governed by [Observed Choreography](../../motion/observed-choreography.md). These are routes into the existing domains; the transport creates no new domain or reusable Layout styling.
98
+
99
+ From the StyleGallery checkout, run `bun run test:compiler` for subprocess, argument, cancellation, JSON, and MCP transport checks. With a compiler installation and Chromium available, run `SG_COMPILER_INTEGRATION_ROOT=/absolute/path/to/site-compiler bun run test:compiler` to also capture a local fixture with the real upstream scripts. Model transcription, model builds, and product release packaging are separate upstream operations and are not exercised by that smoke test.
100
+
101
+ Implementation handoff:
102
+
103
+ ```text
104
+ Consumer reference: declared
105
+ Consumer reference record: consumer-reference/agent-native/registry.json
106
+ consumer_reference: consumer-reference/agent-native/registry.json
107
+ ```
108
+
109
+ ## Navigation
110
+
111
+ Parent: [StyleGallery](../../README.md).
112
+ Next: [Component Contract](../../design-engineering/component-contract.md).
@@ -0,0 +1,51 @@
1
+ import { runCli } from "../agent-native/cli-adapter.mjs";
2
+ import { compilerOperations, compilerToolDefinitions } from "./operations.mjs";
3
+ import { compilerDiscovery, executeCompiler, failure } from "./runtime.mjs";
4
+
5
+ export function withCompilerDiscovery(report, config = {}) {
6
+ if (!report.ok || !["discover", "ops"].includes(report.operation)) return report;
7
+ return { ...report, compiler: compilerDiscovery(config) };
8
+ }
9
+
10
+ export async function runSgCli(argv, config = {}) {
11
+ const args = [...argv];
12
+ const options = { ...config };
13
+ let report;
14
+ const rootIndex = args.indexOf("--compiler-root");
15
+ if (rootIndex >= 0) {
16
+ const root = args[rootIndex + 1];
17
+ if (!root || root.startsWith("--") || args.lastIndexOf("--compiler-root") !== rootIndex) {
18
+ report = failure(null, "argument_invalid", "--compiler-root requires one checkout path.");
19
+ } else { options.compilerRoot = root; args.splice(rootIndex, 2); }
20
+ }
21
+ const command = args[0];
22
+ if (!report && !Object.hasOwn(compilerOperations, command) && command !== "workflow") {
23
+ report = withCompilerDiscovery(runCli(args).report, options);
24
+ } else if (!report) {
25
+ const definition = compilerToolDefinitions().find(({ name }) => name === command);
26
+ const properties = definition.inputSchema.properties;
27
+ const input = {};
28
+ const seen = new Set();
29
+ for (let i = 1; i < args.length; i += 1) {
30
+ const flag = args[i];
31
+ const key = flag.startsWith("--") ? flag.slice(2).replaceAll("-", "_") : "";
32
+ if ((!Object.hasOwn(properties, key) && key !== "format") || seen.has(key)) {
33
+ report = failure(command, "argument_invalid", `Unknown or repeated argument: ${flag}`);
34
+ break;
35
+ }
36
+ seen.add(key);
37
+ const type = key === "format" ? "string" : properties[key].type;
38
+ if (type === "boolean") { input[key] = true; continue; }
39
+ const value = args[++i];
40
+ if (value === undefined || value.startsWith("--")) {
41
+ report = failure(command, "argument_value_required", `${flag} requires a value.`);
42
+ break;
43
+ }
44
+ if (key === "format") {
45
+ if (value !== "json") { report = failure(command, "format_unsupported", "Only --format json is supported."); break; }
46
+ } else input[key] = ["number", "integer"].includes(type) ? Number(value) : value;
47
+ }
48
+ report ??= await executeCompiler(command, input, options);
49
+ }
50
+ return { report, exitCode: report.ok ? 0 : 1, output: `${JSON.stringify(report, null, 2)}\n` };
51
+ }
@@ -0,0 +1,53 @@
1
+ import { CallToolRequestSchema, ListToolsRequestSchema } from "@modelcontextprotocol/sdk/types.js";
2
+ import { z } from "zod";
3
+
4
+ import { createStyleGalleryMcpServer } from "../agent-native/mcp-adapter.mjs";
5
+ import { agentNativeRegistry } from "../agent-native/registry.mjs";
6
+ import { compilerOperations, compilerToolDefinitions } from "./operations.mjs";
7
+ import { withCompilerDiscovery } from "./cli.mjs";
8
+ import { executeCompiler, failure } from "./runtime.mjs";
9
+
10
+ // Compose at the transport boundary. The byte-frozen v1 server, registry,
11
+ // conformance receipts, and resources remain independently usable.
12
+ export function createSgMcpServer(config = {}) {
13
+ const server = createStyleGalleryMcpServer();
14
+ const lifetime = new AbortController();
15
+ server.server.onclose = () => lifetime.abort();
16
+ const legacy = agentNativeRegistry.operations.filter(({ read_only }) => read_only);
17
+ const legacyByName = new Map(legacy.map((operation) => [operation.name, operation]));
18
+ const legacyTools = legacy.map((operation) => {
19
+ const inputSchema = structuredClone(operation.input_schema);
20
+ if (Object.hasOwn(inputSchema.properties ?? {}, "reference")) {
21
+ inputSchema.properties.stable_ref = structuredClone(inputSchema.properties.reference);
22
+ inputSchema.required = (inputSchema.required ?? []).filter((key) => key !== "reference");
23
+ inputSchema.anyOf = [{ required: ["reference"] }, { required: ["stable_ref"] }];
24
+ }
25
+ return {
26
+ name: operation.name, description: operation.description, inputSchema,
27
+ annotations: { readOnlyHint: true, destructiveHint: false, idempotentHint: true, openWorldHint: false },
28
+ };
29
+ });
30
+ server.server.setRequestHandler(ListToolsRequestSchema, async () => ({
31
+ tools: [...legacyTools, ...compilerToolDefinitions()].sort((a, b) => a.name < b.name ? -1 : a.name > b.name ? 1 : 0),
32
+ }));
33
+ const callSchema = CallToolRequestSchema.extend({
34
+ params: CallToolRequestSchema.shape.params.extend({ arguments: z.unknown().optional() }),
35
+ });
36
+ server.server.setRequestHandler(callSchema, async (request, extra) => {
37
+ const operation = request.params.name;
38
+ let input = request.params.arguments ?? {};
39
+ let report;
40
+ if (Object.hasOwn(compilerOperations, operation) || operation === "workflow") {
41
+ const signals = [lifetime.signal, extra.signal, config.signal].filter(Boolean);
42
+ report = await executeCompiler(operation, input, { ...config, signal: AbortSignal.any(signals) });
43
+ } else if (legacyByName.has(operation)) {
44
+ if (input && typeof input === "object" && !Array.isArray(input) && Object.hasOwn(input, "stable_ref")) {
45
+ input = { ...input, reference: input.reference ?? input.stable_ref };
46
+ delete input.stable_ref;
47
+ }
48
+ report = withCompilerDiscovery(agentNativeRegistry.invoke(operation, input), config);
49
+ } else report = failure(operation, "operation_not_exposed", `Operation ${operation} is not exposed.`);
50
+ return { content: [{ type: "text", text: JSON.stringify(report) }], structuredContent: report, isError: report.ok !== true };
51
+ });
52
+ return server;
53
+ }