ps-helix 6.2.4 → 7.0.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.
Files changed (31) hide show
  1. package/CONFIGURATION.md +492 -0
  2. package/README.md +131 -125
  3. package/THEME.md +37 -27
  4. package/TOKENS.md +662 -0
  5. package/fesm2022/ps-helix.mjs +7715 -5651
  6. package/fesm2022/ps-helix.mjs.map +1 -1
  7. package/package.json +18 -8
  8. package/src/lib/styles/base/a11y.css +36 -0
  9. package/src/lib/styles/base/behavior.css +15 -0
  10. package/src/lib/styles/base/global.css +9 -26
  11. package/src/lib/styles/compat.css +580 -0
  12. package/src/lib/styles/themes/dark-auto.css +315 -0
  13. package/src/lib/styles/themes/dark.css +259 -157
  14. package/src/lib/styles/themes/light.css +236 -221
  15. package/src/lib/styles/tokens/animations.tokens.css +30 -21
  16. package/src/lib/styles/tokens/breakpoints.tokens.css +22 -6
  17. package/src/lib/styles/tokens/effects.tokens.css +25 -25
  18. package/src/lib/styles/tokens/layout.tokens.css +32 -32
  19. package/src/lib/styles/tokens/sizing.tokens.css +87 -75
  20. package/src/lib/styles/tokens/spacing.tokens.css +18 -18
  21. package/src/lib/styles/tokens/typography.tokens.css +34 -34
  22. package/src/lib/styles/utilities/animations.utils.css +18 -18
  23. package/src/lib/styles/utilities/colors.utils.css +196 -196
  24. package/src/lib/styles/utilities/focus.utils.css +13 -13
  25. package/src/lib/styles/utilities/layout.utils.css +9 -9
  26. package/src/lib/styles/utilities/responsive.utils.css +49 -49
  27. package/src/lib/styles/utilities/spacing.utils.css +96 -96
  28. package/src/lib/styles/utilities/typography.utils.css +25 -25
  29. package/styles-full.css +25 -0
  30. package/styles.css +17 -8
  31. package/types/ps-helix.d.ts +3252 -1724
