@amplify-ai/tokens-studio 1.0.2 → 1.0.3

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/dist/tailwind.css CHANGED
@@ -67,6 +67,9 @@
67
67
  --shadow-accent-sm: 0 1px 4px 0 rgba(101, 49, 255, 0.15);
68
68
  --shadow-accent-md: 0 4px 12px -2px rgba(101, 49, 255, 0.25);
69
69
  --shadow-accent-lg: 0 10px 25px -4px rgba(101, 49, 255, 0.35);
70
+ --shadow-ring-accent: 0 0 0 2px var(--amp-semantic-border-accent);
71
+ --shadow-composer: 0 -4px 12px -4px rgba(28, 25, 23, 0.08);
72
+ --shadow-device: 0 12px 32px -8px rgba(28, 25, 23, 0.18), 0 4px 12px -4px rgba(28, 25, 23, 0.10);
70
73
  --spacing-1: 4px;
71
74
  --spacing-2: 8px;
72
75
  --spacing-3: 12px;
@@ -114,6 +117,7 @@
114
117
  --color-semantic-status-error-bg: rgba(220, 38, 38, 0.08);
115
118
  --color-semantic-status-info: #2563EB;
116
119
  --color-semantic-status-info-bg: rgba(37, 99, 235, 0.08);
120
+ --color-semantic-color-info-soft: rgba(37, 99, 235, 0.08);
117
121
  --color-theme-color-bg: #FFFFFF;
118
122
  --color-theme-color-fg: #1C1917;
119
123
  --color-theme-color-muted: #57534E;
package/dist/tokens.js CHANGED
@@ -88,6 +88,9 @@ export const shadowLgDark = "0 8px 24px rgba(0, 0, 0, 0.4)";
88
88
  export const shadowAccentSm = "0 1px 4px 0 rgba(101, 49, 255, 0.15)";
89
89
  export const shadowAccentMd = "0 4px 12px -2px rgba(101, 49, 255, 0.25)";
90
90
  export const shadowAccentLg = "0 10px 25px -4px rgba(101, 49, 255, 0.35)";
91
+ export const shadowRingAccent = "0 0 0 2px var(--amp-semantic-border-accent)";
92
+ export const shadowComposer = "0 -4px 12px -4px rgba(28, 25, 23, 0.08)";
93
+ export const shadowDevice = "0 12px 32px -8px rgba(28, 25, 23, 0.18), 0 4px 12px -4px rgba(28, 25, 23, 0.10)";
91
94
  export const spacing1 = "4px";
92
95
  export const spacing2 = "8px";
93
96
  export const spacing3 = "12px";
@@ -154,6 +157,7 @@ export const semanticStatusError = "#DC2626";
154
157
  export const semanticStatusErrorBg = "rgba(220, 38, 38, 0.08)";
155
158
  export const semanticStatusInfo = "#2563EB";
156
159
  export const semanticStatusInfoBg = "rgba(37, 99, 235, 0.08)";
160
+ export const semanticColorInfoSoft = "rgba(37, 99, 235, 0.08)";
157
161
  export const themeColorBg = "#FFFFFF";
158
162
  export const themeColorFg = "#1C1917";
159
163
  export const themeColorMuted = "#57534E";
@@ -163,6 +167,24 @@ export const themeLayoutToolbarH = "56px";
163
167
  export const themeLayoutDrawerH = "48px";
164
168
  export const themeLayoutDrawerHOpen = "240px";
165
169
  export const themeLayoutPaneLeftW = "30%";
170
+ export const themeLayoutTopbarH = "56px";
171
+ export const themeLayoutThreadMaxW = "1180px";
172
+ export const themeLayoutComposerMaxW = "980px";
173
+ export const themeLayoutFlowSidebarW = "260px";
174
+ export const themeLayoutFlowSidebarRailW = "44px";
175
+ export const themeLayoutHistoryPanelW = "360px";
176
+ export const themeLayoutVariantCardH = "580px";
177
+ export const themeLayoutVariantCardW = "268px";
178
+ export const themeAspectIphone15ProMax = "1 / 2.17";
179
+ export const themeAspectIphone15Pro = "1 / 2.17";
180
+ export const themeAspectGalaxyS24 = "1 / 2.17";
181
+ export const themeAspectIpadPro13 = "1 / 1.33";
182
+ export const themeAspectIpadAir = "1 / 1.44";
183
+ export const themeAspectAppleWatchUltra = "1 / 1.22";
184
+ export const themeAspectAppleWatch9 = "1 / 1.22";
185
+ export const themeAspectMac = "1.6 / 1";
186
+ export const themeAspectMac1280 = "1.6 / 1";
187
+ export const themeAspectFlowThumb = "160 / 100";
166
188
  export const themeMapVoicePixel = "#7C3AED";
