shadcn-ui-react 0.7.8 → 0.7.10

package/dist/style.css

@@ -64,6 +64,7 @@
     --container-sm: 24rem;
     --container-md: 28rem;
     --container-lg: 32rem;
+    --container-xl: 36rem;
     --text-xs: 0.75rem;
     --text-xs--line-height: calc(1 / 0.75);
     --text-sm: 0.875rem;
@@ -312,6 +313,9 @@
   .invisible {
     visibility: hidden;
   }
+  .visible {
+    visibility: visible;
+  }
   .sr-only {
     position: absolute;
     width: 1px;
@@ -344,12 +348,6 @@
   .inset-y-0 {
     inset-block: calc(var(--spacing) * 0);
   }
-  .start {
-    inset-inline-start: var(--spacing);
-  }
-  .end {
-    inset-inline-end: var(--spacing);
-  }
   .-top-12 {
     top: calc(var(--spacing) * -12);
   }
@@ -561,9 +559,6 @@
     width: calc(var(--spacing) * 8);
     height: calc(var(--spacing) * 8);
   }
-  .h-\(--radix-select-trigger-height\) {
-    height: var(--radix-select-trigger-height);
-  }
   .h-1\.5 {
     height: calc(var(--spacing) * 1.5);
   }
@@ -633,24 +628,30 @@
   .h-px {
     height: 1px;
   }
-  .max-h-80 {
-    max-height: calc(var(--spacing) * 80);
-  }
-  .max-h-96 {
-    max-height: calc(var(--spacing) * 96);
+  .max-h-72 {
+    max-height: calc(var(--spacing) * 72);
   }
   .max-h-\[300px\] {
     max-height: 300px;
   }
+  .max-h-\[min\(20rem\,var\(--radix-select-content-available-height\)\)\] {
+    max-height: min(20rem, var(--radix-select-content-available-height));
+  }
   .max-h-screen {
     max-height: 100vh;
   }
   .min-h-0 {
     min-height: calc(var(--spacing) * 0);
   }
+  .min-h-10 {
+    min-height: calc(var(--spacing) * 10);
+  }
   .min-h-\[60px\] {
     min-height: 60px;
   }
+  .min-h-screen {
+    min-height: 100vh;
+  }
   .w-\(--radix-select-trigger-width\) {
     width: var(--radix-select-trigger-width);
   }
@@ -746,6 +747,9 @@
   .max-w-md {
     max-width: var(--container-md);
   }
+  .max-w-xl {
+    max-width: var(--container-xl);
+  }
   .min-w-\(--radix-select-trigger-width\) {
     min-width: var(--radix-select-trigger-width);
   }
@@ -755,9 +759,6 @@
   .min-w-32 {
     min-width: calc(var(--spacing) * 32);
   }
-  .min-w-48 {
-    min-width: calc(var(--spacing) * 48);
-  }
   .min-w-\[8rem\] {
     min-width: 8rem;
   }
@@ -829,6 +830,9 @@
   .rotate-90 {
     rotate: 90deg;
   }
+  .rotate-180 {
+    rotate: 180deg;
+  }
   .transform {
     transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);
   }
@@ -850,6 +854,9 @@
   .touch-none {
     touch-action: none;
   }
+  .\[scrollbar-gutter\:stable\] {
+    scrollbar-gutter: stable;
+  }
   .list-none {
     list-style-type: none;
   }
@@ -904,6 +911,9 @@
   .gap-4 {
     gap: calc(var(--spacing) * 4);
   }
