@tantuui/tokens 0.0.1-rc1
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/dist/base.css +94 -0
- package/dist/index.d.mts +1306 -0
- package/dist/index.d.ts +1306 -0
- package/dist/index.js +778 -0
- package/dist/index.js.map +1 -0
- package/dist/index.mjs +754 -0
- package/dist/index.mjs.map +1 -0
- package/dist/runtime.d.mts +46 -0
- package/dist/runtime.d.ts +46 -0
- package/dist/runtime.js +119 -0
- package/dist/runtime.js.map +1 -0
- package/dist/runtime.mjs +115 -0
- package/dist/runtime.mjs.map +1 -0
- package/dist/tailwind-preset.js +588 -0
- package/dist/tokens.css +771 -0
- package/dist/utilities.css +2474 -0
- package/package.json +35 -0
package/dist/index.d.mts
ADDED
|
@@ -0,0 +1,1306 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Color tokens
|
|
3
|
+
* CSS custom property prefix: --tui-color-*
|
|
4
|
+
*
|
|
5
|
+
* Brand colors use naming: brand-<colorname>-<scale|default>
|
|
6
|
+
* Scale: 50, 100, 200, 300, 400, 500, 600, 700, 800, 900, 950
|
|
7
|
+
* Default = the base color from the brand palette
|
|
8
|
+
*/
|
|
9
|
+
declare const color: {
|
|
10
|
+
readonly primitive: {
|
|
11
|
+
readonly white: "#ffffff";
|
|
12
|
+
readonly black: "#000000";
|
|
13
|
+
readonly brandWhite50: "#ffffff";
|
|
14
|
+
readonly brandWhite100: "#fefefe";
|
|
15
|
+
readonly brandWhite200: "#fafafa";
|
|
16
|
+
readonly brandWhite300: "#f5f5f5";
|
|
17
|
+
readonly brandWhite400: "#ededed";
|
|
18
|
+
readonly brandWhite500: "#e0e0e0";
|
|
19
|
+
readonly brandWhite600: "#c2c2c2";
|
|
20
|
+
readonly brandWhite700: "#9e9e9e";
|
|
21
|
+
readonly brandWhite800: "#757575";
|
|
22
|
+
readonly brandWhite900: "#4a4a4a";
|
|
23
|
+
readonly brandWhite950: "#2b2b2b";
|
|
24
|
+
readonly brandWhiteDefault: "#ffffff";
|
|
25
|
+
readonly brandBlack50: "#f5f5f5";
|
|
26
|
+
readonly brandBlack100: "#e8e8e8";
|
|
27
|
+
readonly brandBlack200: "#d4d4d4";
|
|
28
|
+
readonly brandBlack300: "#b0b0b0";
|
|
29
|
+
readonly brandBlack400: "#8a8a8a";
|
|
30
|
+
readonly brandBlack500: "#616161";
|
|
31
|
+
readonly brandBlack600: "#4a4a4a";
|
|
32
|
+
readonly brandBlack700: "#363636";
|
|
33
|
+
readonly brandBlack800: "#242424";
|
|
34
|
+
readonly brandBlack900: "#141414";
|
|
35
|
+
readonly brandBlack950: "#000000";
|
|
36
|
+
readonly brandBlackDefault: "#000000";
|
|
37
|
+
readonly brandNavy50: "#f3f4f7";
|
|
38
|
+
readonly brandNavy100: "#e7e8ef";
|
|
39
|
+
readonly brandNavy200: "#cacfe2";
|
|
40
|
+
readonly brandNavy300: "#9da8d2";
|
|
41
|
+
readonly brandNavy400: "#6377c5";
|
|
42
|
+
readonly brandNavy500: "#354eb0";
|
|
43
|
+
readonly brandNavy600: "#2c4091";
|
|
44
|
+
readonly brandNavy700: "#223272";
|
|
45
|
+
readonly brandNavy800: "#1a2656";
|
|
46
|
+
readonly brandNavy900: "#121a3b";
|
|
47
|
+
readonly brandNavy950: "#0a0e1f";
|
|
48
|
+
readonly brandNavyDefault: "#2c4091";
|
|
49
|
+
readonly brandBlue50: "#eff4ff";
|
|
50
|
+
readonly brandBlue100: "#dbe6fe";
|
|
51
|
+
readonly brandBlue200: "#bfd3fe";
|
|
52
|
+
readonly brandBlue300: "#93b4fd";
|
|
53
|
+
readonly brandBlue400: "#6090fa";
|
|
54
|
+
readonly brandBlue500: "#3b6ef6";
|
|
55
|
+
readonly brandBlue600: "#2563eb";
|
|
56
|
+
readonly brandBlue700: "#1d50d8";
|
|
57
|
+
readonly brandBlue800: "#1e41af";
|
|
58
|
+
readonly brandBlue900: "#1e398a";
|
|
59
|
+
readonly brandBlue950: "#172554";
|
|
60
|
+
readonly brandBlueDefault: "#2563EB";
|
|
61
|
+
readonly brandPurple50: "#f5f3ff";
|
|
62
|
+
readonly brandPurple100: "#ede8ff";
|
|
63
|
+
readonly brandPurple200: "#ddd6fe";
|
|
64
|
+
readonly brandPurple300: "#c4b5fc";
|
|
65
|
+
readonly brandPurple400: "#a78bfa";
|
|
66
|
+
readonly brandPurple500: "#8b5cf6";
|
|
67
|
+
readonly brandPurple600: "#7c3aed";
|
|
68
|
+
readonly brandPurple700: "#6d28d9";
|
|
69
|
+
readonly brandPurple800: "#5b21b6";
|
|
70
|
+
readonly brandPurple900: "#4c1d95";
|
|
71
|
+
readonly brandPurple950: "#2e1065";
|
|
72
|
+
readonly brandPurpleDefault: "#7C3AED";
|
|
73
|
+
readonly brandPink50: "#fdf4ff";
|
|
74
|
+
readonly brandPink100: "#fae8ff";
|
|
75
|
+
readonly brandPink200: "#f5d0fe";
|
|
76
|
+
readonly brandPink300: "#f0abfc";
|
|
77
|
+
readonly brandPink400: "#e879f9";
|
|
78
|
+
readonly brandPink500: "#d946ef";
|
|
79
|
+
readonly brandPink600: "#c026d3";
|
|
80
|
+
readonly brandPink700: "#a21caf";
|
|
81
|
+
readonly brandPink800: "#86198f";
|
|
82
|
+
readonly brandPink900: "#701a75";
|
|
83
|
+
readonly brandPink950: "#4a044e";
|
|
84
|
+
readonly brandPinkDefault: "#c026d3";
|
|
85
|
+
readonly brandGray50: "#f9fafb";
|
|
86
|
+
readonly brandGray100: "#f3f4f6";
|
|
87
|
+
readonly brandGray200: "#e5e7eb";
|
|
88
|
+
readonly brandGray300: "#d1d5db";
|
|
89
|
+
readonly brandGray400: "#9ca3af";
|
|
90
|
+
readonly brandGray500: "#6b7280";
|
|
91
|
+
readonly brandGray600: "#4b5563";
|
|
92
|
+
readonly brandGray700: "#374151";
|
|
93
|
+
readonly brandGray800: "#1f2937";
|
|
94
|
+
readonly brandGray900: "#111827";
|
|
95
|
+
readonly brandGray950: "#030712";
|
|
96
|
+
readonly brandGrayDefault: "#4B5563";
|
|
97
|
+
readonly brandLight50: "#fdfefe";
|
|
98
|
+
readonly brandLight100: "#f9fafb";
|
|
99
|
+
readonly brandLight200: "#f3f4f6";
|
|
100
|
+
readonly brandLight300: "#e5e7eb";
|
|
101
|
+
readonly brandLight400: "#d1d5db";
|
|
102
|
+
readonly brandLight500: "#9ca3af";
|
|
103
|
+
readonly brandLight600: "#6b7280";
|
|
104
|
+
readonly brandLight700: "#4b5563";
|
|
105
|
+
readonly brandLight800: "#374151";
|
|
106
|
+
readonly brandLight900: "#1f2937";
|
|
107
|
+
readonly brandLight950: "#111827";
|
|
108
|
+
readonly brandLightDefault: "#F3F4F6";
|
|
109
|
+
readonly success50: "#f0fdf4";
|
|
110
|
+
readonly success100: "#dcfce7";
|
|
111
|
+
readonly success200: "#bbf7d0";
|
|
112
|
+
readonly success300: "#86efac";
|
|
113
|
+
readonly success400: "#4ade80";
|
|
114
|
+
readonly success500: "#22c55e";
|
|
115
|
+
readonly success600: "#16a34a";
|
|
116
|
+
readonly success700: "#15803d";
|
|
117
|
+
readonly success800: "#166534";
|
|
118
|
+
readonly success900: "#14532d";
|
|
119
|
+
readonly success950: "#052e16";
|
|
120
|
+
readonly successDefault: "#16a34a";
|
|
121
|
+
readonly warning50: "#fffbeb";
|
|
122
|
+
readonly warning100: "#fef3c7";
|
|
123
|
+
readonly warning200: "#fde68a";
|
|
124
|
+
readonly warning300: "#fcd34d";
|
|
125
|
+
readonly warning400: "#fbbf24";
|
|
126
|
+
readonly warning500: "#f59e0b";
|
|
127
|
+
readonly warning600: "#d97706";
|
|
128
|
+
readonly warning700: "#b45309";
|
|
129
|
+
readonly warning800: "#92400e";
|
|
130
|
+
readonly warning900: "#78350f";
|
|
131
|
+
readonly warning950: "#451a03";
|
|
132
|
+
readonly warningDefault: "#d97706";
|
|
133
|
+
readonly danger50: "#fef2f2";
|
|
134
|
+
readonly danger100: "#fee2e2";
|
|
135
|
+
readonly danger200: "#fecaca";
|
|
136
|
+
readonly danger300: "#fca5a5";
|
|
137
|
+
readonly danger400: "#f87171";
|
|
138
|
+
readonly danger500: "#ef4444";
|
|
139
|
+
readonly danger600: "#dc2626";
|
|
140
|
+
readonly danger700: "#b91c1c";
|
|
141
|
+
readonly danger800: "#991b1b";
|
|
142
|
+
readonly danger900: "#7f1d1d";
|
|
143
|
+
readonly danger950: "#450a0a";
|
|
144
|
+
readonly dangerDefault: "#dc2626";
|
|
145
|
+
readonly info50: "#eff6ff";
|
|
146
|
+
readonly info100: "#dbeafe";
|
|
147
|
+
readonly info200: "#bfdbfe";
|
|
148
|
+
readonly info300: "#93c5fd";
|
|
149
|
+
readonly info400: "#60a5fa";
|
|
150
|
+
readonly info500: "#3b82f6";
|
|
151
|
+
readonly info600: "#2563eb";
|
|
152
|
+
readonly info700: "#1d4ed8";
|
|
153
|
+
readonly info800: "#1e40af";
|
|
154
|
+
readonly info900: "#1e3a8a";
|
|
155
|
+
readonly info950: "#172554";
|
|
156
|
+
readonly infoDefault: "#2563eb";
|
|
157
|
+
readonly teal50: "#f0fdfa";
|
|
158
|
+
readonly teal100: "#ccfbf1";
|
|
159
|
+
readonly teal200: "#99f6e4";
|
|
160
|
+
readonly teal300: "#5eead4";
|
|
161
|
+
readonly teal400: "#2dd4bf";
|
|
162
|
+
readonly teal500: "#14b8a6";
|
|
163
|
+
readonly teal600: "#0d9488";
|
|
164
|
+
readonly teal700: "#0f766e";
|
|
165
|
+
readonly teal800: "#115e59";
|
|
166
|
+
readonly teal900: "#134e4a";
|
|
167
|
+
readonly teal950: "#042f2e";
|
|
168
|
+
readonly tealDefault: "#0d9488";
|
|
169
|
+
readonly orange50: "#fff7ed";
|
|
170
|
+
readonly orange100: "#ffedd5";
|
|
171
|
+
readonly orange200: "#fed7aa";
|
|
172
|
+
readonly orange300: "#fdba74";
|
|
173
|
+
readonly orange400: "#fb923c";
|
|
174
|
+
readonly orange500: "#f97316";
|
|
175
|
+
readonly orange600: "#ea580c";
|
|
176
|
+
readonly orange700: "#c2410c";
|
|
177
|
+
readonly orange800: "#9a3412";
|
|
178
|
+
readonly orange900: "#7c2d12";
|
|
179
|
+
readonly orange950: "#431407";
|
|
180
|
+
readonly orangeDefault: "#ea580c";
|
|
181
|
+
readonly rose50: "#fff1f2";
|
|
182
|
+
readonly rose100: "#ffe4e6";
|
|
183
|
+
readonly rose200: "#fecdd3";
|
|
184
|
+
readonly rose300: "#fda4af";
|
|
185
|
+
readonly rose400: "#fb7185";
|
|
186
|
+
readonly rose500: "#f43f5e";
|
|
187
|
+
readonly rose600: "#e11d48";
|
|
188
|
+
readonly rose700: "#be123c";
|
|
189
|
+
readonly rose800: "#9f1239";
|
|
190
|
+
readonly rose900: "#881337";
|
|
191
|
+
readonly rose950: "#4c0519";
|
|
192
|
+
readonly roseDefault: "#e11d48";
|
|
193
|
+
readonly indigo50: "#eef2ff";
|
|
194
|
+
readonly indigo100: "#e0e7ff";
|
|
195
|
+
readonly indigo200: "#c7d2fe";
|
|
196
|
+
readonly indigo300: "#a5b4fc";
|
|
197
|
+
readonly indigo400: "#818cf8";
|
|
198
|
+
readonly indigo500: "#6366f1";
|
|
199
|
+
readonly indigo600: "#4f46e5";
|
|
200
|
+
readonly indigo700: "#4338ca";
|
|
201
|
+
readonly indigo800: "#3730a3";
|
|
202
|
+
readonly indigo900: "#312e81";
|
|
203
|
+
readonly indigo950: "#1e1b4b";
|
|
204
|
+
readonly indigoDefault: "#4f46e5";
|
|
205
|
+
readonly mint50: "#ecfdf5";
|
|
206
|
+
readonly mint100: "#d1fae5";
|
|
207
|
+
readonly mint200: "#a7f3d0";
|
|
208
|
+
readonly mint300: "#6ee7b7";
|
|
209
|
+
readonly mint400: "#34d399";
|
|
210
|
+
readonly mint500: "#10b981";
|
|
211
|
+
readonly mint600: "#059669";
|
|
212
|
+
readonly mint700: "#047857";
|
|
213
|
+
readonly mint800: "#065f46";
|
|
214
|
+
readonly mint900: "#064e3b";
|
|
215
|
+
readonly mint950: "#022c22";
|
|
216
|
+
readonly mintDefault: "#059669";
|
|
217
|
+
readonly coal50: "#f8fafc";
|
|
218
|
+
readonly coal100: "#f1f5f9";
|
|
219
|
+
readonly coal200: "#e2e8f0";
|
|
220
|
+
readonly coal300: "#cbd5e1";
|
|
221
|
+
readonly coal400: "#94a3b8";
|
|
222
|
+
readonly coal500: "#64748b";
|
|
223
|
+
readonly coal600: "#475569";
|
|
224
|
+
readonly coal700: "#334155";
|
|
225
|
+
readonly coal800: "#1e293b";
|
|
226
|
+
readonly coal900: "#0f172a";
|
|
227
|
+
readonly coal950: "#020617";
|
|
228
|
+
readonly coalDefault: "#475569";
|
|
229
|
+
};
|
|
230
|
+
readonly semantic: {
|
|
231
|
+
readonly bgBase: "var(--tui-color-white)";
|
|
232
|
+
readonly bgSubtle: "var(--tui-color-brand-black-50)";
|
|
233
|
+
readonly bgMuted: "var(--tui-color-brand-black-100)";
|
|
234
|
+
readonly bgInverse: "var(--tui-color-brand-black-900)";
|
|
235
|
+
readonly surfaceDefault: "var(--tui-color-white)";
|
|
236
|
+
readonly surfaceRaised: "var(--tui-color-brand-black-50)";
|
|
237
|
+
readonly surfaceOverlay: "var(--tui-color-brand-black-100)";
|
|
238
|
+
readonly textPrimary: "var(--tui-color-brand-black-900)";
|
|
239
|
+
readonly textSecondary: "var(--tui-color-brand-gray-600)";
|
|
240
|
+
readonly textTertiary: "var(--tui-color-brand-gray-400)";
|
|
241
|
+
readonly textDisabled: "var(--tui-color-brand-black-300)";
|
|
242
|
+
readonly textInverse: "var(--tui-color-white)";
|
|
243
|
+
readonly textLink: "var(--tui-color-brand-blue-600)";
|
|
244
|
+
readonly textLinkHover: "var(--tui-color-brand-blue-700)";
|
|
245
|
+
readonly borderDefault: "var(--tui-color-brand-black-200)";
|
|
246
|
+
readonly borderStrong: "var(--tui-color-brand-black-400)";
|
|
247
|
+
readonly borderFocus: "var(--tui-color-brand-pink-500)";
|
|
248
|
+
readonly focusRing: "var(--tui-color-brand-black-500)";
|
|
249
|
+
readonly focusRingGap: "var(--tui-color-white)";
|
|
250
|
+
readonly brandDefault: "var(--tui-color-brand-pink-600)";
|
|
251
|
+
readonly brandHover: "var(--tui-color-brand-pink-700)";
|
|
252
|
+
readonly brandActive: "var(--tui-color-brand-pink-800)";
|
|
253
|
+
readonly brandSubtle: "var(--tui-color-brand-pink-50)";
|
|
254
|
+
readonly brandText: "var(--tui-color-white)";
|
|
255
|
+
readonly successDefault: "var(--tui-color-success-600)";
|
|
256
|
+
readonly successSubtle: "var(--tui-color-success-50)";
|
|
257
|
+
readonly successText: "var(--tui-color-success-700)";
|
|
258
|
+
readonly warningDefault: "var(--tui-color-warning-600)";
|
|
259
|
+
readonly warningSubtle: "var(--tui-color-warning-50)";
|
|
260
|
+
readonly warningText: "var(--tui-color-warning-700)";
|
|
261
|
+
readonly dangerDefault: "var(--tui-color-danger-600)";
|
|
262
|
+
readonly dangerSubtle: "var(--tui-color-danger-50)";
|
|
263
|
+
readonly dangerText: "var(--tui-color-danger-700)";
|
|
264
|
+
readonly infoDefault: "var(--tui-color-info-600)";
|
|
265
|
+
readonly infoSubtle: "var(--tui-color-info-50)";
|
|
266
|
+
readonly infoText: "var(--tui-color-info-700)";
|
|
267
|
+
readonly tealDefault: "var(--tui-color-teal-600)";
|
|
268
|
+
readonly tealSubtle: "var(--tui-color-teal-50)";
|
|
269
|
+
readonly tealText: "var(--tui-color-teal-700)";
|
|
270
|
+
readonly orangeDefault: "var(--tui-color-orange-600)";
|
|
271
|
+
readonly orangeSubtle: "var(--tui-color-orange-50)";
|
|
272
|
+
readonly orangeText: "var(--tui-color-orange-700)";
|
|
273
|
+
readonly roseDefault: "var(--tui-color-rose-600)";
|
|
274
|
+
readonly roseSubtle: "var(--tui-color-rose-50)";
|
|
275
|
+
readonly roseText: "var(--tui-color-rose-700)";
|
|
276
|
+
readonly indigoDefault: "var(--tui-color-indigo-600)";
|
|
277
|
+
readonly indigoSubtle: "var(--tui-color-indigo-50)";
|
|
278
|
+
readonly indigoText: "var(--tui-color-indigo-700)";
|
|
279
|
+
readonly mintDefault: "var(--tui-color-mint-600)";
|
|
280
|
+
readonly mintSubtle: "var(--tui-color-mint-50)";
|
|
281
|
+
readonly mintText: "var(--tui-color-mint-700)";
|
|
282
|
+
readonly coalDefault: "var(--tui-color-coal-600)";
|
|
283
|
+
readonly coalSubtle: "var(--tui-color-coal-50)";
|
|
284
|
+
readonly coalText: "var(--tui-color-coal-700)";
|
|
285
|
+
};
|
|
286
|
+
};
|
|
287
|
+
type ColorTokens = typeof color;
|
|
288
|
+
|
|
289
|
+
/**
|
|
290
|
+
* Spacing tokens — margin, padding, gap, inset
|
|
291
|
+
* CSS custom property prefix: --tui-spacing-*
|
|
292
|
+
*
|
|
293
|
+
* Base unit: 4px (0.25rem)
|
|
294
|
+
* Scale follows a 4pt grid.
|
|
295
|
+
*/
|
|
296
|
+
declare const spacing: {
|
|
297
|
+
readonly 0: "0px";
|
|
298
|
+
readonly px: "1px";
|
|
299
|
+
readonly 0.5: "0.125rem";
|
|
300
|
+
readonly 1: "0.25rem";
|
|
301
|
+
readonly 1.5: "0.375rem";
|
|
302
|
+
readonly 2: "0.5rem";
|
|
303
|
+
readonly 2.5: "0.625rem";
|
|
304
|
+
readonly 3: "0.75rem";
|
|
305
|
+
readonly 3.5: "0.875rem";
|
|
306
|
+
readonly 4: "1rem";
|
|
307
|
+
readonly 5: "1.25rem";
|
|
308
|
+
readonly 6: "1.5rem";
|
|
309
|
+
readonly 7: "1.75rem";
|
|
310
|
+
readonly 8: "2rem";
|
|
311
|
+
readonly 9: "2.25rem";
|
|
312
|
+
readonly 10: "2.5rem";
|
|
313
|
+
readonly 11: "2.75rem";
|
|
314
|
+
readonly 12: "3rem";
|
|
315
|
+
readonly 14: "3.5rem";
|
|
316
|
+
readonly 16: "4rem";
|
|
317
|
+
readonly 20: "5rem";
|
|
318
|
+
readonly 24: "6rem";
|
|
319
|
+
readonly 28: "7rem";
|
|
320
|
+
readonly 32: "8rem";
|
|
321
|
+
readonly 36: "9rem";
|
|
322
|
+
readonly 40: "10rem";
|
|
323
|
+
readonly 44: "11rem";
|
|
324
|
+
readonly 48: "12rem";
|
|
325
|
+
readonly 52: "13rem";
|
|
326
|
+
readonly 56: "14rem";
|
|
327
|
+
readonly 60: "15rem";
|
|
328
|
+
readonly 64: "16rem";
|
|
329
|
+
readonly 72: "18rem";
|
|
330
|
+
readonly 80: "20rem";
|
|
331
|
+
readonly 96: "24rem";
|
|
332
|
+
readonly componentXs: "var(--tui-spacing-1)";
|
|
333
|
+
readonly componentSm: "var(--tui-spacing-2)";
|
|
334
|
+
readonly componentMd: "var(--tui-spacing-3)";
|
|
335
|
+
readonly componentLg: "var(--tui-spacing-4)";
|
|
336
|
+
readonly componentXl: "var(--tui-spacing-6)";
|
|
337
|
+
readonly sectionSm: "var(--tui-spacing-6)";
|
|
338
|
+
readonly sectionMd: "var(--tui-spacing-8)";
|
|
339
|
+
readonly sectionLg: "var(--tui-spacing-12)";
|
|
340
|
+
readonly pagePadding: "var(--tui-spacing-4)";
|
|
341
|
+
readonly cardPadding: "var(--tui-spacing-4)";
|
|
342
|
+
readonly modalPadding: "var(--tui-spacing-6)";
|
|
343
|
+
readonly stackSm: "var(--tui-spacing-2)";
|
|
344
|
+
readonly stackMd: "var(--tui-spacing-4)";
|
|
345
|
+
readonly stackLg: "var(--tui-spacing-6)";
|
|
346
|
+
readonly inlineSm: "var(--tui-spacing-2)";
|
|
347
|
+
readonly inlineMd: "var(--tui-spacing-3)";
|
|
348
|
+
readonly inlineLg: "var(--tui-spacing-4)";
|
|
349
|
+
};
|
|
350
|
+
type SpacingTokens = typeof spacing;
|
|
351
|
+
|
|
352
|
+
/**
|
|
353
|
+
* Typography tokens — font family, size, weight, line-height, letter-spacing
|
|
354
|
+
* CSS custom property prefix: --tui-font-*
|
|
355
|
+
*/
|
|
356
|
+
declare const fontFamily: {
|
|
357
|
+
readonly sans: "'Inter', ui-sans-serif, system-ui, -apple-system, sans-serif";
|
|
358
|
+
readonly serif: "'Georgia', ui-serif, serif";
|
|
359
|
+
readonly mono: "'JetBrains Mono', ui-monospace, 'Cascadia Code', monospace";
|
|
360
|
+
};
|
|
361
|
+
/**
|
|
362
|
+
* Font size scale (rem)
|
|
363
|
+
* Base: 16px = 1rem
|
|
364
|
+
*/
|
|
365
|
+
declare const fontSize: {
|
|
366
|
+
readonly "2xs": "0.625rem";
|
|
367
|
+
readonly xs: "0.75rem";
|
|
368
|
+
readonly sm: "0.875rem";
|
|
369
|
+
readonly md: "1rem";
|
|
370
|
+
readonly lg: "1.125rem";
|
|
371
|
+
readonly xl: "1.25rem";
|
|
372
|
+
readonly "2xl": "1.5rem";
|
|
373
|
+
readonly "3xl": "1.875rem";
|
|
374
|
+
readonly "4xl": "2.25rem";
|
|
375
|
+
readonly "5xl": "3rem";
|
|
376
|
+
readonly "6xl": "3.75rem";
|
|
377
|
+
readonly "7xl": "4.5rem";
|
|
378
|
+
};
|
|
379
|
+
declare const fontWeight: {
|
|
380
|
+
readonly thin: "100";
|
|
381
|
+
readonly extralight: "200";
|
|
382
|
+
readonly light: "300";
|
|
383
|
+
readonly normal: "400";
|
|
384
|
+
readonly medium: "500";
|
|
385
|
+
readonly semibold: "600";
|
|
386
|
+
readonly bold: "700";
|
|
387
|
+
readonly extrabold: "800";
|
|
388
|
+
readonly black: "900";
|
|
389
|
+
};
|
|
390
|
+
declare const lineHeight: {
|
|
391
|
+
readonly none: "1";
|
|
392
|
+
readonly tight: "1.25";
|
|
393
|
+
readonly snug: "1.375";
|
|
394
|
+
readonly normal: "1.5";
|
|
395
|
+
readonly relaxed: "1.625";
|
|
396
|
+
readonly loose: "2";
|
|
397
|
+
readonly "3": "0.75rem";
|
|
398
|
+
readonly "4": "1rem";
|
|
399
|
+
readonly "5": "1.25rem";
|
|
400
|
+
readonly "6": "1.5rem";
|
|
401
|
+
readonly "7": "1.75rem";
|
|
402
|
+
readonly "8": "2rem";
|
|
403
|
+
readonly "9": "2.25rem";
|
|
404
|
+
readonly "10": "2.5rem";
|
|
405
|
+
};
|
|
406
|
+
declare const letterSpacing: {
|
|
407
|
+
readonly tighter: "-0.05em";
|
|
408
|
+
readonly tight: "-0.025em";
|
|
409
|
+
readonly normal: "0em";
|
|
410
|
+
readonly wide: "0.025em";
|
|
411
|
+
readonly wider: "0.05em";
|
|
412
|
+
readonly widest: "0.1em";
|
|
413
|
+
};
|
|
414
|
+
declare const typography: {
|
|
415
|
+
readonly fontFamily: {
|
|
416
|
+
readonly sans: "'Inter', ui-sans-serif, system-ui, -apple-system, sans-serif";
|
|
417
|
+
readonly serif: "'Georgia', ui-serif, serif";
|
|
418
|
+
readonly mono: "'JetBrains Mono', ui-monospace, 'Cascadia Code', monospace";
|
|
419
|
+
};
|
|
420
|
+
readonly fontSize: {
|
|
421
|
+
readonly "2xs": "0.625rem";
|
|
422
|
+
readonly xs: "0.75rem";
|
|
423
|
+
readonly sm: "0.875rem";
|
|
424
|
+
readonly md: "1rem";
|
|
425
|
+
readonly lg: "1.125rem";
|
|
426
|
+
readonly xl: "1.25rem";
|
|
427
|
+
readonly "2xl": "1.5rem";
|
|
428
|
+
readonly "3xl": "1.875rem";
|
|
429
|
+
readonly "4xl": "2.25rem";
|
|
430
|
+
readonly "5xl": "3rem";
|
|
431
|
+
readonly "6xl": "3.75rem";
|
|
432
|
+
readonly "7xl": "4.5rem";
|
|
433
|
+
};
|
|
434
|
+
readonly fontWeight: {
|
|
435
|
+
readonly thin: "100";
|
|
436
|
+
readonly extralight: "200";
|
|
437
|
+
readonly light: "300";
|
|
438
|
+
readonly normal: "400";
|
|
439
|
+
readonly medium: "500";
|
|
440
|
+
readonly semibold: "600";
|
|
441
|
+
readonly bold: "700";
|
|
442
|
+
readonly extrabold: "800";
|
|
443
|
+
readonly black: "900";
|
|
444
|
+
};
|
|
445
|
+
readonly lineHeight: {
|
|
446
|
+
readonly none: "1";
|
|
447
|
+
readonly tight: "1.25";
|
|
448
|
+
readonly snug: "1.375";
|
|
449
|
+
readonly normal: "1.5";
|
|
450
|
+
readonly relaxed: "1.625";
|
|
451
|
+
readonly loose: "2";
|
|
452
|
+
readonly "3": "0.75rem";
|
|
453
|
+
readonly "4": "1rem";
|
|
454
|
+
readonly "5": "1.25rem";
|
|
455
|
+
readonly "6": "1.5rem";
|
|
456
|
+
readonly "7": "1.75rem";
|
|
457
|
+
readonly "8": "2rem";
|
|
458
|
+
readonly "9": "2.25rem";
|
|
459
|
+
readonly "10": "2.5rem";
|
|
460
|
+
};
|
|
461
|
+
readonly letterSpacing: {
|
|
462
|
+
readonly tighter: "-0.05em";
|
|
463
|
+
readonly tight: "-0.025em";
|
|
464
|
+
readonly normal: "0em";
|
|
465
|
+
readonly wide: "0.025em";
|
|
466
|
+
readonly wider: "0.05em";
|
|
467
|
+
readonly widest: "0.1em";
|
|
468
|
+
};
|
|
469
|
+
};
|
|
470
|
+
type TypographyTokens = typeof typography;
|
|
471
|
+
|
|
472
|
+
/**
|
|
473
|
+
* Border radius tokens
|
|
474
|
+
* CSS custom property prefix: --tui-radius-*
|
|
475
|
+
*/
|
|
476
|
+
declare const radius: {
|
|
477
|
+
readonly none: "0px";
|
|
478
|
+
readonly xs: "0.125rem";
|
|
479
|
+
readonly sm: "0.25rem";
|
|
480
|
+
readonly md: "0.375rem";
|
|
481
|
+
readonly lg: "0.5rem";
|
|
482
|
+
readonly xl: "0.75rem";
|
|
483
|
+
readonly "2xl": "1rem";
|
|
484
|
+
readonly "3xl": "1.5rem";
|
|
485
|
+
readonly full: "9999px";
|
|
486
|
+
readonly default: "var(--tui-radius-md)";
|
|
487
|
+
readonly button: "var(--tui-radius-md)";
|
|
488
|
+
readonly input: "var(--tui-radius-md)";
|
|
489
|
+
readonly card: "var(--tui-radius-lg)";
|
|
490
|
+
readonly badge: "var(--tui-radius-full)";
|
|
491
|
+
readonly avatar: "var(--tui-radius-full)";
|
|
492
|
+
readonly modal: "var(--tui-radius-xl)";
|
|
493
|
+
readonly tooltip: "var(--tui-radius-sm)";
|
|
494
|
+
};
|
|
495
|
+
type RadiusTokens = typeof radius;
|
|
496
|
+
|
|
497
|
+
/**
|
|
498
|
+
* Box shadow tokens
|
|
499
|
+
* CSS custom property prefix: --tui-shadow-*
|
|
500
|
+
*
|
|
501
|
+
* Each shadow uses CSS variables internally so dark-mode overrides
|
|
502
|
+
* only need to change the base variables, not every shadow value.
|
|
503
|
+
*/
|
|
504
|
+
declare const shadow: {
|
|
505
|
+
readonly none: "none";
|
|
506
|
+
readonly xs: "0 1px 2px 0 rgb(0 0 0 / 0.05)";
|
|
507
|
+
readonly sm: "0 1px 3px 0 rgb(0 0 0 / 0.10), 0 1px 2px -1px rgb(0 0 0 / 0.10)";
|
|
508
|
+
readonly md: "0 4px 6px -1px rgb(0 0 0 / 0.10), 0 2px 4px -2px rgb(0 0 0 / 0.10)";
|
|
509
|
+
readonly lg: "0 10px 15px -3px rgb(0 0 0 / 0.10), 0 4px 6px -4px rgb(0 0 0 / 0.10)";
|
|
510
|
+
readonly xl: "0 20px 25px -5px rgb(0 0 0 / 0.10), 0 8px 10px -6px rgb(0 0 0 / 0.10)";
|
|
511
|
+
readonly "2xl": "0 25px 50px -12px rgb(0 0 0 / 0.25)";
|
|
512
|
+
readonly inner: "inset 0 2px 4px 0 rgb(0 0 0 / 0.05)";
|
|
513
|
+
readonly focus: "0 0 0 3px var(--tui-color-brand-pink-300, #f0abfc)";
|
|
514
|
+
readonly focusBrand: "0 0 0 3px var(--tui-color-brand-pink-400, #e879f9)";
|
|
515
|
+
readonly default: "var(--tui-shadow-sm)";
|
|
516
|
+
readonly card: "var(--tui-shadow-md)";
|
|
517
|
+
readonly dropdown: "var(--tui-shadow-lg)";
|
|
518
|
+
readonly modal: "var(--tui-shadow-xl)";
|
|
519
|
+
readonly tooltip: "var(--tui-shadow-md)";
|
|
520
|
+
readonly button: "var(--tui-shadow-xs)";
|
|
521
|
+
};
|
|
522
|
+
type ShadowTokens = typeof shadow;
|
|
523
|
+
|
|
524
|
+
/**
|
|
525
|
+
* Border width and style tokens
|
|
526
|
+
* CSS custom property prefix: --tui-border-*
|
|
527
|
+
*/
|
|
528
|
+
declare const borderWidth: {
|
|
529
|
+
readonly 0: "0px";
|
|
530
|
+
readonly 0.5: "0.5px";
|
|
531
|
+
readonly 1: "1px";
|
|
532
|
+
readonly 1.5: "1.5px";
|
|
533
|
+
readonly 2: "2px";
|
|
534
|
+
readonly 2.5: "2.5px";
|
|
535
|
+
readonly 3: "3px";
|
|
536
|
+
readonly 3.5: "3.5px";
|
|
537
|
+
readonly 4: "4px";
|
|
538
|
+
readonly 4.5: "4.5px";
|
|
539
|
+
readonly 5: "5px";
|
|
540
|
+
readonly 5.5: "5.5px";
|
|
541
|
+
readonly 8: "8px";
|
|
542
|
+
readonly none: "0px";
|
|
543
|
+
readonly xs: "0.5px";
|
|
544
|
+
readonly sm: "1px";
|
|
545
|
+
readonly md: "2px";
|
|
546
|
+
readonly lg: "4px";
|
|
547
|
+
readonly xl: "6px";
|
|
548
|
+
readonly "2xl": "12px";
|
|
549
|
+
readonly "3xl": "18px";
|
|
550
|
+
readonly "4xl": "24px";
|
|
551
|
+
readonly "5xl": "30px";
|
|
552
|
+
readonly "6xl": "36px";
|
|
553
|
+
readonly "7xl": "42px";
|
|
554
|
+
readonly "8xl": "48px";
|
|
555
|
+
readonly default: "var(--tui-border-width-1)";
|
|
556
|
+
readonly input: "var(--tui-border-width-1)";
|
|
557
|
+
readonly card: "var(--tui-border-width-1)";
|
|
558
|
+
readonly divider: "var(--tui-border-width-1)";
|
|
559
|
+
readonly thick: "var(--tui-border-width-2)";
|
|
560
|
+
};
|
|
561
|
+
declare const borderStyle: {
|
|
562
|
+
readonly solid: "solid";
|
|
563
|
+
readonly dashed: "dashed";
|
|
564
|
+
readonly dotted: "dotted";
|
|
565
|
+
readonly none: "none";
|
|
566
|
+
};
|
|
567
|
+
declare const border: {
|
|
568
|
+
readonly width: {
|
|
569
|
+
readonly 0: "0px";
|
|
570
|
+
readonly 0.5: "0.5px";
|
|
571
|
+
readonly 1: "1px";
|
|
572
|
+
readonly 1.5: "1.5px";
|
|
573
|
+
readonly 2: "2px";
|
|
574
|
+
readonly 2.5: "2.5px";
|
|
575
|
+
readonly 3: "3px";
|
|
576
|
+
readonly 3.5: "3.5px";
|
|
577
|
+
readonly 4: "4px";
|
|
578
|
+
readonly 4.5: "4.5px";
|
|
579
|
+
readonly 5: "5px";
|
|
580
|
+
readonly 5.5: "5.5px";
|
|
581
|
+
readonly 8: "8px";
|
|
582
|
+
readonly none: "0px";
|
|
583
|
+
readonly xs: "0.5px";
|
|
584
|
+
readonly sm: "1px";
|
|
585
|
+
readonly md: "2px";
|
|
586
|
+
readonly lg: "4px";
|
|
587
|
+
readonly xl: "6px";
|
|
588
|
+
readonly "2xl": "12px";
|
|
589
|
+
readonly "3xl": "18px";
|
|
590
|
+
readonly "4xl": "24px";
|
|
591
|
+
readonly "5xl": "30px";
|
|
592
|
+
readonly "6xl": "36px";
|
|
593
|
+
readonly "7xl": "42px";
|
|
594
|
+
readonly "8xl": "48px";
|
|
595
|
+
readonly default: "var(--tui-border-width-1)";
|
|
596
|
+
readonly input: "var(--tui-border-width-1)";
|
|
597
|
+
readonly card: "var(--tui-border-width-1)";
|
|
598
|
+
readonly divider: "var(--tui-border-width-1)";
|
|
599
|
+
readonly thick: "var(--tui-border-width-2)";
|
|
600
|
+
};
|
|
601
|
+
readonly style: {
|
|
602
|
+
readonly solid: "solid";
|
|
603
|
+
readonly dashed: "dashed";
|
|
604
|
+
readonly dotted: "dotted";
|
|
605
|
+
readonly none: "none";
|
|
606
|
+
};
|
|
607
|
+
};
|
|
608
|
+
type BorderTokens = typeof border;
|
|
609
|
+
|
|
610
|
+
/**
|
|
611
|
+
* Z-index tokens
|
|
612
|
+
* CSS custom property prefix: --tui-z-*
|
|
613
|
+
*/
|
|
614
|
+
declare const zIndex: {
|
|
615
|
+
readonly hide: "-1";
|
|
616
|
+
readonly auto: "auto";
|
|
617
|
+
readonly base: "0";
|
|
618
|
+
readonly raised: "1";
|
|
619
|
+
readonly dropdown: "1000";
|
|
620
|
+
readonly sticky: "1100";
|
|
621
|
+
readonly overlay: "1200";
|
|
622
|
+
readonly modal: "1300";
|
|
623
|
+
readonly popover: "1400";
|
|
624
|
+
readonly toast: "1500";
|
|
625
|
+
readonly tooltip: "1600";
|
|
626
|
+
};
|
|
627
|
+
type ZIndexTokens = typeof zIndex;
|
|
628
|
+
|
|
629
|
+
/**
|
|
630
|
+
* Animation / transition tokens
|
|
631
|
+
* CSS custom property prefix: --tui-duration-*, --tui-ease-*
|
|
632
|
+
*/
|
|
633
|
+
declare const duration: {
|
|
634
|
+
readonly instant: "0ms";
|
|
635
|
+
readonly fast: "100ms";
|
|
636
|
+
readonly normal: "200ms";
|
|
637
|
+
readonly slow: "300ms";
|
|
638
|
+
readonly slower: "500ms";
|
|
639
|
+
readonly slowest: "700ms";
|
|
640
|
+
readonly default: "var(--tui-duration-normal)";
|
|
641
|
+
readonly hover: "var(--tui-duration-fast)";
|
|
642
|
+
readonly modal: "var(--tui-duration-slow)";
|
|
643
|
+
readonly tooltip: "var(--tui-duration-fast)";
|
|
644
|
+
readonly collapse: "var(--tui-duration-slow)";
|
|
645
|
+
};
|
|
646
|
+
declare const easing: {
|
|
647
|
+
readonly linear: "linear";
|
|
648
|
+
readonly in: "cubic-bezier(0.4, 0, 1, 1)";
|
|
649
|
+
readonly out: "cubic-bezier(0, 0, 0.2, 1)";
|
|
650
|
+
readonly inOut: "cubic-bezier(0.4, 0, 0.2, 1)";
|
|
651
|
+
readonly bounce: "cubic-bezier(0.34, 1.56, 0.64, 1)";
|
|
652
|
+
readonly spring: "cubic-bezier(0.175, 0.885, 0.32, 1.275)";
|
|
653
|
+
readonly default: "var(--tui-ease-in-out)";
|
|
654
|
+
readonly enter: "var(--tui-ease-out)";
|
|
655
|
+
readonly exit: "var(--tui-ease-in)";
|
|
656
|
+
};
|
|
657
|
+
declare const animation: {
|
|
658
|
+
readonly duration: {
|
|
659
|
+
readonly instant: "0ms";
|
|
660
|
+
readonly fast: "100ms";
|
|
661
|
+
readonly normal: "200ms";
|
|
662
|
+
readonly slow: "300ms";
|
|
663
|
+
readonly slower: "500ms";
|
|
664
|
+
readonly slowest: "700ms";
|
|
665
|
+
readonly default: "var(--tui-duration-normal)";
|
|
666
|
+
readonly hover: "var(--tui-duration-fast)";
|
|
667
|
+
readonly modal: "var(--tui-duration-slow)";
|
|
668
|
+
readonly tooltip: "var(--tui-duration-fast)";
|
|
669
|
+
readonly collapse: "var(--tui-duration-slow)";
|
|
670
|
+
};
|
|
671
|
+
readonly easing: {
|
|
672
|
+
readonly linear: "linear";
|
|
673
|
+
readonly in: "cubic-bezier(0.4, 0, 1, 1)";
|
|
674
|
+
readonly out: "cubic-bezier(0, 0, 0.2, 1)";
|
|
675
|
+
readonly inOut: "cubic-bezier(0.4, 0, 0.2, 1)";
|
|
676
|
+
readonly bounce: "cubic-bezier(0.34, 1.56, 0.64, 1)";
|
|
677
|
+
readonly spring: "cubic-bezier(0.175, 0.885, 0.32, 1.275)";
|
|
678
|
+
readonly default: "var(--tui-ease-in-out)";
|
|
679
|
+
readonly enter: "var(--tui-ease-out)";
|
|
680
|
+
readonly exit: "var(--tui-ease-in)";
|
|
681
|
+
};
|
|
682
|
+
};
|
|
683
|
+
type AnimationTokens = typeof animation;
|
|
684
|
+
|
|
685
|
+
/**
|
|
686
|
+
* Breakpoint tokens
|
|
687
|
+
* Used for media queries and responsive utilities.
|
|
688
|
+
* CSS custom property prefix: --tui-screen-*
|
|
689
|
+
*/
|
|
690
|
+
declare const breakpoint: {
|
|
691
|
+
readonly xs: "320px";
|
|
692
|
+
readonly sm: "640px";
|
|
693
|
+
readonly md: "768px";
|
|
694
|
+
readonly lg: "1024px";
|
|
695
|
+
readonly xl: "1280px";
|
|
696
|
+
readonly "2xl": "1536px";
|
|
697
|
+
};
|
|
698
|
+
type BreakpointTokens = typeof breakpoint;
|
|
699
|
+
|
|
700
|
+
/**
|
|
701
|
+
* Opacity tokens
|
|
702
|
+
* CSS custom property prefix: --tui-opacity-*
|
|
703
|
+
*/
|
|
704
|
+
declare const opacity: {
|
|
705
|
+
readonly 0: "0";
|
|
706
|
+
readonly 5: "0.05";
|
|
707
|
+
readonly 10: "0.1";
|
|
708
|
+
readonly 20: "0.2";
|
|
709
|
+
readonly 25: "0.25";
|
|
710
|
+
readonly 30: "0.3";
|
|
711
|
+
readonly 35: "0.35";
|
|
712
|
+
readonly 40: "0.4";
|
|
713
|
+
readonly 45: "0.45";
|
|
714
|
+
readonly 50: "0.5";
|
|
715
|
+
readonly 55: "0.55";
|
|
716
|
+
readonly 60: "0.6";
|
|
717
|
+
readonly 65: "0.65";
|
|
718
|
+
readonly 70: "0.7";
|
|
719
|
+
readonly 75: "0.75";
|
|
720
|
+
readonly 80: "0.8";
|
|
721
|
+
readonly 85: "0.55";
|
|
722
|
+
readonly 90: "0.9";
|
|
723
|
+
readonly 95: "0.95";
|
|
724
|
+
readonly 100: "1";
|
|
725
|
+
};
|
|
726
|
+
type OpacityTokens = typeof opacity;
|
|
727
|
+
|
|
728
|
+
/**
|
|
729
|
+
* CSS variable generator
|
|
730
|
+
*
|
|
731
|
+
* Converts token objects into flat CSS custom properties
|
|
732
|
+
* with the `--tui-` prefix.
|
|
733
|
+
*
|
|
734
|
+
* Supports nested objects with kebab-case key joining:
|
|
735
|
+
* color.primitive.primary500 → --tui-color-primary-500
|
|
736
|
+
*/
|
|
737
|
+
type TokenValue = string | number;
|
|
738
|
+
type TokenObject = {
|
|
739
|
+
[key: string]: TokenValue | TokenObject;
|
|
740
|
+
};
|
|
741
|
+
/**
|
|
742
|
+
* Flatten a nested token object to a flat map of CSS variable name → value.
|
|
743
|
+
*
|
|
744
|
+
* @param obj Token object (can be nested)
|
|
745
|
+
* @param prefix Current CSS variable prefix (default: "--tui")
|
|
746
|
+
* @param skipKeys Keys to skip one level deep (e.g. "primitive" in color)
|
|
747
|
+
*/
|
|
748
|
+
declare function flattenTokens(obj: TokenObject, prefix?: string, skipKeys?: string[]): Record<string, string>;
|
|
749
|
+
/**
|
|
750
|
+
* Render a flat token map to a CSS `:root { }` block string.
|
|
751
|
+
*/
|
|
752
|
+
declare function toCSSRoot(flatTokens: Record<string, string>, selector?: string): string;
|
|
753
|
+
/**
|
|
754
|
+
* Generate the full tokens CSS string for a given token category.
|
|
755
|
+
*/
|
|
756
|
+
declare function generateCSSCategory(categoryName: string, tokens: TokenObject, selector?: string, skipKeys?: string[]): string;
|
|
757
|
+
|
|
758
|
+
/**
|
|
759
|
+
* @tantu/tokens — public API
|
|
760
|
+
*
|
|
761
|
+
* Usage:
|
|
762
|
+
* import { color, spacing, typography, tokens } from "@tantu/tokens";
|
|
763
|
+
* import { generateAllCSS } from "@tantu/tokens";
|
|
764
|
+
* import tuiPreset from "@tantu/tokens/tailwind-preset";
|
|
765
|
+
*/
|
|
766
|
+
|
|
767
|
+
declare const tokens: {
|
|
768
|
+
readonly color: {
|
|
769
|
+
readonly primitive: {
|
|
770
|
+
readonly white: "#ffffff";
|
|
771
|
+
readonly black: "#000000";
|
|
772
|
+
readonly brandWhite50: "#ffffff";
|
|
773
|
+
readonly brandWhite100: "#fefefe";
|
|
774
|
+
readonly brandWhite200: "#fafafa";
|
|
775
|
+
readonly brandWhite300: "#f5f5f5";
|
|
776
|
+
readonly brandWhite400: "#ededed";
|
|
777
|
+
readonly brandWhite500: "#e0e0e0";
|
|
778
|
+
readonly brandWhite600: "#c2c2c2";
|
|
779
|
+
readonly brandWhite700: "#9e9e9e";
|
|
780
|
+
readonly brandWhite800: "#757575";
|
|
781
|
+
readonly brandWhite900: "#4a4a4a";
|
|
782
|
+
readonly brandWhite950: "#2b2b2b";
|
|
783
|
+
readonly brandWhiteDefault: "#ffffff";
|
|
784
|
+
readonly brandBlack50: "#f5f5f5";
|
|
785
|
+
readonly brandBlack100: "#e8e8e8";
|
|
786
|
+
readonly brandBlack200: "#d4d4d4";
|
|
787
|
+
readonly brandBlack300: "#b0b0b0";
|
|
788
|
+
readonly brandBlack400: "#8a8a8a";
|
|
789
|
+
readonly brandBlack500: "#616161";
|
|
790
|
+
readonly brandBlack600: "#4a4a4a";
|
|
791
|
+
readonly brandBlack700: "#363636";
|
|
792
|
+
readonly brandBlack800: "#242424";
|
|
793
|
+
readonly brandBlack900: "#141414";
|
|
794
|
+
readonly brandBlack950: "#000000";
|
|
795
|
+
readonly brandBlackDefault: "#000000";
|
|
796
|
+
readonly brandNavy50: "#f3f4f7";
|
|
797
|
+
readonly brandNavy100: "#e7e8ef";
|
|
798
|
+
readonly brandNavy200: "#cacfe2";
|
|
799
|
+
readonly brandNavy300: "#9da8d2";
|
|
800
|
+
readonly brandNavy400: "#6377c5";
|
|
801
|
+
readonly brandNavy500: "#354eb0";
|
|
802
|
+
readonly brandNavy600: "#2c4091";
|
|
803
|
+
readonly brandNavy700: "#223272";
|
|
804
|
+
readonly brandNavy800: "#1a2656";
|
|
805
|
+
readonly brandNavy900: "#121a3b";
|
|
806
|
+
readonly brandNavy950: "#0a0e1f";
|
|
807
|
+
readonly brandNavyDefault: "#2c4091";
|
|
808
|
+
readonly brandBlue50: "#eff4ff";
|
|
809
|
+
readonly brandBlue100: "#dbe6fe";
|
|
810
|
+
readonly brandBlue200: "#bfd3fe";
|
|
811
|
+
readonly brandBlue300: "#93b4fd";
|
|
812
|
+
readonly brandBlue400: "#6090fa";
|
|
813
|
+
readonly brandBlue500: "#3b6ef6";
|
|
814
|
+
readonly brandBlue600: "#2563eb";
|
|
815
|
+
readonly brandBlue700: "#1d50d8";
|
|
816
|
+
readonly brandBlue800: "#1e41af";
|
|
817
|
+
readonly brandBlue900: "#1e398a";
|
|
818
|
+
readonly brandBlue950: "#172554";
|
|
819
|
+
readonly brandBlueDefault: "#2563EB";
|
|
820
|
+
readonly brandPurple50: "#f5f3ff";
|
|
821
|
+
readonly brandPurple100: "#ede8ff";
|
|
822
|
+
readonly brandPurple200: "#ddd6fe";
|
|
823
|
+
readonly brandPurple300: "#c4b5fc";
|
|
824
|
+
readonly brandPurple400: "#a78bfa";
|
|
825
|
+
readonly brandPurple500: "#8b5cf6";
|
|
826
|
+
readonly brandPurple600: "#7c3aed";
|
|
827
|
+
readonly brandPurple700: "#6d28d9";
|
|
828
|
+
readonly brandPurple800: "#5b21b6";
|
|
829
|
+
readonly brandPurple900: "#4c1d95";
|
|
830
|
+
readonly brandPurple950: "#2e1065";
|
|
831
|
+
readonly brandPurpleDefault: "#7C3AED";
|
|
832
|
+
readonly brandPink50: "#fdf4ff";
|
|
833
|
+
readonly brandPink100: "#fae8ff";
|
|
834
|
+
readonly brandPink200: "#f5d0fe";
|
|
835
|
+
readonly brandPink300: "#f0abfc";
|
|
836
|
+
readonly brandPink400: "#e879f9";
|
|
837
|
+
readonly brandPink500: "#d946ef";
|
|
838
|
+
readonly brandPink600: "#c026d3";
|
|
839
|
+
readonly brandPink700: "#a21caf";
|
|
840
|
+
readonly brandPink800: "#86198f";
|
|
841
|
+
readonly brandPink900: "#701a75";
|
|
842
|
+
readonly brandPink950: "#4a044e";
|
|
843
|
+
readonly brandPinkDefault: "#c026d3";
|
|
844
|
+
readonly brandGray50: "#f9fafb";
|
|
845
|
+
readonly brandGray100: "#f3f4f6";
|
|
846
|
+
readonly brandGray200: "#e5e7eb";
|
|
847
|
+
readonly brandGray300: "#d1d5db";
|
|
848
|
+
readonly brandGray400: "#9ca3af";
|
|
849
|
+
readonly brandGray500: "#6b7280";
|
|
850
|
+
readonly brandGray600: "#4b5563";
|
|
851
|
+
readonly brandGray700: "#374151";
|
|
852
|
+
readonly brandGray800: "#1f2937";
|
|
853
|
+
readonly brandGray900: "#111827";
|
|
854
|
+
readonly brandGray950: "#030712";
|
|
855
|
+
readonly brandGrayDefault: "#4B5563";
|
|
856
|
+
readonly brandLight50: "#fdfefe";
|
|
857
|
+
readonly brandLight100: "#f9fafb";
|
|
858
|
+
readonly brandLight200: "#f3f4f6";
|
|
859
|
+
readonly brandLight300: "#e5e7eb";
|
|
860
|
+
readonly brandLight400: "#d1d5db";
|
|
861
|
+
readonly brandLight500: "#9ca3af";
|
|
862
|
+
readonly brandLight600: "#6b7280";
|
|
863
|
+
readonly brandLight700: "#4b5563";
|
|
864
|
+
readonly brandLight800: "#374151";
|
|
865
|
+
readonly brandLight900: "#1f2937";
|
|
866
|
+
readonly brandLight950: "#111827";
|
|
867
|
+
readonly brandLightDefault: "#F3F4F6";
|
|
868
|
+
readonly success50: "#f0fdf4";
|
|
869
|
+
readonly success100: "#dcfce7";
|
|
870
|
+
readonly success200: "#bbf7d0";
|
|
871
|
+
readonly success300: "#86efac";
|
|
872
|
+
readonly success400: "#4ade80";
|
|
873
|
+
readonly success500: "#22c55e";
|
|
874
|
+
readonly success600: "#16a34a";
|
|
875
|
+
readonly success700: "#15803d";
|
|
876
|
+
readonly success800: "#166534";
|
|
877
|
+
readonly success900: "#14532d";
|
|
878
|
+
readonly success950: "#052e16";
|
|
879
|
+
readonly successDefault: "#16a34a";
|
|
880
|
+
readonly warning50: "#fffbeb";
|
|
881
|
+
readonly warning100: "#fef3c7";
|
|
882
|
+
readonly warning200: "#fde68a";
|
|
883
|
+
readonly warning300: "#fcd34d";
|
|
884
|
+
readonly warning400: "#fbbf24";
|
|
885
|
+
readonly warning500: "#f59e0b";
|
|
886
|
+
readonly warning600: "#d97706";
|
|
887
|
+
readonly warning700: "#b45309";
|
|
888
|
+
readonly warning800: "#92400e";
|
|
889
|
+
readonly warning900: "#78350f";
|
|
890
|
+
readonly warning950: "#451a03";
|
|
891
|
+
readonly warningDefault: "#d97706";
|
|
892
|
+
readonly danger50: "#fef2f2";
|
|
893
|
+
readonly danger100: "#fee2e2";
|
|
894
|
+
readonly danger200: "#fecaca";
|
|
895
|
+
readonly danger300: "#fca5a5";
|
|
896
|
+
readonly danger400: "#f87171";
|
|
897
|
+
readonly danger500: "#ef4444";
|
|
898
|
+
readonly danger600: "#dc2626";
|
|
899
|
+
readonly danger700: "#b91c1c";
|
|
900
|
+
readonly danger800: "#991b1b";
|
|
901
|
+
readonly danger900: "#7f1d1d";
|
|
902
|
+
readonly danger950: "#450a0a";
|
|
903
|
+
readonly dangerDefault: "#dc2626";
|
|
904
|
+
readonly info50: "#eff6ff";
|
|
905
|
+
readonly info100: "#dbeafe";
|
|
906
|
+
readonly info200: "#bfdbfe";
|
|
907
|
+
readonly info300: "#93c5fd";
|
|
908
|
+
readonly info400: "#60a5fa";
|
|
909
|
+
readonly info500: "#3b82f6";
|
|
910
|
+
readonly info600: "#2563eb";
|
|
911
|
+
readonly info700: "#1d4ed8";
|
|
912
|
+
readonly info800: "#1e40af";
|
|
913
|
+
readonly info900: "#1e3a8a";
|
|
914
|
+
readonly info950: "#172554";
|
|
915
|
+
readonly infoDefault: "#2563eb";
|
|
916
|
+
readonly teal50: "#f0fdfa";
|
|
917
|
+
readonly teal100: "#ccfbf1";
|
|
918
|
+
readonly teal200: "#99f6e4";
|
|
919
|
+
readonly teal300: "#5eead4";
|
|
920
|
+
readonly teal400: "#2dd4bf";
|
|
921
|
+
readonly teal500: "#14b8a6";
|
|
922
|
+
readonly teal600: "#0d9488";
|
|
923
|
+
readonly teal700: "#0f766e";
|
|
924
|
+
readonly teal800: "#115e59";
|
|
925
|
+
readonly teal900: "#134e4a";
|
|
926
|
+
readonly teal950: "#042f2e";
|
|
927
|
+
readonly tealDefault: "#0d9488";
|
|
928
|
+
readonly orange50: "#fff7ed";
|
|
929
|
+
readonly orange100: "#ffedd5";
|
|
930
|
+
readonly orange200: "#fed7aa";
|
|
931
|
+
readonly orange300: "#fdba74";
|
|
932
|
+
readonly orange400: "#fb923c";
|
|
933
|
+
readonly orange500: "#f97316";
|
|
934
|
+
readonly orange600: "#ea580c";
|
|
935
|
+
readonly orange700: "#c2410c";
|
|
936
|
+
readonly orange800: "#9a3412";
|
|
937
|
+
readonly orange900: "#7c2d12";
|
|
938
|
+
readonly orange950: "#431407";
|
|
939
|
+
readonly orangeDefault: "#ea580c";
|
|
940
|
+
readonly rose50: "#fff1f2";
|
|
941
|
+
readonly rose100: "#ffe4e6";
|
|
942
|
+
readonly rose200: "#fecdd3";
|
|
943
|
+
readonly rose300: "#fda4af";
|
|
944
|
+
readonly rose400: "#fb7185";
|
|
945
|
+
readonly rose500: "#f43f5e";
|
|
946
|
+
readonly rose600: "#e11d48";
|
|
947
|
+
readonly rose700: "#be123c";
|
|
948
|
+
readonly rose800: "#9f1239";
|
|
949
|
+
readonly rose900: "#881337";
|
|
950
|
+
readonly rose950: "#4c0519";
|
|
951
|
+
readonly roseDefault: "#e11d48";
|
|
952
|
+
readonly indigo50: "#eef2ff";
|
|
953
|
+
readonly indigo100: "#e0e7ff";
|
|
954
|
+
readonly indigo200: "#c7d2fe";
|
|
955
|
+
readonly indigo300: "#a5b4fc";
|
|
956
|
+
readonly indigo400: "#818cf8";
|
|
957
|
+
readonly indigo500: "#6366f1";
|
|
958
|
+
readonly indigo600: "#4f46e5";
|
|
959
|
+
readonly indigo700: "#4338ca";
|
|
960
|
+
readonly indigo800: "#3730a3";
|
|
961
|
+
readonly indigo900: "#312e81";
|
|
962
|
+
readonly indigo950: "#1e1b4b";
|
|
963
|
+
readonly indigoDefault: "#4f46e5";
|
|
964
|
+
readonly mint50: "#ecfdf5";
|
|
965
|
+
readonly mint100: "#d1fae5";
|
|
966
|
+
readonly mint200: "#a7f3d0";
|
|
967
|
+
readonly mint300: "#6ee7b7";
|
|
968
|
+
readonly mint400: "#34d399";
|
|
969
|
+
readonly mint500: "#10b981";
|
|
970
|
+
readonly mint600: "#059669";
|
|
971
|
+
readonly mint700: "#047857";
|
|
972
|
+
readonly mint800: "#065f46";
|
|
973
|
+
readonly mint900: "#064e3b";
|
|
974
|
+
readonly mint950: "#022c22";
|
|
975
|
+
readonly mintDefault: "#059669";
|
|
976
|
+
readonly coal50: "#f8fafc";
|
|
977
|
+
readonly coal100: "#f1f5f9";
|
|
978
|
+
readonly coal200: "#e2e8f0";
|
|
979
|
+
readonly coal300: "#cbd5e1";
|
|
980
|
+
readonly coal400: "#94a3b8";
|
|
981
|
+
readonly coal500: "#64748b";
|
|
982
|
+
readonly coal600: "#475569";
|
|
983
|
+
readonly coal700: "#334155";
|
|
984
|
+
readonly coal800: "#1e293b";
|
|
985
|
+
readonly coal900: "#0f172a";
|
|
986
|
+
readonly coal950: "#020617";
|
|
987
|
+
readonly coalDefault: "#475569";
|
|
988
|
+
};
|
|
989
|
+
readonly semantic: {
|
|
990
|
+
readonly bgBase: "var(--tui-color-white)";
|
|
991
|
+
readonly bgSubtle: "var(--tui-color-brand-black-50)";
|
|
992
|
+
readonly bgMuted: "var(--tui-color-brand-black-100)";
|
|
993
|
+
readonly bgInverse: "var(--tui-color-brand-black-900)";
|
|
994
|
+
readonly surfaceDefault: "var(--tui-color-white)";
|
|
995
|
+
readonly surfaceRaised: "var(--tui-color-brand-black-50)";
|
|
996
|
+
readonly surfaceOverlay: "var(--tui-color-brand-black-100)";
|
|
997
|
+
readonly textPrimary: "var(--tui-color-brand-black-900)";
|
|
998
|
+
readonly textSecondary: "var(--tui-color-brand-gray-600)";
|
|
999
|
+
readonly textTertiary: "var(--tui-color-brand-gray-400)";
|
|
1000
|
+
readonly textDisabled: "var(--tui-color-brand-black-300)";
|
|
1001
|
+
readonly textInverse: "var(--tui-color-white)";
|
|
1002
|
+
readonly textLink: "var(--tui-color-brand-blue-600)";
|
|
1003
|
+
readonly textLinkHover: "var(--tui-color-brand-blue-700)";
|
|
1004
|
+
readonly borderDefault: "var(--tui-color-brand-black-200)";
|
|
1005
|
+
readonly borderStrong: "var(--tui-color-brand-black-400)";
|
|
1006
|
+
readonly borderFocus: "var(--tui-color-brand-pink-500)";
|
|
1007
|
+
readonly focusRing: "var(--tui-color-brand-black-500)";
|
|
1008
|
+
readonly focusRingGap: "var(--tui-color-white)";
|
|
1009
|
+
readonly brandDefault: "var(--tui-color-brand-pink-600)";
|
|
1010
|
+
readonly brandHover: "var(--tui-color-brand-pink-700)";
|
|
1011
|
+
readonly brandActive: "var(--tui-color-brand-pink-800)";
|
|
1012
|
+
readonly brandSubtle: "var(--tui-color-brand-pink-50)";
|
|
1013
|
+
readonly brandText: "var(--tui-color-white)";
|
|
1014
|
+
readonly successDefault: "var(--tui-color-success-600)";
|
|
1015
|
+
readonly successSubtle: "var(--tui-color-success-50)";
|
|
1016
|
+
readonly successText: "var(--tui-color-success-700)";
|
|
1017
|
+
readonly warningDefault: "var(--tui-color-warning-600)";
|
|
1018
|
+
readonly warningSubtle: "var(--tui-color-warning-50)";
|
|
1019
|
+
readonly warningText: "var(--tui-color-warning-700)";
|
|
1020
|
+
readonly dangerDefault: "var(--tui-color-danger-600)";
|
|
1021
|
+
readonly dangerSubtle: "var(--tui-color-danger-50)";
|
|
1022
|
+
readonly dangerText: "var(--tui-color-danger-700)";
|
|
1023
|
+
readonly infoDefault: "var(--tui-color-info-600)";
|
|
1024
|
+
readonly infoSubtle: "var(--tui-color-info-50)";
|
|
1025
|
+
readonly infoText: "var(--tui-color-info-700)";
|
|
1026
|
+
readonly tealDefault: "var(--tui-color-teal-600)";
|
|
1027
|
+
readonly tealSubtle: "var(--tui-color-teal-50)";
|
|
1028
|
+
readonly tealText: "var(--tui-color-teal-700)";
|
|
1029
|
+
readonly orangeDefault: "var(--tui-color-orange-600)";
|
|
1030
|
+
readonly orangeSubtle: "var(--tui-color-orange-50)";
|
|
1031
|
+
readonly orangeText: "var(--tui-color-orange-700)";
|
|
1032
|
+
readonly roseDefault: "var(--tui-color-rose-600)";
|
|
1033
|
+
readonly roseSubtle: "var(--tui-color-rose-50)";
|
|
1034
|
+
readonly roseText: "var(--tui-color-rose-700)";
|
|
1035
|
+
readonly indigoDefault: "var(--tui-color-indigo-600)";
|
|
1036
|
+
readonly indigoSubtle: "var(--tui-color-indigo-50)";
|
|
1037
|
+
readonly indigoText: "var(--tui-color-indigo-700)";
|
|
1038
|
+
readonly mintDefault: "var(--tui-color-mint-600)";
|
|
1039
|
+
readonly mintSubtle: "var(--tui-color-mint-50)";
|
|
1040
|
+
readonly mintText: "var(--tui-color-mint-700)";
|
|
1041
|
+
readonly coalDefault: "var(--tui-color-coal-600)";
|
|
1042
|
+
readonly coalSubtle: "var(--tui-color-coal-50)";
|
|
1043
|
+
readonly coalText: "var(--tui-color-coal-700)";
|
|
1044
|
+
};
|
|
1045
|
+
};
|
|
1046
|
+
readonly spacing: {
|
|
1047
|
+
readonly 0: "0px";
|
|
1048
|
+
readonly px: "1px";
|
|
1049
|
+
readonly 0.5: "0.125rem";
|
|
1050
|
+
readonly 1: "0.25rem";
|
|
1051
|
+
readonly 1.5: "0.375rem";
|
|
1052
|
+
readonly 2: "0.5rem";
|
|
1053
|
+
readonly 2.5: "0.625rem";
|
|
1054
|
+
readonly 3: "0.75rem";
|
|
1055
|
+
readonly 3.5: "0.875rem";
|
|
1056
|
+
readonly 4: "1rem";
|
|
1057
|
+
readonly 5: "1.25rem";
|
|
1058
|
+
readonly 6: "1.5rem";
|
|
1059
|
+
readonly 7: "1.75rem";
|
|
1060
|
+
readonly 8: "2rem";
|
|
1061
|
+
readonly 9: "2.25rem";
|
|
1062
|
+
readonly 10: "2.5rem";
|
|
1063
|
+
readonly 11: "2.75rem";
|
|
1064
|
+
readonly 12: "3rem";
|
|
1065
|
+
readonly 14: "3.5rem";
|
|
1066
|
+
readonly 16: "4rem";
|
|
1067
|
+
readonly 20: "5rem";
|
|
1068
|
+
readonly 24: "6rem";
|
|
1069
|
+
readonly 28: "7rem";
|
|
1070
|
+
readonly 32: "8rem";
|
|
1071
|
+
readonly 36: "9rem";
|
|
1072
|
+
readonly 40: "10rem";
|
|
1073
|
+
readonly 44: "11rem";
|
|
1074
|
+
readonly 48: "12rem";
|
|
1075
|
+
readonly 52: "13rem";
|
|
1076
|
+
readonly 56: "14rem";
|
|
1077
|
+
readonly 60: "15rem";
|
|
1078
|
+
readonly 64: "16rem";
|
|
1079
|
+
readonly 72: "18rem";
|
|
1080
|
+
readonly 80: "20rem";
|
|
1081
|
+
readonly 96: "24rem";
|
|
1082
|
+
readonly componentXs: "var(--tui-spacing-1)";
|
|
1083
|
+
readonly componentSm: "var(--tui-spacing-2)";
|
|
1084
|
+
readonly componentMd: "var(--tui-spacing-3)";
|
|
1085
|
+
readonly componentLg: "var(--tui-spacing-4)";
|
|
1086
|
+
readonly componentXl: "var(--tui-spacing-6)";
|
|
1087
|
+
readonly sectionSm: "var(--tui-spacing-6)";
|
|
1088
|
+
readonly sectionMd: "var(--tui-spacing-8)";
|
|
1089
|
+
readonly sectionLg: "var(--tui-spacing-12)";
|
|
1090
|
+
readonly pagePadding: "var(--tui-spacing-4)";
|
|
1091
|
+
readonly cardPadding: "var(--tui-spacing-4)";
|
|
1092
|
+
readonly modalPadding: "var(--tui-spacing-6)";
|
|
1093
|
+
readonly stackSm: "var(--tui-spacing-2)";
|
|
1094
|
+
readonly stackMd: "var(--tui-spacing-4)";
|
|
1095
|
+
readonly stackLg: "var(--tui-spacing-6)";
|
|
1096
|
+
readonly inlineSm: "var(--tui-spacing-2)";
|
|
1097
|
+
readonly inlineMd: "var(--tui-spacing-3)";
|
|
1098
|
+
readonly inlineLg: "var(--tui-spacing-4)";
|
|
1099
|
+
};
|
|
1100
|
+
readonly typography: {
|
|
1101
|
+
readonly fontFamily: {
|
|
1102
|
+
readonly sans: "'Inter', ui-sans-serif, system-ui, -apple-system, sans-serif";
|
|
1103
|
+
readonly serif: "'Georgia', ui-serif, serif";
|
|
1104
|
+
readonly mono: "'JetBrains Mono', ui-monospace, 'Cascadia Code', monospace";
|
|
1105
|
+
};
|
|
1106
|
+
readonly fontSize: {
|
|
1107
|
+
readonly "2xs": "0.625rem";
|
|
1108
|
+
readonly xs: "0.75rem";
|
|
1109
|
+
readonly sm: "0.875rem";
|
|
1110
|
+
readonly md: "1rem";
|
|
1111
|
+
readonly lg: "1.125rem";
|
|
1112
|
+
readonly xl: "1.25rem";
|
|
1113
|
+
readonly "2xl": "1.5rem";
|
|
1114
|
+
readonly "3xl": "1.875rem";
|
|
1115
|
+
readonly "4xl": "2.25rem";
|
|
1116
|
+
readonly "5xl": "3rem";
|
|
1117
|
+
readonly "6xl": "3.75rem";
|
|
1118
|
+
readonly "7xl": "4.5rem";
|
|
1119
|
+
};
|
|
1120
|
+
readonly fontWeight: {
|
|
1121
|
+
readonly thin: "100";
|
|
1122
|
+
readonly extralight: "200";
|
|
1123
|
+
readonly light: "300";
|
|
1124
|
+
readonly normal: "400";
|
|
1125
|
+
readonly medium: "500";
|
|
1126
|
+
readonly semibold: "600";
|
|
1127
|
+
readonly bold: "700";
|
|
1128
|
+
readonly extrabold: "800";
|
|
1129
|
+
readonly black: "900";
|
|
1130
|
+
};
|
|
1131
|
+
readonly lineHeight: {
|
|
1132
|
+
readonly none: "1";
|
|
1133
|
+
readonly tight: "1.25";
|
|
1134
|
+
readonly snug: "1.375";
|
|
1135
|
+
readonly normal: "1.5";
|
|
1136
|
+
readonly relaxed: "1.625";
|
|
1137
|
+
readonly loose: "2";
|
|
1138
|
+
readonly "3": "0.75rem";
|
|
1139
|
+
readonly "4": "1rem";
|
|
1140
|
+
readonly "5": "1.25rem";
|
|
1141
|
+
readonly "6": "1.5rem";
|
|
1142
|
+
readonly "7": "1.75rem";
|
|
1143
|
+
readonly "8": "2rem";
|
|
1144
|
+
readonly "9": "2.25rem";
|
|
1145
|
+
readonly "10": "2.5rem";
|
|
1146
|
+
};
|
|
1147
|
+
readonly letterSpacing: {
|
|
1148
|
+
readonly tighter: "-0.05em";
|
|
1149
|
+
readonly tight: "-0.025em";
|
|
1150
|
+
readonly normal: "0em";
|
|
1151
|
+
readonly wide: "0.025em";
|
|
1152
|
+
readonly wider: "0.05em";
|
|
1153
|
+
readonly widest: "0.1em";
|
|
1154
|
+
};
|
|
1155
|
+
};
|
|
1156
|
+
readonly radius: {
|
|
1157
|
+
readonly none: "0px";
|
|
1158
|
+
readonly xs: "0.125rem";
|
|
1159
|
+
readonly sm: "0.25rem";
|
|
1160
|
+
readonly md: "0.375rem";
|
|
1161
|
+
readonly lg: "0.5rem";
|
|
1162
|
+
readonly xl: "0.75rem";
|
|
1163
|
+
readonly "2xl": "1rem";
|
|
1164
|
+
readonly "3xl": "1.5rem";
|
|
1165
|
+
readonly full: "9999px";
|
|
1166
|
+
readonly default: "var(--tui-radius-md)";
|
|
1167
|
+
readonly button: "var(--tui-radius-md)";
|
|
1168
|
+
readonly input: "var(--tui-radius-md)";
|
|
1169
|
+
readonly card: "var(--tui-radius-lg)";
|
|
1170
|
+
readonly badge: "var(--tui-radius-full)";
|
|
1171
|
+
readonly avatar: "var(--tui-radius-full)";
|
|
1172
|
+
readonly modal: "var(--tui-radius-xl)";
|
|
1173
|
+
readonly tooltip: "var(--tui-radius-sm)";
|
|
1174
|
+
};
|
|
1175
|
+
readonly shadow: {
|
|
1176
|
+
readonly none: "none";
|
|
1177
|
+
readonly xs: "0 1px 2px 0 rgb(0 0 0 / 0.05)";
|
|
1178
|
+
readonly sm: "0 1px 3px 0 rgb(0 0 0 / 0.10), 0 1px 2px -1px rgb(0 0 0 / 0.10)";
|
|
1179
|
+
readonly md: "0 4px 6px -1px rgb(0 0 0 / 0.10), 0 2px 4px -2px rgb(0 0 0 / 0.10)";
|
|
1180
|
+
readonly lg: "0 10px 15px -3px rgb(0 0 0 / 0.10), 0 4px 6px -4px rgb(0 0 0 / 0.10)";
|
|
1181
|
+
readonly xl: "0 20px 25px -5px rgb(0 0 0 / 0.10), 0 8px 10px -6px rgb(0 0 0 / 0.10)";
|
|
1182
|
+
readonly "2xl": "0 25px 50px -12px rgb(0 0 0 / 0.25)";
|
|
1183
|
+
readonly inner: "inset 0 2px 4px 0 rgb(0 0 0 / 0.05)";
|
|
1184
|
+
readonly focus: "0 0 0 3px var(--tui-color-brand-pink-300, #f0abfc)";
|
|
1185
|
+
readonly focusBrand: "0 0 0 3px var(--tui-color-brand-pink-400, #e879f9)";
|
|
1186
|
+
readonly default: "var(--tui-shadow-sm)";
|
|
1187
|
+
readonly card: "var(--tui-shadow-md)";
|
|
1188
|
+
readonly dropdown: "var(--tui-shadow-lg)";
|
|
1189
|
+
readonly modal: "var(--tui-shadow-xl)";
|
|
1190
|
+
readonly tooltip: "var(--tui-shadow-md)";
|
|
1191
|
+
readonly button: "var(--tui-shadow-xs)";
|
|
1192
|
+
};
|
|
1193
|
+
readonly border: {
|
|
1194
|
+
readonly width: {
|
|
1195
|
+
readonly 0: "0px";
|
|
1196
|
+
readonly 0.5: "0.5px";
|
|
1197
|
+
readonly 1: "1px";
|
|
1198
|
+
readonly 1.5: "1.5px";
|
|
1199
|
+
readonly 2: "2px";
|
|
1200
|
+
readonly 2.5: "2.5px";
|
|
1201
|
+
readonly 3: "3px";
|
|
1202
|
+
readonly 3.5: "3.5px";
|
|
1203
|
+
readonly 4: "4px";
|
|
1204
|
+
readonly 4.5: "4.5px";
|
|
1205
|
+
readonly 5: "5px";
|
|
1206
|
+
readonly 5.5: "5.5px";
|
|
1207
|
+
readonly 8: "8px";
|
|
1208
|
+
readonly none: "0px";
|
|
1209
|
+
readonly xs: "0.5px";
|
|
1210
|
+
readonly sm: "1px";
|
|
1211
|
+
readonly md: "2px";
|
|
1212
|
+
readonly lg: "4px";
|
|
1213
|
+
readonly xl: "6px";
|
|
1214
|
+
readonly "2xl": "12px";
|
|
1215
|
+
readonly "3xl": "18px";
|
|
1216
|
+
readonly "4xl": "24px";
|
|
1217
|
+
readonly "5xl": "30px";
|
|
1218
|
+
readonly "6xl": "36px";
|
|
1219
|
+
readonly "7xl": "42px";
|
|
1220
|
+
readonly "8xl": "48px";
|
|
1221
|
+
readonly default: "var(--tui-border-width-1)";
|
|
1222
|
+
readonly input: "var(--tui-border-width-1)";
|
|
1223
|
+
readonly card: "var(--tui-border-width-1)";
|
|
1224
|
+
readonly divider: "var(--tui-border-width-1)";
|
|
1225
|
+
readonly thick: "var(--tui-border-width-2)";
|
|
1226
|
+
};
|
|
1227
|
+
readonly style: {
|
|
1228
|
+
readonly solid: "solid";
|
|
1229
|
+
readonly dashed: "dashed";
|
|
1230
|
+
readonly dotted: "dotted";
|
|
1231
|
+
readonly none: "none";
|
|
1232
|
+
};
|
|
1233
|
+
};
|
|
1234
|
+
readonly zIndex: {
|
|
1235
|
+
readonly hide: "-1";
|
|
1236
|
+
readonly auto: "auto";
|
|
1237
|
+
readonly base: "0";
|
|
1238
|
+
readonly raised: "1";
|
|
1239
|
+
readonly dropdown: "1000";
|
|
1240
|
+
readonly sticky: "1100";
|
|
1241
|
+
readonly overlay: "1200";
|
|
1242
|
+
readonly modal: "1300";
|
|
1243
|
+
readonly popover: "1400";
|
|
1244
|
+
readonly toast: "1500";
|
|
1245
|
+
readonly tooltip: "1600";
|
|
1246
|
+
};
|
|
1247
|
+
readonly animation: {
|
|
1248
|
+
readonly duration: {
|
|
1249
|
+
readonly instant: "0ms";
|
|
1250
|
+
readonly fast: "100ms";
|
|
1251
|
+
readonly normal: "200ms";
|
|
1252
|
+
readonly slow: "300ms";
|
|
1253
|
+
readonly slower: "500ms";
|
|
1254
|
+
readonly slowest: "700ms";
|
|
1255
|
+
readonly default: "var(--tui-duration-normal)";
|
|
1256
|
+
readonly hover: "var(--tui-duration-fast)";
|
|
1257
|
+
readonly modal: "var(--tui-duration-slow)";
|
|
1258
|
+
readonly tooltip: "var(--tui-duration-fast)";
|
|
1259
|
+
readonly collapse: "var(--tui-duration-slow)";
|
|
1260
|
+
};
|
|
1261
|
+
readonly easing: {
|
|
1262
|
+
readonly linear: "linear";
|
|
1263
|
+
readonly in: "cubic-bezier(0.4, 0, 1, 1)";
|
|
1264
|
+
readonly out: "cubic-bezier(0, 0, 0.2, 1)";
|
|
1265
|
+
readonly inOut: "cubic-bezier(0.4, 0, 0.2, 1)";
|
|
1266
|
+
readonly bounce: "cubic-bezier(0.34, 1.56, 0.64, 1)";
|
|
1267
|
+
readonly spring: "cubic-bezier(0.175, 0.885, 0.32, 1.275)";
|
|
1268
|
+
readonly default: "var(--tui-ease-in-out)";
|
|
1269
|
+
readonly enter: "var(--tui-ease-out)";
|
|
1270
|
+
readonly exit: "var(--tui-ease-in)";
|
|
1271
|
+
};
|
|
1272
|
+
};
|
|
1273
|
+
readonly breakpoint: {
|
|
1274
|
+
readonly xs: "320px";
|
|
1275
|
+
readonly sm: "640px";
|
|
1276
|
+
readonly md: "768px";
|
|
1277
|
+
readonly lg: "1024px";
|
|
1278
|
+
readonly xl: "1280px";
|
|
1279
|
+
readonly "2xl": "1536px";
|
|
1280
|
+
};
|
|
1281
|
+
readonly opacity: {
|
|
1282
|
+
readonly 0: "0";
|
|
1283
|
+
readonly 5: "0.05";
|
|
1284
|
+
readonly 10: "0.1";
|
|
1285
|
+
readonly 20: "0.2";
|
|
1286
|
+
readonly 25: "0.25";
|
|
1287
|
+
readonly 30: "0.3";
|
|
1288
|
+
readonly 35: "0.35";
|
|
1289
|
+
readonly 40: "0.4";
|
|
1290
|
+
readonly 45: "0.45";
|
|
1291
|
+
readonly 50: "0.5";
|
|
1292
|
+
readonly 55: "0.55";
|
|
1293
|
+
readonly 60: "0.6";
|
|
1294
|
+
readonly 65: "0.65";
|
|
1295
|
+
readonly 70: "0.7";
|
|
1296
|
+
readonly 75: "0.75";
|
|
1297
|
+
readonly 80: "0.8";
|
|
1298
|
+
readonly 85: "0.55";
|
|
1299
|
+
readonly 90: "0.9";
|
|
1300
|
+
readonly 95: "0.95";
|
|
1301
|
+
readonly 100: "1";
|
|
1302
|
+
};
|
|
1303
|
+
};
|
|
1304
|
+
type Tokens = typeof tokens;
|
|
1305
|
+
|
|
1306
|
+
export { type AnimationTokens, type BorderTokens, type BreakpointTokens, type ColorTokens, type OpacityTokens, type RadiusTokens, type ShadowTokens, type SpacingTokens, type Tokens, type TypographyTokens, type ZIndexTokens, animation, border, borderStyle, borderWidth, breakpoint, color, duration, easing, flattenTokens, fontFamily, fontSize, fontWeight, generateCSSCategory, letterSpacing, lineHeight, opacity, radius, shadow, spacing, toCSSRoot, tokens, typography, zIndex };
|