@shuriken-ui/tailwind 4.0.0-alpha.2 → 4.0.0-alpha.20

package/src/css/theme-toggle.css

@@ -1,62 +0,0 @@
-/* generated using "pnpm jiti scripts/generate-utilities.ts" */
-/* @utility nui-theme-toggle */
-
-@utility nui-theme-toggle {
-  @apply nui-focus relative block shrink-0 overflow-hidden rounded-full;
-  @apply h-9 w-9;
-  @apply focus-visible:outline-2 ring-2 ring-transparent ring-offset-muted-200 dark:ring-offset-muted-900;
-  @apply transition-all duration-300;
-
-  .nui-theme-toggle-input:not(:checked) ~ .nui-theme-toggle-inner .nui-sun {
-    @apply -translate-y-1/2 opacity-100;
-  }
-
-  .nui-theme-toggle-input:checked ~ .nui-theme-toggle-inner .nui-sun {
-    @apply translate-y-[-150%] opacity-0;
-  }
-
-  .nui-theme-toggle-input:not(:checked) ~ .nui-theme-toggle-inner .nui-moon {
-    @apply translate-y-[-150%] opacity-0;
-  }
-
-  .nui-theme-toggle-input:checked ~ .nui-theme-toggle-inner .nui-moon {
-    @apply -translate-y-1/2 opacity-100;
-  }
-
-  &:not(nui-theme-toggle-inverted) {
-    @apply ring-offset-muted-500 dark:ring-offset-muted-900;
-
-    .nui-toggle-inner {
-      @apply border border-white dark:border-muted-800;
-      @apply bg-white dark:bg-muted-800;
-    }
-  }
-}
-@utility nui-theme-toggle-inner {
-  @apply relative block rounded-full;
-  @apply h-9 w-9;
-  @apply bg-white dark:bg-muted-800;
-  @apply border border-muted-300 dark:border-muted-700;
-}
-@utility nui-theme-toggle-input {
-  @apply absolute start-0 top-0 z-[2] h-full w-full cursor-pointer opacity-0;
-}
-@utility nui-sun {
-  @apply pointer-events-none absolute start-1/2 top-1/2 block -translate-y-1/2 translate-x-[-50%] rtl:translate-x-[50%];
-  @apply h-5 w-5;
-  @apply text-yellow-400 dark:text-yellow-400;
-  @apply transition-all duration-300;
-}
-@utility nui-moon {
-  @apply pointer-events-none absolute start-1/2 top-1/2 block translate-x-[-50%] rtl:translate-x-[45%];
-  @apply h-5 w-5;
-  @apply text-yellow-400 dark:text-yellow-400;
-  @apply transition-all duration-300;
-}
-@utility nui-theme-toggle-inverted {
-  @apply ring-offset-muted-500 dark:ring-offset-muted-400;
-
-  .nui-toggle-inner {
-    @apply !bg-primary-700 dark:!bg-primary-700;
-  }
-}

package/src/css/toast.css

