tailwind-styled-v4 1.0.1 → 5.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (74) hide show
  1. package/dist/animate.cjs +771 -0
  2. package/dist/animate.cjs.map +1 -0
  3. package/dist/animate.d.cts +73 -0
  4. package/dist/animate.d.ts +73 -0
  5. package/dist/animate.js +752 -0
  6. package/dist/animate.js.map +1 -0
  7. package/dist/chunk-VZEJV27B.js +11 -0
  8. package/dist/chunk-VZEJV27B.js.map +1 -0
  9. package/dist/chunk-Y5D3E72P.cjs +13 -0
  10. package/dist/chunk-Y5D3E72P.cjs.map +1 -0
  11. package/dist/css.cjs +121 -0
  12. package/dist/css.cjs.map +1 -0
  13. package/dist/css.d.cts +30 -0
  14. package/dist/css.d.ts +30 -0
  15. package/dist/css.js +112 -0
  16. package/dist/css.js.map +1 -0
  17. package/dist/devtools.cjs +1071 -0
  18. package/dist/devtools.cjs.map +1 -0
  19. package/dist/devtools.d.cts +22 -0
  20. package/dist/devtools.d.ts +22 -0
  21. package/dist/devtools.js +1064 -0
  22. package/dist/devtools.js.map +1 -0
  23. package/dist/index.cjs +1353 -0
  24. package/dist/index.cjs.map +1 -0
  25. package/dist/index.d.cts +655 -0
  26. package/dist/index.d.ts +508 -968
  27. package/dist/index.js +1304 -3
  28. package/dist/index.js.map +1 -1
  29. package/dist/next.cjs +248 -0
  30. package/dist/next.cjs.map +1 -0
  31. package/dist/next.d.cts +54 -0
  32. package/dist/next.d.ts +54 -0
  33. package/dist/next.js +241 -0
  34. package/dist/next.js.map +1 -0
  35. package/dist/preset.cjs +423 -0
  36. package/dist/preset.cjs.map +1 -0
  37. package/dist/preset.d.cts +276 -0
  38. package/dist/preset.d.ts +276 -0
  39. package/dist/preset.js +416 -0
  40. package/dist/preset.js.map +1 -0
  41. package/dist/turbopackLoader.cjs +37 -0
  42. package/dist/turbopackLoader.cjs.map +1 -0
  43. package/dist/turbopackLoader.d.cts +12 -0
  44. package/dist/turbopackLoader.d.ts +12 -0
  45. package/dist/turbopackLoader.js +35 -0
  46. package/dist/turbopackLoader.js.map +1 -0
  47. package/dist/vite.cjs +138 -0
  48. package/dist/vite.cjs.map +1 -0
  49. package/dist/vite.d.cts +51 -0
  50. package/dist/vite.d.ts +51 -0
  51. package/dist/vite.js +128 -0
  52. package/dist/vite.js.map +1 -0
  53. package/dist/webpackLoader.cjs +51 -0
  54. package/dist/webpackLoader.cjs.map +1 -0
  55. package/dist/webpackLoader.d.cts +17 -0
  56. package/dist/webpackLoader.d.ts +17 -0
  57. package/dist/webpackLoader.js +49 -0
  58. package/dist/webpackLoader.js.map +1 -0
  59. package/package.json +65 -32
  60. package/CHANGELOG.md +0 -75
  61. package/LICENSE +0 -21
  62. package/README.md +0 -608
  63. package/dist/cli/init.js +0 -208
  64. package/dist/compiler/index.d.mts +0 -214
  65. package/dist/compiler/index.d.ts +0 -214
  66. package/dist/compiler/index.js +0 -546
  67. package/dist/compiler/index.js.map +0 -1
  68. package/dist/compiler/index.mjs +0 -504
  69. package/dist/compiler/index.mjs.map +0 -1
  70. package/dist/index.d.mts +0 -1115
  71. package/dist/index.mjs +0 -4
  72. package/dist/index.mjs.map +0 -1
  73. package/dist/turbopack-loader.js +0 -232
  74. package/dist/webpack-loader.js +0 -213