167
189
  export const themeMapVoiceAria = "#F59E0B";
168
190
  export const themeMapVoiceHeimdall = "#3B82F6";
package/dist/tokens.json CHANGED
@@ -87,6 +87,9 @@
87
87
  "amp-studio-shadow-accent-sm": "0 1px 4px 0 rgba(101, 49, 255, 0.15)",
88
88
  "amp-studio-shadow-accent-md": "0 4px 12px -2px rgba(101, 49, 255, 0.25)",
89
89
  "amp-studio-shadow-accent-lg": "0 10px 25px -4px rgba(101, 49, 255, 0.35)",
90
+ "amp-studio-shadow-ring-accent": "0 0 0 2px var(--amp-semantic-border-accent)",
91
+ "amp-studio-shadow-composer": "0 -4px 12px -4px rgba(28, 25, 23, 0.08)",
92
+ "amp-studio-shadow-device": "0 12px 32px -8px rgba(28, 25, 23, 0.18), 0 4px 12px -4px rgba(28, 25, 23, 0.10)",
90
93
  "amp-studio-spacing-1": "4px",
91
94
  "amp-studio-spacing-2": "8px",
92
95
  "amp-studio-spacing-3": "12px",
@@ -153,6 +156,7 @@
153
156
  "amp-studio-semantic-status-error-bg": "rgba(220, 38, 38, 0.08)",
154
157
  "amp-studio-semantic-status-info": "#2563EB",
155
158
  "amp-studio-semantic-status-info-bg": "rgba(37, 99, 235, 0.08)",
159
+ "amp-studio-semantic-color-info-soft": "rgba(37, 99, 235, 0.08)",
156
160
  "amp-studio-theme-color-bg": "#FFFFFF",
157
161
  "amp-studio-theme-color-fg": "#1C1917",
158
162
  "amp-studio-theme-color-muted": "#57534E",
@@ -162,6 +166,24 @@
162
166
  "amp-studio-theme-layout-drawer-h": "48px",
163
167
  "amp-studio-theme-layout-drawer-h-open": "240px",
164
168
  "amp-studio-theme-layout-pane-left-w": "30%",
169
+ "amp-studio-theme-layout-topbar-h": "56px",
170
+ "amp-studio-theme-layout-thread-max-w": "1180px",
171
+ "amp-studio-theme-layout-composer-max-w": "980px",
172
+ "amp-studio-theme-layout-flow-sidebar-w": "260px",
173
+ "amp-studio-theme-layout-flow-sidebar-rail-w": "44px",
174
+ "amp-studio-theme-layout-history-panel-w": "360px",
175
+ "amp-studio-theme-layout-variant-card-h": "580px",
176
+ "amp-studio-theme-layout-variant-card-w": "268px",
177
+ "amp-studio-theme-aspect-iphone-15-pro-max": "1 / 2.17",
178
+ "amp-studio-theme-aspect-iphone-15-pro": "1 / 2.17",
179
+ "amp-studio-theme-aspect-galaxy-s24": "1 / 2.17",
180
+ "amp-studio-theme-aspect-ipad-pro-13": "1 / 1.33",
181
+ "amp-studio-theme-aspect-ipad-air": "1 / 1.44",
182
+ "amp-studio-theme-aspect-apple-watch-ultra": "1 / 1.22",
183
+ "amp-studio-theme-aspect-apple-watch-9": "1 / 1.22",
184
+ "amp-studio-theme-aspect-mac": "1.6 / 1",
185
+ "amp-studio-theme-aspect-mac-1280": "1.6 / 1",
186
+ "amp-studio-theme-aspect-flow-thumb": "160 / 100",
165
187
  "amp-studio-theme-map-voice-pixel": "#7C3AED",
166
188
  "amp-studio-theme-map-voice-aria": "#F59E0B",
