@spartan-ng/cli 0.0.1-alpha.658 → 0.0.1-alpha.660

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 (14) hide show
  1. package/package.json +1 -1
  2. package/src/generators/base/lib/styles/transform-style-map.js +1 -1
  3. package/src/generators/base/lib/styles/transform-style-map.js.map +1 -1
  4. package/src/generators/ui/libs/alert/files/lib/hlm-alert-action.ts.template +1 -1
  5. package/src/generators/ui/libs/alert/files/lib/hlm-alert-description.ts.template +1 -4
  6. package/src/generators/ui/libs/alert/files/lib/hlm-alert-title.ts.template +1 -4
  7. package/src/generators/ui/libs/alert/files/lib/hlm-alert.ts.template +10 -13
  8. package/src/generators/ui/style-luma.css +1365 -0
  9. package/src/generators/ui/style-lyra.css +29 -29
  10. package/src/generators/ui/style-maia.css +28 -28
  11. package/src/generators/ui/style-mira.css +28 -28
  12. package/src/generators/ui/style-nova.css +39 -39
  13. package/src/generators/ui/style-vega.css +40 -40
  14. package/src/generators/ui/supported-ui-libraries.json +41 -41
package/src/generators/ui/style-lyra.css CHANGED
@@ -5,7 +5,7 @@
5
5
  }
6
6
 
7
7
  .spartan-accordion-trigger {
8
- @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-left text-xs font-medium hover:underline focus-visible:ring-1 **:data-[slot=accordion-trigger-icon]:ml-auto **:data-[slot=accordion-trigger-icon]:size-4;
8
+ @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]:ml-auto **:data-[slot=accordion-trigger-icon]:size-4;
9
9
  }
10
10
 
11
11
  .spartan-accordion-content {
@@ -18,7 +18,7 @@
18
18
 
19
19
  /* MARK: Alert */
20
20
  .spartan-alert {
21
- @apply grid gap-0.5 rounded-none border px-2.5 py-2 text-left text-xs has-data-[slot=alert-action]:relative has-data-[slot=alert-action]:pe-18 has-[>svg]:grid-cols-[auto_1fr] has-[>svg]:gap-x-2 *:[svg]:row-span-2 *:[svg]:translate-y-0 *:[svg]:text-current *:[svg:not([class*='size-'])]:size-4;
21
+ @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)];
22
22
  }
23
23
 
24
24
  .spartan-alert-variant-default {
@@ -26,11 +26,11 @@
26
26
  }
27
27
 
28
28
  .spartan-alert-variant-destructive {
29
- @apply text-destructive bg-card *:data-[slot=alert-description]:text-destructive/90 *:[svg]:text-current;
29
+ @apply text-destructive bg-card *:data-[slot=alert-description]:text-destructive/90 *:[ng-icon]:text-current;
30
30
  }
31
31
 
32
32
  .spartan-alert-title {
33
- @apply font-medium group-has-[>svg]/alert:col-start-2;
33
+ @apply font-medium group-has-[>ng-icon]/alert:col-start-2;
34
34
  }
35
35
 
36
36
  .spartan-alert-description {
@@ -51,11 +51,11 @@
51
51
  }
52
52
 
53
53
  .spartan-alert-dialog-header {
54
- @apply grid grid-rows-[auto_1fr] place-items-center gap-1.5 text-center has-data-[slot=alert-dialog-media]:grid-rows-[auto_auto_1fr] has-data-[slot=alert-dialog-media]:gap-x-4 sm:group-data-[size=default]/alert-dialog-content:place-items-start sm:group-data-[size=default]/alert-dialog-content:text-left sm:group-data-[size=default]/alert-dialog-content:has-data-[slot=alert-dialog-media]:grid-rows-[auto_1fr];
54
+ @apply grid grid-rows-[auto_1fr] place-items-center gap-1.5 text-center has-data-[slot=alert-dialog-media]:grid-rows-[auto_auto_1fr] has-data-[slot=alert-dialog-media]:gap-x-4 sm:group-data-[size=default]/alert-dialog-content:place-items-start sm:group-data-[size=default]/alert-dialog-content:text-start sm:group-data-[size=default]/alert-dialog-content:has-data-[slot=alert-dialog-media]:grid-rows-[auto_1fr];
55
55
  }
