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

package/lib/css/tag.css

@@ -1,311 +0,0 @@
-/* @utility nui-tag */
-
-@utility nui-tag {
-  @apply inline-block px-3 font-sans transition-all duration-300;
-}
-@utility nui-tag-sm {
-  @apply py-1;
-  @apply text-[0.65rem];
-}
-@utility nui-tag-md {
-  @apply py-1.5;
-  @apply text-xs;
-}
-@utility nui-tag-rounded-sm {
-  @apply rounded-sm;
-}
-@utility nui-tag-rounded-md {
-  @apply rounded-md;
-}
-@utility nui-tag-rounded-lg {
-  @apply rounded-lg;
-}
-@utility nui-tag-rounded-full {
-  @apply rounded-full;
-}
-@utility nui-tag-solid {
-  &.nui-tag-default {
-    @apply text-muted-600 dark:text-muted-300;
-    @apply bg-white dark:bg-muted-800;
-    @apply border border-muted-300 dark:border-muted-700;
-
-    &.nui-tag-shadow {
-      @apply shadow-xl;
-    }
-
-    &.nui-tag-shadow-hover {
-      @apply hover:shadow-xl;
-    }
-  }
-
-  &.nui-tag-default-contrast {
-    @apply text-muted-600 dark:text-muted-100;
-    @apply bg-white dark:bg-muted-950;
-    @apply border border-muted-300 dark:border-muted-800;
-
-    &.nui-tag-shadow {
-      @apply shadow-xl;
-    }
-
-    &.nui-tag-shadow-hover {
-      @apply hover:shadow-xl;
-    }
-  }
-
-  &.nui-tag-muted {
-    @apply text-muted-500 dark:text-muted-200;
-    @apply bg-muted-100 dark:bg-muted-800;
-    @apply border border-muted-100 dark:border-muted-800;
-
-    &.nui-tag-shadow {
-      @apply shadow-xl;
-    }
-
-    &.nui-tag-shadow-hover {
-      @apply hover:shadow-xl;
-    }
-  }
-
-  &.nui-tag-muted-contrast {
-    @apply text-muted-500 dark:text-muted-200;
-    @apply bg-muted-100 dark:bg-muted-950;
-    @apply border border-muted-100 dark:border-muted-950;
-
-    &.nui-tag-shadow {
-      @apply shadow-xl;
-    }
-
-    &.nui-tag-shadow-hover {
-      @apply hover:shadow-xl;
-    }
-  }
-
-  &.nui-tag-light {
-    @apply text-muted-500 dark:text-muted-100;
-    @apply bg-muted-200 dark:bg-muted-700;
-    @apply border border-muted-200 dark:border-muted-700;
-
-    &.nui-tag-shadow {
-      @apply shadow-xl;
-    }
-
-    &.nui-tag-shadow-hover {
-      @apply hover:shadow-xl;
-    }
-  }
-
-  &.nui-tag-dark {
-    @apply text-muted-100 dark:text-muted-900;
-    @apply bg-muted-900 dark:bg-muted-100;
-    @apply border border-muted-900 dark:border-muted-100;
-
-    &.nui-tag-shadow {
-      @apply shadow-xl;
-    }
-
-    &.nui-tag-shadow-hover {
-      @apply hover:shadow-xl;
-    }
-  }
-
-  &.nui-tag-black {
-    @apply text-white dark:text-black;
-    @apply bg-black dark:bg-white;
-    @apply border border-black dark:border-white;
-
-    &.nui-tag-shadow {
-      @apply shadow-xl;
-    }
-
-    &.nui-tag-shadow-hover {
-      @apply hover:shadow-xl;
-    }
-  }
-
-  &.nui-tag-primary {
-    @apply text-white dark:text-white;
-    @apply bg-primary-500 dark:bg-primary-500;
-    @apply border border-primary-500 dark:border-primary-500;
-
-    &.nui-tag-shadow {
-      @apply shadow-xl shadow-primary-500/30 shadow-primary-500/20;
-    }
-
-    &.nui-tag-shadow-hover {
-      @apply hover:shadow-xl hover:shadow-primary-500/30 hover:shadow-primary-500/20;
-    }
-  }
-
-  &.nui-tag-info {
-    @apply text-white dark:text-white;
-    @apply bg-info-500 dark:bg-info-500;
-    @apply border border-info-500 dark:border-info-500;
-
-    &.nui-tag-shadow {
-      @apply shadow-xl shadow-info-500/30 shadow-info-500/20;
-    }
-
-    &.nui-tag-shadow-hover {
-      @apply hover:shadow-xl hover:shadow-info-500/30 hover:shadow-info-500/20;
-    }
-  }
-
-  &.nui-tag-success {
-    @apply text-white dark:text-white;
-    @apply bg-success-500 dark:bg-success-500;
-    @apply border border-success-500 dark:border-success-500;
-
-    &.nui-tag-shadow {
-      @apply shadow-xl shadow-success-500/30 shadow-success-500/20;
-    }
-
-    &.nui-tag-shadow-hover {
-      @apply hover:shadow-xl hover:shadow-success-500/30 hover:shadow-success-500/20;
-    }
-  }
-
-  &.nui-tag-warning {
-    @apply text-white dark:text-white;
-    @apply bg-warning-500 dark:bg-warning-500;
-    @apply border border-warning-500 dark:border-warning-500;
-
-    &.nui-tag-shadow {
-      @apply shadow-xl shadow-warning-500/30 shadow-warning-500/20;
-    }
-
-    &.nui-tag-shadow-hover {
-      @apply hover:shadow-xl hover:shadow-warning-500/30 hover:shadow-warning-500/20;
-    }
-  }
-
-  &.nui-tag-danger {
-    @apply text-white dark:text-white;
-    @apply bg-danger-500 dark:bg-danger-500;
-    @apply border border-danger-500 dark:border-danger-500;
-
-    &.nui-tag-shadow {
-      @apply shadow-xl shadow-danger-500/30 shadow-danger-500/20;
-    }
-
-    &.nui-tag-shadow-hover {
-      @apply hover:shadow-xl hover:shadow-danger-500/30 hover:shadow-danger-500/20;
-    }
-  }
-}
-@utility nui-tag-pastel {
-  &.nui-tag-default, &.nui-tag-default-contrast {
-    @apply text-muted-500 dark:text-muted-100;
-    @apply bg-muted-100 dark:bg-muted-100/10;
-    @apply border border-muted-100 dark:border-muted-100/10;
-  }
-
-  &.nui-tag-muted, &.nui-tag-muted-contrast {
-    @apply text-muted-500 dark:text-muted-200;
-    @apply bg-muted-100 dark:bg-muted-800;
-    @apply border border-muted-100 dark:border-muted-800;
-  }
-
-  &.nui-tag-light {
-    @apply text-muted-800 dark:text-muted-100;
-    @apply bg-white/30 dark:bg-white/20;
-    @apply border border-white/30 dark:border-white/20;
-  }
-
-  &.nui-tag-dark {
-    @apply text-muted-100 dark:text-muted-900;
-    @apply bg-muted-900 dark:bg-muted-100;
-    @apply border border-muted-900 dark:border-muted-100;
-  }
-
-  &.nui-tag-black {
-    @apply text-white dark:text-black;
-    @apply bg-black dark:bg-white;
-    @apply border border-black dark:border-white;
-  }
-
-  &.nui-tag-primary {
-    @apply text-primary-500 dark:text-primary-500;
-    @apply bg-primary-500/20 dark:bg-primary-500/10;
-    @apply border border-primary-500/20 dark:border-primary-500/10;
-  }
-
-  &.nui-tag-info {
-    @apply text-info-500 dark:text-info-500;
-    @apply bg-info-500/20 dark:bg-info-500/10;
-    @apply border border-info-500/20 dark:border-info-500/10;
-  }
-
-  &.nui-tag-success {
-    @apply text-success-500 dark:text-success-500;
-    @apply bg-success-500/20 dark:bg-success-500/10;
-    @apply border border-success-500/20 dark:border-success-500/10;
-  }
-
-  &.nui-tag-warning {
-    @apply text-warning-500 dark:text-warning-500;
-    @apply bg-warning-500/20 dark:bg-warning-500/10;
-    @apply border border-warning-500/20 dark:border-warning-500/10;
-  }
-
-  &.nui-tag-danger {
-    @apply text-danger-500 dark:text-danger-500;
-    @apply bg-danger-500/20 dark:bg-danger-500/10;
-    @apply border border-danger-500/20 dark:border-danger-500/10;
-  }
-}
-@utility nui-tag-outline {
-  &.nui-tag-default, &.nui-tag-default-contrast {
-    @apply text-muted-500 dark:text-muted-100;
-    @apply border border-muted-500 dark:border-muted-100;
-  }
-
-  &.nui-tag-muted, &.nui-tag-muted-contrast {
-    @apply text-muted-400 dark:text-muted-100;
-    @apply border border-muted-400 dark:border-muted-100;
-  }
-
-  &.nui-tag-light {
-    @apply text-muted-100 dark:text-muted-100;
-    @apply border border-muted-100 dark:border-muted-100;
-  }
-
-  &.nui-tag-dark {
-    @apply text-muted-900 dark:text-muted-100;
-    @apply border border-muted-900 dark:border-muted-100;
-  }
-
-  &.nui-tag-black {
-    @apply text-black dark:text-white;
-    @apply border border-black dark:border-white;
-  }
-
-  &.nui-tag-primary {
-    @apply text-primary-500 dark:text-primary-500;
-    @apply border border-primary-500 dark:border-primary-500;
-    @apply bg-transparent dark:bg-transparent;
-  }
-
-  &.nui-tag-info {
-    @apply text-info-500 dark:text-info-500;
-    @apply border border-info-500 dark:border-info-500;
-    @apply bg-transparent dark:bg-transparent;
-  }
-
-  &.nui-tag-success {
-    @apply text-success-500 dark:text-success-500;
-    @apply border border-success-500 dark:border-success-500;
-    @apply bg-transparent dark:bg-transparent;
-  }
-
-  &.nui-tag-warning {
-    @apply text-warning-500 dark:text-warning-500;
-    @apply border border-warning-500 dark:border-warning-500;
-    @apply bg-transparent dark:bg-transparent;
-  }
-
-  &.nui-tag-danger {
-    @apply text-danger-500 dark:text-danger-500;
-    @apply border border-danger-500 dark:border-danger-500;
-    @apply bg-transparent dark:bg-transparent;
-  }
-}

