@jablonowski/dsb-tokens 1.0.4 → 1.0.5

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/dist/css/variables.css +90 -153
  2. package/dist/js/tokens.js +117 -181
  3. package/dist/json/tokens.json +109 -201
  4. package/dist/scss/_variables.scss +90 -153
  5. package/dist/ts/tokens.d.ts +31 -155
  6. package/dist/ts/tokens.ts +117 -181
  7. package/package.json +1 -1
  8. package/test/tokens.test.js +2 -6
  9. package/tokens/tokens.json +706 -367
  10. package/tokens/tokens.txt +562 -0
package/dist/css/variables.css CHANGED
@@ -15,11 +15,11 @@
15
15
  --ds-color-options-neutral-450: #bbbbbb;
16
16
  --ds-color-options-neutral-500: #aaaaaa;
17
17
  --ds-color-options-neutral-550: #999999;
18
- --ds-color-options-neutral-600: #6f6f6f;
18
+ --ds-color-options-neutral-600: #888888;
19
19
  --ds-color-options-neutral-650: #666666;
20
20
  --ds-color-options-neutral-700: #555555;
21
21
  --ds-color-options-neutral-800: #333333;
22
- --ds-color-options-neutral-900: #111111;
22
+ --ds-color-options-neutral-900: #6D28D9;
23
23
  --ds-color-options-neutral-1000: #000000;
24
24
  --ds-color-options-red-50: #fef2f2;
25
25
  --ds-color-options-red-100: #fce8e6;
@@ -28,7 +28,7 @@
28
28
  --ds-color-options-red-600: #c5221f;
29
29
  --ds-color-options-red-700: #b0261e;
30
30
  --ds-color-options-green-50: #e6f4ea;
31
- --ds-color-options-green-700: #1a7c3c;
31
+ --ds-color-options-green-700: #1a7f3c;
32
32
  --ds-color-options-yellow-50: #fef3cd;
33
33
  --ds-color-options-yellow-700: #92600a;
34
34
  --ds-color-options-blue-50: #e8f0fe;
@@ -38,14 +38,6 @@
38
38
  --ds-color-options-black-a08: rgba(0, 0, 0, 0.08);
39
39
  --ds-color-options-black-a14: rgba(0, 0, 0, 0.14);
40
40
  --ds-color-options-red-a10: rgba(217, 48, 37, 0.1);
41
- --ds-font-size-options-11: 11px;
42
- --ds-font-size-options-12: 12px;
43
- --ds-font-size-options-13: 13px;
44
- --ds-font-size-options-14: 14px;
45
- --ds-font-size-options-15: 15px;
46
- --ds-font-size-options-16: 16px;
47
- --ds-font-weight-options-medium: 500;
48
- --ds-font-weight-options-semibold: 600;
49
41
  --ds-border-width-options-1: 1px;
50
42
  --ds-border-width-options-2: 2px;
51
43
  --ds-border-width-options-1-5: 1.5px;
@@ -56,141 +48,121 @@
56
48
  --ds-border-radius-options-8: 8px;
57
49
  --ds-border-radius-options-10: 10px;
58
50
  --ds-border-radius-options-full: 50%;
51
+ --ds-font-size-options-11: 11px;
52
+ --ds-font-size-options-12: 12px;
53
+ --ds-font-size-options-13: 13px;
54
+ --ds-font-size-options-14: 14px;
55
+ --ds-font-size-options-15: 15px;
56
+ --ds-font-size-options-16: 16px;
57
+ --ds-font-weight-options-medium: 500;
58
+ --ds-font-weight-options-semibold: 600;
59
+ --ds-opacity-options-disabled: 0.41999998688697815;
60
+ --ds-z-options-100: 100;
61
+ --ds-z-options-1000: 1000;
59
62
  --ds-duration-options-fast: 0.1s;
60
63
  --ds-duration-options-base: 0.12s;
61
64
  --ds-duration-options-slow: 0.2s;
62
65
  --ds-easing-options-standard: ease;