167
189
  "amp-studio-theme-map-voice-heimdall": "#3B82F6",
@@ -88,6 +88,9 @@
88
88
  --amp-studio-shadow-accent-sm: 0 1px 4px 0 rgba(101, 49, 255, 0.15);
89
89
  --amp-studio-shadow-accent-md: 0 4px 12px -2px rgba(101, 49, 255, 0.25);
90
90
  --amp-studio-shadow-accent-lg: 0 10px 25px -4px rgba(101, 49, 255, 0.35);
91
+ --amp-studio-shadow-ring-accent: 0 0 0 2px var(--amp-semantic-border-accent);
92
+ --amp-studio-shadow-composer: 0 -4px 12px -4px rgba(28, 25, 23, 0.08);
93
+ --amp-studio-shadow-device: 0 12px 32px -8px rgba(28, 25, 23, 0.18), 0 4px 12px -4px rgba(28, 25, 23, 0.10);
91
94
  --amp-studio-spacing-1: 4px;
92
95
  --amp-studio-spacing-2: 8px;
93
96
  --amp-studio-spacing-3: 12px;
@@ -154,6 +157,7 @@
154
157
  --amp-studio-semantic-status-error-bg: rgba(220, 38, 38, 0.08);
155
158
  --amp-studio-semantic-status-info: #2563EB;
156
159
  --amp-studio-semantic-status-info-bg: rgba(37, 99, 235, 0.08);
160
+ --amp-studio-semantic-color-info-soft: rgba(37, 99, 235, 0.08);
157
161
  --amp-studio-theme-color-bg: #FFFFFF;
158
162
  --amp-studio-theme-color-fg: #1C1917;
159
163
  --amp-studio-theme-color-muted: #57534E;
@@ -163,6 +167,24 @@
163
167
  --amp-studio-theme-layout-drawer-h: 48px;
164
168
  --amp-studio-theme-layout-drawer-h-open: 240px;
165
169
  --amp-studio-theme-layout-pane-left-w: 30%;
170
+ --amp-studio-theme-layout-topbar-h: 56px;
171
+ --amp-studio-theme-layout-thread-max-w: 1180px;
172
+ --amp-studio-theme-layout-composer-max-w: 980px;
173
+ --amp-studio-theme-layout-flow-sidebar-w: 260px;
174
+ --amp-studio-theme-layout-flow-sidebar-rail-w: 44px;
175
+ --amp-studio-theme-layout-history-panel-w: 360px;
176
+ --amp-studio-theme-layout-variant-card-h: 580px;
177
+ --amp-studio-theme-layout-variant-card-w: 268px;
178
+ --amp-studio-theme-aspect-iphone-15-pro-max: 1 / 2.17;
179
+ --amp-studio-theme-aspect-iphone-15-pro: 1 / 2.17;
180
+ --amp-studio-theme-aspect-galaxy-s24: 1 / 2.17;
181
+ --amp-studio-theme-aspect-ipad-pro-13: 1 / 1.33;
182
+ --amp-studio-theme-aspect-ipad-air: 1 / 1.44;
183
+ --amp-studio-theme-aspect-apple-watch-ultra: 1 / 1.22;
184
+ --amp-studio-theme-aspect-apple-watch-9: 1 / 1.22;
185
+ --amp-studio-theme-aspect-mac: 1.6 / 1;
186
+ --amp-studio-theme-aspect-mac-1280: 1.6 / 1;
187
+ --amp-studio-theme-aspect-flow-thumb: 160 / 100;
166
188
  --amp-studio-theme-map-voice-pixel: #7C3AED;
167
189
  --amp-studio-theme-map-voice-aria: #F59E0B;
168
190
  --amp-studio-theme-map-voice-heimdall: #3B82F6;
@@ -318,6 +340,9 @@
318
340
  --amp-studio-shadow-accent-sm: 0 1px 4px 0 rgba(101, 49, 255, 0.15);
319
341
  --amp-studio-shadow-accent-md: 0 4px 12px -2px rgba(101, 49, 255, 0.25);
320
342
  --amp-studio-shadow-accent-lg: 0 10px 25px -4px rgba(101, 49, 255, 0.35);