56
56
 
57
57
  .spartan-alert-dialog-media {
58
- @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 *:[svg:not([class*='size-'])]:size-6;
58
+ @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)];
59
59
  }
60
60
 
61
61
  .spartan-alert-dialog-title {
@@ -84,12 +84,12 @@
84
84
  }
85
85
 
86
86
  .spartan-avatar-group-count {
87
- @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 [&>svg]:size-4 group-has-data-[size=lg]/avatar-group:[&>svg]:size-5 group-has-data-[size=sm]/avatar-group:[&>svg]:size-3;
87
+ @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)];
88
88
  }
89
89
 
90
90
  /* MARK: Badge */
91
91
  .spartan-badge {
92
- @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-[--spacing(3)];
92
+ @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)];
93
93
  }
94
94
 
95
95
  .spartan-badge-variant-default {
@@ -134,16 +134,16 @@
134
134
  }
135
135
 
136
136
  .spartan-breadcrumb-separator {
137
- @apply [&>svg]:size-3.5;
137
+ @apply [&>ng-icon]:text-[calc(var(--spacing)*3.5)];
138
138
  }
139
139
 
140
140
  .spartan-breadcrumb-ellipsis {
141
- @apply size-5 [&>svg]:size-4;
141
+ @apply size-5 [&>ng-icon]:text-[calc(var(--spacing)*4)];
142
142
  }
143
143
 
144
144
  /* MARK: Button */
145
145
  .spartan-button {
146
- @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 data-[matches-spartan-invalid=true]:ring-1 [&_ng-icon:not([class*='text-'])]:text-[--spacing(4)];
146
+ @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 data-[matches-spartan-invalid=true]:ring-1 [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
147
147
  }
148
148
 
149
149
  .spartan-button-variant-default {
@@ -264,7 +264,7 @@
264
264
  }
265
265
 
266
266
  .spartan-checkbox-indicator {
267
- @apply [&>svg]:size-3.5;
267
+ @apply [&>ng-icon]:text-[calc(var(--spacing)*3.5)];
268
268
  }
269
269
 
270
270
  /* MARK: Combobox */
@@ -366,7 +366,7 @@
366
366
  }
367
367
 
368
368
  .spartan-command-item {
369
- @apply data-selected:bg-muted data-selected:text-foreground data-selected:*:[svg]: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)];
369
+ @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)];
370
370
  }
371
371
 
372
372
  .spartan-command-shortcut {
@@ -383,7 +383,7 @@
383
383
  }
384
384
 
385
385
  .spartan-context-menu-item {
386
- @apply focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:text-destructive focus:*:[svg]: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)];
386
+ @apply focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[ng-icon]:text-destructive focus:*:[ng-icon]: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)];
387
387
  }
388
388
 
389
389
  .spartan-context-menu-checkbox-item {
@@ -436,7 +436,7 @@
436
436
  }
437
437
 
438
438
  .spartan-dialog-header {
439
- @apply gap-1 text-left;
439
+ @apply gap-1 text-start;
440
440
  }
441
441
 
442
442
  .spartan-dialog-title {
@@ -461,7 +461,7 @@
461
461
  }
462
462
 
463
463
  .spartan-drawer-header {
464
- @apply gap-0.5 p-4 group-data-[vaul-drawer-direction=bottom]/drawer-content:text-center group-data-[vaul-drawer-direction=top]/drawer-content:text-center md:gap-0.5 md:text-left;
464
+ @apply gap-0.5 p-4 group-data-[vaul-drawer-direction=bottom]/drawer-content:text-center group-data-[vaul-drawer-direction=top]/drawer-content:text-center md:gap-0.5 md:text-start;
465
465
  }
