@spartan-ng/cli 0.0.1-alpha.717 → 0.0.1-alpha.719

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 (56) hide show
  1. package/package.json +1 -1
  2. package/src/generators/base/generator.d.ts +1 -0
  3. package/src/generators/base/generator.js +96 -0
  4. package/src/generators/base/generator.js.map +1 -1
  5. package/src/generators/base/lib/build-dependency-array.js +13 -0
  6. package/src/generators/base/lib/build-dependency-array.js.map +1 -1
  7. package/src/generators/base/versions.d.ts +1 -1
  8. package/src/generators/base/versions.js +1 -1
  9. package/src/generators/healthcheck/healthchecks/version.js +5 -1
  10. package/src/generators/healthcheck/healthchecks/version.js.map +1 -1
  11. package/src/generators/migrate-helm-libraries/generator.js +26 -7
  12. package/src/generators/migrate-helm-libraries/generator.js.map +1 -1
  13. package/src/generators/migrate-icon/generator.js +1 -1
  14. package/src/generators/migrate-icon/generator.js.map +1 -1
  15. package/src/generators/migrate-naming-convention/__snapshots__/generator.spec.ts.snap +1 -1
  16. package/src/generators/migrate-scroll-area/generator.js +1 -1
  17. package/src/generators/migrate-scroll-area/generator.js.map +1 -1
  18. package/src/generators/ui/libs/avatar/files/lib/hlm-avatar-badge.ts.template +2 -2
  19. package/src/generators/ui/libs/breadcrumb/files/lib/hlm-breadcrumb-ellipsis.ts.template +9 -4
  20. package/src/generators/ui/libs/calendar/files/lib/hlm-calendar-multi.ts.template +134 -183
  21. package/src/generators/ui/libs/calendar/files/lib/hlm-calendar-range.ts.template +133 -176
  22. package/src/generators/ui/libs/calendar/files/lib/hlm-calendar.ts.template +121 -169
  23. package/src/generators/ui/libs/carousel/files/lib/hlm-carousel-next.ts.template +3 -4
  24. package/src/generators/ui/libs/carousel/files/lib/hlm-carousel-previous.ts.template +3 -4
  25. package/src/generators/ui/libs/checkbox/files/lib/hlm-checkbox.ts.template +3 -4
  26. package/src/generators/ui/libs/date-picker/files/lib/hlm-date-picker-multi.ts.template +1 -1
  27. package/src/generators/ui/libs/date-picker/files/lib/hlm-date-picker.ts.template +1 -1
  28. package/src/generators/ui/libs/date-picker/files/lib/hlm-date-range-picker.ts.template +1 -1
  29. package/src/generators/ui/libs/dialog/files/lib/hlm-dialog-content.ts.template +4 -4
  30. package/src/generators/ui/libs/dropdown-menu/files/lib/hlm-dropdown-menu-item-sub-indicator.ts.template +1 -1
  31. package/src/generators/ui/libs/input-otp/files/lib/hlm-input-otp-separator.ts.template +2 -3
  32. package/src/generators/ui/libs/sheet/files/lib/hlm-sheet-content.ts.template +4 -4
  33. package/src/generators/ui/libs/sidebar/files/lib/hlm-sidebar-menu-button.ts.template +1 -1
  34. package/src/generators/ui/libs/spinner/files/lib/hlm-spinner.ts.template +1 -1
  35. package/src/generators/ui/libs/tabs/files/lib/hlm-tabs-paginated-list.ts.template +7 -8
  36. package/src/generators/ui/libs/utils/files/index.ts.template +1 -0
  37. package/src/generators/ui/libs/utils/files/lib/provide-spartan-hlm.ts.template +34 -0
  38. package/src/generators/ui/primitive-deps.js +19 -20
  39. package/src/generators/ui/primitive-deps.js.map +1 -1
  40. package/src/generators/ui/primitives.d.ts +1 -1
  41. package/src/generators/ui/style-luma.css +43 -47
  42. package/src/generators/ui/style-lyra.css +44 -48
  43. package/src/generators/ui/style-maia.css +43 -47
  44. package/src/generators/ui/style-mira.css +48 -52
  45. package/src/generators/ui/style-nova.css +45 -49
  46. package/src/generators/ui/style-vega.css +43 -47
  47. package/src/generators/ui/supported-ui-libraries.json +43 -52
  48. package/src/utils/string-change.d.ts +26 -0
  49. package/src/utils/string-change.js +84 -0
  50. package/src/utils/string-change.js.map +1 -0
  51. package/src/generators/ui/libs/icon/files/index.ts.template +0 -7
  52. package/src/generators/ui/libs/icon/files/lib/hlm-icon.token.ts.template +0 -20
  53. package/src/generators/ui/libs/icon/files/lib/hlm-icon.ts.template +0 -35
  54. package/src/generators/ui/libs/icon/generator.d.ts +0 -3
  55. package/src/generators/ui/libs/icon/generator.js +0 -9
  56. package/src/generators/ui/libs/icon/generator.js.map +0 -1
