@spartan-ng/cli 0.0.1-alpha.718 → 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 (36) hide show
  1. package/package.json +1 -1
  2. package/src/generators/base/generator.js +30 -0
  3. package/src/generators/base/generator.js.map +1 -1
  4. package/src/generators/base/lib/build-dependency-array.js +13 -0
  5. package/src/generators/base/lib/build-dependency-array.js.map +1 -1
  6. package/src/generators/base/versions.d.ts +1 -1
  7. package/src/generators/base/versions.js +1 -1
  8. package/src/generators/migrate-naming-convention/__snapshots__/generator.spec.ts.snap +1 -1
  9. package/src/generators/ui/libs/avatar/files/lib/hlm-avatar-badge.ts.template +2 -2
  10. package/src/generators/ui/libs/breadcrumb/files/lib/hlm-breadcrumb-ellipsis.ts.template +9 -4
  11. package/src/generators/ui/libs/carousel/files/lib/hlm-carousel-next.ts.template +3 -4
  12. package/src/generators/ui/libs/carousel/files/lib/hlm-carousel-previous.ts.template +3 -4
  13. package/src/generators/ui/libs/checkbox/files/lib/hlm-checkbox.ts.template +3 -4
  14. package/src/generators/ui/libs/dialog/files/lib/hlm-dialog-content.ts.template +4 -4
  15. package/src/generators/ui/libs/dropdown-menu/files/lib/hlm-dropdown-menu-item-sub-indicator.ts.template +1 -1
  16. package/src/generators/ui/libs/input-otp/files/lib/hlm-input-otp-separator.ts.template +2 -3
  17. package/src/generators/ui/libs/sheet/files/lib/hlm-sheet-content.ts.template +4 -4
  18. package/src/generators/ui/libs/sidebar/files/lib/hlm-sidebar-menu-button.ts.template +1 -1
  19. package/src/generators/ui/libs/spinner/files/lib/hlm-spinner.ts.template +1 -1
  20. package/src/generators/ui/libs/tabs/files/lib/hlm-tabs-paginated-list.ts.template +7 -8
  21. package/src/generators/ui/primitive-deps.js +19 -20
  22. package/src/generators/ui/primitive-deps.js.map +1 -1
  23. package/src/generators/ui/primitives.d.ts +1 -1
  24. package/src/generators/ui/style-luma.css +43 -43
  25. package/src/generators/ui/style-lyra.css +44 -44
  26. package/src/generators/ui/style-maia.css +43 -43
  27. package/src/generators/ui/style-mira.css +48 -48
  28. package/src/generators/ui/style-nova.css +45 -45
  29. package/src/generators/ui/style-vega.css +43 -43
  30. package/src/generators/ui/supported-ui-libraries.json +41 -49
  31. package/src/generators/ui/libs/icon/files/index.ts.template +0 -7
  32. package/src/generators/ui/libs/icon/files/lib/hlm-icon.token.ts.template +0 -20
  33. package/src/generators/ui/libs/icon/files/lib/hlm-icon.ts.template +0 -35
  34. package/src/generators/ui/libs/icon/generator.d.ts +0 -3
  35. package/src/generators/ui/libs/icon/generator.js +0 -9
  36. package/src/generators/ui/libs/icon/generator.js.map +0 -1
@@ -9,7 +9,7 @@
9
9
  }
10
10
 
11
11
  .spartan-accordion-trigger {
12
- @apply focus-visible:ring-ring/50 focus-visible:border-ring focus-visible:after:border-ring **:data-[slot=accordion-trigger-icon]:text-muted-foreground! rounded-lg py-2.5 text-start text-sm font-medium hover:underline focus-visible:ring-3 **:data-[slot=accordion-trigger-icon]:ms-auto **:data-[slot=accordion-trigger-icon]:text-[calc(var(--spacing)*4)];
12
+ @apply focus-visible:ring-ring/50 focus-visible:border-ring focus-visible:after:border-ring **:data-[slot=accordion-trigger-icon]:text-muted-foreground! rounded-lg py-2.5 text-start text-sm font-medium hover:underline focus-visible:ring-3 **:data-[slot=accordion-trigger-icon]:ms-auto **:data-[slot=accordion-trigger-icon]:text-[length:--spacing(4)];
13
13
  }
