@shuriken-ui/tailwind 4.0.0-alpha.4 → 4.0.0-alpha.6

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 (60) hide show
  1. package/README.md +55 -0
  2. package/lib/css/accordion.css +8 -9
  3. package/lib/css/autocomplete.css +143 -134
  4. package/lib/css/avatar-group.css +19 -20
  5. package/lib/css/avatar.css +16 -17
  6. package/lib/css/breadcrumb.css +10 -11
  7. package/lib/css/button-action.css +0 -1
  8. package/lib/css/button-close.css +0 -1
  9. package/lib/css/button-group.css +0 -1
  10. package/lib/css/button-icon.css +0 -1
  11. package/lib/css/button.css +0 -1
  12. package/lib/css/card.css +0 -1
  13. package/lib/css/checkbox.css +5 -6
  14. package/lib/css/dropdown-divider.css +0 -1
  15. package/lib/css/dropdown-item.css +14 -15
  16. package/lib/css/dropdown.css +21 -22
  17. package/lib/css/focus.css +0 -1
  18. package/lib/css/fullscreen-dropfile.css +0 -1
  19. package/lib/css/heading.css +11 -12
  20. package/lib/css/icon-box.css +67 -68
  21. package/lib/css/input-file-regular.css +68 -69
  22. package/lib/css/input-file.css +0 -1
  23. package/lib/css/input-help-text.css +0 -1
  24. package/lib/css/input-number.css +147 -137
  25. package/lib/css/input.css +144 -138
  26. package/lib/css/kbd.css +0 -1
  27. package/lib/css/label.css +0 -1
  28. package/lib/css/link.css +0 -1
  29. package/lib/css/list.css +0 -1
  30. package/lib/css/listbox.css +155 -138
  31. package/lib/css/mark.css +0 -1
  32. package/lib/css/mask.css +0 -1
  33. package/lib/css/message-text.css +24 -25
  34. package/lib/css/message.css +0 -1
  35. package/lib/css/modal.css +0 -1
  36. package/lib/css/pagination.css +4 -5
  37. package/lib/css/paragraph.css +11 -12
  38. package/lib/css/placeholder-page.css +0 -1
  39. package/lib/css/placeload.css +0 -1
  40. package/lib/css/progress-circle.css +0 -1
  41. package/lib/css/progress.css +0 -17
  42. package/lib/css/prose.css +0 -1
  43. package/lib/css/radio.css +0 -1
  44. package/lib/css/select.css +128 -125
  45. package/lib/css/slimscroll.css +4 -4
  46. package/lib/css/snack.css +3 -4
  47. package/lib/css/switch-ball.css +0 -1
  48. package/lib/css/switch-thin.css +0 -1
  49. package/lib/css/tab-slider.css +0 -1
  50. package/lib/css/tabs.css +0 -1
  51. package/lib/css/tag.css +0 -1
  52. package/lib/css/text.css +24 -25
  53. package/lib/css/textarea.css +52 -41
  54. package/lib/css/theme-switch.css +6 -7
  55. package/lib/css/theme-toggle.css +8 -9
  56. package/lib/css/toast.css +1 -2
  57. package/lib/css/tooltip.css +0 -1
  58. package/lib/index.css +4 -0
  59. package/lib/theme.css +4 -4
  60. package/package.json +2 -2
@@ -1,4 +1,3 @@
1
- /* generated using "pnpm jiti scripts/generate-utilities.ts" */
2
1
  /* @utility nui-input-help-text */
3
2
 
