@getgreenline/blaze-ui 1.0.23 → 1.0.25

package/dist/globals.css

@@ -8,38 +8,38 @@
 @custom-variant dark (&:is(.dark *));
 
 :root {
-  --background: oklch(1.0000 0 0);
+  --background: oklch(1 0 0);
   --foreground: oklch(0.3152 0.0198 242.4463);
-  --card: oklch(1.0000 0 0);
+  --card: oklch(1 0 0);
   --card-foreground: oklch(0.3152 0.0198 242.4463);
-  --popover: oklch(1.0000 0 0);
+  --popover: oklch(1 0 0);
   --popover-foreground: oklch(0.3152 0.0198 242.4463);
-  --primary: oklch(0.6890 0.1379 230.8);
-  --primary-foreground: oklch(1.0000 0 0);
+  --primary: oklch(0.689 0.1379 230.8);
+  --primary-foreground: oklch(1 0 0);
   --secondary: oklch(0.6723 0.1606 244.9955);
-  --secondary-foreground: oklch(1.0000 0 0);
-  --muted: oklch(0.9680 0.0070 247.8960);
+  --secondary-foreground: oklch(1 0 0);
+  --muted: oklch(0.968 0.007 247.896);
   --muted-foreground: oklch(0.1884 0.0128 248.5103);
   --accent: oklch(0.9632 0.0127 244.2532);
   --accent-foreground: oklch(0.6723 0.1606 244.9955);
   --destructive: oklch(0.6188 0.2376 25.7658);
-  --destructive-foreground: oklch(1.0000 0 0);
+  --destructive-foreground: oklch(1 0 0);
   --border: oklch(0.9317 0.0118 231.6594);
   --input: oklch(0.9809 0.0025 228.7836);
-  --ring: oklch(0.6818 0.1584 243.3540);
+  --ring: oklch(0.6818 0.1584 243.354);
   --chart-1: oklch(0.6723 0.1606 244.9955);
   --chart-2: oklch(0.6907 0.1554 160.3454);
-  --chart-3: oklch(0.8214 0.1600 82.5337);
+  --chart-3: oklch(0.8214 0.16 82.5337);
   --chart-4: oklch(0.7064 0.1822 151.7125);
   --chart-5: oklch(0.5919 0.2186 10.5826);
   --sidebar: oklch(0.9784 0.0011 197.1387);
   --sidebar-foreground: oklch(0.3152 0.0198 242.4463);
   --sidebar-primary: oklch(0.6723 0.1606 244.9955);
-  --sidebar-primary-foreground: oklch(1.0000 0 0);
+  --sidebar-primary-foreground: oklch(1 0 0);
   --sidebar-accent: oklch(0.9392 0.0166 250.8453);
   --sidebar-accent-foreground: oklch(0.6723 0.1606 244.9955);
   --sidebar-border: oklch(0.9271 0.0101 238.5177);
-  --sidebar-ring: oklch(0.6818 0.1584 243.3540);
+  --sidebar-ring: oklch(0.6818 0.1584 243.354);
   --font-sans: Roboto, ui-sans-serif, sans-serif, system-ui;
   --font-serif: Georgia, serif;
   --font-mono: Menlo, monospace;
@@ -50,14 +50,24 @@
   --shadow-spread: 0px;
   --shadow-opacity: 0;
   --shadow-color: rgba(29, 161, 242, 0.15);
-  --shadow-2xs: 0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00);
-  --shadow-xs: 0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00);
-  --shadow-sm: 0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00), 0px 1px 2px -1px hsl(202.8169 89.1213% 53.1373% / 0.00);
-  --shadow: 0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00), 0px 1px 2px -1px hsl(202.8169 89.1213% 53.1373% / 0.00);
-  --shadow-md: 0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00), 0px 2px 4px -1px hsl(202.8169 89.1213% 53.1373% / 0.00);
-  --shadow-lg: 0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00), 0px 4px 6px -1px hsl(202.8169 89.1213% 53.1373% / 0.00);
-  --shadow-xl: 0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00), 0px 8px 10px -1px hsl(202.8169 89.1213% 53.1373% / 0.00);
-  --shadow-2xl: 0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00);
+  --shadow-2xs: 0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0);
+  --shadow-xs: 0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0);
+  --shadow-sm:
+    0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0),
+    0px 1px 2px -1px hsl(202.8169 89.1213% 53.1373% / 0);
+  --shadow:
+    0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0),
+    0px 1px 2px -1px hsl(202.8169 89.1213% 53.1373% / 0);
+  --shadow-md:
+    0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0),
+    0px 2px 4px -1px hsl(202.8169 89.1213% 53.1373% / 0);
+  --shadow-lg:
+    0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0),
+    0px 4px 6px -1px hsl(202.8169 89.1213% 53.1373% / 0);
+  --shadow-xl:
+    0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0),
+    0px 8px 10px -1px hsl(202.8169 89.1213% 53.1373% / 0);
+  --shadow-2xl: 0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0);
   --tracking-normal: 0em;
   --spacing: 0.25rem;
 }
