@weasel-js/theme 1.7.0 → 1.7.1
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/NOTICE +2 -1
- package/dist/{chunk-C3S4A65R.js → chunk-AN5JVL2S.js} +2 -2
- package/dist/chunk-AN5JVL2S.js.map +1 -0
- package/dist/{chunk-3KMZGDV5.js → chunk-CKB2MZRY.js} +154 -138
- package/dist/chunk-CKB2MZRY.js.map +1 -0
- package/dist/{chunk-EINHFDWI.js → chunk-Z675UQ26.js} +2 -2
- package/dist/{chunk-EINHFDWI.js.map → chunk-Z675UQ26.js.map} +1 -1
- package/dist/{definition-Dqt5o6LR.d.ts → definition-ChUj0lSz.d.ts} +123 -85
- package/dist/engine.d.ts +52 -5
- package/dist/engine.js +9 -3
- package/dist/engine.js.map +1 -1
- package/dist/faces.css +9 -1
- package/dist/index.d.ts +4 -2
- package/dist/index.js +21 -19
- package/dist/index.js.map +1 -1
- package/dist/react.d.ts +1 -1
- package/dist/react.js +3 -3
- package/dist/tokens.css +33 -31
- package/fonts/README.md +24 -3
- package/fonts/oswald-tabular-digits.woff2 +0 -0
- package/package.json +2 -2
- package/dist/chunk-3KMZGDV5.js.map +0 -1
- package/dist/chunk-C3S4A65R.js.map +0 -1
package/dist/react.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { isColorModePreference, weaselTheme, themeTones, applyTheme } from './chunk-
|
|
2
|
-
export { isColorModePreference } from './chunk-
|
|
3
|
-
import { themeAxes, fullSelection, selectionKey, resolveTheme } from './chunk-
|
|
1
|
+
import { isColorModePreference, weaselTheme, themeTones, applyTheme } from './chunk-CKB2MZRY.js';
|
|
2
|
+
export { isColorModePreference } from './chunk-CKB2MZRY.js';
|
|
3
|
+
import { themeAxes, fullSelection, selectionKey, resolveTheme } from './chunk-AN5JVL2S.js';
|
|
4
4
|
import { createContext, useState, useEffect, useCallback, useRef, useMemo, useLayoutEffect, useContext } from 'react';
|
|
5
5
|
import { jsx } from 'react/jsx-runtime';
|
|
6
6
|
|
package/dist/tokens.css
CHANGED
|
@@ -33,17 +33,17 @@
|
|
|
33
33
|
--wzl-swatch-rose: #fa4590;
|
|
34
34
|
--wzl-swatch-violet: #955cf9;
|
|
35
35
|
/* Shortcut keys and index badges. The floor for chrome text. */
|
|
36
|
-
--wzl-font-size-2xs:
|
|
36
|
+
--wzl-font-size-2xs: 10px;
|
|
37
37
|
/* Tool-button labels under an icon. */
|
|
38
|
-
--wzl-font-size-xs:
|
|
38
|
+
--wzl-font-size-xs: 12px;
|
|
39
39
|
/* Chrome labels, status readouts, section headings. */
|
|
40
|
-
--wzl-font-size-sm:
|
|
40
|
+
--wzl-font-size-sm: 13px;
|
|
41
41
|
/* Controls and body text. */
|
|
42
|
-
--wzl-font-size-md:
|
|
42
|
+
--wzl-font-size-md: 15px;
|
|
43
43
|
/* Panel and dialog titles. */
|
|
44
|
-
--wzl-font-size-lg:
|
|
44
|
+
--wzl-font-size-lg: 18px;
|
|
45
45
|
/* The largest chrome text — a lab or app title. */
|
|
46
|
-
--wzl-font-size-xl:
|
|
46
|
+
--wzl-font-size-xl: 23px;
|
|
47
47
|
--wzl-space-1: 2px;
|
|
48
48
|
--wzl-space-2: 4px;
|
|
49
49
|
--wzl-space-3: 6px;
|
|
@@ -149,15 +149,15 @@
|
|
|
149
149
|
/* Drawn data curves. Heavier than structural lines so data reads as primary content. */
|
|
150
150
|
--wzl-curve-width: 3px;
|
|
151
151
|
/* Height of a horizontal toolbar strip (ButtonBar, OptionsBar, ToolOptionsBar). Taller than control-h so the controls inside a strip are not flush with its edges. */
|
|
152
|
-
--wzl-tb-height:
|
|
152
|
+
--wzl-tb-height: 32px;
|
|
153
153
|
/* Height of the smallest interactive control -- a stepper, a keycap, a swatch button in a dense row. The rank below control-h-sm. */
|
|
154
|
-
--wzl-control-h-xs:
|
|
154
|
+
--wzl-control-h-xs: 22px;
|
|
155
155
|
/* Height of a control in a dense inspector -- a Properties field, a small Button. The rank below control-h, which sizes a standalone control. */
|
|
156
|
-
--wzl-control-h-sm:
|
|
156
|
+
--wzl-control-h-sm: 24px;
|
|
157
157
|
/* Height of an interactive control — button, input, select, segmented control. Distinct from tb-height, which sizes the strip a row of them sits in. */
|
|
158
|
-
--wzl-control-h:
|
|
158
|
+
--wzl-control-h: 28px;
|
|
159
159
|
/* Side of a square icon button -- a dialog close, a row remove, a field clear. Smaller than control-h because it carries a glyph rather than a label, and square, so it sizes both axes. */
|
|
160
|
-
--wzl-icon-button-size:
|
|
160
|
+
--wzl-icon-button-size: 26px;
|
|
161
161
|
/* Height of a linear range track. The kit's single-thumb ranges all wear this; Slider's default 24px canvas track does not. */
|
|
162
162
|
--wzl-slider-track-h: 4px;
|
|
163
163
|
/* Diameter of a linear range thumb. */
|
|
@@ -214,6 +214,8 @@
|
|
|
214
214
|
--wzl-ease-out-back: cubic-bezier(0.34, 1.56, 0.64, 1);
|
|
215
215
|
/* Condensed UI/display face. The heavier cuts get blocky at any size, so the weight tokens stay in the 200-400 range. */
|
|
216
216
|
--wzl-font-ui: Oswald, 'Helvetica Neue Condensed', 'Arial Narrow', system-ui, sans-serif;
|
|
217
|
+
/* The UI face with equal-width digits, for numbers read down a column or updated in place. Oswald Tabular carries only 0-9 and the figure space (U+2007); every other character falls through to the UI face. */
|
|
218
|
+
--wzl-font-numeric: 'Oswald Tabular', var(--wzl-font-ui);
|
|
217
219
|
--wzl-font-display: Oswald, 'Helvetica Neue Condensed', 'Arial Narrow', system-ui, sans-serif;
|
|
218
220
|
--wzl-font-body: Inter, system-ui, -apple-system, 'Segoe UI', sans-serif;
|
|
219
221
|
--wzl-font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
|
|
@@ -329,24 +331,6 @@
|
|
|
329
331
|
|
|
330
332
|
[data-wzl-theme='weasel'][data-wzl-density='compact'],
|
|
331
333
|
[data-wzl-density='compact'] {
|
|
332
|
-
--wzl-font-size-2xs: 7px;
|
|
333
|
-
--wzl-font-size-xs: 8px;
|
|
334
|
-
--wzl-font-size-sm: 9px;
|
|
335
|
-
--wzl-font-size-md: 11px;
|
|
336
|
-
--wzl-font-size-lg: 14px;
|
|
337
|
-
--wzl-font-size-xl: 17px;
|
|
338
|
-
--wzl-tb-height: 24px;
|
|
339
|
-
--wzl-control-h-xs: 16px;
|
|
340
|
-
--wzl-control-h-sm: 18px;
|
|
341
|
-
--wzl-control-h: 20px;
|
|
342
|
-
--wzl-icon-button-size: 20px;
|
|
343
|
-
--wzl-panel-title-size: var(--wzl-font-size-lg);
|
|
344
|
-
--wzl-stance-preview-title-size: var(--wzl-font-size-xs);
|
|
345
|
-
--wzl-font-size: var(--wzl-font-size-md);
|
|
346
|
-
}
|
|
347
|
-
|
|
348
|
-
[data-wzl-theme='weasel'][data-wzl-density='comfortable'],
|
|
349
|
-
[data-wzl-density='comfortable'] {
|
|
350
334
|
--wzl-font-size-2xs: 9px;
|
|
351
335
|
--wzl-font-size-xs: 10px;
|
|
352
336
|
--wzl-font-size-sm: 11px;
|
|
@@ -363,8 +347,8 @@
|
|
|
363
347
|
--wzl-font-size: var(--wzl-font-size-md);
|
|
364
348
|
}
|
|
365
349
|
|
|
366
|
-
[data-wzl-theme='weasel'][data-wzl-density='
|
|
367
|
-
[data-wzl-density='
|
|
350
|
+
[data-wzl-theme='weasel'][data-wzl-density='comfortable'],
|
|
351
|
+
[data-wzl-density='comfortable'] {
|
|
368
352
|
--wzl-font-size-2xs: 10px;
|
|
369
353
|
--wzl-font-size-xs: 12px;
|
|
370
354
|
--wzl-font-size-sm: 13px;
|
|
@@ -380,3 +364,21 @@
|
|
|
380
364
|
--wzl-stance-preview-title-size: var(--wzl-font-size-xs);
|
|
381
365
|
--wzl-font-size: var(--wzl-font-size-md);
|
|
382
366
|
}
|
|
367
|
+
|
|
368
|
+
[data-wzl-theme='weasel'][data-wzl-density='roomy'],
|
|
369
|
+
[data-wzl-density='roomy'] {
|
|
370
|
+
--wzl-font-size-2xs: 12px;
|
|
371
|
+
--wzl-font-size-xs: 14px;
|
|
372
|
+
--wzl-font-size-sm: 15px;
|
|
373
|
+
--wzl-font-size-md: 18px;
|
|
374
|
+
--wzl-font-size-lg: 22px;
|
|
375
|
+
--wzl-font-size-xl: 28px;
|
|
376
|
+
--wzl-tb-height: 38px;
|
|
377
|
+
--wzl-control-h-xs: 26px;
|
|
378
|
+
--wzl-control-h-sm: 28px;
|
|
379
|
+
--wzl-control-h: 34px;
|
|
380
|
+
--wzl-icon-button-size: 32px;
|
|
381
|
+
--wzl-panel-title-size: var(--wzl-font-size-lg);
|
|
382
|
+
--wzl-stance-preview-title-size: var(--wzl-font-size-xs);
|
|
383
|
+
--wzl-font-size: var(--wzl-font-size-md);
|
|
384
|
+
}
|
package/fonts/README.md
CHANGED
|
@@ -1,11 +1,12 @@
|
|
|
1
1
|
# Bundled fonts
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
OFL-1.1 faces, vendored so the kit never fetches a stylesheet from a
|
|
4
4
|
third-party host at runtime.
|
|
5
5
|
|
|
6
6
|
| file | token | role |
|
|
7
7
|
|---|---|---|
|
|
8
8
|
| `oswald-latin-variable.woff2` | `--wzl-font-ui`, `--wzl-font-display` | condensed UI/display face, variable `wght 200–700` |
|
|
9
|
+
| `oswald-tabular-digits.woff2` | `--wzl-font-numeric` | Oswald's digits 0–9, each centered in the widest digit's advance at every weight, and a figure space (U+2007) that wide, as family `Oswald Tabular` |
|
|
9
10
|
| `inter-latin.woff2` | `--wzl-font-body` | body/prose face, weight 400 |
|
|
10
11
|
|
|
11
12
|
Loading them is opt-in: `import '@weasel-js/theme/fonts.css'`, or
|
|
@@ -19,7 +20,7 @@ with no error anywhere.
|
|
|
19
20
|
|
|
20
21
|
## Tooling
|
|
21
22
|
|
|
22
|
-
|
|
23
|
+
These commands need `fontTools` **with the Brotli extension** — without it,
|
|
23
24
|
`--flavor=woff2` fails with `ImportError: No module named brotli`. Homebrew's
|
|
24
25
|
`fonttools` formula does not include it, so use a throwaway venv:
|
|
25
26
|
|
|
@@ -53,6 +54,26 @@ in the kit reads hints.
|
|
|
53
54
|
Oswald's OFL notice carries **no Reserved Font Name**, so a subset may keep the
|
|
54
55
|
family name.
|
|
55
56
|
|
|
57
|
+
## Provenance — Oswald Tabular
|
|
58
|
+
|
|
59
|
+
Built from `oswald-latin-variable.woff2` by `scripts/oswald-tabular.py` (same
|
|
60
|
+
venv): subset to U+0030–0039 with no layout features, then every digit gets the
|
|
61
|
+
widest digit's advance at the default weight and at each `wght` master, its
|
|
62
|
+
outline shifted by half the difference so it stays centered, and `HVAR` is
|
|
63
|
+
rebuilt from the patched `gvar`. A blank U+2007 of the same width is added, because
|
|
64
|
+
Oswald has none and `Jog` and `DetailList` pad numbers with it. Oswald ships no `tnum` feature, so this is the
|
|
65
|
+
only way its figures line up in a column. The widest digit is `0` at every
|
|
66
|
+
weight, so no digit is padded past Oswald's own widest.
|
|
67
|
+
|
|
68
|
+
```sh
|
|
69
|
+
/tmp/fontvenv/bin/python packages/theme/scripts/oswald-tabular.py
|
|
70
|
+
```
|
|
71
|
+
|
|
72
|
+
It is a separate family rather than a patched Oswald so that only text asking
|
|
73
|
+
for `--wzl-font-numeric` gets tabular digits; running text keeps Oswald's
|
|
74
|
+
proportional ones. The face covers digits and the figure space alone, so the browser takes every
|
|
75
|
+
other character from the next family in the stack.
|
|
76
|
+
|
|
56
77
|
## Provenance — Inter
|
|
57
78
|
|
|
58
79
|
Re-flavored from `assets/fonts/inter/inter.ttf`, which is already Inter v4.1
|
|
@@ -70,6 +91,6 @@ README for the original command):
|
|
|
70
91
|
|
|
71
92
|
## License
|
|
72
93
|
|
|
73
|
-
|
|
94
|
+
All three faces are SIL Open Font License 1.1 — `OFL-Oswald.txt` and `OFL-Inter.txt`,
|
|
74
95
|
redistributed with the fonts as the license requires. The OFL covers these font
|
|
75
96
|
binaries only; the package's code is MIT (see `../LICENSE`).
|
|
Binary file
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@weasel-js/theme",
|
|
3
|
-
"version": "1.7.
|
|
3
|
+
"version": "1.7.1",
|
|
4
4
|
"description": "Design tokens shared by weasel-ui and weasel-hud — CSS variables + a parallel TS export.",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"type": "module",
|
|
@@ -29,7 +29,7 @@
|
|
|
29
29
|
"./package.json": "./package.json"
|
|
30
30
|
},
|
|
31
31
|
"dependencies": {
|
|
32
|
-
"@weasel-js/paint": "1.7.
|
|
32
|
+
"@weasel-js/paint": "1.7.1"
|
|
33
33
|
},
|
|
34
34
|
"peerDependencies": {
|
|
35
35
|
"react": ">=18"
|