63
- --ds-opacity-options-disabled: 0.42;
64
- --ds-z-options-100: 100;
65
- --ds-z-options-1000: 1000;
66
- --ds-component-button-ghost-background: transparent;
67
- --ds-shadow-options-focus-neutral: 0 0 0 3px var(--ds-color-options-black-a06);
68
- --ds-shadow-options-focus-error: 0 0 0 3px var(--ds-color-options-red-a10);
69
- --ds-shadow-options-dropdown: 0 4px 12px var(--ds-color-options-black-a08);
70
- --ds-shadow-options-modal: 0 8px 32px var(--ds-color-options-black-a14);
71
- --ds-decisions-color-text-primary: var(--ds-color-options-neutral-900); /** Primary body text, labels, headings */
72
- --ds-decisions-color-text-body: var(--ds-color-options-neutral-800); /** Secondary body text, table cells */
73
- --ds-decisions-color-text-secondary: var(--ds-color-options-neutral-700); /** De-emphasised text — ghost button, captions */
74
- --ds-decisions-color-text-muted: var(--ds-color-options-neutral-650); /** Quiet text — links, descriptions */
75
- --ds-decisions-color-text-subtle: var(--ds-color-options-neutral-600); /** Placeholder-level text — hints, metadata */
76
- --ds-decisions-color-text-placeholder: var(--ds-color-options-neutral-600); /** Input placeholder, empty states */
77
- --ds-decisions-color-text-disabled: var(--ds-color-options-neutral-550); /** Disabled control text */
78
- --ds-decisions-color-text-inverse: var(--ds-color-options-neutral-0); /** Text on dark/filled backgrounds */
79
- --ds-decisions-color-surface-base: var(--ds-color-options-neutral-0); /** Default control and card background */
80
- --ds-decisions-color-surface-subtle: var(--ds-color-options-neutral-50); /** Recessed surfaces — table header, striped rows */
81
- --ds-decisions-color-surface-hover: var(--ds-color-options-neutral-100); /** Hover background for interactive elements */
82
- --ds-decisions-color-surface-row-hover: var(--ds-color-options-neutral-75); /** Table row hover */
83
- --ds-decisions-color-surface-selected: var(--ds-color-options-neutral-150); /** Selected option in dropdown/menu */
84
- --ds-decisions-color-surface-avatar: var(--ds-color-options-neutral-300); /** Avatar initials background */
85
- --ds-decisions-color-border-control: var(--ds-color-options-neutral-350); /** Default border on interactive controls */
86
- --ds-decisions-color-border-control-hover: var(--ds-color-options-neutral-450); /** Hovered control border */
87
- --ds-decisions-color-border-subtle: var(--ds-color-options-neutral-200); /** Layout dividers — header, footer, table wrap */
88
- --ds-decisions-color-border-hairline: var(--ds-color-options-neutral-150); /** Faint inner dividers — table cells, list rows */
89
- --ds-decisions-color-border-separator: var(--ds-color-options-neutral-400); /** Inline separators — breadcrumbs chevron */
90
- --ds-decisions-color-overlay-backdrop: var(--ds-color-options-black-a40); /** Modal/drawer backdrop scrim */
91
- --ds-decisions-color-feedback-error-text: var(--ds-color-options-red-600); /** Error text and labels */
92
- --ds-decisions-color-feedback-error-icon: var(--ds-color-options-red-500); /** Error icon and border */
93
- --ds-decisions-color-feedback-error-icon-hover: var(--ds-color-options-red-700); /** Error border on hover */
94
- --ds-decisions-color-feedback-error-surface: var(--ds-color-options-red-100); /** Error tinted background */
95
- --ds-decisions-color-feedback-error-surface-hover: var(--ds-color-options-red-50); /** Error surface on hover */
96
- --ds-decisions-color-feedback-error-border: var(--ds-color-options-red-200); /** Soft error border — danger button default */
97
- --ds-decisions-color-feedback-success-text: var(--ds-color-options-green-700); /** Success text and icon */
98
- --ds-decisions-color-feedback-success-surface: var(--ds-color-options-green-50); /** Success tinted background */
99
- --ds-decisions-color-feedback-warning-text: var(--ds-color-options-yellow-700); /** Warning text and icon */
100
- --ds-decisions-color-feedback-warning-surface: var(--ds-color-options-yellow-50); /** Warning tinted background */
101
- --ds-decisions-color-feedback-info-text: var(--ds-color-options-blue-700); /** Info text and icon */
102
- --ds-decisions-color-feedback-info-surface: var(--ds-color-options-blue-50); /** Info tinted background */
103
- --ds-decisions-font-size-2xs: var(--ds-font-size-options-11); /** Table column headers, smallest labels */
104
- --ds-decisions-font-size-xs: var(--ds-font-size-options-12); /** Hints, error messages, secondary meta */
105
- --ds-decisions-font-size-sm: var(--ds-font-size-options-13); /** Labels, nav links, footer text */
106
- --ds-decisions-font-size-md: var(--ds-font-size-options-14); /** Default body and control text */
107
- --ds-decisions-font-size-lg: var(--ds-font-size-options-15); /** Large controls, brand name */
108
- --ds-decisions-font-size-xl: var(--ds-font-size-options-16); /** Dialog titles, section headings */
109
- --ds-decisions-font-weight-medium: var(--ds-font-weight-options-medium); /** Labels, interactive text, active items */
110
- --ds-decisions-font-weight-semibold: var(--ds-font-weight-options-semibold); /** Headings, modal titles, column headers */
111
- --ds-decisions-border-width-hairline: var(--ds-border-width-options-1); /** Layout dividers */
112
- --ds-decisions-border-width-control: var(--ds-border-width-options-1-5); /** Interactive control borders */
113
- --ds-decisions-border-width-focus: var(--ds-border-width-options-2); /** Focus outline width */
114
- --ds-decisions-border-radius-xs: var(--ds-border-radius-options-3); /** Inline link focus, small badges */
115
- --ds-decisions-border-radius-sm: var(--ds-border-radius-options-4); /** Tags, checkboxes, small chips */
116
- --ds-decisions-border-radius-md: var(--ds-border-radius-options-5); /** Nav items, small buttons */
117
- --ds-decisions-border-radius-lg: var(--ds-border-radius-options-6); /** Standard controls — buttons, inputs, dropdowns */
118
- --ds-decisions-border-radius-xl: var(--ds-border-radius-options-8); /** Cards, table wrappers, bordered lists */
119
- --ds-decisions-border-radius-2xl: var(--ds-border-radius-options-10); /** Modal panels, large cards */
120
- --ds-decisions-border-radius-full: var(--ds-border-radius-options-full); /** Pill shapes, avatars, radio dots */
121
- --ds-decisions-motion-duration-fast: var(--ds-duration-options-fast); /** Micro-interactions — row/option bg */
122
- --ds-decisions-motion-duration-base: var(--ds-duration-options-base); /** Standard UI transitions */
123
- --ds-decisions-motion-duration-slow: var(--ds-duration-options-slow); /** Expand/collapse animations */
124
- --ds-decisions-motion-easing-standard: var(--ds-easing-options-standard); /** Default easing for all transitions */
125
- --ds-decisions-opacity-disabled: var(--ds-opacity-options-disabled); /** Disabled control opacity */
126
- --ds-decisions-z-index-dropdown: var(--ds-z-options-100); /** Floating menus and dropdowns */
127
- --ds-decisions-z-index-modal: var(--ds-z-options-1000); /** Modal and dialog overlays */
128
- --ds-component-button-primary-background-hover: var(--ds-color-options-neutral-800);
129
- --ds-component-button-primary-background-active: var(--ds-color-options-neutral-1000);
130
- --ds-component-tag-default-text: var(--ds-color-options-neutral-700);
131
- --ds-component-header-cta-background-hover: var(--ds-color-options-neutral-800);
132
- --ds-decisions-shadow-focus: var(--ds-shadow-options-focus-neutral); /** Default focus ring glow */
133
- --ds-decisions-shadow-focus-error: var(--ds-shadow-options-focus-error); /** Error state focus ring glow */
134
- --ds-decisions-shadow-dropdown: var(--ds-shadow-options-dropdown); /** Floating dropdown panel */
135
- --ds-decisions-shadow-modal: var(--ds-shadow-options-modal); /** Modal dialog elevation */
136
- --ds-component-button-border-radius: var(--ds-decisions-border-radius-lg);
137
- --ds-component-button-border-width: var(--ds-decisions-border-width-control);
138
- --ds-component-button-disabled-opacity: var(--ds-decisions-opacity-disabled);
66
+ --ds-decisions-color-text-primary: var(--ds-color-options-neutral-900);
67
+ --ds-decisions-color-text-body: var(--ds-color-options-neutral-800);
68
+ --ds-decisions-color-text-secondary: var(--ds-color-options-neutral-700);
69
+ --ds-decisions-color-text-muted: var(--ds-color-options-neutral-650);
70
+ --ds-decisions-color-text-subtle: var(--ds-color-options-neutral-600);
71
+ --ds-decisions-color-text-placeholder: var(--ds-color-options-neutral-500);
72
+ --ds-decisions-color-text-disabled: var(--ds-color-options-neutral-550);
73
+ --ds-decisions-color-text-inverse: var(--ds-color-options-neutral-0);
74
+ --ds-decisions-color-surface-base: var(--ds-color-options-neutral-0);
75
+ --ds-decisions-color-surface-subtle: var(--ds-color-options-neutral-50);
76
+ --ds-decisions-color-surface-hover: var(--ds-color-options-neutral-100);
77
+ --ds-decisions-color-surface-row-hover: var(--ds-color-options-neutral-75);
78
+ --ds-decisions-color-surface-selected: var(--ds-color-options-neutral-150);
79
+ --ds-decisions-color-surface-avatar: var(--ds-color-options-neutral-300);
80
+ --ds-decisions-color-border-control: var(--ds-color-options-neutral-350);
81
+ --ds-decisions-color-border-control-hover: var(--ds-color-options-neutral-450);
82
+ --ds-decisions-color-border-subtle: var(--ds-color-options-neutral-200);
83
+ --ds-decisions-color-border-hairline: var(--ds-color-options-neutral-150);
84
+ --ds-decisions-color-border-separator: var(--ds-color-options-neutral-400);
85
+ --ds-decisions-color-overlay-backdrop: var(--ds-color-options-black-a40);
86
+ --ds-decisions-color-feedback-error-text: var(--ds-color-options-red-600);
87
+ --ds-decisions-color-feedback-error-icon: var(--ds-color-options-red-500);
88
+ --ds-decisions-color-feedback-error-icon-hover: var(--ds-color-options-red-700);
89
+ --ds-decisions-color-feedback-error-surface: var(--ds-color-options-red-100);
90
+ --ds-decisions-color-feedback-error-surface-hover: var(--ds-color-options-red-50);
91
+ --ds-decisions-color-feedback-error-border: var(--ds-color-options-red-200);
92
+ --ds-decisions-color-feedback-success-text: var(--ds-color-options-green-700);
93
+ --ds-decisions-color-feedback-success-surface: var(--ds-color-options-green-50);
94
+ --ds-decisions-color-feedback-warning-text: var(--ds-color-options-yellow-700);
95
+ --ds-decisions-color-feedback-warning-surface: var(--ds-color-options-yellow-50);
96
+ --ds-decisions-color-feedback-info-text: var(--ds-color-options-blue-700);
97
+ --ds-decisions-color-feedback-info-surface: var(--ds-color-options-blue-50);
98
+ --ds-decisions-font-size-2xs: var(--ds-font-size-options-11);
99
+ --ds-decisions-font-size-xs: var(--ds-font-size-options-12);
100
+ --ds-decisions-font-size-sm: var(--ds-font-size-options-13);
101
+ --ds-decisions-font-size-md: var(--ds-font-size-options-14);
102
+ --ds-decisions-font-size-lg: var(--ds-font-size-options-15);
103
+ --ds-decisions-font-size-xl: var(--ds-font-size-options-16);
104
+ --ds-decisions-font-weight-medium: var(--ds-font-weight-options-medium);
105
+ --ds-decisions-font-weight-semibold: var(--ds-font-weight-options-semibold);
106
+ --ds-decisions-border-width-hairline: var(--ds-border-width-options-1);
107
+ --ds-decisions-border-width-control: var(--ds-border-width-options-1-5);
108
+ --ds-decisions-border-width-focus: var(--ds-border-width-options-2);
109
+ --ds-decisions-border-radius-xs: var(--ds-border-radius-options-3);
110
+ --ds-decisions-border-radius-sm: var(--ds-border-radius-options-4);
111
+ --ds-decisions-border-radius-md: var(--ds-border-radius-options-5);
112
+ --ds-decisions-border-radius-lg: var(--ds-border-radius-options-6);
113
+ --ds-decisions-border-radius-xl: var(--ds-border-radius-options-8);
114
+ --ds-decisions-border-radius-2xl: var(--ds-border-radius-options-10);
115
+ --ds-decisions-border-radius-full: var(--ds-border-radius-options-full);
116
+ --ds-decisions-opacity-disabled: var(--ds-opacity-options-disabled);
117
+ --ds-decisions-z-index-dropdown: var(--ds-z-options-100);
118
+ --ds-decisions-z-index-modal: var(--ds-z-options-1000);
119
+ --ds-decisions-motion-duration-fast: var(--ds-duration-options-fast);
120
+ --ds-decisions-motion-duration-base: var(--ds-duration-options-base);
121
+ --ds-decisions-motion-duration-slow: var(--ds-duration-options-slow);
122
+ --ds-decisions-motion-easing-standard: var(--ds-easing-options-standard);
139
123
  --ds-component-button-primary-background: var(--ds-decisions-color-text-primary);