466
466
 
467
467
  .spartan-drawer-title {
@@ -486,7 +486,7 @@
486
486
  }
487
487
 
488
488
  .spartan-dropdown-menu-item {
489
- @apply focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:text-destructive 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)];
489
+ @apply focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[ng-icon]:text-destructive 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)];
490
490
  }
491
491
 
492
492
  .spartan-dropdown-menu-checkbox-item {
@@ -588,7 +588,7 @@
588
588
  }
589
589
 
590
590
  .spartan-field-description {
591
- @apply text-muted-foreground text-left text-xs/relaxed [[data-variant=legend]+&]:-mt-1.5;
591
+ @apply text-muted-foreground text-start text-xs/relaxed [[data-variant=legend]+&]:-mt-1.5;
592
592
  }
593
593
 
594
594
  .spartan-field-separator {
@@ -692,7 +692,7 @@
692
692
  }
693
693
 
694
694
  .spartan-item-description {
695
- @apply text-muted-foreground text-left text-xs/relaxed group-data-[size=xs]/item:text-xs/relaxed;
695
+ @apply text-muted-foreground text-start text-xs/relaxed group-data-[size=xs]/item:text-xs/relaxed;
696
696
  }
697
697
 
698
698
  .spartan-item-actions {
@@ -747,7 +747,7 @@
747
747
  }
748
748
 
749
749
  .spartan-menubar-item {
750
- @apply focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:text-destructive! not-data-[variant=destructive]:focus:**:text-accent-foreground gap-2 rounded-none px-2 py-2 text-xs data-disabled:opacity-50 data-inset:ps-8 [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
750
+ @apply focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[ng-icon]:text-destructive! not-data-[variant=destructive]:focus:**:text-accent-foreground gap-2 rounded-none px-2 py-2 text-xs data-disabled:opacity-50 data-inset:ps-8 [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
751
751
  }
752
752
 
753
753
  .spartan-menubar-checkbox-item {
@@ -936,7 +936,7 @@
936
936
  }
937
937
 
938
938
  .spartan-select-value {
939
- @apply flex flex-1 text-left;
939
+ @apply flex flex-1 text-start;
940
940
  }
941
941
 
942
942
  .spartan-select-trigger-icon {
@@ -1075,15 +1075,15 @@
1075
1075
  }
1076
1076
 
1077
1077
  .spartan-sidebar-group-label {
1078
- @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 [&>svg]:size-4;
1078
+ @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)];
1079
1079
  }
1080
1080
 
1081
1081
  .spartan-sidebar-group-action {
1082
- @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 [&>svg]:size-4;
1082
+ @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)];
1083
1083
  }
1084
1084
 
1085
1085
  .spartan-sidebar-menu-button {
1086
- @apply ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground data-active:bg-sidebar-accent data-active:text-sidebar-accent-foreground data-open:hover:bg-sidebar-accent data-open:hover:text-sidebar-accent-foreground gap-2 rounded-none p-2 text-left text-xs transition-[width,height,padding] group-has-data-[sidebar=menu-action]/menu-item:pe-8 group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:p-2! focus-visible:ring-2 data-active:font-medium;
1086
+ @apply ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground data-active:bg-sidebar-accent data-active:text-sidebar-accent-foreground data-open:hover:bg-sidebar-accent data-open:hover:text-sidebar-accent-foreground gap-2 rounded-none p-2 text-start text-xs transition-[width,height,padding] group-has-data-[sidebar=menu-action]/menu-item:pe-8 group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:p-2! focus-visible:ring-2 data-active:font-medium;
1087
1087
  }
1088
1088
 
1089
1089
  .spartan-sidebar-menu-button-variant-default {
@@ -1107,7 +1107,7 @@
1107
1107
  }
1108
1108
 
