@vegastack/design-tokens 0.7.49 → 0.7.78

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 (8) hide show
  1. package/dist/base.css +15 -0
  2. package/dist/theme.css +4 -0
  3. package/dist/tokens.cjs +4 -0
  4. package/dist/tokens.d.cts +4 -0
  5. package/dist/tokens.d.ts +4 -0
  6. package/dist/tokens.js +4 -0
  7. package/dist/tokens.json +4 -0
  8. package/package.json +1 -1
package/dist/base.css CHANGED
@@ -13,6 +13,7 @@
13
13
  MOT-5 the reduced-motion reset (and the one sanctioned !important)
14
14
  INT-1 the hand cursor, on a wider selector list than shadcn's --pointer rule
15
15
  INT-7 touch-action: manipulation and no tap highlight
16
+ INT-12 no page-edge bounce or scroll chaining on fine pointers (vertical only)
16
17
  OVL-13 body { isolation: isolate } for the portal theme scope
17
18
 
18
19
  Deleted with the reset: INT-2's `cursor: default` on disabled controls (INT-2 = shadcn, and
@@ -244,3 +245,17 @@
244
245
  font-size: max(16px, 1em);
245
246
  }
246
247
  }
248
+
249
+ /* INT-12 (ours) — NO PAGE BOUNCE ON MOUSE AND TRACKPAD (MK 2026-09-30).
250
+ On a fine pointer the page's vertical edge no longer rubber-bands, and an inner scroller that
251
+ hits its end no longer hands the scroll on to the page behind it. VERTICAL ONLY: horizontal
252
+ overscroll stays `auto`, so a trackpad two-finger swipe still navigates back/forward. GATED TO
253
+ `pointer: fine`: touch devices keep pull-to-refresh and the native bounce. On both `html` and
254
+ `body` because which of the two is the root scroller varies by browser. Inner scrollers that
255
+ want containment on every pointer still set `overscroll-*-contain` themselves. */
256
+ @media (pointer: fine) {
257
+ html,
258
+ body {
259
+ overscroll-behavior-y: none;
260
+ }
261
+ }
package/dist/theme.css CHANGED
@@ -38,6 +38,8 @@
38
38
  --media-scrim: oklch(0.13 0.002 75 / 0.6); /** THEME-INVARIANT media chrome scrim (B4-01): the gradient/backdrop behind controls laid over video or imagery. Always a warm-black alpha, never a theme token, so the chrome reads dark-scrim + light-ink in both themes (`primary` flips with the theme and inverted the chrome in dark). TEXT IS PERMITTED on this scrim: media-foreground clears 5.2:1 on it over a white worst-case backdrop, and tooling/contrast-check.mjs gates the pair at the AA TEXT floor (4.5:1), not the 3:1 non-text floor — so a retune that thins this scrim under AA fails the build rather than silently demoting its labels. */
39
39
  --media-scrim-strong: oklch(0.13 0.002 75 / 0.8); /** Theme-invariant strong scrim for opaque media pills (volume popover, time badge) — 11:1 for media-foreground over a white worst case. Use it for any block of media text that needs headroom beyond the soft scrim's ~5.2:1, and for text over unusually bright or busy frames. */
40
40
  --media-foreground: oklch(0.985 0 0); /** Theme-invariant media chrome ink: the warm off-white used for every icon, label and track drawn over media-scrim or media-scrim-strong. Labels are allowed on EITHER scrim — both are gated at the AA text floor (4.5:1) against this ink over the white worst case. Not overridden in dark on purpose. */
41
+ --scrim: oklch(0 0 0); /** THEME-INVARIANT photo scrim: the dark wash a tile's image wears under a corner control (Attachment tiles, SortableList grid handle/actions, AvatarPicker's edit overlay, all through the tile-overlay recipe). Opaque on purpose and always read through an opacity modifier — `bg-scrim/40` at rest, `bg-scrim/60` on hover or open — the same way the status families take `/10`-`/30`. Identical in both themes, because it lies over a photograph, not over the page. Not AA-gated: it carries icons over arbitrary imagery, not text; text over media reads through `media-scrim`. */
42
+ --scrim-foreground: oklch(1 0 0); /** Theme-invariant ink drawn on `scrim`: the icon (and pencil) colour of every tile-overlay control. Not overridden in dark on purpose. */
41
43
  --chart-1: oklch(0.546 0.245 262.88); /** Categorical chart hue (MK 2026-09-18: our 8-hue palette is kept — shadcn's `neutral` base ships a greyscale chart ramp, which cannot carry multi-series data). Light halves retuned for the pure-white page and the 0.97 `muted` ground; every hue clears the WCAG 1.4.11 3:1 floor on background, card and muted in both themes. */