140
124
  --ds-component-button-primary-text: var(--ds-decisions-color-text-inverse);
141
125
  --ds-component-button-primary-border: var(--ds-decisions-color-text-primary);
142
126
  --ds-component-button-secondary-background: var(--ds-decisions-color-surface-base);
143
- --ds-component-button-secondary-background-hover: var(--ds-decisions-color-surface-hover);
144
127
  --ds-component-button-secondary-text: var(--ds-decisions-color-text-primary);
145
128
  --ds-component-button-secondary-border: var(--ds-decisions-color-border-control);
146
- --ds-component-button-secondary-border-hover: var(--ds-decisions-color-border-control-hover);
147
- --ds-component-button-ghost-background-hover: var(--ds-decisions-color-surface-hover);
129
+ --ds-component-button-ghost-background: var(--ds-decisions-color-surface-base);
148
130
  --ds-component-button-ghost-text: var(--ds-decisions-color-text-secondary);
149
- --ds-component-button-ghost-text-hover: var(--ds-decisions-color-text-primary);
150
131
  --ds-component-button-danger-background: var(--ds-decisions-color-surface-base);
151
- --ds-component-button-danger-background-hover: var(--ds-decisions-color-feedback-error-surface-hover);
152
132
  --ds-component-button-danger-text: var(--ds-decisions-color-feedback-error-icon);