+  .gap-6 {
+    gap: calc(var(--spacing) * 6);
+  }
   .space-y-1 {
     :where(& > :not(:last-child)) {
       --tw-space-y-reverse: 0;
@@ -960,8 +970,10 @@
   .gap-y-1 {
     row-gap: calc(var(--spacing) * 1);
   }
-  .\!overflow-hidden {
-    overflow: hidden !important;
+  .truncate {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
   }
   .overflow-auto {
     overflow: auto;
@@ -969,6 +981,9 @@
   .overflow-hidden {
     overflow: hidden;
   }
+  .overflow-hidden\! {
+    overflow: hidden !important;
+  }
   .overflow-visible {
     overflow: visible;
   }
@@ -978,6 +993,9 @@
   .overflow-y-auto {
     overflow-y: auto;
   }
+  .overscroll-contain {
+    overscroll-behavior: contain;
+  }
   .rounded {
     border-radius: 0.25rem;
   }
@@ -1012,9 +1030,17 @@
     border-top-left-radius: 10px;
     border-top-right-radius: 10px;
   }
+  .rounded-l-md {
+    border-top-left-radius: calc(var(--radius) - 2px);
+    border-bottom-left-radius: calc(var(--radius) - 2px);
+  }
   .rounded-tl-sm {
     border-top-left-radius: calc(var(--radius) - 4px);
   }
+  .rounded-r-md {
+    border-top-right-radius: calc(var(--radius) - 2px);
+    border-bottom-right-radius: calc(var(--radius) - 2px);
+  }
   .border {
     border-style: var(--tw-border-style);
     border-width: 1px;
@@ -1400,6 +1426,9 @@
   .p-6 {
     padding: calc(var(--spacing) * 6);
   }
+  .p-10 {
+    padding: calc(var(--spacing) * 10);
+  }
   .p-\[1px\] {
     padding: 1px;
   }
@@ -1487,6 +1516,9 @@
   .pb-4 {
     padding-bottom: calc(var(--spacing) * 4);
   }
+  .pb-230 {
+    padding-bottom: calc(var(--spacing) * 230);
+  }
   .pl-2 {
     padding-left: calc(var(--spacing) * 2);
   }
@@ -1601,7 +1633,7 @@
     --tw-tracking: var(--tracking-widest);
     letter-spacing: var(--tracking-widest);
   }
-  .break-words {
+  .wrap-break-word {
     overflow-wrap: break-word;
   }
   .whitespace-nowrap {
@@ -1697,6 +1729,9 @@
   .opacity-90 {
     opacity: 90%;
   }
+  .opacity-100 {
+    opacity: 100%;
+  }
   .shadow {
     --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
     box-shadow:
@@ -1769,6 +1804,15 @@
       var(--tw-ring-shadow),
       var(--tw-shadow);
   }
+  .shadow-xl {
+    --tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 8px 10px -6px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
+    box-shadow:
+      var(--tw-inset-shadow),
+      var(--tw-inset-ring-shadow),
+      var(--tw-ring-offset-shadow),
+      var(--tw-ring-shadow),
+      var(--tw-shadow);
+  }
   .ring-0 {
     --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
     box-shadow:
@@ -2126,6 +2170,38 @@
       z-index: 20;
     }
   }
+  .focus-within\:border-primary {
+    &:focus-within {
+      border-color: var(--primary);
+    }
+  }
+  .focus-within\:border-primary\/60 {
+    &:focus-within {
+      border-color: var(--primary);
+      @supports (color: color-mix(in lab, red, red)) {
+        border-color: color-mix(in oklab, var(--primary) 60%, transparent);
+      }
+    }
+  }
+  .focus-within\:ring-2 {
+    &:focus-within {
+      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
+      box-shadow:
+        var(--tw-inset-shadow),
+        var(--tw-inset-ring-shadow),
+        var(--tw-ring-offset-shadow),
+        var(--tw-ring-shadow),
+        var(--tw-shadow);
+    }
+  }
+  .focus-within\:ring-primary\/20 {
+    &:focus-within {
+      --tw-ring-color: var(--primary);
+      @supports (color: color-mix(in lab, red, red)) {
+        --tw-ring-color: color-mix(in oklab, var(--primary) 20%, transparent);
+      }
+    }
+  }
   .hover\:border-gray-400 {
     &:hover {
       @media (hover: hover) {
@@ -2170,6 +2246,16 @@
       }
     }
   }
+  .hover\:bg-accent\/70 {
+    &:hover {
+      @media (hover: hover) {
+        background-color: var(--accent);
+        @supports (color: color-mix(in lab, red, red)) {
+          background-color: color-mix(in oklab, var(--accent) 70%, transparent);
+        }
+      }
+    }
+  }
   .hover\:bg-amber-500\/10 {
     &:hover {
       @media (hover: hover) {
@@ -2311,13 +2397,6 @@
       }
     }
   }
-  .hover\:bg-primary {
-    &:hover {
-      @media (hover: hover) {
-        background-color: var(--primary);
-      }
-    }
-  }
   .hover\:bg-primary\/15 {
     &:hover {
       @media (hover: hover) {
@@ -2444,13 +2523,6 @@
       }
     }
   }
-  .hover\:text-primary-foreground {
-    &:hover {
-      @media (hover: hover) {
-        color: var(--primary-foreground);
-      }
-    }
-  }
   .hover\:underline {
     &:hover {
       @media (hover: hover) {
@@ -2619,21 +2691,11 @@
       }
     }
   }
-  .focus\:bg-primary {
-    &:focus {
-      background-color: var(--primary);
-    }
-  }
   .focus\:text-accent-foreground {
     &:focus {
       color: var(--accent-foreground);
     }
   }
-  .focus\:text-primary-foreground {
-    &:focus {
-      color: var(--primary-foreground);
-    }
-  }
   .focus\:underline {
     &:focus {
       text-decoration-line: underline;
@@ -2706,14 +2768,6 @@
       --tw-ring-color: var(--ring);
     }
   }
-  .focus\:ring-ring\/40 {
-    &:focus {
-      --tw-ring-color: var(--ring);
-      @supports (color: color-mix(in lab, red, red)) {
-        --tw-ring-color: color-mix(in oklab, var(--ring) 40%, transparent);
-      }
-    }
-  }
   .focus\:ring-offset-2 {
     &:focus {
       --tw-ring-offset-width: 2px;
@@ -2894,34 +2948,11 @@
       background-color: var(--accent);
     }
   }
-  .aria-selected\:bg-accent\/50 {
-    &[aria-selected=true] {
-      background-color: var(--accent);
-      @supports (color: color-mix(in lab, red, red)) {
-        background-color: color-mix(in oklab, var(--accent) 50%, transparent);
-      }
-    }
-  }
   .aria-selected\:text-accent-foreground {
     &[aria-selected=true] {
       color: var(--accent-foreground);
     }
   }
-  .aria-selected\:text-muted-foreground {
-    &[aria-selected=true] {
-      color: var(--muted-foreground);
-    }
-  }
-  .aria-selected\:opacity-30 {
-    &[aria-selected=true] {
-      opacity: 30%;
-    }
-  }
-  .aria-selected\:opacity-100 {
-    &[aria-selected=true] {
-      opacity: 100%;
-    }
-  }
   .aria-\[orientation\=vertical\]\:flex-col {
     &[aria-orientation=vertical] {
       flex-direction: column;
@@ -3710,13 +3741,10 @@
       gap: calc(var(--spacing) * 8);
     }
   }
-  .sm\:space-y-0 {
+  .sm\:gap-x-4 {
     @media (width >= 40rem) {
-      :where(& > :not(:last-child)) {
-        --tw-space-y-reverse: 0;
-        margin-block-start: calc(calc(var(--spacing) * 0) * var(--tw-space-y-reverse));
-        margin-block-end: calc(calc(var(--spacing) * 0) * calc(1 - var(--tw-space-y-reverse)));
-      }
+      -moz-column-gap: calc(var(--spacing) * 4);
+      column-gap: calc(var(--spacing) * 4);
     }
   }
   .sm\:space-x-2 {
@@ -3728,13 +3756,9 @@
       }
     }
   }
-  .sm\:space-x-4 {
+  .sm\:gap-y-0 {
     @media (width >= 40rem) {
-      :where(& > :not(:last-child)) {
-        --tw-space-x-reverse: 0;
-        margin-inline-start: calc(calc(var(--spacing) * 4) * var(--tw-space-x-reverse));
-        margin-inline-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-x-reverse)));
-      }
+      row-gap: calc(var(--spacing) * 0);
     }
   }
   .sm\:rounded-lg {
@@ -3780,11 +3804,6 @@
       max-width: 420px;
     }
   }