1109
1109
  .spartan-sidebar-menu-action {
1110
- @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 [&>svg]:size-4;
1110
+ @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)];
1111
1111
  }
1112
1112
 
1113
1113
  .spartan-sidebar-menu-badge {
@@ -1131,7 +1131,7 @@
1131
1131
  }
1132
1132
 
1133
1133
  .spartan-sidebar-menu-sub-button {
1134
- @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 [&>svg]:size-4;
1134
+ @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)];
1135
1135
  }
1136
1136
 
1137
1137
  /* MARK: Skeleton */
@@ -1196,7 +1196,7 @@
1196
1196
  }
1197
1197
 
1198
1198
  .spartan-table-head {
1199
- @apply text-foreground h-10 px-2 text-left align-middle font-medium whitespace-nowrap [&:has([role=checkbox])]:pe-0;
1199
+ @apply text-foreground h-10 px-2 text-start align-middle font-medium whitespace-nowrap [&:has([role=checkbox])]:pe-0;
1200
1200
  }
1201
1201
 
1202
1202
  .spartan-table-cell {
@@ -1314,11 +1314,11 @@
1314
1314
  }
1315
1315
 
1316
1316
  .spartan-input-group-button-size-icon-xs {
1317
- @apply size-6 rounded-none p-0 has-[>svg]:p-0;
1317
+ @apply size-6 rounded-none p-0 has-[>ng-icon]:p-0;
1318
1318
  }
1319
1319
 
1320
1320
  .spartan-input-group-button-size-icon-sm {
1321
- @apply size-8 p-0 has-[>svg]:p-0;
1321
+ @apply size-8 p-0 has-[>ng-icon]:p-0;
1322
1322
  }
1323
1323
 
1324
1324
  .spartan-input-group-text {
package/src/generators/ui/style-maia.css CHANGED
@@ -9,7 +9,7 @@
9
9
  }
10
10
 
11
11
  .spartan-accordion-trigger {
12
- @apply **:data-[slot=accordion-trigger-icon]:text-muted-foreground gap-6 p-4 text-left text-sm font-medium hover:underline **:data-[slot=accordion-trigger-icon]:ml-auto **:data-[slot=accordion-trigger-icon]:size-4;
12
+ @apply **:data-[slot=accordion-trigger-icon]:text-muted-foreground gap-6 p-4 text-start text-sm font-medium hover:underline **:data-[slot=accordion-trigger-icon]:ml-auto **:data-[slot=accordion-trigger-icon]:size-4;
13
13
  }
14
14
 
15
15
  .spartan-accordion-content {
@@ -30,11 +30,11 @@
30
30
  }
31
31
 
32
32
  .spartan-alert-dialog-header {
33
- @apply grid grid-rows-[auto_1fr] place-items-center gap-1.5 text-center has-data-[slot=alert-dialog-media]:grid-rows-[auto_auto_1fr] has-data-[slot=alert-dialog-media]:gap-x-6 sm:group-data-[size=default]/alert-dialog-content:place-items-start sm:group-data-[size=default]/alert-dialog-content:text-left sm:group-data-[size=default]/alert-dialog-content:has-data-[slot=alert-dialog-media]:grid-rows-[auto_1fr];
33
+ @apply grid grid-rows-[auto_1fr] place-items-center gap-1.5 text-center has-data-[slot=alert-dialog-media]:grid-rows-[auto_auto_1fr] has-data-[slot=alert-dialog-media]:gap-x-6 sm:group-data-[size=default]/alert-dialog-content:place-items-start sm:group-data-[size=default]/alert-dialog-content:text-start sm:group-data-[size=default]/alert-dialog-content:has-data-[slot=alert-dialog-media]:grid-rows-[auto_1fr];
34
34
  }
35
35
 