@@ -12,7 +12,7 @@
12
12
  }
13
13
 
14
14
  .spartan-accordion-trigger {
15
- @apply focus-visible:ring-ring/50 focus-visible:border-ring focus-visible:after:border-ring **:data-[slot=accordion-trigger-icon]:text-muted-foreground! rounded-none py-2.5 text-start text-xs font-medium hover:underline focus-visible:ring-1 **:data-[slot=accordion-trigger-icon]:ms-auto **:data-[slot=accordion-trigger-icon]:text-[calc(var(--spacing)*4)];
15
+ @apply focus-visible:ring-ring/50 focus-visible:border-ring focus-visible:after:border-ring **:data-[slot=accordion-trigger-icon]:text-muted-foreground! rounded-none py-2.5 text-start text-xs font-medium hover:underline focus-visible:ring-1 **:data-[slot=accordion-trigger-icon]:ms-auto **:data-[slot=accordion-trigger-icon]:text-[length:--spacing(4)];
16
16
  }
17
17
 
18
18
  .spartan-accordion-content {
@@ -25,7 +25,7 @@
25
25
 
26
26
  /* MARK: Alert */
27
27
  .spartan-alert {
28
- @apply grid gap-0.5 rounded-none border px-2.5 py-2 text-start text-xs has-data-[slot=alert-action]:relative has-data-[slot=alert-action]:pe-18 has-[>ng-icon]:grid-cols-[auto_1fr] has-[>ng-icon]:gap-x-2 *:[ng-icon]:row-span-2 *:[ng-icon]:translate-y-0 *:[ng-icon]:text-current *:[ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
28
+ @apply grid gap-0.5 rounded-none border px-2.5 py-2 text-start text-xs has-data-[slot=alert-action]:relative has-data-[slot=alert-action]:pe-18 has-[>ng-icon]:grid-cols-[auto_1fr] has-[>ng-icon]:gap-x-2 *:[ng-icon]:row-span-2 *:[ng-icon]:translate-y-0 *:[ng-icon]:text-current *:[ng-icon:not([class*='text-'])]:text-[length:--spacing(4)];
29
29
  }
30
30
 
31
31
  .spartan-alert-variant-default {
@@ -62,7 +62,7 @@
62
62
  }
63
63
 
64
64
  .spartan-alert-dialog-media {
65
- @apply bg-muted mb-2 inline-flex size-10 items-center justify-center rounded-none sm:group-data-[size=default]/alert-dialog-content:row-span-2 *:[ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*6)];
65
+ @apply bg-muted mb-2 inline-flex size-10 items-center justify-center rounded-none sm:group-data-[size=default]/alert-dialog-content:row-span-2 *:[ng-icon:not([class*='text-'])]:text-[length:--spacing(6)];
66
66
  }
67
67
 
68
68
  .spartan-alert-dialog-title {
@@ -87,7 +87,7 @@
87
87
  }
88
88
 
89
89
  .spartan-autocomplete-item-indicator {
90
- @apply absolute end-2 flex items-center justify-center text-[calc(var(--spacing)*4)];
90
+ @apply absolute end-2 flex items-center justify-center text-[length:--spacing(4)];
91
91
  }
92
92
 
93
93
  .spartan-autocomplete-empty {
@@ -124,12 +124,12 @@
124
124
  }
125
125
 
126
126
  .spartan-avatar-group-count {
127
- @apply bg-muted text-muted-foreground size-8 rounded-full text-xs group-has-data-[size=lg]/avatar-group:size-10 group-has-data-[size=sm]/avatar-group:size-6 [&>ng-icon]:text-[calc(var(--spacing)*4)] group-has-data-[size=lg]/avatar-group:[&>ng-icon]:text-[calc(var(--spacing)*5)] group-has-data-[size=sm]/avatar-group:[&>ng-icon]:text-[calc(var(--spacing)*3)];
127
+ @apply bg-muted text-muted-foreground size-8 rounded-full text-xs group-has-data-[size=lg]/avatar-group:size-10 group-has-data-[size=sm]/avatar-group:size-6 [&>ng-icon]:text-[length:--spacing(4)] group-has-data-[size=lg]/avatar-group:[&>ng-icon]:text-[length:--spacing(5)] group-has-data-[size=sm]/avatar-group:[&>ng-icon]:text-[length:--spacing(3)];
128
128
  }
129
129
 
130
130
  /* MARK: Badge */
131
131
  .spartan-badge {
132
- @apply h-5 gap-1 rounded-none border border-transparent px-2 py-0.5 text-xs font-medium transition-all has-data-[icon=inline-end]:pe-1.5 has-data-[icon=inline-start]:ps-1.5 [&>ng-icon]:text-[calc(var(--spacing)*3)];
132
+ @apply h-5 gap-1 rounded-none border border-transparent px-2 py-0.5 text-xs font-medium transition-all has-data-[icon=inline-end]:pe-1.5 has-data-[icon=inline-start]:ps-1.5 [&>ng-icon]:text-[length:--spacing(3)];
133
133
  }
134
134
 
135
135
  .spartan-badge-variant-default {
@@ -174,16 +174,16 @@
174
174
  }
175
175
 
176
176
  .spartan-breadcrumb-separator {
177
- @apply [&>ng-icon]:text-[calc(var(--spacing)*3.5)];
177
+ @apply [&>ng-icon]:text-[length:--spacing(3.5)];
178
178
  }
179
179
 
180
180
  .spartan-breadcrumb-ellipsis {
181
- @apply size-5 [&>ng-icon]:text-[calc(var(--spacing)*4)];
181
+ @apply size-5 [&>ng-icon]:text-[length:--spacing(4)];
182
182
  }
183
183
 
184
184
  /* MARK: Button */
185
185
  .spartan-button {
186
- @apply focus-visible:border-ring focus-visible:ring-ring/50 data-[matches-spartan-invalid=true]:ring-destructive/20 dark:data-[matches-spartan-invalid=true]:ring-destructive/40 data-[matches-spartan-invalid=true]:border-destructive dark:data-[matches-spartan-invalid=true]:border-destructive/50 rounded-none border border-transparent bg-clip-padding text-xs font-medium focus-visible:ring-1 active:not-aria-[haspopup]:translate-y-px data-[matches-spartan-invalid=true]:ring-1 [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
186
+ @apply focus-visible:border-ring focus-visible:ring-ring/50 data-[matches-spartan-invalid=true]:ring-destructive/20 dark:data-[matches-spartan-invalid=true]:ring-destructive/40 data-[matches-spartan-invalid=true]:border-destructive dark:data-[matches-spartan-invalid=true]:border-destructive/50 rounded-none border border-transparent bg-clip-padding text-xs font-medium focus-visible:ring-1 active:not-aria-[haspopup]:translate-y-px data-[matches-spartan-invalid=true]:ring-1 [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(4)];
187
187
  }
188
188
 
189
189
  .spartan-button-variant-default {
@@ -211,11 +211,11 @@
211
211
  }
212
212
 
213
213
  .spartan-button-size-xs {
214
- @apply h-6 gap-1 rounded-none px-2 text-xs has-data-[icon=inline-end]:pe-1.5 has-data-[icon=inline-start]:ps-1.5 [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*3)];
214
+ @apply h-6 gap-1 rounded-none px-2 text-xs has-data-[icon=inline-end]:pe-1.5 has-data-[icon=inline-start]:ps-1.5 [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(3)];
215
215
  }
216
216
 
217
217
  .spartan-button-size-sm {
218
- @apply h-7 gap-1 rounded-none px-2.5 has-data-[icon=inline-end]:pe-1.5 has-data-[icon=inline-start]:ps-1.5 [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*3.5)];
218
+ @apply h-7 gap-1 rounded-none px-2.5 has-data-[icon=inline-end]:pe-1.5 has-data-[icon=inline-start]:ps-1.5 [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(3.5)];
219
219
  }