343
+ --amp-studio-shadow-ring-accent: 0 0 0 2px var(--amp-semantic-border-accent);
344
+ --amp-studio-shadow-composer: 0 -4px 12px -4px rgba(28, 25, 23, 0.08);
345
+ --amp-studio-shadow-device: 0 12px 32px -8px rgba(28, 25, 23, 0.18), 0 4px 12px -4px rgba(28, 25, 23, 0.10);
321
346
  --amp-studio-spacing-1: 4px;
322
347
  --amp-studio-spacing-2: 8px;
323
348
  --amp-studio-spacing-3: 12px;
@@ -384,6 +409,7 @@
384
409
  --amp-studio-semantic-status-error-bg: rgba(239, 68, 68, 0.12);
385
410
  --amp-studio-semantic-status-info: #3B82F6;
386
411
  --amp-studio-semantic-status-info-bg: rgba(59, 130, 246, 0.12);
412
+ --amp-studio-semantic-color-info-soft: rgba(59, 130, 246, 0.12);
387
413
  --amp-studio-theme-color-bg: #292524;
388
414
  --amp-studio-theme-color-fg: #E7E5E4;
389
415
  --amp-studio-theme-color-muted: #A8A29E;
@@ -393,6 +419,24 @@
393
419
  --amp-studio-theme-layout-drawer-h: 48px;
394
420
  --amp-studio-theme-layout-drawer-h-open: 240px;
395
421
  --amp-studio-theme-layout-pane-left-w: 30%;
422
+ --amp-studio-theme-layout-topbar-h: 56px;
423
+ --amp-studio-theme-layout-thread-max-w: 1180px;
424
+ --amp-studio-theme-layout-composer-max-w: 980px;
425
+ --amp-studio-theme-layout-flow-sidebar-w: 260px;
426
+ --amp-studio-theme-layout-flow-sidebar-rail-w: 44px;
427
+ --amp-studio-theme-layout-history-panel-w: 360px;
428
+ --amp-studio-theme-layout-variant-card-h: 580px;
429
+ --amp-studio-theme-layout-variant-card-w: 268px;
430
+ --amp-studio-theme-aspect-iphone-15-pro-max: 1 / 2.17;
431
+ --amp-studio-theme-aspect-iphone-15-pro: 1 / 2.17;
432
+ --amp-studio-theme-aspect-galaxy-s24: 1 / 2.17;
433
+ --amp-studio-theme-aspect-ipad-pro-13: 1 / 1.33;
434
+ --amp-studio-theme-aspect-ipad-air: 1 / 1.44;
435
+ --amp-studio-theme-aspect-apple-watch-ultra: 1 / 1.22;
436
+ --amp-studio-theme-aspect-apple-watch-9: 1 / 1.22;
437
+ --amp-studio-theme-aspect-mac: 1.6 / 1;
438
+ --amp-studio-theme-aspect-mac-1280: 1.6 / 1;
439
+ --amp-studio-theme-aspect-flow-thumb: 160 / 100;
396
440
  --amp-studio-theme-map-voice-pixel: #A855F7;
397
441
  --amp-studio-theme-map-voice-aria: #F59E0B;
398
442
  --amp-studio-theme-map-voice-heimdall: #3B82F6;
@@ -498,6 +542,9 @@
498
542
  --amp-studio-shadow-accent-sm: 0 1px 4px 0 rgba(101, 49, 255, 0.15);
499
543
  --amp-studio-shadow-accent-md: 0 4px 12px -2px rgba(101, 49, 255, 0.25);
500
544
  --amp-studio-shadow-accent-lg: 0 10px 25px -4px rgba(101, 49, 255, 0.35);
545
+ --amp-studio-shadow-ring-accent: 0 0 0 2px var(--amp-semantic-border-accent);
546
+ --amp-studio-shadow-composer: 0 -4px 12px -4px rgba(28, 25, 23, 0.08);
547
+ --amp-studio-shadow-device: 0 12px 32px -8px rgba(28, 25, 23, 0.18), 0 4px 12px -4px rgba(28, 25, 23, 0.10);
501
548
  --amp-studio-spacing-1: 4px;
502
549
  --amp-studio-spacing-2: 8px;
503
550
  --amp-studio-spacing-3: 12px;
@@ -564,6 +611,7 @@
564
611
  --amp-studio-semantic-status-error-bg: rgba(239, 68, 68, 0.12);
565
612
  --amp-studio-semantic-status-info: #3B82F6;
