@weasel-js/theme 1.5.1 → 1.5.2

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 (16) hide show
  1. package/dist/{chunk-YBHW5LZM.js → chunk-XFCWYN2L.js} +943 -124
  2. package/dist/chunk-XFCWYN2L.js.map +1 -0
  3. package/dist/engine.d.ts +15 -15
  4. package/dist/engine.js +57 -29
  5. package/dist/engine.js.map +1 -1
  6. package/dist/index.d.ts +4 -4
  7. package/dist/index.js +30 -17
  8. package/dist/index.js.map +1 -1
  9. package/dist/react.d.ts +2 -2
  10. package/dist/react.js +1 -1
  11. package/dist/resolveTheme-CF8i5IHy.d.ts +766 -0
  12. package/dist/{theme-BtpBHcUg.d.ts → theme-DAZcQi_L.d.ts} +2 -0
  13. package/dist/tokens.css +83 -15
  14. package/package.json +2 -2
  15. package/dist/chunk-YBHW5LZM.js.map +0 -1
  16. package/dist/resolveTheme-CHnPdh8W.d.ts +0 -266
package/dist/resolveTheme-CHnPdh8W.d.ts DELETED
@@ -1,266 +0,0 @@
1
- import { B as BakedTheme, b as AxisDefs, f as ThemeDefinition, T as Theme, S as Selection } from './theme-BtpBHcUg.js';
2
-
3
- /** Every design token the built-in themes declare, spelled as the CSS
4
- * custom property it becomes. */
5
- type TokenName = '--wzl-accent' | '--wzl-accent-base' | '--wzl-accent-fg' | '--wzl-accent-hover' | '--wzl-accent-soft' | '--wzl-accent-strong' | '--wzl-backdrop' | '--wzl-border' | '--wzl-border-strong' | '--wzl-border-w' | '--wzl-control-h' | '--wzl-curve-color' | '--wzl-curve-width' | '--wzl-danger' | '--wzl-danger-base' | '--wzl-ease-in-cubic' | '--wzl-ease-in-out-cubic' | '--wzl-ease-out-back' | '--wzl-ease-out-cubic' | '--wzl-fg' | '--wzl-fg-inverse' | '--wzl-fg-muted' | '--wzl-fg-on-accent' | '--wzl-fg-subtle' | '--wzl-field-pad-x' | '--wzl-focus-ring' | '--wzl-font-body' | '--wzl-font-display' | '--wzl-font-mono' | '--wzl-font-size' | '--wzl-font-size-2xs' | '--wzl-font-size-lg' | '--wzl-font-size-sm' | '--wzl-font-size-xl' | '--wzl-font-size-xs' | '--wzl-font-ui' | '--wzl-font-weight-bold' | '--wzl-font-weight-light' | '--wzl-font-weight-medium' | '--wzl-font-weight-normal' | '--wzl-glass-blur' | '--wzl-glass-tint' | '--wzl-gray-100' | '--wzl-gray-200' | '--wzl-gray-300' | '--wzl-gray-400' | '--wzl-gray-50' | '--wzl-gray-500' | '--wzl-gray-600' | '--wzl-gray-700' | '--wzl-gray-800' | '--wzl-gray-900' | '--wzl-handle-size' | '--wzl-handle-size-lg' | '--wzl-handle-size-sm' | '--wzl-leading' | '--wzl-leading-snug' | '--wzl-leading-tight' | '--wzl-line' | '--wzl-line-strong' | '--wzl-line-subtle' | '--wzl-line-width' | '--wzl-motion-fast' | '--wzl-motion-medium' | '--wzl-radius-lg' | '--wzl-radius-md' | '--wzl-radius-pill' | '--wzl-radius-sm' | '--wzl-shadow' | '--wzl-slider-thumb-mix' | '--wzl-slider-thumb-size' | '--wzl-slider-track-h' | '--wzl-slider-track-mix' | '--wzl-space-lg' | '--wzl-space-md' | '--wzl-space-sm' | '--wzl-space-xs' | '--wzl-success' | '--wzl-success-base' | '--wzl-surface' | '--wzl-surface-hover' | '--wzl-surface-pressed' | '--wzl-surface-raised' | '--wzl-surface-sunken' | '--wzl-swatch-amber' | '--wzl-swatch-blue' | '--wzl-swatch-citron' | '--wzl-swatch-fuchsia' | '--wzl-swatch-green' | '--wzl-swatch-red' | '--wzl-swatch-rose' | '--wzl-swatch-sky' | '--wzl-swatch-teal' | '--wzl-swatch-violet' | '--wzl-tb-height' | '--wzl-tracking-none' | '--wzl-tracking-wide' | '--wzl-tracking-wider' | '--wzl-warning' | '--wzl-warning-base' | '--wzl-z-modal' | '--wzl-z-overlay' | '--wzl-z-toolbar';
6
- /** A built-in theme with its aliases already collapsed: every selection
7
- * (keyed `mode=dark`, axes in declaration order) maps every token name to
8
- * a final CSS value. */
9
- interface GeneratedTheme {
10
- readonly name: string;
11
- readonly axes: AxisDefs;
12
- readonly selections: Readonly<Record<string, Readonly<Record<TokenName, string>>>>;
13
- }
14
- /** The built-in themes, resolved, keyed by theme name. Read this to list
15
- * or preview themes without resolving a token graph yourself. */
16
- declare const THEMES: {
17
- readonly weasel: {
18
- readonly name: "weasel";
19
- readonly axes: {
20
- readonly mode: {
21
- readonly default: "dark";
22
- readonly values: {
23
- readonly dark: {
24
- readonly scheme: "dark";
25
- };
26
- readonly light: {
27
- readonly scheme: "light";
28
- };
29
- };
30
- };
31
- };
32
- readonly selections: {
33
- readonly 'mode=dark': {
34
- readonly '--wzl-gray-50': "#f5f5f6";
35
- readonly '--wzl-gray-100': "#e6e7e9";
36
- readonly '--wzl-gray-200': "#c9cbcf";
37
- readonly '--wzl-gray-300': "#9ea1a8";
38
- readonly '--wzl-gray-400': "#6f737b";
39
- readonly '--wzl-gray-500': "#4d5058";
40
- readonly '--wzl-gray-600': "#383b42";
41
- readonly '--wzl-gray-700': "#25272c";
42
- readonly '--wzl-gray-800': "#181a1e";
43
- readonly '--wzl-gray-900': "#0e0f12";
44
- readonly '--wzl-accent-soft': "#1d1454";
45
- readonly '--wzl-accent-base': "#2e1f7a";
46
- readonly '--wzl-accent-strong': "#5841b8";
47
- readonly '--wzl-swatch-fuchsia': "#f641f7";
48
- readonly '--wzl-swatch-green': "#48e628";
49
- readonly '--wzl-swatch-sky': "#36bff2";
50
- readonly '--wzl-swatch-amber': "#e69628";
51
- readonly '--wzl-swatch-teal': "#3ee1cb";
52
- readonly '--wzl-swatch-red': "#f75034";
53
- readonly '--wzl-swatch-blue': "#407ef7";
54
- readonly '--wzl-swatch-citron': "#d5d23a";
55
- readonly '--wzl-swatch-rose': "#fa4590";
56
- readonly '--wzl-swatch-violet': "#955cf9";
57
- readonly '--wzl-surface': "#181a1e";
58
- readonly '--wzl-surface-raised': "#25272c";
59
- readonly '--wzl-surface-sunken': "#0e0f12";
60
- readonly '--wzl-fg': "#e6e7e9";
61
- readonly '--wzl-fg-muted': "#9ea1a8";
62
- readonly '--wzl-fg-subtle': "#6f737b";
63
- readonly '--wzl-border': "#25272c";
64
- readonly '--wzl-border-strong': "#6f737b";
65
- readonly '--wzl-accent-fg': "#5841b8";
66
- readonly '--wzl-fg-inverse': "#0e0f12";
67
- readonly '--wzl-shadow': "rgba(0, 0, 0, 0.6)";
68
- readonly '--wzl-danger-base': "#d94a3f";
69
- readonly '--wzl-warning-base': "#d99a3f";
70
- readonly '--wzl-success-base': "#2ec27e";
71
- readonly '--wzl-fg-on-accent': "#f5f5f6";
72
- readonly '--wzl-line-subtle': "rgba(230, 231, 233, 0.1)";
73
- readonly '--wzl-line': "rgba(230, 231, 233, 0.2)";
74
- readonly '--wzl-line-strong': "rgba(230, 231, 233, 0.4)";
75
- readonly '--wzl-curve-color': "#5841b8";
76
- readonly '--wzl-accent': "#2e1f7a";
77
- readonly '--wzl-accent-hover': "#5841b8";
78
- readonly '--wzl-danger': "#d94a3f";
79
- readonly '--wzl-warning': "#d99a3f";
80
- readonly '--wzl-success': "#2ec27e";
81
- readonly '--wzl-focus-ring': "#5841b8";
82
- readonly '--wzl-glass-tint': "#2e1f7a";
83
- readonly '--wzl-surface-hover': "rgba(230, 231, 233, 0.1)";
84
- readonly '--wzl-surface-pressed': "rgba(230, 231, 233, 0.18)";
85
- readonly '--wzl-radius-sm': "3px";
86
- readonly '--wzl-radius-md': "5px";
87
- readonly '--wzl-radius-lg': "14px";
88
- readonly '--wzl-radius-pill': "999px";
89
- readonly '--wzl-border-w': "1px";
90
- readonly '--wzl-line-width': "2px";
91
- readonly '--wzl-curve-width': "3px";
92
- readonly '--wzl-tb-height': "28px";
93
- readonly '--wzl-control-h': "24px";
94
- readonly '--wzl-slider-track-h': "4px";
95
- readonly '--wzl-slider-thumb-size': "8px";
96
- readonly '--wzl-slider-track-mix': "18%";
97
- readonly '--wzl-slider-thumb-mix': "70%";
98
- readonly '--wzl-handle-size': "9px";
99
- readonly '--wzl-handle-size-sm': "7px";
100
- readonly '--wzl-handle-size-lg': "10px";
101
- readonly '--wzl-field-pad-x': "8px";
102
- readonly '--wzl-glass-blur': "3px";
103
- readonly '--wzl-font-size-2xs': "9px";
104
- readonly '--wzl-font-size-xs': "10px";
105
- readonly '--wzl-font-size-sm': "11px";
106
- readonly '--wzl-font-size': "13px";
107
- readonly '--wzl-font-size-lg': "16px";
108
- readonly '--wzl-font-size-xl': "20px";
109
- readonly '--wzl-space-xs': "4px";
110
- readonly '--wzl-space-sm': "8px";
111
- readonly '--wzl-space-md': "12px";
112
- readonly '--wzl-space-lg': "16px";
113
- readonly '--wzl-tracking-none': "0";
114
- readonly '--wzl-tracking-wide': "0.06em";
115
- readonly '--wzl-tracking-wider': "0.08em";
116
- readonly '--wzl-z-toolbar': "10";
117
- readonly '--wzl-z-overlay': "20";
118
- readonly '--wzl-z-modal': "30";
119
- readonly '--wzl-leading-tight': "1";
120
- readonly '--wzl-leading-snug': "1.2";
121
- readonly '--wzl-leading': "1.4";
122
- readonly '--wzl-backdrop': "none";
123
- readonly '--wzl-motion-fast': "120ms";
124
- readonly '--wzl-motion-medium': "240ms";
125
- readonly '--wzl-ease-in-cubic': "cubic-bezier(0.32, 0, 0.67, 0)";
126
- readonly '--wzl-ease-out-cubic': "cubic-bezier(0.33, 1, 0.68, 1)";
127
- readonly '--wzl-ease-in-out-cubic': "cubic-bezier(0.65, 0, 0.35, 1)";
128
- readonly '--wzl-ease-out-back': "cubic-bezier(0.34, 1.56, 0.64, 1)";
129
- readonly '--wzl-font-ui': "Oswald, 'Helvetica Neue Condensed', 'Arial Narrow', system-ui, sans-serif";
130
- readonly '--wzl-font-display': "Oswald, 'Helvetica Neue Condensed', 'Arial Narrow', system-ui, sans-serif";
131
- readonly '--wzl-font-body': "Inter, system-ui, -apple-system, 'Segoe UI', sans-serif";
132
- readonly '--wzl-font-mono': "ui-monospace, SFMono-Regular, Menlo, Consolas, monospace";
133
- readonly '--wzl-font-weight-light': "200";
134
- readonly '--wzl-font-weight-normal': "300";
135
- readonly '--wzl-font-weight-medium': "350";
136
- readonly '--wzl-font-weight-bold': "400";
137
- };
138
- readonly 'mode=light': {
139
- readonly '--wzl-gray-50': "#f5f5f6";
140
- readonly '--wzl-gray-100': "#e6e7e9";
141
- readonly '--wzl-gray-200': "#c9cbcf";
142
- readonly '--wzl-gray-300': "#9ea1a8";
143
- readonly '--wzl-gray-400': "#6f737b";
144
- readonly '--wzl-gray-500': "#4d5058";
145
- readonly '--wzl-gray-600': "#383b42";
146
- readonly '--wzl-gray-700': "#25272c";
147
- readonly '--wzl-gray-800': "#181a1e";
148
- readonly '--wzl-gray-900': "#0e0f12";
149
- readonly '--wzl-accent-soft': "#1d1454";
150
- readonly '--wzl-accent-base': "#2e1f7a";
151
- readonly '--wzl-accent-strong': "#5841b8";
152
- readonly '--wzl-swatch-fuchsia': "#f641f7";
153
- readonly '--wzl-swatch-green': "#48e628";
154
- readonly '--wzl-swatch-sky': "#36bff2";
155
- readonly '--wzl-swatch-amber': "#e69628";
156
- readonly '--wzl-swatch-teal': "#3ee1cb";
157
- readonly '--wzl-swatch-red': "#f75034";
158
- readonly '--wzl-swatch-blue': "#407ef7";
159
- readonly '--wzl-swatch-citron': "#d5d23a";
160
- readonly '--wzl-swatch-rose': "#fa4590";
161
- readonly '--wzl-swatch-violet': "#955cf9";
162
- readonly '--wzl-surface': "#f5f5f6";
163
- readonly '--wzl-surface-raised': "#e6e7e9";
164
- readonly '--wzl-surface-sunken': "#c9cbcf";
165
- readonly '--wzl-fg': "#0e0f12";
166
- readonly '--wzl-fg-muted': "#383b42";
167
- readonly '--wzl-fg-subtle': "#4d5058";
168
- readonly '--wzl-border': "#c9cbcf";
169
- readonly '--wzl-border-strong': "#4d5058";
170
- readonly '--wzl-accent-fg': "#2e1f7a";
171
- readonly '--wzl-fg-inverse': "#f5f5f6";
172
- readonly '--wzl-shadow': "rgba(0, 0, 0, 0.18)";
173
- readonly '--wzl-danger-base': "#d94a3f";
174
- readonly '--wzl-warning-base': "#d99a3f";
175
- readonly '--wzl-success-base': "#2ec27e";
176
- readonly '--wzl-fg-on-accent': "#f5f5f6";
177
- readonly '--wzl-line-subtle': "rgba(14, 15, 18, 0.1)";
178
- readonly '--wzl-line': "rgba(14, 15, 18, 0.2)";
179
- readonly '--wzl-line-strong': "rgba(14, 15, 18, 0.4)";
180
- readonly '--wzl-curve-color': "#5841b8";
181
- readonly '--wzl-accent': "#2e1f7a";
182
- readonly '--wzl-accent-hover': "#5841b8";
183
- readonly '--wzl-danger': "#d94a3f";
184
- readonly '--wzl-warning': "#d99a3f";
185
- readonly '--wzl-success': "#2ec27e";
186
- readonly '--wzl-focus-ring': "#5841b8";
187
- readonly '--wzl-glass-tint': "#2e1f7a";
188
- readonly '--wzl-surface-hover': "rgba(14, 15, 18, 0.1)";
189
- readonly '--wzl-surface-pressed': "rgba(14, 15, 18, 0.18)";
190
- readonly '--wzl-radius-sm': "3px";
191
- readonly '--wzl-radius-md': "5px";
192
- readonly '--wzl-radius-lg': "14px";
193
- readonly '--wzl-radius-pill': "999px";
194
- readonly '--wzl-border-w': "1px";
195
- readonly '--wzl-line-width': "2px";
196
- readonly '--wzl-curve-width': "3px";
197
- readonly '--wzl-tb-height': "28px";
198
- readonly '--wzl-control-h': "24px";
199
- readonly '--wzl-slider-track-h': "4px";
200
- readonly '--wzl-slider-thumb-size': "8px";
201
- readonly '--wzl-slider-track-mix': "18%";
202
- readonly '--wzl-slider-thumb-mix': "70%";
203
- readonly '--wzl-handle-size': "9px";
204
- readonly '--wzl-handle-size-sm': "7px";
205
- readonly '--wzl-handle-size-lg': "10px";
206
- readonly '--wzl-field-pad-x': "8px";
207
- readonly '--wzl-glass-blur': "3px";
208
- readonly '--wzl-font-size-2xs': "9px";
209
- readonly '--wzl-font-size-xs': "10px";
210
- readonly '--wzl-font-size-sm': "11px";
211
- readonly '--wzl-font-size': "13px";
212
- readonly '--wzl-font-size-lg': "16px";
213
- readonly '--wzl-font-size-xl': "20px";
214
- readonly '--wzl-space-xs': "4px";
215
- readonly '--wzl-space-sm': "8px";
216
- readonly '--wzl-space-md': "12px";
217
- readonly '--wzl-space-lg': "16px";
218
- readonly '--wzl-tracking-none': "0";
219
- readonly '--wzl-tracking-wide': "0.06em";
220
- readonly '--wzl-tracking-wider': "0.08em";
221
- readonly '--wzl-z-toolbar': "10";
222
- readonly '--wzl-z-overlay': "20";
223
- readonly '--wzl-z-modal': "30";
224
- readonly '--wzl-leading-tight': "1";
225
- readonly '--wzl-leading-snug': "1.2";
226
- readonly '--wzl-leading': "1.4";
227
- readonly '--wzl-backdrop': "none";
228
- readonly '--wzl-motion-fast': "120ms";
229
- readonly '--wzl-motion-medium': "240ms";
230
- readonly '--wzl-ease-in-cubic': "cubic-bezier(0.32, 0, 0.67, 0)";
231
- readonly '--wzl-ease-out-cubic': "cubic-bezier(0.33, 1, 0.68, 1)";
232
- readonly '--wzl-ease-in-out-cubic': "cubic-bezier(0.65, 0, 0.35, 1)";
233
- readonly '--wzl-ease-out-back': "cubic-bezier(0.34, 1.56, 0.64, 1)";
234
- readonly '--wzl-font-ui': "Oswald, 'Helvetica Neue Condensed', 'Arial Narrow', system-ui, sans-serif";
235
- readonly '--wzl-font-display': "Oswald, 'Helvetica Neue Condensed', 'Arial Narrow', system-ui, sans-serif";
236
- readonly '--wzl-font-body': "Inter, system-ui, -apple-system, 'Segoe UI', sans-serif";
237
- readonly '--wzl-font-mono': "ui-monospace, SFMono-Regular, Menlo, Consolas, monospace";
238
- readonly '--wzl-font-weight-light': "200";
239
- readonly '--wzl-font-weight-normal': "300";
240
- readonly '--wzl-font-weight-medium': "350";
241
- readonly '--wzl-font-weight-bold': "400";
242
- };
243
- };
244
- };
245
- };
246
- /** The built-in themes as authored: their unbaked definitions. */
247
- declare const THEME_SOURCES: Readonly<Record<string, ThemeDefinition>>;
248
- /** The built-in themes with every rule run and references intact. This is
249
- * what `weaselTheme` is built from, so the runtime entry bundles no generator. */
250
- declare const BAKED_THEMES: Readonly<Record<string, BakedTheme>>;
251
-
252
- /** The output of `resolveTheme`: every token of a theme, for one selection, keyed
253
- * by CSS custom-property name and flattened to a final CSS value. */
254
- type ResolvedTheme = Readonly<Record<TokenName, string>>;
255
- /** Every axis the chain declares. An axis declared more than once keeps every value; a descendant's value entries and default win. */
256
- declare function themeAxes(theme: Theme): AxisDefs;
257
- /**
258
- * Merge the extends chain at a selection, resolve every alias, and key the
259
- * result by CSS custom-property name. A missing or unknown axis value takes the
260
- * axis default.
261
- *
262
- * Pure — no DOM. An unresolvable reference throws rather than falling back.
263
- */
264
- declare function resolveTheme(theme: Theme, selection?: Selection): ResolvedTheme;
265
-
266
- export { BAKED_THEMES as B, type GeneratedTheme as G, type ResolvedTheme as R, type TokenName as T, THEMES as a, THEME_SOURCES as b, resolveTheme as r, themeAxes as t };