@@ -0,0 +1,580 @@
1
+ /* ============================================================================
2
+ ps-helix — legacy token compatibility layer (OPT-IN)
3
+
4
+ Every custom property the library exposed before 7.0.0, redefined in terms of its
5
+ --psh-* replacement. Import it only while migrating:
6
+
7
+ @import 'ps-helix/styles.css';
8
+ @import 'ps-helix/src/lib/styles/compat.css'; // remove once migrated
9
+
10
+ It is not part of styles.css on purpose: the unprefixed names are exactly what
11
+ collided with Bootstrap, PrimeNG and application tokens in the first place, so
12
+ keeping them is a transitional cost a project should opt into, not inherit.
13
+
14
+ 486 aliases, of which 9 point at a renamed or merged token.
15
+ Generated — do not edit by hand.
16
+ ========================================================================== */
17
+
18
+ :root {
19
+
20
+ --alert-animation-distance: var(--psh-alert-animation-distance);
21
+ --alert-animation-duration: var(--psh-alert-animation-duration);
22
+ --alert-dismiss-hover-bg: var(--psh-alert-dismiss-hover-bg);
23
+ --alert-icon-size: var(--psh-alert-icon-size);
24
+ --alert-icon-size-lg: var(--psh-alert-icon-size-lg);
25
+ --alert-icon-size-sm: var(--psh-alert-icon-size-sm);
26
+ --alert-info-bg: var(--psh-alert-info-bg);
27
+ --alert-info-border-color: var(--psh-alert-info-border-color);
28
+ --alert-info-text-color: var(--psh-alert-info-text-color);
29
+
30
+ --amber-100: var(--psh-amber-100);
31
+ --amber-200: var(--psh-amber-200);
32
+ --amber-300: var(--psh-amber-300);
33
+ --amber-400: var(--psh-amber-400);
34
+ --amber-50: var(--psh-amber-50);
35
+ --amber-500: var(--psh-amber-500);
36
+ --amber-600: var(--psh-amber-600);
37
+ --amber-700: var(--psh-amber-700);
38
+ --amber-800: var(--psh-amber-800);
39
+ --amber-900: var(--psh-amber-900);
40
+
41
+ --animation-distance-lg: var(--psh-animation-distance-lg);
42
+ --animation-distance-md: var(--psh-animation-distance-md);
43
+ --animation-distance-sm: var(--psh-animation-distance-sm);
44
+ --animation-duration-default: var(--psh-animation-duration-default);
45
+ --animation-duration-fast: var(--psh-animation-duration-fast);
46
+ --animation-duration-normal: var(--psh-animation-duration-normal);
47
+ --animation-duration-slow: var(--psh-animation-duration-slow);
48
+ --animation-easing-default: var(--psh-animation-easing-default);
49
+ --animation-easing-in: var(--psh-animation-easing-in);
50
+ --animation-easing-in-out: var(--psh-animation-easing-in-out);
51
+ --animation-easing-out: var(--psh-animation-easing-out);
52
+ --animation-easing-smooth: var(--psh-animation-easing-smooth);
53
+
54
+ --avatar-icon-size-lg: var(--psh-avatar-icon-size-lg);
55
+ --avatar-icon-size-md: var(--psh-avatar-icon-size-md);
56
+ --avatar-icon-size-sm: var(--psh-avatar-icon-size-sm);
57
+ --avatar-icon-size-xl: var(--psh-avatar-icon-size-xl);
58
+ --avatar-size-lg: var(--psh-avatar-size-lg);
59
+ --avatar-size-md: var(--psh-avatar-size-md);
60
+ --avatar-size-sm: var(--psh-avatar-size-sm);
61
+ --avatar-size-xl: var(--psh-avatar-size-xl);
62
+ --avatar-status-border: var(--psh-avatar-status-border);
63
+ --avatar-status-offset-md: var(--psh-avatar-status-offset-md);
64
+ --avatar-status-offset-sm: var(--psh-avatar-status-offset-sm);
65
+ --avatar-status-offset-xl: var(--psh-avatar-status-offset-xl);
66
+ --avatar-status-size-lg: var(--psh-avatar-status-size-lg);
67
+ --avatar-status-size-md: var(--psh-avatar-status-size-md);
68
+ --avatar-status-size-sm: var(--psh-avatar-status-size-sm);
69
+ --avatar-status-size-xl: var(--psh-avatar-status-size-xl);
70
+
71
+ --background-opacity: var(--psh-background-opacity);
72
+
73
+ --badge-dot-shadow: var(--psh-badge-dot-shadow);
74
+ --badge-height: var(--psh-badge-height);
75
+ --badge-height-lg: var(--psh-badge-height-lg);
76
+ --badge-height-sm: var(--psh-badge-height-sm);
77
+ --badge-width: var(--psh-badge-width);
78
+ --badge-width-lg: var(--psh-badge-width-lg);
79
+ --badge-width-sm: var(--psh-badge-width-sm);
80
+
81
+ --blue-100: var(--psh-blue-100);
82
+ --blue-200: var(--psh-blue-200);
83
+ --blue-300: var(--psh-blue-300);
84
+ --blue-400: var(--psh-blue-400);
85
+ --blue-50: var(--psh-blue-50);
86
+ --blue-500: var(--psh-blue-500);
87
+ --blue-600: var(--psh-blue-600);
88
+ --blue-700: var(--psh-blue-700);
89
+ --blue-800: var(--psh-blue-800);
90
+ --blue-900: var(--psh-blue-900);
91
+
92
+ --body-gradient: var(--psh-body-gradient);
93
+
94
+ --border-radius: var(--psh-radius-lg);
95
+ --border-radius-full: var(--psh-radius-full);
96
+ --border-radius-lg: var(--psh-radius-xl);
97
+ --border-width-0: var(--psh-border-width-0);
98
+ --border-width-1: var(--psh-border-width-1);
99
+ --border-width-2: var(--psh-border-width-2);
100
+ --border-width-4: var(--psh-border-width-4);
101
+ --border-width-8: var(--psh-border-width-8);
102
+
103
+ --breakpoint-2xl: var(--psh-breakpoint-2xl);
104
+ --breakpoint-lg: var(--psh-breakpoint-lg);
105
+ --breakpoint-md: var(--psh-breakpoint-md);
106
+ --breakpoint-sm: var(--psh-breakpoint-sm);
107
+ --breakpoint-xl: var(--psh-breakpoint-xl);
108
+ --breakpoint-xs: var(--psh-breakpoint-xs);
109
+
110
+ --btn-font-weight: var(--psh-btn-font-weight);
111
+ --btn-height-lg: var(--psh-control-height-lg);
112
+ --btn-height-md: var(--psh-control-height-md);
113
+ --btn-height-sm: var(--psh-control-height-sm);
114
+ --btn-min-width-icon-only: var(--psh-btn-min-width-icon-only);
115
+ --btn-min-width-lg: var(--psh-btn-min-width-lg);
116
+ --btn-min-width-md: var(--psh-btn-min-width-md);
117
+ --btn-min-width-sm: var(--psh-btn-min-width-sm);
118
+ --btn-transition: var(--psh-btn-transition);
119
+
120
+ --card-actions-padding: var(--psh-card-actions-padding);
121
+ --card-body-gap: var(--psh-card-body-gap);
122
+ --card-body-padding: var(--psh-card-body-padding);
123
+ --card-footer-padding: var(--psh-card-footer-padding);
124
+ --card-header-gap: var(--psh-card-header-gap);
125
+ --card-header-padding: var(--psh-card-header-padding);
126
+
127
+ --chart-danger-color: var(--psh-chart-danger-color);
128
+ --chart-grid-color: var(--psh-chart-grid-color);
129
+ --chart-legend-text: var(--psh-chart-legend-text);
130
+ --chart-primary-color: var(--psh-chart-primary-color);
131
+ --chart-secondary-color: var(--psh-chart-secondary-color);
132
+ --chart-success-color: var(--psh-chart-success-color);
133
+ --chart-text-color: var(--psh-chart-text-color);
134
+ --chart-tooltip-background: var(--psh-chart-tooltip-background);
135
+ --chart-tooltip-text: var(--psh-chart-tooltip-text);
136
+ --chart-warning-color: var(--psh-chart-warning-color);
137
+
138
+ --collapse-max-height: var(--psh-collapse-max-height);
139
+ --collapse-transition-duration: var(--psh-collapse-transition-duration);
140
+ --collapse-transition-timing: var(--psh-collapse-transition-timing);
141
+
142
+ --container-2xl: var(--psh-container-2xl);
143
+ --container-3xl: var(--psh-container-3xl);
144
+ --container-4xl: var(--psh-container-4xl);
145
+ --container-5xl: var(--psh-container-5xl);
146
+ --container-6xl: var(--psh-container-6xl);
147
+ --container-7xl: var(--psh-container-7xl);
148
+ --container-lg: var(--psh-container-lg);
149
+ --container-max-width: var(--psh-container-max-width);
150
+ --container-md: var(--psh-container-md);
151
+ --container-padding-lg: var(--psh-container-padding-lg);
152
+ --container-padding-md: var(--psh-container-padding-md);
153
+ --container-padding-sm: var(--psh-container-padding-sm);
154
+ --container-sm: var(--psh-container-sm);
155
+ --container-xl: var(--psh-container-xl);
156
+ --container-xs: var(--psh-container-xs);
157
+
158
+ --cyan-100: var(--psh-cyan-100);
159
+ --cyan-200: var(--psh-cyan-200);
160
+ --cyan-300: var(--psh-cyan-300);
161
+ --cyan-400: var(--psh-cyan-400);
162
+ --cyan-50: var(--psh-cyan-50);
163
+ --cyan-500: var(--psh-cyan-500);
164
+ --cyan-600: var(--psh-cyan-600);
165
+ --cyan-700: var(--psh-cyan-700);
166
+ --cyan-800: var(--psh-cyan-800);
167
+ --cyan-900: var(--psh-cyan-900);
168
+
169
+ --danger-color: var(--psh-danger-color);
170
+ --danger-color-rgb: var(--psh-danger-color-rgb);
171
+ --danger-color-text: var(--psh-danger-color-text);
172
+
173
+ --dropdown-max-height: var(--psh-dropdown-max-height);
174
+
175
+ --emerald-100: var(--psh-emerald-100);
176
+ --emerald-200: var(--psh-emerald-200);
177
+ --emerald-300: var(--psh-emerald-300);
178
+ --emerald-400: var(--psh-emerald-400);
179
+ --emerald-50: var(--psh-emerald-50);
180
+ --emerald-500: var(--psh-emerald-500);
181
+ --emerald-600: var(--psh-emerald-600);
182
+ --emerald-700: var(--psh-emerald-700);
183
+ --emerald-800: var(--psh-emerald-800);
184
+ --emerald-900: var(--psh-emerald-900);
185
+
186
+ --flex-auto: var(--psh-flex-auto);
187
+ --flex-initial: var(--psh-flex-initial);
188
+ --flex-none: var(--psh-flex-none);
189
+
190
+ --focus-outline-color: var(--psh-focus-outline-color);
191
+ --focus-outline-offset: var(--psh-focus-outline-offset);
192
+ --focus-outline-style: var(--psh-focus-outline-style);
193
+ --focus-outline-width: var(--psh-focus-outline-width);
194
+ --focus-ring-color: var(--psh-focus-ring-color);
195
+ --focus-ring-error: var(--psh-focus-ring-error);
196
+ --focus-ring-success: var(--psh-focus-ring-success);
197
+ --focus-ring-warning: var(--psh-focus-ring-warning);
198
+ --focus-ring-width: var(--psh-focus-ring-width);
199
+
200
+ --font-family: var(--psh-font-family);
201
+ --font-size-2xl: var(--psh-font-size-2xl);
202
+ --font-size-3xl: var(--psh-font-size-3xl);
203
+ --font-size-4xl: var(--psh-font-size-4xl);
204
+ --font-size-base: var(--psh-font-size-base);
205
+ --font-size-lg: var(--psh-font-size-lg);
206
+ --font-size-sm: var(--psh-font-size-sm);
207
+ --font-size-xl: var(--psh-font-size-xl);
208
+ --font-size-xs: var(--psh-font-size-xs);
209
+ --font-weight-bold: var(--psh-font-weight-bold);
210
+ --font-weight-medium: var(--psh-font-weight-medium);
211
+ --font-weight-normal: var(--psh-font-weight-normal);
212
+ --font-weight-semibold: var(--psh-font-weight-semibold);
213
+
214
+ --form-field-gap: var(--psh-form-field-gap);
215
+ --form-label-gap: var(--psh-form-label-gap);
216
+
217
+ --fuchsia-100: var(--psh-fuchsia-100);
218
+ --fuchsia-200: var(--psh-fuchsia-200);
219
+ --fuchsia-300: var(--psh-fuchsia-300);
220
+ --fuchsia-400: var(--psh-fuchsia-400);
221
+ --fuchsia-50: var(--psh-fuchsia-50);
222
+ --fuchsia-500: var(--psh-fuchsia-500);
223
+ --fuchsia-600: var(--psh-fuchsia-600);
224
+ --fuchsia-700: var(--psh-fuchsia-700);
225
+ --fuchsia-800: var(--psh-fuchsia-800);
226
+ --fuchsia-900: var(--psh-fuchsia-900);
227
+
228
+ --green-100: var(--psh-green-100);
229
+ --green-200: var(--psh-green-200);
230
+ --green-300: var(--psh-green-300);
231
+ --green-400: var(--psh-green-400);
232
+ --green-50: var(--psh-green-50);
233
+ --green-500: var(--psh-green-500);
234
+ --green-600: var(--psh-green-600);
235
+ --green-700: var(--psh-green-700);
236
+ --green-800: var(--psh-green-800);
237
+ --green-900: var(--psh-green-900);
238
+
239
+ --grid-cols-1: var(--psh-grid-cols-1);
240
+ --grid-cols-12: var(--psh-grid-cols-12);
241
+ --grid-cols-2: var(--psh-grid-cols-2);
242
+ --grid-cols-3: var(--psh-grid-cols-3);
243
+ --grid-cols-4: var(--psh-grid-cols-4);
244
+ --grid-cols-6: var(--psh-grid-cols-6);
245
+ --grid-gap-lg: var(--psh-grid-gap-lg);
246
+ --grid-gap-md: var(--psh-grid-gap-md);
247
+ --grid-gap-sm: var(--psh-grid-gap-sm);
248
+
249
+ --height-input-lg: var(--psh-control-height-lg);
250
+ --height-input-md: var(--psh-control-height-md);
251
+ --height-input-sm: var(--psh-control-height-sm);
252
+
253
+ --horizontal-content-padding: var(--psh-horizontal-content-padding);
254
+ --horizontal-gap: var(--psh-horizontal-gap);
255
+ --horizontal-mobile-height: var(--psh-horizontal-mobile-height);
256
+ --horizontal-side-padding: var(--psh-horizontal-side-padding);
257
+ --horizontal-side-width: var(--psh-horizontal-side-width);
258
+
259
+ --icon-size-2xl: var(--psh-icon-size-2xl);
260
+ --icon-size-lg: var(--psh-icon-size-lg);
261
+ --icon-size-md: var(--psh-icon-size-md);
262
+ --icon-size-sm: var(--psh-icon-size-sm);
263
+ --icon-size-xl: var(--psh-icon-size-xl);
264
+ --icon-size-xs: var(--psh-icon-size-xs);
265
+
266
+ --indigo-100: var(--psh-indigo-100);
267
+ --indigo-200: var(--psh-indigo-200);
268
+ --indigo-300: var(--psh-indigo-300);
269
+ --indigo-400: var(--psh-indigo-400);
270
+ --indigo-50: var(--psh-indigo-50);
271
+ --indigo-500: var(--psh-indigo-500);
272
+ --indigo-600: var(--psh-indigo-600);
273
+ --indigo-700: var(--psh-indigo-700);
274
+ --indigo-800: var(--psh-indigo-800);
275
+ --indigo-900: var(--psh-indigo-900);
276
+
277
+ --letter-spacing-normal: var(--psh-letter-spacing-normal);
278
+ --letter-spacing-tight: var(--psh-letter-spacing-tight);
279
+ --letter-spacing-wide: var(--psh-letter-spacing-wide);
280
+ --letter-spacing-wider: var(--psh-letter-spacing-wider);
281
+ --letter-spacing-widest: var(--psh-letter-spacing-widest);
282
+
283
+ --line-height-normal: var(--psh-line-height-normal);
284
+ --line-height-relaxed: var(--psh-line-height-relaxed);
285
+ --line-height-tight: var(--psh-line-height-tight);
286
+
287
+ --modal-animation-distance: var(--psh-modal-animation-distance);
288
+ --modal-animation-scale: var(--psh-modal-animation-scale);
289
+ --modal-backdrop-blur: var(--psh-modal-backdrop-blur);
290
+ --modal-backdrop-opacity: var(--psh-modal-backdrop-opacity);
291
+ --modal-max-width-lg: var(--psh-modal-max-width-lg);
292
+ --modal-max-width-md: var(--psh-modal-max-width-md);
293
+ --modal-max-width-sm: var(--psh-modal-max-width-sm);
294
+
295
+ --negative-spacing-2xl: var(--psh-negative-spacing-2xl);
296
+ --negative-spacing-lg: var(--psh-negative-spacing-lg);
297
+ --negative-spacing-md: var(--psh-negative-spacing-md);
298
+ --negative-spacing-sm: var(--psh-negative-spacing-sm);
299
+ --negative-spacing-xl: var(--psh-negative-spacing-xl);
300
+ --negative-spacing-xs: var(--psh-negative-spacing-xs);
301
+ --negative-spacing-xxs: var(--psh-negative-spacing-xxs);
302
+
303
+ --opacity-disabled: var(--psh-opacity-disabled);
304
+ --opacity-loading: var(--psh-opacity-loading);
305
+
306
+ --orange-100: var(--psh-orange-100);
307
+ --orange-200: var(--psh-orange-200);
308
+ --orange-300: var(--psh-orange-300);
309
+ --orange-400: var(--psh-orange-400);
310
+ --orange-50: var(--psh-orange-50);
311
+ --orange-500: var(--psh-orange-500);
312
+ --orange-600: var(--psh-orange-600);
313
+ --orange-700: var(--psh-orange-700);
314
+ --orange-800: var(--psh-orange-800);
315
+ --orange-900: var(--psh-orange-900);
316
+
317
+ --pink-100: var(--psh-pink-100);
318
+ --pink-200: var(--psh-pink-200);
319
+ --pink-300: var(--psh-pink-300);
320
+ --pink-400: var(--psh-pink-400);
321
+ --pink-50: var(--psh-pink-50);
322
+ --pink-500: var(--psh-pink-500);
323
+ --pink-600: var(--psh-pink-600);
324
+ --pink-700: var(--psh-pink-700);
325
+ --pink-800: var(--psh-pink-800);
326
+ --pink-900: var(--psh-pink-900);
327
+
328
+ --primary-color: var(--psh-primary-color);
329
+ --primary-color-dark: var(--psh-primary-color-dark);
330
+ --primary-color-darker: var(--psh-primary-color-darker);
331
+ --primary-color-light: var(--psh-primary-color-light);
332
+ --primary-color-lighter: var(--psh-primary-color-lighter);
333
+ --primary-color-rgb: var(--psh-primary-color-rgb);
334
+ --primary-color-text: var(--psh-primary-color-text);
335
+ --primary-gradient: var(--psh-primary-gradient);
336
+ --primary-gradient-hover: var(--psh-primary-gradient-hover);
337
+ --primary-gradient-reversed: var(--psh-primary-gradient-reversed);
338
+
339
+ --progress-duration: var(--psh-progress-duration);
340
+
341
+ --progressbar-height-lg: var(--psh-progressbar-height-lg);
342
+ --progressbar-height-md: var(--psh-progressbar-height-md);
343
+ --progressbar-height-sm: var(--psh-progressbar-height-sm);
344
+ --progressbar-stripe-opacity: var(--psh-progressbar-stripe-opacity);
345
+
346
+ --purple-100: var(--psh-purple-100);
347
+ --purple-200: var(--psh-purple-200);
348
+ --purple-300: var(--psh-purple-300);
349
+ --purple-400: var(--psh-purple-400);
350
+ --purple-50: var(--psh-purple-50);
351
+ --purple-500: var(--psh-purple-500);
352
+ --purple-600: var(--psh-purple-600);
353
+ --purple-700: var(--psh-purple-700);
354
+ --purple-800: var(--psh-purple-800);
355
+ --purple-900: var(--psh-purple-900);
356
+
357
+ --radius-2xl: var(--psh-radius-2xl);
358
+ --radius-3xl: var(--psh-radius-3xl);
359
+ --radius-base: var(--psh-radius-base);
360
+ --radius-full: var(--psh-radius-full);
361
+ --radius-lg: var(--psh-radius-lg);
362
+ --radius-md: var(--psh-radius-md);
363
+ --radius-none: var(--psh-radius-none);
364
+ --radius-sm: var(--psh-radius-sm);
365
+ --radius-xl: var(--psh-radius-xl);
366
+
367
+ --red-100: var(--psh-red-100);
368
+ --red-200: var(--psh-red-200);
369
+ --red-300: var(--psh-red-300);
370
+ --red-400: var(--psh-red-400);
371
+ --red-50: var(--psh-red-50);
372
+ --red-500: var(--psh-red-500);
373
+ --red-600: var(--psh-red-600);
374
+ --red-700: var(--psh-red-700);
375
+ --red-800: var(--psh-red-800);
376
+ --red-900: var(--psh-red-900);
377
+
378
+ --rose-100: var(--psh-rose-100);
379
+ --rose-200: var(--psh-rose-200);
380
+ --rose-300: var(--psh-rose-300);
381
+ --rose-400: var(--psh-rose-400);
382
+ --rose-50: var(--psh-rose-50);
383
+ --rose-500: var(--psh-rose-500);
384
+ --rose-600: var(--psh-rose-600);
385
+ --rose-700: var(--psh-rose-700);
386
+ --rose-800: var(--psh-rose-800);
387
+ --rose-900: var(--psh-rose-900);
388
+
389
+ --scrollbar-width: var(--psh-scrollbar-width);
390
+
391
+ --secondary-color: var(--psh-secondary-color);
392
+ --secondary-color-dark: var(--psh-secondary-color-dark);
393
+ --secondary-color-darker: var(--psh-secondary-color-darker);
394
+ --secondary-color-light: var(--psh-secondary-color-light);
395
+ --secondary-color-lighter: var(--psh-secondary-color-lighter);
396
+ --secondary-color-rgb: var(--psh-secondary-color-rgb);
397
+ --secondary-color-text: var(--psh-secondary-color-text);
398
+
399
+ --select-checkbox-size: var(--psh-select-checkbox-size);
400
+ --select-max-width: var(--psh-select-max-width);
401
+
402
+ --shadow-lg: var(--psh-shadow-lg);
403
+ --shadow-md: var(--psh-shadow-md);
404
+ --shadow-sm: var(--psh-shadow-sm);
405
+
406
+ --sidebar-width: var(--psh-sidebar-width);
407
+
408
+ --size-0: var(--psh-size-0);
409
+ --size-0-5: var(--psh-size-0-5);
410
+ --size-1: var(--psh-size-1);
411
+ --size-1-5: var(--psh-size-1-5);
412
+ --size-10: var(--psh-size-10);
413
+ --size-11: var(--psh-size-11);
414
+ --size-12: var(--psh-size-12);
415
+ --size-14: var(--psh-size-14);
416
+ --size-16: var(--psh-size-16);
417
+ --size-18: var(--psh-size-18);
418
+ --size-2: var(--psh-size-2);
419
+ --size-2-5: var(--psh-size-2-5);
420
+ --size-20: var(--psh-size-20);
421
+ --size-24: var(--psh-size-24);
422
+ --size-28: var(--psh-size-28);
423
+ --size-3: var(--psh-size-3);
424
+ --size-3-5: var(--psh-size-3-5);
425
+ --size-32: var(--psh-size-32);
426
+ --size-36: var(--psh-size-36);
427
+ --size-4: var(--psh-size-4);
428
+ --size-4-5: var(--psh-size-4-5);
429
+ --size-40: var(--psh-size-40);
430
+ --size-44: var(--psh-size-44);
431
+ --size-48: var(--psh-size-48);
432
+ --size-5: var(--psh-size-5);
433
+ --size-5-5: var(--psh-size-5-5);
434
+ --size-52: var(--psh-size-52);
435
+ --size-56: var(--psh-size-56);
436
+ --size-6: var(--psh-size-6);
437
+ --size-6-5: var(--psh-size-6-5);
438
+ --size-60: var(--psh-size-60);
439
+ --size-64: var(--psh-size-64);
440
+ --size-7: var(--psh-size-7);
441
+ --size-72: var(--psh-size-72);
442
+ --size-8: var(--psh-size-8);
443
+ --size-8-5: var(--psh-size-8-5);
444
+ --size-80: var(--psh-size-80);
445
+ --size-9: var(--psh-size-9);
446
+ --size-96: var(--psh-size-96);
447
+ --size-px: var(--psh-size-px);
448
+
449
+ --spacing-2xl: var(--psh-spacing-2xl);
450
+ --spacing-3xl: var(--psh-spacing-3xl);
451
+ --spacing-4xl: var(--psh-spacing-4xl);
452
+ --spacing-lg: var(--psh-spacing-lg);
453
+ --spacing-md: var(--psh-spacing-md);
454
+ --spacing-sm: var(--psh-spacing-sm);
455
+ --spacing-xl: var(--psh-spacing-xl);
456
+ --spacing-xs: var(--psh-spacing-xs);
457
+ --spacing-xxs: var(--psh-spacing-xxs);
458
+
459
+ --spinner-dot-size-lg: var(--psh-spinner-dot-size-lg);
460
+ --spinner-dot-size-md: var(--psh-spinner-dot-size-md);
461
+ --spinner-dot-size-sm: var(--psh-spinner-dot-size-sm);
462
+ --spinner-pulse-height-lg: var(--psh-spinner-pulse-height-lg);
463
+ --spinner-pulse-height-md: var(--psh-spinner-pulse-height-md);
464
+ --spinner-pulse-height-sm: var(--psh-spinner-pulse-height-sm);
465
+ --spinner-pulse-width-lg: var(--psh-spinner-pulse-width-lg);
466
+ --spinner-pulse-width-md: var(--psh-spinner-pulse-width-md);
467
+ --spinner-pulse-width-sm: var(--psh-spinner-pulse-width-sm);
468
+ --spinner-size-lg: var(--psh-spinner-size-lg);
469
+ --spinner-size-md: var(--psh-spinner-size-md);
470
+ --spinner-size-sm: var(--psh-spinner-size-sm);
471
+
472
+ --success-color: var(--psh-success-color);
473
+ --success-color-rgb: var(--psh-success-color-rgb);
474
+ --success-color-text: var(--psh-success-color-text);
475
+
476
+ --surface-0: var(--psh-surface-0);
477
+ --surface-100: var(--psh-surface-100);
478
+ --surface-200: var(--psh-surface-200);
479
+ --surface-300: var(--psh-surface-300);
480
+ --surface-400: var(--psh-surface-400);
481
+ --surface-50: var(--psh-surface-50);
482
+ --surface-500: var(--psh-surface-500);
483
+ --surface-600: var(--psh-surface-600);
484
+ --surface-700: var(--psh-surface-700);
485
+ --surface-800: var(--psh-surface-800);
486
+ --surface-900: var(--psh-surface-900);
487
+ --surface-900-rgb: var(--psh-surface-900-rgb);
488
+ --surface-border: var(--psh-surface-border);
489
+ --surface-card: var(--psh-surface-card);
490
+ --surface-ground: var(--psh-surface-ground);
491
+ --surface-hover: var(--psh-surface-hover);
492
+ --surface-overlay: var(--psh-surface-overlay);
493
+ --surface-section: var(--psh-surface-section);
494
+
495
+ --tag-close-hover-bg: var(--psh-tag-close-hover-bg);
496
+ --tag-close-opacity: var(--psh-tag-close-opacity);
497
+ --tag-close-opacity-hover: var(--psh-tag-close-opacity-hover);
498
+ --tag-close-padding: var(--psh-tag-close-padding);
499
+ --tag-font-size: var(--psh-tag-font-size);
500
+ --tag-icon-size: var(--psh-tag-icon-size);
501
+ --tag-padding-x: var(--psh-tag-padding-x);
502
+ --tag-padding-y: var(--psh-tag-padding-y);
503
+ --tag-transition: var(--psh-tag-transition);
504
+
505
+ --teal-100: var(--psh-teal-100);
506
+ --teal-200: var(--psh-teal-200);
507
+ --teal-300: var(--psh-teal-300);
508
+ --teal-400: var(--psh-teal-400);
509
+ --teal-50: var(--psh-teal-50);
510
+ --teal-500: var(--psh-teal-500);
511
+ --teal-600: var(--psh-teal-600);
512
+ --teal-700: var(--psh-teal-700);
513
+ --teal-800: var(--psh-teal-800);
514
+ --teal-900: var(--psh-teal-900);
515
+
516
+ --text-color: var(--psh-text-color);
517
+ --text-color-disabled: var(--psh-text-color-disabled);
518
+ --text-color-secondary: var(--psh-text-color-secondary);
519
+ --text-color-tertiary: var(--psh-text-color-tertiary);
520
+ --text-on-danger: var(--psh-text-on-danger);
521
+ --text-on-dark: var(--psh-text-on-dark);
522
+ --text-on-light: var(--psh-text-on-light);
523
+ --text-on-primary: var(--psh-text-on-primary);
524
+ --text-on-secondary: var(--psh-text-on-secondary);
525
+ --text-on-success: var(--psh-text-on-success);
526
+ --text-on-surface: var(--psh-text-on-surface);
527
+ --text-on-warning: var(--psh-text-on-warning);
528
+
529
+ --toast-icon-size: var(--psh-toast-icon-size);
530
+ --toast-max-width: var(--psh-toast-max-width);
531
+ --toast-min-width: var(--psh-toast-min-width);
532
+ --toast-progress-height: var(--psh-toast-progress-height);
533
+
534
+ --violet-100: var(--psh-violet-100);
535
+ --violet-200: var(--psh-violet-200);
536
+ --violet-300: var(--psh-violet-300);
537
+ --violet-400: var(--psh-violet-400);
538
+ --violet-50: var(--psh-violet-50);
539
+ --violet-500: var(--psh-violet-500);
540
+ --violet-600: var(--psh-violet-600);
541
+ --violet-700: var(--psh-violet-700);
542
+ --violet-800: var(--psh-violet-800);
543
+ --violet-900: var(--psh-violet-900);
544
+
545
+ --warning-color: var(--psh-warning-color);
546
+ --warning-color-rgb: var(--psh-warning-color-rgb);
547
+ --warning-color-text: var(--psh-warning-color-text);
548
+
549
+ --yellow-100: var(--psh-yellow-100);
550
+ --yellow-200: var(--psh-yellow-200);
551
+ --yellow-300: var(--psh-yellow-300);
552
+ --yellow-400: var(--psh-yellow-400);
553
+ --yellow-50: var(--psh-yellow-50);
554
+ --yellow-500: var(--psh-yellow-500);
555
+ --yellow-600: var(--psh-yellow-600);
556
+ --yellow-700: var(--psh-yellow-700);
557
+ --yellow-800: var(--psh-yellow-800);
558
+ --yellow-900: var(--psh-yellow-900);
559
+
560
+ --z-index-dropdown: var(--psh-z-index-dropdown);
561
+ --z-index-modal: var(--psh-z-index-modal);
562
+ --z-index-modal-backdrop: var(--psh-z-index-modal-backdrop);
563
+ --z-index-navigation: var(--psh-z-index-navigation);
564
+ --z-index-overlay: var(--psh-z-index-overlay);
565
+ --z-index-toast: var(--psh-z-index-toast);
566
+ --z-index-tooltip: var(--psh-z-index-tooltip);
567
+ }
568
+
569
+ /* Merged scales — these legacy names resolved to a different token than their
570
+ name suggested, and now point at the step they actually rendered:
571
+ --border-radius → --psh-radius-lg
572
+ --border-radius-full → --psh-radius-full
573
+ --border-radius-lg → --psh-radius-xl
574
+ --btn-height-lg → --psh-control-height-lg
575
+ --btn-height-md → --psh-control-height-md
576
+ --btn-height-sm → --psh-control-height-sm
577
+ --height-input-lg → --psh-control-height-lg
578
+ --height-input-md → --psh-control-height-md
579
+ --height-input-sm → --psh-control-height-sm
580
+ */