package/lib/css/text.css

@@ -1,77 +0,0 @@
-/* @utility nui-text */
-
-@utility nui-text {
-  @apply font-sans;
-}
-@utility nui-text-content-xs {
-  @apply text-xs;
-}
-@utility nui-text-content-sm {
-  @apply text-sm;
-}
-@utility nui-text-content-md {
-  @apply text-base;
-}
-@utility nui-text-content-lg {
-  @apply text-lg;
-}
-@utility nui-text-content-xl {
-  @apply text-xl;
-}
-@utility nui-text-content-2xl {
-  @apply text-2xl;
-}
-@utility nui-text-content-3xl {
-  @apply text-3xl;
-}
-@utility nui-text-content-4xl {
-  @apply text-4xl;
-}
-@utility nui-text-content-5xl {
-  @apply text-5xl;
-}
-@utility nui-text-content-6xl {
-  @apply text-6xl;
-}
-@utility nui-text-content-7xl {
-  @apply text-7xl;
-}
-@utility nui-text-content-8xl {
-  @apply text-8xl;
-}
-@utility nui-text-content-9xl {
-  @apply text-9xl;
-}
-@utility nui-text-weight-light {
-  @apply font-light;
-}
-@utility nui-text-weight-normal {
-  @apply font-normal;
-}
-@utility nui-text-weight-medium {
-  @apply font-medium;
-}
-@utility nui-text-weight-semibold {
-  @apply font-semibold;
-}
-@utility nui-text-weight-bold {
-  @apply font-bold;
-}
-@utility nui-text-weight-extrabold {
-  @apply font-extrabold;
-}
-@utility nui-text-lead-none {
-  @apply leading-none;
-}
-@utility nui-text-lead-normal {
-  @apply leading-normal;
-}
-@utility nui-text-lead-tight {
-  @apply leading-tight;
-}
-@utility nui-text-lead-snug {
-  @apply leading-snug;
-}
-@utility nui-text-lead-loose {
-  @apply leading-loose;
-}