566
613
  --amp-studio-semantic-status-info-bg: rgba(59, 130, 246, 0.12);
614
+ --amp-studio-semantic-color-info-soft: rgba(59, 130, 246, 0.12);
567
615
  --amp-studio-theme-color-bg: #292524;
568
616
  --amp-studio-theme-color-fg: #E7E5E4;
569
617
  --amp-studio-theme-color-muted: #A8A29E;
@@ -573,6 +621,24 @@
573
621
  --amp-studio-theme-layout-drawer-h: 48px;
574
622
  --amp-studio-theme-layout-drawer-h-open: 240px;
575
623
  --amp-studio-theme-layout-pane-left-w: 30%;
624
+ --amp-studio-theme-layout-topbar-h: 56px;
625
+ --amp-studio-theme-layout-thread-max-w: 1180px;
626
+ --amp-studio-theme-layout-composer-max-w: 980px;
627
+ --amp-studio-theme-layout-flow-sidebar-w: 260px;
628
+ --amp-studio-theme-layout-flow-sidebar-rail-w: 44px;
629
+ --amp-studio-theme-layout-history-panel-w: 360px;
630
+ --amp-studio-theme-layout-variant-card-h: 580px;
631
+ --amp-studio-theme-layout-variant-card-w: 268px;
632
+ --amp-studio-theme-aspect-iphone-15-pro-max: 1 / 2.17;
633
+ --amp-studio-theme-aspect-iphone-15-pro: 1 / 2.17;
634
+ --amp-studio-theme-aspect-galaxy-s24: 1 / 2.17;
635
+ --amp-studio-theme-aspect-ipad-pro-13: 1 / 1.33;
636
+ --amp-studio-theme-aspect-ipad-air: 1 / 1.44;
637
+ --amp-studio-theme-aspect-apple-watch-ultra: 1 / 1.22;
638
+ --amp-studio-theme-aspect-apple-watch-9: 1 / 1.22;
639
+ --amp-studio-theme-aspect-mac: 1.6 / 1;
640
+ --amp-studio-theme-aspect-mac-1280: 1.6 / 1;
641
+ --amp-studio-theme-aspect-flow-thumb: 160 / 100;
576
642
  --amp-studio-theme-map-voice-pixel: #A855F7;
577
643
  --amp-studio-theme-map-voice-aria: #F59E0B;
578
644
  --amp-studio-theme-map-voice-heimdall: #3B82F6;
@@ -87,6 +87,9 @@ $amp-studio-shadow-lg-dark: 0 8px 24px rgba(0, 0, 0, 0.4);
87
87
  $amp-studio-shadow-accent-sm: 0 1px 4px 0 rgba(101, 49, 255, 0.15);
88
88
  $amp-studio-shadow-accent-md: 0 4px 12px -2px rgba(101, 49, 255, 0.25);
89
89
  $amp-studio-shadow-accent-lg: 0 10px 25px -4px rgba(101, 49, 255, 0.35);
90
+ $amp-studio-shadow-ring-accent: 0 0 0 2px var(--amp-semantic-border-accent);
91
+ $amp-studio-shadow-composer: 0 -4px 12px -4px rgba(28, 25, 23, 0.08);
92
+ $amp-studio-shadow-device: 0 12px 32px -8px rgba(28, 25, 23, 0.18), 0 4px 12px -4px rgba(28, 25, 23, 0.10);
90
93
  $amp-studio-spacing-1: 4px;
91
94
  $amp-studio-spacing-2: 8px;
92
95
  $amp-studio-spacing-3: 12px;
@@ -153,6 +156,7 @@ $amp-studio-semantic-status-error: #DC2626;
153
156
  $amp-studio-semantic-status-error-bg: rgba(220, 38, 38, 0.08);
154
157
  $amp-studio-semantic-status-info: #2563EB;
155
158
  $amp-studio-semantic-status-info-bg: rgba(37, 99, 235, 0.08);
159
+ $amp-studio-semantic-color-info-soft: rgba(37, 99, 235, 0.08);
156
160
  $amp-studio-theme-color-bg: #FFFFFF;
157
161
  $amp-studio-theme-color-fg: #1C1917;
158
162
  $amp-studio-theme-color-muted: #57534E;
