@guildofgleks/ui 21.7.0 → 21.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.
Files changed (10) hide show
  1. package/CHANGELOG.md +70 -0
  2. package/README.md +10 -0
  3. package/TOKENS.md +3 -3
  4. package/fesm2022/guildofgleks-ui.mjs +14 -10
  5. package/fesm2022/guildofgleks-ui.mjs.map +1 -1
  6. package/package.json +1 -1
  7. package/styles/presets/one-dark.css +5 -0
  8. package/styles/presets/terminal.css +72 -67
  9. package/styles/theme.css +190 -58
  10. package/types/guildofgleks-ui.d.ts +1 -1
package/CHANGELOG.md CHANGED
@@ -4,6 +4,76 @@ All notable changes to `@guildofgleks/ui` are documented here. Format follows
4
4
  [Keep a Changelog](https://keepachangelog.com/en/1.0.0/); this project has not yet
5
5
  reached 1.0, so breaking changes may land in minor versions.
6
6
 
7
+ ## [21.7.1] - 29.08.2026
8
+
9
+ ### Fixed
10
+
11
+ - **A toast now still shows how long it has left when animations are off.** The progress bar was
12
+ switched off along with everything else under `prefers-reduced-motion`, so the toast vanished
13
+ with no warning — the animation was carrying the information. It now runs in `steps(20, end)`:
14
+ the bar still reports the time remaining, in twenty discrete jumps rather than a slide. Nothing
15
+ appears to move, and nothing counts down in silence.
16
+
17
+ - **`gog-textarea`'s scrollbar matches `gog-scroll`.** It cannot _be_ `gog-scroll` — that
18
+ component hides a container's native chrome and draws an overlay thumb over it, and a
19
+ `<textarea>` scrolls its own text, so the overlay would sit on the editing surface and either
20
+ swallow clicks or drift from the content. The real scrollbar is styled from the same
21
+ `--gog-scroll-*` tokens instead, via `scrollbar-width`/`scrollbar-color` in Firefox and
22
+ `::-webkit-scrollbar` in Blink and WebKit. Restyle `gog-scroll` in a theme and this follows.
23
+
24
+ - **`gog-accordion`'s loading skeleton is visible again.** Its placeholders are mixed against
25
+ `--gog-surface-color`, which is what a skeleton normally lies on — but the header strip now
26
+ paints `--gog-accordion-header-bg`, putting a `#261e16` placeholder on a `#241d17` strip on the
27
+ dark theme. Contrast 1.02: the title and chevron placeholders were both invisible while still
28
+ occupying their full 18px in the DOM. The skeleton inside that header is now based on
29
+ `--gog-border-color` instead, the one palette tone guaranteed to sit above the strip.
30
+
31
+ - **Three surfaces that had no visual separation now have one.** All three were reported from a
32
+ dark theme, where a shadow has nothing to darken:
33
+
34
+ - **`gog-table`'s header** painted `--gog-table-surface` — the same colour as the body — so a
35
+ sticky header slid over rows of identical background with only the accent colour and the caps
36
+ to distinguish it. New `--gog-table-header-bg`, defaulting to `--gog-hover-color`.
37
+ - **`gog-accordion`'s header and body** were both `transparent`, making several open items one
38
+ continuous band with a hairline between them. `--gog-accordion-header-bg` now defaults to
39
+ `--gog-hover-color`; the body stays transparent on purpose, so an accordion on a coloured
40
+ surface still sits on that colour. (The token's own comment already claimed the body "reads
41
+ slightly darker than the header" — that was only true under `data-theme="dark"`.)
42
+ - **`elevated` cards and panels were indistinguishable from `outlined` on dark themes.** The
43
+ dark `--gog-panel-shadow` carries a `0 0 0 1px` ring for overlays that need an edge against
44
+ the page — and that ring is exactly what `outlined` draws, so the two variants rendered the
45
+ same. `elevated` now uses a shadow without the ring in the three dark themes (`dark`,
46
+ `one-dark`, `terminal`). Nor does it keep the wide black blur: black haze over a near-black
47
+ page reads as smudge, not lift. Elevation is now stated the way a dark UI states it — a
48
+ hairline of light along the top edge, over a tight, close shadow.
49
+ **No background changed** — `gog-panel` defaults to `elevated`, so tinting that surface would
50
+ have repainted every panel in every app. `--gog-elevated-surface-color` exists as a foundation
51
+ token for a theme that wants to express elevation as a lighter surface instead, and equals
52
+ `--gog-surface-color` unless a theme sets it.
53
+
54
+ - **`gog-select`'s chevron now turns over when the panel opens.** It never did — there was no
55
+ rotation in any state, which looked like a reduced-motion problem and was a missing one:
56
+ `gog-multiselect` and `gog-accordion` both already had it. Only the default chevron rotates; a
57
+ custom icon supplied through the chevron slot keeps the orientation you drew, the same rule
58
+ `gog-accordion` follows. The rotation is a `transform`, so with `prefers-reduced-motion` the
59
+ arrow still points the right way and only the tween is dropped.
60
+
61
+ - **Colours no longer vanish in browsers without `color-mix()`.** 36 tokens in `theme.css` used
62
+ `color-mix()` with no fallback, and **a custom property does not fall back the way an ordinary
63
+ one does**: it accepts almost any value at parse time and only fails when substituted, so a
64
+ second declaration always wins and `var()` on it then resolves to nothing at all. Measured in
65
+ Chrome: an element styled that way with an unsupported function computed `rgba(0, 0, 0, 0)` —
66
+ transparent, not the earlier value. That is why hover fills, focus rings, chips, skeletons and
67
+ slider tracks looked wrong in Samsung Internet and older Firefox: the declarations were not
68
+ falling back, they were disappearing.
69
+
70
+ Every one of those tokens now has a flat palette value, with the mixed value moved into an
71
+ `@supports (color: color-mix(…))` block — the only mechanism that gates a custom property on
72
+ feature support. **Nothing changes in a browser that supports `color-mix()`**; below that line
73
+ the library renders in flat colours: less depth, every surface still legible and every focus
74
+ ring still visible. `package.json` now carries a `browserslist` stating that floor
75
+ (Chrome 111, Firefox 113, Safari 16.2, Samsung Internet 22).
76
+
7
77
  ## [21.7.0] - 29.08.2026
8
78
 
9
79
  ### Added
package/README.md CHANGED
@@ -272,6 +272,16 @@ parent rather than replacing it.
272
272
  the animation frames, so a real off has to reach the TypeScript. It is **off by default**, and
273
273
  every rippling component takes a `ripple` input that beats it in both directions.
274
274
 
275
+ **Under `prefers-reduced-motion: reduce` the ripple does not appear at all** — suppressed
276
+ outright rather than shortened, in CSS and in the controller, so no node is created and no
277
+ listener attached. If you turned it on and see nothing, check that setting before checking your
278
+ config.
279
+
280
+ That is the one place motion is removed entirely, and it is deliberate: a ripple is decoration,
281
+ so losing it costs a user nothing. Everywhere else the rule is the opposite — **reduced motion
282
+ drops the animation, never the information.** A chevron still turns to show a panel is open, a
283
+ toggle still moves; only the tween between the two states goes away.
284
+
275
285
  Icons work the same way — 41 Lucide glyphs ship with the package, and your own register by name:
276
286
 
277
287
  ```ts
package/TOKENS.md CHANGED
@@ -27,8 +27,8 @@ so a theme editor or docs page can enumerate the real tokens instead of copying
27
27
  | Icon & spinner | `--gog-icon-size`, `--gog-icon-stroke-width`, `--gog-spinner-rune-size`, `--gog-spinner-size-lg`, `--gog-spinner-size-md`, `--gog-spinner-size-slg`, `--gog-spinner-size-sm`, `--gog-spinner-size-xsm` |
28
28
  | Toast stack | `--gog-toast-enter-distance`, `--gog-toast-max-width`, `--gog-toast-min-width`, `--gog-toast-shadow`, `--gog-toast-z-index` |
29
29
  | Overlay stacking | `--gog-dropdown-z`, `--gog-spinner-overlay-z` |
30
- | Light palette (also the no-data-theme default) | `--gog-accent-bright`, `--gog-accent-color`, `--gog-accent-dim`, `--gog-accent-pale`, `--gog-accent-text-color`, `--gog-background-color`, `--gog-border-color`, `--gog-danger-color`, `--gog-hover-color`, `--gog-info-color`, `--gog-muted-text-color`, `--gog-panel-shadow`, `--gog-primary-color`, `--gog-secondary-color`, `--gog-spinner-overlay-bg`, `--gog-success-color`, `--gog-surface-color`, `--gog-text-color`, `--gog-warning-color` |
31
- | Derived foundation tokens | `--gog-control-checkbox-padding`, `--gog-control-icon-offset`, `--gog-control-padding-x`, `--gog-control-padding-y`, `--gog-field-float-label-over-gap`, `--gog-field-lg-font-size`, `--gog-field-lg-icon-inset`, `--gog-field-lg-icon-offset`, `--gog-field-lg-padding-x`, `--gog-field-lg-padding-y`, `--gog-field-md-font-size`, `--gog-field-md-icon-inset`, `--gog-field-md-icon-offset`, `--gog-field-md-padding-x`, `--gog-field-md-padding-y`, `--gog-field-slg-icon-inset`, `--gog-field-slg-icon-offset`, `--gog-field-slg-padding-x`, `--gog-field-slg-padding-y`, `--gog-field-sm-font-size`, `--gog-field-sm-icon-inset`, `--gog-field-sm-icon-offset`, `--gog-field-sm-padding-x`, `--gog-field-sm-padding-y`, `--gog-field-xsm-font-size`, `--gog-field-xsm-icon-inset`, `--gog-field-xsm-icon-offset`, `--gog-field-xsm-padding-x`, `--gog-field-xsm-padding-y`, `--gog-panel-radius`, `--gog-space-10`, `--gog-space-12`, `--gog-space-14`, `--gog-space-16`, `--gog-space-18`, `--gog-space-2`, `--gog-space-20`, `--gog-space-24`, `--gog-space-28`, `--gog-space-2xl`, `--gog-space-32`, `--gog-space-4`, `--gog-space-48`, `--gog-space-6`, `--gog-space-8`, `--gog-space-lg`, `--gog-space-md`, `--gog-space-sm`, `--gog-space-xs`, `--gog-toast-gap`, `--gog-toast-stack-padding` |
30
+ | Light palette (also the no-data-theme default) | `--gog-accent-bright`, `--gog-accent-color`, `--gog-accent-dim`, `--gog-accent-pale`, `--gog-accent-text-color`, `--gog-background-color`, `--gog-border-color`, `--gog-card-elevated-shadow`, `--gog-danger-color`, `--gog-hover-color`, `--gog-info-color`, `--gog-muted-text-color`, `--gog-panel-elevated-shadow`, `--gog-panel-shadow`, `--gog-primary-color`, `--gog-secondary-color`, `--gog-spinner-overlay-bg`, `--gog-success-color`, `--gog-surface-color`, `--gog-text-color`, `--gog-warning-color` |
31
+ | Derived foundation tokens | `--gog-control-checkbox-padding`, `--gog-control-icon-offset`, `--gog-control-padding-x`, `--gog-control-padding-y`, `--gog-elevated-surface-color`, `--gog-field-float-label-over-gap`, `--gog-field-lg-font-size`, `--gog-field-lg-icon-inset`, `--gog-field-lg-icon-offset`, `--gog-field-lg-padding-x`, `--gog-field-lg-padding-y`, `--gog-field-md-font-size`, `--gog-field-md-icon-inset`, `--gog-field-md-icon-offset`, `--gog-field-md-padding-x`, `--gog-field-md-padding-y`, `--gog-field-slg-icon-inset`, `--gog-field-slg-icon-offset`, `--gog-field-slg-padding-x`, `--gog-field-slg-padding-y`, `--gog-field-sm-font-size`, `--gog-field-sm-icon-inset`, `--gog-field-sm-icon-offset`, `--gog-field-sm-padding-x`, `--gog-field-sm-padding-y`, `--gog-field-xsm-font-size`, `--gog-field-xsm-icon-inset`, `--gog-field-xsm-icon-offset`, `--gog-field-xsm-padding-x`, `--gog-field-xsm-padding-y`, `--gog-panel-radius`, `--gog-space-10`, `--gog-space-12`, `--gog-space-14`, `--gog-space-16`, `--gog-space-18`, `--gog-space-2`, `--gog-space-20`, `--gog-space-24`, `--gog-space-28`, `--gog-space-2xl`, `--gog-space-32`, `--gog-space-4`, `--gog-space-48`, `--gog-space-6`, `--gog-space-8`, `--gog-space-lg`, `--gog-space-md`, `--gog-space-sm`, `--gog-space-xs`, `--gog-toast-gap`, `--gog-toast-stack-padding` |
32
32
  | Accordion | `--gog-accordion-accent-color`, `--gog-accordion-body-bg`, `--gog-accordion-body-color`, `--gog-accordion-body-font-family`, `--gog-accordion-body-lift`, `--gog-accordion-body-line-height`, `--gog-accordion-body-radius`, `--gog-accordion-body-transition-duration`, `--gog-accordion-border-color`, `--gog-accordion-border-style`, `--gog-accordion-border-width`, `--gog-accordion-chevron-transition-duration`, `--gog-accordion-disabled-opacity`, `--gog-accordion-focus-ring-width`, `--gog-accordion-font-family`, `--gog-accordion-header-bg`, `--gog-accordion-header-gap`, `--gog-accordion-header-text-transform`, `--gog-accordion-hover-bg`, `--gog-accordion-hover-ring`, `--gog-accordion-lg-body-font-size`, `--gog-accordion-lg-body-line-height`, `--gog-accordion-lg-body-padding-bottom`, `--gog-accordion-lg-body-padding-top`, `--gog-accordion-lg-chevron-font-size`, `--gog-accordion-lg-chevron-size`, `--gog-accordion-lg-content-gap`, `--gog-accordion-lg-font-size`, `--gog-accordion-lg-letter-spacing`, `--gog-accordion-lg-padding-x`, `--gog-accordion-lg-padding-y`, `--gog-accordion-md-body-font-size`, `--gog-accordion-md-body-line-height`, `--gog-accordion-md-body-padding-bottom`, `--gog-accordion-md-body-padding-top`, `--gog-accordion-md-chevron-font-size`, `--gog-accordion-md-chevron-size`, `--gog-accordion-md-content-gap`, `--gog-accordion-md-font-size`, `--gog-accordion-md-letter-spacing`, `--gog-accordion-md-padding-x`, `--gog-accordion-md-padding-y`, `--gog-accordion-radius`, `--gog-accordion-slg-body-font-size`, `--gog-accordion-slg-body-line-height`, `--gog-accordion-slg-body-padding-bottom`, `--gog-accordion-slg-body-padding-top`, `--gog-accordion-slg-chevron-font-size`, `--gog-accordion-slg-chevron-size`, `--gog-accordion-slg-content-gap`, `--gog-accordion-slg-font-size`, `--gog-accordion-slg-letter-spacing`, `--gog-accordion-slg-padding-x`, `--gog-accordion-slg-padding-y`, `--gog-accordion-sm-body-font-size`, `--gog-accordion-sm-body-line-height`, `--gog-accordion-sm-body-padding-bottom`, `--gog-accordion-sm-body-padding-top`, `--gog-accordion-sm-chevron-font-size`, `--gog-accordion-sm-chevron-size`, `--gog-accordion-sm-content-gap`, `--gog-accordion-sm-font-size`, `--gog-accordion-sm-letter-spacing`, `--gog-accordion-sm-padding-x`, `--gog-accordion-sm-padding-y`, `--gog-accordion-text-color`, `--gog-accordion-transition-duration`, `--gog-accordion-xsm-body-font-size`, `--gog-accordion-xsm-body-line-height`, `--gog-accordion-xsm-body-padding-bottom`, `--gog-accordion-xsm-body-padding-top`, `--gog-accordion-xsm-chevron-font-size`, `--gog-accordion-xsm-chevron-size`, `--gog-accordion-xsm-content-gap`, `--gog-accordion-xsm-font-size`, `--gog-accordion-xsm-letter-spacing`, `--gog-accordion-xsm-padding-x`, `--gog-accordion-xsm-padding-y` |
33
33
  | Collapsible | `--gog-collapsible-disabled-opacity`, `--gog-collapsible-max-height`, `--gog-collapsible-transition-duration` |
34
34
  | Button | `--gog-button-active-scale`, `--gog-button-border-style`, `--gog-button-border-width`, `--gog-button-disabled-opacity`, `--gog-button-focus-ring-offset`, `--gog-button-focus-ring-width`, `--gog-button-font-family`, `--gog-button-font-weight`, `--gog-button-gap`, `--gog-button-ghost-bg`, `--gog-button-ghost-border`, `--gog-button-ghost-color`, `--gog-button-ghost-hover-bg`, `--gog-button-ghost-hover-color`, `--gog-button-ghost-hover-shadow`, `--gog-button-ghost-shadow`, `--gog-button-ghost-spinner-color`, `--gog-button-letter-spacing`, `--gog-button-lg-font-size`, `--gog-button-lg-padding`, `--gog-button-line-height`, `--gog-button-loading-opacity`, `--gog-button-md-font-size`, `--gog-button-md-padding`, `--gog-button-outline-bg`, `--gog-button-outline-border`, `--gog-button-outline-color`, `--gog-button-outline-hover-bg`, `--gog-button-outline-hover-color`, `--gog-button-outline-hover-shadow`, `--gog-button-outline-shadow`, `--gog-button-outline-spinner-color`, `--gog-button-primary-bg`, `--gog-button-primary-border`, `--gog-button-primary-color`, `--gog-button-primary-hover-bg`, `--gog-button-primary-hover-color`, `--gog-button-primary-hover-shadow`, `--gog-button-primary-shadow`, `--gog-button-primary-spinner-color`, `--gog-button-radius`, `--gog-button-secondary-bg`, `--gog-button-secondary-border`, `--gog-button-secondary-color`, `--gog-button-secondary-hover-bg`, `--gog-button-secondary-hover-color`, `--gog-button-secondary-hover-shadow`, `--gog-button-secondary-shadow`, `--gog-button-secondary-spinner-color`, `--gog-button-slg-font-size`, `--gog-button-slg-padding`, `--gog-button-sm-font-size`, `--gog-button-sm-padding`, `--gog-button-spinner-max-size`, `--gog-button-text-transform`, `--gog-button-transition-duration`, `--gog-button-xsm-font-size`, `--gog-button-xsm-padding` |
@@ -56,7 +56,7 @@ so a theme editor or docs page can enumerate the real tokens instead of copying
56
56
  | Skeleton | `--gog-skeleton-base`, `--gog-skeleton-circle-size-lg`, `--gog-skeleton-circle-size-md`, `--gog-skeleton-circle-size-slg`, `--gog-skeleton-circle-size-sm`, `--gog-skeleton-circle-size-xsm`, `--gog-skeleton-line-gap`, `--gog-skeleton-line-height-lg`, `--gog-skeleton-line-height-md`, `--gog-skeleton-line-height-slg`, `--gog-skeleton-line-height-sm`, `--gog-skeleton-line-height-xsm`, `--gog-skeleton-line-radius`, `--gog-skeleton-pulse-duration`, `--gog-skeleton-pulse-min-opacity`, `--gog-skeleton-radius`, `--gog-skeleton-rect-height-lg`, `--gog-skeleton-rect-height-md`, `--gog-skeleton-rect-height-slg`, `--gog-skeleton-rect-height-sm`, `--gog-skeleton-rect-height-xsm`, `--gog-skeleton-shine`, `--gog-skeleton-short-line-width`, `--gog-skeleton-square-radius`, `--gog-skeleton-wave-duration` |
57
57
  | Slider | `--gog-slider-auto-width`, `--gog-slider-disabled-opacity`, `--gog-slider-error-color`, `--gog-slider-error-font-family`, `--gog-slider-error-font-size`, `--gog-slider-fill-bg`, `--gog-slider-focus-ring`, `--gog-slider-focus-ring-width`, `--gog-slider-gap`, `--gog-slider-label-color`, `--gog-slider-label-font-family`, `--gog-slider-label-font-size`, `--gog-slider-label-letter-spacing`, `--gog-slider-label-text-transform`, `--gog-slider-range-color`, `--gog-slider-range-font-size`, `--gog-slider-thumb-bg`, `--gog-slider-thumb-border`, `--gog-slider-thumb-border-width`, `--gog-slider-thumb-glow-size`, `--gog-slider-thumb-radius`, `--gog-slider-thumb-shadow`, `--gog-slider-thumb-size`, `--gog-slider-track-area-height`, `--gog-slider-track-bg`, `--gog-slider-track-border-color`, `--gog-slider-track-border-style`, `--gog-slider-track-border-width`, `--gog-slider-track-height`, `--gog-slider-track-radius`, `--gog-slider-value-color`, `--gog-slider-value-font-family`, `--gog-slider-value-font-size`, `--gog-slider-value-min-width`, `--gog-slider-vertical-length` |
58
58
  | Spinner | `--gog-spinner-arc-inner-color`, `--gog-spinner-arc-inner-dash`, `--gog-spinner-arc-inner-glow`, `--gog-spinner-arc-inner-opacity`, `--gog-spinner-arc-inner-pulse-opacity`, `--gog-spinner-arc-inner-stroke-compact`, `--gog-spinner-arc-outer-color`, `--gog-spinner-arc-outer-dash`, `--gog-spinner-arc-outer-glow`, `--gog-spinner-arc-outer-pulse-opacity`, `--gog-spinner-diamond-color`, `--gog-spinner-diamond-glow`, `--gog-spinner-diamond-opacity`, `--gog-spinner-glow-color`, `--gog-spinner-overlay-blur`, `--gog-spinner-overlay-fade-duration`, `--gog-spinner-pulse-duration`, `--gog-spinner-ring-duration`, `--gog-spinner-ring-glow`, `--gog-spinner-ring-padding`, `--gog-spinner-rune-color`, `--gog-spinner-rune-font-family`, `--gog-spinner-rune-glow`, `--gog-spinner-rune-pulse-opacity`, `--gog-spinner-spin-duration`, `--gog-spinner-spin-slow-duration`, `--gog-spinner-ticks-duration`, `--gog-spinner-track-color`, `--gog-spinner-track-opacity` |
59
- | Table | `--gog-table-accent-bright`, `--gog-table-accent-color`, `--gog-table-border-color`, `--gog-table-border-style`, `--gog-table-border-width`, `--gog-table-empty-font-size`, `--gog-table-empty-padding`, `--gog-table-focus-ring`, `--gog-table-focus-ring-width`, `--gog-table-font-family`, `--gog-table-footer-gap`, `--gog-table-footer-min-height`, `--gog-table-gap`, `--gog-table-header-font-family`, `--gog-table-header-letter-spacing`, `--gog-table-header-text-transform`, `--gog-table-hover-bg`, `--gog-table-lg-padding-v`, `--gog-table-lg-td-font-size`, `--gog-table-lg-th-font-size`, `--gog-table-loading-opacity`, `--gog-table-loading-padding`, `--gog-table-md-padding-v`, `--gog-table-md-td-font-size`, `--gog-table-md-th-font-size`, `--gog-table-muted-color`, `--gog-table-num-col-width`, `--gog-table-num-font-size`, `--gog-table-numeric-font-family`, `--gog-table-padding-h`, `--gog-table-row-border-width`, `--gog-table-row-transition-duration`, `--gog-table-select-col-width`, `--gog-table-selected-bg`, `--gog-table-slg-padding-v`, `--gog-table-slg-td-font-size`, `--gog-table-slg-th-font-size`, `--gog-table-sm-padding-v`, `--gog-table-sm-td-font-size`, `--gog-table-sm-th-font-size`, `--gog-table-sort-icon-opacity`, `--gog-table-sort-icon-size`, `--gog-table-sort-icon-width`, `--gog-table-surface`, `--gog-table-text-color`, `--gog-table-th-inner-gap`, `--gog-table-total-font-size`, `--gog-table-total-letter-spacing`, `--gog-table-total-text-transform`, `--gog-table-xsm-padding-v`, `--gog-table-xsm-td-font-size`, `--gog-table-xsm-th-font-size` |
59
+ | Table | `--gog-table-accent-bright`, `--gog-table-accent-color`, `--gog-table-border-color`, `--gog-table-border-style`, `--gog-table-border-width`, `--gog-table-empty-font-size`, `--gog-table-empty-padding`, `--gog-table-focus-ring`, `--gog-table-focus-ring-width`, `--gog-table-font-family`, `--gog-table-footer-gap`, `--gog-table-footer-min-height`, `--gog-table-gap`, `--gog-table-header-bg`, `--gog-table-header-font-family`, `--gog-table-header-letter-spacing`, `--gog-table-header-text-transform`, `--gog-table-hover-bg`, `--gog-table-lg-padding-v`, `--gog-table-lg-td-font-size`, `--gog-table-lg-th-font-size`, `--gog-table-loading-opacity`, `--gog-table-loading-padding`, `--gog-table-md-padding-v`, `--gog-table-md-td-font-size`, `--gog-table-md-th-font-size`, `--gog-table-muted-color`, `--gog-table-num-col-width`, `--gog-table-num-font-size`, `--gog-table-numeric-font-family`, `--gog-table-padding-h`, `--gog-table-row-border-width`, `--gog-table-row-transition-duration`, `--gog-table-select-col-width`, `--gog-table-selected-bg`, `--gog-table-slg-padding-v`, `--gog-table-slg-td-font-size`, `--gog-table-slg-th-font-size`, `--gog-table-sm-padding-v`, `--gog-table-sm-td-font-size`, `--gog-table-sm-th-font-size`, `--gog-table-sort-icon-opacity`, `--gog-table-sort-icon-size`, `--gog-table-sort-icon-width`, `--gog-table-surface`, `--gog-table-text-color`, `--gog-table-th-inner-gap`, `--gog-table-total-font-size`, `--gog-table-total-letter-spacing`, `--gog-table-total-text-transform`, `--gog-table-xsm-padding-v`, `--gog-table-xsm-td-font-size`, `--gog-table-xsm-th-font-size` |
60
60
  | Tabs | `--gog-tabs-active-color`, `--gog-tabs-disabled-opacity`, `--gog-tabs-focus-ring-color`, `--gog-tabs-focus-ring-offset`, `--gog-tabs-focus-ring-width`, `--gog-tabs-font-family`, `--gog-tabs-font-weight`, `--gog-tabs-gap`, `--gog-tabs-header-border-color`, `--gog-tabs-header-border-style`, `--gog-tabs-header-border-width`, `--gog-tabs-hover-color`, `--gog-tabs-icon-size`, `--gog-tabs-indicator-color`, `--gog-tabs-indicator-radius`, `--gog-tabs-indicator-thickness`, `--gog-tabs-letter-spacing`, `--gog-tabs-lg-font-size`, `--gog-tabs-lg-padding`, `--gog-tabs-line-height`, `--gog-tabs-md-font-size`, `--gog-tabs-md-padding`, `--gog-tabs-panel-color`, `--gog-tabs-panel-padding`, `--gog-tabs-rest-bg`, `--gog-tabs-rest-color`, `--gog-tabs-slg-font-size`, `--gog-tabs-slg-padding`, `--gog-tabs-sm-font-size`, `--gog-tabs-sm-padding`, `--gog-tabs-tab-gap`, `--gog-tabs-text-transform`, `--gog-tabs-transition-duration`, `--gog-tabs-xsm-font-size`, `--gog-tabs-xsm-padding` |
61
61
  | Tag | `--gog-tag-bg-base`, `--gog-tag-bg-mix`, `--gog-tag-border-style`, `--gog-tag-border-width`, `--gog-tag-color-base`, `--gog-tag-color-mix`, `--gog-tag-danger-color`, `--gog-tag-default-color`, `--gog-tag-font-family`, `--gog-tag-font-weight`, `--gog-tag-info-color`, `--gog-tag-inner-border-width`, `--gog-tag-lg-font-size`, `--gog-tag-lg-gap`, `--gog-tag-lg-icon-size`, `--gog-tag-lg-padding-block`, `--gog-tag-lg-padding-inline`, `--gog-tag-line-height`, `--gog-tag-md-font-size`, `--gog-tag-md-gap`, `--gog-tag-md-icon-size`, `--gog-tag-md-padding-block`, `--gog-tag-md-padding-inline`, `--gog-tag-pill-radius`, `--gog-tag-radius`, `--gog-tag-slg-font-size`, `--gog-tag-slg-gap`, `--gog-tag-slg-icon-size`, `--gog-tag-slg-padding-block`, `--gog-tag-slg-padding-inline`, `--gog-tag-sm-font-size`, `--gog-tag-sm-gap`, `--gog-tag-sm-icon-size`, `--gog-tag-sm-padding-block`, `--gog-tag-sm-padding-inline`, `--gog-tag-success-color`, `--gog-tag-warning-color`, `--gog-tag-xsm-font-size`, `--gog-tag-xsm-gap`, `--gog-tag-xsm-icon-size`, `--gog-tag-xsm-padding-block`, `--gog-tag-xsm-padding-inline` |
62
62
  | Toast | `--gog-toast-accent-width`, `--gog-toast-action-font-size`, `--gog-toast-action-padding`, `--gog-toast-actions-gap`, `--gog-toast-base-z`, `--gog-toast-bg`, `--gog-toast-border`, `--gog-toast-close-font-size`, `--gog-toast-close-padding`, `--gog-toast-color`, `--gog-toast-content-gap`, `--gog-toast-error-color`, `--gog-toast-font-family`, `--gog-toast-icon-color`, `--gog-toast-icon-line-height`, `--gog-toast-icon-size`, `--gog-toast-info-color`, `--gog-toast-main-gap`, `--gog-toast-message-font-size`, `--gog-toast-message-line-height`, `--gog-toast-padding`, `--gog-toast-progress-height`, `--gog-toast-progress-opacity`, `--gog-toast-radius`, `--gog-toast-stack-expanded-gap`, `--gog-toast-stack-max-depth`, `--gog-toast-stack-min-opacity`, `--gog-toast-stack-opacity-step`, `--gog-toast-stack-peek`, `--gog-toast-stack-scale-step`, `--gog-toast-success-color`, `--gog-toast-transition-duration`, `--gog-toast-warning-color` |