36
36
  .spartan-alert-dialog-media {
37
- @apply bg-muted mb-2 inline-flex size-16 items-center justify-center rounded-full sm:group-data-[size=default]/alert-dialog-content:row-span-2 *:[svg:not([class*='size-'])]:size-8;
37
+ @apply bg-muted mb-2 inline-flex size-16 items-center justify-center rounded-full sm:group-data-[size=default]/alert-dialog-content:row-span-2 *:[ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*8)];
38
38
  }
39
39
 
40
40
  .spartan-alert-dialog-title {
@@ -47,7 +47,7 @@
47
47
 
48
48
  /* MARK: Alert */
49
49
  .spartan-alert {
50
- @apply grid gap-0.5 rounded-lg border px-4 py-3 text-left text-sm has-data-[slot=alert-action]:relative has-data-[slot=alert-action]:pe-18 has-[>svg]:grid-cols-[auto_1fr] has-[>svg]:gap-x-2.5 *:[svg]:row-span-2 *:[svg]:translate-y-0.5 *:[svg]:text-current *:[svg:not([class*='size-'])]:size-4;
50
+ @apply grid gap-0.5 rounded-lg border px-4 py-3 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.5 *:[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)];
51
51
  }
52
52
 
53
53
  .spartan-alert-variant-default {
@@ -55,11 +55,11 @@
55
55
  }
56
56
 
57
57
  .spartan-alert-variant-destructive {
58
- @apply text-destructive bg-card *:data-[slot=alert-description]:text-destructive/90 *:[svg]:text-current;
58
+ @apply text-destructive bg-card *:data-[slot=alert-description]:text-destructive/90 *:[ng-icon]:text-current;
59
59
  }
60
60
 
61
61
  .spartan-alert-title {
62
- @apply font-medium group-has-[>svg]/alert:col-start-2;
62
+ @apply font-medium group-has-[>ng-icon]/alert:col-start-2;
63
63
  }
64
64
 
65
65
  .spartan-alert-description {
@@ -88,12 +88,12 @@
88
88
  }
89
89
 
90
90
  .spartan-avatar-group-count {
91
- @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 [&>svg]:size-4 group-has-data-[size=lg]/avatar-group:[&>svg]:size-5 group-has-data-[size=sm]/avatar-group:[&>svg]:size-3;
91
+ @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)];
92
92
  }
93
93
 
94
94
  /* MARK: Badge */
95
95
  .spartan-badge {
96
- @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-[--spacing(3)];
96
+ @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)];
97
97
  }
98
98
 
99
99
  .spartan-badge-variant-default {
@@ -138,16 +138,16 @@
138
138
  }
139
139
 
140
140
  .spartan-breadcrumb-separator {
141
- @apply [&>svg]:size-3.5;
141
+ @apply [&>ng-icon]:text-[calc(var(--spacing)*3.5)];
142
142
  }
143
143
 
144
144
  .spartan-breadcrumb-ellipsis {
145
- @apply size-5 [&>svg]:size-4;
145
+ @apply size-5 [&>ng-icon]:text-[calc(var(--spacing)*4)];
146
146
  }
147
147
 
148
148
  /* MARK: Button */
149
149
  .spartan-button {
150
- @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-4xl border border-transparent bg-clip-padding text-sm font-medium focus-visible:ring-[3px] data-[matches-spartan-invalid=true]:ring-[3px] [&_ng-icon:not([class*='text-'])]:text-[--spacing(4)];
150
+ @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-4xl border border-transparent bg-clip-padding text-sm font-medium focus-visible:ring-[3px] data-[matches-spartan-invalid=true]:ring-[3px] [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
151
151
  }
152
152
 
153
153
  .spartan-button-variant-default {
@@ -285,7 +285,7 @@
285
285
  }
286
286
 
287
287
  .spartan-checkbox-indicator {
288
- @apply [&>svg]:size-3.5;
288
+ @apply [&>ng-icon]:text-[calc(var(--spacing)*3.5)];
289
289
  }
290
290
 
291
291
  /* MARK: Combobox */
@@ -387,7 +387,7 @@
387
387
  }
388
388
 