-  .md\:max-w-sm {
-    @media (width >= 48rem) {
-      max-width: var(--container-sm);
-    }
-  }
   .lg\:block {
     @media (width >= 64rem) {
       display: block;
@@ -3949,6 +3968,11 @@
       max-height: calc(var(--spacing) * 72);
     }
   }
+  .\[\&_\[data-radix-select-viewport\]\]\:\[scrollbar-gutter\:stable\] {
+    & [data-radix-select-viewport] {
+      scrollbar-gutter: stable;
+    }
+  }
   .\[\&_\[data-radix-select-viewport\]\]\:overflow-y-auto {
     & [data-radix-select-viewport] {
       overflow-y: auto;
@@ -3959,11 +3983,6 @@
       overscroll-behavior: contain;
     }
   }
-  .\[\&_\[data-radix-select-viewport\]\]\:\[scrollbar-gutter\:stable\] {
-    & [data-radix-select-viewport] {
-      scrollbar-gutter: stable;
-    }
-  }
   .\[\&_p\]\:leading-relaxed {
     & p {
       --tw-leading: var(--leading-relaxed);
@@ -4196,69 +4215,84 @@
       line-height: var(--tw-leading, var(--text-xs--line-height));
     }
   }
-  .\[\&\:has\(\>\.day-range-end\)\]\:rounded-r-md {
-    &:has(> .day-range-end) {
-      border-top-right-radius: calc(var(--radius) - 2px);
-      border-bottom-right-radius: calc(var(--radius) - 2px);
+  .\[\&\:has\(\[role\=checkbox\]\)\]\:pr-0 {
+    &:has([role=checkbox]) {
+      padding-right: calc(var(--spacing) * 0);
     }
   }
-  .\[\&\:has\(\>\.day-range-start\)\]\:rounded-l-md {
-    &:has(> .day-range-start) {
+  .\*\:\[\[role\=checkbox\]\]\:translate-y-0\.5 {
+    :is(& > *) {
+      &:is([role=checkbox]) {
+        --tw-translate-y: calc(var(--spacing) * 0.5);
+        translate: var(--tw-translate-x) var(--tw-translate-y);
+      }
+    }
+  }
+  .\[\&\>button\]\:cursor-not-allowed {
+    & > button {
+      cursor: not-allowed;
+    }
+  }
+  .\[\&\>button\]\:rounded-none {
+    & > button {
+      border-radius: 0;
+    }
+  }
+  .\[\&\>button\]\:rounded-l-md {
+    & > button {
       border-top-left-radius: calc(var(--radius) - 2px);
       border-bottom-left-radius: calc(var(--radius) - 2px);
     }
   }
-  .\[\&\:has\(\[aria-selected\]\)\]\:rounded-md {
-    &:has([aria-selected]) {
-      border-radius: calc(var(--radius) - 2px);
+  .\[\&\>button\]\:rounded-r-md {
+    & > button {
+      border-top-right-radius: calc(var(--radius) - 2px);
+      border-bottom-right-radius: calc(var(--radius) - 2px);
     }
   }
-  .\[\&\:has\(\[aria-selected\]\)\]\:bg-accent {
-    &:has([aria-selected]) {
+  .\[\&\>button\]\:bg-accent {
+    & > button {
       background-color: var(--accent);
     }
   }
-  .first\:\[\&\:has\(\[aria-selected\]\)\]\:rounded-l-md {
-    &:first-child {
-      &:has([aria-selected]) {
-        border-top-left-radius: calc(var(--radius) - 2px);
-        border-bottom-left-radius: calc(var(--radius) - 2px);
-      }
+  .\[\&\>button\]\:bg-primary {
+    & > button {
+      background-color: var(--primary);
     }
   }
-  .last\:\[\&\:has\(\[aria-selected\]\)\]\:rounded-r-md {
-    &:last-child {
-      &:has([aria-selected]) {
-        border-top-right-radius: calc(var(--radius) - 2px);
-        border-bottom-right-radius: calc(var(--radius) - 2px);
-      }
+  .\[\&\>button\]\:text-accent-foreground {
+    & > button {
+      color: var(--accent-foreground);
     }
   }
-  .\[\&\:has\(\[aria-selected\]\.day-outside\)\]\:bg-accent\/50 {
-    &:has([aria-selected].day-outside) {
-      background-color: var(--accent);
-      @supports (color: color-mix(in lab, red, red)) {
-        background-color: color-mix(in oklab, var(--accent) 50%, transparent);
-      }
+  .\[\&\>button\]\:text-muted-foreground {
+    & > button {
+      color: var(--muted-foreground);
     }
   }
-  .\[\&\:has\(\[aria-selected\]\.day-range-end\)\]\:rounded-r-md {
-    &:has([aria-selected].day-range-end) {
-      border-top-right-radius: calc(var(--radius) - 2px);
-      border-bottom-right-radius: calc(var(--radius) - 2px);
+  .\[\&\>button\]\:text-primary-foreground {
+    & > button {
+      color: var(--primary-foreground);
     }
   }
-  .\[\&\:has\(\[role\=checkbox\]\)\]\:pr-0 {
-    &:has([role=checkbox]) {
-      padding-right: calc(var(--spacing) * 0);
+  .\[\&\>button\:focus\]\:bg-primary {
+    & > button:focus {
+      background-color: var(--primary);
     }
   }
-  .\*\:\[\[role\=checkbox\]\]\:translate-y-0\.5 {
-    :is(& > *) {
-      &:is([role=checkbox]) {
-        --tw-translate-y: calc(var(--spacing) * 0.5);
-        translate: var(--tw-translate-x) var(--tw-translate-y);
-      }
+  .\[\&\>button\:focus\]\:text-primary-foreground {
+    & > button:focus {
+      color: var(--primary-foreground);
+    }
+  }
+  .\[\&\>button\:hover\]\:bg-primary {
+    & > button:hover {
+      background-color: var(--primary);
+    }
+  }
+  .\[\&\>button\:hover\]\:text-primary-foreground {
+    & > button:hover {
+      color: var(--primary-foreground);
     }
   }
   .\[\&\>span\]\:line-clamp-1 {
@@ -4608,4 +4642,4 @@
     }
   }
 }
-/*! tailwindcss v4.2.4 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */