@shuriken-ui/tailwind 1.0.0-beta.7 → 1.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.
@@ -0,0 +1,393 @@
1
+ import * as tailwindcss_types_config from 'tailwindcss/types/config';
2
+ import { Config } from 'tailwindcss';
3
+ import typography__default from '@tailwindcss/typography';
4
+
5
+ interface PluginOption {
6
+ prefix?: string;
7
+ }
8
+
9
+ declare function hasPreset(config: Config): boolean;
10
+ declare function createPreset(options?: PluginOption): {
11
+ darkMode: "class";
12
+ content: never[];
13
+ plugins: (typeof typography__default | {
14
+ handler: () => void;
15
+ } | {
16
+ handler: tailwindcss_types_config.PluginCreator;
17
+ config?: Partial<Config> | undefined;
18
+ })[];
19
+ theme: {
20
+ fontFamily: {
21
+ sans: string[];
22
+ heading: string[];
23
+ alt: string[];
24
+ mono: string[];
25
+ };
26
+ extend: {
27
+ colors: {
28
+ muted: {
29
+ '50': "#f8fafc";
30
+ '100': "#f1f5f9";
31
+ '200': "#e2e8f0";
32
+ '300': "#cbd5e1";
33
+ '400': "#94a3b8";
34
+ '500': "#64748b";
35
+ '600': "#475569";
36
+ '700': "#334155";
37
+ '800': "#1e293b";
38
+ '900': "#0f172a";
39
+ '950': "#020617";
40
+ };
41
+ primary: {
42
+ '50': "#f5f3ff";
43
+ '100': "#ede9fe";
44
+ '200': "#ddd6fe";
45
+ '300': "#c4b5fd";
46
+ '400': "#a78bfa";
47
+ '500': "#8b5cf6";
48
+ '600': "#7c3aed";
49
+ '700': "#6d28d9";
50
+ '800': "#5b21b6";
51
+ '900': "#4c1d95";
52
+ '950': "#2e1065";
53
+ };
54
+ info: {
55
+ '50': "#f0f9ff";
56
+ '100': "#e0f2fe";
57
+ '200': "#bae6fd";
58
+ '300': "#7dd3fc";
59
+ '400': "#38bdf8";
60
+ '500': "#0ea5e9";
61
+ '600': "#0284c7";
62
+ '700': "#0369a1";
63
+ '800': "#075985";
64
+ '900': "#0c4a6e";
65
+ '950': "#082f49";
66
+ };
67
+ success: {
68
+ '50': "#f0fdfa";
69
+ '100': "#ccfbf1";
70
+ '200': "#99f6e4";
71
+ '300': "#5eead4";
72
+ '400': "#2dd4bf";
73
+ '500': "#14b8a6";
74
+ '600': "#0d9488";
75
+ '700': "#0f766e";
76
+ '800': "#115e59";
77
+ '900': "#134e4a";
78
+ '950': "#042f2e";
79
+ };
80
+ warning: {
81
+ '50': "#fffbeb";
82
+ '100': "#fef3c7";
83
+ '200': "#fde68a";
84
+ '300': "#fcd34d";
85
+ '400': "#fbbf24";
86
+ '500': "#f59e0b";
87
+ '600': "#d97706";
88
+ '700': "#b45309";
89
+ '800': "#92400e";
90
+ '900': "#78350f";
91
+ '950': "#451a03";
92
+ };
93
+ danger: {
94
+ '50': "#fff1f2";
95
+ '100': "#ffe4e6";
96
+ '200': "#fecdd3";
97
+ '300': "#fda4af";
98
+ '400': "#fb7185";
99
+ '500': "#f43f5e";
100
+ '600': "#e11d48";
101
+ '700': "#be123c";
102
+ '800': "#9f1239";
103
+ '900': "#881337";
104
+ '950': "#4c0519";
105
+ };
106
+ };
107
+ screens: {
108
+ xs: {
109
+ max: string;
110
+ };
111
+ lg: string;
112
+ ptablet: {
113
+ raw: string;
114
+ };
115
+ ltablet: {
116
+ raw: string;
117
+ };
118
+ };
119
+ typography: ({ theme }: any) => {
120
+ primary: {
121
+ css: {
122
+ '--tw-prose-links': any;
123
+ '--tw-prose-quote-borders': any;
124
+ '--tw-prose-invert-links': any;
125
+ '--tw-prose-invert-quote-borders': any;
126
+ };
127
+ };
128
+ muted: {
129
+ css: {
130
+ '--tw-prose-body': any;
131
+ '--tw-prose-headings': any;
132
+ '--tw-prose-lead': any;
133
+ '--tw-prose-bold': any;
134
+ '--tw-prose-counters': any;
135
+ '--tw-prose-bullets': any;
136
+ '--tw-prose-hr': any;
137
+ '--tw-prose-quotes': any;
138
+ '--tw-prose-captions': any;
139
+ '--tw-prose-code': any;
140
+ '--tw-prose-pre-code': any;
141
+ '--tw-prose-pre-bg': any;
142
+ '--tw-prose-th-borders': any;
143
+ '--tw-prose-td-borders': any;
144
+ '--tw-prose-invert-body': any;
145
+ '--tw-prose-invert-headings': any;
146
+ '--tw-prose-invert-lead': any;
147
+ '--tw-prose-invert-bold': any;
148
+ '--tw-prose-invert-counters': any;
149
+ '--tw-prose-invert-bullets': any;
150
+ '--tw-prose-invert-hr': any;
151
+ '--tw-prose-invert-quotes': any;
152
+ '--tw-prose-invert-captions': any;
153
+ '--tw-prose-invert-code': any;
154
+ '--tw-prose-invert-pre-code': any;
155
+ '--tw-prose-invert-pre-bg': any;
156
+ '--tw-prose-invert-th-borders': any;
157
+ '--tw-prose-invert-td-borders': any;
158
+ };
159
+ };
160
+ css: {
161
+ h1: {
162
+ fontWeight: number;
163
+ };
164
+ h2: {
165
+ fontWeight: number;
166
+ };
167
+ h3: {
168
+ fontWeight: number;
169
+ };
170
+ h4: {
171
+ fontWeight: number;
172
+ };
173
+ li: {
174
+ fontSize: string;
175
+ padding: string;
176
+ };
177
+ em: {
178
+ fontSize: string;
179
+ lineHeight: number;
180
+ };
181
+ blockquote: {
182
+ fontSize: string;
183
+ lineHeight: number;
184
+ fontWeight: number;
185
+ padding: string;
186
+ };
187
+ pre: {
188
+ fontFamily: any;
189
+ };
190
+ code: {
191
+ fontFamily: any;
192
+ padding: string;
193
+ fontWeight: number;
194
+ fontSize: string;
195
+ };
196
+ };
197
+ };
198
+ };
199
+ };
200
+ };
201
+ declare const preset: {
202
+ darkMode: "class";
203
+ content: never[];
204
+ plugins: (typeof typography__default | {
205
+ handler: () => void;
206
+ } | {
207
+ handler: tailwindcss_types_config.PluginCreator;
208
+ config?: Partial<Config> | undefined;
209
+ })[];
210
+ theme: {
211
+ fontFamily: {
212
+ sans: string[];
213
+ heading: string[];
214
+ alt: string[];
215
+ mono: string[];
216
+ };
217
+ extend: {
218
+ colors: {
219
+ muted: {
220
+ '50': "#f8fafc";
221
+ '100': "#f1f5f9";
222
+ '200': "#e2e8f0";
223
+ '300': "#cbd5e1";
224
+ '400': "#94a3b8";
225
+ '500': "#64748b";
226
+ '600': "#475569";
227
+ '700': "#334155";
228
+ '800': "#1e293b";
229
+ '900': "#0f172a";
230
+ '950': "#020617";
231
+ };
232
+ primary: {
233
+ '50': "#f5f3ff";
234
+ '100': "#ede9fe";
235
+ '200': "#ddd6fe";
236
+ '300': "#c4b5fd";
237
+ '400': "#a78bfa";
238
+ '500': "#8b5cf6";
239
+ '600': "#7c3aed";
240
+ '700': "#6d28d9";
241
+ '800': "#5b21b6";
242
+ '900': "#4c1d95";
243
+ '950': "#2e1065";
244
+ };
245
+ info: {
246
+ '50': "#f0f9ff";
247
+ '100': "#e0f2fe";
248
+ '200': "#bae6fd";
249
+ '300': "#7dd3fc";
250
+ '400': "#38bdf8";
251
+ '500': "#0ea5e9";
252
+ '600': "#0284c7";
253
+ '700': "#0369a1";
254
+ '800': "#075985";
255
+ '900': "#0c4a6e";
256
+ '950': "#082f49";
257
+ };
258
+ success: {
259
+ '50': "#f0fdfa";
260
+ '100': "#ccfbf1";
261
+ '200': "#99f6e4";
262
+ '300': "#5eead4";
263
+ '400': "#2dd4bf";
264
+ '500': "#14b8a6";
265
+ '600': "#0d9488";
266
+ '700': "#0f766e";
267
+ '800': "#115e59";
268
+ '900': "#134e4a";
269
+ '950': "#042f2e";
270
+ };
271
+ warning: {
272
+ '50': "#fffbeb";
273
+ '100': "#fef3c7";
274
+ '200': "#fde68a";
275
+ '300': "#fcd34d";
276
+ '400': "#fbbf24";
277
+ '500': "#f59e0b";
278
+ '600': "#d97706";
279
+ '700': "#b45309";
280
+ '800': "#92400e";
281
+ '900': "#78350f";
282
+ '950': "#451a03";
283
+ };
284
+ danger: {
285
+ '50': "#fff1f2";
286
+ '100': "#ffe4e6";
287
+ '200': "#fecdd3";
288
+ '300': "#fda4af";
289
+ '400': "#fb7185";
290
+ '500': "#f43f5e";
291
+ '600': "#e11d48";
292
+ '700': "#be123c";
293
+ '800': "#9f1239";
294
+ '900': "#881337";
295
+ '950': "#4c0519";
296
+ };
297
+ };
298
+ screens: {
299
+ xs: {
300
+ max: string;
301
+ };
302
+ lg: string;
303
+ ptablet: {
304
+ raw: string;
305
+ };
306
+ ltablet: {
307
+ raw: string;
308
+ };
309
+ };
310
+ typography: ({ theme }: any) => {
311
+ primary: {
312
+ css: {
313
+ '--tw-prose-links': any;
314
+ '--tw-prose-quote-borders': any;
315
+ '--tw-prose-invert-links': any;
316
+ '--tw-prose-invert-quote-borders': any;
317
+ };
318
+ };
319
+ muted: {
320
+ css: {
321
+ '--tw-prose-body': any;
322
+ '--tw-prose-headings': any;
323
+ '--tw-prose-lead': any;
324
+ '--tw-prose-bold': any;
325
+ '--tw-prose-counters': any;
326
+ '--tw-prose-bullets': any;
327
+ '--tw-prose-hr': any;
328
+ '--tw-prose-quotes': any;
329
+ '--tw-prose-captions': any;
330
+ '--tw-prose-code': any;
331
+ '--tw-prose-pre-code': any;
332
+ '--tw-prose-pre-bg': any;
333
+ '--tw-prose-th-borders': any;
334
+ '--tw-prose-td-borders': any;
335
+ '--tw-prose-invert-body': any;
336
+ '--tw-prose-invert-headings': any;
337
+ '--tw-prose-invert-lead': any;
338
+ '--tw-prose-invert-bold': any;
339
+ '--tw-prose-invert-counters': any;
340
+ '--tw-prose-invert-bullets': any;
341
+ '--tw-prose-invert-hr': any;
342
+ '--tw-prose-invert-quotes': any;
343
+ '--tw-prose-invert-captions': any;
344
+ '--tw-prose-invert-code': any;
345
+ '--tw-prose-invert-pre-code': any;
346
+ '--tw-prose-invert-pre-bg': any;
347
+ '--tw-prose-invert-th-borders': any;
348
+ '--tw-prose-invert-td-borders': any;
349
+ };
350
+ };
351
+ css: {
352
+ h1: {
353
+ fontWeight: number;
354
+ };
355
+ h2: {
356
+ fontWeight: number;
357
+ };
358
+ h3: {
359
+ fontWeight: number;
360
+ };
361
+ h4: {
362
+ fontWeight: number;
363
+ };
364
+ li: {
365
+ fontSize: string;
366
+ padding: string;
367
+ };
368
+ em: {
369
+ fontSize: string;
370
+ lineHeight: number;
371
+ };
372
+ blockquote: {
373
+ fontSize: string;
374
+ lineHeight: number;
375
+ fontWeight: number;
376
+ padding: string;
377
+ };
378
+ pre: {
379
+ fontFamily: any;
380
+ };
381
+ code: {
382
+ fontFamily: any;
383
+ padding: string;
384
+ fontWeight: number;
385
+ fontSize: string;
386
+ };
387
+ };
388
+ };
389
+ };
390
+ };
391
+ };
392
+
393
+ export { createPreset, hasPreset, preset };
package/dist/preset.d.ts CHANGED
@@ -1,15 +1,16 @@
1
1
  import * as tailwindcss_types_config from 'tailwindcss/types/config';