14
14
 
15
15
  .spartan-accordion-content {
@@ -22,7 +22,7 @@
22
22
 
23
23
  /* MARK: Alert */
24
24
  .spartan-alert {
25
- @apply grid gap-0.5 rounded-lg border px-2.5 py-2 text-start text-sm 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.5 *:[ng-icon]:text-current *:[ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
25
+ @apply grid gap-0.5 rounded-lg border px-2.5 py-2 text-start text-sm 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.5 *:[ng-icon]:text-current *:[ng-icon:not([class*='text-'])]:text-[length:--spacing(4)];
26
26
  }
27
27
 
28
28
  .spartan-alert-variant-default {
@@ -59,7 +59,7 @@
59
59
  }
60
60
 
61
61
  .spartan-alert-dialog-media {
62
- @apply bg-muted mb-2 inline-flex size-10 items-center justify-center rounded-md sm:group-data-[size=default]/alert-dialog-content:row-span-2 *:[ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*6)];
62
+ @apply bg-muted mb-2 inline-flex size-10 items-center justify-center rounded-md sm:group-data-[size=default]/alert-dialog-content:row-span-2 *:[ng-icon:not([class*='text-'])]:text-[length:--spacing(6)];
63
63
  }
64
64
 
65
65
  .spartan-alert-dialog-title {
@@ -88,7 +88,7 @@
88
88
  }
89
89
 
90
90
  .spartan-autocomplete-item-indicator {
91
- @apply absolute end-2 flex items-center justify-center text-[calc(var(--spacing)*4)];
91
+ @apply absolute end-2 flex items-center justify-center text-[length:--spacing(4)];
92
92
  }
93
93
 
94
94
  .spartan-autocomplete-empty {
@@ -125,12 +125,12 @@
125
125
  }
126
126
 
127
127
  .spartan-avatar-group-count {
128
- @apply bg-muted text-muted-foreground size-8 rounded-full text-sm 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)];
128
+ @apply bg-muted text-muted-foreground size-8 rounded-full text-sm 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)];
129
129
  }
130
130
 
131
131
  /* MARK: Badge */
132
132
  .spartan-badge {
133
- @apply h-5 gap-1 rounded-4xl 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)];
133
+ @apply h-5 gap-1 rounded-4xl 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)];
134
134
  }
135
135
 
136
136
  .spartan-badge-variant-default {
@@ -175,16 +175,16 @@
175
175
  }
176
176
 
177
177
  .spartan-breadcrumb-separator {
178
- @apply [&>ng-icon]:text-[calc(var(--spacing)*3.5)];
178
+ @apply [&>ng-icon]:text-[length:--spacing(3.5)];
179
179
  }
180
180
 
181
181
  .spartan-breadcrumb-ellipsis {
182
- @apply size-5 [&>ng-icon]:text-[calc(var(--spacing)*4)];
182
+ @apply size-5 [&>ng-icon]:text-[length:--spacing(4)];
183
183
  }
184
184
 
185
185
  /* MARK: Button */
186
186
  .spartan-button {
187
- @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-lg border border-transparent bg-clip-padding text-sm font-medium focus-visible:ring-3 active:not-aria-[haspopup]:translate-y-px data-[matches-spartan-invalid=true]:ring-3 [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
187
+ @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-lg border border-transparent bg-clip-padding text-sm font-medium focus-visible:ring-3 active:not-aria-[haspopup]:translate-y-px data-[matches-spartan-invalid=true]:ring-3 [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(4)];
188
188
  }
189
189
 
190
190
  .spartan-button-variant-default {
@@ -212,11 +212,11 @@
212
212
  }
213
213
 
214
214
  .spartan-button-size-xs {
215
- @apply h-6 gap-1 rounded-[min(var(--radius-md),10px)] px-2 text-xs in-data-[slot=button-group]:rounded-lg 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)];
215
+ @apply h-6 gap-1 rounded-[min(var(--radius-md),10px)] px-2 text-xs in-data-[slot=button-group]:rounded-lg 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)];
216
216
  }