153
133
  --ds-component-button-danger-border: var(--ds-decisions-color-feedback-error-border);
154
- --ds-component-button-danger-border-hover: var(--ds-decisions-color-feedback-error-icon);
134
+ --ds-component-button-border-radius: var(--ds-decisions-border-radius-lg);
135
+ --ds-component-button-border-width: var(--ds-decisions-border-width-control);
136
+ --ds-component-button-disabled-opacity: var(--ds-decisions-opacity-disabled);
155
137
  --ds-component-input-background: var(--ds-decisions-color-surface-base);
156
138
  --ds-component-input-text: var(--ds-decisions-color-text-primary);
157
139
  --ds-component-input-placeholder: var(--ds-decisions-color-text-placeholder);
158
140
  --ds-component-input-border: var(--ds-decisions-color-border-control);
159
141
  --ds-component-input-border-focus: var(--ds-decisions-color-text-primary);
160
- --ds-component-input-border-radius: var(--ds-decisions-border-radius-lg);
161
- --ds-component-input-border-width: var(--ds-decisions-border-width-control);
162
142
  --ds-component-input-disabled-background: var(--ds-decisions-color-surface-hover);
163
143
  --ds-component-input-disabled-text: var(--ds-decisions-color-text-disabled);
164
144
  --ds-component-input-error-border: var(--ds-decisions-color-feedback-error-icon);