2
2
  import { Config } from 'tailwindcss';
3
- import _tailwindcss_typography__default from '@tailwindcss/typography';
3
+ import typography__default from '@tailwindcss/typography';
4
4
 
5
5
  interface PluginOption {
6
6
  prefix?: string;
7
7
  }
8
8
 
9
+ declare function hasPreset(config: Config): boolean;
9
10
  declare function createPreset(options?: PluginOption): {
10
11
  darkMode: "class";
11
12
  content: never[];
12
- plugins: (typeof _tailwindcss_typography__default | {
13
+ plugins: (typeof typography__default | {
13
14
  handler: () => void;
14
15
  } | {
15
16
  handler: tailwindcss_types_config.PluginCreator;
@@ -194,26 +195,13 @@ declare function createPreset(options?: PluginOption): {
194
195
  };
195
196
  };
196
197
  };
197
- keyframes: {
198
- 'nui-indeterminate': {
199
- '0%': {
200
- 'margin-left': string;
201
- };
202
- '100%': {
203
- 'margin-left': string;
204
- };
205
- };
206
- };
207
- animation: {
208
- 'nui-indeterminate': string;
209
- };
210
198
  };
211
199
  };
212
200
  };
213
- declare const _default: {
201
+ declare const preset: {
214
202
  darkMode: "class";
215
203
  content: never[];
216
- plugins: (typeof _tailwindcss_typography__default | {
204
+ plugins: (typeof typography__default | {
217
205
  handler: () => void;
218
206
  } | {
219
207
  handler: tailwindcss_types_config.PluginCreator;
@@ -398,21 +386,8 @@ declare const _default: {
398
386
  };
399
387
  };
400
388
  };
401
- keyframes: {
402
- 'nui-indeterminate': {
403
- '0%': {
404
- 'margin-left': string;
405
- };
406
- '100%': {
407
- 'margin-left': string;
408
- };
409
- };
410
- };
411
- animation: {
412
- 'nui-indeterminate': string;
413
- };
414
389
  };
415
390
  };
416
391
  };
417
392
 
418
- export { createPreset, _default as default };
393
+ export { createPreset, hasPreset, preset };
package/dist/preset.mjs CHANGED
@@ -496,7 +496,7 @@ const autocomplete = plugin.withOptions(
496
496
  }
497
497
  },