42
44
  --chart-2: oklch(0.581 0.118 184.7); /** Categorical chart hue (MK 2026-09-18: our 8-hue palette is kept — shadcn's `neutral` base ships a greyscale chart ramp, which cannot carry multi-series data). Light halves retuned for the pure-white page and the 0.97 `muted` ground; every hue clears the WCAG 1.4.11 3:1 floor on background, card and muted in both themes. */
43
45
  --chart-3: oklch(0.398 0.07 227.39); /** Categorical chart hue (MK 2026-09-18: our 8-hue palette is kept — shadcn's `neutral` base ships a greyscale chart ramp, which cannot carry multi-series data). Light halves retuned for the pure-white page and the 0.97 `muted` ground; every hue clears the WCAG 1.4.11 3:1 floor on background, card and muted in both themes. */
@@ -221,6 +223,8 @@
221
223
  --color-media-scrim: var(--media-scrim);
222
224
  --color-media-scrim-strong: var(--media-scrim-strong);
223
225
  --color-media-foreground: var(--media-foreground);
226
+ --color-scrim: var(--scrim);
227
+ --color-scrim-foreground: var(--scrim-foreground);
224
228
  --color-chart-1: var(--chart-1);
225
229
  --color-chart-2: var(--chart-2);
226
230
  --color-chart-3: var(--chart-3);