389
389
  .spartan-command-item {
390
- @apply data-selected:bg-muted data-selected:text-foreground data-selected:*:[svg]:text-foreground relative flex cursor-default items-center gap-2 rounded-lg px-3 py-2 text-sm outline-hidden select-none in-data-[slot=dialog-content]:rounded-2xl [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
390
+ @apply data-selected:bg-muted data-selected:text-foreground data-selected:*:[ng-icon]:text-foreground relative flex cursor-default items-center gap-2 rounded-lg px-3 py-2 text-sm outline-hidden select-none in-data-[slot=dialog-content]:rounded-2xl [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
391
391
  }
392
392
 
393
393
  .spartan-command-shortcut {
@@ -404,7 +404,7 @@
404
404
  }
405
405
 
406
406
  .spartan-context-menu-item {
407
- @apply focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:text-destructive focus:*:[svg]:text-accent-foreground gap-2.5 rounded-xl px-3 py-2 text-sm data-inset:ps-9.5 [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
407
+ @apply focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[ng-icon]:text-destructive focus:*:[ng-icon]:text-accent-foreground gap-2.5 rounded-xl px-3 py-2 text-sm data-inset:ps-9.5 [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
408
408
  }
409
409
 
410
410
  .spartan-context-menu-checkbox-item {
@@ -486,7 +486,7 @@
486
486
  }
487
487
 
488
488
  .spartan-drawer-header {
489
- @apply gap-0.5 p-4 group-data-[vaul-drawer-direction=bottom]/drawer-content:text-center group-data-[vaul-drawer-direction=top]/drawer-content:text-center md:gap-1.5 md:text-left;
489
+ @apply gap-0.5 p-4 group-data-[vaul-drawer-direction=bottom]/drawer-content:text-center group-data-[vaul-drawer-direction=top]/drawer-content:text-center md:gap-1.5 md:text-start;
490
490
  }
491
491
 
492
492
  .spartan-drawer-title {
@@ -511,7 +511,7 @@
511
511
  }
512
512
 
513
513
  .spartan-dropdown-menu-item {
514
- @apply focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:text-destructive not-data-[variant=destructive]:focus:**:text-accent-foreground gap-2.5 rounded-xl px-3 py-2 text-sm data-inset:ps-9.5 [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
514
+ @apply focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[ng-icon]:text-destructive not-data-[variant=destructive]:focus:**:text-accent-foreground gap-2.5 rounded-xl px-3 py-2 text-sm data-inset:ps-9.5 [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
515
515
  }
516
516
 
517
517
  .spartan-dropdown-menu-checkbox-item {
@@ -613,7 +613,7 @@
613
613
  }
614
614
 
615
615
  .spartan-field-description {
616
- @apply text-muted-foreground text-left text-sm [[data-variant=legend]+&]:-mt-1.5;
616
+ @apply text-muted-foreground text-start text-sm [[data-variant=legend]+&]:-mt-1.5;
617
617
  }
618
618
 
619
619
  .spartan-field-separator {
@@ -717,7 +717,7 @@
717
717
  }
718
718
 
719
719
  .spartan-item-description {
720
- @apply text-muted-foreground text-left text-sm;
720
+ @apply text-muted-foreground text-start text-sm;
721
721
  }
722
722
 
723
723
  .spartan-item-actions {
@@ -772,7 +772,7 @@
772
772
  }
773
773
 
774
774
  .spartan-menubar-item {
775
- @apply focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:text-destructive! not-data-[variant=destructive]:focus:**:text-accent-foreground gap-2.5 rounded-xl px-3 py-2 text-sm data-disabled:opacity-50 data-inset:ps-9.5 [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
775
+ @apply focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[ng-icon]:text-destructive! not-data-[variant=destructive]:focus:**:text-accent-foreground gap-2.5 rounded-xl px-3 py-2 text-sm data-disabled:opacity-50 data-inset:ps-9.5 [&_ng-icon:not([class*='text-'])]:text-[calc(var(--spacing)*4)];
776
776
  }
777
777
 
778
778
  .spartan-menubar-checkbox-item {
@@ -961,7 +961,7 @@
961
961
  }
962
962
 
963
963
  .spartan-select-value {
964
- @apply flex flex-1 text-left;
964
+ @apply flex flex-1 text-start;
965
965
  }
966
966
 
967
967
  .spartan-select-trigger-icon {
@@ -1100,15 +1100,15 @@
1100
1100
  }
1101
1101
 
1102
1102
  .spartan-sidebar-group-label {
1103
- @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 [&>svg]:size-4;
1103
+ @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)];
1104
1104
  }
1105
1105
 
1106
1106
  .spartan-sidebar-group-action {
1107
- @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 [&>svg]:size-4;
1107
+ @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)];
1108
1108
  }
1109
1109
 
1110
1110
  .spartan-sidebar-menu-button {
1111
- @apply ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground data-active:bg-sidebar-accent data-active:text-sidebar-accent-foreground data-open:hover:bg-sidebar-accent data-open:hover:text-sidebar-accent-foreground gap-2 rounded-lg px-3 py-2 text-left text-sm transition-[width,height,padding] group-has-data-[sidebar=menu-action]/menu-item:pe-8 group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:p-2! focus-visible:ring-2 data-active:font-medium;
1111
+ @apply ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground data-active:bg-sidebar-accent data-active:text-sidebar-accent-foreground data-open:hover:bg-sidebar-accent data-open:hover:text-sidebar-accent-foreground gap-2 rounded-lg px-3 py-2 text-start text-sm transition-[width,height,padding] group-has-data-[sidebar=menu-action]/menu-item:pe-8 group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:p-2! focus-visible:ring-2 data-active:font-medium;
1112
1112
  }
1113
1113
 
1114
1114
  .spartan-sidebar-menu-button-variant-default {
@@ -1132,7 +1132,7 @@
1132
1132
  }
1133
1133
 
1134
1134
  .spartan-sidebar-menu-action {
1135
- @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-2 peer-data-[size=lg]/menu-button:top-2.5 peer-data-[size=sm]/menu-button:top-1 focus-visible:ring-2 [&>svg]:size-4;
1135
+ @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-2 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)];
1136
1136
  }
1137
1137
 
1138
1138
  .spartan-sidebar-menu-badge {
@@ -1156,7 +1156,7 @@
1156
1156
  }
1157
1157
 
1158
1158
  .spartan-sidebar-menu-sub-button {
1159
- @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 [&>svg]:size-4;
1159
+ @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)];
1160
1160
  }
1161
1161
 
1162
1162
  /* MARK: Skeleton */
@@ -1221,7 +1221,7 @@
1221
1221
  }
1222
1222
 
1223
1223
  .spartan-table-head {
1224
- @apply text-foreground h-12 px-3 text-left align-middle font-medium whitespace-nowrap [&:has([role=checkbox])]:pe-0;
1224
+ @apply text-foreground h-12 px-3 text-start align-middle font-medium whitespace-nowrap [&:has([role=checkbox])]:pe-0;
1225
1225
  }
1226
1226
 
1227
1227
  .spartan-table-cell {
@@ -1339,11 +1339,11 @@
1339
1339
  }
1340
1340
 
1341
1341
  .spartan-input-group-button-size-icon-xs {
1342
- @apply size-6 p-0 has-[>svg]:p-0;
1342
+ @apply size-6 p-0 has-[>ng-icon]:p-0;
1343
1343
  }
1344
1344
 
1345
1345
  .spartan-input-group-button-size-icon-sm {
1346
- @apply size-8 p-0 has-[>svg]:p-0;
1346
+ @apply size-8 p-0 has-[>ng-icon]:p-0;
1347
1347
  }
1348
1348
 
1349
1349
  .spartan-input-group-text {