@diyet24/design-system 0.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +592 -0
- package/dist/index.cjs +32288 -0
- package/dist/index.cjs.map +1 -0
- package/dist/index.d.cts +1068 -0
- package/dist/index.d.ts +1068 -0
- package/dist/index.js +32042 -0
- package/dist/index.js.map +1 -0
- package/dist/styles.css +890 -0
- package/dist/tailwind/index.cjs +301 -0
- package/dist/tailwind/index.cjs.map +1 -0
- package/dist/tailwind/index.d.cts +583 -0
- package/dist/tailwind/index.d.ts +583 -0
- package/dist/tailwind/index.js +287 -0
- package/dist/tailwind/index.js.map +1 -0
- package/package.json +145 -0
|
@@ -0,0 +1,583 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Diyet24 Design System - Tailwind CSS Theme Configuration
|
|
3
|
+
*
|
|
4
|
+
* This module exports the design system theme values for use in
|
|
5
|
+
* consuming applications' Tailwind configurations.
|
|
6
|
+
*
|
|
7
|
+
* These colors reference CSS variables defined in styles/index.css
|
|
8
|
+
*/
|
|
9
|
+
declare const colors: {
|
|
10
|
+
readonly primary: {
|
|
11
|
+
readonly DEFAULT: "var(--color-primary)";
|
|
12
|
+
readonly foreground: "var(--primary-foreground)";
|
|
13
|
+
readonly 100: "var(--color-primary-100)";
|
|
14
|
+
readonly 200: "var(--color-primary-200)";
|
|
15
|
+
readonly 300: "var(--color-primary-300)";
|
|
16
|
+
readonly 400: "var(--color-primary-400)";
|
|
17
|
+
readonly 500: "var(--color-primary-500)";
|
|
18
|
+
readonly 600: "var(--color-primary-600)";
|
|
19
|
+
readonly 700: "var(--color-primary-700)";
|
|
20
|
+
readonly 800: "var(--color-primary-800)";
|
|
21
|
+
readonly 900: "var(--color-primary-900)";
|
|
22
|
+
};
|
|
23
|
+
readonly secondary: {
|
|
24
|
+
readonly DEFAULT: "var(--color-secondary)";
|
|
25
|
+
readonly foreground: "var(--secondary-foreground)";
|
|
26
|
+
readonly 100: "var(--color-secondary-100)";
|
|
27
|
+
readonly 200: "var(--color-secondary-200)";
|
|
28
|
+
readonly 300: "var(--color-secondary-300)";
|
|
29
|
+
readonly 400: "var(--color-secondary-400)";
|
|
30
|
+
readonly 500: "var(--color-secondary-500)";
|
|
31
|
+
readonly 600: "var(--color-secondary-600)";
|
|
32
|
+
readonly 700: "var(--color-secondary-700)";
|
|
33
|
+
readonly 800: "var(--color-secondary-800)";
|
|
34
|
+
readonly 900: "var(--color-secondary-900)";
|
|
35
|
+
};
|
|
36
|
+
readonly success: {
|
|
37
|
+
readonly DEFAULT: "var(--color-success)";
|
|
38
|
+
readonly 100: "var(--color-success-100)";
|
|
39
|
+
readonly 200: "var(--color-success-200)";
|
|
40
|
+
readonly 300: "var(--color-success-300)";
|
|
41
|
+
readonly 400: "var(--color-success-400)";
|
|
42
|
+
readonly 500: "var(--color-success-500)";
|
|
43
|
+
readonly 600: "var(--color-success-600)";
|
|
44
|
+
readonly 700: "var(--color-success-700)";
|
|
45
|
+
readonly 800: "var(--color-success-800)";
|
|
46
|
+
readonly 900: "var(--color-success-900)";
|
|
47
|
+
};
|
|
48
|
+
readonly warning: {
|
|
49
|
+
readonly DEFAULT: "var(--color-warning)";
|
|
50
|
+
readonly 100: "var(--color-warning-100)";
|
|
51
|
+
readonly 200: "var(--color-warning-200)";
|
|
52
|
+
readonly 300: "var(--color-warning-300)";
|
|
53
|
+
readonly 400: "var(--color-warning-400)";
|
|
54
|
+
readonly 500: "var(--color-warning-500)";
|
|
55
|
+
readonly 600: "var(--color-warning-600)";
|
|
56
|
+
readonly 700: "var(--color-warning-700)";
|
|
57
|
+
readonly 800: "var(--color-warning-800)";
|
|
58
|
+
readonly 900: "var(--color-warning-900)";
|
|
59
|
+
};
|
|
60
|
+
readonly danger: {
|
|
61
|
+
readonly DEFAULT: "var(--color-danger)";
|
|
62
|
+
readonly 100: "var(--color-danger-100)";
|
|
63
|
+
readonly 200: "var(--color-danger-200)";
|
|
64
|
+
readonly 300: "var(--color-danger-300)";
|
|
65
|
+
readonly 400: "var(--color-danger-400)";
|
|
66
|
+
readonly 500: "var(--color-danger-500)";
|
|
67
|
+
readonly 600: "var(--color-danger-600)";
|
|
68
|
+
readonly 700: "var(--color-danger-700)";
|
|
69
|
+
readonly 800: "var(--color-danger-800)";
|
|
70
|
+
readonly 900: "var(--color-danger-900)";
|
|
71
|
+
};
|
|
72
|
+
readonly info: {
|
|
73
|
+
readonly DEFAULT: "var(--color-info)";
|
|
74
|
+
readonly 100: "var(--color-info-100)";
|
|
75
|
+
readonly 200: "var(--color-info-200)";
|
|
76
|
+
readonly 300: "var(--color-info-300)";
|
|
77
|
+
readonly 400: "var(--color-info-400)";
|
|
78
|
+
readonly 500: "var(--color-info-500)";
|
|
79
|
+
readonly 600: "var(--color-info-600)";
|
|
80
|
+
readonly 700: "var(--color-info-700)";
|
|
81
|
+
readonly 800: "var(--color-info-800)";
|
|
82
|
+
readonly 900: "var(--color-info-900)";
|
|
83
|
+
};
|
|
84
|
+
readonly main: {
|
|
85
|
+
readonly DEFAULT: "var(--color-main)";
|
|
86
|
+
readonly foreground: "var(--main-foreground)";
|
|
87
|
+
readonly 100: "var(--color-main-100)";
|
|
88
|
+
readonly 200: "var(--color-main-200)";
|
|
89
|
+
readonly 300: "var(--color-main-300)";
|
|
90
|
+
readonly 400: "var(--color-main-400)";
|
|
91
|
+
readonly 500: "var(--color-main-500)";
|
|
92
|
+
readonly 600: "var(--color-main-600)";
|
|
93
|
+
readonly 700: "var(--color-main-700)";
|
|
94
|
+
readonly 800: "var(--color-main-800)";
|
|
95
|
+
readonly 900: "var(--color-main-900)";
|
|
96
|
+
};
|
|
97
|
+
readonly background: "var(--color-background)";
|
|
98
|
+
readonly foreground: "var(--color-foreground)";
|
|
99
|
+
readonly card: {
|
|
100
|
+
readonly DEFAULT: "var(--color-card)";
|
|
101
|
+
readonly foreground: "var(--color-card-foreground)";
|
|
102
|
+
};
|
|
103
|
+
readonly popover: {
|
|
104
|
+
readonly DEFAULT: "var(--color-popover)";
|
|
105
|
+
readonly foreground: "var(--color-popover-foreground)";
|
|
106
|
+
};
|
|
107
|
+
readonly muted: {
|
|
108
|
+
readonly DEFAULT: "var(--color-muted)";
|
|
109
|
+
readonly foreground: "var(--color-muted-foreground)";
|
|
110
|
+
};
|
|
111
|
+
readonly accent: {
|
|
112
|
+
readonly DEFAULT: "var(--color-accent)";
|
|
113
|
+
readonly foreground: "var(--color-accent-foreground)";
|
|
114
|
+
};
|
|
115
|
+
readonly destructive: {
|
|
116
|
+
readonly DEFAULT: "var(--color-destructive)";
|
|
117
|
+
readonly foreground: "var(--color-destructive-foreground)";
|
|
118
|
+
};
|
|
119
|
+
readonly border: "var(--color-border)";
|
|
120
|
+
readonly input: "var(--color-input)";
|
|
121
|
+
readonly ring: "var(--color-ring)";
|
|
122
|
+
readonly chart: {
|
|
123
|
+
readonly 1: "var(--color-chart-1)";
|
|
124
|
+
readonly 2: "var(--color-chart-2)";
|
|
125
|
+
readonly 3: "var(--color-chart-3)";
|
|
126
|
+
readonly 4: "var(--color-chart-4)";
|
|
127
|
+
readonly 5: "var(--color-chart-5)";
|
|
128
|
+
};
|
|
129
|
+
readonly sidebar: {
|
|
130
|
+
readonly DEFAULT: "var(--color-sidebar)";
|
|
131
|
+
readonly foreground: "var(--color-sidebar-foreground)";
|
|
132
|
+
readonly primary: "var(--color-sidebar-primary)";
|
|
133
|
+
readonly 'primary-foreground': "var(--color-sidebar-primary-foreground)";
|
|
134
|
+
readonly accent: "var(--color-sidebar-accent)";
|
|
135
|
+
readonly 'accent-foreground': "var(--color-sidebar-accent-foreground)";
|
|
136
|
+
readonly border: "var(--color-sidebar-border)";
|
|
137
|
+
readonly ring: "var(--color-sidebar-ring)";
|
|
138
|
+
};
|
|
139
|
+
};
|
|
140
|
+
declare const fontFamily: {
|
|
141
|
+
readonly sans: readonly ["Inter", "ui-sans-serif", "system-ui", "sans-serif", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"];
|
|
142
|
+
readonly mono: readonly ["JetBrains Mono", "ui-monospace", "SFMono-Regular", "Menlo", "Monaco", "Consolas", "Liberation Mono", "Courier New", "monospace"];
|
|
143
|
+
readonly heading: readonly ["Inter", "ui-sans-serif", "system-ui", "sans-serif"];
|
|
144
|
+
};
|
|
145
|
+
declare const fontSize: {
|
|
146
|
+
readonly xs: readonly ["0.75rem", {
|
|
147
|
+
readonly lineHeight: "1rem";
|
|
148
|
+
}];
|
|
149
|
+
readonly sm: readonly ["0.875rem", {
|
|
150
|
+
readonly lineHeight: "1.25rem";
|
|
151
|
+
}];
|
|
152
|
+
readonly base: readonly ["1rem", {
|
|
153
|
+
readonly lineHeight: "1.5rem";
|
|
154
|
+
}];
|
|
155
|
+
readonly lg: readonly ["1.125rem", {
|
|
156
|
+
readonly lineHeight: "1.75rem";
|
|
157
|
+
}];
|
|
158
|
+
readonly xl: readonly ["1.25rem", {
|
|
159
|
+
readonly lineHeight: "1.75rem";
|
|
160
|
+
}];
|
|
161
|
+
readonly '2xl': readonly ["1.5rem", {
|
|
162
|
+
readonly lineHeight: "2rem";
|
|
163
|
+
}];
|
|
164
|
+
readonly '3xl': readonly ["1.875rem", {
|
|
165
|
+
readonly lineHeight: "2.25rem";
|
|
166
|
+
}];
|
|
167
|
+
readonly '4xl': readonly ["2.25rem", {
|
|
168
|
+
readonly lineHeight: "2.5rem";
|
|
169
|
+
}];
|
|
170
|
+
readonly '5xl': readonly ["3rem", {
|
|
171
|
+
readonly lineHeight: "1";
|
|
172
|
+
}];
|
|
173
|
+
readonly '6xl': readonly ["3.75rem", {
|
|
174
|
+
readonly lineHeight: "1";
|
|
175
|
+
}];
|
|
176
|
+
};
|
|
177
|
+
declare const borderRadius: {
|
|
178
|
+
readonly none: "0";
|
|
179
|
+
readonly sm: "0.125rem";
|
|
180
|
+
readonly DEFAULT: "0.25rem";
|
|
181
|
+
readonly md: "0.375rem";
|
|
182
|
+
readonly lg: "0.5rem";
|
|
183
|
+
readonly xl: "0.75rem";
|
|
184
|
+
readonly '2xl': "1rem";
|
|
185
|
+
readonly '3xl': "1.5rem";
|
|
186
|
+
readonly full: "9999px";
|
|
187
|
+
};
|
|
188
|
+
declare const boxShadow: {
|
|
189
|
+
readonly xs: "0 1px 2px 0 rgb(0 0 0 / 0.05)";
|
|
190
|
+
readonly sm: "0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)";
|
|
191
|
+
readonly DEFAULT: "0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)";
|
|
192
|
+
readonly md: "0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)";
|
|
193
|
+
readonly lg: "0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1)";
|
|
194
|
+
readonly xl: "0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1)";
|
|
195
|
+
readonly '2xl': "0 25px 50px -12px rgb(0 0 0 / 0.25)";
|
|
196
|
+
readonly inner: "inset 0 2px 4px 0 rgb(0 0 0 / 0.05)";
|
|
197
|
+
readonly none: "none";
|
|
198
|
+
readonly 'primary-sm': "var(--shadow-sm-primary)";
|
|
199
|
+
readonly 'primary-md': "var(--shadow-md-primary)";
|
|
200
|
+
readonly 'primary-lg': "var(--shadow-lg-primary)";
|
|
201
|
+
readonly 'secondary-sm': "var(--shadow-sm-secondary)";
|
|
202
|
+
readonly 'secondary-md': "var(--shadow-md-secondary)";
|
|
203
|
+
readonly 'secondary-lg': "var(--shadow-lg-secondary)";
|
|
204
|
+
readonly 'success-sm': "var(--shadow-sm-success)";
|
|
205
|
+
readonly 'success-md': "var(--shadow-md-success)";
|
|
206
|
+
readonly 'success-lg': "var(--shadow-lg-success)";
|
|
207
|
+
readonly 'warning-sm': "var(--shadow-sm-warning)";
|
|
208
|
+
readonly 'warning-md': "var(--shadow-md-warning)";
|
|
209
|
+
readonly 'warning-lg': "var(--shadow-lg-warning)";
|
|
210
|
+
readonly 'danger-sm': "var(--shadow-sm-danger)";
|
|
211
|
+
readonly 'danger-md': "var(--shadow-md-danger)";
|
|
212
|
+
readonly 'danger-lg': "var(--shadow-lg-danger)";
|
|
213
|
+
readonly 'info-sm': "var(--shadow-sm-info)";
|
|
214
|
+
readonly 'info-md': "var(--shadow-md-info)";
|
|
215
|
+
readonly 'info-lg': "var(--shadow-lg-info)";
|
|
216
|
+
readonly 'main-sm': "var(--shadow-sm-main)";
|
|
217
|
+
readonly 'main-md': "var(--shadow-md-main)";
|
|
218
|
+
readonly 'main-lg': "var(--shadow-lg-main)";
|
|
219
|
+
};
|
|
220
|
+
declare const zIndex: {
|
|
221
|
+
readonly dropdown: "1000";
|
|
222
|
+
readonly sticky: "1020";
|
|
223
|
+
readonly fixed: "1030";
|
|
224
|
+
readonly 'modal-backdrop': "1040";
|
|
225
|
+
readonly modal: "1050";
|
|
226
|
+
readonly popover: "1060";
|
|
227
|
+
readonly tooltip: "1070";
|
|
228
|
+
};
|
|
229
|
+
declare const screens: {
|
|
230
|
+
readonly xs: "20rem";
|
|
231
|
+
readonly sm: "40rem";
|
|
232
|
+
readonly md: "48rem";
|
|
233
|
+
readonly lg: "64rem";
|
|
234
|
+
readonly xl: "80rem";
|
|
235
|
+
readonly '2xl': "96rem";
|
|
236
|
+
};
|
|
237
|
+
declare const keyframes: {
|
|
238
|
+
readonly 'accordion-down': {
|
|
239
|
+
readonly from: {
|
|
240
|
+
readonly height: "0";
|
|
241
|
+
readonly opacity: "0";
|
|
242
|
+
};
|
|
243
|
+
readonly to: {
|
|
244
|
+
readonly height: "var(--radix-accordion-content-height)";
|
|
245
|
+
readonly opacity: "1";
|
|
246
|
+
};
|
|
247
|
+
};
|
|
248
|
+
readonly 'accordion-up': {
|
|
249
|
+
readonly from: {
|
|
250
|
+
readonly height: "var(--radix-accordion-content-height)";
|
|
251
|
+
readonly opacity: "1";
|
|
252
|
+
};
|
|
253
|
+
readonly to: {
|
|
254
|
+
readonly height: "0";
|
|
255
|
+
readonly opacity: "0";
|
|
256
|
+
};
|
|
257
|
+
};
|
|
258
|
+
readonly 'collapsible-down': {
|
|
259
|
+
readonly from: {
|
|
260
|
+
readonly height: "0";
|
|
261
|
+
readonly opacity: "0";
|
|
262
|
+
};
|
|
263
|
+
readonly to: {
|
|
264
|
+
readonly height: "var(--radix-collapsible-content-height)";
|
|
265
|
+
readonly opacity: "1";
|
|
266
|
+
};
|
|
267
|
+
};
|
|
268
|
+
readonly 'collapsible-up': {
|
|
269
|
+
readonly from: {
|
|
270
|
+
readonly height: "var(--radix-collapsible-content-height)";
|
|
271
|
+
readonly opacity: "1";
|
|
272
|
+
};
|
|
273
|
+
readonly to: {
|
|
274
|
+
readonly height: "0";
|
|
275
|
+
readonly opacity: "0";
|
|
276
|
+
};
|
|
277
|
+
};
|
|
278
|
+
};
|
|
279
|
+
declare const animation: {
|
|
280
|
+
readonly 'accordion-down': "accordion-down 0.3s cubic-bezier(0.4, 0, 0.2, 1)";
|
|
281
|
+
readonly 'accordion-up': "accordion-up 0.3s cubic-bezier(0.4, 0, 0.2, 1)";
|
|
282
|
+
readonly 'collapsible-down': "collapsible-down 0.3s cubic-bezier(0.4, 0, 0.2, 1)";
|
|
283
|
+
readonly 'collapsible-up': "collapsible-up 0.3s cubic-bezier(0.4, 0, 0.2, 1)";
|
|
284
|
+
readonly in: "fadeIn 150ms cubic-bezier(0.16, 1, 0.3, 1)";
|
|
285
|
+
readonly out: "fadeOut 150ms cubic-bezier(0.16, 1, 0.3, 1)";
|
|
286
|
+
};
|
|
287
|
+
/**
|
|
288
|
+
* Complete theme preset for Tailwind CSS
|
|
289
|
+
* Use this in your tailwind.config.js:
|
|
290
|
+
*
|
|
291
|
+
* import { themePreset } from '@diyet24/design-system/tailwind';
|
|
292
|
+
*
|
|
293
|
+
* export default {
|
|
294
|
+
* presets: [themePreset],
|
|
295
|
+
* // ... your other config
|
|
296
|
+
* }
|
|
297
|
+
*/
|
|
298
|
+
declare const themePreset: {
|
|
299
|
+
theme: {
|
|
300
|
+
extend: {
|
|
301
|
+
colors: {
|
|
302
|
+
readonly primary: {
|
|
303
|
+
readonly DEFAULT: "var(--color-primary)";
|
|
304
|
+
readonly foreground: "var(--primary-foreground)";
|
|
305
|
+
readonly 100: "var(--color-primary-100)";
|
|
306
|
+
readonly 200: "var(--color-primary-200)";
|
|
307
|
+
readonly 300: "var(--color-primary-300)";
|
|
308
|
+
readonly 400: "var(--color-primary-400)";
|
|
309
|
+
readonly 500: "var(--color-primary-500)";
|
|
310
|
+
readonly 600: "var(--color-primary-600)";
|
|
311
|
+
readonly 700: "var(--color-primary-700)";
|
|
312
|
+
readonly 800: "var(--color-primary-800)";
|
|
313
|
+
readonly 900: "var(--color-primary-900)";
|
|
314
|
+
};
|
|
315
|
+
readonly secondary: {
|
|
316
|
+
readonly DEFAULT: "var(--color-secondary)";
|
|
317
|
+
readonly foreground: "var(--secondary-foreground)";
|
|
318
|
+
readonly 100: "var(--color-secondary-100)";
|
|
319
|
+
readonly 200: "var(--color-secondary-200)";
|
|
320
|
+
readonly 300: "var(--color-secondary-300)";
|
|
321
|
+
readonly 400: "var(--color-secondary-400)";
|
|
322
|
+
readonly 500: "var(--color-secondary-500)";
|
|
323
|
+
readonly 600: "var(--color-secondary-600)";
|
|
324
|
+
readonly 700: "var(--color-secondary-700)";
|
|
325
|
+
readonly 800: "var(--color-secondary-800)";
|
|
326
|
+
readonly 900: "var(--color-secondary-900)";
|
|
327
|
+
};
|
|
328
|
+
readonly success: {
|
|
329
|
+
readonly DEFAULT: "var(--color-success)";
|
|
330
|
+
readonly 100: "var(--color-success-100)";
|
|
331
|
+
readonly 200: "var(--color-success-200)";
|
|
332
|
+
readonly 300: "var(--color-success-300)";
|
|
333
|
+
readonly 400: "var(--color-success-400)";
|
|
334
|
+
readonly 500: "var(--color-success-500)";
|
|
335
|
+
readonly 600: "var(--color-success-600)";
|
|
336
|
+
readonly 700: "var(--color-success-700)";
|
|
337
|
+
readonly 800: "var(--color-success-800)";
|
|
338
|
+
readonly 900: "var(--color-success-900)";
|
|
339
|
+
};
|
|
340
|
+
readonly warning: {
|
|
341
|
+
readonly DEFAULT: "var(--color-warning)";
|
|
342
|
+
readonly 100: "var(--color-warning-100)";
|
|
343
|
+
readonly 200: "var(--color-warning-200)";
|
|
344
|
+
readonly 300: "var(--color-warning-300)";
|
|
345
|
+
readonly 400: "var(--color-warning-400)";
|
|
346
|
+
readonly 500: "var(--color-warning-500)";
|
|
347
|
+
readonly 600: "var(--color-warning-600)";
|
|
348
|
+
readonly 700: "var(--color-warning-700)";
|
|
349
|
+
readonly 800: "var(--color-warning-800)";
|
|
350
|
+
readonly 900: "var(--color-warning-900)";
|
|
351
|
+
};
|
|
352
|
+
readonly danger: {
|
|
353
|
+
readonly DEFAULT: "var(--color-danger)";
|
|
354
|
+
readonly 100: "var(--color-danger-100)";
|
|
355
|
+
readonly 200: "var(--color-danger-200)";
|
|
356
|
+
readonly 300: "var(--color-danger-300)";
|
|
357
|
+
readonly 400: "var(--color-danger-400)";
|
|
358
|
+
readonly 500: "var(--color-danger-500)";
|
|
359
|
+
readonly 600: "var(--color-danger-600)";
|
|
360
|
+
readonly 700: "var(--color-danger-700)";
|
|
361
|
+
readonly 800: "var(--color-danger-800)";
|
|
362
|
+
readonly 900: "var(--color-danger-900)";
|
|
363
|
+
};
|
|
364
|
+
readonly info: {
|
|
365
|
+
readonly DEFAULT: "var(--color-info)";
|
|
366
|
+
readonly 100: "var(--color-info-100)";
|
|
367
|
+
readonly 200: "var(--color-info-200)";
|
|
368
|
+
readonly 300: "var(--color-info-300)";
|
|
369
|
+
readonly 400: "var(--color-info-400)";
|
|
370
|
+
readonly 500: "var(--color-info-500)";
|
|
371
|
+
readonly 600: "var(--color-info-600)";
|
|
372
|
+
readonly 700: "var(--color-info-700)";
|
|
373
|
+
readonly 800: "var(--color-info-800)";
|
|
374
|
+
readonly 900: "var(--color-info-900)";
|
|
375
|
+
};
|
|
376
|
+
readonly main: {
|
|
377
|
+
readonly DEFAULT: "var(--color-main)";
|
|
378
|
+
readonly foreground: "var(--main-foreground)";
|
|
379
|
+
readonly 100: "var(--color-main-100)";
|
|
380
|
+
readonly 200: "var(--color-main-200)";
|
|
381
|
+
readonly 300: "var(--color-main-300)";
|
|
382
|
+
readonly 400: "var(--color-main-400)";
|
|
383
|
+
readonly 500: "var(--color-main-500)";
|
|
384
|
+
readonly 600: "var(--color-main-600)";
|
|
385
|
+
readonly 700: "var(--color-main-700)";
|
|
386
|
+
readonly 800: "var(--color-main-800)";
|
|
387
|
+
readonly 900: "var(--color-main-900)";
|
|
388
|
+
};
|
|
389
|
+
readonly background: "var(--color-background)";
|
|
390
|
+
readonly foreground: "var(--color-foreground)";
|
|
391
|
+
readonly card: {
|
|
392
|
+
readonly DEFAULT: "var(--color-card)";
|
|
393
|
+
readonly foreground: "var(--color-card-foreground)";
|
|
394
|
+
};
|
|
395
|
+
readonly popover: {
|
|
396
|
+
readonly DEFAULT: "var(--color-popover)";
|
|
397
|
+
readonly foreground: "var(--color-popover-foreground)";
|
|
398
|
+
};
|
|
399
|
+
readonly muted: {
|
|
400
|
+
readonly DEFAULT: "var(--color-muted)";
|
|
401
|
+
readonly foreground: "var(--color-muted-foreground)";
|
|
402
|
+
};
|
|
403
|
+
readonly accent: {
|
|
404
|
+
readonly DEFAULT: "var(--color-accent)";
|
|
405
|
+
readonly foreground: "var(--color-accent-foreground)";
|
|
406
|
+
};
|
|
407
|
+
readonly destructive: {
|
|
408
|
+
readonly DEFAULT: "var(--color-destructive)";
|
|
409
|
+
readonly foreground: "var(--color-destructive-foreground)";
|
|
410
|
+
};
|
|
411
|
+
readonly border: "var(--color-border)";
|
|
412
|
+
readonly input: "var(--color-input)";
|
|
413
|
+
readonly ring: "var(--color-ring)";
|
|
414
|
+
readonly chart: {
|
|
415
|
+
readonly 1: "var(--color-chart-1)";
|
|
416
|
+
readonly 2: "var(--color-chart-2)";
|
|
417
|
+
readonly 3: "var(--color-chart-3)";
|
|
418
|
+
readonly 4: "var(--color-chart-4)";
|
|
419
|
+
readonly 5: "var(--color-chart-5)";
|
|
420
|
+
};
|
|
421
|
+
readonly sidebar: {
|
|
422
|
+
readonly DEFAULT: "var(--color-sidebar)";
|
|
423
|
+
readonly foreground: "var(--color-sidebar-foreground)";
|
|
424
|
+
readonly primary: "var(--color-sidebar-primary)";
|
|
425
|
+
readonly 'primary-foreground': "var(--color-sidebar-primary-foreground)";
|
|
426
|
+
readonly accent: "var(--color-sidebar-accent)";
|
|
427
|
+
readonly 'accent-foreground': "var(--color-sidebar-accent-foreground)";
|
|
428
|
+
readonly border: "var(--color-sidebar-border)";
|
|
429
|
+
readonly ring: "var(--color-sidebar-ring)";
|
|
430
|
+
};
|
|
431
|
+
};
|
|
432
|
+
fontFamily: {
|
|
433
|
+
readonly sans: readonly ["Inter", "ui-sans-serif", "system-ui", "sans-serif", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"];
|
|
434
|
+
readonly mono: readonly ["JetBrains Mono", "ui-monospace", "SFMono-Regular", "Menlo", "Monaco", "Consolas", "Liberation Mono", "Courier New", "monospace"];
|
|
435
|
+
readonly heading: readonly ["Inter", "ui-sans-serif", "system-ui", "sans-serif"];
|
|
436
|
+
};
|
|
437
|
+
fontSize: {
|
|
438
|
+
readonly xs: readonly ["0.75rem", {
|
|
439
|
+
readonly lineHeight: "1rem";
|
|
440
|
+
}];
|
|
441
|
+
readonly sm: readonly ["0.875rem", {
|
|
442
|
+
readonly lineHeight: "1.25rem";
|
|
443
|
+
}];
|
|
444
|
+
readonly base: readonly ["1rem", {
|
|
445
|
+
readonly lineHeight: "1.5rem";
|
|
446
|
+
}];
|
|
447
|
+
readonly lg: readonly ["1.125rem", {
|
|
448
|
+
readonly lineHeight: "1.75rem";
|
|
449
|
+
}];
|
|
450
|
+
readonly xl: readonly ["1.25rem", {
|
|
451
|
+
readonly lineHeight: "1.75rem";
|
|
452
|
+
}];
|
|
453
|
+
readonly '2xl': readonly ["1.5rem", {
|
|
454
|
+
readonly lineHeight: "2rem";
|
|
455
|
+
}];
|
|
456
|
+
readonly '3xl': readonly ["1.875rem", {
|
|
457
|
+
readonly lineHeight: "2.25rem";
|
|
458
|
+
}];
|
|
459
|
+
readonly '4xl': readonly ["2.25rem", {
|
|
460
|
+
readonly lineHeight: "2.5rem";
|
|
461
|
+
}];
|
|
462
|
+
readonly '5xl': readonly ["3rem", {
|
|
463
|
+
readonly lineHeight: "1";
|
|
464
|
+
}];
|
|
465
|
+
readonly '6xl': readonly ["3.75rem", {
|
|
466
|
+
readonly lineHeight: "1";
|
|
467
|
+
}];
|
|
468
|
+
};
|
|
469
|
+
borderRadius: {
|
|
470
|
+
readonly none: "0";
|
|
471
|
+
readonly sm: "0.125rem";
|
|
472
|
+
readonly DEFAULT: "0.25rem";
|
|
473
|
+
readonly md: "0.375rem";
|
|
474
|
+
readonly lg: "0.5rem";
|
|
475
|
+
readonly xl: "0.75rem";
|
|
476
|
+
readonly '2xl': "1rem";
|
|
477
|
+
readonly '3xl': "1.5rem";
|
|
478
|
+
readonly full: "9999px";
|
|
479
|
+
};
|
|
480
|
+
boxShadow: {
|
|
481
|
+
readonly xs: "0 1px 2px 0 rgb(0 0 0 / 0.05)";
|
|
482
|
+
readonly sm: "0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)";
|
|
483
|
+
readonly DEFAULT: "0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)";
|
|
484
|
+
readonly md: "0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)";
|
|
485
|
+
readonly lg: "0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1)";
|
|
486
|
+
readonly xl: "0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1)";
|
|
487
|
+
readonly '2xl': "0 25px 50px -12px rgb(0 0 0 / 0.25)";
|
|
488
|
+
readonly inner: "inset 0 2px 4px 0 rgb(0 0 0 / 0.05)";
|
|
489
|
+
readonly none: "none";
|
|
490
|
+
readonly 'primary-sm': "var(--shadow-sm-primary)";
|
|
491
|
+
readonly 'primary-md': "var(--shadow-md-primary)";
|
|
492
|
+
readonly 'primary-lg': "var(--shadow-lg-primary)";
|
|
493
|
+
readonly 'secondary-sm': "var(--shadow-sm-secondary)";
|
|
494
|
+
readonly 'secondary-md': "var(--shadow-md-secondary)";
|
|
495
|
+
readonly 'secondary-lg': "var(--shadow-lg-secondary)";
|
|
496
|
+
readonly 'success-sm': "var(--shadow-sm-success)";
|
|
497
|
+
readonly 'success-md': "var(--shadow-md-success)";
|
|
498
|
+
readonly 'success-lg': "var(--shadow-lg-success)";
|
|
499
|
+
readonly 'warning-sm': "var(--shadow-sm-warning)";
|
|
500
|
+
readonly 'warning-md': "var(--shadow-md-warning)";
|
|
501
|
+
readonly 'warning-lg': "var(--shadow-lg-warning)";
|
|
502
|
+
readonly 'danger-sm': "var(--shadow-sm-danger)";
|
|
503
|
+
readonly 'danger-md': "var(--shadow-md-danger)";
|
|
504
|
+
readonly 'danger-lg': "var(--shadow-lg-danger)";
|
|
505
|
+
readonly 'info-sm': "var(--shadow-sm-info)";
|
|
506
|
+
readonly 'info-md': "var(--shadow-md-info)";
|
|
507
|
+
readonly 'info-lg': "var(--shadow-lg-info)";
|
|
508
|
+
readonly 'main-sm': "var(--shadow-sm-main)";
|
|
509
|
+
readonly 'main-md': "var(--shadow-md-main)";
|
|
510
|
+
readonly 'main-lg': "var(--shadow-lg-main)";
|
|
511
|
+
};
|
|
512
|
+
zIndex: {
|
|
513
|
+
readonly dropdown: "1000";
|
|
514
|
+
readonly sticky: "1020";
|
|
515
|
+
readonly fixed: "1030";
|
|
516
|
+
readonly 'modal-backdrop': "1040";
|
|
517
|
+
readonly modal: "1050";
|
|
518
|
+
readonly popover: "1060";
|
|
519
|
+
readonly tooltip: "1070";
|
|
520
|
+
};
|
|
521
|
+
screens: {
|
|
522
|
+
readonly xs: "20rem";
|
|
523
|
+
readonly sm: "40rem";
|
|
524
|
+
readonly md: "48rem";
|
|
525
|
+
readonly lg: "64rem";
|
|
526
|
+
readonly xl: "80rem";
|
|
527
|
+
readonly '2xl': "96rem";
|
|
528
|
+
};
|
|
529
|
+
keyframes: {
|
|
530
|
+
readonly 'accordion-down': {
|
|
531
|
+
readonly from: {
|
|
532
|
+
readonly height: "0";
|
|
533
|
+
readonly opacity: "0";
|
|
534
|
+
};
|
|
535
|
+
readonly to: {
|
|
536
|
+
readonly height: "var(--radix-accordion-content-height)";
|
|
537
|
+
readonly opacity: "1";
|
|
538
|
+
};
|
|
539
|
+
};
|
|
540
|
+
readonly 'accordion-up': {
|
|
541
|
+
readonly from: {
|
|
542
|
+
readonly height: "var(--radix-accordion-content-height)";
|
|
543
|
+
readonly opacity: "1";
|
|
544
|
+
};
|
|
545
|
+
readonly to: {
|
|
546
|
+
readonly height: "0";
|
|
547
|
+
readonly opacity: "0";
|
|
548
|
+
};
|
|
549
|
+
};
|
|
550
|
+
readonly 'collapsible-down': {
|
|
551
|
+
readonly from: {
|
|
552
|
+
readonly height: "0";
|
|
553
|
+
readonly opacity: "0";
|
|
554
|
+
};
|
|
555
|
+
readonly to: {
|
|
556
|
+
readonly height: "var(--radix-collapsible-content-height)";
|
|
557
|
+
readonly opacity: "1";
|
|
558
|
+
};
|
|
559
|
+
};
|
|
560
|
+
readonly 'collapsible-up': {
|
|
561
|
+
readonly from: {
|
|
562
|
+
readonly height: "var(--radix-collapsible-content-height)";
|
|
563
|
+
readonly opacity: "1";
|
|
564
|
+
};
|
|
565
|
+
readonly to: {
|
|
566
|
+
readonly height: "0";
|
|
567
|
+
readonly opacity: "0";
|
|
568
|
+
};
|
|
569
|
+
};
|
|
570
|
+
};
|
|
571
|
+
animation: {
|
|
572
|
+
readonly 'accordion-down': "accordion-down 0.3s cubic-bezier(0.4, 0, 0.2, 1)";
|
|
573
|
+
readonly 'accordion-up': "accordion-up 0.3s cubic-bezier(0.4, 0, 0.2, 1)";
|
|
574
|
+
readonly 'collapsible-down': "collapsible-down 0.3s cubic-bezier(0.4, 0, 0.2, 1)";
|
|
575
|
+
readonly 'collapsible-up': "collapsible-up 0.3s cubic-bezier(0.4, 0, 0.2, 1)";
|
|
576
|
+
readonly in: "fadeIn 150ms cubic-bezier(0.16, 1, 0.3, 1)";
|
|
577
|
+
readonly out: "fadeOut 150ms cubic-bezier(0.16, 1, 0.3, 1)";
|
|
578
|
+
};
|
|
579
|
+
};
|
|
580
|
+
};
|
|
581
|
+
};
|
|
582
|
+
|
|
583
|
+
export { animation, borderRadius, boxShadow, colors, themePreset as default, fontFamily, fontSize, keyframes, screens, themePreset, zIndex };
|