package/lib/css/textarea.css

@@ -1,227 +0,0 @@
-/* @utility nui-textarea */
-
-@utility nui-textarea-wrapper {
-  @apply relative;
-
-  .nui-textarea-label, .nui-label-float {
-    @apply nui-label;
-  }
-
-  &:not(.nui-textarea-loading) {
-    .nui-textarea:placeholder-shown ~ .nui-label-float {
-      @apply text-muted-300 dark:text-muted-600;
-    }
-  }
-
-  &:not(.nui-has-addon) {
-    .nui-textarea {
-      @apply p-2;
-    }
-  }
-}
-@utility nui-label-float {
-  @apply h-5 absolute inline-flex items-center select-none pointer-events-none;
-  @apply font-sans text-primary-500 leading-none;
-  @apply transition-all duration-300;
-}
-@utility nui-textarea-outer {
-  @apply relative flex flex-col;
-}
-@utility nui-textarea {
-  @apply nui-focus w-full enabled:cursor-text cursor-not-allowed;
-
-  &:focus-visible ~ .nui-label-float {
-    @apply !text-primary-500 dark:!text-primary-500;
-  }
-
-  &.nui-textarea-focus {
-    @apply focus:!border-primary-500 dark:focus:!border-primary-500;
-    @apply transition-colors duration-300;
-  }
-}
-@utility nui-textarea-placeload {
-  @apply absolute start-0 top-4 flex h-full w-full flex-col space-y-2 px-3;
-
-  .nui-placeload {
-    @apply h-3 w-full rounded;
-
-    &:first-child {
-      @apply max-w-[85%];
-    }
-
-    &:nth-child(2) {
-      @apply max-w-[65%];
-    }
-
-    &:nth-child(3) {
-      @apply max-w-[35%];
-    }
-  }
-}
-@utility nui-textarea-rounded-sm {
-  .nui-textarea {
-    @apply rounded-md;
-  }
-
-  .nui-textarea-addon {
-    @apply rounded-b-md;
-  }
-}
-@utility nui-textarea-rounded-md {
-  .nui-textarea {
-    @apply rounded-lg;
-  }
-
-  .nui-textarea-addon {
-    @apply rounded-b-lg;
-  }
-}
-@utility nui-textarea-rounded-lg {
-  .nui-textarea {
-    @apply rounded-xl;
-  }
-
-  .nui-textarea-addon {
-    @apply rounded-b-xl;
-  }
-}
-@utility nui-textarea-default {
-  .nui-textarea {
-    @apply text-muted-600 dark:text-muted-200;
-    @apply placeholder:text-muted-300 dark:placeholder:text-muted-500;
-    @apply bg-white dark:bg-muted-900;
-    @apply border border-muted-300 dark:border-muted-700;
-    @apply hover:border-muted-300 dark:hover:border-muted-700;
-  }
-}
-@utility nui-textarea-default-contrast {
-  .nui-textarea {
-    @apply text-muted-600 dark:text-muted-200;
-    @apply placeholder:text-muted-300 dark:placeholder:text-muted-600;
-    @apply bg-white dark:bg-muted-950;
-    @apply border border-muted-300 dark:border-muted-800;
-    @apply hover:border-muted-300 dark:hover:border-muted-800;
-  }
-}
-@utility nui-textarea-muted {
-  .nui-textarea {
-    @apply text-muted-600 dark:text-muted-200;
-    @apply placeholder:text-muted-300 dark:placeholder:text-muted-500;
-    @apply bg-muted-100 dark:bg-muted-900;
-    @apply border border-muted-100 dark:border-muted-700;
-    @apply hover:border-muted-100 dark:hover:border-muted-700;
-  }
-}
-@utility nui-textarea-muted-contrast {
-  .nui-textarea {
-    @apply text-muted-600 dark:text-muted-200;
-    @apply placeholder:text-muted-300 dark:placeholder:text-muted-600;
-    @apply bg-muted-100 dark:bg-muted-950;
-    @apply border border-muted-100 dark:border-muted-800;
-    @apply hover:border-muted-100 dark:hover:border-muted-800;
-  }
-}
-@utility nui-textarea-loading {
-  .nui-textarea {
-    @apply !text-transparent placeholder:!text-transparent dark:placeholder:!text-transparent;
-  }
-
-  .nui-textarea:placeholder-shown ~ .nui-label-float {
-    @apply text-transparent;
-  }
-}
-@utility nui-textarea-label-float {
-  .nui-textarea {
-    @apply placeholder:text-transparent dark:placeholder:text-transparent;
-  }
-}
-@utility nui-textarea-error {
-  .nui-textarea {
-    @apply !border-danger-500 dark:!border-danger-500;
-  }
-}
-@utility nui-textarea-no-resize {
-  .nui-textarea {
-    @apply resize-none;
-  }
-}
-@utility nui-textarea-sm {
-  @apply min-h-[2rem] text-xs;
-
-  .nui-textarea-label {
-    @apply pb-1 text-xs;
-  }
-}
-@utility nui-textarea-md {
-  @apply min-h-[2.5rem] text-sm;
-
-  .nui-textarea-label {
-    @apply pb-1 text-sm;
-  }
-}
-@utility nui-textarea-lg {
-  @apply min-h-[3rem] text-sm;
-
-  .nui-textarea-label {
-    @apply pb-1 text-sm;
-  }
-}
-@utility nui-has-addon {
-  .nui-textarea {
-    @apply px-2 pb-14 pt-2;
-  }
-
-  .nui-textarea-addon {
-    @apply absolute bottom-0 start-0 flex items-center justify-between;
-    @apply w-full h-12 p-2;
-    @apply bg-muted-50 dark:bg-muted-900/50;
-    @apply border border-muted-300 dark:border-muted-700;
-  }
-
-  .nui-textarea-addon-start {
-    @apply flex items-center gap-2;
-  }
-
-  .nui-textarea-addon-end {
-    @apply flex items-center justify-end gap-2;
-  }
-}
-@utility nui-textarea-label-float {
-  .nui-label-float {
-    @apply start-3 -ms-3 -mt-7 text-xs;
-  }
-
-  .nui-textarea:focus-visible ~ .nui-label-float {
-    @apply !-ms-3 !-mt-6;
-  }
-
-  .nui-textarea:placeholder-shown ~ .nui-label-float {
-    @apply ms-0 mt-[0.35rem];
-  }
-}
-@utility nui-textarea-label-float {
-  .nui-label-float {
-    @apply start-3 -ms-3 -mt-8 text-xs;
-  }
-
-  .nui-textarea:focus-visible ~ .nui-label-float {
-    @apply !-ms-3 !-mt-7 !text-xs;
-  }
-
-  .nui-textarea:placeholder-shown ~ .nui-label-float {
-    @apply ms-0 mt-2.5 text-[0.825rem];
-  }
-}
-@utility nui-textarea-label-float {
-  .nui-label-float {
-    @apply start-3 -ms-3 -mt-8 text-xs;
-  }
-
-  .nui-textarea:focus-visible ~ .nui-label-float {
-    @apply !-ms-3 !-mt-7 !text-xs;
-  }
-
-  .nui-textarea:placeholder-shown ~ .nui-label-float {
-    @apply ms-0 mt-3 text-[0.825rem];
-  }
-}