217
217
 
218
218
  .spartan-button-size-sm {
219
- @apply h-7 gap-1 rounded-[min(var(--radius-md),12px)] px-2.5 text-[0.8rem] in-data-[slot=button-group]:rounded-lg 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)];
219
+ @apply h-7 gap-1 rounded-[min(var(--radius-md),12px)] px-2.5 text-[0.8rem] in-data-[slot=button-group]:rounded-lg 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)];
220
220
  }
221
221
 
222
222
  .spartan-button-size-default {
@@ -228,7 +228,7 @@
228
228
  }
229
229
 
230
230
  .spartan-button-size-icon-xs {
231
- @apply size-6 rounded-[min(var(--radius-md),10px)] in-data-[slot=button-group]:rounded-lg [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*3)];
231
+ @apply size-6 rounded-[min(var(--radius-md),10px)] in-data-[slot=button-group]:rounded-lg [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(3)];
232
232
  }
233
233
 
234
234
  .spartan-button-size-icon-sm {
@@ -257,7 +257,7 @@
257
257
  }
258
258
 
259
259
  .spartan-button-group-text {
260
- @apply bg-muted gap-2 rounded-lg border px-2.5 text-sm font-medium [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
260
+ @apply bg-muted gap-2 rounded-lg border px-2.5 text-sm font-medium [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(4)];
261
261
  }
262
262
 
263
263
  .spartan-button-group-separator {
@@ -318,7 +318,7 @@
318
318
  }
319
319
 
320
320
  .spartan-checkbox-indicator {
321
- @apply [&>ng-icon]:text-[calc(var(--spacing)*3.5)];
321
+ @apply [&>ng-icon]:text-[length:--spacing(3.5)];
322
322
  }
323
323
 
324
324
  /* MARK: Combobox */
@@ -335,7 +335,7 @@
335
335
  }
336
336
 
337
337
  .spartan-combobox-item-indicator {
338
- @apply pointer-events-none absolute end-2 flex items-center justify-center text-[calc(var(--spacing)*4)];
338
+ @apply pointer-events-none absolute end-2 flex items-center justify-center text-[length:--spacing(4)];
339
339
  }
340
340
 
341
341
  .spartan-combobox-empty {
@@ -355,7 +355,7 @@
355
355
  }
356
356
 
357
357
  .spartan-combobox-trigger-icon {
358
- @apply text-muted-foreground text-[calc(var(--spacing)*4)];
358
+ @apply text-muted-foreground text-[length:--spacing(4)];
359
359
  }
360
360
 
361
361
  .spartan-combobox-chips {
@@ -375,7 +375,7 @@
375
375
  }
376
376
 