package/dist/tokens.cjs CHANGED
@@ -57,6 +57,8 @@ var tokens = {
57
57
  "media-scrim": "oklch(0.13 0.002 75 / 0.6)",
58
58
  "media-scrim-strong": "oklch(0.13 0.002 75 / 0.8)",
59
59
  "media-foreground": "oklch(0.985 0 0)",
60
+ "scrim": "oklch(0 0 0)",
61
+ "scrim-foreground": "oklch(1 0 0)",
60
62
  "chart-1": "oklch(0.546 0.245 262.88)",
61
63
  "chart-2": "oklch(0.581 0.118 184.7)",
62
64
  "chart-3": "oklch(0.398 0.07 227.39)",
@@ -153,6 +155,8 @@ var tokens = {
153
155
  "media-scrim": "oklch(0.13 0.002 75 / 0.6)",
154
156
  "media-scrim-strong": "oklch(0.13 0.002 75 / 0.8)",
155
157
  "media-foreground": "oklch(0.985 0 0)",
158
+ "scrim": "oklch(0 0 0)",
159
+ "scrim-foreground": "oklch(1 0 0)",
156
160
  "chart-1": "oklch(0.623 0.214 259.81)",
157
161
  "chart-2": "oklch(0.696 0.17 162.48)",
158
162
  "chart-3": "oklch(0.769 0.188 70.08)",
package/dist/tokens.d.cts CHANGED
@@ -32,6 +32,8 @@ declare const tokens: {
32
32
  readonly "media-scrim": "oklch(0.13 0.002 75 / 0.6)";
33
33
  readonly "media-scrim-strong": "oklch(0.13 0.002 75 / 0.8)";
34
34
  readonly "media-foreground": "oklch(0.985 0 0)";
35
+ readonly scrim: "oklch(0 0 0)";
36
+ readonly "scrim-foreground": "oklch(1 0 0)";
35
37
  readonly "chart-1": "oklch(0.546 0.245 262.88)";
36
38
  readonly "chart-2": "oklch(0.581 0.118 184.7)";
37
39
  readonly "chart-3": "oklch(0.398 0.07 227.39)";
@@ -128,6 +130,8 @@ declare const tokens: {
128
130
  readonly "media-scrim": "oklch(0.13 0.002 75 / 0.6)";
129
131
  readonly "media-scrim-strong": "oklch(0.13 0.002 75 / 0.8)";
130
132
  readonly "media-foreground": "oklch(0.985 0 0)";
133
+ readonly scrim: "oklch(0 0 0)";
134
+ readonly "scrim-foreground": "oklch(1 0 0)";
131
135
  readonly "chart-1": "oklch(0.623 0.214 259.81)";
132
136
  readonly "chart-2": "oklch(0.696 0.17 162.48)";
133
137
  readonly "chart-3": "oklch(0.769 0.188 70.08)";
package/dist/tokens.d.ts CHANGED
@@ -32,6 +32,8 @@ declare const tokens: {
32
32
  readonly "media-scrim": "oklch(0.13 0.002 75 / 0.6)";
33
33
  readonly "media-scrim-strong": "oklch(0.13 0.002 75 / 0.8)";
34
34
  readonly "media-foreground": "oklch(0.985 0 0)";
35
+ readonly scrim: "oklch(0 0 0)";
36
+ readonly "scrim-foreground": "oklch(1 0 0)";
35
37
  readonly "chart-1": "oklch(0.546 0.245 262.88)";
36
38
  readonly "chart-2": "oklch(0.581 0.118 184.7)";
37
39
  readonly "chart-3": "oklch(0.398 0.07 227.39)";
@@ -128,6 +130,8 @@ declare const tokens: {
128
130
  readonly "media-scrim": "oklch(0.13 0.002 75 / 0.6)";
129
131
  readonly "media-scrim-strong": "oklch(0.13 0.002 75 / 0.8)";
130
132
  readonly "media-foreground": "oklch(0.985 0 0)";
133
+ readonly scrim: "oklch(0 0 0)";
134
+ readonly "scrim-foreground": "oklch(1 0 0)";
131
135
  readonly "chart-1": "oklch(0.623 0.214 259.81)";
132
136
  readonly "chart-2": "oklch(0.696 0.17 162.48)";
133
137
  readonly "chart-3": "oklch(0.769 0.188 70.08)";
package/dist/tokens.js CHANGED
@@ -33,6 +33,8 @@ var tokens = {
33
33
  "media-scrim": "oklch(0.13 0.002 75 / 0.6)",
34
34
  "media-scrim-strong": "oklch(0.13 0.002 75 / 0.8)",
35
35
  "media-foreground": "oklch(0.985 0 0)",
36
+ "scrim": "oklch(0 0 0)",
37
+ "scrim-foreground": "oklch(1 0 0)",
36
38
  "chart-1": "oklch(0.546 0.245 262.88)",
37
39
  "chart-2": "oklch(0.581 0.118 184.7)",
38
40
  "chart-3": "oklch(0.398 0.07 227.39)",
@@ -129,6 +131,8 @@ var tokens = {
129
131
  "media-scrim": "oklch(0.13 0.002 75 / 0.6)",
130
132
  "media-scrim-strong": "oklch(0.13 0.002 75 / 0.8)",
131
133
  "media-foreground": "oklch(0.985 0 0)",
134
+ "scrim": "oklch(0 0 0)",
135
+ "scrim-foreground": "oklch(1 0 0)",
132
136
  "chart-1": "oklch(0.623 0.214 259.81)",
133
137
  "chart-2": "oklch(0.696 0.17 162.48)",
134
138
  "chart-3": "oklch(0.769 0.188 70.08)",
package/dist/tokens.json CHANGED
@@ -32,6 +32,8 @@
32
32
  "media-scrim": "oklch(0.13 0.002 75 / 0.6)",
33
33
  "media-scrim-strong": "oklch(0.13 0.002 75 / 0.8)",
34
34
  "media-foreground": "oklch(0.985 0 0)",
35
+ "scrim": "oklch(0 0 0)",
36
+ "scrim-foreground": "oklch(1 0 0)",
35
37
  "chart-1": "oklch(0.546 0.245 262.88)",
36
38
  "chart-2": "oklch(0.581 0.118 184.7)",
37
39
  "chart-3": "oklch(0.398 0.07 227.39)",
@@ -128,6 +130,8 @@
128
130
  "media-scrim": "oklch(0.13 0.002 75 / 0.6)",
129
131
  "media-scrim-strong": "oklch(0.13 0.002 75 / 0.8)",
130
132
  "media-foreground": "oklch(0.985 0 0)",
133
+ "scrim": "oklch(0 0 0)",
134
+ "scrim-foreground": "oklch(1 0 0)",
131
135
  "chart-1": "oklch(0.623 0.214 259.81)",
132
136
  "chart-2": "oklch(0.696 0.17 162.48)",
133
137
  "chart-3": "oklch(0.769 0.188 70.08)",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@vegastack/design-tokens",
3
- "version": "0.7.49",
3
+ "version": "0.7.78",
4
4
  "description": "VegaStack design tokens (DTCG → Tailwind v4 theme + TS)",
5
5
  "license": "MIT",
6
6
  "repository": {