@giddaa-housing/ui 3.1.0 → 3.3.0

package/dist/styles.css

@@ -143,7 +143,8 @@
     --color-action-danger: #ef4444;
     --color-action-danger-hover: #dc2626;
     --color-action-danger-pressed: #b91c1c;
-    --color-whatsapp-button: #00d158;
+    --color-whatsapp-green: #00d158;
+    --color-whatsapp-button: var(--color-whatsapp-green);
     --color-status-success: #16a34a;
     --color-status-warning: #d97706;
     --color-status-danger: #ef4444;
@@ -577,9 +578,6 @@
   .row-start-2 {
     grid-row-start: 2;
   }
-  .row-start-3 {
-    grid-row-start: 3;
-  }
   .container {
     width: 100%;
     @media (width >= 40rem) {
@@ -879,6 +877,10 @@
     width: calc(var(--spacing) * 24);
     height: calc(var(--spacing) * 24);
   }
+  .size-\[14px\] {
+    width: 14px;
+    height: 14px;
+  }
   .size-\[34px\] {
     width: 34px;
     height: 34px;
@@ -995,6 +997,9 @@
   .h-dvh {
     height: 100dvh;
   }
+  .h-fit {
+    height: fit-content;
+  }
   .h-full {
     height: 100%;
   }
@@ -1019,12 +1024,18 @@
   .max-h-\[68vh\] {
     max-height: 68vh;
   }
+  .max-h-\[calc\(100dvh-4rem\)\] {
+    max-height: calc(100dvh - 4rem);
+  }
   .max-h-\[calc\(100dvh-5rem\)\] {
     max-height: calc(100dvh - 5rem);
   }
   .max-h-full {
     max-height: 100%;
   }
+  .max-h-none {
+    max-height: none;
+  }
   .min-h-0 {
     min-height: 0;
   }
@@ -1301,6 +1312,15 @@
   .max-w-\[520px\] {
     max-width: 520px;
   }
+  .max-w-\[584px\] {
+    max-width: 584px;
+  }
+  .max-w-\[752px\] {
+    max-width: 752px;
+  }
+  .max-w-\[920px\] {
+    max-width: 920px;
+  }
   .max-w-\[calc\(100vw-2\.5rem\)\] {
     max-width: calc(100vw - 2.5rem);
   }
@@ -1391,6 +1411,9 @@
   .flex-1 {
     flex: 1;
   }
+  .shrink {
+    flex-shrink: 1;
+  }
   .shrink-0 {
     flex-shrink: 0;
   }
@@ -1492,6 +1515,10 @@
     --tw-translate-y: var(--active-tab-top);
     translate: var(--tw-translate-x) var(--tw-translate-y);
   }
+  .translate-y-0 {
+    --tw-translate-y: 0;
+    translate: var(--tw-translate-x) var(--tw-translate-y);
+  }
   .translate-y-\[-2\.5rem\] {
     --tw-translate-y: -2.5rem;
     translate: var(--tw-translate-x) var(--tw-translate-y);
@@ -1751,6 +1778,13 @@
       margin-block-end: calc(calc(var(--spacing) * 0.5) * calc(1 - var(--tw-space-y-reverse)));
     }
   }
+  .space-y-1 {
+    :where(& > :not(:last-child)) {
+      --tw-space-y-reverse: 0;
+      margin-block-start: calc(var(--spacing) * var(--tw-space-y-reverse));
+      margin-block-end: calc(var(--spacing) * calc(1 - var(--tw-space-y-reverse)));
+    }
+  }
   .space-y-2 {
     :where(& > :not(:last-child)) {
       --tw-space-y-reverse: 0;
@@ -1963,6 +1997,10 @@
     border-top-left-radius: var(--radius-4xl);
     border-top-right-radius: var(--radius-4xl);
   }
+  .rounded-t-\[inherit\] {
+    border-top-left-radius: inherit;
+    border-top-right-radius: inherit;
+  }
   .rounded-l-full {
     border-top-left-radius: calc(infinity * 1px);
     border-bottom-left-radius: calc(infinity * 1px);
@@ -2118,6 +2156,12 @@
   .border-r-transparent {
     border-right-color: transparent;
   }
+  .bg-\[\#2c3329\] {
+    background-color: #2c3329;
+  }
+  .bg-\[\#11160f\] {
+    background-color: #11160f;
+  }
   .bg-action-danger {
     background-color: var(--color-action-danger);
   }
@@ -2163,10 +2207,10 @@
       background-color: color-mix(in oklab, var(--color-black) 65%, transparent);
     }
   }