package/lib/css/theme-switch.css

@@ -1,64 +0,0 @@
-/* @utility nui-theme-switch */
-
-@utility nui-theme-switch {
-  @apply relative block h-6 w-14 scale-[0.8] rounded-full;
-  @apply bg-muted-200 dark:bg-muted-700;
-
-  .nui-theme-switch-input:checked ~ .nui-theme-switch-inner {
-    @apply ms-[45%] rotate-[360deg];
-  }
-
-  .nui-theme-switch-input:not(:checked) ~ .nui-theme-switch-inner .nui-sun {
-    @apply block;
-  }
-
-  .nui-theme-switch-input:checked ~ .nui-theme-switch-inner .nui-sun {
-    @apply hidden;
-  }
-
-  .nui-theme-switch-input:not(:checked) ~ .nui-theme-switch-inner .nui-moon {
-    @apply hidden;
-  }
-
-  .nui-theme-switch-input:checked ~ .nui-theme-switch-inner .nui-moon {
-    @apply block;
-  }
-
-  &:not(nui-theme-switch-inverted) {
-    @apply ring-offset-muted-500 dark:ring-offset-muted-900;
-
-    .nui-theme-switch-inner {
-      @apply border border-muted-300 dark:border-muted-700;
-      @apply bg-white dark:bg-muted-800;
-    }
-  }
-}
-@utility nui-theme-switch-input {
-  @apply absolute start-0 top-0 z-10 h-full w-full cursor-pointer opacity-0;
-}
-@utility nui-theme-switch-inner {
-  @apply absolute -start-1 -top-2 -ms-1 flex items-center justify-center peer-checked:ms-[45%] peer-checked:rotate-[360deg];
-  @apply h-10 w-10 rounded-full;
-  @apply bg-white dark:bg-muted-900;
-  @apply border border-muted-200 dark:border-muted-800;
-  @apply transition-all duration-300;
-}
-@utility nui-sun {
-  @apply pointer-events-none;
-  @apply text-yellow-400 dark:text-yellow-400;
-  @apply h-6 w-6;
-  @apply transition-all duration-300;
-}
-@utility nui-moon {
-  @apply pointer-events-none;
-  @apply text-yellow-400 dark:text-yellow-400;
-  @apply h-6 w-6;
-  @apply transition-all duration-300;
-}
-@utility nui-theme-switch-inverted {
-  @apply ring-offset-muted-500 dark:ring-offset-muted-400;
-
-  .nui-theme-switch-inner {
-    @apply bg-primary-700 dark:bg-primary-700;
-  }
-}