@@ -162,6 +166,24 @@ $amp-studio-theme-layout-toolbar-h: 56px;
162
166
  $amp-studio-theme-layout-drawer-h: 48px;
163
167
  $amp-studio-theme-layout-drawer-h-open: 240px;
164
168
  $amp-studio-theme-layout-pane-left-w: 30%;
169
+ $amp-studio-theme-layout-topbar-h: 56px;
170
+ $amp-studio-theme-layout-thread-max-w: 1180px;
171
+ $amp-studio-theme-layout-composer-max-w: 980px;
172
+ $amp-studio-theme-layout-flow-sidebar-w: 260px;
173
+ $amp-studio-theme-layout-flow-sidebar-rail-w: 44px;
174
+ $amp-studio-theme-layout-history-panel-w: 360px;
175
+ $amp-studio-theme-layout-variant-card-h: 580px;
176
+ $amp-studio-theme-layout-variant-card-w: 268px;
177
+ $amp-studio-theme-aspect-iphone-15-pro-max: 1 / 2.17;
178
+ $amp-studio-theme-aspect-iphone-15-pro: 1 / 2.17;
179
+ $amp-studio-theme-aspect-galaxy-s24: 1 / 2.17;
180
+ $amp-studio-theme-aspect-ipad-pro-13: 1 / 1.33;
181
+ $amp-studio-theme-aspect-ipad-air: 1 / 1.44;
182
+ $amp-studio-theme-aspect-apple-watch-ultra: 1 / 1.22;
183
+ $amp-studio-theme-aspect-apple-watch-9: 1 / 1.22;
184
+ $amp-studio-theme-aspect-mac: 1.6 / 1;
185
+ $amp-studio-theme-aspect-mac-1280: 1.6 / 1;
186
+ $amp-studio-theme-aspect-flow-thumb: 160 / 100;
165
187
  $amp-studio-theme-map-voice-pixel: #7C3AED;
166
188
  $amp-studio-theme-map-voice-aria: #F59E0B;
167
189
  $amp-studio-theme-map-voice-heimdall: #3B82F6;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@amplify-ai/tokens-studio",
3
- "version": "1.0.2",
3
+ "version": "1.0.3",
4
4
  "description": "Amplify Magic Studio design tokens — Studio cockpit chrome, mirror/Map-mode voices, status scale; consumed only by studio.amplify.club",
5
5
  "main": "dist/tokens.js",
6
6
  "exports": {
@@ -13,10 +13,32 @@
13
13
  },
14
14
  "layout": {
15
15
  "$type": "dimension",
16
- "toolbar-h": { "$value": "56px" },
17
- "drawer-h": { "$value": "48px" },
18
- "drawer-h-open": { "$value": "240px" },
19
- "pane-left-w": { "$value": "30%" }
16
+ "toolbar-h": { "$value": "56px" },
17
+ "drawer-h": { "$value": "48px" },
18
+ "drawer-h-open": { "$value": "240px" },
19
+ "pane-left-w": { "$value": "30%" },
20
+ "topbar-h": { "$value": "56px", "$description": "Studio v0 cockpit top bar height (Option D mockup)" },
21
+ "thread-max-w": { "$value": "1180px", "$description": "Studio v0 cockpit thread / main column max width" },
22
+ "composer-max-w": { "$value": "980px", "$description": "Studio v0 sticky composer max width" },
23
+ "flow-sidebar-w": { "$value": "260px", "$description": "Studio v0 flow sidebar expanded width" },
24
+ "flow-sidebar-rail-w":{ "$value": "44px", "$description": "Studio v0 flow sidebar collapsed rail width" },
25
+ "history-panel-w": { "$value": "360px", "$description": "Studio v0 history / runs panel width" },
26
+ "variant-card-h": { "$value": "580px", "$description": "Studio v0 variant card height" },
27
+ "variant-card-w": { "$value": "268px", "$description": "Studio v0 variant card width" }
28
+ },
29
+ "aspect": {
30
+ "$type": "dimension",
31
+ "$description": "Studio v0 device-frame aspect ratios for variant previews (Option D mockup) — values identical across themes",
32
+ "iphone-15-pro-max": { "$value": "1 / 2.17" },
33
+ "iphone-15-pro": { "$value": "1 / 2.17" },
34
+ "galaxy-s24": { "$value": "1 / 2.17" },
35
+ "ipad-pro-13": { "$value": "1 / 1.33" },
36
+ "ipad-air": { "$value": "1 / 1.44" },
37
+ "apple-watch-ultra": { "$value": "1 / 1.22" },
38
+ "apple-watch-9": { "$value": "1 / 1.22" },
39
+ "mac": { "$value": "1.6 / 1" },
40
+ "mac-1280": { "$value": "1.6 / 1" },
41
+ "flow-thumb": { "$value": "160 / 100" }
20
42
  },
