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

package/lib/css/accordion.css

@@ -1,4 +1,3 @@
-/* generated using "pnpm jiti scripts/generate-utilities.ts" */
 /* @utility nui-accordion */
 
 @utility nui-accordion {

package/lib/css/autocomplete.css

@@ -1,100 +1,99 @@
-/* generated using "pnpm jiti scripts/generate-utilities.ts" */
 /* @utility nui-autocomplete */
 
 @utility nui-autocomplete {
   @apply w-full relative;
 
-  .nui-autocomplete-label, .nui-label-float {
+  .nui-autocomplete-label, .nui-autocomplete-label-float {
     @apply nui-label;
   }
 
   &:not(.nui-autocomplete-loading) {
-    .nui-autocomplete-input:placeholder-shown ~ .nui-label-float {
+    .nui-autocomplete-input:placeholder-shown ~ .nui-autocomplete-label-float {
       @apply text-muted-300 dark:text-muted-600;
     }
   }
 
-  &:not(.nui-has-icon).nui-autocomplete-sm {
+  &:not(.nui-autocomplete-has-icon).nui-autocomplete-sm {
     .nui-autocomplete-input {
       @apply h-8 py-1 text-xs leading-4 px-2;
     }
   }
 
-  &:not(.nui-has-icon).nui-autocomplete-md {
+  &:not(.nui-autocomplete-has-icon).nui-autocomplete-md {
     .nui-autocomplete-input {
       @apply h-10 py-2 text-sm leading-5 px-3;
     }
   }
 
-  &:not(.nui-has-icon).nui-autocomplete-lg {
+  &:not(.nui-autocomplete-has-icon).nui-autocomplete-lg {
     .nui-autocomplete-input {
       @apply h-12 py-2 text-sm leading-5 px-4;
     }
   }
 
-  &:not(.nui-has-icon).nui-autocomplete-xl {
+  &:not(.nui-autocomplete-has-icon).nui-autocomplete-xl {
     .nui-autocomplete-input {
       @apply h-14 py-2 text-base leading-5 px-4;
     }
   }
 
-  &.nui-autocomplete-label-float:not(.nui-has-icon).nui-autocomplete-sm {
-    .nui-label-float {
+  &.nui-autocomplete-label-float:not(.nui-autocomplete-has-icon).nui-autocomplete-sm {
+    .nui-autocomplete-label-float {
       @apply start-3 -ms-3 -mt-7 text-xs;
     }
 
-    .nui-autocomplete-input:focus-visible ~ .nui-label-float {
+    .nui-autocomplete-input:focus-visible ~ .nui-autocomplete-label-float {
       @apply !-ms-3 !-mt-7;
     }
 
-    .nui-autocomplete-input:placeholder-shown ~ .nui-label-float {
+    .nui-autocomplete-input:placeholder-shown ~ .nui-autocomplete-label-float {
       @apply ms-0 mt-0;
     }
   }
 
-  &.nui-autocomplete-label-float:not(.nui-has-icon).nui-autocomplete-md {
-    .nui-label-float {
+  &.nui-autocomplete-label-float:not(.nui-autocomplete-has-icon).nui-autocomplete-md {
+    .nui-autocomplete-label-float {
       @apply start-3 -ms-3 -mt-8 text-xs;
     }
 
-    .nui-autocomplete-input:focus-visible ~ .nui-label-float {
+    .nui-autocomplete-input:focus-visible ~ .nui-autocomplete-label-float {
       @apply !-ms-3 !-mt-8 !text-xs;
     }
 
-    .nui-autocomplete-input:placeholder-shown ~ .nui-label-float {
+    .nui-autocomplete-input:placeholder-shown ~ .nui-autocomplete-label-float {
       @apply ms-0 mt-0 text-[0.825rem];
     }
   }
 
-  &.nui-autocomplete-label-float:not(.nui-has-icon).nui-autocomplete-lg {
-    .nui-label-float {
+  &.nui-autocomplete-label-float:not(.nui-autocomplete-has-icon).nui-autocomplete-lg {
+    .nui-autocomplete-label-float {
       @apply start-3 -ms-3 -mt-9 text-xs;
     }
 
-    .nui-autocomplete-input:focus-visible ~ .nui-label-float {
+    .nui-autocomplete-input:focus-visible ~ .nui-autocomplete-label-float {
       @apply !-ms-3 !-mt-9 !text-xs;
     }
 
-    .nui-autocomplete-input:placeholder-shown ~ .nui-label-float {
+    .nui-autocomplete-input:placeholder-shown ~ .nui-autocomplete-label-float {
       @apply ms-0 mt-0 text-[0.825rem];
     }
   }
 
-  &.nui-autocomplete-label-float:not(.nui-has-icon).nui-autocomplete-xl {
-    .nui-label-float {
+  &.nui-autocomplete-label-float:not(.nui-autocomplete-has-icon).nui-autocomplete-xl {
+    .nui-autocomplete-label-float {
       @apply start-3 -ms-3 -mt-10 text-xs;
     }
 
-    .nui-autocomplete-input:focus-visible ~ .nui-label-float {
+    .nui-autocomplete-input:focus-visible ~ .nui-autocomplete-label-float {
       @apply !-ms-3 !-mt-10 !text-xs;
     }
 
-    .nui-autocomplete-input:placeholder-shown ~ .nui-label-float {
+    .nui-autocomplete-input:placeholder-shown ~ .nui-autocomplete-label-float {
       @apply ms-0 mt-0 text-[0.825rem];
     }
   }
 }
-@utility nui-label-float {
+@utility nui-autocomplete-label-float {
   @apply pointer-events-none absolute inline-flex select-none items-center leading-none;
   @apply text-primary-500 h-5;
   @apply transition-all duration-300;
@@ -130,7 +129,7 @@
   @apply disabled:cursor-not-allowed disabled:opacity-75;
   @apply transition-all duration-300;
 
-  &:focus-visible ~ .nui-label-float {
+  &:focus-visible ~ .nui-autocomplete-label-float {
     @apply !text-primary-500 dark:!text-primary-500;
   }
 
@@ -185,7 +184,7 @@
     @apply h-4 w-4;
   }
 
-  &.nui-has-media {
+  &.nui-autocomplete-has-media {
     .nui-autocomplete-results-item-selected {
       @apply h-8 w-8;
     }
@@ -236,7 +235,7 @@
     @apply pb-1 text-xs;
   }
 
-  .nui-label-float {
+  .nui-autocomplete-label-float {
     @apply top-1.5;
   }
 
@@ -261,7 +260,7 @@
     @apply pb-1 text-[0.825rem];
   }
 
-  .nui-label-float {
+  .nui-autocomplete-label-float {
     @apply top-2.5;
   }
 
@@ -286,7 +285,7 @@
     @apply pb-1 text-sm;
   }
 
-  .nui-label-float {
+  .nui-autocomplete-label-float {
     @apply top-3.5;
   }
 
@@ -311,7 +310,7 @@
     @apply pb-1 text-sm;
   }
 
-  .nui-label-float {
+  .nui-autocomplete-label-float {
     @apply top-[1.1rem];
   }
 
@@ -411,7 +410,7 @@
     @apply !text-transparent placeholder:!text-transparent dark:placeholder:!text-transparent;
   }
 
-  .nui-autocomplete-input:placeholder-shown ~ .nui-label-float {
+  .nui-autocomplete-input:placeholder-shown ~ .nui-autocomplete-label-float {
     @apply text-transparent;
   }
 
@@ -437,75 +436,75 @@
     @apply !text-danger-500 dark:!text-danger-500;
   }
 }
-@utility nui-has-icon {
+@utility nui-autocomplete-has-icon {
   .nui-autocomplete-input {
     @apply h-8 py-1 text-xs leading-4 pe-3 ps-8;
   }
 }
-@utility nui-has-icon {
+@utility nui-autocomplete-has-icon {
   .nui-autocomplete-input {
     @apply h-10 py-2 text-sm leading-5 pe-4 ps-10;
   }
 }
-@utility nui-has-icon {
+@utility nui-autocomplete-has-icon {
   .nui-autocomplete-input {
     @apply h-12 py-2 text-sm leading-5 pe-4 ps-11;
   }
 }
-@utility nui-has-icon {
+@utility nui-autocomplete-has-icon {
   .nui-autocomplete-input {
     @apply h-14 py-2 text-base leading-5 pe-4 ps-12;
   }
 }
 @utility nui-autocomplete-label-float {
-  .nui-label-float {
+  .nui-autocomplete-label-float {
     @apply start-8 -ms-8 -mt-7 text-xs;
   }
 
-  .nui-autocomplete-input:focus-visible ~ .nui-label-float {
+  .nui-autocomplete-input:focus-visible ~ .nui-autocomplete-label-float {
     @apply !-ms-8 !-mt-7;
   }
 
-  .nui-autocomplete-input:placeholder-shown ~ .nui-label-float {
+  .nui-autocomplete-input:placeholder-shown ~ .nui-autocomplete-label-float {
     @apply ms-0 mt-0;
   }
 }
 @utility nui-autocomplete-label-float {
-  .nui-label-float {
+  .nui-autocomplete-label-float {
     @apply start-10 -ms-10 -mt-8 text-xs;
   }
 
-  .nui-autocomplete-input:focus-visible ~ .nui-label-float {
+  .nui-autocomplete-input:focus-visible ~ .nui-autocomplete-label-float {
     @apply !-ms-10 !-mt-8 !text-xs;
   }
 
-  .nui-autocomplete-input:placeholder-shown ~ .nui-label-float {
+  .nui-autocomplete-input:placeholder-shown ~ .nui-autocomplete-label-float {
     @apply ms-0 mt-0 text-[0.825rem];
   }
 }
 @utility nui-autocomplete-label-float {
-  .nui-label-float {
+  .nui-autocomplete-label-float {
     @apply start-11 -ms-10 -mt-9 text-xs;
   }
 
-  .nui-autocomplete-input:focus-visible ~ .nui-label-float {
+  .nui-autocomplete-input:focus-visible ~ .nui-autocomplete-label-float {
     @apply !-ms-10 !-mt-9 !text-xs;
   }
 
-  .nui-autocomplete-input:placeholder-shown ~ .nui-label-float {
+  .nui-autocomplete-input:placeholder-shown ~ .nui-autocomplete-label-float {
     @apply ms-0 mt-0 text-[0.825rem];
   }
 }
 @utility nui-autocomplete-label-float {
-  .nui-label-float {
+  .nui-autocomplete-label-float {
     @apply start-[3.25rem] -ms-[3.25rem] -mt-10 text-xs;
   }
 
-  .nui-autocomplete-input:focus-visible ~ .nui-label-float {
+  .nui-autocomplete-input:focus-visible ~ .nui-autocomplete-label-float {
     @apply !-ms-[3.25rem] !-mt-10 !text-xs;
   }
 
-  .nui-autocomplete-input:placeholder-shown ~ .nui-label-float {
+  .nui-autocomplete-input:placeholder-shown ~ .nui-autocomplete-label-float {
     @apply ms-0 mt-0 text-[0.825rem];
   }
 }

package/lib/css/avatar-group.css

@@ -1,10 +1,9 @@
-/* generated using "pnpm jiti scripts/generate-utilities.ts" */
 /* @utility nui-avatar-group */
 
 @utility nui-avatar-group {
   @apply flex;
 }
-@utility nui-avatar-outer {
+@utility nui-avatar-group-outer {
   @apply relative flex shrink-0 items-center justify-center rounded-full;
   @apply bg-white dark:bg-muted-800;
   @apply transition-all duration-100 ease-in;
@@ -13,26 +12,26 @@
     @apply bg-primary-500/20 text-primary-500/20 !scale-90;
   }
 }
-@utility nui-avatar-count {
+@utility nui-avatar-group-count {
   @apply relative shrink-0 rounded-full;
   @apply bg-white dark:bg-muted-800;
   @apply transition-all duration-100 ease-in;
 
-  .nui-avatar-count-inner {
+  .nui-avatar-group-count-inner {
     @apply relative scale-90 inline-flex items-center justify-center rounded-full;
     @apply h-full w-full;
     @apply bg-muted-200 dark:bg-muted-700;
     @apply border border-white dark:border-muted-800;
   }
 
-  .nui-avatar-count-text {
+  .nui-avatar-group-count-text {
     @apply -ms-1 uppercase;
     @apply font-sans font-medium;
     @apply text-muted-500 dark:text-muted-300;
   }
 }
 @utility nui-avatar-group-xxs {
-  .nui-avatar-outer {
+  .nui-avatar-group-outer {
     @apply h-6 w-6;
 
     &:first-child {
@@ -44,16 +43,16 @@
     }
   }
 
-  .nui-avatar-count {
+  .nui-avatar-group-count {
     @apply -ms-2 h-6 w-6;
 
-    .nui-avatar-count-text {
+    .nui-avatar-group-count-text {
       @apply text-xs;
     }
   }
 }
 @utility nui-avatar-group-xs {
-  .nui-avatar-outer {
+  .nui-avatar-group-outer {
     @apply h-8 w-8;
 
     &:first-child {
@@ -65,16 +64,16 @@
     }
   }
 
-  .nui-avatar-count {
+  .nui-avatar-group-count {
     @apply -ms-2 h-8 w-8;
 
-    .nui-avatar-count-text {
+    .nui-avatar-group-count-text {
       @apply text-sm;
     }
   }
 }
 @utility nui-avatar-group-sm {
-  .nui-avatar-outer {
+  .nui-avatar-group-outer {
     @apply h-10 w-10;
 
     &:first-child {
@@ -86,16 +85,16 @@
     }
   }
 
-  .nui-avatar-count {
+  .nui-avatar-group-count {
     @apply -ms-3 h-10 w-10;
 
-    .nui-avatar-count-text {
+    .nui-avatar-group-count-text {
       @apply text-sm;
     }
   }
 }
 @utility nui-avatar-group-md {
-  .nui-avatar-outer {
+  .nui-avatar-group-outer {
     @apply h-12 w-12;
 
     &:first-child {
@@ -107,16 +106,16 @@
     }
   }
 
-  .nui-avatar-count {
+  .nui-avatar-group-count {
     @apply -ms-4 h-12 w-12;
 
-    .nui-avatar-count-text {
+    .nui-avatar-group-count-text {
       @apply text-lg;
     }
   }
 }
 @utility nui-avatar-group-lg {
-  .nui-avatar-outer {
+  .nui-avatar-group-outer {
     @apply h-16 w-16;
 
     &:first-child {
@@ -128,10 +127,10 @@
     }
   }
 
-  .nui-avatar-count {
+  .nui-avatar-group-count {
     @apply -ms-5 h-16 w-16;
 
-    .nui-avatar-count-text {
+    .nui-avatar-group-count-text {
       @apply text-xl;
     }
   }

package/lib/css/avatar.css

@@ -1,4 +1,3 @@
-/* generated using "pnpm jiti scripts/generate-utilities.ts" */
 /* @utility nui-avatar */
 
 @utility nui-avatar {
@@ -34,35 +33,35 @@
   @apply absolute block;
   @apply border border-white dark:border-muted-800 rounded-full;
 
-  &.nui-dot-primary {
+  &.nui-avatar-dot-primary {
     @apply bg-primary-500;
   }
 
-  &.nui-dot-info {
+  &.nui-avatar-dot-info {
     @apply bg-info-500;
   }
 
-  &.nui-dot-success {
+  &.nui-avatar-dot-success {
     @apply bg-success-500;
   }
 
-  &.nui-dot-warning {
+  &.nui-avatar-dot-warning {
     @apply bg-warning-500;
   }
 
-  &.nui-dot-danger {
+  &.nui-avatar-dot-danger {
     @apply bg-danger-500;
   }
 
-  &.nui-dot-yellow {
+  &.nui-avatar-dot-yellow {
     @apply bg-yellow-400;
   }
 
-  &.nui-dot-pink {
+  &.nui-avatar-dot-pink {
     @apply bg-pink-500;
   }
 
-  &.nui-dot-indigo {
+  &.nui-avatar-dot-indigo {
     @apply bg-indigo-500;
   }
 }
@@ -72,35 +71,35 @@
     @apply ring-offset-2 ring-offset-white dark:ring-offset-muted-800;
   }
 
-  &.nui-ring-primary {
+  &.nui-avatar-ring-primary {
     @apply bg-primary-500;
   }
 
-  &.nui-ring-info {
+  &.nui-avatar-ring-info {
     @apply bg-info-500;
   }
 
-  &.nui-ring-success {
+  &.nui-avatar-ring-success {
     @apply bg-success-500;
   }
 
-  &.nui-ring-warning {
+  &.nui-avatar-ring-warning {
     @apply bg-warning-500;
   }
 
-  &.nui-ring-danger {
+  &.nui-avatar-ring-danger {
     @apply bg-danger-500;
   }
 
-  &.nui-ring-yellow {
+  &.nui-avatar-ring-yellow {
     @apply bg-yellow-400;
   }
 
-  &.nui-ring-pink {
+  &.nui-avatar-ring-pink {
     @apply bg-pink-500;
   }
 
-  &.nui-ring-indigo {
+  &.nui-avatar-ring-indigo {
     @apply bg-indigo-500;
   }
 }

package/lib/css/breadcrumb.css

@@ -1,4 +1,3 @@
-/* generated using "pnpm jiti scripts/generate-utilities.ts" */
 /* @utility nui-breadcrumb */
 
 @utility nui-breadcrumb {
@@ -19,12 +18,12 @@
     @apply flex text-muted-500 dark:text-muted-400;
   }
 
-  .nui-item-inner {
+  .nui-breadcrumb-item-inner {
     @apply text-[0.85rem] flex items-center gap-x-1;
     @apply text-muted-500 dark:text-muted-400;
     @apply transition-colors duration-300;
 
-    .nui-item-icon {
+    .nui-breadcrumb-item-icon {
       @apply flex items-center justify-center h-4 w-4 shrink-0;
 
       &.nui-has-dot {
@@ -32,13 +31,13 @@
       }
     }
 
-    .nui-item-text {
+    .nui-breadcrumb-item-text {
       @apply text-muted-500 dark:text-muted-400 px-2;
     }
   }
 }
 @utility nui-breadcrumb-primary {
-  .nui-item-inner {
+  .nui-breadcrumb-item-inner {
     &.nui-has-link {
       @apply hover:text-primary-500 focus:text-primary-500;
       @apply dark:hover:text-primary-500 dark:focus:text-primary-500;
@@ -46,7 +45,7 @@
   }
 }
 @utility nui-breadcrumb-dark {
-  .nui-item-inner {
+  .nui-breadcrumb-item-inner {
     &.nui-has-link {
       @apply hover:text-muted-900 focus:text-muted-900;
       @apply dark:hover:text-muted-100 dark:focus:text-muted-100;
@@ -54,7 +53,7 @@
   }
 }
 @utility nui-breadcrumb-black {
-  .nui-item-inner {
+  .nui-breadcrumb-item-inner {
     &.nui-has-link {
       @apply hover:text-black focus:text-black;
       @apply dark:hover:text-white dark:focus:text-white;

package/lib/css/button-action.css

@@ -1,4 +1,3 @@
-/* generated using "pnpm jiti scripts/generate-utilities.ts" */
 /* @utility nui-button-action */
 
 @utility nui-button-action {

package/lib/css/button-close.css

@@ -1,4 +1,3 @@
-/* generated using "pnpm jiti scripts/generate-utilities.ts" */
 /* @utility nui-button-close */
 
 @utility nui-button-close {

package/lib/css/button-group.css

@@ -1,4 +1,3 @@
-/* generated using "pnpm jiti scripts/generate-utilities.ts" */
 /* @utility nui-button-group */
 
 @utility nui-button-group {

package/lib/css/button-icon.css

@@ -1,4 +1,3 @@
-/* generated using "pnpm jiti scripts/generate-utilities.ts" */
 /* @utility nui-button-icon */
 
 @utility nui-button-icon {

package/lib/css/button.css

@@ -1,4 +1,3 @@
-/* generated using "pnpm jiti scripts/generate-utilities.ts" */
 /* @utility nui-button */
 
 @utility nui-button {

package/lib/css/card.css

@@ -1,4 +1,3 @@
-/* generated using "pnpm jiti scripts/generate-utilities.ts" */
 /* @utility nui-card */
 
 @utility nui-card {

package/lib/css/checkbox.css

@@ -1,4 +1,3 @@
-/* generated using "pnpm jiti scripts/generate-utilities.ts" */
 /* @utility nui-checkbox */
 
 @utility nui-checkbox {
@@ -28,12 +27,12 @@
   @apply bg-white dark:bg-muted-700;
   @apply border-2 border-muted-400 dark:border-muted-700;
 }
-@utility nui-icon-check {
+@utility nui-checkbox-icon-check {
   @apply pointer-events-none absolute z-10 fill-current translate-y-6 opacity-0;
   @apply h-2.5 w-2.5;
   @apply transition-all duration-300;
 }
-@utility nui-icon-indeterminate {
+@utility nui-checkbox-icon-indeterminate {
   @apply pointer-events-none absolute z-10 fill-current translate-y-6 opacity-0;
   @apply h-2.5 w-2.5;
   @apply transition-all duration-300;
@@ -45,15 +44,15 @@
     @apply border-current dark:border-current;
   }
 
-  &:checked ~ .nui-icon-check {
+  &:checked ~ .nui-checkbox-icon-check {
     @apply translate-y-0 opacity-100;
   }
 
-  &:indeterminate ~ .nui-icon-check {
+  &:indeterminate ~ .nui-checkbox-icon-check {
     @apply !translate-y-6;
   }
 
-  &:indeterminate ~ .nui-icon-indeterminate {
+  &:indeterminate ~ .nui-checkbox-icon-indeterminate {
     @apply !translate-y-0 !opacity-100;
   }
 }

package/lib/css/dropdown-divider.css

@@ -1,4 +1,3 @@
-/* generated using "pnpm jiti scripts/generate-utilities.ts" */
 /* @utility nui-dropdown-divider */
 
 @utility nui-dropdown-divider {