@@ -1,132 +0,0 @@
-/* generated using "pnpm jiti scripts/generate-utilities.ts" */
-/* @utility nui-toast */
-
-@utility nui-toast {
-  @apply relative flex font-sans overflow-hidden;
-}
-@utility nui-toast-inner {
-  @apply flex items-center grow gap-2 px-4 py-3;
-}
-@utility nui-toast-title {
-  @apply nui-heading nui-heading-sm nui-weight-medium;
-  @apply text-muted-800 dark:text-muted-100;
-}
-@utility nui-toast-subtitle {
-  @apply nui-paragraph text-xs;
-  @apply text-muted-400 dark:text-muted-500;
-}
-@utility nui-toast-icon {
-  @apply w-6 h-6;
-}
-@utility nui-toast-icon-block {
-  @apply h-16 w-16 flex items-center justify-center;
-}
-@utility nui-button-close {
-  @apply ms-auto;
-}
-@utility nui-toast-low-contrast {
-  @apply bg-white dark:bg-muted-800;
-  @apply border-2 border-muted-300 dark:border-muted-700;
-}
-@utility nui-toast-high-contrast {
-  @apply bg-white dark:bg-muted-950;
-  @apply border-2 border-muted-300 dark:border-muted-800;
-}
-@utility nui-toast-default {
-  .nui-toast-icon {
-    @apply text-muted-500 dark:text-muted-500;
-  }
-
-  .nui-toast-icon-block {
-    @apply bg-muted-100 dark:bg-muted-700;
-  }
-}
-@utility nui-toast-primary {
-  @apply border-2 border-primary-500 dark:border-primary-500;
-
-  .nui-toast-icon {
-    @apply text-primary-500 dark:text-primary-500;
-  }
-
-  .nui-toast-icon-block {
-    @apply bg-primary-500/10 dark:bg-primary-500/10;
-  }
-}
-@utility nui-toast-info {
-  @apply border-2 border-info-500 dark:border-info-500;
-
-  .nui-toast-icon {
-    @apply text-info-500 dark:text-info-500;
-  }
-
-  .nui-toast-icon-block {
-    @apply bg-info-500/10 dark:bg-info-500/10;
-  }
-}
-@utility nui-toast-success {
-  @apply border-2 border-success-500 dark:border-success-500;
-
-  .nui-toast-icon {
-    @apply text-success-500 dark:text-success-500;
-  }
-
-  .nui-toast-icon-block {
-    @apply bg-success-500/10 dark:bg-success-500/10;
-  }
-}
-@utility nui-toast-warning {
-  @apply border-2 border-warning-500 dark:border-warning-500;
-
-  .nui-toast-icon {
-    @apply text-warning-500 dark:text-warning-500;
-  }
-
-  .nui-toast-icon-block {
-    @apply bg-warning-500/10 dark:bg-warning-500/10;
-  }
-}
-@utility nui-toast-danger {
-  @apply border-2 border-danger-500 dark:border-danger-500;
-
-  .nui-toast-icon {
-    @apply text-danger-500 dark:text-danger-500;
-  }
-
-  .nui-toast-icon-block {
-    @apply bg-danger-500/10 dark:bg-danger-500/10;
-  }
-}
-@utility nui-toast-dark {
-  @apply border-2 border-muted-900 dark:border-muted-100;
-
-  .nui-toast-icon {
-    @apply text-muted-900 dark:text-muted-100;
-  }
-
-  .nui-toast-icon-block {
-    @apply bg-muted-900/10 dark:bg-muted-100/10;
-  }
-}
-@utility nui-toast-black {
-  @apply border-2 border-black dark:border-white;
-
-  .nui-toast-icon {
-    @apply text-black dark:text-white;
-  }
-
-  .nui-toast-icon-block {
-    @apply bg-black/10 dark:bg-white/10;
-  }
-}
-@utility nui-toast-rounded-sm {
-  @apply rounded-md;
-}
-@utility nui-toast-rounded-md {
-  @apply rounded-lg;
-}
-@utility nui-toast-rounded-lg {
-  @apply rounded-xl;
-}
-@utility nui-toast-borderless {
-  @apply !border-0 shadow-muted-300/30 dark:shadow-muted-800/30 shadow-xl;
-}

package/src/css/tooltip.css

