stylegallery 0.1.6 → 0.1.7
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/DOMAINS.md +4 -4
- package/GOVERNANCE.md +1 -1
- package/LICENSE +28 -0
- package/LICENSE-DOCS +42 -0
- package/NOTICE +38 -0
- package/README.md +25 -6
- package/consumer-reference/agent-native/README.md +7 -7
- package/consumer-reference/agent-native/v2/admission-policy.json +171 -1
- package/consumer-reference/agent-native/v2/material-registry.json +1 -1
- package/consumer-reference/agent-native/v2/schema/admission-policy.schema.json +2 -2
- package/design-engineering/component-contract.md +19 -3
- package/design-engineering/decision-tree.md +1 -0
- package/design-engineering/index.md +48 -0
- package/design-engineering/loading-and-feedback.md +91 -0
- package/design-engineering/native-interaction-contracts.md +94 -0
- package/design-engineering/state-management/decision-tree.md +60 -0
- package/design-engineering/state-management/index.md +61 -0
- package/design-engineering/state-management/patterns/derived-state.md +85 -0
- package/design-engineering/state-management/patterns/draft-and-baseline.md +86 -0
- package/design-engineering/state-management/patterns/id-selection.md +85 -0
- package/design-engineering/state-management/patterns/identity-reset.md +89 -0
- package/design-engineering/state-management/patterns/latest-request-wins.md +94 -0
- package/design-engineering/state-management/patterns/optimistic-overlay.md +98 -0
- package/design-engineering/state-management/patterns/single-flight.md +92 -0
- package/design-engineering/state-management/patterns/single-owner.md +89 -0
- package/design-engineering/state-management/patterns/submitted-snapshot.md +107 -0
- package/design-engineering/state-management/patterns/unsaved-navigation.md +100 -0
- package/design-engineering/state-management/patterns/url-state.md +96 -0
- package/design-engineering/state-management/patterns/versioned-restore.md +95 -0
- package/design-engineering/state-management/recipes/delete-undo.md +65 -0
- package/design-engineering/state-management/recipes/index.md +64 -0
- package/design-engineering/state-management/recipes/multi-step-form.md +65 -0
- package/design-engineering/state-management/recipes/search-detail.md +65 -0
- package/design-engineering/state-management/recipes/settings-save.md +64 -0
- package/design-engineering/state-management/state-brief.md +83 -0
- package/design-engineering/state-management/verification.md +65 -0
- package/design-engineering/text-input-and-internationalization.md +91 -0
- package/design-engineering/worked-examples.md +2 -0
- package/design-terminology/conflict-cases.md +50 -7
- package/design-terminology/index.md +6 -0
- package/design-terminology/interaction-semantics.md +87 -0
- package/design-terminology/source-vocabularies.md +17 -1
- package/design-terminology/token-semantics.md +90 -0
- package/design-terminology/typography-semantics.md +86 -0
- package/log.md +29 -0
- package/motion/accessible-motion.md +90 -0
- package/motion/index.md +7 -0
- package/motion/interaction-recipes.md +8 -2
- package/motion/interruption-and-retargeting.md +90 -0
- package/motion/observed-choreography.md +73 -0
- package/motion/rendering-and-performance.md +89 -0
- package/package.json +60 -8
- package/platform-guides/adaptive-navigation.md +85 -0
- package/platform-guides/index.md +6 -0
- package/platform-guides/input-and-focus.md +91 -0
- package/platform-guides/preferences-and-accessibility.md +90 -0
- package/scripts/compiler/README.md +112 -0
- package/scripts/compiler/cli.mjs +51 -0
- package/scripts/compiler/mcp.mjs +53 -0
- package/scripts/compiler/operations.mjs +70 -0
- package/scripts/compiler/runtime.mjs +156 -0
- package/scripts/sg-entry.mjs +20 -0
- package/scripts/sg-server.mjs +20 -0
package/package.json
CHANGED
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "stylegallery",
|
|
3
|
-
"version": "0.1.
|
|
4
|
-
"description": "A governed gallery of portable interface knowledge with
|
|
3
|
+
"version": "0.1.7",
|
|
4
|
+
"description": "A governed gallery of portable interface knowledge with knowledge CLIs, website compilation, and MCP servers.",
|
|
5
5
|
"type": "module",
|
|
6
|
+
"license": "MIT",
|
|
6
7
|
"homepage": "https://github.com/changeroa/StyleGallery#readme",
|
|
7
8
|
"bugs": {
|
|
8
9
|
"url": "https://github.com/changeroa/StyleGallery/issues"
|
|
@@ -28,6 +29,9 @@
|
|
|
28
29
|
"DOMAINS.md",
|
|
29
30
|
"GOVERNANCE.md",
|
|
30
31
|
"GUIDE.md",
|
|
32
|
+
"LICENSE",
|
|
33
|
+
"LICENSE-DOCS",
|
|
34
|
+
"NOTICE",
|
|
31
35
|
"README.md",
|
|
32
36
|
"consumer-reference/agent-native/README.md",
|
|
33
37
|
"consumer-reference/agent-native/registry.json",
|
|
@@ -52,17 +56,44 @@
|
|
|
52
56
|
"design-engineering/decision-tree.md",
|
|
53
57
|
"design-engineering/index.md",
|
|
54
58
|
"design-engineering/interface-craft.md",
|
|
59
|
+
"design-engineering/loading-and-feedback.md",
|
|
60
|
+
"design-engineering/native-interaction-contracts.md",
|
|
55
61
|
"design-engineering/reference-profiles/governed-local/editorial/profile.json",
|
|
56
62
|
"design-engineering/reference-profiles/governed-local/index.md",
|
|
57
63
|
"design-engineering/reference-profiles/index.md",
|
|
64
|
+
"design-engineering/state-management/decision-tree.md",
|
|
65
|
+
"design-engineering/state-management/index.md",
|
|
66
|
+
"design-engineering/state-management/patterns/derived-state.md",
|
|
67
|
+
"design-engineering/state-management/patterns/draft-and-baseline.md",
|
|
68
|
+
"design-engineering/state-management/patterns/id-selection.md",
|
|
69
|
+
"design-engineering/state-management/patterns/identity-reset.md",
|
|
70
|
+
"design-engineering/state-management/patterns/latest-request-wins.md",
|
|
71
|
+
"design-engineering/state-management/patterns/optimistic-overlay.md",
|
|
72
|
+
"design-engineering/state-management/patterns/single-flight.md",
|
|
73
|
+
"design-engineering/state-management/patterns/single-owner.md",
|
|
74
|
+
"design-engineering/state-management/patterns/submitted-snapshot.md",
|
|
75
|
+
"design-engineering/state-management/patterns/unsaved-navigation.md",
|
|
76
|
+
"design-engineering/state-management/patterns/url-state.md",
|
|
77
|
+
"design-engineering/state-management/patterns/versioned-restore.md",
|
|
78
|
+
"design-engineering/state-management/recipes/delete-undo.md",
|
|
79
|
+
"design-engineering/state-management/recipes/index.md",
|
|
80
|
+
"design-engineering/state-management/recipes/multi-step-form.md",
|
|
81
|
+
"design-engineering/state-management/recipes/search-detail.md",
|
|
82
|
+
"design-engineering/state-management/recipes/settings-save.md",
|
|
83
|
+
"design-engineering/state-management/state-brief.md",
|
|
84
|
+
"design-engineering/state-management/verification.md",
|
|
85
|
+
"design-engineering/text-input-and-internationalization.md",
|
|
58
86
|
"design-engineering/worked-examples.md",
|
|
59
87
|
"design-terminology/comparison-workflow.md",
|
|
60
88
|
"design-terminology/concept-families.md",
|
|
61
89
|
"design-terminology/conflict-cases.md",
|
|
62
90
|
"design-terminology/index.md",
|
|
91
|
+
"design-terminology/interaction-semantics.md",
|
|
63
92
|
"design-terminology/relation-types.md",
|
|
64
93
|
"design-terminology/source-kinds.md",
|
|
65
94
|
"design-terminology/source-vocabularies.md",
|
|
95
|
+
"design-terminology/token-semantics.md",
|
|
96
|
+
"design-terminology/typography-semantics.md",
|
|
66
97
|
"game-ui/classification.md",
|
|
67
98
|
"game-ui/decision-tree.md",
|
|
68
99
|
"game-ui/index.md",
|
|
@@ -83,11 +114,15 @@
|
|
|
83
114
|
"index.md",
|
|
84
115
|
"layout/index.md",
|
|
85
116
|
"log.md",
|
|
117
|
+
"motion/accessible-motion.md",
|
|
86
118
|
"motion/decision-tree.md",
|
|
87
119
|
"motion/index.md",
|
|
88
120
|
"motion/interaction-recipes.md",
|
|
121
|
+
"motion/interruption-and-retargeting.md",
|
|
89
122
|
"motion/motion-brief.md",
|
|
123
|
+
"motion/observed-choreography.md",
|
|
90
124
|
"motion/practice-reference.md",
|
|
125
|
+
"motion/rendering-and-performance.md",
|
|
91
126
|
"motion/review-workflow.md",
|
|
92
127
|
"motion/vocabulary.md",
|
|
93
128
|
"patterns/centering/center.md",
|
|
@@ -147,10 +182,13 @@
|
|
|
147
182
|
"patterns/viewport-shell/sticky-footer.md",
|
|
148
183
|
"patterns/viewport-shell/sticky-header.md",
|
|
149
184
|
"platform-guides/adaptation-workflow.md",
|
|
185
|
+
"platform-guides/adaptive-navigation.md",
|
|
150
186
|
"platform-guides/android-interaction.md",
|
|
151
187
|
"platform-guides/apple-interaction.md",
|
|
152
188
|
"platform-guides/compatibility-matrix.md",
|
|
153
189
|
"platform-guides/index.md",
|
|
190
|
+
"platform-guides/input-and-focus.md",
|
|
191
|
+
"platform-guides/preferences-and-accessibility.md",
|
|
154
192
|
"platform-guides/windows-interaction.md",
|
|
155
193
|
"quality/claim-records/design-terminology-domain-scope.md",
|
|
156
194
|
"quality/claim-records/index.md",
|
|
@@ -214,19 +252,26 @@
|
|
|
214
252
|
"scripts/agent-native/v2/material-operation-registry.mjs",
|
|
215
253
|
"scripts/agent-native/v2/material-queries.mjs",
|
|
216
254
|
"scripts/agent-native/v2/material-registry.mjs",
|
|
255
|
+
"scripts/compiler/README.md",
|
|
256
|
+
"scripts/compiler/cli.mjs",
|
|
257
|
+
"scripts/compiler/mcp.mjs",
|
|
258
|
+
"scripts/compiler/operations.mjs",
|
|
259
|
+
"scripts/compiler/runtime.mjs",
|
|
260
|
+
"scripts/sg-entry.mjs",
|
|
217
261
|
"scripts/sg-material-mcp.mjs",
|
|
218
262
|
"scripts/sg-material.mjs",
|
|
219
263
|
"scripts/sg-mcp.mjs",
|
|
264
|
+
"scripts/sg-server.mjs",
|
|
220
265
|
"scripts/sg.mjs",
|
|
221
266
|
"scripts/strict-json.mjs"
|
|
222
267
|
],
|
|
223
268
|
"bin": {
|
|
224
|
-
"sg": "scripts/sg.mjs",
|
|
269
|
+
"sg": "scripts/sg-entry.mjs",
|
|
225
270
|
"sg-material": "scripts/sg-material.mjs",
|
|
226
|
-
"stylegallery": "scripts/sg.mjs",
|
|
271
|
+
"stylegallery": "scripts/sg-entry.mjs",
|
|
227
272
|
"stylegallery-material": "scripts/sg-material.mjs",
|
|
228
273
|
"stylegallery-material-mcp": "scripts/sg-material-mcp.mjs",
|
|
229
|
-
"stylegallery-mcp": "scripts/sg-
|
|
274
|
+
"stylegallery-mcp": "scripts/sg-server.mjs"
|
|
230
275
|
},
|
|
231
276
|
"publishConfig": {
|
|
232
277
|
"access": "public"
|
|
@@ -251,13 +296,17 @@
|
|
|
251
296
|
"test:material": "node scripts/agent-native/v2/test-material-admission.mjs && node scripts/agent-native/v2/test-material-registry.mjs && node scripts/agent-native/v2/test-material-query.mjs && node scripts/agent-native/v2/test-material-context.mjs && node scripts/agent-native/v2/test-sg-material-cli.mjs && node scripts/agent-native/v2/test-material-mcp.mjs && node scripts/agent-native/v2/test-material-mcp-stdio.mjs && node scripts/agent-native/v2/test-sg-material-package.mjs",
|
|
252
297
|
"test:lifecycle-dispositions": "node scripts/test-lifecycle-disposition.mjs",
|
|
253
298
|
"validate:lifecycle-dispositions": "node scripts/validate-lifecycle-disposition.mjs --json",
|
|
254
|
-
"sg": "node scripts/sg.mjs",
|
|
299
|
+
"sg": "node scripts/sg-entry.mjs",
|
|
255
300
|
"sg:material": "node scripts/sg-material.mjs",
|
|
256
301
|
"sg:material:mcp": "node scripts/sg-material-mcp.mjs",
|
|
257
|
-
"sg:mcp": "node scripts/sg-
|
|
302
|
+
"sg:mcp": "node scripts/sg-server.mjs",
|
|
258
303
|
"test:agent-native": "node scripts/test-agent-knowledge-kernel.mjs --json && node scripts/test-agent-execution-kernel.mjs --json && node scripts/test-agent-execution-safety.mjs --json && node scripts/test-agent-events.mjs --json && node scripts/test-agent-learning.mjs --json && node scripts/test-agent-native-schemas.mjs --json && node scripts/test-sg-cli.mjs --json && node scripts/test-agent-conformance-receipt.mjs --json && node scripts/test-agent-mcp.mjs --json && node scripts/test-agent-registry-mcp-integrity.mjs --json && node scripts/test-agent-registry-mutations.mjs --json && node scripts/test-agent-adapter-conformance.mjs --json && node scripts/agent-native/v2/test-agent-extension-boundary.mjs && node scripts/test-agent-projections.mjs --json && node scripts/agent-native/v2/test-agent-v1-compatibility.mjs",
|
|
259
304
|
"validate": "node scripts/validate-reference-artifacts.mjs --manifest consumer-reference/generated/manifest.json --json",
|
|
260
|
-
"validate:component-state": "node scripts/validate-component-state.mjs --json && node scripts/generate-consumer-reference-evidence.mjs --check --json"
|
|
305
|
+
"validate:component-state": "node scripts/validate-component-state.mjs --json && node scripts/generate-consumer-reference-evidence.mjs --check --json",
|
|
306
|
+
"test:state-management": "node --test scripts/test-state-management-examples.mjs",
|
|
307
|
+
"test:compiler": "node --test scripts/test-sg-compiler.mjs",
|
|
308
|
+
"sg:v1": "node scripts/sg.mjs",
|
|
309
|
+
"sg:mcp:v1": "node scripts/sg-mcp.mjs"
|
|
261
310
|
},
|
|
262
311
|
"devDependencies": {
|
|
263
312
|
"@axe-core/playwright": "4.12.1",
|
|
@@ -270,5 +319,8 @@
|
|
|
270
319
|
"@modelcontextprotocol/sdk": "1.29.0",
|
|
271
320
|
"style-dictionary": "5.5.0",
|
|
272
321
|
"zod": "4.4.3"
|
|
322
|
+
},
|
|
323
|
+
"overrides": {
|
|
324
|
+
"brace-expansion": "5.0.9"
|
|
273
325
|
}
|
|
274
326
|
}
|
|
@@ -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).
|
package/platform-guides/index.md
CHANGED
|
@@ -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).
|
|
@@ -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 `npm 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
|
+
npm ci --ignore-scripts --no-audit --no-fund
|
|
21
|
+
npx 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 `npm run sg -- compile ...` and `npm 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 `npm run sg:mcp:v1`, and its CLI is `npm 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 `npm 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 npm 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
|
+
}
|