145
+ --ds-component-input-border-radius: var(--ds-decisions-border-radius-lg);
146
+ --ds-component-input-border-width: var(--ds-decisions-border-width-control);
165
147
  --ds-component-checkbox-border: var(--ds-decisions-color-border-control);
166
- --ds-component-checkbox-border-hover: var(--ds-decisions-color-text-primary);
167
- --ds-component-checkbox-border-radius: var(--ds-decisions-border-radius-sm);
168
- --ds-component-checkbox-border-width: var(--ds-decisions-border-width-control);
169
148
  --ds-component-checkbox-checked-background: var(--ds-decisions-color-text-primary);
170
- --ds-component-checkbox-checked-border: var(--ds-decisions-color-text-primary);
171
149
  --ds-component-checkbox-checked-text: var(--ds-decisions-color-text-inverse);
172
150
  --ds-component-checkbox-error-border: var(--ds-decisions-color-feedback-error-icon);
173
- --ds-component-checkbox-error-checked-background: var(--ds-decisions-color-feedback-error-icon);
151
+ --ds-component-checkbox-border-radius: var(--ds-decisions-border-radius-sm);
152
+ --ds-component-checkbox-border-width: var(--ds-decisions-border-width-control);
174
153
  --ds-component-radio-border: var(--ds-decisions-color-border-control);