498
498
  [`.${prefix}autocomplete-clear`]: {
499
- [`@apply text-${config.clear.text} hover:text-${config.clear.textHover} dark:hover:text-${config.clear.textHoverDark} absolute end-0 top-0 z-10 flex items-center justify-center transition-colors duration-${config.clear.duration} cursor-pointer`]: {},
499
+ [`@apply text-${config.clear.text} hover:text-${config.clear.textHover} dark:hover:text-${config.clear.textHoverDark} absolute end-0 top-0 z-auto flex items-center justify-center transition-colors duration-${config.clear.duration} cursor-pointer`]: {},
500
500
  [`.${prefix}autocomplete-clear-inner`]: {
501
501
  [`@apply w-${config.clear.inner.size} h-${config.clear.inner.size}`]: {}
502
502
  }
@@ -688,7 +688,7 @@ const autocomplete = plugin.withOptions(
688
688
  [`@apply text-transparent`]: {}
689
689
  },
690
690
  [`.${prefix}autocomplete-icon`]: {
691
- [`@apply opacity-0`]: {}
691
+ [`@apply opacity-50`]: {}
692
692
  }
693
693
  },
694
694
  [`&.${prefix}autocomplete-label-float`]: {
@@ -1760,13 +1760,13 @@ const defaultButtonActionConfig = {
1760
1760
  muted: {
1761
1761
  text: "muted-500",
1762
1762
  textDark: "white",
1763
- bg: "white",
1763
+ bg: "muted-200",
1764
1764
  bgDark: "muted-700/40",
1765
1765
  bgHoverEnabled: "muted-100",
1766
1766
  bgHoverEnabledDark: "muted-700/60",
1767
1767
  bgActiveEnabled: "muted-200/50",
1768
1768
  bgActiveEnabledDark: "muted-800",
1769
- border: "muted-300",
1769
+ border: "muted-200",
1770
1770
  borderDark: "muted-700/40",
1771
1771
  borderActiveEnabledDark: "muted-800"
1772
1772
  },
@@ -4215,13 +4215,19 @@ const inputFileRegular = plugin.withOptions(
4215
4215
  }
4216
4216
  },
4217
4217
  [`&.${prefix}input-sm:not(.${prefix}has-icon)`]: {
4218
- [`@apply h-8 py-2 text-${config.hasNotIcon.sm} leading-4 gap-1`]: {},
4218
+ [`@apply text-${config.hasNotIcon.sm} leading-4`]: {},
4219
+ [`.${prefix}input-file-inner`]: {
4220
+ [`@apply h-8 py-2 gap-1`]: {}
4221
+ },
4219
4222
  [`.${prefix}input-file-addon`]: {
4220
4223
  [`@apply h-8 px-2`]: {}
4221
4224
  }
4222
4225
  },
4223
4226
  [`&.${prefix}input-sm.${prefix}has-icon`]: {
4224
- [`@apply h-8 py-2 text-${config.hasIcon.sm.text} leading-4 pe-3`]: {},
4227
+ [`@apply text-${config.hasIcon.sm.text} leading-4`]: {},
4228
+ [`.${prefix}input-file-inner`]: {
4229
+ [`@apply h-8 py-2 pe-3`]: {}
4230
+ },
4225
4231
  [`.${prefix}input-file-addon`]: {
4226
4232
  [`@apply h-8 px-2`]: {}
4227
4233
  },
@@ -4230,13 +4236,19 @@ const inputFileRegular = plugin.withOptions(
4230
4236
  }
4231
4237
  },
4232
4238
  [`&.${prefix}input-md:not(.${prefix}has-icon)`]: {
4233
- [`@apply h-10 text-${config.hasNotIcon.md} leading-5 gap-2`]: {},
4239
+ [`@apply text-${config.hasNotIcon.md} leading-5`]: {},
4240
+ [`.${prefix}input-file-inner`]: {
4241
+ [`@apply h-10 gap-2`]: {}
4242
+ },
4234
4243
  [`.${prefix}input-file-addon`]: {
4235
4244
  [`@apply h-10 px-3`]: {}
4236
4245
  }
4237
4246
  },
4238
4247
  [`&.${prefix}input-md.${prefix}has-icon`]: {
4239
- [`@apply h-10 text-${config.hasIcon.md.text} leading-5 pe-4`]: {},
4248
+ [`@apply text-${config.hasIcon.md.text} leading-5`]: {},
4249
+ [`.${prefix}input-file-inner`]: {
4250
+ [`@apply h-10 pe-4`]: {}
4251
+ },
4240
4252
  [`.${prefix}input-file-addon`]: {
4241
4253
  [`@apply h-10 px-3`]: {}
4242
4254
  },
@@ -4245,13 +4257,19 @@ const inputFileRegular = plugin.withOptions(
4245
4257
  }
4246
4258
  },
4247
4259
  [`&.${prefix}input-lg:not(.${prefix}has-icon)`]: {
4248
- [`@apply h-12 text-${config.hasNotIcon.lg} leading-5 gap-2`]: {},
4260
+ [`@apply text-${config.hasNotIcon.lg} leading-5`]: {},
4261
+ [`.${prefix}input-file-inner`]: {
4262
+ [`@apply h-12 gap-2`]: {}
4263
+ },
4249
4264
  [`.${prefix}input-file-addon`]: {
4250
4265
  [`@apply h-12 px-4`]: {}
4251
4266
  }
4252
4267
  },
4253
4268
  [`&.${prefix}input-lg.${prefix}has-icon`]: {
4254
- [`@apply h-12 text-${config.hasIcon.lg.text} leading-5 pe-4`]: {},
4269
+ [`@apply text-${config.hasIcon.lg.text} leading-5`]: {},
4270
+ [`.${prefix}input-file-inner`]: {
4271
+ [`@apply h-12 pe-4`]: {}
4272
+ },
4255
4273
  [`.${prefix}input-file-addon`]: {
4256
4274
  [`@apply h-12 px-4`]: {}
4257
4275
  },
@@ -4732,6 +4750,11 @@ const input = plugin.withOptions(
4732
4750
  [`.${prefix}input-action`]: {
4733
4751
  [`@apply text-${config.input.action.text} absolute end-0 top-0 flex items-center justify-center transition-colors duration-${config.input.action.duration}`]: {}
4734
4752
  },
4753
+ [`&.${prefix}input-focus`]: {
4754
+ [`.${prefix}input`]: {
4755
+ [`@apply focus:border-primary-500 dark:focus:border-primary-500`]: {}
4756
+ }
4757
+ },
4735
4758
  [`&.${prefix}input-rounded`]: {
4736
4759
  [`.${prefix}input`]: {
4737
4760
  [`@apply rounded-${config.input.rounded.default}`]: {}
@@ -6957,11 +6980,27 @@ const progress = plugin.withOptions(
6957
6980
  });
6958
6981
  };
6959
6982
  },
6960
- function() {
6983
+ function(options) {
6984
+ let { prefix } = defu(options, defaultPluginOptions);
6985
+ if (prefix) {
6986
+ prefix = `${prefix}-`;
6987
+ }
6961
6988
  return {
6962
6989
  theme: {
6963
6990
  shurikenUi: {
6964
6991
  progress: defaultProgressConfig
6992
+ },
6993
+ extend: {
6994
+ keyframes: {
6995
+ [`${prefix}progress-indeterminate`]: {
6996
+ "0%": { "margin-left": "-100%" },
6997
+ "60%": { "margin-left": "100%" },
6998
+ "100%": { "margin-left": "-100%" }
6999
+ }
7000
+ },
7001
+ animation: {
7002
+ [`${prefix}progress-indeterminate`]: `${prefix}progress-indeterminate 3s linear infinite forwards`
7003
+ }
6965
7004
  }
6966
7005
  }
6967
7006
  };
@@ -9868,8 +9907,15 @@ const shurikenUIUtilities = plugin.withOptions(
9868
9907
  }
9869
9908
  );
9870
9909
 
9910
+ const ShurikenUISymbol = "__is_shuriken_ui";
9911
+ function hasPreset(config) {
9912
+ if (config.presets && Array.isArray(config.presets)) {
9913
+ return config.presets.some((preset2) => preset2 && ShurikenUISymbol in preset2);
9914
+ }
9915
+ return false;
9916
+ }
9871
9917
  function createPreset(options = {}) {
9872
- return {
9918
+ const config = {
9873
9919
  darkMode: "class",
9874
9920
  content: [],
9875
9921
  plugins: [
@@ -9984,20 +10030,17 @@ function createPreset(options = {}) {
9984
10030
  fontSize: "0.95rem !important"
9985
10031
  }
9986
10032
  }
9987
- }),
9988
- keyframes: {
9989
- "nui-indeterminate": {
9990
- "0%": { "margin-left": "-10%" },
9991
- "100%": { "margin-left": "100%" }
9992
- }
9993
- },
9994
- animation: {
9995
- "nui-indeterminate": "nui-indeterminate 1s cubic-bezier(0.4, 0, 0.2, 1) infinite"
9996
- }
10033
+ })
9997
10034
  }
9998
10035
  }
9999
10036
  };
10037
+ Object.defineProperty(config, ShurikenUISymbol, {
10038
+ value: true,
10039
+ enumerable: false,
10040
+ writable: false
10041
+ });
10042
+ return config;
10000
10043
  }
10001
- const shurikenUIPreset = createPreset();
10044
+ const preset = createPreset();
10002
10045
 
10003
- export { createPreset, shurikenUIPreset as default };
10046
+ export { createPreset, hasPreset, preset };