@mailwoman/react 9.3.0 → 9.4.0

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 (159) hide show
  1. package/fonts.css +59 -0
  2. package/lib/common/About.tsx +89 -0
  3. package/lib/common/KindBadge.tsx +2 -7
  4. package/lib/common/confidence-tiers.ts +50 -0
  5. package/lib/common/text-tokens.ts +88 -0
  6. package/lib/index.ts +30 -28
  7. package/lib/map/CompareToggle.tsx +2 -2
  8. package/lib/map/{GeocoderDemo.tsx → Geocoder.tsx} +40 -40
  9. package/lib/map/{DemoControls.tsx → GeocoderControls.tsx} +16 -17
  10. package/lib/map/{DemoMap.tsx → MapCanvas.tsx} +15 -15
  11. package/lib/map/PlaceMarker.tsx +1 -1
  12. package/lib/map/ResolvedPlaceLayers.tsx +3 -3
  13. package/lib/map/ResultCamera.tsx +1 -1
  14. package/lib/map/ResultPanel.tsx +2 -2
  15. package/lib/map/VersionPicker.tsx +3 -3
  16. package/lib/map/fake-runtime.ts +122 -0
  17. package/lib/map/index.ts +16 -16
  18. package/lib/map/map-debug.ts +51 -0
  19. package/lib/map/place-render.ts +3 -2
  20. package/lib/map/types.ts +41 -39
  21. package/lib/map/{useDemoGeocode.ts → useGeocode.ts} +8 -8
  22. package/lib/pipeline/CandidatePicker.tsx +1 -1
  23. package/lib/pipeline/ComponentTable.tsx +1 -2
  24. package/lib/pipeline/ConfidenceCell.tsx +7 -19
  25. package/lib/pipeline/FailureDiagnostic.tsx +56 -0
  26. package/lib/pipeline/ResolvedPlace.tsx +17 -4
  27. package/lib/pipeline/SpanHighlight.tsx +97 -0
  28. package/lib/pipeline/TimingPanel.tsx +65 -0
  29. package/lib/pipeline/TreeView.tsx +55 -0
  30. package/lib/pipeline/copy.ts +1 -1
  31. package/lib/pipeline/types.ts +2 -75
  32. package/lib/pipeline/useParsePipeline.ts +2 -1
  33. package/lib/poi/types.ts +2 -1
  34. package/lib/runtime/{useDemoRuntime.ts → useReleaseRuntime.ts} +22 -24
  35. package/out/common/About.d.ts +12 -0
  36. package/out/common/About.d.ts.map +1 -0
  37. package/out/common/About.js +5 -0
  38. package/out/common/About.js.map +1 -0
  39. package/out/common/KindBadge.d.ts +2 -9
  40. package/out/common/KindBadge.d.ts.map +1 -1
  41. package/out/common/KindBadge.js.map +1 -1
  42. package/out/common/confidence-tiers.d.ts +36 -0
  43. package/out/common/confidence-tiers.d.ts.map +1 -0
  44. package/out/common/confidence-tiers.js +42 -0
  45. package/out/common/confidence-tiers.js.map +1 -0
  46. package/out/common/text-tokens.d.ts +46 -0
  47. package/out/common/text-tokens.d.ts.map +1 -0
  48. package/out/common/text-tokens.js +52 -0
  49. package/out/common/text-tokens.js.map +1 -0
  50. package/out/index.d.ts +14 -5
  51. package/out/index.d.ts.map +1 -1
  52. package/out/index.js +8 -2
  53. package/out/index.js.map +1 -1
  54. package/out/map/CompareToggle.d.ts +2 -2
  55. package/out/map/CompareToggle.d.ts.map +1 -1
  56. package/out/map/{GeocoderDemo.d.ts → Geocoder.d.ts} +17 -17
  57. package/out/map/Geocoder.d.ts.map +1 -0
  58. package/out/map/{GeocoderDemo.js → Geocoder.js} +25 -25
  59. package/out/map/Geocoder.js.map +1 -0
  60. package/out/map/{DemoControls.d.ts → GeocoderControls.d.ts} +16 -17
  61. package/out/map/GeocoderControls.d.ts.map +1 -0
  62. package/out/map/{DemoControls.js → GeocoderControls.js} +2 -2
  63. package/out/map/GeocoderControls.js.map +1 -0
  64. package/out/map/{DemoMap.d.ts → MapCanvas.d.ts} +15 -15
  65. package/out/map/MapCanvas.d.ts.map +1 -0
  66. package/out/map/{DemoMap.js → MapCanvas.js} +2 -2
  67. package/out/map/MapCanvas.js.map +1 -0
  68. package/out/map/PlaceMarker.d.ts +1 -1
  69. package/out/map/ResolvedPlaceLayers.d.ts +3 -3
  70. package/out/map/ResultCamera.d.ts +1 -1
  71. package/out/map/ResultCamera.js +1 -1
  72. package/out/map/ResultPanel.d.ts +2 -2
  73. package/out/map/ResultPanel.d.ts.map +1 -1
  74. package/out/map/ResultPanel.js.map +1 -1
  75. package/out/map/VersionPicker.d.ts +3 -3
  76. package/out/map/VersionPicker.d.ts.map +1 -1
  77. package/out/map/fake-runtime.d.ts +38 -0
  78. package/out/map/fake-runtime.d.ts.map +1 -0
  79. package/out/map/fake-runtime.js +107 -0
  80. package/out/map/fake-runtime.js.map +1 -0
  81. package/out/map/index.d.ts +10 -10
  82. package/out/map/index.d.ts.map +1 -1
  83. package/out/map/index.js +6 -6
  84. package/out/map/index.js.map +1 -1
  85. package/out/map/map-debug.d.ts +31 -0
  86. package/out/map/map-debug.d.ts.map +1 -0
  87. package/out/map/map-debug.js +31 -0
  88. package/out/map/map-debug.js.map +1 -0
  89. package/out/map/place-render.d.ts +2 -2
  90. package/out/map/place-render.d.ts.map +1 -1
  91. package/out/map/place-render.js +1 -1
  92. package/out/map/place-render.js.map +1 -1
  93. package/out/map/types.d.ts +41 -39
  94. package/out/map/types.d.ts.map +1 -1
  95. package/out/map/types.js +5 -5
  96. package/out/map/{useDemoGeocode.d.ts → useGeocode.d.ts} +9 -9
  97. package/out/map/useGeocode.d.ts.map +1 -0
  98. package/out/map/{useDemoGeocode.js → useGeocode.js} +4 -4
  99. package/out/map/useGeocode.js.map +1 -0
  100. package/out/pipeline/CandidatePicker.d.ts +1 -1
  101. package/out/pipeline/CandidatePicker.d.ts.map +1 -1
  102. package/out/pipeline/CandidatePicker.js.map +1 -1
  103. package/out/pipeline/ComponentTable.d.ts +1 -1
  104. package/out/pipeline/ComponentTable.d.ts.map +1 -1
  105. package/out/pipeline/ComponentTable.js.map +1 -1
  106. package/out/pipeline/ConfidenceCell.d.ts +2 -2
  107. package/out/pipeline/ConfidenceCell.d.ts.map +1 -1
  108. package/out/pipeline/ConfidenceCell.js +4 -16
  109. package/out/pipeline/ConfidenceCell.js.map +1 -1
  110. package/out/pipeline/FailureDiagnostic.d.ts +15 -0
  111. package/out/pipeline/FailureDiagnostic.d.ts.map +1 -0
  112. package/out/pipeline/FailureDiagnostic.js +21 -0
  113. package/out/pipeline/FailureDiagnostic.js.map +1 -0
  114. package/out/pipeline/ResolvedPlace.d.ts +1 -1
  115. package/out/pipeline/ResolvedPlace.d.ts.map +1 -1
  116. package/out/pipeline/ResolvedPlace.js +4 -10
  117. package/out/pipeline/ResolvedPlace.js.map +1 -1
  118. package/out/pipeline/SpanHighlight.d.ts +23 -0
  119. package/out/pipeline/SpanHighlight.d.ts.map +1 -0
  120. package/out/pipeline/SpanHighlight.js +31 -0
  121. package/out/pipeline/SpanHighlight.js.map +1 -0
  122. package/out/pipeline/TimingPanel.d.ts +16 -0
  123. package/out/pipeline/TimingPanel.d.ts.map +1 -0
  124. package/out/pipeline/TimingPanel.js +20 -0
  125. package/out/pipeline/TimingPanel.js.map +1 -0
  126. package/out/pipeline/TreeView.d.ts +17 -0
  127. package/out/pipeline/TreeView.d.ts.map +1 -0
  128. package/out/pipeline/TreeView.js +15 -0
  129. package/out/pipeline/TreeView.js.map +1 -0
  130. package/out/pipeline/copy.d.ts +1 -1
  131. package/out/pipeline/copy.d.ts.map +1 -1
  132. package/out/pipeline/types.d.ts +2 -68
  133. package/out/pipeline/types.d.ts.map +1 -1
  134. package/out/pipeline/types.js +1 -1
  135. package/out/pipeline/useParsePipeline.d.ts +2 -1
  136. package/out/pipeline/useParsePipeline.d.ts.map +1 -1
  137. package/out/pipeline/useParsePipeline.js.map +1 -1
  138. package/out/poi/types.d.ts +2 -1
  139. package/out/poi/types.d.ts.map +1 -1
  140. package/out/runtime/{useDemoRuntime.d.ts → useReleaseRuntime.d.ts} +18 -20
  141. package/out/runtime/useReleaseRuntime.d.ts.map +1 -0
  142. package/out/runtime/{useDemoRuntime.js → useReleaseRuntime.js} +4 -4
  143. package/out/runtime/useReleaseRuntime.js.map +1 -0
  144. package/package.json +139 -29
  145. package/styleframe.config.ts +321 -0
  146. package/styles.css +1074 -664
  147. package/tokens/index.css +115 -0
  148. package/tokens/tokens.json +521 -0
  149. package/tokens/tokens.resolver.json +185 -0
  150. package/out/map/DemoControls.d.ts.map +0 -1
  151. package/out/map/DemoControls.js.map +0 -1
  152. package/out/map/DemoMap.d.ts.map +0 -1
  153. package/out/map/DemoMap.js.map +0 -1
  154. package/out/map/GeocoderDemo.d.ts.map +0 -1
  155. package/out/map/GeocoderDemo.js.map +0 -1
  156. package/out/map/useDemoGeocode.d.ts.map +0 -1
  157. package/out/map/useDemoGeocode.js.map +0 -1
  158. package/out/runtime/useDemoRuntime.d.ts.map +0 -1
  159. package/out/runtime/useDemoRuntime.js.map +0 -1