175
- --ds-component-radio-border-hover: var(--ds-decisions-color-text-primary);
176
- --ds-component-radio-border-checked: var(--ds-decisions-color-text-primary);
177
154
  --ds-component-radio-dot-color: var(--ds-decisions-color-text-primary);
178
155
  --ds-component-radio-error-border: var(--ds-decisions-color-feedback-error-icon);
179
156
  --ds-component-dropdown-background: var(--ds-decisions-color-surface-base);
180
157
  --ds-component-dropdown-text: var(--ds-decisions-color-text-primary);
181
158
  --ds-component-dropdown-placeholder: var(--ds-decisions-color-text-placeholder);
182
159
  --ds-component-dropdown-border: var(--ds-decisions-color-border-control);
183
- --ds-component-dropdown-border-open: var(--ds-decisions-color-text-primary);
184
- --ds-component-dropdown-border-hover: var(--ds-decisions-color-text-primary);
185
- --ds-component-dropdown-border-radius: var(--ds-decisions-border-radius-lg);
186
- --ds-component-dropdown-border-width: var(--ds-decisions-border-width-control);
187
160
  --ds-component-dropdown-menu-option-hover: var(--ds-decisions-color-surface-hover);
188
161
  --ds-component-dropdown-menu-option-selected: var(--ds-decisions-color-surface-selected);
189
- --ds-component-dropdown-menu-option-disabled: var(--ds-decisions-color-text-placeholder);
190
- --ds-component-dropdown-error-border: var(--ds-decisions-color-feedback-error-icon);
191
- --ds-component-dropdown-error-border-hover: var(--ds-decisions-color-feedback-error-icon-hover);
192
- --ds-component-tag-border-radius: var(--ds-decisions-border-radius-sm);
162
+ --ds-component-dropdown-border-radius: var(--ds-decisions-border-radius-lg);
163
+ --ds-component-dropdown-border-width: var(--ds-decisions-border-width-control);
193
164
  --ds-component-tag-default-background: var(--ds-decisions-color-surface-selected);
165
+ --ds-component-tag-default-text: var(--ds-decisions-color-text-secondary);
194
166
  --ds-component-tag-primary-background: var(--ds-decisions-color-text-primary);
195
167
  --ds-component-tag-primary-text: var(--ds-decisions-color-text-inverse);
196
168
  --ds-component-tag-success-background: var(--ds-decisions-color-feedback-success-surface);
@@ -201,37 +173,28 @@
201
173
  --ds-component-tag-danger-text: var(--ds-decisions-color-feedback-error-text);
202
174
  --ds-component-tag-info-background: var(--ds-decisions-color-feedback-info-surface);
203
175
  --ds-component-tag-info-text: var(--ds-decisions-color-feedback-info-text);
176
+ --ds-component-tag-border-radius: var(--ds-decisions-border-radius-sm);
204
177
  --ds-component-avatar-background: var(--ds-decisions-color-surface-avatar);
205
178
  --ds-component-avatar-text: var(--ds-decisions-color-text-secondary);
206
- --ds-component-avatar-border-radius-circle: var(--ds-decisions-border-radius-full);
207
- --ds-component-avatar-border-radius-rounded: var(--ds-decisions-border-radius-lg);
208
179
  --ds-component-modal-background: var(--ds-decisions-color-surface-base);
209
- --ds-component-modal-border-radius: var(--ds-decisions-border-radius-2xl);
210
180
  --ds-component-modal-backdrop: var(--ds-decisions-color-overlay-backdrop);
211
181
  --ds-component-modal-title-text: var(--ds-decisions-color-text-primary);
212
182
  --ds-component-modal-title-font-size: var(--ds-decisions-font-size-xl);
213
- --ds-component-modal-title-font-weight: var(--ds-decisions-font-weight-semibold);
214
183
  --ds-component-modal-body-text: var(--ds-decisions-color-text-body);