220
220
 
221
221
  .spartan-button-size-default {
@@ -227,7 +227,7 @@
227
227
  }
228
228
 
229
229
  .spartan-button-size-icon-xs {
230
- @apply size-6 rounded-none [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*3)];
230
+ @apply size-6 rounded-none [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(3)];
231
231
  }
232
232
 
233
233
  .spartan-button-size-icon-sm {
@@ -248,7 +248,7 @@
248
248
  }
249
249
 
250
250
  .spartan-button-group-text {
251
- @apply bg-muted gap-2 rounded-none border px-2.5 text-xs font-medium [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
251
+ @apply bg-muted gap-2 rounded-none border px-2.5 text-xs font-medium [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(4)];
252
252
  }
253
253
 
254
254
  .spartan-button-group-separator {
@@ -260,10 +260,6 @@
260
260
  @apply p-2 [--cell-size:--spacing(7)];
261
261
  }
262
262
 
263
- .spartan-calendar-dropdown-root {
264
- @apply has-focus:border-ring border-input has-focus:ring-ring/50 rounded-none border has-focus:ring-1;
265
- }
266
-
267
263
  .spartan-calendar-caption-label {
268
264
  @apply h-6 rounded-none ps-1.5 pe-1;
269
265
  }
@@ -304,7 +300,7 @@
304
300
  }