4
3
  @utility nui-input-help-text {
@@ -1,10 +1,9 @@
1
- /* generated using "pnpm jiti scripts/generate-utilities.ts" */
2
1
  /* @utility nui-input-number */
3
2
 
4
3
  @utility nui-input-number-wrapper {
5
4
  @apply relative;
6
5
 
7
- .nui-input-number-label, .nui-label-float {
6
+ .nui-input-number-label, .nui-input-number-label-float-label {
8
7
  @apply nui-label;
9
8
  }
10
9
 
@@ -27,92 +26,36 @@
27
26
  }
28
27
 
29
28
  &:not(.nui-input-number-loading) {
30
- .nui-input-number:placeholder-shown ~ .nui-label-float {
29
+ .nui-input-number:placeholder-shown ~ .nui-input-number-label-float {
31
30
  @apply text-muted-300 dark:text-muted-600;
32
31
  }
33
32
  }
34
33
 
35
- &:not(.nui-has-icon).nui-input-number-sm {
34
+ &:not(.nui-input-number-has-icon).nui-input-number-sm {
36
35
  .nui-input-number {
37
36
  @apply h-8 py-1 text-xs leading-4 ps-2 pe-[3.75rem];
38
37
  }
39
38
  }
40
39
 
41
- &:not(.nui-has-icon).nui-input-number-md {
40
+ &:not(.nui-input-number-has-icon).nui-input-number-md {
42
41
  .nui-input-number {
43
42
  @apply h-10 py-2 text-sm leading-5 ps-3 pe-[4.75rem];
44
43
  }
45
44
  }
46
45
 
47
- &:not(.nui-has-icon).nui-input-number-lg {
46
+ &:not(.nui-input-number-has-icon).nui-input-number-lg {
48
47
  .nui-input-number {
49
48
  @apply h-12 py-2 text-sm leading-5 ps-4 pe-24;
50
49
  }
51
50
  }
52
51
 
53
- &:not(.nui-has-icon).nui-input-number-xl {
52
+ &:not(.nui-input-number-has-icon).nui-input-number-xl {
54
53
  .nui-input-number {
55
54
  @apply h-14 py-2 text-base leading-5 ps-4 pe-24;
56
55
  }
57
56
  }
58
-
59
- &.nui-input-number-label-float:not(.nui-has-icon).nui-input-number-sm {
60
- .nui-label-float {
61
- @apply start-3 -ms-3 -mt-7 text-xs;
62
- }
63
-
64
- .nui-input-number:focus-visible ~ .nui-label-float {
65
- @apply !-ms-3 !-mt-7;
66
- }
67
-
68
- .nui-input-number:placeholder-shown ~ .nui-label-float {
69
- @apply ms-0 mt-0;
70
- }
71
- }
72
-
73
- &.nui-input-number-label-float:not(.nui-has-icon).nui-input-number-md {
74
- .nui-label-float {
75
- @apply start-3 -ms-3 -mt-8 text-xs;
76
- }
77
-
78
- .nui-input-number:focus-visible ~ .nui-label-float {
79
- @apply !-ms-3 !-mt-8 !text-xs;
80
- }
81
-
82
- .nui-input-number:placeholder-shown ~ .nui-label-float {
83
- @apply ms-0 mt-0 text-[0.825rem];
84
- }
85
- }
86
-
87
- &.nui-input-number-label-float:not(.nui-has-icon).nui-input-number-lg {
88
- .nui-label-float {
89
- @apply start-3 -ms-3 -mt-9 text-xs;
90
- }
91
-
92
- .nui-input-number:focus-visible ~ .nui-label-float {
93
- @apply !-ms-3 !-mt-9 !text-xs;
94
- }
95
-
96
- .nui-input-number:placeholder-shown ~ .nui-label-float {
97
- @apply ms-0 mt-0 text-[0.825rem];
98
- }
99
- }
100
-
101
- &.nui-input-number-label-float:not(.nui-has-icon).nui-input-number-xl {
102
- .nui-label-float {
103
- @apply start-3 -ms-3 -mt-10 text-xs;
104
- }
105
-
106
- .nui-input-number:focus-visible ~ .nui-label-float {
107
- @apply !-ms-3 !-mt-10 !text-xs;
108
- }
109
-
110
- .nui-input-number:placeholder-shown ~ .nui-label-float {
111
- @apply ms-0 mt-0 text-[0.825rem];
112
- }
113
- }
114
57
  }
115
- @utility nui-label-float {
58
+ @utility nui-input-number-label-float-label {
116
59
  @apply h-5 absolute inline-flex items-center select-none pointer-events-none;
117
60
  @apply font-sans text-primary-500 leading-none;
118
61
  @apply transition-all duration-300;
@@ -130,9 +73,9 @@
130
73
  }
131
74
  @utility nui-input-number {
132
75
  @apply nui-focus w-full font-sans disabled:cursor-not-allowed disabled:opacity-75;
133
- @apply transition-all duration-300;
76
+ @apply transition-all duration-300 text-ellipsis;
134
77
 
135
- &:focus-visible ~ .nui-label-float {
78
+ &:focus-visible ~ .nui-input-number-label-float-label {
136
79
  @apply !text-primary-500 dark:!text-primary-500;
137
80
  }
138
81
 
@@ -144,10 +87,10 @@
144
87
  @apply cursor-not-allowed opacity-75;
145
88
  }
146
89
  }
147
- @utility nui-input-number-placeload {
90
+ @utility nui-input-number-placeload-wrapper {
148
91
  @apply absolute start-0 top-0 flex w-full items-center px-4;
149
92
 
150
- .nui-placeload {
93
+ .nui-input-number-placeload {
151
94
  @apply h-3 w-full max-w-[50%] rounded;
152
95
  }
153
96
  }
@@ -201,7 +144,7 @@
201
144
  @apply pb-1 text-xs;
202
145
  }
203
146
 
204
- .nui-label-float {
147
+ .nui-input-number-label-float-label {
205
148
  @apply top-1.5;
206
149
  }
207
150
 
@@ -213,7 +156,7 @@
213
156
  }
214
157
  }
215
158
 
216
- .nui-input-number-placeload {
159
+ .nui-input-number-placeload-wrapper {
217
160
  @apply h-8;
218
161
  }
219
162
 
@@ -226,7 +169,7 @@
226
169
  @apply pb-1 text-[0.825rem];
227
170
  }
228
171
 
229
- .nui-label-float {
172
+ .nui-input-number-label-float-label {
230
173
  @apply top-2.5;
231
174
  }
232
175
 
@@ -238,7 +181,7 @@
238
181
  }
239
182
  }
240
183
 
241
- .nui-input-number-placeload {
184
+ .nui-input-number-placeload-wrapper {
242
185
  @apply h-10;
243
186
  }
244
187
 
@@ -251,7 +194,7 @@
251
194
  @apply pb-1 text-sm;
252
195
  }
253
196
 
254
- .nui-label-float {
197
+ .nui-input-number-label-float-label {
255
198
  @apply top-3.5;
256
199
  }
257
200
 
@@ -263,7 +206,7 @@
263
206
  }
264
207
  }
265
208
 
266
- .nui-input-number-placeload {
209
+ .nui-input-number-placeload-wrapper {
267
210
  @apply h-12;
268
211
  }
269
212
 
@@ -276,7 +219,7 @@
276
219
  @apply pb-1 text-sm;
277
220
  }
278
221
 
279
- .nui-label-float {
222
+ .nui-input-number-label-float-label {
280
223
  @apply top-[1.1rem];
281
224
  }
282
225
 
@@ -288,7 +231,7 @@
288
231
  }
289
232
  }
290
233
 
291
- .nui-input-number-placeload {
234
+ .nui-input-number-placeload-wrapper {
292
235
  @apply h-14;
293
236
  }
294
237
 
@@ -358,7 +301,7 @@
358
301
  @apply !text-transparent placeholder:!text-transparent dark:placeholder:!text-transparent;
359
302
  }
360
303
 
361
- .nui-input-number:placeholder-shown ~ .nui-label-float {
304
+ .nui-input-number:placeholder-shown ~ .nui-input-number-label-float-label {
362
305
  @apply text-transparent;
363
306
  }
364
307
 
@@ -380,90 +323,157 @@
380
323
  @apply !text-danger-500 dark:!text-danger-500;
381
324
  }
382
325
  }
383
- @utility nui-has-icon {
384
- .nui-input-number {
385
- @apply h-8 py-1 text-xs leading-4 ps-8 pe-[3.75rem];
326
+ @utility nui-input-number-has-icon {
327
+ &.nui-input-number-sm {
328
+ .nui-input-number {
329
+ @apply h-8 py-1 text-xs leading-4 ps-8 pe-[3.75rem];
330
+ }
386
331
  }
387
- }
388
- @utility nui-has-icon {
389
- .nui-input-number {
390
- @apply h-10 py-2 text-sm leading-5 ps-10 pe-[4.75rem];
332
+ &.nui-input-number-md {
333
+ .nui-input-number {
334
+ @apply h-10 py-2 text-sm leading-5 ps-10 pe-[4.75rem];
335
+ }
391
336
  }
392
- }
393
- @utility nui-has-icon {
394
- .nui-input-number {
395
- @apply h-12 py-2 text-sm leading-5 ps-11 pe-24;
337
+ &.nui-input-number-lg {
338
+ .nui-input-number {
339
+ @apply h-12 py-2 text-sm leading-5 ps-11 pe-24;
340
+ }
396
341
  }
397
- }
398
- @utility nui-has-icon {
399
- .nui-input-number {
400
- @apply h-14 py-2 text-base leading-5 ps-[3.25rem] pe-24;
342
+ &.nui-input-number-xl {
343
+ .nui-input-number {
344
+ @apply h-14 py-2 text-base leading-5 ps-[3.25rem] pe-24;
345
+ }
401
346
  }
402
347
  }
403
- @utility nui-has-action {
404
- .nui-input-number {
405
- @apply pe-8;
348
+ @utility nui-input-number-has-action {
349
+ &.nui-input-number-sm {
350
+ .nui-input-number {
351
+ @apply pe-8;
352
+ }
406
353
  }
407
- }
408
- @utility nui-has-action {
409
- .nui-input-number {
410
- @apply pe-10;
354
+ &.nui-input-number-md {
355
+ .nui-input-number {
356
+ @apply pe-10;
357
+ }
411
358
  }
412
- }
413
- @utility nui-has-action {
414
- .nui-input-number {
415
- @apply pe-12;
359
+ &.nui-input-number-lg {
360
+ .nui-input-number {
361
+ @apply pe-12;
362
+ }
363
+ }
364
+ &.nui-input-number-xl {
365
+ .nui-input-number {
366
+ @apply pe-14;
367
+ }
416
368
  }
417
369
  }
418
370
  @utility nui-input-number-label-float {
419
- .nui-label-float {
420
- @apply start-8 -ms-8 -mt-7 text-xs;
421
- }
371
+ &.nui-input-number-has-icon.nui-input-number-sm {
372
+ .nui-input-number-label-float-label {
373
+ @apply start-8 -ms-8 -mt-6 text-xs;
374
+ }
422
375
 
423
- .nui-input-number:focus-visible ~ .nui-label-float {
424
- @apply !-ms-8 !-mt-7;
425
- }
376
+ .nui-input-number:focus-visible ~ .nui-input-number-label-float-label {
377
+ @apply !-ms-8 !-mt-6;
378
+ }
426
379
 
427
- .nui-input-number:placeholder-shown ~ .nui-label-float {
428
- @apply ms-0 mt-0;
429
- }
430
- }
431
- @utility nui-input-number-label-float {
432
- .nui-label-float {
433
- @apply start-10 -ms-10 -mt-8 text-xs;
380
+ .nui-input-number:placeholder-shown ~ .nui-input-number-label-float-label {
381
+ @apply ms-0 mt-1;
382
+ }
434
383
  }
384
+ &.nui-input-number-has-icon.nui-input-number-md {
385
+ .nui-input-number-label-float-label {
386
+ @apply start-10 -ms-10 -mt-7 text-xs;
387
+ }
435
388
 
436
- .nui-input-number:focus-visible ~ .nui-label-float {
437
- @apply !-ms-10 !-mt-8 !text-xs;
438
- }
389
+ .nui-input-number:focus-visible ~ .nui-input-number-label-float-label {
390
+ @apply !-ms-10 !-mt-7 !text-xs;
391
+ }
439
392
 
440
- .nui-input-number:placeholder-shown ~ .nui-label-float {
441
- @apply ms-0 mt-0 text-[0.825rem];
393
+ .nui-input-number:placeholder-shown ~ .nui-input-number-label-float-label {
394
+ @apply ms-0 mt-1 text-[0.825rem];
395
+ }
442
396
  }
443
- }
444
- @utility nui-input-number-label-float {
445
- .nui-label-float {
446
- @apply start-11 -ms-10 -mt-9 text-xs;
397
+ &.nui-input-number-has-icon.nui-input-number-lg {
398
+ .nui-input-number-label-float-label {
399
+ @apply start-11 -ms-10 -mt-8 text-xs;
400
+ }
401
+
402
+ .nui-input-number:focus-visible ~ .nui-input-number-label-float-label {
403
+ @apply !-ms-10 !-mt-8 !text-xs;
404
+ }
405
+
406
+ .nui-input-number:placeholder-shown ~ .nui-input-number-label-float-label {
407
+ @apply ms-0 mt-1 text-[0.825rem];
408
+ }
447
409
  }
410
+ &.nui-input-number-has-icon.nui-input-number-xl {
411
+ .nui-input-number-label-float-label {
412
+ @apply start-[3.25rem] -ms-[3.25rem] -mt-9 text-xs;
413
+ }
448
414
 
449
- .nui-input-number:focus-visible ~ .nui-label-float {
450
- @apply !-ms-10 !-mt-9 !text-xs;
415
+ .nui-input-number:focus-visible ~ .nui-input-number-label-float-label {
416
+ @apply !-ms-[3.25rem] !-mt-9 !text-xs;
417
+ }
418
+
419
+ .nui-input-number:placeholder-shown ~ .nui-input-number-label-float-label {
420
+ @apply ms-0 mt-1 text-[0.825rem];
421
+ }
451
422
  }
423
+
424
+ &:not(.nui-input-number-has-icon).nui-input-number-sm {
425
+ .nui-input-number-label-float-label {
426
+ @apply start-3 -ms-3 -mt-67 text-xs;
427
+ }
428
+
429
+ .nui-input-number:focus-visible ~ .nui-input-number-label-float-label {
430
+ @apply !-ms-3 !-mt-6;
431
+ }
452
432
 
453
- .nui-input-number:placeholder-shown ~ .nui-label-float {
454
- @apply ms-0 mt-0 text-[0.825rem];
433
+ .nui-input-number:placeholder-shown ~ .nui-input-number-label-float-label {
434
+ @apply ms-0 mt-1;
435
+ }
455
436
  }
456
- }
457
- @utility nui-input-number-label-float {
458
- .nui-label-float {
459
- @apply start-[3.25rem] -ms-[3.25rem] -mt-10 text-xs;
437
+
438
+ &:not(.nui-input-number-has-icon).nui-input-number-md {
439
+ .nui-input-number-label-float-label {
440
+ @apply start-3 -ms-3 -mt-7 text-xs;
441
+ }
442
+
443
+ .nui-input-number:focus-visible ~ .nui-input-number-label-float-label {
444
+ @apply !-ms-3 !-mt-7 !text-xs;
445
+ }
446
+
447
+ .nui-input-number:placeholder-shown ~ .nui-input-number-label-float-label {
448
+ @apply ms-0 mt-1 text-[0.825rem];
449
+ }
460
450
  }
461
451
 
462
- .nui-input-number:focus-visible ~ .nui-label-float {
463
- @apply !-ms-[3.25rem] !-mt-10 !text-xs;
452
+ &:not(.nui-input-number-has-icon).nui-input-number-lg {
453
+ .nui-input-number-label-float-label {
454
+ @apply start-3 -ms-3 -mt-8 text-xs;
455
+ }
456
+
457
+ .nui-input-number:focus-visible ~ .nui-input-number-label-float-label {
458
+ @apply !-ms-3 !-mt-8 !text-xs;
459
+ }
460
+
461
+ .nui-input-number:placeholder-shown ~ .nui-input-number-label-float-label {
462
+ @apply ms-0 mt-1 text-[0.825rem];
463
+ }
464
464
  }
465
465
 
466
- .nui-input-number:placeholder-shown ~ .nui-label-float {
467
- @apply ms-0 mt-0 text-[0.825rem];
466
+ &:not(.nui-input-number-has-icon).nui-input-number-xl {
467
+ .nui-input-number-label-float-label {
468
+ @apply start-3 -ms-3 -mt-9 text-xs;
469
+ }
470
+
471
+ .nui-input-number:focus-visible ~ .nui-input-number-label-float-label {
472
+ @apply !-ms-3 !-mt-9 !text-xs;
473
+ }
474
+
475
+ .nui-input-number:placeholder-shown ~ .nui-input-number-label-float-label {
476
+ @apply ms-0 mt-1 text-[0.825rem];
477
+ }
468
478
  }
469
479
  }