215
- --ds-component-modal-body-font-size: var(--ds-decisions-font-size-md);
216
184
  --ds-component-modal-close-button-text: var(--ds-decisions-color-text-subtle);
217
- --ds-component-modal-close-button-text-hover: var(--ds-decisions-color-text-primary);
218
185
  --ds-component-modal-close-button-background-hover: var(--ds-decisions-color-surface-selected);
219
- --ds-component-modal-close-button-border-radius: var(--ds-decisions-border-radius-md);
220
- --ds-component-modal-z-index: var(--ds-decisions-z-index-modal);
186
+ --ds-component-modal-border-radius: var(--ds-decisions-border-radius-2xl);
221
187
  --ds-component-table-background: var(--ds-decisions-color-surface-base);
222
188
  --ds-component-table-border: var(--ds-decisions-color-border-subtle);
223
- --ds-component-table-border-radius: var(--ds-decisions-border-radius-xl);
224
189
  --ds-component-table-header-background: var(--ds-decisions-color-surface-subtle);
225
190
  --ds-component-table-header-text: var(--ds-decisions-color-text-subtle);
226
- --ds-component-table-header-border: var(--ds-decisions-color-border-subtle);
227
191
  --ds-component-table-cell-text: var(--ds-decisions-color-text-body);
228
- --ds-component-table-cell-border-bottom: var(--ds-decisions-color-border-hairline);
192
+ --ds-component-table-cell-border: var(--ds-decisions-color-border-hairline);
229
193
  --ds-component-table-row-hover-background: var(--ds-decisions-color-surface-row-hover);
230
- --ds-component-table-row-striped-background: var(--ds-decisions-color-surface-subtle);
231
194
  --ds-component-table-empty-text: var(--ds-decisions-color-text-placeholder);
232
- --ds-component-list-divider: var(--ds-decisions-color-border-hairline);
195
+ --ds-component-table-border-radius: var(--ds-decisions-border-radius-xl);
233
196
  --ds-component-list-border: var(--ds-decisions-color-border-subtle);
234
- --ds-component-list-border-radius: var(--ds-decisions-border-radius-xl);
197
+ --ds-component-list-divider: var(--ds-decisions-color-border-hairline);
235
198
  --ds-component-list-item-text: var(--ds-decisions-color-text-primary);
236
199
  --ds-component-list-item-description: var(--ds-decisions-color-text-muted);
237
200
  --ds-component-list-item-meta: var(--ds-decisions-color-text-placeholder);
@@ -240,61 +203,35 @@
240
203
  --ds-component-list-indicator-success: var(--ds-decisions-color-feedback-success-text);
241
204
  --ds-component-list-indicator-warning: var(--ds-decisions-color-feedback-warning-text);
242
205
  --ds-component-list-indicator-error: var(--ds-decisions-color-feedback-error-text);
206
+ --ds-component-list-border-radius: var(--ds-decisions-border-radius-xl);
243
207
  --ds-component-accordion-border: var(--ds-decisions-color-border-hairline);
244
208
  --ds-component-accordion-title-text: var(--ds-decisions-color-text-primary);
245
209
  --ds-component-accordion-title-font-size: var(--ds-decisions-font-size-md);
246
210
  --ds-component-accordion-title-font-weight: var(--ds-decisions-font-weight-medium);
247
211
  --ds-component-accordion-body-text: var(--ds-decisions-color-text-secondary);
248
- --ds-component-accordion-body-font-size: var(--ds-decisions-font-size-md);
249
212
  --ds-component-accordion-chevron-color: var(--ds-decisions-color-text-subtle);
250
- --ds-component-accordion-chevron-duration: var(--ds-decisions-motion-duration-slow);
251
- --ds-component-accordion-disabled-opacity: var(--ds-decisions-opacity-disabled);
252
213
  --ds-component-breadcrumbs-link-text: var(--ds-decisions-color-text-muted);
253
214
  --ds-component-breadcrumbs-link-text-hover: var(--ds-decisions-color-text-primary);
254
215
  --ds-component-breadcrumbs-link-font-size: var(--ds-decisions-font-size-sm);
255
216
  --ds-component-breadcrumbs-current-text: var(--ds-decisions-color-text-primary);
