@mkatogui/uds-tokens 0.2.1 → 0.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/README.md +1 -1
- package/dist/index.d.ts +149 -1
- package/dist/index.js +151 -3
- package/dist/index.mjs +149 -1
- package/dist/tokens.css +713 -612
- package/dist/tokens.d.ts +432 -0
- package/dist/tokens.json +179 -33
- package/package.json +8 -4
package/README.md
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
# @mkatogui/uds-tokens
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
600 W3C DTCG design tokens from the [Universal Design System](https://github.com/mkatogui/universal-design-system) -- CSS custom properties, JavaScript/TypeScript objects, and flat JSON.
|
|
4
4
|
|
|
5
5
|
Includes 9 structural palettes (minimal-saas, ai-futuristic, gradient-startup, corporate, apple-minimal, illustration, dashboard, bold-lifestyle, minimal-corporate) with light and dark mode support.
|
|
6
6
|
|
package/dist/index.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Universal Design System -- TypeScript Token Types
|
|
3
|
-
* Auto-generated by @
|
|
3
|
+
* Auto-generated by @mkatogui/uds-tokens build script
|
|
4
4
|
*/
|
|
5
5
|
|
|
6
6
|
export declare const tokens: {
|
|
@@ -53,6 +53,7 @@ export declare const tokens: {
|
|
|
53
53
|
readonly '500': string;
|
|
54
54
|
readonly '600': string;
|
|
55
55
|
readonly '700': string;
|
|
56
|
+
readonly '800': string;
|
|
56
57
|
};
|
|
57
58
|
readonly cyan: {
|
|
58
59
|
readonly '400': string;
|
|
@@ -114,8 +115,11 @@ export declare const tokens: {
|
|
|
114
115
|
};
|
|
115
116
|
readonly success: string;
|
|
116
117
|
readonly 'success-bg': string;
|
|
118
|
+
readonly 'success-on-bg': string;
|
|
117
119
|
readonly warning: string;
|
|
118
120
|
readonly 'warning-bg': string;
|
|
121
|
+
readonly 'warning-on-bg': string;
|
|
122
|
+
readonly 'text-on-error': string;
|
|
119
123
|
readonly error: string;
|
|
120
124
|
readonly 'error-bg': string;
|
|
121
125
|
readonly info: string;
|
|
@@ -126,6 +130,17 @@ export declare const tokens: {
|
|
|
126
130
|
readonly 'text-disabled': string;
|
|
127
131
|
readonly 'border-strong': string;
|
|
128
132
|
readonly overlay: string;
|
|
133
|
+
readonly 'action-primary': string;
|
|
134
|
+
readonly 'action-secondary': string;
|
|
135
|
+
readonly 'action-destructive': string;
|
|
136
|
+
readonly 'feedback-success': string;
|
|
137
|
+
readonly 'feedback-warning': string;
|
|
138
|
+
readonly 'feedback-error': string;
|
|
139
|
+
readonly 'feedback-info': string;
|
|
140
|
+
readonly 'surface-elevated': string;
|
|
141
|
+
readonly 'surface-overlay': string;
|
|
142
|
+
readonly 'text-link': string;
|
|
143
|
+
readonly 'border-focus': string;
|
|
129
144
|
};
|
|
130
145
|
readonly chart: {
|
|
131
146
|
readonly '1': string;
|
|
@@ -137,6 +152,12 @@ export declare const tokens: {
|
|
|
137
152
|
readonly '7': string;
|
|
138
153
|
readonly '8': string;
|
|
139
154
|
};
|
|
155
|
+
readonly utility: {
|
|
156
|
+
readonly 'hover-tint': string;
|
|
157
|
+
readonly 'hover-shade': string;
|
|
158
|
+
readonly 'disabled-overlay': string;
|
|
159
|
+
readonly 'focus-ring': string;
|
|
160
|
+
};
|
|
140
161
|
};
|
|
141
162
|
readonly typography: {
|
|
142
163
|
readonly fontFamily: {
|
|
@@ -216,6 +237,46 @@ export declare const tokens: {
|
|
|
216
237
|
readonly in: string;
|
|
217
238
|
readonly out: string;
|
|
218
239
|
readonly spring: string;
|
|
240
|
+
readonly 'spring-gentle': string;
|
|
241
|
+
readonly 'spring-bouncy': string;
|
|
242
|
+
readonly 'spring-stiff': string;
|
|
243
|
+
};
|
|
244
|
+
readonly keyframes: {
|
|
245
|
+
readonly 'fade-in': string;
|
|
246
|
+
readonly 'fade-out': string;
|
|
247
|
+
readonly 'slide-up': string;
|
|
248
|
+
readonly 'slide-down': string;
|
|
249
|
+
readonly 'slide-left': string;
|
|
250
|
+
readonly 'slide-right': string;
|
|
251
|
+
readonly 'scale-in': string;
|
|
252
|
+
readonly 'scale-out': string;
|
|
253
|
+
readonly spin: string;
|
|
254
|
+
readonly pulse: string;
|
|
255
|
+
readonly bounce: string;
|
|
256
|
+
readonly shake: string;
|
|
257
|
+
readonly shimmer: string;
|
|
258
|
+
readonly 'skeleton-wave': string;
|
|
259
|
+
readonly 'pulse-ring': string;
|
|
260
|
+
readonly 'checkbox-morph': string;
|
|
261
|
+
readonly 'toggle-slide': string;
|
|
262
|
+
readonly 'accordion-height': string;
|
|
263
|
+
readonly 'tab-indicator': string;
|
|
264
|
+
readonly counter: string;
|
|
265
|
+
readonly typing: string;
|
|
266
|
+
readonly 'fade-in-up': string;
|
|
267
|
+
readonly 'slide-in-right': string;
|
|
268
|
+
readonly 'bounce-in': string;
|
|
269
|
+
};
|
|
270
|
+
readonly 'scroll-driven': {
|
|
271
|
+
readonly progress: string;
|
|
272
|
+
readonly 'reveal-threshold': string;
|
|
273
|
+
readonly 'parallax-factor': string;
|
|
274
|
+
};
|
|
275
|
+
readonly style: {
|
|
276
|
+
readonly conservative: string;
|
|
277
|
+
readonly moderate: string;
|
|
278
|
+
readonly expressive: string;
|
|
279
|
+
readonly instant: string;
|
|
219
280
|
};
|
|
220
281
|
};
|
|
221
282
|
readonly opacity: {
|
|
@@ -232,6 +293,39 @@ export declare const tokens: {
|
|
|
232
293
|
readonly '2xl': string;
|
|
233
294
|
};
|
|
234
295
|
readonly component: {
|
|
296
|
+
readonly modal: {
|
|
297
|
+
readonly 'overlay-opacity': string;
|
|
298
|
+
readonly 'content-padding': string;
|
|
299
|
+
readonly 'header-padding': string;
|
|
300
|
+
readonly 'footer-padding': string;
|
|
301
|
+
readonly 'width-sm': string;
|
|
302
|
+
readonly 'width-md': string;
|
|
303
|
+
readonly 'width-lg': string;
|
|
304
|
+
};
|
|
305
|
+
readonly dropdown: {
|
|
306
|
+
readonly 'menu-min-width': string;
|
|
307
|
+
readonly 'item-height-sm': string;
|
|
308
|
+
readonly 'item-height-md': string;
|
|
309
|
+
readonly 'item-height-lg': string;
|
|
310
|
+
readonly 'separator-margin': string;
|
|
311
|
+
};
|
|
312
|
+
readonly alert: {
|
|
313
|
+
readonly 'icon-size': string;
|
|
314
|
+
readonly 'padding-sm': string;
|
|
315
|
+
readonly 'padding-md': string;
|
|
316
|
+
readonly 'padding-lg': string;
|
|
317
|
+
};
|
|
318
|
+
readonly input: {
|
|
319
|
+
readonly 'label-gap': string;
|
|
320
|
+
readonly 'helper-gap': string;
|
|
321
|
+
readonly 'icon-size': string;
|
|
322
|
+
readonly 'icon-inset': string;
|
|
323
|
+
};
|
|
324
|
+
readonly 'feature-card': {
|
|
325
|
+
readonly 'media-height': string;
|
|
326
|
+
readonly 'content-padding': string;
|
|
327
|
+
readonly 'footer-padding': string;
|
|
328
|
+
};
|
|
235
329
|
readonly tabs: {
|
|
236
330
|
readonly height_md: string;
|
|
237
331
|
readonly height_sm: string;
|
|
@@ -337,7 +431,61 @@ export declare const tokens: {
|
|
|
337
431
|
readonly default: string;
|
|
338
432
|
readonly wide: string;
|
|
339
433
|
};
|
|
434
|
+
readonly stack: {
|
|
435
|
+
readonly 'gap-xs': string;
|
|
436
|
+
readonly 'gap-sm': string;
|
|
437
|
+
readonly 'gap-md': string;
|
|
438
|
+
readonly 'gap-lg': string;
|
|
439
|
+
readonly 'gap-xl': string;
|
|
440
|
+
};
|
|
441
|
+
readonly grid: {
|
|
442
|
+
readonly 'columns-1': string;
|
|
443
|
+
readonly 'columns-2': string;
|
|
444
|
+
readonly 'columns-3': string;
|
|
445
|
+
readonly 'columns-4': string;
|
|
446
|
+
readonly 'columns-6': string;
|
|
447
|
+
readonly 'columns-12': string;
|
|
448
|
+
};
|
|
449
|
+
readonly 'container-query': {
|
|
450
|
+
readonly sm: string;
|
|
451
|
+
readonly md: string;
|
|
452
|
+
readonly lg: string;
|
|
453
|
+
readonly xl: string;
|
|
454
|
+
};
|
|
455
|
+
readonly 'container-max-width': {
|
|
456
|
+
readonly sm: string;
|
|
457
|
+
readonly md: string;
|
|
458
|
+
readonly lg: string;
|
|
459
|
+
readonly xl: string;
|
|
460
|
+
};
|
|
461
|
+
};
|
|
462
|
+
readonly transition: {
|
|
463
|
+
readonly 'view-transition-name': {
|
|
464
|
+
readonly header: string;
|
|
465
|
+
readonly hero: string;
|
|
466
|
+
readonly card: string;
|
|
467
|
+
readonly sidebar: string;
|
|
468
|
+
readonly modal: string;
|
|
469
|
+
};
|
|
470
|
+
readonly 'starting-style': {
|
|
471
|
+
readonly modal: string;
|
|
472
|
+
readonly dropdown: string;
|
|
473
|
+
readonly toast: string;
|
|
474
|
+
readonly popover: string;
|
|
475
|
+
};
|
|
476
|
+
readonly behavior: {
|
|
477
|
+
readonly 'allow-discrete': string;
|
|
478
|
+
};
|
|
479
|
+
readonly style: {
|
|
480
|
+
readonly elegant: string;
|
|
481
|
+
readonly snappy: string;
|
|
482
|
+
readonly gentle: string;
|
|
483
|
+
readonly instant: string;
|
|
484
|
+
};
|
|
340
485
|
};
|
|
341
486
|
};
|
|
342
487
|
|
|
343
488
|
export type Tokens = typeof tokens;
|
|
489
|
+
|
|
490
|
+
// Re-export palette and token name types from tokens.d.ts
|
|
491
|
+
export { TokenName, PaletteName, isPalette, PaletteTokens, ThemeConfig } from './tokens';
|
package/dist/index.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Universal Design System -- Design Tokens (CommonJS)
|
|
3
|
-
* Auto-generated by @
|
|
3
|
+
* Auto-generated by @mkatogui/uds-tokens build script
|
|
4
4
|
*/
|
|
5
5
|
"use strict";
|
|
6
6
|
|
|
@@ -54,6 +54,7 @@ const tokens = {
|
|
|
54
54
|
'500': 'var(--color-primitive-amber-500, #F59E0B)',
|
|
55
55
|
'600': 'var(--color-primitive-amber-600, #D97706)',
|
|
56
56
|
'700': 'var(--color-primitive-amber-700, #B45309)',
|
|
57
|
+
'800': 'var(--color-primitive-amber-800, #92400e)',
|
|
57
58
|
},
|
|
58
59
|
cyan: {
|
|
59
60
|
'400': 'var(--color-primitive-cyan-400, #22D3EE)',
|
|
@@ -115,18 +116,32 @@ const tokens = {
|
|
|
115
116
|
},
|
|
116
117
|
success: 'var(--color-semantic-success, #059669)',
|
|
117
118
|
'success-bg': 'var(--color-semantic-success-bg, #ECFDF5)',
|
|
119
|
+
'success-on-bg': 'var(--color-semantic-success-on-bg, #047857)',
|
|
118
120
|
warning: 'var(--color-semantic-warning, #D97706)',
|
|
119
121
|
'warning-bg': 'var(--color-semantic-warning-bg, #FFFBEB)',
|
|
122
|
+
'warning-on-bg': 'var(--color-semantic-warning-on-bg, #92400e)',
|
|
123
|
+
'text-on-error': 'var(--color-semantic-text-on-error, #171717)',
|
|
120
124
|
error: 'var(--color-semantic-error, #DC2626)',
|
|
121
125
|
'error-bg': 'var(--color-semantic-error-bg, #FEF2F2)',
|
|
122
126
|
info: 'var(--color-semantic-info, #2563EB)',
|
|
123
127
|
'info-bg': 'var(--color-semantic-info-bg, #EFF6FF)',
|
|
124
|
-
'surface-default': 'var(--color-semantic-surface-default,
|
|
128
|
+
'surface-default': 'var(--color-semantic-surface-default, #FFFFFF)',
|
|
125
129
|
'surface-hover': 'var(--color-semantic-surface-hover, #F5F5FA)',
|
|
126
130
|
'surface-active': 'var(--color-semantic-surface-active, #EDEDF5)',
|
|
127
131
|
'text-disabled': 'var(--color-semantic-text-disabled, #A0A0B0)',
|
|
128
132
|
'border-strong': 'var(--color-semantic-border-strong, #6E6E7E)',
|
|
129
133
|
overlay: 'var(--color-semantic-overlay, rgba(0, 0, 0, 0.5))',
|
|
134
|
+
'action-primary': 'var(--color-semantic-action-primary, #2563EB)',
|
|
135
|
+
'action-secondary': 'var(--color-semantic-action-secondary, #3B82F6)',
|
|
136
|
+
'action-destructive': 'var(--color-semantic-action-destructive, #DC2626)',
|
|
137
|
+
'feedback-success': 'var(--color-semantic-feedback-success, #059669)',
|
|
138
|
+
'feedback-warning': 'var(--color-semantic-feedback-warning, #D97706)',
|
|
139
|
+
'feedback-error': 'var(--color-semantic-feedback-error, #DC2626)',
|
|
140
|
+
'feedback-info': 'var(--color-semantic-feedback-info, #2563EB)',
|
|
141
|
+
'surface-elevated': 'var(--color-semantic-surface-elevated, #F8F8FA)',
|
|
142
|
+
'surface-overlay': 'var(--color-semantic-surface-overlay, #F0F0F5)',
|
|
143
|
+
'text-link': 'var(--color-semantic-text-link, #2563EB)',
|
|
144
|
+
'border-focus': 'var(--color-semantic-border-focus, #2563EB)',
|
|
130
145
|
},
|
|
131
146
|
chart: {
|
|
132
147
|
'1': 'var(--color-chart-1, #4F46E5)',
|
|
@@ -138,6 +153,12 @@ const tokens = {
|
|
|
138
153
|
'7': 'var(--color-chart-7, #EC4899)',
|
|
139
154
|
'8': 'var(--color-chart-8, #06B6D4)',
|
|
140
155
|
},
|
|
156
|
+
utility: {
|
|
157
|
+
'hover-tint': 'var(--color-utility-hover-tint, color-mix(in oklch, var(--color-brand-primary) 85%, white))',
|
|
158
|
+
'hover-shade': 'var(--color-utility-hover-shade, color-mix(in oklch, var(--color-brand-primary) 85%, black))',
|
|
159
|
+
'disabled-overlay': 'var(--color-utility-disabled-overlay, color-mix(in oklch, var(--color-bg-primary) 50%, transparent))',
|
|
160
|
+
'focus-ring': 'var(--color-utility-focus-ring, color-mix(in oklch, var(--color-brand-accent) 40%, transparent))',
|
|
161
|
+
},
|
|
141
162
|
},
|
|
142
163
|
typography: {
|
|
143
164
|
fontFamily: {
|
|
@@ -217,6 +238,46 @@ const tokens = {
|
|
|
217
238
|
in: 'var(--motion-easing-in, cubic-bezier(0.4, 0, 1, 1))',
|
|
218
239
|
out: 'var(--motion-easing-out, cubic-bezier(0, 0, 0.2, 1))',
|
|
219
240
|
spring: 'var(--motion-easing-spring, cubic-bezier(0.34, 1.56, 0.64, 1))',
|
|
241
|
+
'spring-gentle': 'var(--motion-easing-spring-gentle, cubic-bezier(0.34, 1.56, 0.64, 1))',
|
|
242
|
+
'spring-bouncy': 'var(--motion-easing-spring-bouncy, cubic-bezier(0.68, -0.55, 0.265, 1.55))',
|
|
243
|
+
'spring-stiff': 'var(--motion-easing-spring-stiff, cubic-bezier(0.4, 0, 0.2, 1))',
|
|
244
|
+
},
|
|
245
|
+
keyframes: {
|
|
246
|
+
'fade-in': 'var(--motion-keyframes-fade-in, {"0%":{"opacity":"0"},"100%":{"opacity":"1"}})',
|
|
247
|
+
'fade-out': 'var(--motion-keyframes-fade-out, {"0%":{"opacity":"1"},"100%":{"opacity":"0"}})',
|
|
248
|
+
'slide-up': 'var(--motion-keyframes-slide-up, {"0%":{"transform":"translateY(16px)","opacity":"0"},"100%":{"transform":"translateY(0)","opacity":"1"}})',
|
|
249
|
+
'slide-down': 'var(--motion-keyframes-slide-down, {"0%":{"transform":"translateY(-16px)","opacity":"0"},"100%":{"transform":"translateY(0)","opacity":"1"}})',
|
|
250
|
+
'slide-left': 'var(--motion-keyframes-slide-left, {"0%":{"transform":"translateX(16px)","opacity":"0"},"100%":{"transform":"translateX(0)","opacity":"1"}})',
|
|
251
|
+
'slide-right': 'var(--motion-keyframes-slide-right, {"0%":{"transform":"translateX(-16px)","opacity":"0"},"100%":{"transform":"translateX(0)","opacity":"1"}})',
|
|
252
|
+
'scale-in': 'var(--motion-keyframes-scale-in, {"0%":{"transform":"scale(0.95)","opacity":"0"},"100%":{"transform":"scale(1)","opacity":"1"}})',
|
|
253
|
+
'scale-out': 'var(--motion-keyframes-scale-out, {"0%":{"transform":"scale(1)","opacity":"1"},"100%":{"transform":"scale(1.05)","opacity":"0"}})',
|
|
254
|
+
spin: 'var(--motion-keyframes-spin, {"0%":{"transform":"rotate(0deg)"},"100%":{"transform":"rotate(360deg)"}})',
|
|
255
|
+
pulse: 'var(--motion-keyframes-pulse, {"0%":{"opacity":"1"},"50%":{"opacity":"0.5"},"100%":{"opacity":"1"}})',
|
|
256
|
+
bounce: 'var(--motion-keyframes-bounce, {"0%":{"transform":"translateY(0)"},"50%":{"transform":"translateY(-8px)"},"100%":{"transform":"translateY(0)"}})',
|
|
257
|
+
shake: 'var(--motion-keyframes-shake, {"0%":{"transform":"translateX(0)"},"25%":{"transform":"translateX(-4px)"},"75%":{"transform":"translateX(4px)"},"100%":{"transform":"translateX(0)"}})',
|
|
258
|
+
shimmer: 'var(--motion-keyframes-shimmer, {"0%":{"background-position":"-200% 0"},"100%":{"background-position":"200% 0"}})',
|
|
259
|
+
'skeleton-wave': 'var(--motion-keyframes-skeleton-wave, {"0%":{"background-position":"-468px 0"},"100%":{"background-position":"468px 0"}})',
|
|
260
|
+
'pulse-ring': 'var(--motion-keyframes-pulse-ring, {"0%":{"transform":"scale(0.8)","opacity":"1"},"100%":{"transform":"scale(2.0)","opacity":"0"}})',
|
|
261
|
+
'checkbox-morph': 'var(--motion-keyframes-checkbox-morph, {"0%":{"stroke-dashoffset":"20","opacity":"0"},"100%":{"stroke-dashoffset":"0","opacity":"1"}})',
|
|
262
|
+
'toggle-slide': 'var(--motion-keyframes-toggle-slide, {"0%":{"transform":"translateX(0)"},"100%":{"transform":"translateX(20px)"}})',
|
|
263
|
+
'accordion-height': 'var(--motion-keyframes-accordion-height, {"0%":{"max-height":"0","opacity":"0"},"100%":{"max-height":"1000px","opacity":"1"}})',
|
|
264
|
+
'tab-indicator': 'var(--motion-keyframes-tab-indicator, {"0%":{"transform":"scaleX(0)","opacity":"0"},"100%":{"transform":"scaleX(1)","opacity":"1"}})',
|
|
265
|
+
counter: 'var(--motion-keyframes-counter, {"0%":{"opacity":"0","transform":"translateY(8px)"},"100%":{"opacity":"1","transform":"translateY(0)"}})',
|
|
266
|
+
typing: 'var(--motion-keyframes-typing, {"0%":{"width":"0","border-right-color":"transparent"},"50%":{"border-right-color":"currentColor"},"100%":{"width":"100%","border-right-color":"transparent"}})',
|
|
267
|
+
'fade-in-up': 'var(--motion-keyframes-fade-in-up, {"0%":{"opacity":"0","transform":"translateY(24px)"},"100%":{"opacity":"1","transform":"translateY(0)"}})',
|
|
268
|
+
'slide-in-right': 'var(--motion-keyframes-slide-in-right, {"0%":{"opacity":"0","transform":"translateX(32px)"},"100%":{"opacity":"1","transform":"translateX(0)"}})',
|
|
269
|
+
'bounce-in': 'var(--motion-keyframes-bounce-in, {"0%":{"opacity":"0","transform":"scale(0.3)"},"50%":{"opacity":"1","transform":"scale(1.05)"},"70%":{"transform":"scale(0.9)"},"100%":{"opacity":"1","transform":"scale(1)"}})',
|
|
270
|
+
},
|
|
271
|
+
'scroll-driven': {
|
|
272
|
+
progress: 'var(--motion-scroll-driven-progress, view())',
|
|
273
|
+
'reveal-threshold': 'var(--motion-scroll-driven-reveal-threshold, 0.1)',
|
|
274
|
+
'parallax-factor': 'var(--motion-scroll-driven-parallax-factor, 0.5)',
|
|
275
|
+
},
|
|
276
|
+
style: {
|
|
277
|
+
conservative: 'var(--motion-style-conservative, fade-in)',
|
|
278
|
+
moderate: 'var(--motion-style-moderate, slide-up)',
|
|
279
|
+
expressive: 'var(--motion-style-expressive, scale-in)',
|
|
280
|
+
instant: 'var(--motion-style-instant, none)',
|
|
220
281
|
},
|
|
221
282
|
},
|
|
222
283
|
opacity: {
|
|
@@ -233,6 +294,39 @@ const tokens = {
|
|
|
233
294
|
'2xl': 'var(--breakpoint-2xl, 1536px)',
|
|
234
295
|
},
|
|
235
296
|
component: {
|
|
297
|
+
modal: {
|
|
298
|
+
'overlay-opacity': 'var(--component-modal-overlay-opacity, 0.5)',
|
|
299
|
+
'content-padding': 'var(--component-modal-content-padding, 24px)',
|
|
300
|
+
'header-padding': 'var(--component-modal-header-padding, 20px)',
|
|
301
|
+
'footer-padding': 'var(--component-modal-footer-padding, 20px)',
|
|
302
|
+
'width-sm': 'var(--component-modal-width-sm, 400px)',
|
|
303
|
+
'width-md': 'var(--component-modal-width-md, 560px)',
|
|
304
|
+
'width-lg': 'var(--component-modal-width-lg, 720px)',
|
|
305
|
+
},
|
|
306
|
+
dropdown: {
|
|
307
|
+
'menu-min-width': 'var(--component-dropdown-menu-min-width, 160px)',
|
|
308
|
+
'item-height-sm': 'var(--component-dropdown-item-height-sm, 32px)',
|
|
309
|
+
'item-height-md': 'var(--component-dropdown-item-height-md, 36px)',
|
|
310
|
+
'item-height-lg': 'var(--component-dropdown-item-height-lg, 40px)',
|
|
311
|
+
'separator-margin': 'var(--component-dropdown-separator-margin, 4px)',
|
|
312
|
+
},
|
|
313
|
+
alert: {
|
|
314
|
+
'icon-size': 'var(--component-alert-icon-size, 20px)',
|
|
315
|
+
'padding-sm': 'var(--component-alert-padding-sm, 12px 16px)',
|
|
316
|
+
'padding-md': 'var(--component-alert-padding-md, 16px 20px)',
|
|
317
|
+
'padding-lg': 'var(--component-alert-padding-lg, 20px 24px)',
|
|
318
|
+
},
|
|
319
|
+
input: {
|
|
320
|
+
'label-gap': 'var(--component-input-label-gap, 4px)',
|
|
321
|
+
'helper-gap': 'var(--component-input-helper-gap, 4px)',
|
|
322
|
+
'icon-size': 'var(--component-input-icon-size, 16px)',
|
|
323
|
+
'icon-inset': 'var(--component-input-icon-inset, 12px)',
|
|
324
|
+
},
|
|
325
|
+
'feature-card': {
|
|
326
|
+
'media-height': 'var(--component-feature-card-media-height, 200px)',
|
|
327
|
+
'content-padding': 'var(--component-feature-card-content-padding, 20px)',
|
|
328
|
+
'footer-padding': 'var(--component-feature-card-footer-padding, 16px)',
|
|
329
|
+
},
|
|
236
330
|
tabs: {
|
|
237
331
|
height_md: 'var(--component-tabs-height_md, 44px)',
|
|
238
332
|
height_sm: 'var(--component-tabs-height_sm, 36px)',
|
|
@@ -338,7 +432,61 @@ const tokens = {
|
|
|
338
432
|
default: 'var(--layout-sidebar-default, 240px)',
|
|
339
433
|
wide: 'var(--layout-sidebar-wide, 320px)',
|
|
340
434
|
},
|
|
435
|
+
stack: {
|
|
436
|
+
'gap-xs': 'var(--layout-stack-gap-xs, 4px)',
|
|
437
|
+
'gap-sm': 'var(--layout-stack-gap-sm, 8px)',
|
|
438
|
+
'gap-md': 'var(--layout-stack-gap-md, 16px)',
|
|
439
|
+
'gap-lg': 'var(--layout-stack-gap-lg, 24px)',
|
|
440
|
+
'gap-xl': 'var(--layout-stack-gap-xl, 32px)',
|
|
441
|
+
},
|
|
442
|
+
grid: {
|
|
443
|
+
'columns-1': 'var(--layout-grid-columns-1, 1)',
|
|
444
|
+
'columns-2': 'var(--layout-grid-columns-2, 2)',
|
|
445
|
+
'columns-3': 'var(--layout-grid-columns-3, 3)',
|
|
446
|
+
'columns-4': 'var(--layout-grid-columns-4, 4)',
|
|
447
|
+
'columns-6': 'var(--layout-grid-columns-6, 6)',
|
|
448
|
+
'columns-12': 'var(--layout-grid-columns-12, 12)',
|
|
449
|
+
},
|
|
450
|
+
'container-query': {
|
|
451
|
+
sm: 'var(--layout-container-query-sm, 320px)',
|
|
452
|
+
md: 'var(--layout-container-query-md, 480px)',
|
|
453
|
+
lg: 'var(--layout-container-query-lg, 640px)',
|
|
454
|
+
xl: 'var(--layout-container-query-xl, 960px)',
|
|
455
|
+
},
|
|
456
|
+
'container-max-width': {
|
|
457
|
+
sm: 'var(--layout-container-max-width-sm, 640px)',
|
|
458
|
+
md: 'var(--layout-container-max-width-md, 768px)',
|
|
459
|
+
lg: 'var(--layout-container-max-width-lg, 1024px)',
|
|
460
|
+
xl: 'var(--layout-container-max-width-xl, 1280px)',
|
|
461
|
+
},
|
|
462
|
+
},
|
|
463
|
+
transition: {
|
|
464
|
+
'view-transition-name': {
|
|
465
|
+
header: 'var(--transition-view-transition-name-header, uds-header)',
|
|
466
|
+
hero: 'var(--transition-view-transition-name-hero, uds-hero)',
|
|
467
|
+
card: 'var(--transition-view-transition-name-card, uds-card)',
|
|
468
|
+
sidebar: 'var(--transition-view-transition-name-sidebar, uds-sidebar)',
|
|
469
|
+
modal: 'var(--transition-view-transition-name-modal, uds-modal)',
|
|
470
|
+
},
|
|
471
|
+
'starting-style': {
|
|
472
|
+
modal: 'var(--transition-starting-style-modal, {"opacity":"0","transform":"scale(0.95)"})',
|
|
473
|
+
dropdown: 'var(--transition-starting-style-dropdown, {"opacity":"0","transform":"translateY(-8px)"})',
|
|
474
|
+
toast: 'var(--transition-starting-style-toast, {"opacity":"0","transform":"translateX(100%)"})',
|
|
475
|
+
popover: 'var(--transition-starting-style-popover, {"opacity":"0","transform":"scale(0.9) translateY(-4px)"})',
|
|
476
|
+
},
|
|
477
|
+
behavior: {
|
|
478
|
+
'allow-discrete': 'var(--transition-behavior-allow-discrete, allow-discrete)',
|
|
479
|
+
},
|
|
480
|
+
style: {
|
|
481
|
+
elegant: 'var(--transition-style-elegant, cubic-bezier(0.4, 0, 0.2, 1))',
|
|
482
|
+
snappy: 'var(--transition-style-snappy, cubic-bezier(0.2, 0, 0, 1))',
|
|
483
|
+
gentle: 'var(--transition-style-gentle, cubic-bezier(0.4, 0, 0.6, 1))',
|
|
484
|
+
instant: 'var(--transition-style-instant, steps(1))',
|
|
485
|
+
},
|
|
341
486
|
},
|
|
342
487
|
};
|
|
343
488
|
|
|
344
|
-
|
|
489
|
+
const PALETTES = ['minimal-saas', 'ai-futuristic', 'gradient-startup', 'corporate', 'apple-minimal', 'illustration', 'dashboard', 'bold-lifestyle', 'minimal-corporate'];
|
|
490
|
+
function isPalette(name) { return PALETTES.indexOf(name) !== -1; }
|
|
491
|
+
|
|
492
|
+
module.exports = { tokens, isPalette, PALETTES };
|
package/dist/index.mjs
CHANGED
|
@@ -53,6 +53,7 @@ export const tokens = {
|
|
|
53
53
|
'500': 'var(--color-primitive-amber-500, #F59E0B)',
|
|
54
54
|
'600': 'var(--color-primitive-amber-600, #D97706)',
|
|
55
55
|
'700': 'var(--color-primitive-amber-700, #B45309)',
|
|
56
|
+
'800': 'var(--color-primitive-amber-800, #92400e)',
|
|
56
57
|
},
|
|
57
58
|
cyan: {
|
|
58
59
|
'400': 'var(--color-primitive-cyan-400, #22D3EE)',
|
|
@@ -114,18 +115,32 @@ export const tokens = {
|
|
|
114
115
|
},
|
|
115
116
|
success: 'var(--color-semantic-success, #059669)',
|
|
116
117
|
'success-bg': 'var(--color-semantic-success-bg, #ECFDF5)',
|
|
118
|
+
'success-on-bg': 'var(--color-semantic-success-on-bg, #047857)',
|
|
117
119
|
warning: 'var(--color-semantic-warning, #D97706)',
|
|
118
120
|
'warning-bg': 'var(--color-semantic-warning-bg, #FFFBEB)',
|
|
121
|
+
'warning-on-bg': 'var(--color-semantic-warning-on-bg, #92400e)',
|
|
122
|
+
'text-on-error': 'var(--color-semantic-text-on-error, #171717)',
|
|
119
123
|
error: 'var(--color-semantic-error, #DC2626)',
|
|
120
124
|
'error-bg': 'var(--color-semantic-error-bg, #FEF2F2)',
|
|
121
125
|
info: 'var(--color-semantic-info, #2563EB)',
|
|
122
126
|
'info-bg': 'var(--color-semantic-info-bg, #EFF6FF)',
|
|
123
|
-
'surface-default': 'var(--color-semantic-surface-default,
|
|
127
|
+
'surface-default': 'var(--color-semantic-surface-default, #FFFFFF)',
|
|
124
128
|
'surface-hover': 'var(--color-semantic-surface-hover, #F5F5FA)',
|
|
125
129
|
'surface-active': 'var(--color-semantic-surface-active, #EDEDF5)',
|
|
126
130
|
'text-disabled': 'var(--color-semantic-text-disabled, #A0A0B0)',
|
|
127
131
|
'border-strong': 'var(--color-semantic-border-strong, #6E6E7E)',
|
|
128
132
|
overlay: 'var(--color-semantic-overlay, rgba(0, 0, 0, 0.5))',
|
|
133
|
+
'action-primary': 'var(--color-semantic-action-primary, #2563EB)',
|
|
134
|
+
'action-secondary': 'var(--color-semantic-action-secondary, #3B82F6)',
|
|
135
|
+
'action-destructive': 'var(--color-semantic-action-destructive, #DC2626)',
|
|
136
|
+
'feedback-success': 'var(--color-semantic-feedback-success, #059669)',
|
|
137
|
+
'feedback-warning': 'var(--color-semantic-feedback-warning, #D97706)',
|
|
138
|
+
'feedback-error': 'var(--color-semantic-feedback-error, #DC2626)',
|
|
139
|
+
'feedback-info': 'var(--color-semantic-feedback-info, #2563EB)',
|
|
140
|
+
'surface-elevated': 'var(--color-semantic-surface-elevated, #F8F8FA)',
|
|
141
|
+
'surface-overlay': 'var(--color-semantic-surface-overlay, #F0F0F5)',
|
|
142
|
+
'text-link': 'var(--color-semantic-text-link, #2563EB)',
|
|
143
|
+
'border-focus': 'var(--color-semantic-border-focus, #2563EB)',
|
|
129
144
|
},
|
|
130
145
|
chart: {
|
|
131
146
|
'1': 'var(--color-chart-1, #4F46E5)',
|
|
@@ -137,6 +152,12 @@ export const tokens = {
|
|
|
137
152
|
'7': 'var(--color-chart-7, #EC4899)',
|
|
138
153
|
'8': 'var(--color-chart-8, #06B6D4)',
|
|
139
154
|
},
|
|
155
|
+
utility: {
|
|
156
|
+
'hover-tint': 'var(--color-utility-hover-tint, color-mix(in oklch, var(--color-brand-primary) 85%, white))',
|
|
157
|
+
'hover-shade': 'var(--color-utility-hover-shade, color-mix(in oklch, var(--color-brand-primary) 85%, black))',
|
|
158
|
+
'disabled-overlay': 'var(--color-utility-disabled-overlay, color-mix(in oklch, var(--color-bg-primary) 50%, transparent))',
|
|
159
|
+
'focus-ring': 'var(--color-utility-focus-ring, color-mix(in oklch, var(--color-brand-accent) 40%, transparent))',
|
|
160
|
+
},
|
|
140
161
|
},
|
|
141
162
|
typography: {
|
|
142
163
|
fontFamily: {
|
|
@@ -216,6 +237,46 @@ export const tokens = {
|
|
|
216
237
|
in: 'var(--motion-easing-in, cubic-bezier(0.4, 0, 1, 1))',
|
|
217
238
|
out: 'var(--motion-easing-out, cubic-bezier(0, 0, 0.2, 1))',
|
|
218
239
|
spring: 'var(--motion-easing-spring, cubic-bezier(0.34, 1.56, 0.64, 1))',
|
|
240
|
+
'spring-gentle': 'var(--motion-easing-spring-gentle, cubic-bezier(0.34, 1.56, 0.64, 1))',
|
|
241
|
+
'spring-bouncy': 'var(--motion-easing-spring-bouncy, cubic-bezier(0.68, -0.55, 0.265, 1.55))',
|
|
242
|
+
'spring-stiff': 'var(--motion-easing-spring-stiff, cubic-bezier(0.4, 0, 0.2, 1))',
|
|
243
|
+
},
|
|
244
|
+
keyframes: {
|
|
245
|
+
'fade-in': 'var(--motion-keyframes-fade-in, {"0%":{"opacity":"0"},"100%":{"opacity":"1"}})',
|
|
246
|
+
'fade-out': 'var(--motion-keyframes-fade-out, {"0%":{"opacity":"1"},"100%":{"opacity":"0"}})',
|
|
247
|
+
'slide-up': 'var(--motion-keyframes-slide-up, {"0%":{"transform":"translateY(16px)","opacity":"0"},"100%":{"transform":"translateY(0)","opacity":"1"}})',
|
|
248
|
+
'slide-down': 'var(--motion-keyframes-slide-down, {"0%":{"transform":"translateY(-16px)","opacity":"0"},"100%":{"transform":"translateY(0)","opacity":"1"}})',
|
|
249
|
+
'slide-left': 'var(--motion-keyframes-slide-left, {"0%":{"transform":"translateX(16px)","opacity":"0"},"100%":{"transform":"translateX(0)","opacity":"1"}})',
|
|
250
|
+
'slide-right': 'var(--motion-keyframes-slide-right, {"0%":{"transform":"translateX(-16px)","opacity":"0"},"100%":{"transform":"translateX(0)","opacity":"1"}})',
|
|
251
|
+
'scale-in': 'var(--motion-keyframes-scale-in, {"0%":{"transform":"scale(0.95)","opacity":"0"},"100%":{"transform":"scale(1)","opacity":"1"}})',
|
|
252
|
+
'scale-out': 'var(--motion-keyframes-scale-out, {"0%":{"transform":"scale(1)","opacity":"1"},"100%":{"transform":"scale(1.05)","opacity":"0"}})',
|
|
253
|
+
spin: 'var(--motion-keyframes-spin, {"0%":{"transform":"rotate(0deg)"},"100%":{"transform":"rotate(360deg)"}})',
|
|
254
|
+
pulse: 'var(--motion-keyframes-pulse, {"0%":{"opacity":"1"},"50%":{"opacity":"0.5"},"100%":{"opacity":"1"}})',
|
|
255
|
+
bounce: 'var(--motion-keyframes-bounce, {"0%":{"transform":"translateY(0)"},"50%":{"transform":"translateY(-8px)"},"100%":{"transform":"translateY(0)"}})',
|
|
256
|
+
shake: 'var(--motion-keyframes-shake, {"0%":{"transform":"translateX(0)"},"25%":{"transform":"translateX(-4px)"},"75%":{"transform":"translateX(4px)"},"100%":{"transform":"translateX(0)"}})',
|
|
257
|
+
shimmer: 'var(--motion-keyframes-shimmer, {"0%":{"background-position":"-200% 0"},"100%":{"background-position":"200% 0"}})',
|
|
258
|
+
'skeleton-wave': 'var(--motion-keyframes-skeleton-wave, {"0%":{"background-position":"-468px 0"},"100%":{"background-position":"468px 0"}})',
|
|
259
|
+
'pulse-ring': 'var(--motion-keyframes-pulse-ring, {"0%":{"transform":"scale(0.8)","opacity":"1"},"100%":{"transform":"scale(2.0)","opacity":"0"}})',
|
|
260
|
+
'checkbox-morph': 'var(--motion-keyframes-checkbox-morph, {"0%":{"stroke-dashoffset":"20","opacity":"0"},"100%":{"stroke-dashoffset":"0","opacity":"1"}})',
|
|
261
|
+
'toggle-slide': 'var(--motion-keyframes-toggle-slide, {"0%":{"transform":"translateX(0)"},"100%":{"transform":"translateX(20px)"}})',
|
|
262
|
+
'accordion-height': 'var(--motion-keyframes-accordion-height, {"0%":{"max-height":"0","opacity":"0"},"100%":{"max-height":"1000px","opacity":"1"}})',
|
|
263
|
+
'tab-indicator': 'var(--motion-keyframes-tab-indicator, {"0%":{"transform":"scaleX(0)","opacity":"0"},"100%":{"transform":"scaleX(1)","opacity":"1"}})',
|
|
264
|
+
counter: 'var(--motion-keyframes-counter, {"0%":{"opacity":"0","transform":"translateY(8px)"},"100%":{"opacity":"1","transform":"translateY(0)"}})',
|
|
265
|
+
typing: 'var(--motion-keyframes-typing, {"0%":{"width":"0","border-right-color":"transparent"},"50%":{"border-right-color":"currentColor"},"100%":{"width":"100%","border-right-color":"transparent"}})',
|
|
266
|
+
'fade-in-up': 'var(--motion-keyframes-fade-in-up, {"0%":{"opacity":"0","transform":"translateY(24px)"},"100%":{"opacity":"1","transform":"translateY(0)"}})',
|
|
267
|
+
'slide-in-right': 'var(--motion-keyframes-slide-in-right, {"0%":{"opacity":"0","transform":"translateX(32px)"},"100%":{"opacity":"1","transform":"translateX(0)"}})',
|
|
268
|
+
'bounce-in': 'var(--motion-keyframes-bounce-in, {"0%":{"opacity":"0","transform":"scale(0.3)"},"50%":{"opacity":"1","transform":"scale(1.05)"},"70%":{"transform":"scale(0.9)"},"100%":{"opacity":"1","transform":"scale(1)"}})',
|
|
269
|
+
},
|
|
270
|
+
'scroll-driven': {
|
|
271
|
+
progress: 'var(--motion-scroll-driven-progress, view())',
|
|
272
|
+
'reveal-threshold': 'var(--motion-scroll-driven-reveal-threshold, 0.1)',
|
|
273
|
+
'parallax-factor': 'var(--motion-scroll-driven-parallax-factor, 0.5)',
|
|
274
|
+
},
|
|
275
|
+
style: {
|
|
276
|
+
conservative: 'var(--motion-style-conservative, fade-in)',
|
|
277
|
+
moderate: 'var(--motion-style-moderate, slide-up)',
|
|
278
|
+
expressive: 'var(--motion-style-expressive, scale-in)',
|
|
279
|
+
instant: 'var(--motion-style-instant, none)',
|
|
219
280
|
},
|
|
220
281
|
},
|
|
221
282
|
opacity: {
|
|
@@ -232,6 +293,39 @@ export const tokens = {
|
|
|
232
293
|
'2xl': 'var(--breakpoint-2xl, 1536px)',
|
|
233
294
|
},
|
|
234
295
|
component: {
|
|
296
|
+
modal: {
|
|
297
|
+
'overlay-opacity': 'var(--component-modal-overlay-opacity, 0.5)',
|
|
298
|
+
'content-padding': 'var(--component-modal-content-padding, 24px)',
|
|
299
|
+
'header-padding': 'var(--component-modal-header-padding, 20px)',
|
|
300
|
+
'footer-padding': 'var(--component-modal-footer-padding, 20px)',
|
|
301
|
+
'width-sm': 'var(--component-modal-width-sm, 400px)',
|
|
302
|
+
'width-md': 'var(--component-modal-width-md, 560px)',
|
|
303
|
+
'width-lg': 'var(--component-modal-width-lg, 720px)',
|
|
304
|
+
},
|
|
305
|
+
dropdown: {
|
|
306
|
+
'menu-min-width': 'var(--component-dropdown-menu-min-width, 160px)',
|
|
307
|
+
'item-height-sm': 'var(--component-dropdown-item-height-sm, 32px)',
|
|
308
|
+
'item-height-md': 'var(--component-dropdown-item-height-md, 36px)',
|
|
309
|
+
'item-height-lg': 'var(--component-dropdown-item-height-lg, 40px)',
|
|
310
|
+
'separator-margin': 'var(--component-dropdown-separator-margin, 4px)',
|
|
311
|
+
},
|
|
312
|
+
alert: {
|
|
313
|
+
'icon-size': 'var(--component-alert-icon-size, 20px)',
|
|
314
|
+
'padding-sm': 'var(--component-alert-padding-sm, 12px 16px)',
|
|
315
|
+
'padding-md': 'var(--component-alert-padding-md, 16px 20px)',
|
|
316
|
+
'padding-lg': 'var(--component-alert-padding-lg, 20px 24px)',
|
|
317
|
+
},
|
|
318
|
+
input: {
|
|
319
|
+
'label-gap': 'var(--component-input-label-gap, 4px)',
|
|
320
|
+
'helper-gap': 'var(--component-input-helper-gap, 4px)',
|
|
321
|
+
'icon-size': 'var(--component-input-icon-size, 16px)',
|
|
322
|
+
'icon-inset': 'var(--component-input-icon-inset, 12px)',
|
|
323
|
+
},
|
|
324
|
+
'feature-card': {
|
|
325
|
+
'media-height': 'var(--component-feature-card-media-height, 200px)',
|
|
326
|
+
'content-padding': 'var(--component-feature-card-content-padding, 20px)',
|
|
327
|
+
'footer-padding': 'var(--component-feature-card-footer-padding, 16px)',
|
|
328
|
+
},
|
|
235
329
|
tabs: {
|
|
236
330
|
height_md: 'var(--component-tabs-height_md, 44px)',
|
|
237
331
|
height_sm: 'var(--component-tabs-height_sm, 36px)',
|
|
@@ -337,5 +431,59 @@ export const tokens = {
|
|
|
337
431
|
default: 'var(--layout-sidebar-default, 240px)',
|
|
338
432
|
wide: 'var(--layout-sidebar-wide, 320px)',
|
|
339
433
|
},
|
|
434
|
+
stack: {
|
|
435
|
+
'gap-xs': 'var(--layout-stack-gap-xs, 4px)',
|
|
436
|
+
'gap-sm': 'var(--layout-stack-gap-sm, 8px)',
|
|
437
|
+
'gap-md': 'var(--layout-stack-gap-md, 16px)',
|
|
438
|
+
'gap-lg': 'var(--layout-stack-gap-lg, 24px)',
|
|
439
|
+
'gap-xl': 'var(--layout-stack-gap-xl, 32px)',
|
|
440
|
+
},
|
|
441
|
+
grid: {
|
|
442
|
+
'columns-1': 'var(--layout-grid-columns-1, 1)',
|
|
443
|
+
'columns-2': 'var(--layout-grid-columns-2, 2)',
|
|
444
|
+
'columns-3': 'var(--layout-grid-columns-3, 3)',
|
|
445
|
+
'columns-4': 'var(--layout-grid-columns-4, 4)',
|
|
446
|
+
'columns-6': 'var(--layout-grid-columns-6, 6)',
|
|
447
|
+
'columns-12': 'var(--layout-grid-columns-12, 12)',
|
|
448
|
+
},
|
|
449
|
+
'container-query': {
|
|
450
|
+
sm: 'var(--layout-container-query-sm, 320px)',
|
|
451
|
+
md: 'var(--layout-container-query-md, 480px)',
|
|
452
|
+
lg: 'var(--layout-container-query-lg, 640px)',
|
|
453
|
+
xl: 'var(--layout-container-query-xl, 960px)',
|
|
454
|
+
},
|
|
455
|
+
'container-max-width': {
|
|
456
|
+
sm: 'var(--layout-container-max-width-sm, 640px)',
|
|
457
|
+
md: 'var(--layout-container-max-width-md, 768px)',
|
|
458
|
+
lg: 'var(--layout-container-max-width-lg, 1024px)',
|
|
459
|
+
xl: 'var(--layout-container-max-width-xl, 1280px)',
|
|
460
|
+
},
|
|
461
|
+
},
|
|
462
|
+
transition: {
|
|
463
|
+
'view-transition-name': {
|
|
464
|
+
header: 'var(--transition-view-transition-name-header, uds-header)',
|
|
465
|
+
hero: 'var(--transition-view-transition-name-hero, uds-hero)',
|
|
466
|
+
card: 'var(--transition-view-transition-name-card, uds-card)',
|
|
467
|
+
sidebar: 'var(--transition-view-transition-name-sidebar, uds-sidebar)',
|
|
468
|
+
modal: 'var(--transition-view-transition-name-modal, uds-modal)',
|
|
469
|
+
},
|
|
470
|
+
'starting-style': {
|
|
471
|
+
modal: 'var(--transition-starting-style-modal, {"opacity":"0","transform":"scale(0.95)"})',
|
|
472
|
+
dropdown: 'var(--transition-starting-style-dropdown, {"opacity":"0","transform":"translateY(-8px)"})',
|
|
473
|
+
toast: 'var(--transition-starting-style-toast, {"opacity":"0","transform":"translateX(100%)"})',
|
|
474
|
+
popover: 'var(--transition-starting-style-popover, {"opacity":"0","transform":"scale(0.9) translateY(-4px)"})',
|
|
475
|
+
},
|
|
476
|
+
behavior: {
|
|
477
|
+
'allow-discrete': 'var(--transition-behavior-allow-discrete, allow-discrete)',
|
|
478
|
+
},
|
|
479
|
+
style: {
|
|
480
|
+
elegant: 'var(--transition-style-elegant, cubic-bezier(0.4, 0, 0.2, 1))',
|
|
481
|
+
snappy: 'var(--transition-style-snappy, cubic-bezier(0.2, 0, 0, 1))',
|
|
482
|
+
gentle: 'var(--transition-style-gentle, cubic-bezier(0.4, 0, 0.6, 1))',
|
|
483
|
+
instant: 'var(--transition-style-instant, steps(1))',
|
|
484
|
+
},
|
|
340
485
|
},
|
|
341
486
|
};
|
|
487
|
+
|
|
488
|
+
export const PALETTES = ['minimal-saas', 'ai-futuristic', 'gradient-startup', 'corporate', 'apple-minimal', 'illustration', 'dashboard', 'bold-lifestyle', 'minimal-corporate'];
|
|
489
|
+
export function isPalette(name) { return PALETTES.indexOf(name) !== -1; }
|