@tenerife.music/ui 1.2.1 → 2.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +39 -2
- package/dist/Link-ZWr5iFB0.d.cts +60 -0
- package/dist/Link-ZWr5iFB0.d.ts +60 -0
- package/dist/extensions/next/index.cjs +406 -0
- package/dist/extensions/next/index.d.cts +37 -0
- package/dist/extensions/next/index.d.ts +37 -0
- package/dist/extensions/next/index.mjs +381 -0
- package/dist/{index-DXmHg8ji.d.cts → index-DGtRM9Db.d.cts} +193 -901
- package/dist/{index-DXmHg8ji.d.ts → index-DGtRM9Db.d.ts} +193 -901
- package/dist/index.cjs +8170 -4531
- package/dist/index.d.cts +2219 -673
- package/dist/index.d.ts +2219 -673
- package/dist/index.mjs +7860 -4246
- package/dist/preset.cjs +129 -321
- package/dist/preset.mjs +129 -321
- package/dist/styles.css +939 -93
- package/dist/theme/index.cjs +20 -230
- package/dist/theme/index.mjs +20 -230
- package/dist/tokens/index.cjs +501 -593
- package/dist/tokens/index.d.cts +165 -2
- package/dist/tokens/index.d.ts +165 -2
- package/dist/tokens/index.mjs +489 -577
- package/package.json +22 -7
|
@@ -39,7 +39,7 @@ type Responsive<T> = T | {
|
|
|
39
39
|
* Component-level design tokens for Alert component.
|
|
40
40
|
* Maps foundation tokens (spacing, radius) to alert-specific usage.
|
|
41
41
|
*
|
|
42
|
-
*
|
|
42
|
+
* All values reference foundation tokens to ensure consistency across the design system.
|
|
43
43
|
*/
|
|
44
44
|
/**
|
|
45
45
|
* Alert Component Tokens
|
|
@@ -56,57 +56,47 @@ declare const ALERT_TOKENS: {
|
|
|
56
56
|
* Border radius for alerts
|
|
57
57
|
*/
|
|
58
58
|
readonly radius: "rounded-lg";
|
|
59
|
+
/**
|
|
60
|
+
* Border token
|
|
61
|
+
* Base border style
|
|
62
|
+
*/
|
|
63
|
+
readonly border: "border";
|
|
59
64
|
/**
|
|
60
65
|
* Icon size within alerts
|
|
61
66
|
*/
|
|
62
67
|
readonly iconSize: "size-4";
|
|
63
68
|
/**
|
|
64
69
|
* Variant-based token structure
|
|
65
|
-
* Organized by variant for
|
|
70
|
+
* Organized by variant for token-driven styling
|
|
66
71
|
*/
|
|
67
72
|
readonly variant: {
|
|
68
73
|
readonly default: {
|
|
69
|
-
readonly
|
|
70
|
-
readonly
|
|
74
|
+
readonly background: "bg-muted";
|
|
75
|
+
readonly border: "border-border";
|
|
76
|
+
readonly text: "text-foreground";
|
|
71
77
|
};
|
|
72
78
|
readonly primary: {
|
|
73
|
-
readonly
|
|
74
|
-
readonly
|
|
79
|
+
readonly background: "bg-primary/10";
|
|
80
|
+
readonly border: "border-primary/20";
|
|
81
|
+
readonly text: "text-primary-foreground";
|
|
75
82
|
};
|
|
76
83
|
readonly secondary: {
|
|
77
|
-
readonly
|
|
78
|
-
readonly
|
|
84
|
+
readonly background: "bg-secondary/10";
|
|
85
|
+
readonly border: "border-secondary/20";
|
|
86
|
+
readonly text: "text-secondary-foreground";
|
|
79
87
|
};
|
|
80
88
|
readonly accent: {
|
|
81
|
-
readonly
|
|
82
|
-
readonly
|
|
89
|
+
readonly background: "bg-accent/10";
|
|
90
|
+
readonly border: "border-accent/20";
|
|
91
|
+
readonly text: "text-accent-foreground";
|
|
83
92
|
};
|
|
84
93
|
readonly destructive: {
|
|
85
|
-
readonly
|
|
86
|
-
readonly
|
|
87
|
-
|
|
88
|
-
readonly success: {
|
|
89
|
-
readonly padding: "p-md";
|
|
90
|
-
readonly radius: "rounded-lg";
|
|
91
|
-
};
|
|
92
|
-
readonly warning: {
|
|
93
|
-
readonly padding: "p-md";
|
|
94
|
-
readonly radius: "rounded-lg";
|
|
95
|
-
};
|
|
96
|
-
readonly danger: {
|
|
97
|
-
readonly padding: "p-md";
|
|
98
|
-
readonly radius: "rounded-lg";
|
|
99
|
-
};
|
|
100
|
-
readonly info: {
|
|
101
|
-
readonly padding: "p-md";
|
|
102
|
-
readonly radius: "rounded-lg";
|
|
94
|
+
readonly background: "bg-destructive/10";
|
|
95
|
+
readonly border: "border-destructive/20";
|
|
96
|
+
readonly text: "text-destructive-foreground";
|
|
103
97
|
};
|
|
104
98
|
};
|
|
105
99
|
};
|
|
106
|
-
/**
|
|
107
|
-
* Type exports for Alert tokens
|
|
108
|
-
*/
|
|
109
|
-
type AlertVariant = keyof typeof ALERT_TOKENS.variant;
|
|
110
100
|
|
|
111
101
|
/**
|
|
112
102
|
* Button Component Tokens
|
|
@@ -145,7 +135,6 @@ declare const BUTTON_TOKENS: {
|
|
|
145
135
|
readonly sm: "h-8";
|
|
146
136
|
readonly md: "h-9";
|
|
147
137
|
readonly lg: "h-10";
|
|
148
|
-
readonly icon: "h-9";
|
|
149
138
|
};
|
|
150
139
|
/**
|
|
151
140
|
* Button padding by size
|
|
@@ -190,14 +179,22 @@ declare const BUTTON_TOKENS: {
|
|
|
190
179
|
readonly sm: "[&_svg]:w-3.5 [&_svg]:h-3.5";
|
|
191
180
|
readonly md: "[&_svg]:w-4 [&_svg]:h-4";
|
|
192
181
|
readonly lg: "[&_svg]:w-5 [&_svg]:h-5";
|
|
193
|
-
readonly icon: "[&_svg]:w-4 [&_svg]:h-4";
|
|
194
182
|
};
|
|
195
183
|
/**
|
|
196
184
|
* Width tokens
|
|
185
|
+
* Used for icon-only buttons (square buttons with equal width and height)
|
|
197
186
|
*/
|
|
198
187
|
readonly width: {
|
|
199
|
-
readonly
|
|
188
|
+
readonly sm: "w-8";
|
|
189
|
+
readonly md: "w-9";
|
|
190
|
+
readonly lg: "w-10";
|
|
200
191
|
};
|
|
192
|
+
/**
|
|
193
|
+
* Padding token for icon-only buttons
|
|
194
|
+
* Zero padding required for square dimensions (icon-only buttons have no text, so no padding needed)
|
|
195
|
+
* Uses p-0 which is a standard Tailwind class for zero spacing (spacing[0])
|
|
196
|
+
*/
|
|
197
|
+
readonly paddingIconOnly: "p-0";
|
|
201
198
|
/**
|
|
202
199
|
* Font sizes by button size
|
|
203
200
|
* References foundation typography fontSize tokens from Typography Authority
|
|
@@ -516,14 +513,12 @@ type CardSize = keyof typeof CARD_TOKENS.size;
|
|
|
516
513
|
declare const INPUT_TOKENS: {
|
|
517
514
|
/**
|
|
518
515
|
* Input heights by size
|
|
519
|
-
* Supports
|
|
516
|
+
* Supports sm, md, lg sizes (canonical interactive size scale)
|
|
520
517
|
*/
|
|
521
518
|
readonly height: {
|
|
522
|
-
readonly xs: "h-7";
|
|
523
519
|
readonly sm: "h-8";
|
|
524
520
|
readonly md: "h-9";
|
|
525
521
|
readonly lg: "h-10";
|
|
526
|
-
readonly xl: "h-11";
|
|
527
522
|
};
|
|
528
523
|
/**
|
|
529
524
|
* Input padding by size
|
|
@@ -531,40 +526,32 @@ declare const INPUT_TOKENS: {
|
|
|
531
526
|
*/
|
|
532
527
|
readonly padding: {
|
|
533
528
|
readonly horizontal: {
|
|
534
|
-
readonly xs: "px-xs";
|
|
535
529
|
readonly sm: "px-sm";
|
|
536
530
|
readonly md: "px-sm";
|
|
537
531
|
readonly lg: "px-md";
|
|
538
|
-
readonly xl: "px-lg";
|
|
539
532
|
};
|
|
540
533
|
readonly vertical: {
|
|
541
|
-
readonly xs: "py-xs";
|
|
542
534
|
readonly sm: "py-xs";
|
|
543
535
|
readonly md: "py-xs";
|
|
544
536
|
readonly lg: "py-sm";
|
|
545
|
-
readonly xl: "py-md";
|
|
546
537
|
};
|
|
547
538
|
};
|
|
548
539
|
/**
|
|
549
540
|
* Border radius by size
|
|
550
541
|
*/
|
|
551
542
|
readonly radius: {
|
|
552
|
-
readonly xs: "rounded-sm";
|
|
553
543
|
readonly sm: "rounded-md";
|
|
554
544
|
readonly md: "rounded-md";
|
|
555
545
|
readonly lg: "rounded-md";
|
|
556
|
-
readonly xl: "rounded-lg";
|
|
557
546
|
};
|
|
558
547
|
/**
|
|
559
548
|
* Font sizes by size variant
|
|
560
549
|
* Maps to foundation typography fontSize tokens
|
|
561
550
|
*/
|
|
562
551
|
readonly fontSize: {
|
|
563
|
-
readonly xs: "text-xs";
|
|
564
552
|
readonly sm: "text-sm";
|
|
565
553
|
readonly md: "text-base";
|
|
566
554
|
readonly lg: "text-base";
|
|
567
|
-
readonly xl: "text-lg";
|
|
568
555
|
};
|
|
569
556
|
/**
|
|
570
557
|
* Responsive font size (md breakpoint)
|
|
@@ -696,16 +683,6 @@ declare const INPUT_TOKENS: {
|
|
|
696
683
|
* Organized by size for easy access
|
|
697
684
|
*/
|
|
698
685
|
readonly size: {
|
|
699
|
-
readonly xs: {
|
|
700
|
-
readonly height: "h-7";
|
|
701
|
-
readonly padding: {
|
|
702
|
-
readonly horizontal: "px-xs";
|
|
703
|
-
readonly vertical: "py-xs";
|
|
704
|
-
};
|
|
705
|
-
readonly radius: "rounded-sm";
|
|
706
|
-
readonly fontSize: "text-xs";
|
|
707
|
-
readonly shadow: "shadow-sm";
|
|
708
|
-
};
|
|
709
686
|
readonly sm: {
|
|
710
687
|
readonly height: "h-8";
|
|
711
688
|
readonly padding: {
|
|
@@ -737,16 +714,6 @@ declare const INPUT_TOKENS: {
|
|
|
737
714
|
readonly fontSize: "text-base";
|
|
738
715
|
readonly shadow: "shadow-sm";
|
|
739
716
|
};
|
|
740
|
-
readonly xl: {
|
|
741
|
-
readonly height: "h-11";
|
|
742
|
-
readonly padding: {
|
|
743
|
-
readonly horizontal: "px-lg";
|
|
744
|
-
readonly vertical: "py-md";
|
|
745
|
-
};
|
|
746
|
-
readonly radius: "rounded-lg";
|
|
747
|
-
readonly fontSize: "text-lg";
|
|
748
|
-
readonly shadow: "shadow-sm";
|
|
749
|
-
};
|
|
750
717
|
};
|
|
751
718
|
};
|
|
752
719
|
/**
|
|
@@ -776,16 +743,13 @@ type InputSize = keyof typeof INPUT_TOKENS.size;
|
|
|
776
743
|
declare const CHECKBOX_TOKENS: {
|
|
777
744
|
/**
|
|
778
745
|
* Checkbox sizes by size variant
|
|
779
|
-
* Supports
|
|
746
|
+
* Supports sm, md, lg sizes (canonical interactive scale)
|
|
780
747
|
* Checkboxes are typically square and smaller than input fields
|
|
748
|
+
*
|
|
749
|
+
* NOTE: Size scale restricted to sm|md|lg per canonical interactive size scale (FOUNDATION_LOCK.md).
|
|
750
|
+
* xs and xl sizes removed to comply with Button-defined canonical scale.
|
|
781
751
|
*/
|
|
782
752
|
readonly size: {
|
|
783
|
-
readonly xs: {
|
|
784
|
-
readonly width: "w-3.5";
|
|
785
|
-
readonly height: "h-3.5";
|
|
786
|
-
readonly radius: "rounded-sm";
|
|
787
|
-
readonly iconSize: "size-2.5";
|
|
788
|
-
};
|
|
789
753
|
readonly sm: {
|
|
790
754
|
readonly width: "w-4";
|
|
791
755
|
readonly height: "h-4";
|
|
@@ -804,12 +768,6 @@ declare const CHECKBOX_TOKENS: {
|
|
|
804
768
|
readonly radius: "rounded-md";
|
|
805
769
|
readonly iconSize: "size-4";
|
|
806
770
|
};
|
|
807
|
-
readonly xl: {
|
|
808
|
-
readonly width: "w-6";
|
|
809
|
-
readonly height: "h-6";
|
|
810
|
-
readonly radius: "rounded-md";
|
|
811
|
-
readonly iconSize: "size-5";
|
|
812
|
-
};
|
|
813
771
|
};
|
|
814
772
|
/**
|
|
815
773
|
* Variant-based tokens
|
|
@@ -879,14 +837,13 @@ declare const CHECKBOX_TOKENS: {
|
|
|
879
837
|
/**
|
|
880
838
|
* Icon tokens
|
|
881
839
|
* Size and styling for checkmark icon within checkbox
|
|
840
|
+
* NOTE: Icon sizes restricted to sm|md|lg per canonical interactive size scale
|
|
882
841
|
*/
|
|
883
842
|
readonly icon: {
|
|
884
843
|
readonly size: {
|
|
885
|
-
readonly xs: "size-2.5";
|
|
886
844
|
readonly sm: "size-3";
|
|
887
845
|
readonly md: "size-3.5";
|
|
888
846
|
readonly lg: "size-4";
|
|
889
|
-
readonly xl: "size-5";
|
|
890
847
|
};
|
|
891
848
|
readonly stroke: "stroke-2";
|
|
892
849
|
readonly color: {
|
|
@@ -911,8 +868,9 @@ declare const CHECKBOX_TOKENS: {
|
|
|
911
868
|
/**
|
|
912
869
|
* Transition tokens
|
|
913
870
|
* Smooth transitions for state changes
|
|
871
|
+
* Uses MOTION_TOKENS for canonical motion values
|
|
914
872
|
*/
|
|
915
|
-
readonly transition: "transition-all duration-
|
|
873
|
+
readonly transition: "transition-all duration-normal ease-in-out";
|
|
916
874
|
};
|
|
917
875
|
/**
|
|
918
876
|
* Type exports for Checkbox tokens
|
|
@@ -1105,12 +1063,12 @@ declare const SWITCH_TOKENS: {
|
|
|
1105
1063
|
/**
|
|
1106
1064
|
* Transition tokens
|
|
1107
1065
|
* Smooth transitions for handle animation and state changes
|
|
1108
|
-
* Uses
|
|
1066
|
+
* Uses MOTION_TOKENS for canonical motion values
|
|
1109
1067
|
*/
|
|
1110
1068
|
readonly transition: {
|
|
1111
|
-
readonly handle: "transition-transform duration-
|
|
1112
|
-
readonly track: "transition-colors duration-
|
|
1113
|
-
readonly combined: "transition-all duration-
|
|
1069
|
+
readonly handle: "transition-transform duration-normal ease-in-out";
|
|
1070
|
+
readonly track: "transition-colors duration-normal ease-in-out";
|
|
1071
|
+
readonly combined: "transition-all duration-normal ease-in-out";
|
|
1114
1072
|
};
|
|
1115
1073
|
/**
|
|
1116
1074
|
* Shadow token
|
|
@@ -1270,8 +1228,9 @@ declare const RADIO_TOKENS: {
|
|
|
1270
1228
|
/**
|
|
1271
1229
|
* Transition tokens
|
|
1272
1230
|
* Smooth transitions for state changes
|
|
1231
|
+
* Uses MOTION_TOKENS for canonical motion values
|
|
1273
1232
|
*/
|
|
1274
|
-
readonly transition: "transition-all duration-
|
|
1233
|
+
readonly transition: "transition-all duration-normal ease-in-out";
|
|
1275
1234
|
};
|
|
1276
1235
|
/**
|
|
1277
1236
|
* Type exports for Radio tokens
|
|
@@ -1286,13 +1245,15 @@ type RadioState = keyof typeof RADIO_TOKENS.state.border;
|
|
|
1286
1245
|
* Component-level design tokens for Surface component.
|
|
1287
1246
|
* Maps foundation tokens (spacing, radius, shadows) to surface-specific usage.
|
|
1288
1247
|
*
|
|
1289
|
-
* Defines tokens for
|
|
1248
|
+
* Defines tokens for canonical SurfaceVariant names: default, elevated, outlined, filled, subtle.
|
|
1249
|
+
* @see docs/architecture/VARIANTS_SIZE_CANON.md for canonical variant dictionary
|
|
1290
1250
|
*/
|
|
1291
1251
|
/**
|
|
1292
1252
|
* Surface Component Tokens
|
|
1293
1253
|
*
|
|
1294
1254
|
* Defines spacing, radius, and shadow tokens for Surface component variants.
|
|
1295
1255
|
* Values are mapped to Tailwind utility classes for direct use.
|
|
1256
|
+
* Uses canonical SurfaceVariant dictionary: default, elevated, outlined, filled, subtle.
|
|
1296
1257
|
*/
|
|
1297
1258
|
declare const SURFACE_TOKENS: {
|
|
1298
1259
|
/**
|
|
@@ -1317,46 +1278,48 @@ declare const SURFACE_TOKENS: {
|
|
|
1317
1278
|
/**
|
|
1318
1279
|
* Shadow tokens by surface variant
|
|
1319
1280
|
* Maps to foundation elevation shadow tokens
|
|
1281
|
+
* Uses canonical SurfaceVariant names
|
|
1320
1282
|
*/
|
|
1321
1283
|
readonly shadow: {
|
|
1322
|
-
readonly
|
|
1323
|
-
readonly
|
|
1324
|
-
readonly
|
|
1325
|
-
readonly
|
|
1284
|
+
readonly default: "shadow-none";
|
|
1285
|
+
readonly elevated: "shadow-sm";
|
|
1286
|
+
readonly outlined: "shadow-none";
|
|
1287
|
+
readonly filled: "shadow-none";
|
|
1326
1288
|
readonly subtle: "shadow-none";
|
|
1327
1289
|
};
|
|
1328
1290
|
/**
|
|
1329
1291
|
* Variant-based token structure
|
|
1330
1292
|
* Organized by variant for easy access
|
|
1293
|
+
* Uses canonical SurfaceVariant names: default, elevated, outlined, filled, subtle
|
|
1331
1294
|
*/
|
|
1332
1295
|
readonly variant: {
|
|
1333
|
-
readonly
|
|
1296
|
+
readonly default: {
|
|
1334
1297
|
readonly padding: "p-md";
|
|
1335
1298
|
readonly radius: "rounded-md";
|
|
1336
1299
|
readonly shadow: "shadow-none";
|
|
1337
1300
|
readonly bg: "bg-background";
|
|
1338
1301
|
readonly border: "border border-border";
|
|
1339
1302
|
};
|
|
1340
|
-
readonly
|
|
1303
|
+
readonly elevated: {
|
|
1341
1304
|
readonly padding: "p-md";
|
|
1342
1305
|
readonly radius: "rounded-md";
|
|
1343
1306
|
readonly shadow: "shadow-sm";
|
|
1344
1307
|
readonly bg: "bg-card";
|
|
1345
1308
|
readonly border: "border border-border";
|
|
1346
1309
|
};
|
|
1347
|
-
readonly
|
|
1310
|
+
readonly outlined: {
|
|
1348
1311
|
readonly padding: "p-md";
|
|
1349
1312
|
readonly radius: "rounded-md";
|
|
1350
1313
|
readonly shadow: "shadow-none";
|
|
1351
|
-
readonly bg: "bg-
|
|
1352
|
-
readonly border: "border border-border";
|
|
1314
|
+
readonly bg: "bg-transparent";
|
|
1315
|
+
readonly border: "border-2 border-border";
|
|
1353
1316
|
};
|
|
1354
|
-
readonly
|
|
1317
|
+
readonly filled: {
|
|
1355
1318
|
readonly padding: "p-md";
|
|
1356
1319
|
readonly radius: "rounded-md";
|
|
1357
1320
|
readonly shadow: "shadow-none";
|
|
1358
|
-
readonly bg: "bg-
|
|
1359
|
-
readonly border: "border
|
|
1321
|
+
readonly bg: "bg-muted";
|
|
1322
|
+
readonly border: "border border-border";
|
|
1360
1323
|
};
|
|
1361
1324
|
readonly subtle: {
|
|
1362
1325
|
readonly padding: "p-md";
|
|
@@ -2564,8 +2527,8 @@ declare const SELECT_TOKENS: {
|
|
|
2564
2527
|
readonly background: "bg-[hsl(var(--popover))]";
|
|
2565
2528
|
readonly text: "text-[hsl(var(--popover-foreground))]";
|
|
2566
2529
|
readonly border: "border border-[hsl(var(--border))]";
|
|
2567
|
-
readonly maxHeight: "max-h-
|
|
2568
|
-
readonly minWidth: "min-w-
|
|
2530
|
+
readonly maxHeight: "max-h-96";
|
|
2531
|
+
readonly minWidth: "min-w-32";
|
|
2569
2532
|
};
|
|
2570
2533
|
/**
|
|
2571
2534
|
* Select item tokens
|
|
@@ -3176,9 +3139,14 @@ declare const TABS_TOKENS: {
|
|
|
3176
3139
|
* All colors use CSS variable references (hsl(var(--token))) for theme-aware styling.
|
|
3177
3140
|
*/
|
|
3178
3141
|
declare const MODAL_TOKENS: {
|
|
3142
|
+
/**
|
|
3143
|
+
* Modal maximum height token
|
|
3144
|
+
* Used for all modal sizes to prevent overflow on small screens
|
|
3145
|
+
*/
|
|
3146
|
+
readonly maxHeight: "max-h-[90vh]";
|
|
3179
3147
|
/**
|
|
3180
3148
|
* Modal size tokens
|
|
3181
|
-
* Supports sm, md, lg
|
|
3149
|
+
* Supports sm, md, lg sizes only (overlay restriction per VARIANTS_SIZE_CANON)
|
|
3182
3150
|
*/
|
|
3183
3151
|
readonly size: {
|
|
3184
3152
|
readonly sm: {
|
|
@@ -3202,20 +3170,6 @@ declare const MODAL_TOKENS: {
|
|
|
3202
3170
|
readonly radius: "rounded-xl";
|
|
3203
3171
|
readonly shadow: "shadow-2xl";
|
|
3204
3172
|
};
|
|
3205
|
-
readonly xl: {
|
|
3206
|
-
readonly width: "w-full max-w-xl";
|
|
3207
|
-
readonly height: "h-auto max-h-[90vh]";
|
|
3208
|
-
readonly padding: "p-xl";
|
|
3209
|
-
readonly radius: "rounded-xl";
|
|
3210
|
-
readonly shadow: "shadow-2xl";
|
|
3211
|
-
};
|
|
3212
|
-
readonly fullscreen: {
|
|
3213
|
-
readonly width: "w-full h-full max-w-full max-h-full";
|
|
3214
|
-
readonly height: "h-full";
|
|
3215
|
-
readonly padding: "p-xl";
|
|
3216
|
-
readonly radius: "rounded-none";
|
|
3217
|
-
readonly shadow: "shadow-none";
|
|
3218
|
-
};
|
|
3219
3173
|
};
|
|
3220
3174
|
/**
|
|
3221
3175
|
* Modal overlay tokens
|
|
@@ -3904,9 +3858,9 @@ declare const MOTION_TOKENS: {
|
|
|
3904
3858
|
/**
|
|
3905
3859
|
* Type exports for Motion tokens
|
|
3906
3860
|
*/
|
|
3907
|
-
type MotionTransition = keyof typeof MOTION_TOKENS.transition;
|
|
3908
|
-
type MotionDuration = keyof typeof MOTION_TOKENS.duration;
|
|
3909
|
-
type MotionEasing = keyof typeof MOTION_TOKENS.easing;
|
|
3861
|
+
type MotionTransition$1 = keyof typeof MOTION_TOKENS.transition;
|
|
3862
|
+
type MotionDuration$1 = keyof typeof MOTION_TOKENS.duration;
|
|
3863
|
+
type MotionEasing$1 = keyof typeof MOTION_TOKENS.easing;
|
|
3910
3864
|
type MotionTransitionPreset = keyof typeof MOTION_TOKENS.transitionPreset;
|
|
3911
3865
|
type MotionAnimation = keyof typeof MOTION_TOKENS.animation;
|
|
3912
3866
|
|
|
@@ -3921,43 +3875,18 @@ type MotionAnimation = keyof typeof MOTION_TOKENS.animation;
|
|
|
3921
3875
|
* Merges all token CSS variables into a single object
|
|
3922
3876
|
*/
|
|
3923
3877
|
declare const allCSSVariables: {
|
|
3924
|
-
readonly "--duration-
|
|
3925
|
-
readonly "--duration-
|
|
3926
|
-
readonly "--duration-
|
|
3927
|
-
readonly "--duration-
|
|
3928
|
-
readonly "--
|
|
3929
|
-
readonly "--
|
|
3930
|
-
readonly "--
|
|
3931
|
-
readonly "--
|
|
3932
|
-
readonly "--
|
|
3933
|
-
readonly "--
|
|
3934
|
-
readonly "--
|
|
3935
|
-
readonly "--
|
|
3936
|
-
readonly "--duration-800": "800ms";
|
|
3937
|
-
readonly "--ease-linear": "linear";
|
|
3938
|
-
readonly "--ease-in": "cubic-bezier(0.4, 0, 1, 1)";
|
|
3939
|
-
readonly "--ease-out": "cubic-bezier(0, 0, 0.2, 1)";
|
|
3940
|
-
readonly "--ease-in-out": "cubic-bezier(0.4, 0, 0.2, 1)";
|
|
3941
|
-
readonly "--ease-bounce": "cubic-bezier(0.68, -0.55, 0.265, 1.55)";
|
|
3942
|
-
readonly "--ease-elastic": "cubic-bezier(0.175, 0.885, 0.32, 1.275)";
|
|
3943
|
-
readonly "--ease-out-cubic": "cubic-bezier(0.215, 0.61, 0.355, 1)";
|
|
3944
|
-
readonly "--ease-in-cubic": "cubic-bezier(0.55, 0.055, 0.675, 0.19)";
|
|
3945
|
-
readonly "--ease-in-out-cubic": "cubic-bezier(0.645, 0.045, 0.355, 1)";
|
|
3946
|
-
readonly "--transition-fast": "150ms cubic-bezier(0, 0, 0.2, 1)";
|
|
3947
|
-
readonly "--transition-normal": "300ms cubic-bezier(0.4, 0, 0.2, 1)";
|
|
3948
|
-
readonly "--transition-slow": "500ms cubic-bezier(0.4, 0, 0.2, 1)";
|
|
3949
|
-
readonly "--transition-default": "300ms cubic-bezier(0.4, 0, 0.2, 1)";
|
|
3950
|
-
readonly "--transition-fast-in": "150ms cubic-bezier(0.4, 0, 1, 1)";
|
|
3951
|
-
readonly "--transition-fast-out": "150ms cubic-bezier(0, 0, 0.2, 1)";
|
|
3952
|
-
readonly "--transition-fast-in-out": "150ms cubic-bezier(0.4, 0, 0.2, 1)";
|
|
3953
|
-
readonly "--transition-normal-in": "300ms cubic-bezier(0.4, 0, 1, 1)";
|
|
3954
|
-
readonly "--transition-normal-out": "300ms cubic-bezier(0, 0, 0.2, 1)";
|
|
3955
|
-
readonly "--transition-normal-in-out": "300ms cubic-bezier(0.4, 0, 0.2, 1)";
|
|
3956
|
-
readonly "--transition-slow-in": "500ms cubic-bezier(0.4, 0, 1, 1)";
|
|
3957
|
-
readonly "--transition-slow-out": "500ms cubic-bezier(0, 0, 0.2, 1)";
|
|
3958
|
-
readonly "--transition-slow-in-out": "500ms cubic-bezier(0.4, 0, 0.2, 1)";
|
|
3959
|
-
readonly "--transition-bounce": "300ms cubic-bezier(0.68, -0.55, 0.265, 1.55)";
|
|
3960
|
-
readonly "--transition-elastic": "500ms cubic-bezier(0.175, 0.885, 0.32, 1.275)";
|
|
3878
|
+
readonly "--motion-duration-fast": "150ms";
|
|
3879
|
+
readonly "--motion-duration-normal": "250ms";
|
|
3880
|
+
readonly "--motion-duration-slow": "350ms";
|
|
3881
|
+
readonly "--motion-duration-reduced": "0ms";
|
|
3882
|
+
readonly "--motion-easing-soft": "cubic-bezier(0.22, 1, 0.36, 1)";
|
|
3883
|
+
readonly "--motion-easing-standard": "cubic-bezier(0.4, 0, 0.2, 1)";
|
|
3884
|
+
readonly "--motion-easing-emphasized": "cubic-bezier(0.2, 0, 0, 1)";
|
|
3885
|
+
readonly "--motion-transition-fast": "150ms cubic-bezier(0.4, 0, 0.2, 1)";
|
|
3886
|
+
readonly "--motion-transition-normal": "250ms cubic-bezier(0.4, 0, 0.2, 1)";
|
|
3887
|
+
readonly "--motion-transition-slow": "350ms cubic-bezier(0.2, 0, 0, 1)";
|
|
3888
|
+
readonly "--motion-transition-soft": "250ms cubic-bezier(0.22, 1, 0.36, 1)";
|
|
3889
|
+
readonly "--motion-transition-reduced": "0ms linear";
|
|
3961
3890
|
readonly "--radius-none": "0";
|
|
3962
3891
|
readonly "--radius-xs": "0.125rem";
|
|
3963
3892
|
readonly "--radius-sm": "0.25rem";
|
|
@@ -4163,7 +4092,7 @@ declare const tokenSystemSummary: {
|
|
|
4163
4092
|
};
|
|
4164
4093
|
|
|
4165
4094
|
/**
|
|
4166
|
-
* Motion System
|
|
4095
|
+
* Motion System Tokens
|
|
4167
4096
|
*
|
|
4168
4097
|
* Unified, token-driven motion system for Tenerife UI.
|
|
4169
4098
|
* CSS-only animations with gesture support, directional transitions,
|
|
@@ -4173,29 +4102,29 @@ declare const tokenSystemSummary: {
|
|
|
4173
4102
|
* No framer-motion dependency - pure CSS animations.
|
|
4174
4103
|
*/
|
|
4175
4104
|
/**
|
|
4176
|
-
* Motion
|
|
4105
|
+
* Motion Duration Presets
|
|
4177
4106
|
* Optimized for smooth CSS transitions
|
|
4178
4107
|
*/
|
|
4179
|
-
declare const
|
|
4108
|
+
declare const motionDurations: {
|
|
4180
4109
|
readonly fast: "150ms";
|
|
4181
4110
|
readonly normal: "250ms";
|
|
4182
4111
|
readonly slow: "350ms";
|
|
4183
4112
|
readonly reduced: "0ms";
|
|
4184
4113
|
};
|
|
4185
4114
|
/**
|
|
4186
|
-
* Motion
|
|
4115
|
+
* Motion Easing Presets
|
|
4187
4116
|
* Advanced cubic-bezier curves for natural motion
|
|
4188
4117
|
*/
|
|
4189
|
-
declare const
|
|
4118
|
+
declare const motionEasings: {
|
|
4190
4119
|
readonly soft: "cubic-bezier(0.22, 1, 0.36, 1)";
|
|
4191
4120
|
readonly standard: "cubic-bezier(0.4, 0, 0.2, 1)";
|
|
4192
4121
|
readonly emphasized: "cubic-bezier(0.2, 0, 0, 1)";
|
|
4193
4122
|
};
|
|
4194
4123
|
/**
|
|
4195
|
-
* Motion
|
|
4124
|
+
* Motion Transition Presets
|
|
4196
4125
|
* Pre-configured transitions combining duration and easing
|
|
4197
4126
|
*/
|
|
4198
|
-
declare const
|
|
4127
|
+
declare const motionTransitions: {
|
|
4199
4128
|
readonly fast: "150ms cubic-bezier(0.4, 0, 0.2, 1)";
|
|
4200
4129
|
readonly normal: "250ms cubic-bezier(0.4, 0, 0.2, 1)";
|
|
4201
4130
|
readonly slow: "350ms cubic-bezier(0.2, 0, 0, 1)";
|
|
@@ -4203,77 +4132,77 @@ declare const motionV2Transitions: {
|
|
|
4203
4132
|
readonly reduced: "0ms linear";
|
|
4204
4133
|
};
|
|
4205
4134
|
/**
|
|
4206
|
-
* Motion
|
|
4135
|
+
* Motion Fade Animations
|
|
4207
4136
|
* Opacity-based transitions
|
|
4208
4137
|
*/
|
|
4209
|
-
declare const
|
|
4138
|
+
declare const motionFade: {
|
|
4210
4139
|
readonly in: {
|
|
4211
4140
|
readonly from: {
|
|
4212
|
-
readonly opacity: 0;
|
|
4141
|
+
readonly opacity: "0";
|
|
4213
4142
|
};
|
|
4214
4143
|
readonly to: {
|
|
4215
|
-
readonly opacity: 1;
|
|
4144
|
+
readonly opacity: "1";
|
|
4216
4145
|
};
|
|
4217
4146
|
};
|
|
4218
4147
|
readonly out: {
|
|
4219
4148
|
readonly from: {
|
|
4220
|
-
readonly opacity: 1;
|
|
4149
|
+
readonly opacity: "1";
|
|
4221
4150
|
};
|
|
4222
4151
|
readonly to: {
|
|
4223
|
-
readonly opacity: 0;
|
|
4152
|
+
readonly opacity: "0";
|
|
4224
4153
|
};
|
|
4225
4154
|
};
|
|
4226
4155
|
};
|
|
4227
4156
|
/**
|
|
4228
|
-
* Motion
|
|
4157
|
+
* Motion Scale Animations
|
|
4229
4158
|
* Transform scale-based transitions
|
|
4230
4159
|
*/
|
|
4231
|
-
declare const
|
|
4160
|
+
declare const motionScale: {
|
|
4232
4161
|
readonly in: {
|
|
4233
4162
|
readonly from: {
|
|
4234
4163
|
readonly transform: "scale(0.95)";
|
|
4235
|
-
readonly opacity: 0;
|
|
4164
|
+
readonly opacity: "0";
|
|
4236
4165
|
};
|
|
4237
4166
|
readonly to: {
|
|
4238
4167
|
readonly transform: "scale(1)";
|
|
4239
|
-
readonly opacity: 1;
|
|
4168
|
+
readonly opacity: "1";
|
|
4240
4169
|
};
|
|
4241
4170
|
};
|
|
4242
4171
|
readonly out: {
|
|
4243
4172
|
readonly from: {
|
|
4244
4173
|
readonly transform: "scale(1)";
|
|
4245
|
-
readonly opacity: 1;
|
|
4174
|
+
readonly opacity: "1";
|
|
4246
4175
|
};
|
|
4247
4176
|
readonly to: {
|
|
4248
4177
|
readonly transform: "scale(0.95)";
|
|
4249
|
-
readonly opacity: 0;
|
|
4178
|
+
readonly opacity: "0";
|
|
4250
4179
|
};
|
|
4251
4180
|
};
|
|
4252
4181
|
};
|
|
4253
4182
|
/**
|
|
4254
|
-
* Motion
|
|
4183
|
+
* Motion Slide Animations
|
|
4255
4184
|
* Directional slide transitions
|
|
4256
4185
|
*/
|
|
4257
|
-
declare const
|
|
4186
|
+
declare const motionSlide: {
|
|
4258
4187
|
readonly up: {
|
|
4259
4188
|
readonly in: {
|
|
4260
4189
|
readonly from: {
|
|
4261
4190
|
readonly transform: "translateY(100%)";
|
|
4262
|
-
readonly opacity: 0;
|
|
4191
|
+
readonly opacity: "0";
|
|
4263
4192
|
};
|
|
4264
4193
|
readonly to: {
|
|
4265
4194
|
readonly transform: "translateY(0)";
|
|
4266
|
-
readonly opacity: 1;
|
|
4195
|
+
readonly opacity: "1";
|
|
4267
4196
|
};
|
|
4268
4197
|
};
|
|
4269
4198
|
readonly out: {
|
|
4270
4199
|
readonly from: {
|
|
4271
4200
|
readonly transform: "translateY(0)";
|
|
4272
|
-
readonly opacity: 1;
|
|
4201
|
+
readonly opacity: "1";
|
|
4273
4202
|
};
|
|
4274
4203
|
readonly to: {
|
|
4275
4204
|
readonly transform: "translateY(100%)";
|
|
4276
|
-
readonly opacity: 0;
|
|
4205
|
+
readonly opacity: "0";
|
|
4277
4206
|
};
|
|
4278
4207
|
};
|
|
4279
4208
|
};
|
|
@@ -4281,21 +4210,21 @@ declare const motionV2Slide: {
|
|
|
4281
4210
|
readonly in: {
|
|
4282
4211
|
readonly from: {
|
|
4283
4212
|
readonly transform: "translateY(-100%)";
|
|
4284
|
-
readonly opacity: 0;
|
|
4213
|
+
readonly opacity: "0";
|
|
4285
4214
|
};
|
|
4286
4215
|
readonly to: {
|
|
4287
4216
|
readonly transform: "translateY(0)";
|
|
4288
|
-
readonly opacity: 1;
|
|
4217
|
+
readonly opacity: "1";
|
|
4289
4218
|
};
|
|
4290
4219
|
};
|
|
4291
4220
|
readonly out: {
|
|
4292
4221
|
readonly from: {
|
|
4293
4222
|
readonly transform: "translateY(0)";
|
|
4294
|
-
readonly opacity: 1;
|
|
4223
|
+
readonly opacity: "1";
|
|
4295
4224
|
};
|
|
4296
4225
|
readonly to: {
|
|
4297
4226
|
readonly transform: "translateY(-100%)";
|
|
4298
|
-
readonly opacity: 0;
|
|
4227
|
+
readonly opacity: "0";
|
|
4299
4228
|
};
|
|
4300
4229
|
};
|
|
4301
4230
|
};
|
|
@@ -4303,21 +4232,21 @@ declare const motionV2Slide: {
|
|
|
4303
4232
|
readonly in: {
|
|
4304
4233
|
readonly from: {
|
|
4305
4234
|
readonly transform: "translateX(100%)";
|
|
4306
|
-
readonly opacity: 0;
|
|
4235
|
+
readonly opacity: "0";
|
|
4307
4236
|
};
|
|
4308
4237
|
readonly to: {
|
|
4309
4238
|
readonly transform: "translateX(0)";
|
|
4310
|
-
readonly opacity: 1;
|
|
4239
|
+
readonly opacity: "1";
|
|
4311
4240
|
};
|
|
4312
4241
|
};
|
|
4313
4242
|
readonly out: {
|
|
4314
4243
|
readonly from: {
|
|
4315
4244
|
readonly transform: "translateX(0)";
|
|
4316
|
-
readonly opacity: 1;
|
|
4245
|
+
readonly opacity: "1";
|
|
4317
4246
|
};
|
|
4318
4247
|
readonly to: {
|
|
4319
4248
|
readonly transform: "translateX(100%)";
|
|
4320
|
-
readonly opacity: 0;
|
|
4249
|
+
readonly opacity: "0";
|
|
4321
4250
|
};
|
|
4322
4251
|
};
|
|
4323
4252
|
};
|
|
@@ -4325,49 +4254,49 @@ declare const motionV2Slide: {
|
|
|
4325
4254
|
readonly in: {
|
|
4326
4255
|
readonly from: {
|
|
4327
4256
|
readonly transform: "translateX(-100%)";
|
|
4328
|
-
readonly opacity: 0;
|
|
4257
|
+
readonly opacity: "0";
|
|
4329
4258
|
};
|
|
4330
4259
|
readonly to: {
|
|
4331
4260
|
readonly transform: "translateX(0)";
|
|
4332
|
-
readonly opacity: 1;
|
|
4261
|
+
readonly opacity: "1";
|
|
4333
4262
|
};
|
|
4334
4263
|
};
|
|
4335
4264
|
readonly out: {
|
|
4336
4265
|
readonly from: {
|
|
4337
4266
|
readonly transform: "translateX(0)";
|
|
4338
|
-
readonly opacity: 1;
|
|
4267
|
+
readonly opacity: "1";
|
|
4339
4268
|
};
|
|
4340
4269
|
readonly to: {
|
|
4341
4270
|
readonly transform: "translateX(-100%)";
|
|
4342
|
-
readonly opacity: 0;
|
|
4271
|
+
readonly opacity: "0";
|
|
4343
4272
|
};
|
|
4344
4273
|
};
|
|
4345
4274
|
};
|
|
4346
4275
|
};
|
|
4347
4276
|
/**
|
|
4348
|
-
* Motion
|
|
4277
|
+
* Motion Compound Animations
|
|
4349
4278
|
* Combined fade + scale, fade + slide transitions
|
|
4350
4279
|
*/
|
|
4351
|
-
declare const
|
|
4280
|
+
declare const motionCombined: {
|
|
4352
4281
|
readonly fadeScale: {
|
|
4353
4282
|
readonly in: {
|
|
4354
4283
|
readonly from: {
|
|
4355
4284
|
readonly transform: "scale(0.95)";
|
|
4356
|
-
readonly opacity: 0;
|
|
4285
|
+
readonly opacity: "0";
|
|
4357
4286
|
};
|
|
4358
4287
|
readonly to: {
|
|
4359
4288
|
readonly transform: "scale(1)";
|
|
4360
|
-
readonly opacity: 1;
|
|
4289
|
+
readonly opacity: "1";
|
|
4361
4290
|
};
|
|
4362
4291
|
};
|
|
4363
4292
|
readonly out: {
|
|
4364
4293
|
readonly from: {
|
|
4365
4294
|
readonly transform: "scale(1)";
|
|
4366
|
-
readonly opacity: 1;
|
|
4295
|
+
readonly opacity: "1";
|
|
4367
4296
|
};
|
|
4368
4297
|
readonly to: {
|
|
4369
4298
|
readonly transform: "scale(0.95)";
|
|
4370
|
-
readonly opacity: 0;
|
|
4299
|
+
readonly opacity: "0";
|
|
4371
4300
|
};
|
|
4372
4301
|
};
|
|
4373
4302
|
};
|
|
@@ -4375,21 +4304,21 @@ declare const motionV2Combined: {
|
|
|
4375
4304
|
readonly in: {
|
|
4376
4305
|
readonly from: {
|
|
4377
4306
|
readonly transform: "translateY(100%)";
|
|
4378
|
-
readonly opacity: 0;
|
|
4307
|
+
readonly opacity: "0";
|
|
4379
4308
|
};
|
|
4380
4309
|
readonly to: {
|
|
4381
4310
|
readonly transform: "translateY(0)";
|
|
4382
|
-
readonly opacity: 1;
|
|
4311
|
+
readonly opacity: "1";
|
|
4383
4312
|
};
|
|
4384
4313
|
};
|
|
4385
4314
|
readonly out: {
|
|
4386
4315
|
readonly from: {
|
|
4387
4316
|
readonly transform: "translateY(0)";
|
|
4388
|
-
readonly opacity: 1;
|
|
4317
|
+
readonly opacity: "1";
|
|
4389
4318
|
};
|
|
4390
4319
|
readonly to: {
|
|
4391
4320
|
readonly transform: "translateY(100%)";
|
|
4392
|
-
readonly opacity: 0;
|
|
4321
|
+
readonly opacity: "0";
|
|
4393
4322
|
};
|
|
4394
4323
|
};
|
|
4395
4324
|
};
|
|
@@ -4397,21 +4326,21 @@ declare const motionV2Combined: {
|
|
|
4397
4326
|
readonly in: {
|
|
4398
4327
|
readonly from: {
|
|
4399
4328
|
readonly transform: "translateY(-100%)";
|
|
4400
|
-
readonly opacity: 0;
|
|
4329
|
+
readonly opacity: "0";
|
|
4401
4330
|
};
|
|
4402
4331
|
readonly to: {
|
|
4403
4332
|
readonly transform: "translateY(0)";
|
|
4404
|
-
readonly opacity: 1;
|
|
4333
|
+
readonly opacity: "1";
|
|
4405
4334
|
};
|
|
4406
4335
|
};
|
|
4407
4336
|
readonly out: {
|
|
4408
4337
|
readonly from: {
|
|
4409
4338
|
readonly transform: "translateY(0)";
|
|
4410
|
-
readonly opacity: 1;
|
|
4339
|
+
readonly opacity: "1";
|
|
4411
4340
|
};
|
|
4412
4341
|
readonly to: {
|
|
4413
4342
|
readonly transform: "translateY(-100%)";
|
|
4414
|
-
readonly opacity: 0;
|
|
4343
|
+
readonly opacity: "0";
|
|
4415
4344
|
};
|
|
4416
4345
|
};
|
|
4417
4346
|
};
|
|
@@ -4419,21 +4348,21 @@ declare const motionV2Combined: {
|
|
|
4419
4348
|
readonly in: {
|
|
4420
4349
|
readonly from: {
|
|
4421
4350
|
readonly transform: "translateX(100%)";
|
|
4422
|
-
readonly opacity: 0;
|
|
4351
|
+
readonly opacity: "0";
|
|
4423
4352
|
};
|
|
4424
4353
|
readonly to: {
|
|
4425
4354
|
readonly transform: "translateX(0)";
|
|
4426
|
-
readonly opacity: 1;
|
|
4355
|
+
readonly opacity: "1";
|
|
4427
4356
|
};
|
|
4428
4357
|
};
|
|
4429
4358
|
readonly out: {
|
|
4430
4359
|
readonly from: {
|
|
4431
4360
|
readonly transform: "translateX(0)";
|
|
4432
|
-
readonly opacity: 1;
|
|
4361
|
+
readonly opacity: "1";
|
|
4433
4362
|
};
|
|
4434
4363
|
readonly to: {
|
|
4435
4364
|
readonly transform: "translateX(100%)";
|
|
4436
|
-
readonly opacity: 0;
|
|
4365
|
+
readonly opacity: "0";
|
|
4437
4366
|
};
|
|
4438
4367
|
};
|
|
4439
4368
|
};
|
|
@@ -4441,30 +4370,30 @@ declare const motionV2Combined: {
|
|
|
4441
4370
|
readonly in: {
|
|
4442
4371
|
readonly from: {
|
|
4443
4372
|
readonly transform: "translateX(-100%)";
|
|
4444
|
-
readonly opacity: 0;
|
|
4373
|
+
readonly opacity: "0";
|
|
4445
4374
|
};
|
|
4446
4375
|
readonly to: {
|
|
4447
4376
|
readonly transform: "translateX(0)";
|
|
4448
|
-
readonly opacity: 1;
|
|
4377
|
+
readonly opacity: "1";
|
|
4449
4378
|
};
|
|
4450
4379
|
};
|
|
4451
4380
|
readonly out: {
|
|
4452
4381
|
readonly from: {
|
|
4453
4382
|
readonly transform: "translateX(0)";
|
|
4454
|
-
readonly opacity: 1;
|
|
4383
|
+
readonly opacity: "1";
|
|
4455
4384
|
};
|
|
4456
4385
|
readonly to: {
|
|
4457
4386
|
readonly transform: "translateX(-100%)";
|
|
4458
|
-
readonly opacity: 0;
|
|
4387
|
+
readonly opacity: "0";
|
|
4459
4388
|
};
|
|
4460
4389
|
};
|
|
4461
4390
|
};
|
|
4462
4391
|
};
|
|
4463
4392
|
/**
|
|
4464
|
-
* Motion
|
|
4393
|
+
* Motion CSS Variables
|
|
4465
4394
|
* CSS custom properties for runtime theming
|
|
4466
4395
|
*/
|
|
4467
|
-
declare const
|
|
4396
|
+
declare const motionCSSVariables: {
|
|
4468
4397
|
readonly "--motion-duration-fast": "150ms";
|
|
4469
4398
|
readonly "--motion-duration-normal": "250ms";
|
|
4470
4399
|
readonly "--motion-duration-slow": "350ms";
|
|
@@ -4479,10 +4408,23 @@ declare const motionV2CSSVariables: {
|
|
|
4479
4408
|
readonly "--motion-transition-reduced": "0ms linear";
|
|
4480
4409
|
};
|
|
4481
4410
|
/**
|
|
4482
|
-
* Motion
|
|
4411
|
+
* Motion Transition Properties
|
|
4412
|
+
* Defines which CSS properties to transition
|
|
4413
|
+
*/
|
|
4414
|
+
declare const motionTransitionProperty: {
|
|
4415
|
+
readonly DEFAULT: "color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter";
|
|
4416
|
+
readonly colors: "color, background-color, border-color, text-decoration-color, fill, stroke";
|
|
4417
|
+
readonly opacity: "opacity";
|
|
4418
|
+
readonly shadow: "box-shadow";
|
|
4419
|
+
readonly transform: "transform";
|
|
4420
|
+
readonly all: "all";
|
|
4421
|
+
readonly none: "none";
|
|
4422
|
+
};
|
|
4423
|
+
/**
|
|
4424
|
+
* Motion Tailwind Config
|
|
4483
4425
|
* Maps to Tailwind theme for utility classes
|
|
4484
4426
|
*/
|
|
4485
|
-
declare const
|
|
4427
|
+
declare const motionTailwindConfig: {
|
|
4486
4428
|
readonly transitionDuration: {
|
|
4487
4429
|
readonly fast: "150ms";
|
|
4488
4430
|
readonly normal: "250ms";
|
|
@@ -4494,697 +4436,39 @@ declare const motionV2TailwindConfig: {
|
|
|
4494
4436
|
readonly standard: "cubic-bezier(0.4, 0, 0.2, 1)";
|
|
4495
4437
|
readonly emphasized: "cubic-bezier(0.2, 0, 0, 1)";
|
|
4496
4438
|
};
|
|
4497
|
-
readonly
|
|
4498
|
-
|
|
4499
|
-
|
|
4500
|
-
|
|
4501
|
-
|
|
4502
|
-
|
|
4503
|
-
|
|
4504
|
-
|
|
4505
|
-
type MotionV2SlideDirection = keyof typeof motionV2Slide;
|
|
4506
|
-
type MotionV2CombinedType = keyof typeof motionV2Combined;
|
|
4507
|
-
|
|
4508
|
-
/**
|
|
4509
|
-
* Motion System Tokens
|
|
4510
|
-
*
|
|
4511
|
-
* Complete motion system for Tenerife UI based on design system specifications.
|
|
4512
|
-
* Includes: durations, easing functions, transitions, keyframe animations,
|
|
4513
|
-
* and reduced motion support for accessibility.
|
|
4514
|
-
*
|
|
4515
|
-
* All motion respects user preferences for reduced motion (prefers-reduced-motion).
|
|
4516
|
-
* Base duration unit: 100ms
|
|
4517
|
-
*/
|
|
4518
|
-
/**
|
|
4519
|
-
* Animation Duration Tokens
|
|
4520
|
-
* Values: instant, fast, normal, slow, slower, slowest
|
|
4521
|
-
* Base unit: 100ms
|
|
4522
|
-
*/
|
|
4523
|
-
declare const durations: {
|
|
4524
|
-
readonly instant: "0ms";
|
|
4525
|
-
readonly fast: "150ms";
|
|
4526
|
-
readonly normal: "300ms";
|
|
4527
|
-
readonly slow: "500ms";
|
|
4528
|
-
readonly slower: "700ms";
|
|
4529
|
-
readonly slowest: "1000ms";
|
|
4530
|
-
readonly "75": "75ms";
|
|
4531
|
-
readonly "100": "100ms";
|
|
4532
|
-
readonly "200": "200ms";
|
|
4533
|
-
readonly "250": "250ms";
|
|
4534
|
-
readonly "400": "400ms";
|
|
4535
|
-
readonly "600": "600ms";
|
|
4536
|
-
readonly "800": "800ms";
|
|
4537
|
-
};
|
|
4538
|
-
/**
|
|
4539
|
-
* Easing Function Tokens
|
|
4540
|
-
* Cubic-bezier functions for natural motion
|
|
4541
|
-
*/
|
|
4542
|
-
declare const easings: {
|
|
4543
|
-
readonly linear: "linear";
|
|
4544
|
-
readonly "ease-in": "cubic-bezier(0.4, 0, 1, 1)";
|
|
4545
|
-
readonly "ease-out": "cubic-bezier(0, 0, 0.2, 1)";
|
|
4546
|
-
readonly "ease-in-out": "cubic-bezier(0.4, 0, 0.2, 1)";
|
|
4547
|
-
readonly ease: "ease";
|
|
4548
|
-
readonly bounce: "cubic-bezier(0.68, -0.55, 0.265, 1.55)";
|
|
4549
|
-
readonly elastic: "cubic-bezier(0.175, 0.885, 0.32, 1.275)";
|
|
4550
|
-
readonly "ease-out-cubic": "cubic-bezier(0.215, 0.61, 0.355, 1)";
|
|
4551
|
-
readonly "ease-in-cubic": "cubic-bezier(0.55, 0.055, 0.675, 0.19)";
|
|
4552
|
-
readonly "ease-in-out-cubic": "cubic-bezier(0.645, 0.045, 0.355, 1)";
|
|
4553
|
-
};
|
|
4554
|
-
/**
|
|
4555
|
-
* Transition Tokens
|
|
4556
|
-
* Pre-configured transitions combining duration and easing
|
|
4557
|
-
*/
|
|
4558
|
-
declare const transitions: {
|
|
4559
|
-
readonly fast: "150ms cubic-bezier(0, 0, 0.2, 1)";
|
|
4560
|
-
readonly "fast-in": "150ms cubic-bezier(0.4, 0, 1, 1)";
|
|
4561
|
-
readonly "fast-out": "150ms cubic-bezier(0, 0, 0.2, 1)";
|
|
4562
|
-
readonly "fast-in-out": "150ms cubic-bezier(0.4, 0, 0.2, 1)";
|
|
4563
|
-
readonly normal: "300ms cubic-bezier(0.4, 0, 0.2, 1)";
|
|
4564
|
-
readonly "normal-in": "300ms cubic-bezier(0.4, 0, 1, 1)";
|
|
4565
|
-
readonly "normal-out": "300ms cubic-bezier(0, 0, 0.2, 1)";
|
|
4566
|
-
readonly "normal-in-out": "300ms cubic-bezier(0.4, 0, 0.2, 1)";
|
|
4567
|
-
readonly slow: "500ms cubic-bezier(0.4, 0, 0.2, 1)";
|
|
4568
|
-
readonly "slow-in": "500ms cubic-bezier(0.4, 0, 1, 1)";
|
|
4569
|
-
readonly "slow-out": "500ms cubic-bezier(0, 0, 0.2, 1)";
|
|
4570
|
-
readonly "slow-in-out": "500ms cubic-bezier(0.4, 0, 0.2, 1)";
|
|
4571
|
-
readonly bounce: "300ms cubic-bezier(0.68, -0.55, 0.265, 1.55)";
|
|
4572
|
-
readonly elastic: "500ms cubic-bezier(0.175, 0.885, 0.32, 1.275)";
|
|
4573
|
-
readonly DEFAULT: "300ms cubic-bezier(0.4, 0, 0.2, 1)";
|
|
4574
|
-
};
|
|
4575
|
-
/**
|
|
4576
|
-
* Keyframe Animation Tokens
|
|
4577
|
-
* Pre-defined animations for common UI patterns
|
|
4578
|
-
*/
|
|
4579
|
-
declare const keyframes: {
|
|
4580
|
-
readonly fadeIn: {
|
|
4581
|
-
readonly from: {
|
|
4582
|
-
readonly opacity: "0";
|
|
4583
|
-
};
|
|
4584
|
-
readonly to: {
|
|
4585
|
-
readonly opacity: "1";
|
|
4586
|
-
};
|
|
4587
|
-
};
|
|
4588
|
-
readonly fadeOut: {
|
|
4589
|
-
readonly from: {
|
|
4590
|
-
readonly opacity: "1";
|
|
4591
|
-
};
|
|
4592
|
-
readonly to: {
|
|
4593
|
-
readonly opacity: "0";
|
|
4594
|
-
};
|
|
4595
|
-
};
|
|
4596
|
-
readonly slideInUp: {
|
|
4597
|
-
readonly from: {
|
|
4598
|
-
readonly transform: "translateY(100%)";
|
|
4599
|
-
readonly opacity: "0";
|
|
4600
|
-
};
|
|
4601
|
-
readonly to: {
|
|
4602
|
-
readonly transform: "translateY(0)";
|
|
4603
|
-
readonly opacity: "1";
|
|
4604
|
-
};
|
|
4605
|
-
};
|
|
4606
|
-
readonly slideInDown: {
|
|
4607
|
-
readonly from: {
|
|
4608
|
-
readonly transform: "translateY(-100%)";
|
|
4609
|
-
readonly opacity: "0";
|
|
4610
|
-
};
|
|
4611
|
-
readonly to: {
|
|
4612
|
-
readonly transform: "translateY(0)";
|
|
4613
|
-
readonly opacity: "1";
|
|
4614
|
-
};
|
|
4615
|
-
};
|
|
4616
|
-
readonly slideInLeft: {
|
|
4617
|
-
readonly from: {
|
|
4618
|
-
readonly transform: "translateX(-100%)";
|
|
4619
|
-
readonly opacity: "0";
|
|
4620
|
-
};
|
|
4621
|
-
readonly to: {
|
|
4622
|
-
readonly transform: "translateX(0)";
|
|
4623
|
-
readonly opacity: "1";
|
|
4624
|
-
};
|
|
4625
|
-
};
|
|
4626
|
-
readonly slideInRight: {
|
|
4627
|
-
readonly from: {
|
|
4628
|
-
readonly transform: "translateX(100%)";
|
|
4629
|
-
readonly opacity: "0";
|
|
4630
|
-
};
|
|
4631
|
-
readonly to: {
|
|
4632
|
-
readonly transform: "translateX(0)";
|
|
4633
|
-
readonly opacity: "1";
|
|
4634
|
-
};
|
|
4635
|
-
};
|
|
4636
|
-
readonly slideOutUp: {
|
|
4637
|
-
readonly from: {
|
|
4638
|
-
readonly transform: "translateY(0)";
|
|
4639
|
-
readonly opacity: "1";
|
|
4640
|
-
};
|
|
4641
|
-
readonly to: {
|
|
4642
|
-
readonly transform: "translateY(-100%)";
|
|
4643
|
-
readonly opacity: "0";
|
|
4644
|
-
};
|
|
4645
|
-
};
|
|
4646
|
-
readonly slideOutDown: {
|
|
4647
|
-
readonly from: {
|
|
4648
|
-
readonly transform: "translateY(0)";
|
|
4649
|
-
readonly opacity: "1";
|
|
4650
|
-
};
|
|
4651
|
-
readonly to: {
|
|
4652
|
-
readonly transform: "translateY(100%)";
|
|
4653
|
-
readonly opacity: "0";
|
|
4654
|
-
};
|
|
4655
|
-
};
|
|
4656
|
-
readonly slideOutLeft: {
|
|
4657
|
-
readonly from: {
|
|
4658
|
-
readonly transform: "translateX(0)";
|
|
4659
|
-
readonly opacity: "1";
|
|
4660
|
-
};
|
|
4661
|
-
readonly to: {
|
|
4662
|
-
readonly transform: "translateX(-100%)";
|
|
4663
|
-
readonly opacity: "0";
|
|
4664
|
-
};
|
|
4665
|
-
};
|
|
4666
|
-
readonly slideOutRight: {
|
|
4667
|
-
readonly from: {
|
|
4668
|
-
readonly transform: "translateX(0)";
|
|
4669
|
-
readonly opacity: "1";
|
|
4670
|
-
};
|
|
4671
|
-
readonly to: {
|
|
4672
|
-
readonly transform: "translateX(100%)";
|
|
4673
|
-
readonly opacity: "0";
|
|
4674
|
-
};
|
|
4675
|
-
};
|
|
4676
|
-
readonly scaleIn: {
|
|
4677
|
-
readonly from: {
|
|
4678
|
-
readonly transform: "scale(0.95)";
|
|
4679
|
-
readonly opacity: "0";
|
|
4680
|
-
};
|
|
4681
|
-
readonly to: {
|
|
4682
|
-
readonly transform: "scale(1)";
|
|
4683
|
-
readonly opacity: "1";
|
|
4684
|
-
};
|
|
4685
|
-
};
|
|
4686
|
-
readonly scaleOut: {
|
|
4687
|
-
readonly from: {
|
|
4688
|
-
readonly transform: "scale(1)";
|
|
4689
|
-
readonly opacity: "1";
|
|
4690
|
-
};
|
|
4691
|
-
readonly to: {
|
|
4692
|
-
readonly transform: "scale(0.95)";
|
|
4693
|
-
readonly opacity: "0";
|
|
4694
|
-
};
|
|
4695
|
-
};
|
|
4696
|
-
readonly scaleUp: {
|
|
4697
|
-
readonly from: {
|
|
4698
|
-
readonly transform: "scale(1)";
|
|
4699
|
-
};
|
|
4700
|
-
readonly to: {
|
|
4701
|
-
readonly transform: "scale(1.05)";
|
|
4702
|
-
};
|
|
4703
|
-
};
|
|
4704
|
-
readonly scaleDown: {
|
|
4705
|
-
readonly from: {
|
|
4706
|
-
readonly transform: "scale(1.05)";
|
|
4707
|
-
};
|
|
4708
|
-
readonly to: {
|
|
4709
|
-
readonly transform: "scale(1)";
|
|
4710
|
-
};
|
|
4711
|
-
};
|
|
4712
|
-
readonly spin: {
|
|
4713
|
-
readonly from: {
|
|
4714
|
-
readonly transform: "rotate(0deg)";
|
|
4715
|
-
};
|
|
4716
|
-
readonly to: {
|
|
4717
|
-
readonly transform: "rotate(360deg)";
|
|
4718
|
-
};
|
|
4719
|
-
};
|
|
4720
|
-
readonly spinReverse: {
|
|
4721
|
-
readonly from: {
|
|
4722
|
-
readonly transform: "rotate(360deg)";
|
|
4723
|
-
};
|
|
4724
|
-
readonly to: {
|
|
4725
|
-
readonly transform: "rotate(0deg)";
|
|
4726
|
-
};
|
|
4727
|
-
};
|
|
4728
|
-
readonly pulse: {
|
|
4729
|
-
readonly "0%, 100%": {
|
|
4730
|
-
readonly opacity: "1";
|
|
4731
|
-
};
|
|
4732
|
-
readonly "50%": {
|
|
4733
|
-
readonly opacity: "0.5";
|
|
4734
|
-
};
|
|
4735
|
-
};
|
|
4736
|
-
readonly bounce: {
|
|
4737
|
-
readonly "0%, 100%": {
|
|
4738
|
-
readonly transform: "translateY(-25%)";
|
|
4739
|
-
readonly animationTimingFunction: "cubic-bezier(0.8, 0, 1, 1)";
|
|
4740
|
-
};
|
|
4741
|
-
readonly "50%": {
|
|
4742
|
-
readonly transform: "translateY(0)";
|
|
4743
|
-
readonly animationTimingFunction: "cubic-bezier(0, 0, 0.2, 1)";
|
|
4744
|
-
};
|
|
4745
|
-
};
|
|
4746
|
-
readonly shake: {
|
|
4747
|
-
readonly "0%, 100%": {
|
|
4748
|
-
readonly transform: "translateX(0)";
|
|
4749
|
-
};
|
|
4750
|
-
readonly "10%, 30%, 50%, 70%, 90%": {
|
|
4751
|
-
readonly transform: "translateX(-4px)";
|
|
4752
|
-
};
|
|
4753
|
-
readonly "20%, 40%, 60%, 80%": {
|
|
4754
|
-
readonly transform: "translateX(4px)";
|
|
4755
|
-
};
|
|
4756
|
-
};
|
|
4757
|
-
readonly ping: {
|
|
4758
|
-
readonly "75%, 100%": {
|
|
4759
|
-
readonly transform: "scale(2)";
|
|
4760
|
-
readonly opacity: "0";
|
|
4761
|
-
};
|
|
4762
|
-
};
|
|
4763
|
-
readonly "accordion-down": {
|
|
4764
|
-
readonly from: {
|
|
4765
|
-
readonly height: "0";
|
|
4766
|
-
};
|
|
4767
|
-
readonly to: {
|
|
4768
|
-
readonly height: "var(--radix-accordion-content-height)";
|
|
4769
|
-
};
|
|
4770
|
-
};
|
|
4771
|
-
readonly "accordion-up": {
|
|
4772
|
-
readonly from: {
|
|
4773
|
-
readonly height: "var(--radix-accordion-content-height)";
|
|
4774
|
-
};
|
|
4775
|
-
readonly to: {
|
|
4776
|
-
readonly height: "0";
|
|
4777
|
-
};
|
|
4778
|
-
};
|
|
4779
|
-
};
|
|
4780
|
-
/**
|
|
4781
|
-
* Animation Tokens
|
|
4782
|
-
* Pre-configured animations combining keyframes, duration, and easing
|
|
4783
|
-
*/
|
|
4784
|
-
declare const animations: {
|
|
4785
|
-
readonly fadeIn: "fadeIn 300ms cubic-bezier(0, 0, 0.2, 1)";
|
|
4786
|
-
readonly fadeOut: "fadeOut 150ms cubic-bezier(0.4, 0, 1, 1)";
|
|
4787
|
-
readonly slideInUp: "slideInUp 300ms cubic-bezier(0, 0, 0.2, 1)";
|
|
4788
|
-
readonly slideInDown: "slideInDown 300ms cubic-bezier(0, 0, 0.2, 1)";
|
|
4789
|
-
readonly slideInLeft: "slideInLeft 300ms cubic-bezier(0, 0, 0.2, 1)";
|
|
4790
|
-
readonly slideInRight: "slideInRight 300ms cubic-bezier(0, 0, 0.2, 1)";
|
|
4791
|
-
readonly slideOutUp: "slideOutUp 150ms cubic-bezier(0.4, 0, 1, 1)";
|
|
4792
|
-
readonly slideOutDown: "slideOutDown 150ms cubic-bezier(0.4, 0, 1, 1)";
|
|
4793
|
-
readonly slideOutLeft: "slideOutLeft 150ms cubic-bezier(0.4, 0, 1, 1)";
|
|
4794
|
-
readonly slideOutRight: "slideOutRight 150ms cubic-bezier(0.4, 0, 1, 1)";
|
|
4795
|
-
readonly scaleIn: "scaleIn 300ms cubic-bezier(0, 0, 0.2, 1)";
|
|
4796
|
-
readonly scaleOut: "scaleOut 150ms cubic-bezier(0.4, 0, 1, 1)";
|
|
4797
|
-
readonly spin: "spin 1s linear infinite";
|
|
4798
|
-
readonly pulse: "pulse 2s cubic-bezier(0.4, 0, 0.2, 1) infinite";
|
|
4799
|
-
readonly bounce: "bounce 1s linear infinite";
|
|
4800
|
-
readonly ping: "ping 1s cubic-bezier(0, 0, 0.2, 1) cubic-bezier(0, 0, 0.2, 1) infinite";
|
|
4801
|
-
readonly shake: "shake 0.5s cubic-bezier(0.4, 0, 0.2, 1)";
|
|
4802
|
-
readonly "accordion-down": "accordion-down 300ms cubic-bezier(0, 0, 0.2, 1)";
|
|
4803
|
-
readonly "accordion-up": "accordion-up 300ms cubic-bezier(0, 0, 0.2, 1)";
|
|
4804
|
-
};
|
|
4805
|
-
/**
|
|
4806
|
-
* Spring Configuration Tokens
|
|
4807
|
-
* For Framer Motion spring animations
|
|
4808
|
-
* Based on Material Design motion principles
|
|
4809
|
-
*/
|
|
4810
|
-
declare const springs: {
|
|
4811
|
-
readonly gentle: {
|
|
4812
|
-
readonly type: "spring";
|
|
4813
|
-
readonly stiffness: 120;
|
|
4814
|
-
readonly damping: 14;
|
|
4815
|
-
readonly mass: 1;
|
|
4816
|
-
};
|
|
4817
|
-
readonly default: {
|
|
4818
|
-
readonly type: "spring";
|
|
4819
|
-
readonly stiffness: 300;
|
|
4820
|
-
readonly damping: 30;
|
|
4821
|
-
readonly mass: 1;
|
|
4822
|
-
};
|
|
4823
|
-
readonly wobbly: {
|
|
4824
|
-
readonly type: "spring";
|
|
4825
|
-
readonly stiffness: 180;
|
|
4826
|
-
readonly damping: 12;
|
|
4827
|
-
readonly mass: 1;
|
|
4828
|
-
};
|
|
4829
|
-
readonly stiff: {
|
|
4830
|
-
readonly type: "spring";
|
|
4831
|
-
readonly stiffness: 400;
|
|
4832
|
-
readonly damping: 30;
|
|
4833
|
-
readonly mass: 1;
|
|
4834
|
-
};
|
|
4835
|
-
readonly slow: {
|
|
4836
|
-
readonly type: "spring";
|
|
4837
|
-
readonly stiffness: 200;
|
|
4838
|
-
readonly damping: 25;
|
|
4839
|
-
readonly mass: 1;
|
|
4840
|
-
};
|
|
4841
|
-
readonly bouncy: {
|
|
4842
|
-
readonly type: "spring";
|
|
4843
|
-
readonly stiffness: 400;
|
|
4844
|
-
readonly damping: 10;
|
|
4845
|
-
readonly mass: 1;
|
|
4846
|
-
};
|
|
4847
|
-
readonly noBounce: {
|
|
4848
|
-
readonly type: "spring";
|
|
4849
|
-
readonly stiffness: 300;
|
|
4850
|
-
readonly damping: 35;
|
|
4851
|
-
readonly mass: 1;
|
|
4439
|
+
readonly transitionProperty: {
|
|
4440
|
+
readonly DEFAULT: "color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter";
|
|
4441
|
+
readonly colors: "color, background-color, border-color, text-decoration-color, fill, stroke";
|
|
4442
|
+
readonly opacity: "opacity";
|
|
4443
|
+
readonly shadow: "box-shadow";
|
|
4444
|
+
readonly transform: "transform";
|
|
4445
|
+
readonly all: "all";
|
|
4446
|
+
readonly none: "none";
|
|
4852
4447
|
};
|
|
4448
|
+
readonly keyframes: Record<string, Record<string, Record<string, string | number>>>;
|
|
4853
4449
|
};
|
|
4854
4450
|
/**
|
|
4855
4451
|
* Reduced Motion Support
|
|
4856
4452
|
* Respects prefers-reduced-motion media query
|
|
4857
4453
|
*/
|
|
4858
|
-
declare const
|
|
4454
|
+
declare const motionReducedMotion: {
|
|
4455
|
+
/** Reduced motion duration (instant, no animation) */
|
|
4859
4456
|
readonly duration: "0ms";
|
|
4457
|
+
/** Reduced motion easing (linear for instant) */
|
|
4860
4458
|
readonly easing: "linear";
|
|
4459
|
+
/** Reduced motion transition (instant) */
|
|
4861
4460
|
readonly transition: "0ms linear";
|
|
4461
|
+
/** CSS media query for reduced motion */
|
|
4862
4462
|
readonly mediaQuery: "@media (prefers-reduced-motion: reduce)";
|
|
4863
|
-
readonly disableAnimations: "animation: none !important; transition: none !important;";
|
|
4864
|
-
readonly spring: {
|
|
4865
|
-
readonly type: "spring";
|
|
4866
|
-
readonly stiffness: 1000;
|
|
4867
|
-
readonly damping: 100;
|
|
4868
|
-
readonly mass: 1;
|
|
4869
|
-
};
|
|
4870
|
-
};
|
|
4871
|
-
/**
|
|
4872
|
-
* CSS Custom Properties for Motion
|
|
4873
|
-
* These will be injected into the theme system
|
|
4874
|
-
*/
|
|
4875
|
-
declare const motionCSSVariables: {
|
|
4876
|
-
readonly "--duration-instant": "0ms";
|
|
4877
|
-
readonly "--duration-fast": "150ms";
|
|
4878
|
-
readonly "--duration-normal": "300ms";
|
|
4879
|
-
readonly "--duration-slow": "500ms";
|
|
4880
|
-
readonly "--duration-slower": "700ms";
|
|
4881
|
-
readonly "--duration-slowest": "1000ms";
|
|
4882
|
-
readonly "--duration-75": "75ms";
|
|
4883
|
-
readonly "--duration-100": "100ms";
|
|
4884
|
-
readonly "--duration-200": "200ms";
|
|
4885
|
-
readonly "--duration-250": "250ms";
|
|
4886
|
-
readonly "--duration-400": "400ms";
|
|
4887
|
-
readonly "--duration-600": "600ms";
|
|
4888
|
-
readonly "--duration-800": "800ms";
|
|
4889
|
-
readonly "--ease-linear": "linear";
|
|
4890
|
-
readonly "--ease-in": "cubic-bezier(0.4, 0, 1, 1)";
|
|
4891
|
-
readonly "--ease-out": "cubic-bezier(0, 0, 0.2, 1)";
|
|
4892
|
-
readonly "--ease-in-out": "cubic-bezier(0.4, 0, 0.2, 1)";
|
|
4893
|
-
readonly "--ease-bounce": "cubic-bezier(0.68, -0.55, 0.265, 1.55)";
|
|
4894
|
-
readonly "--ease-elastic": "cubic-bezier(0.175, 0.885, 0.32, 1.275)";
|
|
4895
|
-
readonly "--ease-out-cubic": "cubic-bezier(0.215, 0.61, 0.355, 1)";
|
|
4896
|
-
readonly "--ease-in-cubic": "cubic-bezier(0.55, 0.055, 0.675, 0.19)";
|
|
4897
|
-
readonly "--ease-in-out-cubic": "cubic-bezier(0.645, 0.045, 0.355, 1)";
|
|
4898
|
-
readonly "--transition-fast": "150ms cubic-bezier(0, 0, 0.2, 1)";
|
|
4899
|
-
readonly "--transition-normal": "300ms cubic-bezier(0.4, 0, 0.2, 1)";
|
|
4900
|
-
readonly "--transition-slow": "500ms cubic-bezier(0.4, 0, 0.2, 1)";
|
|
4901
|
-
readonly "--transition-default": "300ms cubic-bezier(0.4, 0, 0.2, 1)";
|
|
4902
|
-
readonly "--transition-fast-in": "150ms cubic-bezier(0.4, 0, 1, 1)";
|
|
4903
|
-
readonly "--transition-fast-out": "150ms cubic-bezier(0, 0, 0.2, 1)";
|
|
4904
|
-
readonly "--transition-fast-in-out": "150ms cubic-bezier(0.4, 0, 0.2, 1)";
|
|
4905
|
-
readonly "--transition-normal-in": "300ms cubic-bezier(0.4, 0, 1, 1)";
|
|
4906
|
-
readonly "--transition-normal-out": "300ms cubic-bezier(0, 0, 0.2, 1)";
|
|
4907
|
-
readonly "--transition-normal-in-out": "300ms cubic-bezier(0.4, 0, 0.2, 1)";
|
|
4908
|
-
readonly "--transition-slow-in": "500ms cubic-bezier(0.4, 0, 1, 1)";
|
|
4909
|
-
readonly "--transition-slow-out": "500ms cubic-bezier(0, 0, 0.2, 1)";
|
|
4910
|
-
readonly "--transition-slow-in-out": "500ms cubic-bezier(0.4, 0, 0.2, 1)";
|
|
4911
|
-
readonly "--transition-bounce": "300ms cubic-bezier(0.68, -0.55, 0.265, 1.55)";
|
|
4912
|
-
readonly "--transition-elastic": "500ms cubic-bezier(0.175, 0.885, 0.32, 1.275)";
|
|
4913
|
-
};
|
|
4914
|
-
/**
|
|
4915
|
-
* Tailwind Motion Config
|
|
4916
|
-
* Maps to Tailwind theme.extend for durations, transitions, keyframes, animations
|
|
4917
|
-
*/
|
|
4918
|
-
declare const tailwindMotionConfig: {
|
|
4919
|
-
readonly transitionDuration: {
|
|
4920
|
-
readonly instant: "0ms";
|
|
4921
|
-
readonly fast: "150ms";
|
|
4922
|
-
readonly normal: "300ms";
|
|
4923
|
-
readonly slow: "500ms";
|
|
4924
|
-
readonly slower: "700ms";
|
|
4925
|
-
readonly slowest: "1000ms";
|
|
4926
|
-
readonly "75": "75ms";
|
|
4927
|
-
readonly "100": "100ms";
|
|
4928
|
-
readonly "200": "200ms";
|
|
4929
|
-
readonly "250": "250ms";
|
|
4930
|
-
readonly "400": "400ms";
|
|
4931
|
-
readonly "600": "600ms";
|
|
4932
|
-
readonly "800": "800ms";
|
|
4933
|
-
};
|
|
4934
|
-
readonly transitionTimingFunction: {
|
|
4935
|
-
readonly linear: "linear";
|
|
4936
|
-
readonly "ease-in": "cubic-bezier(0.4, 0, 1, 1)";
|
|
4937
|
-
readonly "ease-out": "cubic-bezier(0, 0, 0.2, 1)";
|
|
4938
|
-
readonly "ease-in-out": "cubic-bezier(0.4, 0, 0.2, 1)";
|
|
4939
|
-
readonly ease: "ease";
|
|
4940
|
-
readonly bounce: "cubic-bezier(0.68, -0.55, 0.265, 1.55)";
|
|
4941
|
-
readonly elastic: "cubic-bezier(0.175, 0.885, 0.32, 1.275)";
|
|
4942
|
-
readonly "ease-out-cubic": "cubic-bezier(0.215, 0.61, 0.355, 1)";
|
|
4943
|
-
readonly "ease-in-cubic": "cubic-bezier(0.55, 0.055, 0.675, 0.19)";
|
|
4944
|
-
readonly "ease-in-out-cubic": "cubic-bezier(0.645, 0.045, 0.355, 1)";
|
|
4945
|
-
};
|
|
4946
|
-
readonly transitionProperty: {
|
|
4947
|
-
readonly DEFAULT: "color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter";
|
|
4948
|
-
readonly colors: "color, background-color, border-color, text-decoration-color, fill, stroke";
|
|
4949
|
-
readonly opacity: "opacity";
|
|
4950
|
-
readonly shadow: "box-shadow";
|
|
4951
|
-
readonly transform: "transform";
|
|
4952
|
-
readonly all: "all";
|
|
4953
|
-
readonly none: "none";
|
|
4954
|
-
};
|
|
4955
|
-
readonly keyframes: {
|
|
4956
|
-
readonly fadeIn: {
|
|
4957
|
-
readonly from: {
|
|
4958
|
-
readonly opacity: "0";
|
|
4959
|
-
};
|
|
4960
|
-
readonly to: {
|
|
4961
|
-
readonly opacity: "1";
|
|
4962
|
-
};
|
|
4963
|
-
};
|
|
4964
|
-
readonly fadeOut: {
|
|
4965
|
-
readonly from: {
|
|
4966
|
-
readonly opacity: "1";
|
|
4967
|
-
};
|
|
4968
|
-
readonly to: {
|
|
4969
|
-
readonly opacity: "0";
|
|
4970
|
-
};
|
|
4971
|
-
};
|
|
4972
|
-
readonly slideInUp: {
|
|
4973
|
-
readonly from: {
|
|
4974
|
-
readonly transform: "translateY(100%)";
|
|
4975
|
-
readonly opacity: "0";
|
|
4976
|
-
};
|
|
4977
|
-
readonly to: {
|
|
4978
|
-
readonly transform: "translateY(0)";
|
|
4979
|
-
readonly opacity: "1";
|
|
4980
|
-
};
|
|
4981
|
-
};
|
|
4982
|
-
readonly slideInDown: {
|
|
4983
|
-
readonly from: {
|
|
4984
|
-
readonly transform: "translateY(-100%)";
|
|
4985
|
-
readonly opacity: "0";
|
|
4986
|
-
};
|
|
4987
|
-
readonly to: {
|
|
4988
|
-
readonly transform: "translateY(0)";
|
|
4989
|
-
readonly opacity: "1";
|
|
4990
|
-
};
|
|
4991
|
-
};
|
|
4992
|
-
readonly slideInLeft: {
|
|
4993
|
-
readonly from: {
|
|
4994
|
-
readonly transform: "translateX(-100%)";
|
|
4995
|
-
readonly opacity: "0";
|
|
4996
|
-
};
|
|
4997
|
-
readonly to: {
|
|
4998
|
-
readonly transform: "translateX(0)";
|
|
4999
|
-
readonly opacity: "1";
|
|
5000
|
-
};
|
|
5001
|
-
};
|
|
5002
|
-
readonly slideInRight: {
|
|
5003
|
-
readonly from: {
|
|
5004
|
-
readonly transform: "translateX(100%)";
|
|
5005
|
-
readonly opacity: "0";
|
|
5006
|
-
};
|
|
5007
|
-
readonly to: {
|
|
5008
|
-
readonly transform: "translateX(0)";
|
|
5009
|
-
readonly opacity: "1";
|
|
5010
|
-
};
|
|
5011
|
-
};
|
|
5012
|
-
readonly slideOutUp: {
|
|
5013
|
-
readonly from: {
|
|
5014
|
-
readonly transform: "translateY(0)";
|
|
5015
|
-
readonly opacity: "1";
|
|
5016
|
-
};
|
|
5017
|
-
readonly to: {
|
|
5018
|
-
readonly transform: "translateY(-100%)";
|
|
5019
|
-
readonly opacity: "0";
|
|
5020
|
-
};
|
|
5021
|
-
};
|
|
5022
|
-
readonly slideOutDown: {
|
|
5023
|
-
readonly from: {
|
|
5024
|
-
readonly transform: "translateY(0)";
|
|
5025
|
-
readonly opacity: "1";
|
|
5026
|
-
};
|
|
5027
|
-
readonly to: {
|
|
5028
|
-
readonly transform: "translateY(100%)";
|
|
5029
|
-
readonly opacity: "0";
|
|
5030
|
-
};
|
|
5031
|
-
};
|
|
5032
|
-
readonly slideOutLeft: {
|
|
5033
|
-
readonly from: {
|
|
5034
|
-
readonly transform: "translateX(0)";
|
|
5035
|
-
readonly opacity: "1";
|
|
5036
|
-
};
|
|
5037
|
-
readonly to: {
|
|
5038
|
-
readonly transform: "translateX(-100%)";
|
|
5039
|
-
readonly opacity: "0";
|
|
5040
|
-
};
|
|
5041
|
-
};
|
|
5042
|
-
readonly slideOutRight: {
|
|
5043
|
-
readonly from: {
|
|
5044
|
-
readonly transform: "translateX(0)";
|
|
5045
|
-
readonly opacity: "1";
|
|
5046
|
-
};
|
|
5047
|
-
readonly to: {
|
|
5048
|
-
readonly transform: "translateX(100%)";
|
|
5049
|
-
readonly opacity: "0";
|
|
5050
|
-
};
|
|
5051
|
-
};
|
|
5052
|
-
readonly scaleIn: {
|
|
5053
|
-
readonly from: {
|
|
5054
|
-
readonly transform: "scale(0.95)";
|
|
5055
|
-
readonly opacity: "0";
|
|
5056
|
-
};
|
|
5057
|
-
readonly to: {
|
|
5058
|
-
readonly transform: "scale(1)";
|
|
5059
|
-
readonly opacity: "1";
|
|
5060
|
-
};
|
|
5061
|
-
};
|
|
5062
|
-
readonly scaleOut: {
|
|
5063
|
-
readonly from: {
|
|
5064
|
-
readonly transform: "scale(1)";
|
|
5065
|
-
readonly opacity: "1";
|
|
5066
|
-
};
|
|
5067
|
-
readonly to: {
|
|
5068
|
-
readonly transform: "scale(0.95)";
|
|
5069
|
-
readonly opacity: "0";
|
|
5070
|
-
};
|
|
5071
|
-
};
|
|
5072
|
-
readonly scaleUp: {
|
|
5073
|
-
readonly from: {
|
|
5074
|
-
readonly transform: "scale(1)";
|
|
5075
|
-
};
|
|
5076
|
-
readonly to: {
|
|
5077
|
-
readonly transform: "scale(1.05)";
|
|
5078
|
-
};
|
|
5079
|
-
};
|
|
5080
|
-
readonly scaleDown: {
|
|
5081
|
-
readonly from: {
|
|
5082
|
-
readonly transform: "scale(1.05)";
|
|
5083
|
-
};
|
|
5084
|
-
readonly to: {
|
|
5085
|
-
readonly transform: "scale(1)";
|
|
5086
|
-
};
|
|
5087
|
-
};
|
|
5088
|
-
readonly spin: {
|
|
5089
|
-
readonly from: {
|
|
5090
|
-
readonly transform: "rotate(0deg)";
|
|
5091
|
-
};
|
|
5092
|
-
readonly to: {
|
|
5093
|
-
readonly transform: "rotate(360deg)";
|
|
5094
|
-
};
|
|
5095
|
-
};
|
|
5096
|
-
readonly spinReverse: {
|
|
5097
|
-
readonly from: {
|
|
5098
|
-
readonly transform: "rotate(360deg)";
|
|
5099
|
-
};
|
|
5100
|
-
readonly to: {
|
|
5101
|
-
readonly transform: "rotate(0deg)";
|
|
5102
|
-
};
|
|
5103
|
-
};
|
|
5104
|
-
readonly pulse: {
|
|
5105
|
-
readonly "0%, 100%": {
|
|
5106
|
-
readonly opacity: "1";
|
|
5107
|
-
};
|
|
5108
|
-
readonly "50%": {
|
|
5109
|
-
readonly opacity: "0.5";
|
|
5110
|
-
};
|
|
5111
|
-
};
|
|
5112
|
-
readonly bounce: {
|
|
5113
|
-
readonly "0%, 100%": {
|
|
5114
|
-
readonly transform: "translateY(-25%)";
|
|
5115
|
-
readonly animationTimingFunction: "cubic-bezier(0.8, 0, 1, 1)";
|
|
5116
|
-
};
|
|
5117
|
-
readonly "50%": {
|
|
5118
|
-
readonly transform: "translateY(0)";
|
|
5119
|
-
readonly animationTimingFunction: "cubic-bezier(0, 0, 0.2, 1)";
|
|
5120
|
-
};
|
|
5121
|
-
};
|
|
5122
|
-
readonly shake: {
|
|
5123
|
-
readonly "0%, 100%": {
|
|
5124
|
-
readonly transform: "translateX(0)";
|
|
5125
|
-
};
|
|
5126
|
-
readonly "10%, 30%, 50%, 70%, 90%": {
|
|
5127
|
-
readonly transform: "translateX(-4px)";
|
|
5128
|
-
};
|
|
5129
|
-
readonly "20%, 40%, 60%, 80%": {
|
|
5130
|
-
readonly transform: "translateX(4px)";
|
|
5131
|
-
};
|
|
5132
|
-
};
|
|
5133
|
-
readonly ping: {
|
|
5134
|
-
readonly "75%, 100%": {
|
|
5135
|
-
readonly transform: "scale(2)";
|
|
5136
|
-
readonly opacity: "0";
|
|
5137
|
-
};
|
|
5138
|
-
};
|
|
5139
|
-
readonly "accordion-down": {
|
|
5140
|
-
readonly from: {
|
|
5141
|
-
readonly height: "0";
|
|
5142
|
-
};
|
|
5143
|
-
readonly to: {
|
|
5144
|
-
readonly height: "var(--radix-accordion-content-height)";
|
|
5145
|
-
};
|
|
5146
|
-
};
|
|
5147
|
-
readonly "accordion-up": {
|
|
5148
|
-
readonly from: {
|
|
5149
|
-
readonly height: "var(--radix-accordion-content-height)";
|
|
5150
|
-
};
|
|
5151
|
-
readonly to: {
|
|
5152
|
-
readonly height: "0";
|
|
5153
|
-
};
|
|
5154
|
-
};
|
|
5155
|
-
};
|
|
5156
|
-
readonly animation: {
|
|
5157
|
-
readonly none: "none";
|
|
5158
|
-
readonly spin: "spin 1s linear infinite";
|
|
5159
|
-
readonly pulse: "pulse 2s cubic-bezier(0.4, 0, 0.2, 1) infinite";
|
|
5160
|
-
readonly bounce: "bounce 1s linear infinite";
|
|
5161
|
-
readonly ping: "ping 1s cubic-bezier(0, 0, 0.2, 1) cubic-bezier(0, 0, 0.2, 1) infinite";
|
|
5162
|
-
readonly shake: "shake 0.5s cubic-bezier(0.4, 0, 0.2, 1)";
|
|
5163
|
-
readonly fadeIn: "fadeIn 300ms cubic-bezier(0, 0, 0.2, 1)";
|
|
5164
|
-
readonly fadeOut: "fadeOut 150ms cubic-bezier(0.4, 0, 1, 1)";
|
|
5165
|
-
readonly slideInUp: "slideInUp 300ms cubic-bezier(0, 0, 0.2, 1)";
|
|
5166
|
-
readonly slideInDown: "slideInDown 300ms cubic-bezier(0, 0, 0.2, 1)";
|
|
5167
|
-
readonly slideInLeft: "slideInLeft 300ms cubic-bezier(0, 0, 0.2, 1)";
|
|
5168
|
-
readonly slideInRight: "slideInRight 300ms cubic-bezier(0, 0, 0.2, 1)";
|
|
5169
|
-
readonly slideOutUp: "slideOutUp 150ms cubic-bezier(0.4, 0, 1, 1)";
|
|
5170
|
-
readonly slideOutDown: "slideOutDown 150ms cubic-bezier(0.4, 0, 1, 1)";
|
|
5171
|
-
readonly slideOutLeft: "slideOutLeft 150ms cubic-bezier(0.4, 0, 1, 1)";
|
|
5172
|
-
readonly slideOutRight: "slideOutRight 150ms cubic-bezier(0.4, 0, 1, 1)";
|
|
5173
|
-
readonly scaleIn: "scaleIn 300ms cubic-bezier(0, 0, 0.2, 1)";
|
|
5174
|
-
readonly scaleOut: "scaleOut 150ms cubic-bezier(0.4, 0, 1, 1)";
|
|
5175
|
-
readonly "accordion-down": "accordion-down 300ms cubic-bezier(0, 0, 0.2, 1)";
|
|
5176
|
-
readonly "accordion-up": "accordion-up 300ms cubic-bezier(0, 0, 0.2, 1)";
|
|
5177
|
-
};
|
|
5178
4463
|
};
|
|
5179
4464
|
/**
|
|
5180
4465
|
* Type Exports
|
|
5181
4466
|
*/
|
|
5182
|
-
type
|
|
5183
|
-
type
|
|
5184
|
-
type
|
|
5185
|
-
type
|
|
5186
|
-
type
|
|
5187
|
-
type Spring = keyof typeof springs;
|
|
4467
|
+
type MotionDuration = keyof typeof motionDurations;
|
|
4468
|
+
type MotionEasing = keyof typeof motionEasings;
|
|
4469
|
+
type MotionTransition = keyof typeof motionTransitions;
|
|
4470
|
+
type MotionSlideDirection = keyof typeof motionSlide;
|
|
4471
|
+
type MotionCombinedType = keyof typeof motionCombined;
|
|
5188
4472
|
|
|
5189
4473
|
/**
|
|
5190
4474
|
* Border Radius System Tokens
|
|
@@ -6493,6 +5777,11 @@ declare const CONTEXT_MENU_TOKENS: {
|
|
|
6493
5777
|
readonly outline: "bg-[hsl(var(--popover))] border-2 border-[hsl(var(--border))]";
|
|
6494
5778
|
readonly subtle: "bg-[hsl(var(--muted))]";
|
|
6495
5779
|
};
|
|
5780
|
+
/**
|
|
5781
|
+
* Animation offset for slide-in animations
|
|
5782
|
+
* Small 2px offset provides subtle visual feedback when menus slide in
|
|
5783
|
+
*/
|
|
5784
|
+
readonly animationOffset: "[2px]";
|
|
6496
5785
|
};
|
|
6497
5786
|
/**
|
|
6498
5787
|
* ContextMenu item tokens
|
|
@@ -6628,16 +5917,19 @@ type TextLineHeightToken = keyof typeof lineHeight;
|
|
|
6628
5917
|
type TextLetterSpacingToken = "tighter" | "tight" | "normal" | "wide" | "wider" | "widest";
|
|
6629
5918
|
/**
|
|
6630
5919
|
* Motion duration token keys
|
|
5920
|
+
* Available: fast, normal, slow, reduced
|
|
6631
5921
|
*/
|
|
6632
|
-
type MotionDurationToken = keyof typeof
|
|
5922
|
+
type MotionDurationToken = keyof typeof motionDurations;
|
|
6633
5923
|
/**
|
|
6634
5924
|
* Motion easing token keys
|
|
5925
|
+
* Available: soft, standard, emphasized
|
|
6635
5926
|
*/
|
|
6636
|
-
type MotionEasingToken = keyof typeof
|
|
5927
|
+
type MotionEasingToken = keyof typeof motionEasings;
|
|
6637
5928
|
/**
|
|
6638
5929
|
* Motion transition token keys
|
|
5930
|
+
* Available: fast, normal, slow, soft, reduced
|
|
6639
5931
|
*/
|
|
6640
|
-
type MotionTransitionToken = keyof typeof
|
|
5932
|
+
type MotionTransitionToken = keyof typeof motionTransitions;
|
|
6641
5933
|
/**
|
|
6642
5934
|
* Combined motion token (duration, easing, or transition)
|
|
6643
5935
|
*/
|
|
@@ -6838,4 +6130,4 @@ type ResponsiveContextMenuSize = Responsive<ContextMenuSizeToken>;
|
|
|
6838
6130
|
*/
|
|
6839
6131
|
type ResponsiveContextMenuWidth = Responsive<ContextMenuWidthToken>;
|
|
6840
6132
|
|
|
6841
|
-
export { type MenuItemGap as $, ALERT_TOKENS as A, BUTTON_TOKENS as B, CARD_TOKENS as C, DATA_TOKENS as D, type EmptyStateIconSize as E, type IconSize as F, type IconStroke as G, type InputFontSize as H, ICON_TOKENS as I, type InputHeight as J, type InputPaddingHorizontal as K, type InputPaddingVertical as L, MENU_TOKENS as M, NAVIGATION_TOKENS as N, OVERLAY_TOKENS as O, POPOVER_TOKENS as P, type InputRadius as Q, RADIO_TOKENS as R, SECTION_TOKENS as S, TEXT_TOKENS as T, type InputSize as U, type MenuContentMinWidth as V, type MenuContentPadding as W, type MenuContentRadius as X, type MenuContentShadow as Y, type MenuIndicatorOffset as Z, type MenuIndicatorSize as _, CHECKBOX_TOKENS as a, type TextFontWeight as a$, type MenuItemHeight as a0, type MenuItemPadding as a1, type MenuItemRadius as a2, type MenuLabelPadding as a3, type MenuSeparatorMargin as a4, type MotionAnimation as a5, type MotionDuration as a6, type MotionEasing as a7, type MotionTransition as a8, type MotionTransitionPreset as a9, type SelectItemRadius as aA, type SelectLabelFontSize as aB, type SelectLabelPaddingHorizontal as aC, type SelectLabelPaddingVertical as aD, type SelectSeparatorMarginHorizontal as aE, type SelectSeparatorMarginVertical as aF, type SelectTriggerFontSize as aG, type SelectTriggerHeight as aH, type SelectTriggerPaddingHorizontal as aI, type SelectTriggerPaddingVertical as aJ, type SelectTriggerRadius as aK, type SkeletonAnimation as aL, type SkeletonBackground as aM, type SkeletonVariant as aN, type SurfacePadding as aO, type SurfaceRadius as aP, type SurfaceShadow as aQ, type SurfaceVariant as aR, type SwitchSize as aS, type SwitchState as aT, type SwitchVariant as aU, type TableCellPadding as aV, type TableGap as aW, type TableHeaderPadding as aX, type TableRowHeight as aY, type TableShadow as aZ, type TextFontSize as a_, type NavigationItemPadding as aa, type NavigationListGap as ab, type NavigationRadius as ac, type NavigationShadow as ad, type NavigationSize as ae, type NavigationState as af, type NotificationPanelWidth as ag, type NotificationVariant as ah, type OverlayBackdropVariant as ai, type OverlayModalSize as aj, type PopoverArrowOffset as ak, type PopoverArrowSize as al, type PopoverContentPadding as am, type PopoverContentRadius as an, type PopoverContentShadow as ao, type PopoverContentWidth as ap, type RadioSize as aq, type RadioState as ar, type RadioVariant as as, type SectionGap as at, type SectionPadding as au, type SelectContentPadding as av, type SelectContentRadius as aw, type SelectItemFontSize as ax, type SelectItemPaddingHorizontal as ay, type SelectItemPaddingVertical as az,
|
|
6133
|
+
export { type MenuItemGap as $, ALERT_TOKENS as A, BUTTON_TOKENS as B, CARD_TOKENS as C, DATA_TOKENS as D, type EmptyStateIconSize as E, type IconSize as F, type IconStroke as G, type InputFontSize as H, ICON_TOKENS as I, type InputHeight as J, type InputPaddingHorizontal as K, type InputPaddingVertical as L, MENU_TOKENS as M, NAVIGATION_TOKENS as N, OVERLAY_TOKENS as O, POPOVER_TOKENS as P, type InputRadius as Q, RADIO_TOKENS as R, SECTION_TOKENS as S, TEXT_TOKENS as T, type InputSize as U, type MenuContentMinWidth as V, type MenuContentPadding as W, type MenuContentRadius as X, type MenuContentShadow as Y, type MenuIndicatorOffset as Z, type MenuIndicatorSize as _, CHECKBOX_TOKENS as a, type TextFontWeight as a$, type MenuItemHeight as a0, type MenuItemPadding as a1, type MenuItemRadius as a2, type MenuLabelPadding as a3, type MenuSeparatorMargin as a4, type MotionAnimation as a5, type MotionDuration$1 as a6, type MotionEasing$1 as a7, type MotionTransition$1 as a8, type MotionTransitionPreset as a9, type SelectItemRadius as aA, type SelectLabelFontSize as aB, type SelectLabelPaddingHorizontal as aC, type SelectLabelPaddingVertical as aD, type SelectSeparatorMarginHorizontal as aE, type SelectSeparatorMarginVertical as aF, type SelectTriggerFontSize as aG, type SelectTriggerHeight as aH, type SelectTriggerPaddingHorizontal as aI, type SelectTriggerPaddingVertical as aJ, type SelectTriggerRadius as aK, type SkeletonAnimation as aL, type SkeletonBackground as aM, type SkeletonVariant as aN, type SurfacePadding as aO, type SurfaceRadius as aP, type SurfaceShadow as aQ, type SurfaceVariant as aR, type SwitchSize as aS, type SwitchState as aT, type SwitchVariant as aU, type TableCellPadding as aV, type TableGap as aW, type TableHeaderPadding as aX, type TableRowHeight as aY, type TableShadow as aZ, type TextFontSize as a_, type NavigationItemPadding as aa, type NavigationListGap as ab, type NavigationRadius as ac, type NavigationShadow as ad, type NavigationSize as ae, type NavigationState as af, type NotificationPanelWidth as ag, type NotificationVariant as ah, type OverlayBackdropVariant as ai, type OverlayModalSize as aj, type PopoverArrowOffset as ak, type PopoverArrowSize as al, type PopoverContentPadding as am, type PopoverContentRadius as an, type PopoverContentShadow as ao, type PopoverContentWidth as ap, type RadioSize as aq, type RadioState as ar, type RadioVariant as as, type SectionGap as at, type SectionPadding as au, type SelectContentPadding as av, type SelectContentRadius as aw, type SelectItemFontSize as ax, type SelectItemPaddingHorizontal as ay, type SelectItemPaddingVertical as az, DATA_LIST_TOKENS as b, type FontFamily as b$, type TextLetterSpacing as b0, type TextLineHeight as b1, type ToastVariant as b2, type TooltipContentRadius as b3, type TooltipContentShadow as b4, allCSSVariables as b5, allCSSVariablesCSS as b6, generateCSSVariablesCSS as b7, tokenSystemSummary as b8, type MotionCombinedType as b9, componentShadowMapping as bA, elevationShadows as bB, focusRings as bC, glowEffects as bD, primaryColoredShadows as bE, shadowBase as bF, shadowCSSVariables as bG, shadowOpacity as bH, tailwindShadowConfig as bI, type ComponentSpacing as bJ, type ContainerSpacing as bK, type GridSpacing as bL, type SectionSpacing as bM, type SemanticSpacing as bN, type Spacing as bO, type StackSpacing as bP, layoutSpacing as bQ, semanticSpacing as bR, spacing as bS, spacingCSSVariables as bT, tailwindSpacingConfig as bU, UI_COLORS as bV, type CanonicalFontSize as bW, type CanonicalFontWeight as bX, type CanonicalLetterSpacing as bY, type CanonicalLineHeight as bZ, type CanonicalTextColor as b_, type MotionDuration as ba, type MotionEasing as bb, type MotionSlideDirection as bc, type MotionTransition as bd, motionCSSVariables as be, motionCombined as bf, motionDurations as bg, motionEasings as bh, motionFade as bi, motionReducedMotion as bj, motionScale as bk, motionSlide as bl, motionTailwindConfig as bm, motionTransitionProperty as bn, motionTransitions as bo, type BorderRadius as bp, type ComponentRadius as bq, borderRadius as br, componentRadius as bs, radiusCSSVariables as bt, tailwindRadiusConfig as bu, type ColoredShadow as bv, type ElevationShadow as bw, type FocusRing as bx, type GlowEffect as by, accentColoredShadows as bz, INPUT_TOKENS as c, type TextLetterSpacingToken as c$, type FontSize as c0, type FontWeight as c1, type LetterSpacing as c2, type LineHeight as c3, type TextStyle as c4, fontFamily as c5, fontSize as c6, fontSizeWithMd as c7, fontWeight as c8, letterSpacing as c9, type ResponsiveContainerMaxWidth as cA, type ResponsiveContainerPadding as cB, type ResponsiveDelay as cC, type ResponsiveFlexBasis as cD, type ResponsiveModalHeight as cE, type ResponsiveModalSize as cF, type ResponsiveModalWidth as cG, type ResponsiveMotion as cH, type ResponsiveRadius as cI, type ResponsiveSelectSize as cJ, type ResponsiveSelectWidth as cK, type ResponsiveShadow as cL, type ResponsiveSideOffset as cM, type ResponsiveSpace as cN, type ResponsiveSurface as cO, type ResponsiveTextLineHeight as cP, type ResponsiveTextSize as cQ, type ResponsiveTextWeight as cR, type SelectSizeToken as cS, type SelectStateToken as cT, type SelectVariantToken as cU, type SelectWidthToken as cV, type ShadowToken as cW, type SideOffsetToken as cX, type SpaceToken as cY, type SpacingToken as cZ, type SurfaceToken as c_, lineHeight as ca, tailwindTypographyConfig as cb, textStyles as cc, typographyCSSVariables as cd, type AlignOffsetToken as ce, type AnimationPresetToken as cf, type AspectRatioToken as cg, type ColorToken as ch, type ContainerMaxWidthToken as ci, type ContainerPaddingToken as cj, type DelayToken as ck, type FlexBasisToken as cl, type LayoutSpaceToken as cm, type ModalFooterAlignToken as cn, type ModalHeightToken as co, type ModalSizeToken as cp, type ModalWidthToken as cq, type MotionDurationToken as cr, type MotionEasingToken as cs, type MotionToken as ct, type MotionTransitionToken as cu, type RadiusToken as cv, type ResponsiveAlignOffset as cw, type ResponsiveAnimationPreset as cx, type ResponsiveAspectRatio as cy, type ResponsiveColor as cz, MOTION_TOKENS as d, type TextLineHeightToken as d0, type TextSizeToken as d1, type TextWeightToken as d2, type Responsive as d3, type ResponsiveContextMenuSize as d4, type ResponsiveContextMenuWidth as d5, type ContextMenuItemToneToken as d6, type ResponsiveTabsSize as d7, type TabsVariantToken as d8, type TabsToneToken as d9, type Breakpoint as da, NOTIFICATION_TOKENS as e, SELECT_TOKENS as f, SURFACE_TOKENS as g, SWITCH_TOKENS as h, TOAST_TOKENS as i, TOOLTIP_TOKENS as j, type ButtonFontSize as k, type ButtonHeight as l, type ButtonPaddingHorizontal as m, type ButtonPaddingVertical as n, type ButtonShadow as o, type CardPadding as p, type CardRadius as q, type CardShadow as r, type CardSize as s, type CardSpacingVertical as t, type CheckboxSize as u, type CheckboxState as v, type CheckboxVariant as w, type DataListLabelWidth as x, type DataListRowPadding as y, type IconColor as z };
|