256
- --ds-component-breadcrumbs-current-font-weight: var(--ds-decisions-font-weight-medium);
257
- --ds-component-breadcrumbs-separator-color: var(--ds-decisions-color-border-separator);
217
+ --ds-component-breadcrumbs-separator: var(--ds-decisions-color-border-separator);
258
218
  --ds-component-header-background: var(--ds-decisions-color-surface-base);
259
219
  --ds-component-header-border: var(--ds-decisions-color-border-subtle);
260
220
  --ds-component-header-brand-text: var(--ds-decisions-color-text-primary);
261
221
  --ds-component-header-brand-font-size: var(--ds-decisions-font-size-lg);
262
222
  --ds-component-header-brand-font-weight: var(--ds-decisions-font-weight-semibold);
263
223
  --ds-component-header-nav-text: var(--ds-decisions-color-text-secondary);
264
- --ds-component-header-nav-text-hover: var(--ds-decisions-color-text-primary);
265
224
  --ds-component-header-nav-background-hover: var(--ds-decisions-color-surface-hover);
266
- --ds-component-header-nav-text-active: var(--ds-decisions-color-text-primary);
267
- --ds-component-header-nav-font-weight: var(--ds-decisions-font-weight-medium);
268
- --ds-component-header-nav-border-radius: var(--ds-decisions-border-radius-md);
269
225
  --ds-component-header-cta-background: var(--ds-decisions-color-text-primary);
270
226
  --ds-component-header-cta-text: var(--ds-decisions-color-text-inverse);
271
- --ds-component-header-cta-border-radius: var(--ds-decisions-border-radius-lg);
272
227
  --ds-component-footer-background: var(--ds-decisions-color-surface-base);
273
228
  --ds-component-footer-border: var(--ds-decisions-color-border-subtle);
274
229
  --ds-component-footer-brand-text: var(--ds-decisions-color-text-primary);
275
230
  --ds-component-footer-brand-font-size: var(--ds-decisions-font-size-lg);
276
231
  --ds-component-footer-brand-font-weight: var(--ds-decisions-font-weight-semibold);
277
232
  --ds-component-footer-tagline-text: var(--ds-decisions-color-text-subtle);
278
- --ds-component-footer-tagline-font-size: var(--ds-decisions-font-size-sm);
279
233
  --ds-component-footer-column-heading-text: var(--ds-decisions-color-text-primary);
280
- --ds-component-footer-column-heading-font-size: var(--ds-decisions-font-size-xs);
281
- --ds-component-footer-column-heading-font-weight: var(--ds-decisions-font-weight-semibold);
282
234
  --ds-component-footer-column-link-text: var(--ds-decisions-color-text-muted);
283
- --ds-component-footer-column-link-text-hover: var(--ds-decisions-color-text-primary);
284
- --ds-component-footer-column-link-font-size: var(--ds-decisions-font-size-sm);
285
- --ds-component-footer-legal-text: var(--ds-decisions-color-text-placeholder);
286
- --ds-component-footer-legal-text-hover: var(--ds-decisions-color-text-secondary);
287
- --ds-component-footer-legal-font-size: var(--ds-decisions-font-size-xs);
288
- --ds-component-footer-copyright-text: var(--ds-decisions-color-text-placeholder);
289
- --ds-component-footer-copyright-font-size: var(--ds-decisions-font-size-xs);
290
235
  --ds-component-footer-divider: var(--ds-decisions-color-border-hairline);
291
- --ds-component-button-focus-ring: var(--ds-decisions-shadow-focus);
292
- --ds-component-input-focus-shadow: var(--ds-decisions-shadow-focus);
293
- --ds-component-input-error-focus-shadow: var(--ds-decisions-shadow-focus-error);
294
- --ds-component-checkbox-focus-ring: var(--ds-decisions-shadow-focus);
295
- --ds-component-radio-focus-ring: var(--ds-decisions-shadow-focus);
296
- --ds-component-dropdown-focus-ring: var(--ds-decisions-shadow-focus);
297
- --ds-component-dropdown-menu-shadow: var(--ds-decisions-shadow-dropdown);
298
- --ds-component-modal-shadow: var(--ds-decisions-shadow-modal);
299
- --ds-component-accordion-focus-ring: var(--ds-decisions-shadow-focus);
236
+ --ds-component-footer-copyright-text: var(--ds-decisions-color-text-placeholder);
300
237
  }