-  .bg-black\/80 {
-    background-color: color-mix(in srgb, #000 80%, transparent);
+  .bg-black\/70 {
+    background-color: color-mix(in srgb, #000 70%, transparent);
     @supports (color: color-mix(in lab, red, red)) {
-      background-color: color-mix(in oklab, var(--color-black) 80%, transparent);
+      background-color: color-mix(in oklab, var(--color-black) 70%, transparent);
     }
   }
   .bg-black\/90 {
@@ -2277,6 +2321,9 @@
   .bg-whatsapp-button {
     background-color: var(--color-whatsapp-button);
   }
+  .bg-whatsapp-green {
+    background-color: var(--color-whatsapp-green);
+  }
   .\[background-image\:radial-gradient\(circle\,color-mix\(in_srgb\,var\(--color-line\)_55\%\,transparent\)_0\.75px\,transparent_0\.75px\)\] {
     background-image: radial-gradient(circle,color-mix(in srgb,#cbd5e1 55%,transparent) 0.75px,transparent 0.75px);
     @supports (color: color-mix(in lab, red, red)) {
@@ -2292,9 +2339,6 @@
   .\[background-size\:24px_24px\] {
     background-size: 24px 24px;
   }
-  .bg-cover {
-    background-size: cover;
-  }
   .bg-clip-padding {
     background-clip: padding-box;
   }
@@ -2559,6 +2603,9 @@
   .pt-14 {
     padding-top: calc(var(--spacing) * 14);
   }
+  .pt-\[18px\] {
+    padding-top: 18px;
+  }
   .pt-gdt-5xl {
     padding-top: var(--spacing-gdt-5xl);
   }
@@ -2837,9 +2884,15 @@
   .wrap-break-word {
     overflow-wrap: break-word;
   }
+  .whitespace-normal {
+    white-space: normal;
+  }
   .whitespace-nowrap {
     white-space: nowrap;
   }
+  .text-\[\#ecf2ea\] {
+    color: #ecf2ea;
+  }
   .text-action-primary {
     color: var(--color-action-primary);
   }
@@ -2986,12 +3039,20 @@
     --tw-shadow: var(--shadow-3);
     box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
   }
+  .shadow-\[0_0_4px_rgb\(0_0_0\/0\.1\)\] {
+    --tw-shadow: 0 0 4px 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);
+  }
+  .shadow-\[0_0_8px_2px_rgb\(23_48_22\/0\.06\)\] {
+    --tw-shadow: 0 0 8px 2px var(--tw-shadow-color, rgb(23 48 22/0.06));
+    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+  }
   .shadow-\[0px_0px_4px_0px_rgba\(0\,0\,0\,0\.1\)\] {
     --tw-shadow: 0px 0px 4px 0px var(--tw-shadow-color, rgba(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);
   }
-  .shadow-\[inset_0_0_0_1px_rgb\(0_0_0\/0\.04\)\] {
-    --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, rgb(0 0 0/0.04));
+  .shadow-\[inset_0_0_0_1px_rgb\(0_0_0\/0\.08\)\] {
+    --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, rgb(0 0 0/0.08));
     box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
   }
   .shadow-\[inset_0_0_0_1px_var\(--color-line-subtle\)\] {
@@ -3073,9 +3134,6 @@
       --tw-ring-color: color-mix(in oklab, var(--color-line-focus) 40%, transparent);
     }
   }
-  .ring-surface-brand {
-    --tw-ring-color: var(--color-surface-brand);
-  }
   .inset-ring-line-focus {
     --tw-inset-ring-color: var(--color-line-focus);
   }
@@ -3118,6 +3176,10 @@
     -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
     backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
   }
+  .backdrop-filter {
+    -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
+    backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
+  }
   .transition {
     transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
     transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
@@ -3173,6 +3235,11 @@
     transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
     transition-duration: var(--tw-duration, var(--default-transition-duration));
   }
+  .transition-\[background-color\,box-shadow\,scale\] {
+    transition-property: background-color,box-shadow,scale;
+    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
+    transition-duration: var(--tw-duration, var(--default-transition-duration));
+  }
   .transition-\[background-color\,box-shadow\,transform\] {
     transition-property: background-color,box-shadow,transform;
     transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
@@ -3228,6 +3295,11 @@
     transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
     transition-duration: var(--tw-duration, var(--default-transition-duration));
   }
+  .transition-\[background-color\,transform\] {
+    transition-property: background-color,transform;
+    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
+    transition-duration: var(--tw-duration, var(--default-transition-duration));
+  }
   .transition-\[background-color\,translate\] {
     transition-property: background-color,translate;
     transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
@@ -3278,6 +3350,11 @@
     transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
     transition-duration: var(--tw-duration, var(--default-transition-duration));
   }
+  .transition-\[inset-inline-start\] {
+    transition-property: inset-inline-start;
+    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
+    transition-duration: var(--tw-duration, var(--default-transition-duration));
+  }
   .transition-\[left\,right\,width\] {
     transition-property: left,right,width;
     transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
@@ -3376,6 +3453,10 @@
   .transition-none {
     transition-property: none;
   }
+  .duration-\(--duration-motion-popup\) {
+    --tw-duration: var(--duration-motion-popup);
+    transition-duration: var(--duration-motion-popup);
+  }
   .duration-\(--duration-motion-press\) {
     --tw-duration: var(--duration-motion-press);
     transition-duration: var(--duration-motion-press);
@@ -3509,6 +3590,9 @@
   .\[--collapsed-y\:calc\(var\(--anchor-y\)\+var\(--toast-swipe-movement-y\)-\(var\(--toast-placement-index\)\*var\(--peek\)\)-\(var\(--shrink\)\*var\(--height\)\)\)\] {
     --collapsed-y: calc(var(--anchor-y) + var(--toast-swipe-movement-y) - (var(--toast-placement-index) * var(--peek)) - (var(--shrink) * var(--height)));
   }
+  .\[--dialog-padding\:0px\] {
+    --dialog-padding: 0px;
+  }
   .\[--dialog-padding\:1\.25rem\] {
     --dialog-padding: 1.25rem;
   }
@@ -3641,6 +3725,9 @@
   .\[transition\:transform_var\(--duration-motion-surface\)_var\(--ease-gdt-out\)\,opacity_var\(--duration-motion-surface\)_var\(--ease-gdt-out\)\] {
     transition: transform var(--duration-motion-surface) var(--ease-gdt-out),opacity var(--duration-motion-surface) var(--ease-gdt-out);
   }
+  .duration-\(--duration-motion-popup\) {
+    animation-duration: var(--duration-motion-popup);
+  }
   .duration-\(--duration-motion-press\) {
     animation-duration: var(--duration-motion-press);
   }
@@ -3895,11 +3982,21 @@
       display: none;
     }
   }
+  .group-has-\[\:focus-visible\]\/seek-thumb\:\[filter\:drop-shadow\(0_0_0\.25rem_var\(--color-line-focus\)\)\] {
+    &:is(:where(.group\/seek-thumb):has(*:is(:focus-visible)) *) {
+      filter: drop-shadow(0 0 0.25rem var(--color-line-focus));
+    }
+  }
   .group-has-\[\[aria-invalid\=true\]\]\/input-group\:bg-line-danger {
     &:is(:where(.group\/input-group):has(*:is([aria-invalid=true])) *) {
       background-color: var(--color-line-danger);
     }
   }
+  .group-has-\[\[data-slot\=alert-title\]\]\/alert\:row-start-2 {
+    &:is(:where(.group\/alert):has(*:is([data-slot=alert-title])) *) {
+      grid-row-start: 2;
+    }
+  }
   .group-has-\[\>input\]\/input-group\:pt-2 {
     &:is(:where(.group\/input-group):has(>input) *) {
       padding-top: calc(var(--spacing) * 2);
@@ -4210,6 +4307,14 @@
       color: var(--color-fg-caption-placeholder);
     }
   }
+  .group-data-\[dragging\]\/seek-thumb\:scale-125 {
+    &:is(:where(.group\/seek-thumb)[data-dragging] *) {
+      --tw-scale-x: 125%;
+      --tw-scale-y: 125%;
+      --tw-scale-z: 125%;
+      scale: var(--tw-scale-x) var(--tw-scale-y);
+    }
+  }
   .group-data-\[focused\=true\]\/day\:border-line-focus {
     &:is(:where(.group\/day)[data-focused="true"] *) {
       border-color: var(--color-line-focus);
@@ -4333,6 +4438,11 @@
       rotate: 180deg;
     }
   }
+  .group-data-\[popup-open\]\/theme-switcher\:rotate-180 {
+    &:is(:where(.group\/theme-switcher)[data-popup-open] *) {
+      rotate: 180deg;
+    }
+  }
   .group-data-\[selected\=true\]\/list-item\:text-fg-brand {
     &:is(:where(.group\/list-item)[data-selected="true"] *) {
       color: var(--color-fg-brand);
@@ -6337,12 +6447,12 @@
       }
     }
   }
-  .hover\:bg-black\/90 {
+  .hover\:bg-black\/80 {
     &:hover {
       @media (hover: hover) {
-        background-color: color-mix(in srgb, #000 90%, transparent);
+        background-color: color-mix(in srgb, #000 80%, transparent);
         @supports (color: color-mix(in lab, red, red)) {
-          background-color: color-mix(in oklab, var(--color-black) 90%, transparent);
+          background-color: color-mix(in oklab, var(--color-black) 80%, transparent);
         }
       }
     }
@@ -6751,6 +6861,11 @@
       scale: 0.97;
     }
   }
+  .active\:scale-\[0\.99\] {
+    &:active {
+      scale: 0.99;
+    }
+  }
   .active\:border-line-strong {
     &:active {
       border-color: var(--color-line-strong);
@@ -6831,6 +6946,14 @@
       }
     }
   }
+  .active\:not-aria-\[haspopup\]\:translate-y-0 {
+    &:active {
+      &:not(*[aria-haspopup]) {
+        --tw-translate-y: 0;
+        translate: var(--tw-translate-x) var(--tw-translate-y);
+      }
+    }
+  }
   .active\:not-aria-\[haspopup\]\:translate-y-px {
     &:active {
       &:not(*[aria-haspopup]) {
@@ -7306,6 +7429,11 @@
       height: auto;
     }
   }
+  .aria-current\:bg-surface-brand-subtle {
+    &[aria-current="true"] {
+      background-color: var(--color-surface-brand-subtle);
+    }
+  }
   .aria-disabled\:pointer-events-none {
     &[aria-disabled="true"] {
       pointer-events: none;
@@ -7869,6 +7997,11 @@
       background-color: var(--color-action-tertiary-hover);
     }
   }
+  .data-popup-open\:bg-action-tertiary-pressed {
+    &[data-popup-open] {
+      background-color: var(--color-action-tertiary-pressed);
+    }
+  }
   .data-popup-open\:bg-surface {
     &[data-popup-open] {
       background-color: var(--color-surface);
@@ -8138,14 +8271,6 @@
       scale: var(--tw-scale-x) var(--tw-scale-y);
     }
   }
-  .data-\[dragging\]\:scale-125 {
-    &[data-dragging] {
-      --tw-scale-x: 125%;
-      --tw-scale-y: 125%;
-      --tw-scale-z: 125%;
-      scale: var(--tw-scale-x) var(--tw-scale-y);
-    }
-  }
   .data-\[dragging\]\:transition-none {
     &[data-dragging] {
       transition-property: none;
@@ -9481,6 +9606,21 @@
       margin-top: calc(var(--spacing) * -1);
     }
   }
+  .supports-backdrop-filter\:bg-black\/40 {
+    @supports (backdrop-filter: var(--tw)) {
+      background-color: color-mix(in srgb, #000 40%, transparent);
+      @supports (color: color-mix(in lab, red, red)) {
+        background-color: color-mix(in oklab, var(--color-black) 40%, transparent);
+      }
+    }
+  }
+  .supports-backdrop-filter\:backdrop-blur-\[15px\] {
+    @supports (backdrop-filter: var(--tw)) {
+      --tw-backdrop-blur: blur(15px);
+      -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
+      backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
+    }
+  }
   .supports-backdrop-filter\:backdrop-blur-xl {
     @supports (backdrop-filter: var(--tw)) {
       --tw-backdrop-blur: blur(var(--blur-xl));
@@ -9488,6 +9628,18 @@
       backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
     }
   }
+  .supports-backdrop-filter\:hover\:bg-black\/55 {
+    @supports (backdrop-filter: var(--tw)) {
+      &:hover {
+        @media (hover: hover) {
+          background-color: color-mix(in srgb, #000 55%, transparent);
+          @supports (color: color-mix(in lab, red, red)) {
+            background-color: color-mix(in oklab, var(--color-black) 55%, transparent);
+          }
+        }
+      }
+    }
+  }
   .supports-\[backdrop-filter\]\:backdrop-blur-xl {
     @supports (backdrop-filter: var(--tw)) {
       --tw-backdrop-blur: blur(var(--blur-xl));
@@ -9525,6 +9677,16 @@
       transition: opacity var(--duration-motion-surface) var(--ease-gdt-out);
     }
   }
+  .motion-reduce\:group-data-\[dragging\]\/seek-thumb\:scale-100 {
+    @media (prefers-reduced-motion: reduce) {
+      &:is(:where(.group\/seek-thumb)[data-dragging] *) {
+        --tw-scale-x: 100%;
+        --tw-scale-y: 100%;
+        --tw-scale-z: 100%;
+        scale: var(--tw-scale-x) var(--tw-scale-y);
+      }
+    }
+  }
   .motion-reduce\:active\:translate-y-0 {
     @media (prefers-reduced-motion: reduce) {
       &:active {
@@ -9919,6 +10081,13 @@
       flex-direction: column;
     }
   }
+  .max-sm\:group-has-\[\[data-slot\=alert-title\]\]\/alert\:row-start-3 {
+    @media (width < 40rem) {
+      &:is(:where(.group\/alert):has(*:is([data-slot=alert-title])) *) {
+        grid-row-start: 3;
+      }
+    }
+  }
   .sm\:top-4 {
     @media (width >= 40rem) {
       top: calc(var(--spacing) * 4);
@@ -10013,6 +10182,11 @@
       width: calc(var(--spacing) * 120);
     }
   }
+  .sm\:w-full {
+    @media (width >= 40rem) {
+      width: 100%;
+    }
+  }
   .sm\:max-w-\[26\.5rem\] {
     @media (width >= 40rem) {
       max-width: 26.5rem;
@@ -11435,6 +11609,12 @@
       }
     }
   }
+  .\[\&_svg\:not\(\[data-slot\=currency-flag\]\)\]\:size-3\.5 {
+    & svg:not([data-slot=currency-flag]) {
+      width: calc(var(--spacing) * 3.5);
+      height: calc(var(--spacing) * 3.5);
+    }
+  }
   .\[\&_tr\:last-child\]\:border-0 {
     & tr:last-child {
       border-style: var(--tw-border-style);
@@ -11770,6 +11950,23 @@
       margin-left: -1px;
     }
   }
+  .\[\&\>\[data-slot\=media-player\]\]\:size-full {
+    &>[data-slot=media-player] {
+      width: 100%;
+      height: 100%;
+    }
+  }
+  .\[\&\>\[data-slot\=media-player\]\]\:rounded-none {
+    &>[data-slot=media-player] {
+      border-radius: 0;
+    }
+  }
+  .\[\&\>\[data-slot\=media-player\]\]\:shadow-none {
+    &>[data-slot=media-player] {
+      --tw-shadow: 0 0 #0000;
+      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+    }
+  }
   .has-\[select\[aria-hidden\=true\]\:last-child\]\:\[\&\>\[data-slot\=select-trigger\]\:last-of-type\]\:rounded-r-lg {
     &:has(*:is(select[aria-hidden=true]:last-child)) {
       &>[data-slot=select-trigger]:last-of-type {
@@ -12075,6 +12272,14 @@
       color: var(--color-fg-caption-placeholder);
     }
   }
+  .group-data-\[size\=lg\]\/editorial-card\:\[\&\>svg\]\:size-5 {
+    &:is(:where(.group\/editorial-card)[data-size="lg"] *) {
+      &>svg {
+        width: calc(var(--spacing) * 5);
+        height: calc(var(--spacing) * 5);
+      }
+    }
+  }
   .group-data-\[size\=lg\]\/editorial-card\:\[\&\>svg\]\:size-8 {
     &:is(:where(.group\/editorial-card)[data-size="lg"] *) {
       &>svg {
@@ -12099,6 +12304,14 @@
       }
     }
   }
+  .group-data-\[size\=md\]\/editorial-card\:\[\&\>svg\]\:size-4\.5 {
+    &:is(:where(.group\/editorial-card)[data-size="md"] *) {
+      &>svg {
+        width: calc(var(--spacing) * 4.5);
+        height: calc(var(--spacing) * 4.5);
+      }
+    }
+  }
   .group-data-\[size\=md\]\/editorial-card\:\[\&\>svg\]\:size-7 {
     &:is(:where(.group\/editorial-card)[data-size="md"] *) {
       &>svg {

package/dist/tabs.d.ts

@@ -3,6 +3,11 @@ import { ComponentPropsWithoutRef } from "react";
 import { Tabs as Tabs$1 } from "@base-ui/react/tabs";
 //#region src/tabs.d.ts
 type TabsListVariant = "default" | "line" | "secondary" | "underline";
+/**
+ * Keep friendly aliases in the public API, but collapse to the two concrete
+ * looks the design system ships: `underline` (Primary) and `secondary` (Pill).
+ */
+declare function resolveTabsListVariant(variant: TabsListVariant): "secondary" | "underline";
 declare function Tabs({ className, orientation, size, ...props }: Tabs$1.Root.Props & {
   /**
    * @deprecated Pass `size` to `TabsList` instead — the root is
@@ -18,6 +23,13 @@ declare function TabsList({ className, variant, size, children, ...props }: Tabs
   variant?: TabsListVariant;
   size?: ComponentSize;
 }): import("react").JSX.Element;
+/**
+ * Indicator styling, exported alongside `tabsTriggerClassName` so recipes that
+ * drive their own active state (e.g. `ScrollSpy`) can render the same sliding
+ * bar. Positions itself off the `--active-tab-*` custom properties, which Base
+ * UI sets on the list — anything reusing this has to set them too.
+ */
+declare const tabsIndicatorClassName: string;
 /**
  * Trigger styling, exported so recipes (e.g. an overflow "More" button that
  * isn't a real tab) can render the same look. Reads both `variant` and `size`
@@ -39,4 +51,4 @@ type TabsCountProps = ComponentPropsWithoutRef<"span"> & {
 declare function TabsCount({ className, count, abbreviate, max, loading, children, ...props }: TabsCountProps): import("react").JSX.Element;
 declare function TabsContent({ className, ...props }: Tabs$1.Panel.Props): import("react").JSX.Element;
 //#endregion
-export { Tabs, TabsContent, TabsCount, TabsList, TabsTrigger, tabsListVariants, tabsTriggerClassName };
+export { Tabs, TabsContent, TabsCount, TabsList, type TabsListVariant, TabsTrigger, resolveTabsListVariant, tabsIndicatorClassName, tabsListVariants, tabsTriggerClassName };

package/dist/tabs.js

@@ -40,10 +40,17 @@ function TabsList({ className, variant = "underline", size, children, ...props }
 		"data-size": resolvedSize,
 		className: cn(tabsListVariants({ variant: resolvedVariant }), className),
 		...props,
-		children: [children, /* @__PURE__ */ jsx(Tabs$1.Indicator, { className: cn("pointer-events-none absolute left-0 top-0 z-0 h-(--active-tab-height) w-(--active-tab-width) translate-x-(--active-tab-left) translate-y-(--active-tab-top) transition-[translate,width,height] duration-200 ease-in-out motion-reduce:transition-none", "group-data-[variant=secondary]/tabs-list:hidden", "group-data-[variant=underline]/tabs-list:rounded-none group-data-[variant=underline]/tabs-list:bg-line-focus group-data-[variant=underline]/tabs-list:shadow-none", "group-data-[orientation=horizontal]/tabs:group-data-[variant=underline]/tabs-list:top-auto group-data-[orientation=horizontal]/tabs:group-data-[variant=underline]/tabs-list:bottom-[-1px] group-data-[orientation=horizontal]/tabs:group-data-[variant=underline]/tabs-list:h-0.5! group-data-[orientation=horizontal]/tabs:group-data-[variant=underline]/tabs-list:translate-y-0", "group-data-[orientation=vertical]/tabs:group-data-[variant=underline]/tabs-list:left-auto group-data-[orientation=vertical]/tabs:group-data-[variant=underline]/tabs-list:right-[-1px] group-data-[orientation=vertical]/tabs:group-data-[variant=underline]/tabs-list:w-0.5! group-data-[orientation=vertical]/tabs:group-data-[variant=underline]/tabs-list:translate-x-0") })]
+		children: [children, /* @__PURE__ */ jsx(Tabs$1.Indicator, { className: tabsIndicatorClassName })]
 	});
 }
 /**
+* Indicator styling, exported alongside `tabsTriggerClassName` so recipes that
+* drive their own active state (e.g. `ScrollSpy`) can render the same sliding
+* bar. Positions itself off the `--active-tab-*` custom properties, which Base
+* UI sets on the list — anything reusing this has to set them too.
+*/
+const tabsIndicatorClassName = cn("pointer-events-none absolute left-0 top-0 z-0 h-(--active-tab-height) w-(--active-tab-width) translate-x-(--active-tab-left) translate-y-(--active-tab-top) transition-[translate,width,height] duration-200 ease-in-out motion-reduce:transition-none", "group-data-[variant=secondary]/tabs-list:hidden", "group-data-[variant=underline]/tabs-list:rounded-none group-data-[variant=underline]/tabs-list:bg-line-focus group-data-[variant=underline]/tabs-list:shadow-none", "group-data-[orientation=horizontal]/tabs:group-data-[variant=underline]/tabs-list:top-auto group-data-[orientation=horizontal]/tabs:group-data-[variant=underline]/tabs-list:bottom-[-1px] group-data-[orientation=horizontal]/tabs:group-data-[variant=underline]/tabs-list:h-0.5! group-data-[orientation=horizontal]/tabs:group-data-[variant=underline]/tabs-list:translate-y-0", "group-data-[orientation=vertical]/tabs:group-data-[variant=underline]/tabs-list:left-auto group-data-[orientation=vertical]/tabs:group-data-[variant=underline]/tabs-list:right-[-1px] group-data-[orientation=vertical]/tabs:group-data-[variant=underline]/tabs-list:w-0.5! group-data-[orientation=vertical]/tabs:group-data-[variant=underline]/tabs-list:translate-x-0");
+/**
 * Trigger styling, exported so recipes (e.g. an overflow "More" button that
 * isn't a real tab) can render the same look. Reads both `variant` and `size`
 * off the parent `group/tabs-list`, so it stays in sync wherever it lives
@@ -112,4 +119,4 @@ function TabsContent({ className, ...props }) {
 	});
 }
 //#endregion
-export { Tabs, TabsContent, TabsCount, TabsList, TabsTrigger, tabsListVariants, tabsTriggerClassName };
+export { Tabs, TabsContent, TabsCount, TabsList, TabsTrigger, resolveTabsListVariant, tabsIndicatorClassName, tabsListVariants, tabsTriggerClassName };

package/dist/tag.js

@@ -1,7 +1,7 @@
 "use client";
+import { X } from "./icons.js";
 import { t as cn } from "./cn-BI_4DMBf.js";
 import { useComponentSize } from "./size-context.js";
-import { X } from "lucide-react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { cva } from "class-variance-authority";
 //#region src/tag.tsx

package/dist/testimonial-block.js

@@ -1,8 +1,8 @@
 "use client";
+import { ArrowUpRight, Play, Star } from "./icons.js";
 import { t as cn } from "./cn-BI_4DMBf.js";
 import { Avatar, AvatarFallback, AvatarImage } from "./avatar.js";
 import { buttonVariants } from "./button.js";
-import { ArrowUpRight, Play, Star } from "lucide-react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { mergeProps } from "@base-ui/react/merge-props";
 import { useRender } from "@base-ui/react/use-render";

package/dist/theme-switcher.d.ts

@@ -0,0 +1,31 @@
+import { DropdownMenuTrigger } from "./dropdown-menu.js";
+import { VariantProps } from "class-variance-authority";
+import * as React from "react";
+//#region src/theme-switcher.d.ts
+type ThemeSwitcherValue = "light" | "dark" | "system";
+type ThemeSwitcherOption = {
+  value: ThemeSwitcherValue;
+  label: string;
+  icon?: React.ReactNode;
+};
+declare const themeSwitcherVariants: (props?: ({
+  size?: "lg" | "md" | "sm" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+declare const defaultThemeSwitcherOptions: readonly ThemeSwitcherOption[];
+type ThemeSwitcherProps = Omit<React.ComponentProps<typeof DropdownMenuTrigger>, "children"> & VariantProps<typeof themeSwitcherVariants> & {
+  /** The selected theme. Pass this with `onValueChange` for controlled use. */
+  value?: ThemeSwitcherValue;
+  /** The initial theme when the switcher is uncontrolled. */
+  defaultValue?: ThemeSwitcherValue;
+  /** Called when a theme is selected. Applying the theme remains app-owned. */
+  onValueChange?: (value: ThemeSwitcherValue) => void;
+  /** Available modes, in menu order. Defaults to Light, Dark, and System. */
+  options?: readonly ThemeSwitcherOption[];
+  showIcon?: boolean;
+  showLabel?: boolean;
+  /** Accessible label used when the visible theme label is hidden. */
+  "aria-label"?: string;
+};
+declare function ThemeSwitcher({ className, size, value, defaultValue, onValueChange, options, showIcon, showLabel, "aria-label": ariaLabel, ...props }: ThemeSwitcherProps): React.JSX.Element;
+//#endregion
+export { ThemeSwitcher, type ThemeSwitcherOption, type ThemeSwitcherProps, type ThemeSwitcherValue, defaultThemeSwitcherOptions, themeSwitcherVariants };