21
43
  "map": {
22
44
  "$type": "color",
@@ -13,10 +13,32 @@
13
13
  },
14
14
  "layout": {
15
15
  "$type": "dimension",
16
- "toolbar-h": { "$value": "56px", "$description": "Top toolbar chrome height — paired with --studio-toolbar-h" },
17
- "drawer-h": { "$value": "48px", "$description": "Bottom drawer collapsed height — paired with --studio-drawer-h" },
18
- "drawer-h-open": { "$value": "240px", "$description": "Bottom drawer expanded height — paired with --studio-drawer-h-open" },
19
- "pane-left-w": { "$value": "30%", "$description": "Left brief pane width — paired with --studio-pane-left-w" }
16
+ "toolbar-h": { "$value": "56px", "$description": "Top toolbar chrome height — paired with --studio-toolbar-h" },
17
+ "drawer-h": { "$value": "48px", "$description": "Bottom drawer collapsed height — paired with --studio-drawer-h" },
18
+ "drawer-h-open": { "$value": "240px", "$description": "Bottom drawer expanded height — paired with --studio-drawer-h-open" },
19
+ "pane-left-w": { "$value": "30%", "$description": "Left brief pane width — paired with --studio-pane-left-w" },
20
+ "topbar-h": { "$value": "56px", "$description": "Studio v0 cockpit top bar height (Option D mockup)" },
21
+ "thread-max-w": { "$value": "1180px", "$description": "Studio v0 cockpit thread / main column max width (Option D mockup)" },
22
+ "composer-max-w": { "$value": "980px", "$description": "Studio v0 sticky composer max width (Option D mockup)" },
23
+ "flow-sidebar-w": { "$value": "260px", "$description": "Studio v0 flow sidebar expanded width (Option D mockup)" },
24
+ "flow-sidebar-rail-w":{ "$value": "44px", "$description": "Studio v0 flow sidebar collapsed rail width (Option D mockup)" },
25
+ "history-panel-w": { "$value": "360px", "$description": "Studio v0 history / runs panel width (Option D mockup)" },
26
+ "variant-card-h": { "$value": "580px", "$description": "Studio v0 variant card height (Option D mockup)" },
27
+ "variant-card-w": { "$value": "268px", "$description": "Studio v0 variant card width (Option D mockup)" }
28
+ },
29
+ "aspect": {
30
+ "$type": "dimension",
31
+ "$description": "Studio v0 device-frame aspect ratios for variant previews (Option D mockup)",
32
+ "iphone-15-pro-max": { "$value": "1 / 2.17", "$description": "iPhone 15 Pro Max device frame aspect" },
33
+ "iphone-15-pro": { "$value": "1 / 2.17", "$description": "iPhone 15 Pro device frame aspect" },
34
+ "galaxy-s24": { "$value": "1 / 2.17", "$description": "Samsung Galaxy S24 device frame aspect" },
35
+ "ipad-pro-13": { "$value": "1 / 1.33", "$description": "iPad Pro 13\" device frame aspect" },
36
+ "ipad-air": { "$value": "1 / 1.44", "$description": "iPad Air device frame aspect" },
37
+ "apple-watch-ultra": { "$value": "1 / 1.22", "$description": "Apple Watch Ultra device frame aspect" },
38
+ "apple-watch-9": { "$value": "1 / 1.22", "$description": "Apple Watch Series 9 device frame aspect" },
39
+ "mac": { "$value": "1.6 / 1", "$description": "MacBook / desktop landscape aspect" },
40
+ "mac-1280": { "$value": "1.6 / 1", "$description": "MacBook / desktop 1280-wide aspect" },
41
+ "flow-thumb": { "$value": "160 / 100", "$description": "Flow thumbnail aspect (Studio v0 cockpit)" }
20
42
  },
21
43
  "map": {
22
44
  "$type": "color",