package/styleframe.config.ts ADDED
@@ -0,0 +1,321 @@
1
+ /**
2
+ * @copyright Sister Software
3
+ * @license AGPL-3.0
4
+ * @author Teffen Ellis, et al.
5
+ *
6
+ * The design tokens every consumer of `@mailwoman/react` reads. This file is the source of record; `tokens.css` is
7
+ * its compiled output and is generated, never hand-edited. `styleframe dtcg export` publishes the same values as
8
+ * W3C DTCG JSON for Figma and any other tool — DTCG is the interchange format here, not the input, because
9
+ * `styleframe dtcg import` is a one-shot code generator rather than a build step.
10
+ *
11
+ * THREE LAYERS, and a component rule may read only the middle one. Primitives are raw values with no opinion about
12
+ * use; semantics say what a value is FOR; the few component tokens exist where a component needs a name of its own.
13
+ * `styles.css` reading raw primitives is the defect this file replaces: it read 22 Infima names it did not own, and
14
+ * eight of them were undefined in production, so those rules silently took Infima's LIGHT fallbacks inside a dark
15
+ * app.
16
+ *
17
+ * THEMES. Light is the docs site; dark is the three map apps, which set `data-theme="dark"` on `<html>` themselves.
18
+ * Every semantic token is defined in both, so a value can never resolve to nothing.
19
+ */
20
+
21
+ import { styleframe } from "styleframe"
22
+
23
+ const s = styleframe({
24
+ themes: {
25
+ // The apps and the docs toggle both address a theme by attribute rather than by class.
26
+ selector: ({ name }) => `[data-theme="${name}"]`,
27
+ },
28
+ })
29
+
30
+ const { variable, theme, ref } = s
31
+
32
+ //#region Primitives
33
+
34
+ /*
35
+ * Raw values with no opinion about use. Only the semantic layer below may reference them; a component rule that
36
+ * reaches one has skipped the layer that says what the value is for.
37
+ */
38
+
39
+ /**
40
+ * The brand anchors, carried verbatim from the design system. `#ff00b0` is the primary; Earth shipped a drifted
41
+ * `#e0367c` for as long as it read Infima's palette, and that value is retired.
42
+ */
43
+ const brandMagenta = variable("brand-magenta", "#ff00b0")
44
+ const brandBlue = variable("brand-blue", "#1a00ff")
45
+ const brandNavy = variable("brand-navy", "#00093a")
46
+ const brandAmber = variable("brand-amber", "hsl(39deg 100% 50%)")
47
+ const brandTeal = variable("brand-teal", "hsl(97.78deg 100% 50%)")
48
+
49
+ /**
50
+ * Neutrals in OKLCH so the lightness steps are perceptually even rather than even in sRGB, where a mid-grey reads
51
+ * darker than its number. One hue for the whole ramp keeps chrome from drifting warm at one end and cool at the other.
52
+ */
53
+ const neutral0 = variable("neutral-0", "oklch(100% 0 264)")
54
+ const neutral50 = variable("neutral-50", "oklch(97% 0.004 264)")
55
+ const neutral100 = variable("neutral-100", "oklch(93% 0.006 264)")
56
+ const neutral200 = variable("neutral-200", "oklch(87% 0.01 264)")
57
+ const neutral300 = variable("neutral-300", "oklch(78% 0.015 264)")
58
+ const neutral400 = variable("neutral-400", "oklch(66% 0.02 264)")
59
+ const neutral500 = variable("neutral-500", "oklch(55% 0.024 264)")
60
+ const neutral600 = variable("neutral-600", "oklch(45% 0.026 264)")
61
+ const neutral700 = variable("neutral-700", "oklch(35% 0.028 264)")
62
+ const neutral800 = variable("neutral-800", "oklch(26% 0.028 264)")
63
+ const neutral900 = variable("neutral-900", "oklch(18% 0.026 264)")
64
+ const neutral950 = variable("neutral-950", "oklch(12% 0.022 264)")
65
+ const neutral1000 = variable("neutral-1000", "oklch(0% 0 264)")
66
+
67
+ /**
68
+ * State hues. Each carries a strong value for text and marks, and a tint for the background behind them.
69
+ */
70
+ const successBase = variable("success-base", "oklch(62% 0.15 150)")
71
+ const warningBase = variable("warning-base", "oklch(75% 0.15 75)")
72
+ const dangerBase = variable("danger-base", "oklch(58% 0.2 25)")
73
+ const infoBase = variable("info-base", "oklch(65% 0.13 230)")
74
+
75
+ //#endregion
76
+
77
+ //#region Type
78
+
79
+ /*
80
+ * Two axes. A rule names a scale role; a scale role names a face role; only a face role names a family.
81
+ */
82
+
83
+ /**
84
+ * Swapping the typeface edits these five and nothing else. Each role states what any face bound to it must do: `number`
85
+ * needs tabular lining figures so a column of coordinates holds its width as it updates; `code` needs `0` and `O`, `1`
86
+ * and `l` to be told apart; `glyph` needs monochrome marks that sit on the text baseline.
87
+ */
88
+ const fontFamilyDisplay = variable("font-family-display", `"Iosevka Nexus Web", "Iosevka", system-ui, sans-serif`)
89
+ const fontFamilyText = variable("font-family-text", `"Iosevka Nexus Web", "Iosevka", system-ui, sans-serif`)
90
+ const fontFamilyNumber = variable("font-family-number", `"Iosevka Nexus Web", "Iosevka", system-ui, sans-serif`)
91
+
92
+ const fontFamilyCode = variable(
93
+ "font-family-code",
94
+ `"Iosevka Nexus Mono Web", "Iosevka", ui-monospace, "SF Mono", monospace`
95
+ )
96
+
97
+ const fontFamilyGlyph = variable("font-family-glyph", `"Iosevka Nexus Mono Web", "Iosevka", ui-monospace, monospace`)
98
+
99
+ /**
100
+ * A map label is drawn by MapLibre from a signed-distance-field range rather than by the browser from a `@font-face`,
101
+ * so the DOM faces above cannot reach the globe. This names the SDF stack, and its value must be one the glyph host
102
+ * serves — today `Noto Sans Regular`, `Noto Sans Medium` or `Noto Sans Italic`.
103
+ */
104
+ const fontFamilyMap = variable("font-family-map", `"Noto Sans Regular"`)
105
+
106
+ const fontSizeDisplay = variable("font-size-display", "2.125rem")
107
+ const fontSizeTitle = variable("font-size-title", "1.375rem")
108
+ const fontSizeHeadline = variable("font-size-headline", "1.0625rem")
109
+ const fontSizeBody = variable("font-size-body", "1.0625rem")
110
+ const fontSizeCallout = variable("font-size-callout", "1rem")
111
+ const fontSizeSubheadline = variable("font-size-subheadline", "0.9375rem")
112
+ const fontSizeFootnote = variable("font-size-footnote", "0.8125rem")
113
+ const fontSizeCaption = variable("font-size-caption", "0.75rem")
114
+
115
+ const lineHeightTight = variable("line-height-tight", "1.2")
116
+ const lineHeightBody = variable("line-height-body", "1.45")
117
+
118
+ const fontWeightRegular = variable("font-weight-regular", "400")
119
+ const fontWeightMedium = variable("font-weight-medium", "500")
120
+ const fontWeightSemibold = variable("font-weight-semibold", "600")
121
+
122
+ //#endregion
123
+
124
+ //#region Shape and motion
125
+
126
+ const radiusControl = variable("radius-control", "0.5rem")
127
+ const radiusPanel = variable("radius-panel", "0.875rem")
128
+ const radiusSheet = variable("radius-sheet", "0.875rem")
129
+ const radiusPill = variable("radius-pill", "999px")
130
+
131
+ const durationFast = variable("duration-fast", "120ms")
132
+ const durationStandard = variable("duration-standard", "220ms")
133
+ const durationSheet = variable("duration-sheet", "320ms")
134
+ const easingStandard = variable("easing-standard", "cubic-bezier(0.4, 0, 0.2, 1)")
135
+ const easingDecelerate = variable("easing-decelerate", "cubic-bezier(0, 0, 0.2, 1)")
136
+
137
+ /**
138
+ * Safe-area insets belong to the chrome, not to each component that happens to sit near an edge. They stay CSS
139
+ * expressions because `env()` resolves per device and has no static value.
140
+ */
141
+ variable("safe-area-top", "env(safe-area-inset-top, 0px)")
142
+ variable("safe-area-right", "env(safe-area-inset-right, 0px)")
143
+ variable("safe-area-bottom", "env(safe-area-inset-bottom, 0px)")
144
+ variable("safe-area-left", "env(safe-area-inset-left, 0px)")
145
+
146
+ //#endregion
147
+
148
+ //#region Semantics
149
+
150
+ /*
151
+ * The one layer a component rule may read. Every token here is defined in light and overridden in dark, so a value
152
+ * can never resolve to nothing the way eight Infima names did in production.
153
+ */
154
+
155
+ const backgroundCanvas = variable("color-background-canvas", ref(neutral50))
156
+ const backgroundRaised = variable("color-background-raised", ref(neutral0))
157
+ const backgroundSunken = variable("color-background-sunken", ref(neutral100))
158
+
159
+ const textPrimary = variable("color-text-primary", ref(neutral900))
160
+ const textSecondary = variable("color-text-secondary", ref(neutral600))
161
+ const textTertiary = variable("color-text-tertiary", ref(neutral500))
162
+
163
+ const separator = variable("color-separator", ref(neutral200))
164
+ const accent = variable("color-accent", ref(brandMagenta))
165
+ const accentContrast = variable("color-accent-contrast", ref(neutral0))
166
+ const selection = variable("color-selection", ref(brandMagenta))
167
+
168
+ const controlBackground = variable("control-background", ref(neutral100))
169
+ const controlBackgroundPressed = variable("control-background-pressed", ref(neutral200))
170
+ const controlForeground = variable("control-foreground", ref(neutral900))
171
+ const controlBorder = variable("control-border", ref(neutral300))
172
+
173
+ /**
174
+ * Every state colour carries a paired tint for the ground behind it. The eight names that were undefined in production
175
+ * were all of this shape — a foreground whose background partner was missing.
176
+ */
177
+ const stateSuccess = variable("color-state-success", ref(successBase))
178
+ const stateSuccessBackground = variable("color-state-success-background", "oklch(62% 0.15 150 / 0.14)")
179
+ const stateWarning = variable("color-state-warning", ref(warningBase))
180
+ const stateWarningBackground = variable("color-state-warning-background", "oklch(75% 0.15 75 / 0.16)")
181
+ const stateDanger = variable("color-state-danger", ref(dangerBase))
182
+ const stateDangerBackground = variable("color-state-danger-background", "oklch(58% 0.2 25 / 0.14)")
183
+ const stateInfo = variable("color-state-info", ref(infoBase))
184
+ const stateInfoBackground = variable("color-state-info-background", "oklch(65% 0.13 230 / 0.14)")
185
+
186
+ const accentBackground = variable("color-accent-background", "oklch(65% 0.29 340 / 0.14)")
187
+
188
+ //#endregion
189
+
190
+ //#region Material
191
+
192
+ /*
193
+ * Glass is a composition of background, border, blur, saturation, shadow and highlight — never one background
194
+ * colour, because the parts respond differently to the ground behind them.
195
+ */
196
+
197
+ const glassBackground = variable("material-glass-background", "oklch(100% 0 264 / 0.72)")
198
+ const glassBorder = variable("material-glass-border", "oklch(0% 0 264 / 0.1)")
199
+ const glassBlur = variable("material-glass-blur", "24px")
200
+ const glassSaturation = variable("material-glass-saturation", "180%")
201
+ const glassShadow = variable("material-glass-shadow", "0 4px 28px oklch(0% 0 264 / 0.14)")
202
+ const glassHighlight = variable("material-glass-highlight", "oklch(100% 0 264 / 0.5)")
203
+
204
+ /**
205
+ * What the material becomes where `backdrop-filter` is unavailable or the viewer asks for less transparency. It is
206
+ * opaque on purpose: no control may depend on the blur to stay readable.
207
+ */
208
+ const glassFallbackBackground = variable("material-glass-fallback-background", ref(neutral0))
209
+
210
+ //#endregion
211
+
212
+ //#region Dark theme — the three map apps, and the docs toggle.
213
+
214
+ theme("dark", ({ variable: themeVariable }) => {
215
+ themeVariable(backgroundCanvas, ref(neutral950))
216
+ themeVariable(backgroundRaised, ref(neutral900))
217
+ themeVariable(backgroundSunken, ref(neutral1000))
218
+
219
+ themeVariable(textPrimary, ref(neutral100))
220
+ themeVariable(textSecondary, ref(neutral400))
221
+ themeVariable(textTertiary, ref(neutral500))
222
+
223
+ themeVariable(separator, "oklch(100% 0 264 / 0.12)")
224
+ themeVariable(accentContrast, ref(neutral1000))
225
+
226
+ themeVariable(controlBackground, "oklch(100% 0 264 / 0.08)")
227
+ themeVariable(controlBackgroundPressed, "oklch(100% 0 264 / 0.14)")
228
+ themeVariable(controlForeground, ref(neutral100))
229
+ themeVariable(controlBorder, "oklch(100% 0 264 / 0.16)")
230
+
231
+ // The state hues lift in a dark ground: the same hue at higher lightness reads at the same strength.
232
+ themeVariable(stateSuccess, "oklch(76% 0.16 150)")
233
+ themeVariable(stateSuccessBackground, "oklch(76% 0.16 150 / 0.18)")
234
+ themeVariable(stateWarning, "oklch(84% 0.15 75)")
235
+ themeVariable(stateWarningBackground, "oklch(84% 0.15 75 / 0.18)")
236
+ themeVariable(stateDanger, "oklch(70% 0.19 25)")
237
+ themeVariable(stateDangerBackground, "oklch(70% 0.19 25 / 0.18)")
238
+ themeVariable(stateInfo, "oklch(78% 0.12 230)")
239
+ themeVariable(stateInfoBackground, "oklch(78% 0.12 230 / 0.18)")
240
+ themeVariable(accentBackground, "oklch(65% 0.29 340 / 0.18)")
241
+
242
+ themeVariable(glassBackground, "oklch(18% 0.026 264 / 0.72)")
243
+ themeVariable(glassBorder, "oklch(100% 0 264 / 0.14)")
244
+ themeVariable(glassShadow, "0 4px 28px oklch(0% 0 264 / 0.45)")
245
+ themeVariable(glassHighlight, "oklch(100% 0 264 / 0.12)")
246
+ themeVariable(glassFallbackBackground, ref(neutral900))
247
+ })
248
+
249
+ //#endregion
250
+
251
+ // Referenced by name from `styles.css` and the app stylesheets; listed here so the compiler keeps them.
252
+ void [
253
+ brandBlue,
254
+ brandNavy,
255
+ brandAmber,
256
+ brandTeal,
257
+ neutral700,
258
+ neutral800,
259
+ fontFamilyDisplay,
260
+ fontFamilyText,
261
+ fontFamilyNumber,
262
+ fontFamilyCode,
263
+ fontFamilyGlyph,
264
+ fontFamilyMap,
265
+ fontSizeDisplay,
266
+ fontSizeTitle,
267
+ fontSizeHeadline,
268
+ fontSizeBody,
269
+ fontSizeCallout,
270
+ fontSizeSubheadline,
271
+ fontSizeFootnote,
272
+ fontSizeCaption,
273
+ lineHeightTight,
274
+ lineHeightBody,
275
+ fontWeightRegular,
276
+ fontWeightMedium,
277
+ fontWeightSemibold,
278
+ radiusControl,
279
+ radiusPanel,
280
+ radiusSheet,
281
+ radiusPill,
282
+ durationFast,
283
+ durationStandard,
284
+ durationSheet,
285
+ easingStandard,
286
+ easingDecelerate,
287
+ backgroundRaised,
288
+ backgroundSunken,
289
+ textSecondary,
290
+ textTertiary,
291
+ separator,
292
+ accent,
293
+ accentContrast,
294
+ accentBackground,
295
+ selection,
296
+ controlBackground,
297
+ controlBackgroundPressed,
298
+ controlForeground,
299
+ controlBorder,
300
+ stateSuccess,
301
+ stateSuccessBackground,
302
+ stateWarning,
303
+ stateWarningBackground,
304
+ stateDanger,
305
+ stateDangerBackground,
306
+ stateInfo,
307
+ stateInfoBackground,
308
+ glassBackground,
309
+ glassBorder,
310
+ glassBlur,
311
+ glassSaturation,
312
+ glassShadow,
313
+ glassHighlight,
314
+ glassFallbackBackground,
315
+ neutral400,
316
+ neutral600,
317
+ backgroundCanvas,
318
+ textPrimary,
319
+ ]
320
+
321
+ export default s