@@ -65,36 +75,36 @@
 .dark {
   --background: oklch(0 0 0);
   --foreground: oklch(0.9328 0.0025 228.7857);
-  --card: oklch(0.2097 0.0080 274.5332);
+  --card: oklch(0.2097 0.008 274.5332);
   --card-foreground: oklch(0.8853 0 0);
   --popover: oklch(0 0 0);
   --popover-foreground: oklch(0.9328 0.0025 228.7857);
-  --primary: oklch(0.6692 0.1607 245.0110);
-  --primary-foreground: oklch(1.0000 0 0);
+  --primary: oklch(0.6692 0.1607 245.011);
+  --primary-foreground: oklch(1 0 0);
   --secondary: oklch(0.9622 0.0035 219.5331);
   --secondary-foreground: oklch(0.1884 0.0128 248.5103);
-  --muted: oklch(0.2090 0 0);
+  --muted: oklch(0.209 0 0);
   --muted-foreground: oklch(0.5637 0.0078 247.9662);
   --accent: oklch(0.1928 0.0331 242.5459);
-  --accent-foreground: oklch(0.6692 0.1607 245.0110);
+  --accent-foreground: oklch(0.6692 0.1607 245.011);
   --destructive: oklch(0.6188 0.2376 25.7658);
-  --destructive-foreground: oklch(1.0000 0 0);
+  --destructive-foreground: oklch(1 0 0);
   --border: oklch(0.2674 0.0047 248.0045);
-  --input: oklch(0.3020 0.0288 244.8244);
-  --ring: oklch(0.6818 0.1584 243.3540);
+  --input: oklch(0.302 0.0288 244.8244);
+  --ring: oklch(0.6818 0.1584 243.354);
   --chart-1: oklch(0.6723 0.1606 244.9955);
   --chart-2: oklch(0.6907 0.1554 160.3454);
-  --chart-3: oklch(0.8214 0.1600 82.5337);
+  --chart-3: oklch(0.8214 0.16 82.5337);
   --chart-4: oklch(0.7064 0.1822 151.7125);
   --chart-5: oklch(0.5919 0.2186 10.5826);
   --sidebar: oklch(0.2064 0.0474 267.6919);
   --sidebar-foreground: oklch(0.8853 0 0);
-  --sidebar-primary: oklch(0.6818 0.1584 243.3540);
-  --sidebar-primary-foreground: oklch(1.0000 0 0);
+  --sidebar-primary: oklch(0.6818 0.1584 243.354);
+  --sidebar-primary-foreground: oklch(1 0 0);
   --sidebar-accent: oklch(0.1928 0.0331 242.5459);
-  --sidebar-accent-foreground: oklch(0.6692 0.1607 245.0110);
-  --sidebar-border: oklch(0.3795 0.0220 240.5943);
-  --sidebar-ring: oklch(0.6818 0.1584 243.3540);
+  --sidebar-accent-foreground: oklch(0.6692 0.1607 245.011);
+  --sidebar-border: oklch(0.3795 0.022 240.5943);
+  --sidebar-ring: oklch(0.6818 0.1584 243.354);
   --font-sans: Roboto, ui-sans-serif, sans-serif, system-ui;
   --font-serif: Georgia, serif;
   --font-mono: Menlo, monospace;
@@ -105,14 +115,24 @@
   --shadow-spread: 0px;
   --shadow-opacity: 0;
   --shadow-color: rgba(29, 161, 242, 0.25);
-  --shadow-2xs: 0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00);
-  --shadow-xs: 0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00);
-  --shadow-sm: 0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00), 0px 1px 2px -1px hsl(202.8169 89.1213% 53.1373% / 0.00);
-  --shadow: 0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00), 0px 1px 2px -1px hsl(202.8169 89.1213% 53.1373% / 0.00);
-  --shadow-md: 0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00), 0px 2px 4px -1px hsl(202.8169 89.1213% 53.1373% / 0.00);
-  --shadow-lg: 0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00), 0px 4px 6px -1px hsl(202.8169 89.1213% 53.1373% / 0.00);
-  --shadow-xl: 0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00), 0px 8px 10px -1px hsl(202.8169 89.1213% 53.1373% / 0.00);
-  --shadow-2xl: 0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0.00);
+  --shadow-2xs: 0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0);
+  --shadow-xs: 0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0);
+  --shadow-sm:
+    0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0),
+    0px 1px 2px -1px hsl(202.8169 89.1213% 53.1373% / 0);
+  --shadow:
+    0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0),
+    0px 1px 2px -1px hsl(202.8169 89.1213% 53.1373% / 0);
+  --shadow-md:
+    0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0),
+    0px 2px 4px -1px hsl(202.8169 89.1213% 53.1373% / 0);
+  --shadow-lg:
+    0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0),
+    0px 4px 6px -1px hsl(202.8169 89.1213% 53.1373% / 0);
+  --shadow-xl:
+    0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0),
+    0px 8px 10px -1px hsl(202.8169 89.1213% 53.1373% / 0);
+  --shadow-2xl: 0px 2px 0px 0px hsl(202.8169 89.1213% 53.1373% / 0);
 }
 
 @theme inline {
@@ -163,7 +183,7 @@
   --shadow-lg: var(--shadow-lg);
   --shadow-xl: var(--shadow-xl);
   --shadow-2xl: var(--shadow-2xl);
-   --color-sky-500: #0ea5e9;
+  --color-sky-500: #0ea5e9;
   --color-sky-600: #0284c7;
 }
 