377
377
  .spartan-combobox-placeholder {
378
- @apply gap-2 [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
378
+ @apply gap-2 [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(4)];
379
379
  }
380
380
 
381
381
  .spartan-combobox-status {
@@ -396,7 +396,7 @@
396
396
  }
397
397
 
398
398
  .spartan-command-input-icon {
399
- @apply shrink-0 text-[calc(var(--spacing)*4)] opacity-50;
399
+ @apply shrink-0 text-[length:--spacing(4)] opacity-50;
400
400
  }
401
401
 
402
402
  .spartan-command-input {
@@ -420,7 +420,7 @@
420
420
  }
421
421
 
422
422
  .spartan-command-item {
423
- @apply data-selected:bg-muted data-selected:text-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none in-data-[slot=dialog-content]:rounded-lg! [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
423
+ @apply data-selected:bg-muted data-selected:text-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none in-data-[slot=dialog-content]:rounded-lg! [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(4)];
424
424
  }
425
425
 
426
426
  .spartan-command-shortcut {
@@ -500,19 +500,19 @@
500
500
  }
501
501
 
502
502
  .spartan-dropdown-menu-item {
503
- @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-1.5 rounded-md px-1.5 py-1 text-sm data-inset:ps-7 [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
503
+ @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-1.5 rounded-md px-1.5 py-1 text-sm data-inset:ps-7 [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(4)];
504
504
  }
505
505
 
506
506
  .spartan-dropdown-menu-checkbox-item {
507
- @apply hover:bg-accent focus:bg-accent hover:text-accent-foreground focus:text-accent-foreground hover:**:text-accent-foreground focus:**:text-accent-foreground gap-1.5 rounded-md py-1 ps-1.5 pe-8 text-sm data-inset:ps-7 [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
507
+ @apply hover:bg-accent focus:bg-accent hover:text-accent-foreground focus:text-accent-foreground hover:**:text-accent-foreground focus:**:text-accent-foreground gap-1.5 rounded-md py-1 ps-1.5 pe-8 text-sm data-inset:ps-7 [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(4)];
508
508
  }
509
509
 
510
510
  .spartan-dropdown-menu-radio-item {
511
- @apply hover:bg-accent focus:bg-accent hover:text-accent-foreground focus:text-accent-foreground hover:**:text-accent-foreground focus:**:text-accent-foreground gap-1.5 rounded-md py-1 ps-1.5 pe-8 text-sm data-inset:ps-7 [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
511
+ @apply hover:bg-accent focus:bg-accent hover:text-accent-foreground focus:text-accent-foreground hover:**:text-accent-foreground focus:**:text-accent-foreground gap-1.5 rounded-md py-1 ps-1.5 pe-8 text-sm data-inset:ps-7 [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(4)];
512
512
  }
513
513
 
514
514
  .spartan-dropdown-menu-item-indicator {
515
- @apply absolute end-2 flex items-center justify-center [&_ng-icon]:text-[calc(var(--spacing)*4)];
515
+ @apply absolute end-2 flex items-center justify-center [&_ng-icon]:text-[length:--spacing(4)];
516
516
  }
517
517
 
518
518
  .spartan-dropdown-menu-label {
@@ -549,7 +549,7 @@
549
549
  }
550
550
 
551
551
  .spartan-empty-media-icon {
552
- @apply bg-muted text-foreground flex size-8 shrink-0 items-center justify-center rounded-lg [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
552
+ @apply bg-muted text-foreground flex size-8 shrink-0 items-center justify-center rounded-lg [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(4)];
553
553
  }
554
554
 
555
555
  .spartan-empty-title {
@@ -637,7 +637,7 @@
637
637
  }
638
638
 
639
639
  .spartan-input-otp-separator {
640
- @apply [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
640
+ @apply [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(4)];
641
641
  }
642
642
 
643
643
  /* MARK: Item */
@@ -678,7 +678,7 @@
678
678
  }
679
679
 
680
680
  .spartan-item-media-variant-icon {
681
- @apply [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
681
+ @apply [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(4)];
682
682
  }
683
683
 
684
684
  .spartan-item-media-variant-image {
@@ -719,7 +719,7 @@
719
719
 
720
720
  /* MARK: Kbd */
721
721
  .spartan-kbd {
722
- @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-sm px-1 font-sans text-xs font-medium [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*3)];
722
+ @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-sm px-1 font-sans text-xs font-medium [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(3)];
723
723
  }
724
724
 
725
725
  .spartan-kbd-group {
@@ -754,7 +754,7 @@
754
754
  }
755
755
 
756
756
  .spartan-navigation-menu-link {
757
- @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-lg p-2 text-sm transition-all outline-none focus-visible:ring-3 focus-visible:outline-1 in-data-[slot=navigation-menu-content]:rounded-md [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
757
+ @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-lg p-2 text-sm transition-all outline-none focus-visible:ring-3 focus-visible:outline-1 in-data-[slot=navigation-menu-content]:rounded-md [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(4)];
758
758
  }
759
759
 
760
760
  .spartan-navigation-menu-trigger-icon {
@@ -771,7 +771,7 @@
771
771
  }
772
772
 
773
773
  .spartan-native-select-icon {
774
- @apply text-muted-foreground end-2.5 top-1/2 -translate-y-1/2 text-[calc(var(--spacing)*4)];
774
+ @apply text-muted-foreground end-2.5 top-1/2 -translate-y-1/2 text-[length:--spacing(4)];
775
775
  }
776
776
 
777
777
  /* MARK: Pagination */
@@ -780,7 +780,7 @@
780
780
  }
781
781
 
782
782
  .spartan-pagination-ellipsis {
783
- @apply size-8 items-center justify-center [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
783
+ @apply size-8 items-center justify-center [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(4)];
784
784
  }
785
785
 
786
786
  .spartan-pagination-previous {
@@ -862,7 +862,7 @@
862
862
  }
863
863
 
864
864
  .spartan-select-trigger-icon {
865
- @apply text-muted-foreground text-[calc(var(--spacing)*4)];
865
+ @apply text-muted-foreground text-[length:--spacing(4)];
866
866
  }
867
867
 
868
868
  .spartan-select-content {
@@ -878,7 +878,7 @@
878
878
  }
879
879
 
880
880
  .spartan-select-item-indicator {
881
- @apply absolute end-2 flex items-center justify-center text-[calc(var(--spacing)*4)];
881
+ @apply absolute end-2 flex items-center justify-center text-[length:--spacing(4)];
882
882
  }
883
883
 
884
884
  .spartan-select-group {
@@ -890,15 +890,15 @@
890
890
  }
891
891
 
892
892
  .spartan-select-scroll-up-button {
893
- @apply bg-popover z-10 flex cursor-default items-center justify-center py-1 [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
893
+ @apply bg-popover z-10 flex cursor-default items-center justify-center py-1 [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(4)];
894
894
  }
895
895
 
896
896
  .spartan-select-scroll-down-button {
897
- @apply bg-popover z-10 flex cursor-default items-center justify-center py-1 [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
897
+ @apply bg-popover z-10 flex cursor-default items-center justify-center py-1 [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(4)];
898
898
  }
899
899
 
900
900
  .spartan-select-placeholder {
901
- @apply gap-2 [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
901
+ @apply gap-2 [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(4)];
902
902
  }
903
903
 
904
904
  .spartan-select-values-content {
@@ -997,11 +997,11 @@
997
997
  }
998
998
 
999
999
  .spartan-sidebar-group-label {
1000
- @apply text-sidebar-foreground/70 ring-sidebar-ring h-8 rounded-md px-2 text-xs font-medium 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)];
1000
+ @apply text-sidebar-foreground/70 ring-sidebar-ring h-8 rounded-md px-2 text-xs font-medium 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)];
1001
1001
  }
1002
1002
 
1003
1003
  .spartan-sidebar-group-action {
1004
- @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-md p-0 focus-visible:ring-2 [&>ng-icon]:text-[calc(var(--spacing)*4)];
1004
+ @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-md p-0 focus-visible:ring-2 [&>ng-icon]:text-[length:--spacing(4)];
1005
1005
  }
1006
1006
 
1007
1007
  .spartan-sidebar-menu-button {
@@ -1029,7 +1029,7 @@
1029
1029
  }
1030
1030
 
1031
1031
  .spartan-sidebar-menu-action {
1032
- @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-md 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)];
1032
+ @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-md 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)];
1033
1033
  }
1034
1034
 
1035
1035
  .spartan-sidebar-menu-badge {
@@ -1053,7 +1053,7 @@
1053
1053
  }
1054
1054
 
1055
1055
  .spartan-sidebar-menu-sub-button {
1056
- @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-md px-2 focus-visible:ring-2 data-[size=md]:text-sm data-[size=sm]:text-xs [&>ng-icon]:text-[calc(var(--spacing)*4)];
1056
+ @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-md px-2 focus-visible:ring-2 data-[size=md]:text-sm data-[size=sm]:text-xs [&>ng-icon]:text-[length:--spacing(4)];
1057
1057
  }
1058
1058
 
1059
1059
  /* MARK: Skeleton */
@@ -1143,7 +1143,7 @@
1143
1143
  }
1144
1144
 
1145
1145
  .spartan-tabs-trigger {
1146
- @apply gap-1.5 rounded-md border border-transparent px-1.5 py-0.5 text-sm font-medium group-data-[variant=default]/tabs-list:data-active:shadow-sm group-data-[variant=line]/tabs-list:data-active:shadow-none [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
1146
+ @apply gap-1.5 rounded-md border border-transparent px-1.5 py-0.5 text-sm font-medium group-data-[variant=default]/tabs-list:data-active:shadow-sm group-data-[variant=line]/tabs-list:data-active:shadow-none [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(4)];
1147
1147
  }
1148
1148
 
1149
1149
  .spartan-tabs-content {
@@ -1157,7 +1157,7 @@
1157
1157
 
1158
1158
  /* MARK: Toggle */
1159
1159
  .spartan-toggle {
1160
- @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-lg text-sm font-medium transition-all [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
1160
+ @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-lg text-sm font-medium transition-all [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(4)];
1161
1161
  }
1162
1162
 
1163
1163
  .spartan-toggle-variant-default {
@@ -1173,7 +1173,7 @@
1173
1173
  }
1174
1174
 
1175
1175
  .spartan-toggle-size-sm {
1176
- @apply h-7 min-w-7 rounded-[min(var(--radius-md),12px)] px-2.5 text-[0.8rem] [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*3.5)];
1176
+ @apply h-7 min-w-7 rounded-[min(var(--radius-md),12px)] px-2.5 text-[0.8rem] [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(3.5)];
1177
1177
  }
1178
1178
 
1179
1179
  .spartan-toggle-size-lg {
@@ -1200,7 +1200,7 @@
1200
1200
  }
1201
1201
 
1202
1202
  .spartan-input-group-addon {
1203
- @apply text-muted-foreground h-auto gap-2 py-1.5 text-sm font-medium group-data-[disabled=true]/input-group:opacity-50 [&>kbd]:rounded-[calc(var(--radius)-5px)] [&>ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
1203
+ @apply text-muted-foreground h-auto gap-2 py-1.5 text-sm font-medium group-data-[disabled=true]/input-group:opacity-50 [&>kbd]:rounded-[calc(var(--radius)-5px)] [&>ng-icon:not([class*='text-'])]:text-[length:--spacing(4)];
1204
1204
  }
1205
1205
 
1206
1206
  .spartan-input-group-addon-align-inline-start {
@@ -1224,7 +1224,7 @@
1224
1224
  }
1225
1225
 
1226
1226
  .spartan-input-group-button-size-xs {
1227
- @apply h-6 gap-1 rounded-[calc(var(--radius)-3px)] px-1.5 [&>ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*3.5)];
1227
+ @apply h-6 gap-1 rounded-[calc(var(--radius)-3px)] px-1.5 [&>ng-icon:not([class*='text-'])]:text-[length:--spacing(3.5)];
1228
1228
  }
1229
1229
 
1230
1230
  .spartan-input-group-button-size-icon-xs {
@@ -1236,7 +1236,7 @@
1236
1236
  }
1237
1237
 
1238
1238
  .spartan-input-group-text {
1239
- @apply text-muted-foreground gap-2 text-sm [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
1239
+ @apply text-muted-foreground gap-2 text-sm [&_ng-icon:not([class*='text-'])]:text-[length:--spacing(4)];
1240
1240
  }
1241
1241
 
1242
1242
  .spartan-input-group-input {