@@ -1,99 +0,0 @@
-/* generated using "pnpm jiti scripts/generate-utilities.ts" */
-/* @utility nui-tooltip */
-
-[data-nui-tooltip] {
-  position: relative;
-}
-[data-nui-tooltip]::before, [data-nui-tooltip]::after {
-  text-transform: none;
-  font-size: 0.9em;
-  line-height: 1;
-  user-select: none;
-  pointer-events: none;
-  position: absolute;
-  display: none;
-  opacity: 0;
-}
-[data-nui-tooltip]::before {
-  content: '';
-  border: 5px solid transparent;
-  z-index: 1001;
-}
-[data-nui-tooltip]::after {
-  content: attr(data-nui-tooltip);
-  text-align: center;
-  min-width: 3rem;
-  max-width: 21rem;
-  white-space: pre;
-  overflow: hidden;
-  padding: 1ch 1.5ch;
-  border-radius: 0.5ch;
-  z-index: 1000;
-  @apply font-sans text-xs shadow-lg;
-  @apply text-[#fff] dark:text-[#fff];
-  @apply !bg-[#1e293b] dark:!bg-[#4c1d95];
-}
-[data-nui-tooltip]:hover::before, [data-nui-tooltip]:hover::after, [data-nui-tooltip]:focus-visible::before, [data-nui-tooltip]:focus-visible::after {
-  display: block;
-}
-[data-nui-tooltip='']::before, [data-nui-tooltip='']::after {
-  display: none !important;
-}
-[data-nui-tooltip]:not([data-nui-tooltip-position])::before, [data-nui-tooltip][data-nui-tooltip-position^='up']::before {
-  bottom: calc(100% + 8px);
-  border-bottom-width: 0;
-  border-top-color: currentColor;
-  @apply !text-[#1e293b] dark:!text-[#4c1d95];
-}
-[data-nui-tooltip]:not([data-nui-tooltip-position])::after, [data-nui-tooltip][data-nui-tooltip-position^='up']::after {
-  bottom: calc(100% + 13px);
-}
-[data-nui-tooltip]:not([data-nui-tooltip-position])::before, [data-nui-tooltip][data-nui-tooltip-position^='up']::before, [data-nui-tooltip]:not([data-nui-tooltip-position])::after, [data-nui-tooltip][data-nui-tooltip-position^='up']::after {
-  left: 50%;
-  transform: translate(-50%, -0.5em);
-}
-[data-nui-tooltip][data-nui-tooltip-position^='down']::before {
-  top: 100%;
-  border-top-width: 0;
-  border-bottom-color: currentColor;
-  @apply !text-[#1e293b] dark:!text-[#4c1d95];
-}
-[data-nui-tooltip][data-nui-tooltip-position^='down']::after {
-  top: calc(100% + 5px);
-}
-[data-nui-tooltip][data-nui-tooltip-position^='down']::before, [data-nui-tooltip][data-nui-tooltip-position^='down']::after {
-  left: 50%;
-  transform: translate(-50%, 0.5em);
-}
-[data-nui-tooltip][data-nui-tooltip-position^='start']::before, [data-nui-tooltip][data-nui-tooltip-position^='left']::before {
-  top: 50%;
-  border-right-width: 0;
-  border-left-color: currentColor;
-  inset-inline-start: calc(0em - 5px);
-  transform: translate(-0.5em, -50%);
-  @apply !text-[#1e293b] dark:!text-[#4c1d95];
-}
-[data-nui-tooltip][data-nui-tooltip-position^='start']::after, [data-nui-tooltip][data-nui-tooltip-position^='left']::after {
-  top: 50%;
-  inset-inline-end: calc(100% + 5px);
-  transform: translate(-0.5em, -50%);
-}
-[data-nui-tooltip][data-nui-tooltip-position^='end']::before, [data-nui-tooltip][data-nui-tooltip-position^='right']::before {
-  top: 50%;
-  border-leftt-width: 0;
-  border-right-color: currentColor;
-  inset-inline-end: calc(0em - 5px);
-  transform: translate(0.5em, -50%);
-  @apply !text-[#1e293b] dark:!text-[#4c1d95];
-}
-[data-nui-tooltip][data-nui-tooltip-position^='end']::after, [data-nui-tooltip][data-nui-tooltip-position^='right']::after {
-  top: 50%;
-  inset-inline-start: calc(100% + 5px);
-  transform: translate(0.5em, -50%);
-}
-[data-nui-tooltip]:not([data-nui-tooltip-position]):hover::before,[data-nui-tooltip]:not([data-nui-tooltip-position]):hover::after,[data-nui-tooltip][data-nui-tooltip-position^='up']:hover::before,[data-nui-tooltip][data-nui-tooltip-position^='up']:hover::after,[data-nui-tooltip][data-nui-tooltip-position^='down']:hover::before,[data-nui-tooltip][data-nui-tooltip-position^='down']:hover::after,[data-nui-tooltip]:not([data-nui-tooltip-position]):focus-visible::before,[data-nui-tooltip]:not([data-nui-tooltip-position]):focus-visible::after,[data-nui-tooltip][data-nui-tooltip-position^='up']:focus-visible::before,[data-nui-tooltip][data-nui-tooltip-position^='up']:focus-visible::after,[data-nui-tooltip][data-nui-tooltip-position^='down']:focus-visible::before,[data-nui-tooltip][data-nui-tooltip-position^='down']:focus-visible::after {
-  @apply animate-nui-tooltip-x;
-}
-[data-nui-tooltip][data-nui-tooltip-position^='left']:hover::before,[data-nui-tooltip][data-nui-tooltip-position^='left']:hover::after,[data-nui-tooltip][data-nui-tooltip-position^='right']:hover::before,[data-nui-tooltip][data-nui-tooltip-position^='right']:hover::after,[data-nui-tooltip][data-nui-tooltip-position^='start']:hover::before,[data-nui-tooltip][data-nui-tooltip-position^='start']:hover::after,[data-nui-tooltip][data-nui-tooltip-position^='end']:hover::before,[data-nui-tooltip][data-nui-tooltip-position^='end']:hover::after,[data-nui-tooltip][data-nui-tooltip-position^='left']:focus-visible::before,[data-nui-tooltip][data-nui-tooltip-position^='left']:focus-visible::after,[data-nui-tooltip][data-nui-tooltip-position^='right']:focus-visible::before,[data-nui-tooltip][data-nui-tooltip-position^='right']:focus-visible::after,[data-nui-tooltip][data-nui-tooltip-position^='start']:focus-visible::before,[data-nui-tooltip][data-nui-tooltip-position^='start']:focus-visible::after,[data-nui-tooltip][data-nui-tooltip-position^='end']:focus-visible::before,[data-nui-tooltip][data-nui-tooltip-position^='end']:focus-visible::after {
-  @apply animate-nui-tooltip-y;
-}

package/src/index.css

@@ -1,58 +0,0 @@
-@plugin '@tailwindcss/typography';
-
-@import './theme.css';
-
-@import './css/accordion.css';
-@import './css/autocomplete.css';
-@import './css/avatar.css';
-@import './css/avatar-group.css';
-@import './css/breadcrumb.css';
-@import './css/button.css';
-@import './css/button-action.css';
-@import './css/button-close.css';
-@import './css/button-group.css';
-@import './css/button-icon.css';
-@import './css/card.css';
-@import './css/checkbox.css';
-@import './css/dropdown.css';
-@import './css/dropdown-divider.css';
-@import './css/dropdown-item.css';
-@import './css/focus.css';
-@import './css/fullscreen-dropfile.css';
-@import './css/heading.css';
-@import './css/icon-box.css';
-@import './css/input.css';
-@import './css/input-file.css';
-@import './css/input-file-regular.css';
-@import './css/input-help-text.css';
-@import './css/input-number.css';
-@import './css/kbd.css';
-@import './css/label.css';
-@import './css/link.css';
-@import './css/listbox.css';
-@import './css/mark.css';
-@import './css/mask.css';
-@import './css/message.css';
-@import './css/message-text.css';
-@import './css/modal.css';
-@import './css/pagination.css';
-@import './css/paragraph.css';
-@import './css/placeholder-page.css';
-@import './css/progress.css';
-@import './css/progress-circle.css';
-/* @import './css/prose.css'; */
-@import './css/radio.css';
-@import './css/select.css';
-@import './css/slimscroll.css';
-@import './css/snack.css';
-@import './css/switch-ball.css';
-@import './css/switch-thin.css';
-@import './css/tab-slider.css';
-@import './css/tabs.css';
-@import './css/tag.css';
-@import './css/text.css';
-@import './css/textarea.css';
-@import './css/theme-switch.css';
-@import './css/theme-toggle.css';
-@import './css/toast.css';
-/* @import './css/tooltip.css'; */

package/src/theme.css

@@ -1,80 +0,0 @@
-@theme {
-  /* --font-family-sans: 'Titillium Web', sans-serif; */
-  /* --font-family-mono: 'Titillium Web', sans-serif; */
-  --font-family-alt: var(--font-family-sans);
-  --font-family-heading: var(--font-family-sans);
-  
-  /** Colors */
-  --color-muted-50: var(--color-gray-50);
-  --color-muted-100: var(--color-gray-100);
-  --color-muted-200: var(--color-gray-200);
-  --color-muted-300: var(--color-gray-300);
-  --color-muted-400: var(--color-gray-400);
-  --color-muted-500: var(--color-gray-500);
-  --color-muted-600: var(--color-gray-600);
-  --color-muted-700: var(--color-gray-700);
-  --color-muted-800: var(--color-gray-800);
-  --color-muted-900: var(--color-gray-900);
-  --color-muted-950: var(--color-gray-950);
-  
-  --color-primary-invert: var(--color-white);
-  --color-primary-50: var(--color-purple-50);
-  --color-primary-100: var(--color-purple-100);
-  --color-primary-200: var(--color-purple-200);
-  --color-primary-300: var(--color-purple-300);
-  --color-primary-400: var(--color-purple-400);
-  --color-primary-500: var(--color-purple-500);
-  --color-primary-600: var(--color-purple-600);
-  --color-primary-700: var(--color-purple-700);
-  --color-primary-800: var(--color-purple-800);
-  --color-primary-900: var(--color-purple-900);
-  --color-primary-950: var(--color-purple-950);
-  
-  --color-info-50: var(--color-sky-50);
-  --color-info-100: var(--color-sky-100);
-  --color-info-200: var(--color-sky-200);
-  --color-info-300: var(--color-sky-300);
-  --color-info-400: var(--color-sky-400);
-  --color-info-500: var(--color-sky-500);
-  --color-info-600: var(--color-sky-600);
-  --color-info-700: var(--color-sky-700);
-  --color-info-800: var(--color-sky-800);
-  --color-info-900: var(--color-sky-900);
-  --color-info-950: var(--color-sky-950);
-  
-  --color-success-50: var(--color-teal-50);
-  --color-success-100: var(--color-teal-100);
-  --color-success-200: var(--color-teal-200);
-  --color-success-300: var(--color-teal-300);
-  --color-success-400: var(--color-teal-400);
-  --color-success-500: var(--color-teal-500);
-  --color-success-600: var(--color-teal-600);
-  --color-success-700: var(--color-teal-700);
-  --color-success-800: var(--color-teal-800);
-  --color-success-900: var(--color-teal-900);
-  --color-success-950: var(--color-teal-950);
-  
-  --color-warning-50: var(--color-amber-50);
-  --color-warning-100: var(--color-amber-100);
-  --color-warning-200: var(--color-amber-200);
-  --color-warning-300: var(--color-amber-300);
-  --color-warning-400: var(--color-amber-400);
-  --color-warning-500: var(--color-amber-500);
-  --color-warning-600: var(--color-amber-600);
-  --color-warning-700: var(--color-amber-700);
-  --color-warning-800: var(--color-amber-800);
-  --color-warning-900: var(--color-amber-900);
-  --color-warning-950: var(--color-amber-950);
-  
-  --color-danger-50: var(--color-rose-50);
-  --color-danger-100: var(--color-rose-100);
-  --color-danger-200: var(--color-rose-200);
-  --color-danger-300: var(--color-rose-300);
-  --color-danger-400: var(--color-rose-400);
-  --color-danger-500: var(--color-rose-500);
-  --color-danger-600: var(--color-rose-600);
-  --color-danger-700: var(--color-rose-700);
-  --color-danger-800: var(--color-rose-800);
-  --color-danger-900: var(--color-rose-900);
-  --color-danger-950: var(--color-rose-950);
-}