package/dist/preset.d.cts ADDED
@@ -0,0 +1,276 @@
1
+ /**
2
+ * tailwind-styled-v4 — Default Preset
3
+ *
4
+ * Tailwind config built-in yang dipakai ketika developer tidak punya
5
+ * tailwind.config.ts / tailwind.config.js di project mereka.
6
+ *
7
+ * Developer tidak perlu setup apapun:
8
+ * npm install tailwind-styled-v4
9
+ * → langsung bisa tw.div`p-4 bg-blue-500`
10
+ *
11
+ * Preset ini juga menyediakan design tokens yang consistent
12
+ * untuk semua project yang pakai tailwind-styled-v4.
13
+ *
14
+ * Override per-project:
15
+ * // tailwind.config.ts
16
+ * import { defaultPreset } from "tailwind-styled-v4/preset"
17
+ * export default { presets: [defaultPreset], theme: { extend: {...} } }
18
+ */
19
+ declare const designTokens: {
20
+ readonly colors: {
21
+ readonly primary: {
22
+ readonly DEFAULT: "#3b82f6";
23
+ readonly hover: "#2563eb";
24
+ readonly active: "#1d4ed8";
25
+ readonly foreground: "#ffffff";
26
+ };
27
+ readonly secondary: {
28
+ readonly DEFAULT: "#6366f1";
29
+ readonly hover: "#4f46e5";
30
+ readonly active: "#4338ca";
31
+ readonly foreground: "#ffffff";
32
+ };
33
+ readonly accent: {
34
+ readonly DEFAULT: "#f59e0b";
35
+ readonly hover: "#d97706";
36
+ readonly active: "#b45309";
37
+ readonly foreground: "#000000";
38
+ };
39
+ readonly success: {
40
+ readonly DEFAULT: "#10b981";
41
+ readonly foreground: "#ffffff";
42
+ };
43
+ readonly warning: {
44
+ readonly DEFAULT: "#f59e0b";
45
+ readonly foreground: "#000000";
46
+ };
47
+ readonly danger: {
48
+ readonly DEFAULT: "#ef4444";
49
+ readonly foreground: "#ffffff";
50
+ };
51
+ readonly info: {
52
+ readonly DEFAULT: "#3b82f6";
53
+ readonly foreground: "#ffffff";
54
+ };
55
+ readonly surface: "#18181b";
56
+ readonly border: "#27272a";
57
+ readonly muted: "#71717a";
58
+ readonly subtle: "#3f3f46";
59
+ };
60
+ readonly spacing: {
61
+ readonly 1: "0.25rem";
62
+ readonly 2: "0.5rem";
63
+ readonly 3: "0.75rem";
64
+ readonly 4: "1rem";
65
+ readonly 5: "1.25rem";
66
+ readonly 6: "1.5rem";
67
+ readonly 8: "2rem";
68
+ readonly 10: "2.5rem";
69
+ readonly 12: "3rem";
70
+ readonly 16: "4rem";
71
+ };
72
+ readonly breakpoints: {
73
+ readonly sm: "40rem";
74
+ readonly md: "48rem";
75
+ readonly lg: "64rem";
76
+ readonly xl: "80rem";
77
+ readonly "2xl": "96rem";
78
+ };
79
+ readonly fontWeight: {
80
+ readonly normal: "400";
81
+ readonly medium: "500";
82
+ readonly semibold: "600";
83
+ readonly bold: "700";
84
+ };
85
+ readonly fontFamily: {
86
+ readonly sans: readonly ["InterVariable", "Inter", "system-ui", "sans-serif"];
87
+ readonly mono: readonly ["JetBrains Mono", "Fira Code", "Consolas", "monospace"];
88
+ };
89
+ readonly borderRadius: {
90
+ readonly sm: "0.25rem";
91
+ readonly DEFAULT: "0.5rem";
92
+ readonly md: "0.5rem";
93
+ readonly lg: "0.75rem";
94
+ readonly xl: "1rem";
95
+ readonly "2xl": "1.5rem";
96
+ readonly full: "9999px";
97
+ };
98
+ readonly animation: {
99
+ readonly "fade-in": "fadeIn 0.2s ease-out";
100
+ readonly "fade-out": "fadeOut 0.2s ease-in";
101
+ readonly "slide-up": "slideUp 0.3s cubic-bezier(0.16, 1, 0.3, 1)";
102
+ readonly "slide-down": "slideDown 0.3s cubic-bezier(0.16, 1, 0.3, 1)";
103
+ readonly "scale-in": "scaleIn 0.2s ease-out";
104
+ };
105
+ readonly keyframes: {
106
+ readonly fadeIn: {
107
+ readonly from: {
108
+ readonly opacity: "0";
109
+ };
110
+ readonly to: {
111
+ readonly opacity: "1";
112
+ };
113
+ };
114
+ readonly fadeOut: {
115
+ readonly from: {
116
+ readonly opacity: "1";
117
+ };
118
+ readonly to: {
119
+ readonly opacity: "0";
120
+ };
121
+ };
122
+ readonly slideUp: {
123
+ readonly from: {
124
+ readonly transform: "translateY(8px)";
125
+ readonly opacity: "0";
126
+ };
127
+ readonly to: {
128
+ readonly transform: "translateY(0)";
129
+ readonly opacity: "1";
130
+ };
131
+ };
132
+ readonly slideDown: {
133
+ readonly from: {
134
+ readonly transform: "translateY(-8px)";
135
+ readonly opacity: "0";
136
+ };
137
+ readonly to: {
138
+ readonly transform: "translateY(0)";
139
+ readonly opacity: "1";
140
+ };
141
+ };
142
+ readonly scaleIn: {
143
+ readonly from: {
144
+ readonly transform: "scale(0.95)";
145
+ readonly opacity: "0";
146
+ };
147
+ readonly to: {
148
+ readonly transform: "scale(1)";
149
+ readonly opacity: "1";
150
+ };
151
+ };
152
+ };
153
+ };
154
+ declare const defaultPreset: {
155
+ content: string[];
156
+ darkMode: "class";
157
+ theme: {
158
+ extend: {
159
+ colors: {
160
+ readonly primary: {
161
+ readonly DEFAULT: "#3b82f6";
162
+ readonly hover: "#2563eb";
163
+ readonly active: "#1d4ed8";
164
+ readonly foreground: "#ffffff";
165
+ };
166
+ readonly secondary: {
167
+ readonly DEFAULT: "#6366f1";
168
+ readonly hover: "#4f46e5";
169
+ readonly active: "#4338ca";
170
+ readonly foreground: "#ffffff";
171
+ };
172
+ readonly accent: {
173
+ readonly DEFAULT: "#f59e0b";
174
+ readonly hover: "#d97706";
175
+ readonly active: "#b45309";
176
+ readonly foreground: "#000000";
177
+ };
178
+ readonly success: {
179
+ readonly DEFAULT: "#10b981";
180
+ readonly foreground: "#ffffff";
181
+ };
182
+ readonly warning: {
183
+ readonly DEFAULT: "#f59e0b";
184
+ readonly foreground: "#000000";
185
+ };
186
+ readonly danger: {
187
+ readonly DEFAULT: "#ef4444";
188
+ readonly foreground: "#ffffff";
189
+ };
190
+ readonly info: {
191
+ readonly DEFAULT: "#3b82f6";
192
+ readonly foreground: "#ffffff";
193
+ };
194
+ readonly surface: "#18181b";
195
+ readonly border: "#27272a";
196
+ readonly muted: "#71717a";
197
+ readonly subtle: "#3f3f46";
198
+ };
199
+ fontFamily: {
200
+ readonly sans: readonly ["InterVariable", "Inter", "system-ui", "sans-serif"];
201
+ readonly mono: readonly ["JetBrains Mono", "Fira Code", "Consolas", "monospace"];
202
+ };
203
+ borderRadius: {
204
+ readonly sm: "0.25rem";
205
+ readonly DEFAULT: "0.5rem";
206
+ readonly md: "0.5rem";
207
+ readonly lg: "0.75rem";
208
+ readonly xl: "1rem";
209
+ readonly "2xl": "1.5rem";
210
+ readonly full: "9999px";
211
+ };
212
+ animation: {
213
+ readonly "fade-in": "fadeIn 0.2s ease-out";
214
+ readonly "fade-out": "fadeOut 0.2s ease-in";
215
+ readonly "slide-up": "slideUp 0.3s cubic-bezier(0.16, 1, 0.3, 1)";
216
+ readonly "slide-down": "slideDown 0.3s cubic-bezier(0.16, 1, 0.3, 1)";
217
+ readonly "scale-in": "scaleIn 0.2s ease-out";
218
+ };
219
+ keyframes: {
220
+ readonly fadeIn: {
221
+ readonly from: {
222
+ readonly opacity: "0";
223
+ };
224
+ readonly to: {
225
+ readonly opacity: "1";
226
+ };
227
+ };
228
+ readonly fadeOut: {
229
+ readonly from: {
230
+ readonly opacity: "1";
231
+ };
232
+ readonly to: {
233
+ readonly opacity: "0";
234
+ };
235
+ };
236
+ readonly slideUp: {
237
+ readonly from: {
238
+ readonly transform: "translateY(8px)";
239
+ readonly opacity: "0";
240
+ };
241
+ readonly to: {
242
+ readonly transform: "translateY(0)";
243
+ readonly opacity: "1";
244
+ };
245
+ };
246
+ readonly slideDown: {
247
+ readonly from: {
248
+ readonly transform: "translateY(-8px)";
249
+ readonly opacity: "0";
250
+ };
251
+ readonly to: {
252
+ readonly transform: "translateY(0)";
253
+ readonly opacity: "1";
254
+ };
255
+ };
256
+ readonly scaleIn: {
257
+ readonly from: {
258
+ readonly transform: "scale(0.95)";
259
+ readonly opacity: "0";
260
+ };
261
+ readonly to: {
262
+ readonly transform: "scale(1)";
263
+ readonly opacity: "1";
264
+ };
265
+ };
266
+ };
267
+ };
268
+ };
269
+ plugins: never[];
270
+ };
271
+ declare const defaultThemeCss = "@import \"tailwindcss\";\n\n@theme {\n /* colors */\n --color-primary: #3b82f6;\n --color-primary-hover: #2563eb;\n --color-primary-active: #1d4ed8;\n --color-primary-foreground: #ffffff;\n --color-secondary: #6366f1;\n --color-secondary-hover: #4f46e5;\n --color-secondary-active: #4338ca;\n --color-secondary-foreground: #ffffff;\n --color-accent: #f59e0b;\n --color-accent-hover: #d97706;\n --color-accent-active: #b45309;\n --color-accent-foreground: #000000;\n --color-success: #10b981;\n --color-success-foreground: #ffffff;\n --color-warning: #f59e0b;\n --color-warning-foreground: #000000;\n --color-danger: #ef4444;\n --color-danger-foreground: #ffffff;\n --color-info: #3b82f6;\n --color-info-foreground: #ffffff;\n --color-surface: #18181b;\n --color-border: #27272a;\n --color-muted: #71717a;\n --color-subtle: #3f3f46;\n\n /* fonts */\n --font-sans: InterVariable, Inter, system-ui, sans-serif;\n --font-mono: JetBrains Mono, Fira Code, Consolas, monospace;\n\n /* spacing */\n --spacing-1: 0.25rem;\n --spacing-2: 0.5rem;\n --spacing-3: 0.75rem;\n --spacing-4: 1rem;\n --spacing-5: 1.25rem;\n --spacing-6: 1.5rem;\n --spacing-8: 2rem;\n --spacing-10: 2.5rem;\n --spacing-12: 3rem;\n --spacing-16: 4rem;\n\n /* breakpoints */\n --breakpoint-sm: 40rem;\n --breakpoint-md: 48rem;\n --breakpoint-lg: 64rem;\n --breakpoint-xl: 80rem;\n --breakpoint-2xl: 96rem;\n\n /* border radius */\n --radius-sm: 0.25rem;\n --radius-md: 0.5rem;\n --radius-lg: 0.75rem;\n --radius-xl: 1rem;\n --radius-2xl: 1.5rem;\n --radius-full: 9999px;\n\n /* animations */\n --animate-fade-in: fadeIn 0.2s ease-out;\n --animate-fade-out: fadeOut 0.2s ease-in;\n --animate-slide-up: slideUp 0.3s cubic-bezier(0.16, 1, 0.3, 1);\n --animate-slide-down: slideDown 0.3s cubic-bezier(0.16, 1, 0.3, 1);\n --animate-scale-in: scaleIn 0.2s ease-out;\n}\n\n@keyframes fadeIn {\n from { opacity: 0; }\n to { opacity: 1; }\n}\n@keyframes fadeOut {\n from { opacity: 1; }\n to { opacity: 0; }\n}\n@keyframes slideUp {\n from { transform: translateY(8px); opacity: 0; }\n to { transform: translateY(0); opacity: 1; }\n}\n@keyframes slideDown {\n from { transform: translateY(-8px); opacity: 0; }\n to { transform: translateY(0); opacity: 1; }\n}\n@keyframes scaleIn {\n from { transform: scale(0.95); opacity: 0; }\n to { transform: scale(1); opacity: 1; }\n}";
272
+ declare const defaultGlobalCss = "@import \"tailwindcss\";\n\n@theme {\n /* colors */\n --color-primary: #3b82f6;\n --color-primary-hover: #2563eb;\n --color-primary-active: #1d4ed8;\n --color-primary-foreground: #ffffff;\n --color-secondary: #6366f1;\n --color-secondary-hover: #4f46e5;\n --color-secondary-active: #4338ca;\n --color-secondary-foreground: #ffffff;\n --color-accent: #f59e0b;\n --color-accent-hover: #d97706;\n --color-accent-active: #b45309;\n --color-accent-foreground: #000000;\n --color-success: #10b981;\n --color-success-foreground: #ffffff;\n --color-warning: #f59e0b;\n --color-warning-foreground: #000000;\n --color-danger: #ef4444;\n --color-danger-foreground: #ffffff;\n --color-info: #3b82f6;\n --color-info-foreground: #ffffff;\n --color-surface: #18181b;\n --color-border: #27272a;\n --color-muted: #71717a;\n --color-subtle: #3f3f46;\n\n /* fonts */\n --font-sans: InterVariable, Inter, system-ui, sans-serif;\n --font-mono: JetBrains Mono, Fira Code, Consolas, monospace;\n\n /* spacing */\n --spacing-1: 0.25rem;\n --spacing-2: 0.5rem;\n --spacing-3: 0.75rem;\n --spacing-4: 1rem;\n --spacing-5: 1.25rem;\n --spacing-6: 1.5rem;\n --spacing-8: 2rem;\n --spacing-10: 2.5rem;\n --spacing-12: 3rem;\n --spacing-16: 4rem;\n\n /* breakpoints */\n --breakpoint-sm: 40rem;\n --breakpoint-md: 48rem;\n --breakpoint-lg: 64rem;\n --breakpoint-xl: 80rem;\n --breakpoint-2xl: 96rem;\n\n /* border radius */\n --radius-sm: 0.25rem;\n --radius-md: 0.5rem;\n --radius-lg: 0.75rem;\n --radius-xl: 1rem;\n --radius-2xl: 1.5rem;\n --radius-full: 9999px;\n\n /* animations */\n --animate-fade-in: fadeIn 0.2s ease-out;\n --animate-fade-out: fadeOut 0.2s ease-in;\n --animate-slide-up: slideUp 0.3s cubic-bezier(0.16, 1, 0.3, 1);\n --animate-slide-down: slideDown 0.3s cubic-bezier(0.16, 1, 0.3, 1);\n --animate-scale-in: scaleIn 0.2s ease-out;\n}\n\n@keyframes fadeIn {\n from { opacity: 0; }\n to { opacity: 1; }\n}\n@keyframes fadeOut {\n from { opacity: 1; }\n to { opacity: 0; }\n}\n@keyframes slideUp {\n from { transform: translateY(8px); opacity: 0; }\n to { transform: translateY(0); opacity: 1; }\n}\n@keyframes slideDown {\n from { transform: translateY(-8px); opacity: 0; }\n to { transform: translateY(0); opacity: 1; }\n}\n@keyframes scaleIn {\n from { transform: scale(0.95); opacity: 0; }\n to { transform: scale(1); opacity: 1; }\n}\n\n/* tailwind-styled-v4 \u2014 zero-config base styles */\n*, *::before, *::after {\n box-sizing: border-box;\n}\n\nhtml {\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n text-rendering: optimizeLegibility;\n}\n\nbody {\n margin: 0;\n font-family: var(--font-sans, system-ui, sans-serif);\n background: var(--color-surface, #18181b);\n color: var(--color-foreground, #fafafa);\n}\n";
273
+ declare function generateTailwindCss(contentPaths?: string[]): string;
274
+ declare function generateTailwindConfig(safelistPath?: string, contentPaths?: string[]): string;
275
+
276
+ export { defaultGlobalCss, defaultPreset, defaultThemeCss, designTokens, generateTailwindConfig, generateTailwindCss };
package/dist/preset.d.ts ADDED
@@ -0,0 +1,276 @@
1
+ /**
2
+ * tailwind-styled-v4 — Default Preset
3
+ *
4
+ * Tailwind config built-in yang dipakai ketika developer tidak punya
5
+ * tailwind.config.ts / tailwind.config.js di project mereka.
6
+ *
7
+ * Developer tidak perlu setup apapun:
8
+ * npm install tailwind-styled-v4
9
+ * → langsung bisa tw.div`p-4 bg-blue-500`
10
+ *
11
+ * Preset ini juga menyediakan design tokens yang consistent
12
+ * untuk semua project yang pakai tailwind-styled-v4.
13
+ *
14
+ * Override per-project:
15
+ * // tailwind.config.ts
16
+ * import { defaultPreset } from "tailwind-styled-v4/preset"
17
+ * export default { presets: [defaultPreset], theme: { extend: {...} } }
18
+ */
19
+ declare const designTokens: {
20
+ readonly colors: {
21
+ readonly primary: {
22
+ readonly DEFAULT: "#3b82f6";
23
+ readonly hover: "#2563eb";
24
+ readonly active: "#1d4ed8";
25
+ readonly foreground: "#ffffff";
26
+ };
27
+ readonly secondary: {
28
+ readonly DEFAULT: "#6366f1";
29
+ readonly hover: "#4f46e5";
30
+ readonly active: "#4338ca";
31
+ readonly foreground: "#ffffff";
32
+ };
33
+ readonly accent: {
34
+ readonly DEFAULT: "#f59e0b";
35
+ readonly hover: "#d97706";
36
+ readonly active: "#b45309";
37
+ readonly foreground: "#000000";
38
+ };
39
+ readonly success: {
40
+ readonly DEFAULT: "#10b981";
41
+ readonly foreground: "#ffffff";
42
+ };
43
+ readonly warning: {
44
+ readonly DEFAULT: "#f59e0b";
45
+ readonly foreground: "#000000";
46
+ };
47
+ readonly danger: {
48
+ readonly DEFAULT: "#ef4444";
49
+ readonly foreground: "#ffffff";
50
+ };
51
+ readonly info: {
52
+ readonly DEFAULT: "#3b82f6";
53
+ readonly foreground: "#ffffff";
54
+ };
55
+ readonly surface: "#18181b";
56
+ readonly border: "#27272a";
57
+ readonly muted: "#71717a";
58
+ readonly subtle: "#3f3f46";
59
+ };
60
+ readonly spacing: {
61
+ readonly 1: "0.25rem";
62
+ readonly 2: "0.5rem";
63
+ readonly 3: "0.75rem";
64
+ readonly 4: "1rem";
65
+ readonly 5: "1.25rem";
66
+ readonly 6: "1.5rem";
67
+ readonly 8: "2rem";
68
+ readonly 10: "2.5rem";
69
+ readonly 12: "3rem";
70
+ readonly 16: "4rem";
71
+ };
72
+ readonly breakpoints: {
73
+ readonly sm: "40rem";
74
+ readonly md: "48rem";
75
+ readonly lg: "64rem";
76
+ readonly xl: "80rem";
77
+ readonly "2xl": "96rem";
78
+ };
79
+ readonly fontWeight: {
80
+ readonly normal: "400";
81
+ readonly medium: "500";
82
+ readonly semibold: "600";
83
+ readonly bold: "700";
84
+ };
85
+ readonly fontFamily: {
86
+ readonly sans: readonly ["InterVariable", "Inter", "system-ui", "sans-serif"];
87
+ readonly mono: readonly ["JetBrains Mono", "Fira Code", "Consolas", "monospace"];
88
+ };
89
+ readonly borderRadius: {
90
+ readonly sm: "0.25rem";
91
+ readonly DEFAULT: "0.5rem";
92
+ readonly md: "0.5rem";
93
+ readonly lg: "0.75rem";
94
+ readonly xl: "1rem";
95
+ readonly "2xl": "1.5rem";
96
+ readonly full: "9999px";
97
+ };
98
+ readonly animation: {
99
+ readonly "fade-in": "fadeIn 0.2s ease-out";
100
+ readonly "fade-out": "fadeOut 0.2s ease-in";
101
+ readonly "slide-up": "slideUp 0.3s cubic-bezier(0.16, 1, 0.3, 1)";
102
+ readonly "slide-down": "slideDown 0.3s cubic-bezier(0.16, 1, 0.3, 1)";
103
+ readonly "scale-in": "scaleIn 0.2s ease-out";
104
+ };
105
+ readonly keyframes: {
106
+ readonly fadeIn: {
107
+ readonly from: {
108
+ readonly opacity: "0";
109
+ };
110
+ readonly to: {
111
+ readonly opacity: "1";
112
+ };
113
+ };
114
+ readonly fadeOut: {
115
+ readonly from: {
116
+ readonly opacity: "1";
117
+ };
118
+ readonly to: {
119
+ readonly opacity: "0";
120
+ };
121
+ };
122
+ readonly slideUp: {
123
+ readonly from: {
124
+ readonly transform: "translateY(8px)";
125
+ readonly opacity: "0";
126
+ };
127
+ readonly to: {
128
+ readonly transform: "translateY(0)";
129
+ readonly opacity: "1";
130
+ };
131
+ };
132
+ readonly slideDown: {
133
+ readonly from: {
134
+ readonly transform: "translateY(-8px)";
135
+ readonly opacity: "0";
136
+ };
137
+ readonly to: {
138
+ readonly transform: "translateY(0)";
139
+ readonly opacity: "1";
140
+ };
141
+ };
142
+ readonly scaleIn: {
143
+ readonly from: {
144
+ readonly transform: "scale(0.95)";
145
+ readonly opacity: "0";
146
+ };
147
+ readonly to: {
148
+ readonly transform: "scale(1)";
149
+ readonly opacity: "1";
150
+ };
151
+ };
152
+ };
153
+ };
154
+ declare const defaultPreset: {
155
+ content: string[];
156
+ darkMode: "class";
157
+ theme: {
158
+ extend: {
159
+ colors: {
160
+ readonly primary: {
161
+ readonly DEFAULT: "#3b82f6";
162
+ readonly hover: "#2563eb";
163
+ readonly active: "#1d4ed8";
164
+ readonly foreground: "#ffffff";
165
+ };
166
+ readonly secondary: {
167
+ readonly DEFAULT: "#6366f1";
168
+ readonly hover: "#4f46e5";
169
+ readonly active: "#4338ca";
170
+ readonly foreground: "#ffffff";
171
+ };
172
+ readonly accent: {
173
+ readonly DEFAULT: "#f59e0b";
174
+ readonly hover: "#d97706";
175
+ readonly active: "#b45309";
176
+ readonly foreground: "#000000";
177
+ };
178
+ readonly success: {
179
+ readonly DEFAULT: "#10b981";
180
+ readonly foreground: "#ffffff";
181
+ };
182
+ readonly warning: {
183
+ readonly DEFAULT: "#f59e0b";
184
+ readonly foreground: "#000000";
185
+ };
186
+ readonly danger: {
187
+ readonly DEFAULT: "#ef4444";
188
+ readonly foreground: "#ffffff";
189
+ };
190
+ readonly info: {
191
+ readonly DEFAULT: "#3b82f6";
192
+ readonly foreground: "#ffffff";
193
+ };
194
+ readonly surface: "#18181b";
195
+ readonly border: "#27272a";
196
+ readonly muted: "#71717a";
197
+ readonly subtle: "#3f3f46";
198
+ };
199
+ fontFamily: {
200
+ readonly sans: readonly ["InterVariable", "Inter", "system-ui", "sans-serif"];
201
+ readonly mono: readonly ["JetBrains Mono", "Fira Code", "Consolas", "monospace"];
202
+ };
203
+ borderRadius: {
204
+ readonly sm: "0.25rem";
205
+ readonly DEFAULT: "0.5rem";
206
+ readonly md: "0.5rem";
207
+ readonly lg: "0.75rem";
208
+ readonly xl: "1rem";
209
+ readonly "2xl": "1.5rem";
210
+ readonly full: "9999px";
211
+ };
212
+ animation: {
213
+ readonly "fade-in": "fadeIn 0.2s ease-out";
214
+ readonly "fade-out": "fadeOut 0.2s ease-in";
215
+ readonly "slide-up": "slideUp 0.3s cubic-bezier(0.16, 1, 0.3, 1)";
216
+ readonly "slide-down": "slideDown 0.3s cubic-bezier(0.16, 1, 0.3, 1)";
217
+ readonly "scale-in": "scaleIn 0.2s ease-out";
218
+ };
219
+ keyframes: {
220
+ readonly fadeIn: {
221
+ readonly from: {
222
+ readonly opacity: "0";
223
+ };
224
+ readonly to: {
225
+ readonly opacity: "1";
226
+ };
227
+ };
228
+ readonly fadeOut: {
229
+ readonly from: {
230
+ readonly opacity: "1";
231
+ };
232
+ readonly to: {
233
+ readonly opacity: "0";
234
+ };
235
+ };
236
+ readonly slideUp: {
237
+ readonly from: {
238
+ readonly transform: "translateY(8px)";
239
+ readonly opacity: "0";
240
+ };
241
+ readonly to: {
242
+ readonly transform: "translateY(0)";
243
+ readonly opacity: "1";
244
+ };
245
+ };
246
+ readonly slideDown: {
247
+ readonly from: {
248
+ readonly transform: "translateY(-8px)";
249
+ readonly opacity: "0";
250
+ };
251
+ readonly to: {
252
+ readonly transform: "translateY(0)";
253
+ readonly opacity: "1";
254
+ };
255
+ };
256
+ readonly scaleIn: {
257
+ readonly from: {
258
+ readonly transform: "scale(0.95)";
259
+ readonly opacity: "0";
260
+ };
261
+ readonly to: {
262
+ readonly transform: "scale(1)";
263
+ readonly opacity: "1";
264
+ };
265
+ };
266
+ };
267
+ };
268
+ };
269
+ plugins: never[];
270
+ };
271
+ declare const defaultThemeCss = "@import \"tailwindcss\";\n\n@theme {\n /* colors */\n --color-primary: #3b82f6;\n --color-primary-hover: #2563eb;\n --color-primary-active: #1d4ed8;\n --color-primary-foreground: #ffffff;\n --color-secondary: #6366f1;\n --color-secondary-hover: #4f46e5;\n --color-secondary-active: #4338ca;\n --color-secondary-foreground: #ffffff;\n --color-accent: #f59e0b;\n --color-accent-hover: #d97706;\n --color-accent-active: #b45309;\n --color-accent-foreground: #000000;\n --color-success: #10b981;\n --color-success-foreground: #ffffff;\n --color-warning: #f59e0b;\n --color-warning-foreground: #000000;\n --color-danger: #ef4444;\n --color-danger-foreground: #ffffff;\n --color-info: #3b82f6;\n --color-info-foreground: #ffffff;\n --color-surface: #18181b;\n --color-border: #27272a;\n --color-muted: #71717a;\n --color-subtle: #3f3f46;\n\n /* fonts */\n --font-sans: InterVariable, Inter, system-ui, sans-serif;\n --font-mono: JetBrains Mono, Fira Code, Consolas, monospace;\n\n /* spacing */\n --spacing-1: 0.25rem;\n --spacing-2: 0.5rem;\n --spacing-3: 0.75rem;\n --spacing-4: 1rem;\n --spacing-5: 1.25rem;\n --spacing-6: 1.5rem;\n --spacing-8: 2rem;\n --spacing-10: 2.5rem;\n --spacing-12: 3rem;\n --spacing-16: 4rem;\n\n /* breakpoints */\n --breakpoint-sm: 40rem;\n --breakpoint-md: 48rem;\n --breakpoint-lg: 64rem;\n --breakpoint-xl: 80rem;\n --breakpoint-2xl: 96rem;\n\n /* border radius */\n --radius-sm: 0.25rem;\n --radius-md: 0.5rem;\n --radius-lg: 0.75rem;\n --radius-xl: 1rem;\n --radius-2xl: 1.5rem;\n --radius-full: 9999px;\n\n /* animations */\n --animate-fade-in: fadeIn 0.2s ease-out;\n --animate-fade-out: fadeOut 0.2s ease-in;\n --animate-slide-up: slideUp 0.3s cubic-bezier(0.16, 1, 0.3, 1);\n --animate-slide-down: slideDown 0.3s cubic-bezier(0.16, 1, 0.3, 1);\n --animate-scale-in: scaleIn 0.2s ease-out;\n}\n\n@keyframes fadeIn {\n from { opacity: 0; }\n to { opacity: 1; }\n}\n@keyframes fadeOut {\n from { opacity: 1; }\n to { opacity: 0; }\n}\n@keyframes slideUp {\n from { transform: translateY(8px); opacity: 0; }\n to { transform: translateY(0); opacity: 1; }\n}\n@keyframes slideDown {\n from { transform: translateY(-8px); opacity: 0; }\n to { transform: translateY(0); opacity: 1; }\n}\n@keyframes scaleIn {\n from { transform: scale(0.95); opacity: 0; }\n to { transform: scale(1); opacity: 1; }\n}";
272
+ declare const defaultGlobalCss = "@import \"tailwindcss\";\n\n@theme {\n /* colors */\n --color-primary: #3b82f6;\n --color-primary-hover: #2563eb;\n --color-primary-active: #1d4ed8;\n --color-primary-foreground: #ffffff;\n --color-secondary: #6366f1;\n --color-secondary-hover: #4f46e5;\n --color-secondary-active: #4338ca;\n --color-secondary-foreground: #ffffff;\n --color-accent: #f59e0b;\n --color-accent-hover: #d97706;\n --color-accent-active: #b45309;\n --color-accent-foreground: #000000;\n --color-success: #10b981;\n --color-success-foreground: #ffffff;\n --color-warning: #f59e0b;\n --color-warning-foreground: #000000;\n --color-danger: #ef4444;\n --color-danger-foreground: #ffffff;\n --color-info: #3b82f6;\n --color-info-foreground: #ffffff;\n --color-surface: #18181b;\n --color-border: #27272a;\n --color-muted: #71717a;\n --color-subtle: #3f3f46;\n\n /* fonts */\n --font-sans: InterVariable, Inter, system-ui, sans-serif;\n --font-mono: JetBrains Mono, Fira Code, Consolas, monospace;\n\n /* spacing */\n --spacing-1: 0.25rem;\n --spacing-2: 0.5rem;\n --spacing-3: 0.75rem;\n --spacing-4: 1rem;\n --spacing-5: 1.25rem;\n --spacing-6: 1.5rem;\n --spacing-8: 2rem;\n --spacing-10: 2.5rem;\n --spacing-12: 3rem;\n --spacing-16: 4rem;\n\n /* breakpoints */\n --breakpoint-sm: 40rem;\n --breakpoint-md: 48rem;\n --breakpoint-lg: 64rem;\n --breakpoint-xl: 80rem;\n --breakpoint-2xl: 96rem;\n\n /* border radius */\n --radius-sm: 0.25rem;\n --radius-md: 0.5rem;\n --radius-lg: 0.75rem;\n --radius-xl: 1rem;\n --radius-2xl: 1.5rem;\n --radius-full: 9999px;\n\n /* animations */\n --animate-fade-in: fadeIn 0.2s ease-out;\n --animate-fade-out: fadeOut 0.2s ease-in;\n --animate-slide-up: slideUp 0.3s cubic-bezier(0.16, 1, 0.3, 1);\n --animate-slide-down: slideDown 0.3s cubic-bezier(0.16, 1, 0.3, 1);\n --animate-scale-in: scaleIn 0.2s ease-out;\n}\n\n@keyframes fadeIn {\n from { opacity: 0; }\n to { opacity: 1; }\n}\n@keyframes fadeOut {\n from { opacity: 1; }\n to { opacity: 0; }\n}\n@keyframes slideUp {\n from { transform: translateY(8px); opacity: 0; }\n to { transform: translateY(0); opacity: 1; }\n}\n@keyframes slideDown {\n from { transform: translateY(-8px); opacity: 0; }\n to { transform: translateY(0); opacity: 1; }\n}\n@keyframes scaleIn {\n from { transform: scale(0.95); opacity: 0; }\n to { transform: scale(1); opacity: 1; }\n}\n\n/* tailwind-styled-v4 \u2014 zero-config base styles */\n*, *::before, *::after {\n box-sizing: border-box;\n}\n\nhtml {\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n text-rendering: optimizeLegibility;\n}\n\nbody {\n margin: 0;\n font-family: var(--font-sans, system-ui, sans-serif);\n background: var(--color-surface, #18181b);\n color: var(--color-foreground, #fafafa);\n}\n";
273
+ declare function generateTailwindCss(contentPaths?: string[]): string;
274
+ declare function generateTailwindConfig(safelistPath?: string, contentPaths?: string[]): string;
275
+
276
+ export { defaultGlobalCss, defaultPreset, defaultThemeCss, designTokens, generateTailwindConfig, generateTailwindCss };