@@ -197,14 +217,14 @@
   @apply tw:text-foreground tw:font-sans;
 }
 
-.blaze-ui-root button[data-slot='button'],
-.blaze-ui-root button[data-slot='switch'] {
+.blaze-ui-root button[data-slot="button"],
+.blaze-ui-root button[data-slot="switch"] {
   color: inherit;
   box-shadow: none;
   font: inherit;
 }
 
-.blaze-ui-root button[data-slot='button'] {
+.blaze-ui-root button[data-slot="button"] {
   background-color: initial;
   min-height: var(--blaze-420-height-9);
   height: var(--blaze-420-height-9);
@@ -215,13 +235,220 @@
   line-height: var(--blaze-420-line-sm);
 }
 
-.blaze-ui-root button[data-slot='button'].tw\:has-\[\>svg\]\:px-3,
-.blaze-ui-root button[data-slot='button']:has(> svg) {
+.blaze-ui-root button[data-slot="button"].tw\:has-\[\>svg\]\:px-3,
+.blaze-ui-root button[data-slot="button"]:has(> svg) {
   padding-left: var(--blaze-420-space-3);
   padding-right: var(--blaze-420-space-3);
 }
 
-.blaze-ui-root button[data-slot='switch'] {
+/* SelectionPanel utility classes - Blaze 420 scoped overrides */
+
+/* Typography */
+.blaze-ui-root .tw\:text-lg {
+  font-size: 18px;
+  line-height: 28px;
+}
+
+.blaze-ui-root .tw\:text-lg\! {
+  font-size: 18px !important;
+  line-height: 28px !important;
+}
+
+.blaze-ui-root .tw\:font-semibold {
+  font-weight: 600;
+}
+
+.blaze-ui-root .tw\:\!font-semibold {
+  font-weight: 600 !important;
+}
+
+/* Layout - Flexbox */
+.blaze-ui-root .tw\:flex {
+  display: flex;
+}
+
+.blaze-ui-root .tw\:\!flex {
+  display: flex !important;
+}
+
+.blaze-ui-root .tw\:flex-col {
+  flex-direction: column;
+}
+
+.blaze-ui-root .tw\:\!flex-col {
+  flex-direction: column !important;
+}
+
+.blaze-ui-root .tw\:flex-row {
+  flex-direction: row;
+}
+
+.blaze-ui-root .tw\:\!flex-row {
+  flex-direction: row !important;
+}
+
+.blaze-ui-root .tw\:flex-1 {
+  flex: 1 1 0%;
+}
+
+.blaze-ui-root .tw\:\!flex-1 {
+  flex: 1 1 0% !important;
+}
+
+.blaze-ui-root .tw\:items-center {
+  align-items: center;
+}
+
+.blaze-ui-root .tw\:\!items-center {
+  align-items: center !important;
+}
+
+.blaze-ui-root .tw\:justify-between {
+  justify-content: space-between;
+}
+
+.blaze-ui-root .tw\:\!justify-between {
+  justify-content: space-between !important;
+}
+
+.blaze-ui-root .tw\:justify-end {
+  justify-content: flex-end;
+}
+
+.blaze-ui-root .tw\:\!justify-end {
+  justify-content: flex-end !important;
+}
+
+/* Sizing */
+.blaze-ui-root .tw\:h-full {
+  height: 100%;
+}
+
+.blaze-ui-root .tw\:\!h-full {
+  height: 100% !important;
+}
+
+.blaze-ui-root .tw\:w-1\/2 {
+  width: 50%;
+}
+
+.blaze-ui-root .tw\:\!w-1\/2 {
+  width: 50% !important;
+}
+
+/* Overflow */
+.blaze-ui-root .tw\:overflow-hidden {
+  overflow: hidden;
+}
+
+.blaze-ui-root .tw\:\!overflow-hidden {
+  overflow: hidden !important;
+}
+
+/* Spacing - Padding */
+.blaze-ui-root .tw\:p-0 {
+  padding: 0;
+}
+
+.blaze-ui-root .tw\:\!p-0 {
+  padding: 0 !important;
+}
+
+.blaze-ui-root .tw\:p-2 {
+  padding: var(--blaze-420-space-2);
+}
+
+.blaze-ui-root .tw\:\!p-2 {
+  padding: var(--blaze-420-space-2) !important;
+}
+
+.blaze-ui-root .tw\:p-4 {
+  padding: var(--blaze-420-space-4);
+}
+
+.blaze-ui-root .tw\:\!p-4 {
+  padding: var(--blaze-420-space-4) !important;
+}
+
+.blaze-ui-root .tw\:px-0 {
+  padding-left: 0;
+  padding-right: 0;
+}
+
+.blaze-ui-root .tw\:\!px-0 {
+  padding-left: 0 !important;
+  padding-right: 0 !important;
+}
+
+/* Spacing - Margin */
+.blaze-ui-root .tw\:mb-3 {
+  margin-bottom: var(--blaze-420-space-3);
+}
+
+.blaze-ui-root .tw\:\!mb-3 {
+  margin-bottom: var(--blaze-420-space-3) !important;
+}
+
+.blaze-ui-root .tw\:mt-3 {
+  margin-top: var(--blaze-420-space-3);
+}
+
+.blaze-ui-root .tw\:\!mt-3 {
+  margin-top: var(--blaze-420-space-3) !important;
+}
+
+/* Borders */
+.blaze-ui-root .tw\:border-b {
+  border-bottom-width: 1px;
+}
+
+.blaze-ui-root .tw\:\!border-b {
+  border-bottom-width: 1px !important;
+}
+
+.blaze-ui-root .tw\:border-t {
+  border-top-width: 1px;
+}
+
+.blaze-ui-root .tw\:\!border-t {
+  border-top-width: 1px !important;
+}
+
+.blaze-ui-root .tw\:border-r {
+  border-right-width: 1px;
+}
+
+.blaze-ui-root .tw\:\!border-r {
+  border-right-width: 1px !important;
+}
+
+/* Colors */
+.blaze-ui-root .tw\:text-muted-foreground {
+  color: hsl(var(--muted-foreground));
+}
+
+.blaze-ui-root .tw\:\!text-muted-foreground {
+  color: hsl(var(--muted-foreground)) !important;
+}
+
+.blaze-ui-root .tw\:text-primary {
+  color: hsl(var(--primary));
+}
+
+.blaze-ui-root .tw\:\!text-primary {
+  color: hsl(var(--primary)) !important;
+}
+
+/* Z-index */
+.blaze-ui-root .tw\:z-\[1200\] {
+  z-index: 1200;
+}
+
+.blaze-ui-root .tw\:\!z-\[1200\] {
+  z-index: 1200 !important;
+}
+
+.blaze-ui-root button[data-slot="switch"] {
   background-color: initial;
   width: var(--blaze-420-switch-width);
   min-width: var(--blaze-420-switch-width);
@@ -230,53 +457,53 @@
   border-radius: var(--blaze-420-radius-full);
 }
 
-.blaze-ui-root button[data-slot='switch']>[data-slot='switch-thumb'] {
+.blaze-ui-root button[data-slot="switch"] > [data-slot="switch-thumb"] {
   width: var(--blaze-420-thumb-size);
   height: var(--blaze-420-thumb-size);
 }
 
-.blaze-ui-root button[data-slot='button'].tw\:bg-primary {
+.blaze-ui-root button[data-slot="button"].tw\:bg-primary {
   @apply tw:bg-primary;
 }
 
-.blaze-ui-root button[data-slot='button'].tw\:bg-destructive {
+.blaze-ui-root button[data-slot="button"].tw\:bg-destructive {
   @apply tw:bg-destructive;
 }
 
-.blaze-ui-root button[data-slot='button'].tw\:bg-secondary {
+.blaze-ui-root button[data-slot="button"].tw\:bg-secondary {
   @apply tw:bg-secondary;
 }
 
-.blaze-ui-root button[data-slot='button'].tw\:bg-background {
+.blaze-ui-root button[data-slot="button"].tw\:bg-background {
   @apply tw:bg-background;
 }
 
-.blaze-ui-root button[data-slot='button'].tw\:text-primary-foreground {
+.blaze-ui-root button[data-slot="button"].tw\:text-primary-foreground {
   @apply tw:text-primary-foreground;
 }
 
-.blaze-ui-root button[data-slot='button'].tw\:text-white {
+.blaze-ui-root button[data-slot="button"].tw\:text-white {
   @apply tw:text-white;
 }
 
-.blaze-ui-root button[data-slot='button'].tw\:text-secondary-foreground {
+.blaze-ui-root button[data-slot="button"].tw\:text-secondary-foreground {
   @apply tw:text-secondary-foreground;
 }
 
-.blaze-ui-root button[data-slot='button'].tw\:text-primary {
+.blaze-ui-root button[data-slot="button"].tw\:text-primary {
   @apply tw:text-primary;
 }
 
-.blaze-ui-root button[data-slot='button'].tw\:shadow-xs,
-.blaze-ui-root button[data-slot='switch'].tw\:shadow-xs {
+.blaze-ui-root button[data-slot="button"].tw\:shadow-xs,
+.blaze-ui-root button[data-slot="switch"].tw\:shadow-xs {
   @apply tw:shadow-xs;
 }
 
-.blaze-ui-root button[data-slot='button'].tw\:border {
+.blaze-ui-root button[data-slot="button"].tw\:border {
   @apply tw:border tw:border-border;
 }
 
-.blaze-ui-root button[data-slot='switch'].tw\:border {
+.blaze-ui-root button[data-slot="switch"].tw\:border {
   @apply tw:border tw:border-transparent;
 }
 
@@ -374,23 +601,23 @@
   @apply tw:text-primary tw:hover:text-primary/90;
 }
 
-.blaze-ui-root button[data-slot='switch'][data-state='checked'] {
+.blaze-ui-root button[data-slot="switch"][data-state="checked"] {
   background-color: var(--primary) !important;
 }
 
-.blaze-ui-root button[data-slot='switch'][data-state='unchecked'] {
+.blaze-ui-root button[data-slot="switch"][data-state="unchecked"] {
   background-color: var(--input) !important;
 }
 
-.blaze-ui-root [data-slot='segmented-control-item'][data-state='active'] {
+.blaze-ui-root [data-slot="segmented-control-item"][data-state="active"] {
   color: var(--primary-foreground) !important;
 }
 
-.blaze-ui-root [data-slot='label']>span[aria-hidden='true'] {
+.blaze-ui-root [data-slot="label"] > span[aria-hidden="true"] {
   margin-left: var(--blaze-420-space-1);
 }
 
-.blaze-ui-root [data-slot='button-spinner'] svg {
+.blaze-ui-root [data-slot="button-spinner"] svg {
   stroke: currentColor;
   fill: none;
 }
@@ -404,4 +631,4 @@
   body {
     @apply tw:bg-background tw:text-foreground;
   }
-}
+}

package/dist/index.d.ts

@@ -53,5 +53,9 @@ export * from "./components/field";
 export * from "./components/form";
 export * from "./components/input-group";
 export * from "./components/sidebar";
+export * from "./components/search-bar";
+export * from "./components/selection-panel";
+export * from "./components/visually-hidden";
 export * from "./lib/utils";
+export * from "./lib/portal-wrapper";
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,qBAAqB,CAAA;AACnC,cAAc,2BAA2B,CAAA;AACzC,cAAc,oBAAoB,CAAA;AAClC,cAAc,mBAAmB,CAAA;AACjC,cAAc,qBAAqB,CAAA;AACnC,cAAc,uBAAuB,CAAA;AACrC,cAAc,oBAAoB,CAAA;AAClC,cAAc,oBAAoB,CAAA;AAClC,cAAc,sBAAsB,CAAA;AACpC,cAAc,qBAAqB,CAAA;AACnC,cAAc,0BAA0B,CAAA;AACxC,cAAc,0BAA0B,CAAA;AACxC,cAAc,qBAAqB,CAAA;AACnC,cAAc,oBAAoB,CAAA;AAClC,cAAc,gCAAgC,CAAA;AAC9C,cAAc,wBAAwB,CAAA;AACtC,cAAc,oBAAoB,CAAA;AAClC,cAAc,2BAA2B,CAAA;AACzC,cAAc,qBAAqB,CAAA;AACnC,cAAc,yBAAyB,CAAA;AACvC,cAAc,0BAA0B,CAAA;AACxC,cAAc,2BAA2B,CAAA;AACzC,cAAc,qBAAqB,CAAA;AACnC,cAAc,4BAA4B,CAAA;AAC1C,cAAc,oBAAoB,CAAA;AAClC,cAAc,yBAAyB,CAAA;AACvC,cAAc,wBAAwB,CAAA;AACtC,cAAc,kBAAkB,CAAA;AAChC,cAAc,sBAAsB,CAAA;AACpC,cAAc,8BAA8B,CAAA;AAC5C,cAAc,uBAAuB,CAAA;AACrC,cAAc,wBAAwB,CAAA;AACtC,cAAc,wBAAwB,CAAA;AACtC,cAAc,uBAAuB,CAAA;AACrC,cAAc,qBAAqB,CAAA;AACnC,cAAc,qBAAqB,CAAA;AACnC,cAAc,sBAAsB,CAAA;AACpC,cAAc,oBAAoB,CAAA;AAClC,cAAc,yBAAyB,CAAA;AACvC,cAAc,mBAAmB,CAAA;AACjC,cAAc,uBAAuB,CAAA;AACrC,cAAc,qBAAqB,CAAA;AACnC,cAAc,sBAAsB,CAAA;AACpC,cAAc,oBAAoB,CAAA;AAClC,cAAc,sBAAsB,CAAA;AACpC,cAAc,mBAAmB,CAAA;AACjC,cAAc,2BAA2B,CAAA;AACzC,cAAc,2BAA2B,CAAA;AACzC,cAAc,uBAAuB,CAAA;AACrC,cAAc,yBAAyB,CAAA;AACvC,cAAc,oBAAoB,CAAA;AAClC,cAAc,oBAAoB,CAAA;AAClC,cAAc,mBAAmB,CAAA;AACjC,cAAc,0BAA0B,CAAA;AACxC,cAAc,sBAAsB,CAAA;AACpC,cAAc,aAAa,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,qBAAqB,CAAA;AACnC,cAAc,2BAA2B,CAAA;AACzC,cAAc,oBAAoB,CAAA;AAClC,cAAc,mBAAmB,CAAA;AACjC,cAAc,qBAAqB,CAAA;AACnC,cAAc,uBAAuB,CAAA;AACrC,cAAc,oBAAoB,CAAA;AAClC,cAAc,oBAAoB,CAAA;AAClC,cAAc,sBAAsB,CAAA;AACpC,cAAc,qBAAqB,CAAA;AACnC,cAAc,0BAA0B,CAAA;AACxC,cAAc,0BAA0B,CAAA;AACxC,cAAc,qBAAqB,CAAA;AACnC,cAAc,oBAAoB,CAAA;AAClC,cAAc,gCAAgC,CAAA;AAC9C,cAAc,wBAAwB,CAAA;AACtC,cAAc,oBAAoB,CAAA;AAClC,cAAc,2BAA2B,CAAA;AACzC,cAAc,qBAAqB,CAAA;AACnC,cAAc,yBAAyB,CAAA;AACvC,cAAc,0BAA0B,CAAA;AACxC,cAAc,2BAA2B,CAAA;AACzC,cAAc,qBAAqB,CAAA;AACnC,cAAc,4BAA4B,CAAA;AAC1C,cAAc,oBAAoB,CAAA;AAClC,cAAc,yBAAyB,CAAA;AACvC,cAAc,wBAAwB,CAAA;AACtC,cAAc,kBAAkB,CAAA;AAChC,cAAc,sBAAsB,CAAA;AACpC,cAAc,8BAA8B,CAAA;AAC5C,cAAc,uBAAuB,CAAA;AACrC,cAAc,wBAAwB,CAAA;AACtC,cAAc,wBAAwB,CAAA;AACtC,cAAc,uBAAuB,CAAA;AACrC,cAAc,qBAAqB,CAAA;AACnC,cAAc,qBAAqB,CAAA;AACnC,cAAc,sBAAsB,CAAA;AACpC,cAAc,oBAAoB,CAAA;AAClC,cAAc,yBAAyB,CAAA;AACvC,cAAc,mBAAmB,CAAA;AACjC,cAAc,uBAAuB,CAAA;AACrC,cAAc,qBAAqB,CAAA;AACnC,cAAc,sBAAsB,CAAA;AACpC,cAAc,oBAAoB,CAAA;AAClC,cAAc,sBAAsB,CAAA;AACpC,cAAc,mBAAmB,CAAA;AACjC,cAAc,2BAA2B,CAAA;AACzC,cAAc,2BAA2B,CAAA;AACzC,cAAc,uBAAuB,CAAA;AACrC,cAAc,yBAAyB,CAAA;AACvC,cAAc,oBAAoB,CAAA;AAClC,cAAc,oBAAoB,CAAA;AAClC,cAAc,mBAAmB,CAAA;AACjC,cAAc,0BAA0B,CAAA;AACxC,cAAc,sBAAsB,CAAA;AACpC,cAAc,yBAAyB,CAAA;AACvC,cAAc,8BAA8B,CAAA;AAC5C,cAAc,8BAA8B,CAAA;AAC5C,cAAc,aAAa,CAAA;AAC3B,cAAc,sBAAsB,CAAA"}

package/dist/index.js

@@ -53,5 +53,9 @@ export { Field, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLab
 export { Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, useFormField } from './components/form.js';
 export { InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea } from './components/input-group.js';
 export { Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, useSidebar } from './components/sidebar.js';
+export { SearchBar } from './components/search-bar.js';
+export { SelectionPanel } from './components/selection-panel.js';
+export { VisuallyHidden } from './components/visually-hidden.js';
 export { cn } from './lib/utils.js';
+export { PortalWrapper } from './lib/portal-wrapper.js';
 export { Check, X } from 'lucide-react';

package/dist/lib/portal-wrapper.d.ts

@@ -0,0 +1,32 @@
+import * as React from "react";
+/**
+ * PortalWrapper - Wraps portal content in .blaze-ui-root for scoped Tailwind CSS
+ *
+ * **Problem**: Radix UI portals render at document.body level, outside the MFE's
+ * .blaze-ui-root wrapper. Since Blaze UI's Tailwind CSS is scoped to .blaze-ui-root,
+ * portal content renders unstyled without an ancestor with this class.
+ *
+ * **Solution**: Wrap all portal content in a <div className="blaze-ui-root"> with
+ * display: contents. The wrapper is layout-transparent (invisible to CSS layout)
+ * but provides the necessary class for Tailwind CSS scoping.
+ *
+ * **Usage**: Import and wrap children in all Radix portal Content components:
+ * - SheetContent (sheet.tsx)
+ * - DialogContent (dialog.tsx)
+ * - AlertDialogContent (alert-dialog.tsx)
+ * - PopoverContent (popover.tsx)
+ * - TooltipContent (tooltip.tsx)
+ * - DropdownMenuContent (dropdown-menu.tsx)
+ * - ContextMenuContent (context-menu.tsx)
+ *
+ * @example
+ * <SheetPrimitive.Content {...props}>
+ *   <PortalWrapper>
+ *     {children}
+ *   </PortalWrapper>
+ * </SheetPrimitive.Content>
+ */
+export declare function PortalWrapper({ children }: {
+    children: React.ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=portal-wrapper.d.ts.map

package/dist/lib/portal-wrapper.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"portal-wrapper.d.ts","sourceRoot":"","sources":["../../src/lib/portal-wrapper.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,wBAAgB,aAAa,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAAE,2CAMxE"}

package/dist/lib/portal-wrapper.js

@@ -0,0 +1,34 @@
+import { jsx } from 'react/jsx-runtime';
+
+/**
+ * PortalWrapper - Wraps portal content in .blaze-ui-root for scoped Tailwind CSS
+ *
+ * **Problem**: Radix UI portals render at document.body level, outside the MFE's
+ * .blaze-ui-root wrapper. Since Blaze UI's Tailwind CSS is scoped to .blaze-ui-root,
+ * portal content renders unstyled without an ancestor with this class.
+ *
+ * **Solution**: Wrap all portal content in a <div className="blaze-ui-root"> with
+ * display: contents. The wrapper is layout-transparent (invisible to CSS layout)
+ * but provides the necessary class for Tailwind CSS scoping.
+ *
+ * **Usage**: Import and wrap children in all Radix portal Content components:
+ * - SheetContent (sheet.tsx)
+ * - DialogContent (dialog.tsx)
+ * - AlertDialogContent (alert-dialog.tsx)
+ * - PopoverContent (popover.tsx)
+ * - TooltipContent (tooltip.tsx)
+ * - DropdownMenuContent (dropdown-menu.tsx)
+ * - ContextMenuContent (context-menu.tsx)
+ *
+ * @example
+ * <SheetPrimitive.Content {...props}>
+ *   <PortalWrapper>
+ *     {children}
+ *   </PortalWrapper>
+ * </SheetPrimitive.Content>
+ */
+function PortalWrapper({ children }) {
+    return (jsx("div", { className: "blaze-ui-root", style: { display: "contents" }, children: children }));
+}
+
+export { PortalWrapper };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@getgreenline/blaze-ui",
-  "version": "1.0.23",
+  "version": "1.0.25",
   "type": "module",
   "dependencies": {
     "@base-ui/react": "^1.1.0",