@guildofgleks/ui 21.4.4 → 21.5.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.
- package/AGENTS.md +124 -22
- package/CHANGELOG.md +197 -17
- package/README.md +42 -22
- package/TOKENS.md +44 -44
- package/fesm2022/guildofgleks-ui.mjs +2017 -386
- package/fesm2022/guildofgleks-ui.mjs.map +1 -1
- package/package.json +9 -10
- package/styles/button.css +112 -79
- package/styles/index.css +2 -0
- package/styles/menu.css +95 -0
- package/styles/theme.css +301 -235
- package/styles/utilities.css +27 -0
- package/types/guildofgleks-ui.d.ts +237 -141
- package/src/styles/button.css +0 -193
- package/src/styles/fonts.css +0 -16
- package/src/styles/index.css +0 -19
- package/src/styles/presets/one-dark.css +0 -48
- package/src/styles/presets/one-light.css +0 -47
- package/src/styles/presets/slate.css +0 -55
- package/src/styles/theme.css +0 -1702
- package/src/styles/typography.css +0 -15
- package/src/styles/utilities.css +0 -185
package/TOKENS.md
CHANGED
|
@@ -15,49 +15,49 @@ so a theme editor or docs page can enumerate the real tokens instead of copying
|
|
|
15
15
|
<!-- tokens:start -->
|
|
16
16
|
<!-- GENERATED by scripts/generate-tokens.mjs from src/styles/theme.css — do not edit by hand. -->
|
|
17
17
|
|
|
18
|
-
| Group | Tokens
|
|
19
|
-
| ---------------------------------------------------------------------------- |
|
|
20
|
-
| Typography | `--gog-font-body`, `--gog-font-heading`, `--gog-font-mono`, `--gog-text-2xl`, `--gog-text-3xl`, `--gog-text-lg`, `--gog-text-md`, `--gog-text-sm`, `--gog-text-xl`, `--gog-text-xs`
|
|
21
|
-
| Spacing & geometry | `--gog-panel-border-style`, `--gog-panel-border-width`, `--gog-radius`, `--gog-space-2xl`, `--gog-space-lg`, `--gog-space-md`, `--gog-space-sm`, `--gog-space-xs`
|
|
22
|
-
| Motion | `--gog-duration-base`, `--gog-duration-fast`, `--gog-duration-slow`, `--gog-easing`
|
|
23
|
-
| Focus & disabled | `--gog-disabled-opacity`, `--gog-focus-ring-offset`, `--gog-focus-ring-width`
|
|
24
|
-
| Control metrics | `--gog-control-border-style`, `--gog-control-border-width`, `--gog-control-checkbox-box-size-lg`, `--gog-control-checkbox-box-size-md`, `--gog-control-checkbox-box-size-slg`, `--gog-control-checkbox-box-size-sm`, `--gog-control-checkbox-box-size-xsm`, `--gog-control-checkbox-icon-size-lg`, `--gog-control-checkbox-icon-size-md`, `--gog-control-checkbox-icon-size-slg`, `--gog-control-checkbox-icon-size-sm`, `--gog-control-checkbox-icon-size-xsm`, `--gog-control-checkbox-label-size-lg`, `--gog-control-checkbox-label-size-md`, `--gog-control-checkbox-label-size-slg`, `--gog-control-checkbox-label-size-sm`, `--gog-control-checkbox-label-size-xsm`, `--gog-control-checkbox-padding`, `--gog-control-icon-offset`, `--gog-control-padding-x`, `--gog-control-padding-y`
|
|
25
|
-
|
|
|
26
|
-
|
|
|
27
|
-
|
|
|
28
|
-
|
|
|
29
|
-
|
|
|
30
|
-
|
|
|
31
|
-
|
|
|
32
|
-
|
|
|
33
|
-
|
|
|
34
|
-
|
|
|
35
|
-
| Button
|
|
36
|
-
|
|
|
37
|
-
|
|
|
38
|
-
|
|
|
39
|
-
|
|
|
40
|
-
|
|
|
41
|
-
|
|
|
42
|
-
|
|
|
43
|
-
|
|
|
44
|
-
|
|
|
45
|
-
|
|
|
46
|
-
|
|
|
47
|
-
|
|
|
48
|
-
|
|
|
49
|
-
| Paginator | `--gog-paginator-ellipsis-color`, `--gog-paginator-ellipsis-font-family`, `--gog-paginator-ellipsis-font-size`, `--gog-paginator-ellipsis-min-width`, `--gog-paginator-gap`, `--gog-paginator-page-size-min-width`
|
|
50
|
-
| Progressbar | `--gog-progressbar-accent-bg`, `--gog-progressbar-accent-buffer-bg`, `--gog-progressbar-danger-bg`, `--gog-progressbar-danger-buffer-bg`, `--gog-progressbar-indeterminate-duration`, `--gog-progressbar-indeterminate-easing`, `--gog-progressbar-info-bg`, `--gog-progressbar-info-buffer-bg`, `--gog-progressbar-lg-height`, `--gog-progressbar-md-height`, `--gog-progressbar-radius`, `--gog-progressbar-slg-height`, `--gog-progressbar-sm-height`, `--gog-progressbar-stripe-color`, `--gog-progressbar-stripe-size`, `--gog-progressbar-success-bg`, `--gog-progressbar-success-buffer-bg`, `--gog-progressbar-track-base-bg`, `--gog-progressbar-transition-duration`, `--gog-progressbar-value-color`, `--gog-progressbar-value-font-family`, `--gog-progressbar-value-font-size`, `--gog-progressbar-value-gap`, `--gog-progressbar-value-min-width`, `--gog-progressbar-warning-bg`, `--gog-progressbar-warning-buffer-bg`, `--gog-progressbar-xsm-height`
|
|
51
|
-
| Scroll | `--gog-scroll-corner-bg`, `--gog-scroll-fade-duration`, `--gog-scroll-focus-ring`, `--gog-scroll-focus-ring-width`, `--gog-scroll-normal-thumb-hit-padding`, `--gog-scroll-normal-thumb-min-size`, `--gog-scroll-normal-track-width`, `--gog-scroll-thin-thumb-hit-padding`, `--gog-scroll-thin-thumb-min-size`, `--gog-scroll-thin-track-width`, `--gog-scroll-thumb-active-bg`, `--gog-scroll-thumb-bg`, `--gog-scroll-thumb-hover-bg`, `--gog-scroll-thumb-inset`, `--gog-scroll-thumb-radius`, `--gog-scroll-track-bg`, `--gog-scroll-track-radius`
|
|
52
|
-
| Select | `--gog-select-chevron-color`, `--gog-select-chevron-icon-ratio`, `--gog-select-chevron-inset`, `--gog-select-clear-color`, `--gog-select-clear-gap`, `--gog-select-clear-hover-color`, `--gog-select-clear-icon-ratio`, `--gog-select-clear-radius`, `--gog-select-control-gap`, `--gog-select-disabled-opacity`, `--gog-select-error-color`, `--gog-select-error-font-size`, `--gog-select-field-bg`, `--gog-select-field-border`, `--gog-select-field-border-style`, `--gog-select-field-border-width`, `--gog-select-field-color`, `--gog-select-filter-border-color`, `--gog-select-filter-border-style`, `--gog-select-filter-border-width`, `--gog-select-filter-empty-color`, `--gog-select-filter-empty-padding`, `--gog-select-filter-input-bg`, `--gog-select-filter-input-border`, `--gog-select-filter-input-color`, `--gog-select-filter-input-padding-x`, `--gog-select-filter-input-padding-y`, `--gog-select-filter-input-radius`, `--gog-select-filter-padding`, `--gog-select-float-label-in-top`, `--gog-select-float-label-over-gap`, `--gog-select-float-label-over-reserve`, `--gog-select-float-label-reserve`, `--gog-select-focus-border`, `--gog-select-focus-glow`, `--gog-select-focus-ring`, `--gog-select-focus-ring-offset`, `--gog-select-focus-ring-width`, `--gog-select-font-family`, `--gog-select-gap`, `--gog-select-label-color`, `--gog-select-label-font-family`, `--gog-select-label-font-size`, `--gog-select-label-letter-spacing`, `--gog-select-label-text-transform`, `--gog-select-mark-icon-ratio`, `--gog-select-mark-size-ratio`, `--gog-select-min-width`, `--gog-select-option-color`, `--gog-select-option-disabled-opacity`, `--gog-select-option-gap`, `--gog-select-option-height`, `--gog-select-option-hover-bg`, `--gog-select-option-selected-color`, `--gog-select-option-transition-duration`, `--gog-select-panel-bg`, `--gog-select-panel-max-height`, `--gog-select-panel-max-width`, `--gog-select-panel-offset`, `--gog-select-panel-shadow`, `--gog-select-placeholder-color`, `--gog-select-radius`, `--gog-select-transition-duration`
|
|
53
|
-
| 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`
|
|
54
|
-
| 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`
|
|
55
|
-
| 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`
|
|
56
|
-
| 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`
|
|
57
|
-
| 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`
|
|
58
|
-
| 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`
|
|
59
|
-
| 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`
|
|
60
|
-
| Toggle | `--gog-toggle-border-color`, `--gog-toggle-border-style`, `--gog-toggle-border-width`, `--gog-toggle-disabled-opacity`, `--gog-toggle-focus-ring-color`, `--gog-toggle-focus-ring-offset`, `--gog-toggle-focus-ring-width`, `--gog-toggle-font-family`, `--gog-toggle-gap`, `--gog-toggle-label-color`, `--gog-toggle-label-line-height`, `--gog-toggle-lg-label-size`, `--gog-toggle-lg-state-font-size`, `--gog-toggle-lg-thumb-size`, `--gog-toggle-lg-track-height`, `--gog-toggle-lg-track-width`, `--gog-toggle-md-label-size`, `--gog-toggle-md-state-font-size`, `--gog-toggle-md-thumb-size`, `--gog-toggle-md-track-height`, `--gog-toggle-md-track-width`, `--gog-toggle-on-border-color`, `--gog-toggle-radius`, `--gog-toggle-slg-label-size`, `--gog-toggle-slg-state-font-size`, `--gog-toggle-slg-thumb-size`, `--gog-toggle-slg-track-height`, `--gog-toggle-slg-track-width`, `--gog-toggle-sm-label-size`, `--gog-toggle-sm-state-font-size`, `--gog-toggle-sm-thumb-size`, `--gog-toggle-sm-track-height`, `--gog-toggle-sm-track-width`, `--gog-toggle-state-color`, `--gog-toggle-state-font-weight`, `--gog-toggle-state-letter-spacing`, `--gog-toggle-state-offset`, `--gog-toggle-state-padding-inline`, `--gog-toggle-state-thumb-gap`, `--gog-toggle-thumb-inset`, `--gog-toggle-thumb-off-bg`, `--gog-toggle-thumb-on-bg`, `--gog-toggle-thumb-shadow`, `--gog-toggle-track-off-bg`, `--gog-toggle-track-on-bg`, `--gog-toggle-transition-duration`, `--gog-toggle-xsm-label-size`, `--gog-toggle-xsm-state-font-size`, `--gog-toggle-xsm-thumb-size`, `--gog-toggle-xsm-track-height`, `--gog-toggle-xsm-track-width`
|
|
61
|
-
| Tooltip | `--gog-tooltip-arrow-size`, `--gog-tooltip-bg`, `--gog-tooltip-border-color`, `--gog-tooltip-border-style`, `--gog-tooltip-border-width`, `--gog-tooltip-color`, `--gog-tooltip-font-family`, `--gog-tooltip-font-size`, `--gog-tooltip-gap`, `--gog-tooltip-line-height`, `--gog-tooltip-max-height`, `--gog-tooltip-max-width`, `--gog-tooltip-padding`, `--gog-tooltip-radius`, `--gog-tooltip-shadow`, `--gog-tooltip-transition-duration`, `--gog-tooltip-z`
|
|
18
|
+
| Group | Tokens |
|
|
19
|
+
| ---------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
|
20
|
+
| Typography | `--gog-font-body`, `--gog-font-heading`, `--gog-font-mono`, `--gog-text-2xl`, `--gog-text-3xl`, `--gog-text-lg`, `--gog-text-md`, `--gog-text-sm`, `--gog-text-xl`, `--gog-text-xs` |
|
|
21
|
+
| Spacing & geometry | `--gog-panel-border-style`, `--gog-panel-border-width`, `--gog-radius`, `--gog-space-2xl`, `--gog-space-lg`, `--gog-space-md`, `--gog-space-sm`, `--gog-space-xs` |
|
|
22
|
+
| Motion | `--gog-duration-base`, `--gog-duration-fast`, `--gog-duration-slow`, `--gog-easing` |
|
|
23
|
+
| Focus & disabled | `--gog-disabled-opacity`, `--gog-focus-ring-offset`, `--gog-focus-ring-width` |
|
|
24
|
+
| Control metrics | `--gog-control-border-style`, `--gog-control-border-width`, `--gog-control-checkbox-box-size-lg`, `--gog-control-checkbox-box-size-md`, `--gog-control-checkbox-box-size-slg`, `--gog-control-checkbox-box-size-sm`, `--gog-control-checkbox-box-size-xsm`, `--gog-control-checkbox-icon-size-lg`, `--gog-control-checkbox-icon-size-md`, `--gog-control-checkbox-icon-size-slg`, `--gog-control-checkbox-icon-size-sm`, `--gog-control-checkbox-icon-size-xsm`, `--gog-control-checkbox-label-size-lg`, `--gog-control-checkbox-label-size-md`, `--gog-control-checkbox-label-size-slg`, `--gog-control-checkbox-label-size-sm`, `--gog-control-checkbox-label-size-xsm`, `--gog-control-checkbox-padding`, `--gog-control-icon-offset`, `--gog-control-padding-x`, `--gog-control-padding-y` |
|
|
25
|
+
| Field sizing (input / select / multiselect share one scale) | `--gog-field-lg-icon-inset`, `--gog-field-lg-icon-offset`, `--gog-field-lg-padding-x`, `--gog-field-lg-padding-y`, `--gog-field-md-icon-inset`, `--gog-field-slg-font-size`, `--gog-field-slg-icon-inset`, `--gog-field-slg-icon-offset`, `--gog-field-slg-padding-x`, `--gog-field-slg-padding-y`, `--gog-field-sm-icon-inset`, `--gog-field-sm-icon-offset`, `--gog-field-sm-padding-x`, `--gog-field-sm-padding-y`, `--gog-field-xsm-icon-inset`, `--gog-field-xsm-icon-offset`, `--gog-field-xsm-padding-x`, `--gog-field-xsm-padding-y` |
|
|
26
|
+
| Float label geometry (input / textarea / select / multiselect) | `--gog-field-float-label-in-top`, `--gog-field-float-label-over-gap`, `--gog-field-float-label-over-reserve`, `--gog-field-float-label-reserve` |
|
|
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
|
+
| Toast stack | `--gog-toast-enter-distance`, `--gog-toast-gap`, `--gog-toast-max-width`, `--gog-toast-min-width`, `--gog-toast-shadow`, `--gog-toast-stack-padding`, `--gog-toast-z-index` |
|
|
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-field-lg-font-size`, `--gog-field-md-font-size`, `--gog-field-md-icon-offset`, `--gog-field-md-padding-x`, `--gog-field-md-padding-y`, `--gog-field-sm-font-size`, `--gog-field-xsm-font-size`, `--gog-panel-radius` |
|
|
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
|
+
| Collapsible | `--gog-collapsible-disabled-opacity`, `--gog-collapsible-max-height`, `--gog-collapsible-transition-duration` |
|
|
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` |
|
|
35
|
+
| Button toggle group | `--gog-button-toggle-border-color`, `--gog-button-toggle-border-style`, `--gog-button-toggle-border-width`, `--gog-button-toggle-disabled-opacity`, `--gog-button-toggle-focus-ring-color`, `--gog-button-toggle-focus-ring-offset`, `--gog-button-toggle-focus-ring-width`, `--gog-button-toggle-font-family`, `--gog-button-toggle-font-weight`, `--gog-button-toggle-gap`, `--gog-button-toggle-hover-bg`, `--gog-button-toggle-hover-color`, `--gog-button-toggle-icon-size`, `--gog-button-toggle-letter-spacing`, `--gog-button-toggle-line-height`, `--gog-button-toggle-radius`, `--gog-button-toggle-rest-bg`, `--gog-button-toggle-rest-color`, `--gog-button-toggle-selected-bg`, `--gog-button-toggle-selected-border-color`, `--gog-button-toggle-selected-color`, `--gog-button-toggle-separated-gap`, `--gog-button-toggle-text-transform`, `--gog-button-toggle-transition-duration` |
|
|
36
|
+
| Calendar (the month grid inside gog-datepicker, and gog-calendar on its own) | `--gog-calendar-action-padding`, `--gog-calendar-color`, `--gog-calendar-day-border-style`, `--gog-calendar-day-border-width`, `--gog-calendar-day-hover-bg`, `--gog-calendar-day-outside-color`, `--gog-calendar-day-radius`, `--gog-calendar-day-rest-bg`, `--gog-calendar-day-rest-color`, `--gog-calendar-disabled-opacity`, `--gog-calendar-divider-color`, `--gog-calendar-divider-style`, `--gog-calendar-divider-width`, `--gog-calendar-focus-ring-color`, `--gog-calendar-focus-ring-offset`, `--gog-calendar-focus-ring-width`, `--gog-calendar-font-family`, `--gog-calendar-footer-gap`, `--gog-calendar-header-gap`, `--gog-calendar-header-margin`, `--gog-calendar-lg-day-size`, `--gog-calendar-lg-font-size`, `--gog-calendar-max-width`, `--gog-calendar-md-day-size`, `--gog-calendar-md-font-size`, `--gog-calendar-months-gap`, `--gog-calendar-nav-bg`, `--gog-calendar-nav-color`, `--gog-calendar-nav-hover-bg`, `--gog-calendar-nav-hover-color`, `--gog-calendar-nav-icon-overlap`, `--gog-calendar-nav-icon-size`, `--gog-calendar-nav-radius`, `--gog-calendar-nav-size`, `--gog-calendar-padding`, `--gog-calendar-range-bg`, `--gog-calendar-range-color`, `--gog-calendar-selected-bg`, `--gog-calendar-selected-color`, `--gog-calendar-selected-font-weight`, `--gog-calendar-slg-day-size`, `--gog-calendar-slg-font-size`, `--gog-calendar-sm-day-size`, `--gog-calendar-sm-font-size`, `--gog-calendar-time-gap`, `--gog-calendar-time-input-bg`, `--gog-calendar-time-input-padding`, `--gog-calendar-time-input-width`, `--gog-calendar-time-margin`, `--gog-calendar-title-color`, `--gog-calendar-title-font-weight`, `--gog-calendar-today-border-color`, `--gog-calendar-today-font-weight`, `--gog-calendar-transition-duration`, `--gog-calendar-weekday-color`, `--gog-calendar-weekday-font-size`, `--gog-calendar-weekday-font-weight`, `--gog-calendar-weekday-padding`, `--gog-calendar-weekday-text-transform`, `--gog-calendar-xsm-day-size`, `--gog-calendar-xsm-font-size` |
|
|
37
|
+
| Checkbox | `--gog-checkbox-bg`, `--gog-checkbox-border-color`, `--gog-checkbox-border-style`, `--gog-checkbox-border-width`, `--gog-checkbox-checked-bg`, `--gog-checkbox-checked-border`, `--gog-checkbox-dash-height`, `--gog-checkbox-dash-radius`, `--gog-checkbox-dash-width-ratio`, `--gog-checkbox-disabled-opacity`, `--gog-checkbox-focus-ring`, `--gog-checkbox-focus-ring-offset`, `--gog-checkbox-focus-ring-width`, `--gog-checkbox-font-family`, `--gog-checkbox-gap`, `--gog-checkbox-icon-color`, `--gog-checkbox-label-color`, `--gog-checkbox-label-line-height`, `--gog-checkbox-radius`, `--gog-checkbox-transition-duration` |
|
|
38
|
+
| Radio group | `--gog-radio-bg`, `--gog-radio-border-color`, `--gog-radio-border-style`, `--gog-radio-border-width`, `--gog-radio-checked-bg`, `--gog-radio-checked-border`, `--gog-radio-disabled-opacity`, `--gog-radio-dot-color`, `--gog-radio-dot-size-ratio`, `--gog-radio-error-color`, `--gog-radio-error-font-size`, `--gog-radio-focus-ring`, `--gog-radio-focus-ring-offset`, `--gog-radio-focus-ring-width`, `--gog-radio-font-family`, `--gog-radio-gap`, `--gog-radio-group-gap`, `--gog-radio-group-label-color`, `--gog-radio-group-label-size`, `--gog-radio-group-option-gap`, `--gog-radio-group-option-gap-horizontal`, `--gog-radio-label-color`, `--gog-radio-label-line-height`, `--gog-radio-transition-duration` |
|
|
39
|
+
| Chip | `--gog-chip-avatar-inset-ratio`, `--gog-chip-bg`, `--gog-chip-border`, `--gog-chip-border-style`, `--gog-chip-border-width`, `--gog-chip-color`, `--gog-chip-disabled-opacity`, `--gog-chip-focus-ring-offset`, `--gog-chip-focus-ring-width`, `--gog-chip-font-family`, `--gog-chip-font-weight`, `--gog-chip-hover-bg`, `--gog-chip-lg-avatar-size`, `--gog-chip-lg-font-size`, `--gog-chip-lg-gap`, `--gog-chip-lg-icon-size`, `--gog-chip-lg-padding-block`, `--gog-chip-lg-padding-inline`, `--gog-chip-lg-remove-size`, `--gog-chip-line-height`, `--gog-chip-md-avatar-size`, `--gog-chip-md-font-size`, `--gog-chip-md-gap`, `--gog-chip-md-icon-size`, `--gog-chip-md-padding-block`, `--gog-chip-md-padding-inline`, `--gog-chip-md-remove-size`, `--gog-chip-pill-radius`, `--gog-chip-radius`, `--gog-chip-remove-color`, `--gog-chip-remove-hover-color`, `--gog-chip-remove-inset-ratio`, `--gog-chip-remove-scale`, `--gog-chip-slg-avatar-size`, `--gog-chip-slg-font-size`, `--gog-chip-slg-gap`, `--gog-chip-slg-icon-size`, `--gog-chip-slg-padding-block`, `--gog-chip-slg-padding-inline`, `--gog-chip-slg-remove-size`, `--gog-chip-sm-avatar-size`, `--gog-chip-sm-font-size`, `--gog-chip-sm-gap`, `--gog-chip-sm-icon-size`, `--gog-chip-sm-padding-block`, `--gog-chip-sm-padding-inline`, `--gog-chip-sm-remove-size`, `--gog-chip-xsm-avatar-size`, `--gog-chip-xsm-font-size`, `--gog-chip-xsm-gap`, `--gog-chip-xsm-icon-size`, `--gog-chip-xsm-padding-block`, `--gog-chip-xsm-padding-inline`, `--gog-chip-xsm-remove-size` |
|
|
40
|
+
| Dialog | `--gog-confirmation-dialog-actions-gap`, `--gog-confirmation-dialog-actions-offset`, `--gog-confirmation-dialog-color`, `--gog-confirmation-dialog-description-color`, `--gog-confirmation-dialog-gap`, `--gog-confirmation-dialog-max-width`, `--gog-confirmation-dialog-min-width`, `--gog-dialog-backdrop-bg`, `--gog-dialog-backdrop-blur`, `--gog-dialog-backdrop-fade-duration`, `--gog-dialog-backdrop-padding`, `--gog-dialog-bg`, `--gog-dialog-body-max-height`, `--gog-dialog-body-padding`, `--gog-dialog-border`, `--gog-dialog-border-style`, `--gog-dialog-border-width`, `--gog-dialog-close-color`, `--gog-dialog-close-focus-ring`, `--gog-dialog-close-focus-ring-offset`, `--gog-dialog-close-focus-ring-width`, `--gog-dialog-close-font-size`, `--gog-dialog-close-hover-bg`, `--gog-dialog-close-hover-border`, `--gog-dialog-close-hover-color`, `--gog-dialog-close-size`, `--gog-dialog-color`, `--gog-dialog-enter-distance`, `--gog-dialog-enter-duration`, `--gog-dialog-font-family`, `--gog-dialog-header-border-color`, `--gog-dialog-header-gap`, `--gog-dialog-header-padding`, `--gog-dialog-max-height`, `--gog-dialog-min-width`, `--gog-dialog-radius`, `--gog-dialog-shadow` |
|
|
41
|
+
| Autocomplete | `--gog-autocomplete-actions-gap`, `--gog-autocomplete-actions-inset`, `--gog-autocomplete-actions-reserve`, `--gog-autocomplete-border-color`, `--gog-autocomplete-border-style`, `--gog-autocomplete-border-width`, `--gog-autocomplete-clear-color`, `--gog-autocomplete-clear-hover-color`, `--gog-autocomplete-clear-icon-ratio`, `--gog-autocomplete-disabled-opacity`, `--gog-autocomplete-empty-color`, `--gog-autocomplete-empty-font-size`, `--gog-autocomplete-error-border-color`, `--gog-autocomplete-error-color`, `--gog-autocomplete-error-font-family`, `--gog-autocomplete-error-font-size`, `--gog-autocomplete-field-bg`, `--gog-autocomplete-float-label-in-top`, `--gog-autocomplete-float-label-over-gap`, `--gog-autocomplete-float-label-over-reserve`, `--gog-autocomplete-float-label-reserve`, `--gog-autocomplete-focus-ring-color`, `--gog-autocomplete-focus-ring-offset`, `--gog-autocomplete-focus-ring-width`, `--gog-autocomplete-font-family`, `--gog-autocomplete-gap`, `--gog-autocomplete-hover-border-color`, `--gog-autocomplete-label-color`, `--gog-autocomplete-label-font-family`, `--gog-autocomplete-label-font-size`, `--gog-autocomplete-label-font-weight`, `--gog-autocomplete-label-letter-spacing`, `--gog-autocomplete-label-text-transform`, `--gog-autocomplete-line-height`, `--gog-autocomplete-min-width`, `--gog-autocomplete-option-color`, `--gog-autocomplete-option-gap`, `--gog-autocomplete-option-height`, `--gog-autocomplete-option-hover-bg`, `--gog-autocomplete-option-hover-color`, `--gog-autocomplete-option-padding`, `--gog-autocomplete-option-radius`, `--gog-autocomplete-option-selected-bg`, `--gog-autocomplete-option-selected-color`, `--gog-autocomplete-options-padding`, `--gog-autocomplete-panel-bg`, `--gog-autocomplete-panel-border-color`, `--gog-autocomplete-panel-border-style`, `--gog-autocomplete-panel-border-width`, `--gog-autocomplete-panel-gap`, `--gog-autocomplete-panel-max-height`, `--gog-autocomplete-panel-max-width`, `--gog-autocomplete-panel-radius`, `--gog-autocomplete-panel-shadow`, `--gog-autocomplete-placeholder-color`, `--gog-autocomplete-radius`, `--gog-autocomplete-spinner-size`, `--gog-autocomplete-text-color`, `--gog-autocomplete-transition-duration` |
|
|
42
|
+
| Badge (the `gogBadge` directive; its classes live in utilities.css) | `--gog-badge-border-color`, `--gog-badge-border-style`, `--gog-badge-border-width`, `--gog-badge-danger-bg`, `--gog-badge-danger-color`, `--gog-badge-dot-size`, `--gog-badge-font-family`, `--gog-badge-font-size`, `--gog-badge-font-weight`, `--gog-badge-info-bg`, `--gog-badge-info-color`, `--gog-badge-line-height`, `--gog-badge-offset`, `--gog-badge-padding-inline`, `--gog-badge-radius`, `--gog-badge-size`, `--gog-badge-success-bg`, `--gog-badge-success-color`, `--gog-badge-warning-bg`, `--gog-badge-warning-color`, `--gog-badge-z` |
|
|
43
|
+
| Datepicker (the field; the grid inside it is themed by --gog-calendar-*) | `--gog-datepicker-actions-gap`, `--gog-datepicker-actions-inset`, `--gog-datepicker-actions-reserve`, `--gog-datepicker-border-color`, `--gog-datepicker-border-style`, `--gog-datepicker-border-width`, `--gog-datepicker-clear-color`, `--gog-datepicker-clear-icon-ratio`, `--gog-datepicker-disabled-opacity`, `--gog-datepicker-error-border-color`, `--gog-datepicker-error-color`, `--gog-datepicker-error-font-family`, `--gog-datepicker-error-font-size`, `--gog-datepicker-field-bg`, `--gog-datepicker-float-label-in-top`, `--gog-datepicker-float-label-over-gap`, `--gog-datepicker-float-label-over-reserve`, `--gog-datepicker-float-label-reserve`, `--gog-datepicker-focus-ring-color`, `--gog-datepicker-focus-ring-offset`, `--gog-datepicker-focus-ring-width`, `--gog-datepicker-font-family`, `--gog-datepicker-gap`, `--gog-datepicker-hover-border-color`, `--gog-datepicker-icon-color`, `--gog-datepicker-icon-hover-color`, `--gog-datepicker-label-color`, `--gog-datepicker-label-font-family`, `--gog-datepicker-label-font-size`, `--gog-datepicker-label-letter-spacing`, `--gog-datepicker-label-text-transform`, `--gog-datepicker-line-height`, `--gog-datepicker-min-width`, `--gog-datepicker-panel-bg`, `--gog-datepicker-panel-border-color`, `--gog-datepicker-panel-border-style`, `--gog-datepicker-panel-border-width`, `--gog-datepicker-panel-gap`, `--gog-datepicker-panel-radius`, `--gog-datepicker-panel-shadow`, `--gog-datepicker-panel-width`, `--gog-datepicker-placeholder-color`, `--gog-datepicker-radius`, `--gog-datepicker-text-color`, `--gog-datepicker-toggle-icon-size`, `--gog-datepicker-transition-duration` |
|
|
44
|
+
| Divider | `--gog-divider-block-spacing`, `--gog-divider-dashed-style`, `--gog-divider-dotted-style`, `--gog-divider-inline-spacing`, `--gog-divider-inset-size`, `--gog-divider-label-color`, `--gog-divider-label-font-family`, `--gog-divider-label-font-size`, `--gog-divider-label-font-weight`, `--gog-divider-label-gap`, `--gog-divider-label-line-height`, `--gog-divider-line-color`, `--gog-divider-line-thickness`, `--gog-divider-solid-style`, `--gog-divider-vertical-length` |
|
|
45
|
+
| Icon | `--gog-icon-fallback-size` |
|
|
46
|
+
| Input field | `--gog-input-clear-icon-ratio`, `--gog-input-clear-inset`, `--gog-input-clear-radius`, `--gog-input-disabled-opacity`, `--gog-input-error-color`, `--gog-input-error-font-size`, `--gog-input-error-offset`, `--gog-input-field-bg`, `--gog-input-field-border`, `--gog-input-field-border-style`, `--gog-input-field-border-width`, `--gog-input-field-color`, `--gog-input-float-label-in-top`, `--gog-input-float-label-over-gap`, `--gog-input-float-label-over-reserve`, `--gog-input-float-label-reserve`, `--gog-input-focus-border`, `--gog-input-focus-glow`, `--gog-input-focus-ring`, `--gog-input-focus-ring-offset`, `--gog-input-focus-ring-width`, `--gog-input-font-family`, `--gog-input-gap`, `--gog-input-icon-action-radius`, `--gog-input-icon-color`, `--gog-input-icon-focus-ring-width`, `--gog-input-icon-hover-color`, `--gog-input-label-color`, `--gog-input-label-font-family`, `--gog-input-label-font-size`, `--gog-input-label-letter-spacing`, `--gog-input-label-text-transform`, `--gog-input-placeholder-color`, `--gog-input-radius`, `--gog-input-spin-hover-bg`, `--gog-input-spin-width`, `--gog-input-transition-duration`, `--gog-textarea-clear-icon-ratio`, `--gog-textarea-resize-grip-color`, `--gog-textarea-resize-grip-offset`, `--gog-textarea-resize-grip-opacity`, `--gog-textarea-resize-grip-size`, `--gog-textarea-resize-grip-stripe-gap`, `--gog-textarea-resize-grip-stripe-width`, `--gog-textarea-resize-inset-bottom`, `--gog-textarea-resize-inset-right` |
|
|
47
|
+
| Multiselect | `--gog-multiselect-actions-gap`, `--gog-multiselect-actions-inset`, `--gog-multiselect-arrow-icon-ratio`, `--gog-multiselect-arrow-transition-duration`, `--gog-multiselect-border-color`, `--gog-multiselect-checkbox-bg`, `--gog-multiselect-checkbox-border`, `--gog-multiselect-checkbox-checked-bg`, `--gog-multiselect-checkbox-checked-color`, `--gog-multiselect-clear-icon-ratio`, `--gog-multiselect-clear-radius`, `--gog-multiselect-controls-gap`, `--gog-multiselect-controls-padding`, `--gog-multiselect-disabled-opacity`, `--gog-multiselect-error-color`, `--gog-multiselect-error-font-size`, `--gog-multiselect-error-offset`, `--gog-multiselect-field-bg`, `--gog-multiselect-field-border`, `--gog-multiselect-field-border-style`, `--gog-multiselect-field-border-width`, `--gog-multiselect-field-color`, `--gog-multiselect-filter-border-color`, `--gog-multiselect-filter-border-style`, `--gog-multiselect-filter-border-width`, `--gog-multiselect-filter-empty-color`, `--gog-multiselect-filter-empty-padding`, `--gog-multiselect-filter-input-bg`, `--gog-multiselect-filter-input-border`, `--gog-multiselect-filter-input-color`, `--gog-multiselect-filter-input-padding-x`, `--gog-multiselect-filter-input-padding-y`, `--gog-multiselect-filter-input-radius`, `--gog-multiselect-filter-padding`, `--gog-multiselect-float-label-in-top`, `--gog-multiselect-float-label-over-gap`, `--gog-multiselect-float-label-over-reserve`, `--gog-multiselect-float-label-reserve`, `--gog-multiselect-focus-border`, `--gog-multiselect-focus-glow`, `--gog-multiselect-focus-ring`, `--gog-multiselect-focus-ring-offset`, `--gog-multiselect-focus-ring-width`, `--gog-multiselect-font-family`, `--gog-multiselect-gap`, `--gog-multiselect-label-color`, `--gog-multiselect-label-font-family`, `--gog-multiselect-label-font-size`, `--gog-multiselect-label-letter-spacing`, `--gog-multiselect-label-text-transform`, `--gog-multiselect-mark-icon-ratio`, `--gog-multiselect-mark-size-ratio`, `--gog-multiselect-min-width`, `--gog-multiselect-option-color`, `--gog-multiselect-option-disabled-opacity`, `--gog-multiselect-option-gap`, `--gog-multiselect-option-gap-inline`, `--gog-multiselect-option-height`, `--gog-multiselect-option-hover-bg`, `--gog-multiselect-option-radius`, `--gog-multiselect-option-transition-duration`, `--gog-multiselect-options-padding`, `--gog-multiselect-overflow-color`, `--gog-multiselect-overflow-font-size`, `--gog-multiselect-overflow-gap`, `--gog-multiselect-panel-bg`, `--gog-multiselect-panel-border`, `--gog-multiselect-panel-max-height`, `--gog-multiselect-panel-max-width`, `--gog-multiselect-panel-offset`, `--gog-multiselect-panel-shadow`, `--gog-multiselect-placeholder-color`, `--gog-multiselect-radius`, `--gog-multiselect-transition-duration`, `--gog-multiselect-value-color` |
|
|
48
|
+
| Menu | `--gog-menu-bg`, `--gog-menu-border-color`, `--gog-menu-border-style`, `--gog-menu-border-width`, `--gog-menu-focus-ring`, `--gog-menu-focus-ring-width`, `--gog-menu-font-family`, `--gog-menu-gap`, `--gog-menu-item-color`, `--gog-menu-item-disabled-color`, `--gog-menu-item-disabled-opacity`, `--gog-menu-item-font-size`, `--gog-menu-item-gap`, `--gog-menu-item-hover-bg`, `--gog-menu-item-hover-color`, `--gog-menu-item-icon-size`, `--gog-menu-item-line-height`, `--gog-menu-item-padding`, `--gog-menu-item-radius`, `--gog-menu-max-height`, `--gog-menu-max-width`, `--gog-menu-min-width`, `--gog-menu-offset`, `--gog-menu-padding`, `--gog-menu-radius`, `--gog-menu-shadow`, `--gog-menu-transition-duration`, `--gog-menu-z` |
|
|
49
|
+
| Paginator | `--gog-paginator-ellipsis-color`, `--gog-paginator-ellipsis-font-family`, `--gog-paginator-ellipsis-font-size`, `--gog-paginator-ellipsis-min-width`, `--gog-paginator-gap`, `--gog-paginator-page-size-min-width` |
|
|
50
|
+
| Progressbar | `--gog-progressbar-accent-bg`, `--gog-progressbar-accent-buffer-bg`, `--gog-progressbar-danger-bg`, `--gog-progressbar-danger-buffer-bg`, `--gog-progressbar-indeterminate-duration`, `--gog-progressbar-indeterminate-easing`, `--gog-progressbar-info-bg`, `--gog-progressbar-info-buffer-bg`, `--gog-progressbar-lg-height`, `--gog-progressbar-md-height`, `--gog-progressbar-radius`, `--gog-progressbar-slg-height`, `--gog-progressbar-sm-height`, `--gog-progressbar-stripe-color`, `--gog-progressbar-stripe-size`, `--gog-progressbar-success-bg`, `--gog-progressbar-success-buffer-bg`, `--gog-progressbar-track-base-bg`, `--gog-progressbar-transition-duration`, `--gog-progressbar-value-color`, `--gog-progressbar-value-font-family`, `--gog-progressbar-value-font-size`, `--gog-progressbar-value-gap`, `--gog-progressbar-value-min-width`, `--gog-progressbar-warning-bg`, `--gog-progressbar-warning-buffer-bg`, `--gog-progressbar-xsm-height` |
|
|
51
|
+
| Scroll | `--gog-scroll-corner-bg`, `--gog-scroll-fade-duration`, `--gog-scroll-focus-ring`, `--gog-scroll-focus-ring-width`, `--gog-scroll-normal-thumb-hit-padding`, `--gog-scroll-normal-thumb-min-size`, `--gog-scroll-normal-track-width`, `--gog-scroll-thin-thumb-hit-padding`, `--gog-scroll-thin-thumb-min-size`, `--gog-scroll-thin-track-width`, `--gog-scroll-thumb-active-bg`, `--gog-scroll-thumb-bg`, `--gog-scroll-thumb-hover-bg`, `--gog-scroll-thumb-inset`, `--gog-scroll-thumb-radius`, `--gog-scroll-track-bg`, `--gog-scroll-track-radius` |
|
|
52
|
+
| Select | `--gog-select-chevron-color`, `--gog-select-chevron-icon-ratio`, `--gog-select-chevron-inset`, `--gog-select-clear-color`, `--gog-select-clear-gap`, `--gog-select-clear-hover-color`, `--gog-select-clear-icon-ratio`, `--gog-select-clear-radius`, `--gog-select-control-gap`, `--gog-select-disabled-opacity`, `--gog-select-error-color`, `--gog-select-error-font-size`, `--gog-select-field-bg`, `--gog-select-field-border`, `--gog-select-field-border-style`, `--gog-select-field-border-width`, `--gog-select-field-color`, `--gog-select-filter-border-color`, `--gog-select-filter-border-style`, `--gog-select-filter-border-width`, `--gog-select-filter-empty-color`, `--gog-select-filter-empty-padding`, `--gog-select-filter-input-bg`, `--gog-select-filter-input-border`, `--gog-select-filter-input-color`, `--gog-select-filter-input-padding-x`, `--gog-select-filter-input-padding-y`, `--gog-select-filter-input-radius`, `--gog-select-filter-padding`, `--gog-select-float-label-in-top`, `--gog-select-float-label-over-gap`, `--gog-select-float-label-over-reserve`, `--gog-select-float-label-reserve`, `--gog-select-focus-border`, `--gog-select-focus-glow`, `--gog-select-focus-ring`, `--gog-select-focus-ring-offset`, `--gog-select-focus-ring-width`, `--gog-select-font-family`, `--gog-select-gap`, `--gog-select-label-color`, `--gog-select-label-font-family`, `--gog-select-label-font-size`, `--gog-select-label-letter-spacing`, `--gog-select-label-text-transform`, `--gog-select-mark-icon-ratio`, `--gog-select-mark-size-ratio`, `--gog-select-min-width`, `--gog-select-option-color`, `--gog-select-option-disabled-opacity`, `--gog-select-option-gap`, `--gog-select-option-height`, `--gog-select-option-hover-bg`, `--gog-select-option-selected-color`, `--gog-select-option-transition-duration`, `--gog-select-panel-bg`, `--gog-select-panel-max-height`, `--gog-select-panel-max-width`, `--gog-select-panel-offset`, `--gog-select-panel-shadow`, `--gog-select-placeholder-color`, `--gog-select-radius`, `--gog-select-transition-duration` |
|
|
53
|
+
| 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` |
|
|
54
|
+
| 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` |
|
|
55
|
+
| 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` |
|
|
56
|
+
| 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` |
|
|
57
|
+
| 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` |
|
|
58
|
+
| 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` |
|
|
59
|
+
| 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` |
|
|
60
|
+
| Toggle | `--gog-toggle-border-color`, `--gog-toggle-border-style`, `--gog-toggle-border-width`, `--gog-toggle-disabled-opacity`, `--gog-toggle-focus-ring-color`, `--gog-toggle-focus-ring-offset`, `--gog-toggle-focus-ring-width`, `--gog-toggle-font-family`, `--gog-toggle-gap`, `--gog-toggle-label-color`, `--gog-toggle-label-line-height`, `--gog-toggle-lg-label-size`, `--gog-toggle-lg-state-font-size`, `--gog-toggle-lg-thumb-size`, `--gog-toggle-lg-track-height`, `--gog-toggle-lg-track-width`, `--gog-toggle-md-label-size`, `--gog-toggle-md-state-font-size`, `--gog-toggle-md-thumb-size`, `--gog-toggle-md-track-height`, `--gog-toggle-md-track-width`, `--gog-toggle-on-border-color`, `--gog-toggle-radius`, `--gog-toggle-slg-label-size`, `--gog-toggle-slg-state-font-size`, `--gog-toggle-slg-thumb-size`, `--gog-toggle-slg-track-height`, `--gog-toggle-slg-track-width`, `--gog-toggle-sm-label-size`, `--gog-toggle-sm-state-font-size`, `--gog-toggle-sm-thumb-size`, `--gog-toggle-sm-track-height`, `--gog-toggle-sm-track-width`, `--gog-toggle-state-color`, `--gog-toggle-state-font-weight`, `--gog-toggle-state-letter-spacing`, `--gog-toggle-state-offset`, `--gog-toggle-state-padding-inline`, `--gog-toggle-state-thumb-gap`, `--gog-toggle-thumb-inset`, `--gog-toggle-thumb-off-bg`, `--gog-toggle-thumb-on-bg`, `--gog-toggle-thumb-shadow`, `--gog-toggle-track-off-bg`, `--gog-toggle-track-on-bg`, `--gog-toggle-transition-duration`, `--gog-toggle-xsm-label-size`, `--gog-toggle-xsm-state-font-size`, `--gog-toggle-xsm-thumb-size`, `--gog-toggle-xsm-track-height`, `--gog-toggle-xsm-track-width` |
|
|
61
|
+
| Tooltip | `--gog-tooltip-arrow-size`, `--gog-tooltip-bg`, `--gog-tooltip-border-color`, `--gog-tooltip-border-style`, `--gog-tooltip-border-width`, `--gog-tooltip-color`, `--gog-tooltip-font-family`, `--gog-tooltip-font-size`, `--gog-tooltip-gap`, `--gog-tooltip-line-height`, `--gog-tooltip-max-height`, `--gog-tooltip-max-width`, `--gog-tooltip-padding`, `--gog-tooltip-radius`, `--gog-tooltip-shadow`, `--gog-tooltip-transition-duration`, `--gog-tooltip-z` |
|
|
62
62
|
|
|
63
63
|
<!-- tokens:end -->
|