305
301
 
306
302
  .spartan-checkbox-indicator {
307
- @apply [&>ng-icon]:text-[calc(var(--spacing)*3.5)];
303
+ @apply [&>ng-icon]:text-[length:--spacing(3.5)];
308
304
  }
309
305
 
310
306
  /* MARK: Combobox */
@@ -321,7 +317,7 @@
321
317
  }
322
318
 
323
319
  .spartan-combobox-item-indicator {
324
- @apply pointer-events-none absolute end-2 flex items-center justify-center text-[calc(var(--spacing)*4)];
320
+ @apply pointer-events-none absolute end-2 flex items-center justify-center text-[length:--spacing(4)];
325
321
  }
326
322
 
327
323
  .spartan-combobox-empty {
@@ -341,7 +337,7 @@
341
337
  }
342
338
 
343
339
  .spartan-combobox-trigger-icon {
344
- @apply text-muted-foreground text-[calc(var(--spacing)*4)];
340
+ @apply text-muted-foreground text-[length:--spacing(4)];
345
341
  }
346
342
 
347
343
  .spartan-combobox-chips {
@@ -361,7 +357,7 @@
361
357
  }
362
358
 
363
359
  .spartan-combobox-placeholder {
364
- @apply gap-2 [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
360
+ @apply gap-2 [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(4)];
365
361
  }
366
362
 
367
363
  .spartan-combobox-status {
@@ -382,7 +378,7 @@
382
378
  }
383
379
 
384
380
  .spartan-command-input-icon {
385
- @apply shrink-0 text-[calc(var(--spacing)*4)] opacity-50;
381
+ @apply shrink-0 text-[length:--spacing(4)] opacity-50;
386
382
  }
387
383
 
388
384
  .spartan-command-input {
@@ -406,7 +402,7 @@
406
402
  }
407
403
 
408
404
  .spartan-command-item {
409
- @apply data-selected:bg-muted data-selected:text-foreground data-selected:*:[&>ng-icon]:text-foreground relative flex cursor-default items-center gap-2 rounded-none px-2 py-2 text-xs outline-hidden select-none in-data-[slot=dialog-content]:rounded-none! [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
405
+ @apply data-selected:bg-muted data-selected:text-foreground data-selected:*:[&>ng-icon]:text-foreground relative flex cursor-default items-center gap-2 rounded-none px-2 py-2 text-xs outline-hidden select-none in-data-[slot=dialog-content]:rounded-none! [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(4)];
410
406
  }
411
407
 
412
408
  .spartan-command-shortcut {
@@ -482,19 +478,19 @@
482
478
  }
483
479
 
484
480
  .spartan-dropdown-menu-item {
485
- @apply hover:bg-accent focus:bg-accent hover:text-accent-foreground focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:hover:bg-destructive/10 data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:hover:bg-destructive/20 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:hover:text-destructive data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[ng-icon]:text-destructive not-data-[variant=destructive]:hover:**:text-accent-foreground not-data-[variant=destructive]:focus:**:text-accent-foreground gap-2 rounded-none px-2 py-2 text-xs data-inset:ps-7 [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
481
+ @apply hover:bg-accent focus:bg-accent hover:text-accent-foreground focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:hover:bg-destructive/10 data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:hover:bg-destructive/20 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:hover:text-destructive data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[ng-icon]:text-destructive not-data-[variant=destructive]:hover:**:text-accent-foreground not-data-[variant=destructive]:focus:**:text-accent-foreground gap-2 rounded-none px-2 py-2 text-xs data-inset:ps-7 [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(4)];
486
482
  }
487
483
 
488
484
  .spartan-dropdown-menu-checkbox-item {
489
- @apply hover:bg-accent focus:bg-accent hover:text-accent-foreground focus:text-accent-foreground hover:**:text-accent-foreground focus:**:text-accent-foreground gap-2 rounded-none py-2 ps-2 pe-8 text-xs data-inset:ps-7 [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
485
+ @apply hover:bg-accent focus:bg-accent hover:text-accent-foreground focus:text-accent-foreground hover:**:text-accent-foreground focus:**:text-accent-foreground gap-2 rounded-none py-2 ps-2 pe-8 text-xs data-inset:ps-7 [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(4)];
490
486
  }
491
487
 
492
488
  .spartan-dropdown-menu-radio-item {
493
- @apply hover:bg-accent focus:bg-accent hover:text-accent-foreground focus:text-accent-foreground hover:**:text-accent-foreground focus:**:text-accent-foreground gap-2 rounded-none py-2 ps-2 pe-8 text-xs data-inset:ps-7 [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
489
+ @apply hover:bg-accent focus:bg-accent hover:text-accent-foreground focus:text-accent-foreground hover:**:text-accent-foreground focus:**:text-accent-foreground gap-2 rounded-none py-2 ps-2 pe-8 text-xs data-inset:ps-7 [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(4)];
494
490
  }
495
491
 
496
492
  .spartan-dropdown-menu-item-indicator {
497
- @apply absolute end-2 flex items-center justify-center [&_ng-icon]:text-[calc(var(--spacing)*4)];
493
+ @apply absolute end-2 flex items-center justify-center [&_ng-icon]:text-[length:--spacing(4)];
498
494
  }
499
495
 
500
496
  .spartan-dropdown-menu-label {
@@ -531,7 +527,7 @@
531
527
  }
532
528
 
533
529
  .spartan-empty-media-icon {
534
- @apply bg-muted text-foreground flex size-8 shrink-0 items-center justify-center rounded-none [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
530
+ @apply bg-muted text-foreground flex size-8 shrink-0 items-center justify-center rounded-none [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(4)];
535
531
  }
536
532
 
537
533
  .spartan-empty-title {
@@ -619,7 +615,7 @@
619
615
  }
620
616
 
621
617
  .spartan-input-otp-separator {
622
- @apply [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
618
+ @apply [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(4)];
623
619
  }
624
620
 
625
621
  /* MARK: Item */
@@ -660,7 +656,7 @@
660
656
  }
661
657
 
662
658
  .spartan-item-media-variant-icon {
663
- @apply [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
659
+ @apply [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(4)];
664
660
  }
665
661
 
666
662
  .spartan-item-media-variant-image {
@@ -701,7 +697,7 @@
701
697
 
702
698
  /* MARK: Kbd */
703
699
  .spartan-kbd {
704
- @apply bg-muted text-muted-foreground in-data-[slot=tooltip-content]:bg-background/20 in-data-[slot=tooltip-content]:text-background dark:in-data-[slot=tooltip-content]:bg-background/10 h-5 w-fit min-w-5 gap-1 rounded-none px-1 font-sans text-xs font-medium [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*3)];
700
+ @apply bg-muted text-muted-foreground in-data-[slot=tooltip-content]:bg-background/20 in-data-[slot=tooltip-content]:text-background dark:in-data-[slot=tooltip-content]:bg-background/10 h-5 w-fit min-w-5 gap-1 rounded-none px-1 font-sans text-xs font-medium [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(3)];
705
701
  }
706
702
 
707
703
  .spartan-kbd-group {
@@ -736,7 +732,7 @@
736
732
  }
737
733
 
738
734
  .spartan-navigation-menu-link {
739
- @apply data-active:focus:bg-muted data-active:hover:bg-muted data-active:bg-muted/50 focus-visible:ring-ring/50 hover:bg-muted focus:bg-muted flex items-center gap-2 rounded-none p-2 text-xs transition-all outline-none focus-visible:ring-1 focus-visible:outline-1 in-data-[slot=navigation-menu-content]:rounded-none [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
735
+ @apply data-active:focus:bg-muted data-active:hover:bg-muted data-active:bg-muted/50 focus-visible:ring-ring/50 hover:bg-muted focus:bg-muted flex items-center gap-2 rounded-none p-2 text-xs transition-all outline-none focus-visible:ring-1 focus-visible:outline-1 in-data-[slot=navigation-menu-content]:rounded-none [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(4)];
740
736
  }
741
737
 
742
738
  .spartan-navigation-menu-trigger-icon {
@@ -753,7 +749,7 @@
753
749
  }
754
750
 
755
751
  .spartan-native-select-icon {
756
- @apply text-muted-foreground end-2.5 top-1/2 -translate-y-1/2 text-[calc(var(--spacing)*4)];
752
+ @apply text-muted-foreground end-2.5 top-1/2 -translate-y-1/2 text-[length:--spacing(4)];
757
753
  }
758
754
 
759
755
  /* MARK: Pagination */
@@ -762,7 +758,7 @@
762
758
  }
763
759
 
764
760
  .spartan-pagination-ellipsis {
765
- @apply size-8 items-center justify-center [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
761
+ @apply size-8 items-center justify-center [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(4)];
766
762
  }
767
763
 
768
764
  .spartan-pagination-previous {
@@ -844,7 +840,7 @@
844
840
  }
845
841
 
846
842
  .spartan-select-trigger-icon {
847
- @apply text-muted-foreground text-[calc(var(--spacing)*4)];
843
+ @apply text-muted-foreground text-[length:--spacing(4)];
848
844
  }
849
845
 
850
846
  .spartan-select-content {
@@ -860,7 +856,7 @@
860
856
  }
861
857
 
862
858
  .spartan-select-item-indicator {
863
- @apply absolute end-2 flex items-center justify-center text-[calc(var(--spacing)*4)];
859
+ @apply absolute end-2 flex items-center justify-center text-[length:--spacing(4)];
864
860
  }
865
861
 
866
862
  .spartan-select-group {
@@ -872,15 +868,15 @@
872
868
  }
873
869
 
874
870
  .spartan-select-scroll-up-button {
875
- @apply bg-popover z-10 flex cursor-default items-center justify-center py-1 [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
871
+ @apply bg-popover z-10 flex cursor-default items-center justify-center py-1 [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(4)];
876
872
  }
877
873
 
878
874
  .spartan-select-scroll-down-button {
879
- @apply bg-popover z-10 flex cursor-default items-center justify-center py-1 [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
875
+ @apply bg-popover z-10 flex cursor-default items-center justify-center py-1 [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(4)];
880
876
  }
881
877
 
882
878
  .spartan-select-placeholder {
883
- @apply gap-2 [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
879
+ @apply gap-2 [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(4)];
884
880
  }
885
881
 
886
882
  .spartan-select-values-content {
@@ -979,11 +975,11 @@
979
975
  }
980
976
 
981
977
  .spartan-sidebar-group-label {
982
- @apply text-sidebar-foreground/70 ring-sidebar-ring h-8 rounded-none px-2 text-xs transition-[margin,opacity] duration-200 ease-linear group-data-[collapsible=icon]:-mt-8 group-data-[collapsible=icon]:opacity-0 focus-visible:ring-2 [&>ng-icon]:text-[calc(var(--spacing)*4)];
978
+ @apply text-sidebar-foreground/70 ring-sidebar-ring h-8 rounded-none px-2 text-xs transition-[margin,opacity] duration-200 ease-linear group-data-[collapsible=icon]:-mt-8 group-data-[collapsible=icon]:opacity-0 focus-visible:ring-2 [&>ng-icon]:text-[length:--spacing(4)];
983
979
  }
984
980
 
985
981
  .spartan-sidebar-group-action {
986
- @apply text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground absolute end-3 top-3.5 w-5 rounded-none p-0 focus-visible:ring-2 [&>ng-icon]:text-[calc(var(--spacing)*4)];
982
+ @apply text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground absolute end-3 top-3.5 w-5 rounded-none p-0 focus-visible:ring-2 [&>ng-icon]:text-[length:--spacing(4)];
987
983
  }
988
984
 
989
985
  .spartan-sidebar-menu-button {
@@ -1011,7 +1007,7 @@
1011
1007
  }
1012
1008
 
1013
1009
  .spartan-sidebar-menu-action {
1014
- @apply text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground peer-hover/menu-button:text-sidebar-accent-foreground absolute end-1 top-1.5 aspect-square w-5 rounded-none p-0 peer-data-[size=default]/menu-button:top-1.5 peer-data-[size=lg]/menu-button:top-2.5 peer-data-[size=sm]/menu-button:top-1 focus-visible:ring-2 [&>ng-icon]:text-[calc(var(--spacing)*4)];
1010
+ @apply text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground peer-hover/menu-button:text-sidebar-accent-foreground absolute end-1 top-1.5 aspect-square w-5 rounded-none p-0 peer-data-[size=default]/menu-button:top-1.5 peer-data-[size=lg]/menu-button:top-2.5 peer-data-[size=sm]/menu-button:top-1 focus-visible:ring-2 [&>ng-icon]:text-[length:--spacing(4)];
1015
1011
  }
1016
1012
 
1017
1013
  .spartan-sidebar-menu-badge {
@@ -1035,7 +1031,7 @@
1035
1031
  }
1036
1032
 
1037
1033
  .spartan-sidebar-menu-sub-button {
1038
- @apply text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground [&>svg]:text-sidebar-accent-foreground data-active:bg-sidebar-accent data-active:text-sidebar-accent-foreground h-7 gap-2 rounded-none px-2 focus-visible:ring-2 data-[size=md]:text-xs data-[size=sm]:text-xs [&>ng-icon]:text-[calc(var(--spacing)*4)];
1034
+ @apply text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground [&>svg]:text-sidebar-accent-foreground data-active:bg-sidebar-accent data-active:text-sidebar-accent-foreground h-7 gap-2 rounded-none px-2 focus-visible:ring-2 data-[size=md]:text-xs data-[size=sm]:text-xs [&>ng-icon]:text-[length:--spacing(4)];
1039
1035
  }
1040
1036
 
1041
1037
  /* MARK: Skeleton */
@@ -1125,7 +1121,7 @@
1125
1121
  }
1126
1122
 
1127
1123
  .spartan-tabs-trigger {
1128
- @apply gap-1.5 rounded-none border border-transparent px-1.5 py-0.5 text-xs font-medium group-data-vertical/tabs:py-[calc(--spacing(1.25))] [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
1124
+ @apply gap-1.5 rounded-none border border-transparent px-1.5 py-0.5 text-xs font-medium group-data-vertical/tabs:py-[calc(--spacing(1.25))] [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(4)];
1129
1125
  }
1130
1126
 
1131
1127
  .spartan-tabs-content {
@@ -1139,7 +1135,7 @@
1139
1135
 
1140
1136
  /* MARK: Toggle */
1141
1137
  .spartan-toggle {
1142
- @apply hover:text-foreground aria-pressed:bg-muted focus-visible:border-ring focus-visible:ring-ring/50 data-[matches-spartan-invalid=true]:ring-destructive/20 dark:data-[matches-spartan-invalid=true]:ring-destructive/40 data-[matches-spartan-invalid=true]:border-destructive data-[state=on]:bg-muted gap-1 rounded-none text-xs font-medium transition-all [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
1138
+ @apply hover:text-foreground aria-pressed:bg-muted focus-visible:border-ring focus-visible:ring-ring/50 data-[matches-spartan-invalid=true]:ring-destructive/20 dark:data-[matches-spartan-invalid=true]:ring-destructive/40 data-[matches-spartan-invalid=true]:border-destructive data-[state=on]:bg-muted gap-1 rounded-none text-xs font-medium transition-all [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(4)];
1143
1139
  }
1144
1140
 
1145
1141
  .spartan-toggle-variant-default {
@@ -1182,7 +1178,7 @@
1182
1178
  }
1183
1179
 
1184
1180
  .spartan-input-group-addon {
1185
- @apply text-muted-foreground h-auto gap-2 py-1.5 text-xs font-medium group-data-[disabled=true]/input-group:opacity-50 [&>kbd]:rounded-none [&>ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
1181
+ @apply text-muted-foreground h-auto gap-2 py-1.5 text-xs font-medium group-data-[disabled=true]/input-group:opacity-50 [&>kbd]:rounded-none [&>ng-icon:not([class*='text-'])]:text-[length:--spacing(4)];
1186
1182
  }
1187
1183
 
1188
1184
  .spartan-input-group-addon-align-inline-start {
@@ -1206,7 +1202,7 @@
1206
1202
  }
1207
1203
 
1208
1204
  .spartan-input-group-button-size-xs {
1209
- @apply h-6 gap-1 rounded-none px-1.5 [&>ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*3.5)];
1205
+ @apply h-6 gap-1 rounded-none px-1.5 [&>ng-icon:not([class*='text-'])]:text-[length:--spacing(3.5)];
1210
1206
  }
1211
1207
 
1212
1208
  .spartan-input-group-button-size-icon-xs {
@@ -1222,7 +1218,7 @@
1222
1218
  }
1223
1219
 
1224
1220
  .spartan-input-group-text {
1225
- @apply text-muted-foreground gap-2 text-xs [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
1221
+ @apply text-muted-foreground gap-2 text-xs [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(4)];
1226
1222
  }
1227
1223
 
1228
1224
  .spartan-input-group-input {