@luxfi/ui 7.3.2 → 7.4.0

package/dist/index.cjs

@@ -1,25 +1,23 @@
 "use client";
 'use strict';
 
-var core = require('@hanzogui/core');
+var gui = require('@hanzo/gui');
 var reactQuery = require('@tanstack/react-query');
+var React30 = require('react');
+var v5 = require('@hanzogui/config/v5');
 var jsxRuntime = require('react/jsx-runtime');
 var clsx = require('clsx');
 var tailwindMerge = require('tailwind-merge');
 var AccordionPrimitive = require('@radix-ui/react-accordion');
-var React29 = require('react');
 var RadixAvatar = require('@radix-ui/react-avatar');
-var tooltip = require('@hanzogui/tooltip');
 var usehooks = require('@uidotdev/usehooks');
 var RadixCheckbox = require('@radix-ui/react-checkbox');
 var Collapsible = require('@radix-ui/react-collapsible');
-var dialog = require('@hanzogui/dialog');
 var RadixDialog = require('@radix-ui/react-dialog');
 var LabelPrimitive = require('@radix-ui/react-label');
 var esToolkit = require('es-toolkit');
 var DropdownMenu = require('@radix-ui/react-dropdown-menu');
 var lu = require('react-icons/lu');
-var popover = require('@hanzogui/popover');
 var RadixProgress = require('@radix-ui/react-progress');
 var RadixRadioGroup = require('@radix-ui/react-radio-group');
 var RadixSelect = require('@radix-ui/react-select');
@@ -46,8 +44,8 @@ function _interopNamespace(e) {
   return Object.freeze(n);
 }
 
+var React30__namespace = /*#__PURE__*/_interopNamespace(React30);
 var AccordionPrimitive__namespace = /*#__PURE__*/_interopNamespace(AccordionPrimitive);
-var React29__namespace = /*#__PURE__*/_interopNamespace(React29);
 var RadixAvatar__namespace = /*#__PURE__*/_interopNamespace(RadixAvatar);
 var RadixCheckbox__namespace = /*#__PURE__*/_interopNamespace(RadixCheckbox);
 var Collapsible__namespace = /*#__PURE__*/_interopNamespace(Collapsible);
@@ -62,20 +60,76 @@ var RadixSwitch__namespace = /*#__PURE__*/_interopNamespace(RadixSwitch);
 var RadixTabs__namespace = /*#__PURE__*/_interopNamespace(RadixTabs);
 
 // src/provider.tsx
-if (typeof window !== "undefined") {
-  core.createGui({ settings: { autocompleteSpecificTokens: "except-special" } });
-}
+var LUX_BRAND = {
+  lux: "#7000FF",
+  zoo: "#6C5EFB",
+  hanzo: "#EA580C",
+  pars: "#1C3879"
+};
+var PARS_GOLD = "#C8A45C";
+var TRUE_BLACK = "#000000";
+var darkBase = {
+  ...v5.defaultConfig.themes.dark,
+  background: TRUE_BLACK,
+  backgroundHover: "#0A0A0A",
+  backgroundPress: "#141414",
+  backgroundFocus: "#0A0A0A"
+};
+var brandTheme = (accent, extra = {}) => ({
+  ...darkBase,
+  accentBackground: accent,
+  accentColor: "#FFFFFF",
+  borderColorHover: accent,
+  colorHover: accent,
+  ...extra
+});
+var luxThemes = {
+  dark: darkBase,
+  dark_lux: brandTheme(LUX_BRAND.lux),
+  dark_zoo: brandTheme(LUX_BRAND.zoo),
+  dark_hanzo: brandTheme(LUX_BRAND.hanzo),
+  dark_pars: brandTheme(LUX_BRAND.pars, { accentColor: PARS_GOLD })
+};
+var config = gui.createGui({
+  ...v5.defaultConfig,
+  settings: {
+    ...v5.defaultConfig.settings,
+    onlyAllowShorthands: false
+  },
+  themes: {
+    ...v5.defaultConfig.themes,
+    ...luxThemes
+  }
+});
+var lux_config_default = config;
 var defaultQueryClient = new reactQuery.QueryClient({
   defaultOptions: { queries: { refetchOnWindowFocus: false, retry: 1, staleTime: 3e4 } }
 });
-var AppProvider = ({ children, queryClient }) => {
-  return /* @__PURE__ */ jsxRuntime.jsx(reactQuery.QueryClientProvider, { client: queryClient ?? defaultQueryClient, children });
+var FONT_BODY_RESET_ID = "lux-ui-font-body-reset";
+var FONT_BODY_RESET_CSS = "body .font_body{line-height:1.5}";
+var useFontBodyReset = () => {
+  React30__namespace.default.useInsertionEffect(() => {
+    if (typeof document === "undefined") return;
+    if (document.getElementById(FONT_BODY_RESET_ID)) return;
+    const style = document.createElement("style");
+    style.id = FONT_BODY_RESET_ID;
+    style.textContent = FONT_BODY_RESET_CSS;
+    document.head.appendChild(style);
+  }, []);
+};
+var AppProvider = ({
+  children,
+  queryClient,
+  defaultTheme = "dark_lux"
+}) => {
+  useFontBodyReset();
+  return /* @__PURE__ */ jsxRuntime.jsx(gui.GuiProvider, { config: lux_config_default, defaultTheme, children: /* @__PURE__ */ jsxRuntime.jsx(reactQuery.QueryClientProvider, { client: queryClient ?? defaultQueryClient, children }) });
 };
 function cn(...inputs) {
   return tailwindMerge.twMerge(clsx.clsx(inputs));
 }
 var IndicatorIcon = ({ className }) => /* @__PURE__ */ jsxRuntime.jsx("svg", { className, viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M7.5 15L12.5 10L7.5 5", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) });
-var AccordionRoot = React29__namespace.forwardRef(
+var AccordionRoot = React30__namespace.forwardRef(
   function AccordionRoot2(props, ref) {
     const {
       multiple: _multiple,
@@ -94,7 +148,7 @@ var AccordionRoot = React29__namespace.forwardRef(
       borderRadius: _borderRadius,
       ...rest
     } = props;
-    const handleValueChange = React29__namespace.useCallback(
+    const handleValueChange = React30__namespace.useCallback(
       (next) => {
         onValueChange?.({ value: next });
       },
@@ -122,7 +176,7 @@ var AccordionRoot = React29__namespace.forwardRef(
     );
   }
 );
-var AccordionItem = React29__namespace.forwardRef(
+var AccordionItem = React30__namespace.forwardRef(
   function AccordionItem2(props, ref) {
     const { className, as: _as, _first, _last, display: _display, ...rest } = props;
     return /* @__PURE__ */ jsxRuntime.jsx(
@@ -138,7 +192,7 @@ var AccordionItem = React29__namespace.forwardRef(
     );
   }
 );
-var AccordionItemTrigger = React29__namespace.forwardRef(function AccordionItemTrigger2(props, ref) {
+var AccordionItemTrigger = React30__namespace.forwardRef(function AccordionItemTrigger2(props, ref) {
   const {
     children,
     indicatorPlacement: indicatorPlacementProp,
@@ -203,7 +257,7 @@ var AccordionItemTrigger = React29__namespace.forwardRef(function AccordionItemT
     }
   ) }) });
 });
-var AccordionItemContent = React29__namespace.forwardRef(function AccordionItemContent2(props, ref) {
+var AccordionItemContent = React30__namespace.forwardRef(function AccordionItemContent2(props, ref) {
   const { className, children, pb: _pb, pr: _pr, pl: _pl, w: _w, display: _display, flexDir: _flexDir, rowGap: _rowGap, ...rest } = props;
   return /* @__PURE__ */ jsxRuntime.jsx(
     AccordionPrimitive__namespace.Content,
@@ -221,11 +275,11 @@ var AccordionItemContent = React29__namespace.forwardRef(function AccordionItemC
   );
 });
 function useAccordion(items) {
-  const [value, setValue] = React29__namespace.useState([]);
-  const onValueChange = React29__namespace.useCallback(({ value: value2 }) => {
+  const [value, setValue] = React30__namespace.useState([]);
+  const onValueChange = React30__namespace.useCallback(({ value: value2 }) => {
     setValue(value2);
   }, []);
-  const scrollToItemFromUrl = React29__namespace.useCallback(() => {
+  const scrollToItemFromUrl = React30__namespace.useCallback(() => {
     const hash = window.location.hash.replace("#", "");
     if (!hash) {
       return;
@@ -239,7 +293,7 @@ function useAccordion(items) {
       setValue([itemToScroll.id]);
     }
   }, [items]);
-  return React29__namespace.useMemo(() => {
+  return React30__namespace.useMemo(() => {
     return {
       value,
       onValueChange,
@@ -248,7 +302,7 @@ function useAccordion(items) {
   }, [value, onValueChange, scrollToItemFromUrl]);
 }
 var CLOSE_ICON_PATH = "M9.44 8.035a.791.791 0 0 0 1.12 0l3.802-3.803a.791.791 0 0 1 1.119 0l.287.287a.79.79 0 0 1 0 1.119L11.965 9.44a.79.79 0 0 0 0 1.118l3.803 3.803a.791.791 0 0 1 0 1.119l-.287.287a.791.791 0 0 1-1.119 0l-3.803-3.803a.79.79 0 0 0-1.118 0l-3.803 3.803a.79.79 0 0 1-1.119 0l-.287-.287a.791.791 0 0 1 0-1.119l3.803-3.803a.791.791 0 0 0 0-1.118L4.232 5.638a.791.791 0 0 1 0-1.119l.287-.287a.791.791 0 0 1 1.119 0L9.44 8.035Z";
-var CloseButtonFrame = core.styled(core.View, {
+var CloseButtonFrame = gui.styled(gui.View, {
   name: "LuxCloseButton",
   render: /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", "aria-label": "Close" }),
   role: "button",
@@ -282,7 +336,7 @@ var CLOSE_BUTTON_CLASSES = [
   "hover:text-[var(--hover-color,currentColor)]",
   "disabled:opacity-40"
 ].join(" ");
-var CloseButton = React29__namespace.forwardRef(function CloseButton2(props, ref) {
+var CloseButton = React30__namespace.forwardRef(function CloseButton2(props, ref) {
   const { variant: _variant, size: _size, className, children, ...rest } = props;
   return /* @__PURE__ */ jsxRuntime.jsx(
     CloseButtonFrame,
@@ -429,7 +483,7 @@ var SKELETON_CLASSES = [
   "bg-[length:200%_100%]"
 ].join(" ");
 var HIDE_BELOW_MAP = { lg: "lg:hidden", md: "md:hidden", sm: "sm:hidden" };
-var Skeleton = React29__namespace.forwardRef(
+var Skeleton = React30__namespace.forwardRef(
   function Skeleton2(props, ref) {
     const { loading = false, asChild, className, children, style: styleProp, as: Component = "div", ...allRest } = props;
     const shimStyle = shimToStyle(props);
@@ -438,10 +492,10 @@ var Skeleton = React29__namespace.forwardRef(
     const cls = hideBelowClass ? cn(className, hideBelowClass) : className;
     const htmlRest = stripShims(allRest);
     if (!loading) {
-      if (asChild && React29__namespace.isValidElement(children)) return children;
+      if (asChild && React30__namespace.isValidElement(children)) return children;
       return /* @__PURE__ */ jsxRuntime.jsx(Component, { ref, className: cls, style: mergedStyle, ...htmlRest, children });
     }
-    if (asChild && React29__namespace.isValidElement(children)) {
+    if (asChild && React30__namespace.isValidElement(children)) {
       return /* @__PURE__ */ jsxRuntime.jsx(
         Component,
         {
@@ -467,7 +521,7 @@ var Skeleton = React29__namespace.forwardRef(
     );
   }
 );
-var SkeletonCircle = React29__namespace.forwardRef(
+var SkeletonCircle = React30__namespace.forwardRef(
   function SkeletonCircle2(props, ref) {
     const { size = 40, loading = true, className, ...rest } = props;
     const dimension = typeof size === "number" ? `${size}px` : size;
@@ -483,7 +537,7 @@ var SkeletonCircle = React29__namespace.forwardRef(
     );
   }
 );
-var SkeletonText = React29__namespace.forwardRef(
+var SkeletonText = React30__namespace.forwardRef(
   function SkeletonText2(props, ref) {
     const { noOfLines = 3, loading = true, className, ...rest } = props;
     return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: cn("flex w-full flex-col gap-2", className), ...rest, children: Array.from({ length: noOfLines }).map((_, index) => /* @__PURE__ */ jsxRuntime.jsx(
@@ -513,7 +567,7 @@ var INDICATOR_SIZE_CLASSES = {
   sm: "w-5 h-5 my-0",
   md: "w-5 h-5 my-[2px]"
 };
-var Alert = React29__namespace.forwardRef(
+var Alert = React30__namespace.forwardRef(
   function Alert2(props, ref) {
     const {
       title,
@@ -538,7 +592,7 @@ var Alert = React29__namespace.forwardRef(
     if (_mb !== void 0) shimStyle.marginBottom = typeof _mb === "number" ? `${_mb * 4}px` : _mb;
     if (_mt !== void 0) shimStyle.marginTop = typeof _mt === "number" ? `${_mt * 4}px` : _mt;
     const alertStyle = Object.keys(shimStyle).length > 0 ? shimStyle : void 0;
-    const [isOpen, setIsOpen] = React29__namespace.useState(true);
+    const [isOpen, setIsOpen] = React30__namespace.useState(true);
     const resolvedSize = size ?? "md";
     const defaultIcon = /* @__PURE__ */ jsxRuntime.jsx(IndicatorIcon2, { className: "w-5 h-5" });
     const iconElement = (() => {
@@ -553,7 +607,7 @@ var Alert = React29__namespace.forwardRef(
         INDICATOR_SIZE_CLASSES[resolvedSize]
       ), children: icon || defaultIcon });
     })();
-    const handleClose = React29__namespace.useCallback(() => {
+    const handleClose = React30__namespace.useCallback(() => {
       setIsOpen(false);
       onClose?.();
     }, [onClose]);
@@ -629,11 +683,11 @@ var VARIANT_CLASSES = {
 };
 var DEFAULT_SIZE = "md";
 var DEFAULT_VARIANT = "subtle";
-var AvatarGroupContext = React29__namespace.createContext({});
+var AvatarGroupContext = React30__namespace.createContext({});
 function useAvatarGroupContext() {
-  return React29__namespace.useContext(AvatarGroupContext);
+  return React30__namespace.useContext(AvatarGroupContext);
 }
-var Avatar = React29__namespace.forwardRef(
+var Avatar = React30__namespace.forwardRef(
   function Avatar2(props, ref) {
     const group = useAvatarGroupContext();
     const {
@@ -683,7 +737,7 @@ var Avatar = React29__namespace.forwardRef(
     );
   }
 );
-var AvatarFallback = React29__namespace.forwardRef(
+var AvatarFallback = React30__namespace.forwardRef(
   function AvatarFallback2(props, ref) {
     const { name, icon, children, className, ...rest } = props;
     return /* @__PURE__ */ jsxRuntime.jsxs(
@@ -710,10 +764,10 @@ function getInitials(name) {
   const lastName = names.length > 1 ? names[names.length - 1] : "";
   return firstName && lastName ? `${firstName.charAt(0)}${lastName.charAt(0)}` : firstName.charAt(0);
 }
-var AvatarGroup = React29__namespace.forwardRef(
+var AvatarGroup = React30__namespace.forwardRef(
   function AvatarGroup2(props, ref) {
     const { size, variant, borderless, className, ...rest } = props;
-    const contextValue = React29__namespace.useMemo(
+    const contextValue = React30__namespace.useMemo(
       () => ({ size, variant, borderless }),
       [size, variant, borderless]
     );
@@ -729,11 +783,11 @@ var AvatarGroup = React29__namespace.forwardRef(
 );
 var LG_BREAKPOINT = 1024;
 function useIsMobile() {
-  const [isMobile, setIsMobile] = React29__namespace.useState(() => {
+  const [isMobile, setIsMobile] = React30__namespace.useState(() => {
     if (typeof window === "undefined") return false;
     return window.innerWidth < LG_BREAKPOINT;
   });
-  React29__namespace.useEffect(() => {
+  React30__namespace.useEffect(() => {
     const mql = window.matchMedia(`(max-width: ${LG_BREAKPOINT - 1}px)`);
     const handler = (e) => setIsMobile(e.matches);
     setIsMobile(mql.matches);
@@ -746,7 +800,7 @@ function mapPlacement(p) {
   if (!p) return void 0;
   return p;
 }
-var Tooltip = React29__namespace.forwardRef(
+var Tooltip = React30__namespace.forwardRef(
   function Tooltip2(props, ref) {
     const {
       showArrow: showArrowProp,
@@ -765,28 +819,28 @@ var Tooltip = React29__namespace.forwardRef(
       interactive,
       positioning
     } = props;
-    const [open, setOpen] = React29__namespace.useState(defaultOpen);
-    const timeoutRef = React29__namespace.useRef(null);
+    const [open, setOpen] = React30__namespace.useState(defaultOpen);
+    const timeoutRef = React30__namespace.useRef(null);
     const isMobile = useIsMobile();
-    const handleOpenChange = React29__namespace.useCallback((nextOpen) => {
+    const handleOpenChange = React30__namespace.useCallback((nextOpen) => {
       setOpen(nextOpen);
       onOpenChange?.({ open: nextOpen });
     }, [onOpenChange]);
-    const handleOpenChangeManual = React29__namespace.useCallback((nextOpen) => {
+    const handleOpenChangeManual = React30__namespace.useCallback((nextOpen) => {
       timeoutRef.current && window.clearTimeout(timeoutRef.current);
       timeoutRef.current = window.setTimeout(() => {
         setOpen(nextOpen);
         onOpenChange?.({ open: nextOpen });
       }, nextOpen ? openDelay : closeDelay);
     }, [closeDelay, openDelay, onOpenChange]);
-    const handleClickAway = React29__namespace.useCallback(() => {
+    const handleClickAway = React30__namespace.useCallback(() => {
       handleOpenChangeManual(false);
     }, [handleOpenChangeManual]);
     const triggerRef = usehooks.useClickAway(handleClickAway);
-    const handleTriggerClick = React29__namespace.useCallback(() => {
+    const handleTriggerClick = React30__namespace.useCallback(() => {
       handleOpenChangeManual(!open);
     }, [handleOpenChangeManual, open]);
-    const handleContentClick = React29__namespace.useCallback((event) => {
+    const handleContentClick = React30__namespace.useCallback((event) => {
       event.stopPropagation();
       if (interactive) {
         const closestLink = event.target?.closest("a");
@@ -795,7 +849,7 @@ var Tooltip = React29__namespace.forwardRef(
         }
       }
     }, [interactive, handleOpenChangeManual]);
-    React29__namespace.useEffect(() => {
+    React30__namespace.useEffect(() => {
       return () => {
         if (timeoutRef.current) {
           clearTimeout(timeoutRef.current);
@@ -808,8 +862,8 @@ var Tooltip = React29__namespace.forwardRef(
     const isPopover = variant === "popover";
     const placement = mapPlacement(positioning?.placement) ?? "top";
     const offset = positioning?.offset?.mainAxis ?? 4;
-    return /* @__PURE__ */ jsxRuntime.jsx(tooltip.TooltipGroup, { delay: openDelay, children: /* @__PURE__ */ jsxRuntime.jsxs(
-      tooltip.Tooltip,
+    return /* @__PURE__ */ jsxRuntime.jsx(gui.TooltipGroup, { delay: openDelay, children: /* @__PURE__ */ jsxRuntime.jsxs(
+      gui.Tooltip,
       {
         open,
         onOpenChange: handleOpenChange,
@@ -819,7 +873,7 @@ var Tooltip = React29__namespace.forwardRef(
         unstyled: true,
         children: [
           /* @__PURE__ */ jsxRuntime.jsx(
-            tooltip.Tooltip.Trigger,
+            gui.Tooltip.Trigger,
             {
               ref: open ? triggerRef : void 0,
               asChild: true,
@@ -829,7 +883,7 @@ var Tooltip = React29__namespace.forwardRef(
             }
           ),
           /* @__PURE__ */ jsxRuntime.jsxs(
-            tooltip.Tooltip.Content,
+            gui.Tooltip.Content,
             {
               ref,
               unstyled: true,
@@ -846,7 +900,7 @@ var Tooltip = React29__namespace.forwardRef(
               ...contentProps,
               children: [
                 showArrow && /* @__PURE__ */ jsxRuntime.jsx(
-                  tooltip.Tooltip.Arrow,
+                  gui.Tooltip.Arrow,
                   {
                     unstyled: true,
                     className: cn(
@@ -897,7 +951,7 @@ var COLOR_PALETTE_CLASSES = {
   bright_pink: "bg-badge-bright-pink-bg text-badge-bright-pink-fg"
 };
 var S2 = 4;
-var Badge = React29__namespace.default.forwardRef(
+var Badge = React30__namespace.default.forwardRef(
   function Badge2(props, ref) {
     const {
       loading,
@@ -956,7 +1010,7 @@ var Badge = React29__namespace.default.forwardRef(
     return badgeElement;
   }
 );
-var SpinnerFrame = core.styled(core.View, {
+var SpinnerFrame = gui.styled(gui.View, {
   name: "ButtonSpinner",
   render: /* @__PURE__ */ jsxRuntime.jsx("span", {}),
   width: 16,
@@ -980,7 +1034,7 @@ function Spinner({ className }) {
     }
   );
 }
-var ButtonFrame = core.styled(core.View, {
+var ButtonFrame = gui.styled(gui.View, {
   name: "LuxButton",
   render: /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button" }),
   role: "button",
@@ -1146,7 +1200,7 @@ function buildShimStyle(props) {
   if (props.borderTopRightRadius !== void 0) s.borderTopRightRadius = typeof props.borderTopRightRadius === "number" ? `${props.borderTopRightRadius}px` : props.borderTopRightRadius;
   return Object.keys(s).length > 0 ? s : void 0;
 }
-var Button = React29__namespace.forwardRef(
+var Button = React30__namespace.forwardRef(
   function Button2(props, ref) {
     const {
       className,
@@ -1248,7 +1302,7 @@ function buttonVariants(opts) {
   const s = opts?.size ?? "md";
   return [BASE_CLASSES2, VARIANT_CLASSES2[v] ?? "", SIZE_CLASSES4[s] ?? ""].filter(Boolean).join(" ");
 }
-var ButtonGroup = React29__namespace.forwardRef(
+var ButtonGroup = React30__namespace.forwardRef(
   function ButtonGroup2(props, ref) {
     const { className, ...rest } = props;
     return /* @__PURE__ */ jsxRuntime.jsx(
@@ -1262,7 +1316,7 @@ var ButtonGroup = React29__namespace.forwardRef(
     );
   }
 );
-var ButtonGroupRadio = React29__namespace.forwardRef(
+var ButtonGroupRadio = React30__namespace.forwardRef(
   function ButtonGroupRadio2(props, ref) {
     const {
       children,
@@ -1274,24 +1328,24 @@ var ButtonGroupRadio = React29__namespace.forwardRef(
       className,
       ...rest
     } = props;
-    const firstChildValue = React29__namespace.useMemo(() => {
+    const firstChildValue = React30__namespace.useMemo(() => {
       const firstChild = Array.isArray(children) ? children[0] : void 0;
       return typeof firstChild?.props.value === "string" ? firstChild.props.value : void 0;
     }, [children]);
-    const [value, setValue] = React29__namespace.useState(defaultValue ?? firstChildValue);
-    const handleItemClick = React29__namespace.useCallback((event) => {
+    const [value, setValue] = React30__namespace.useState(defaultValue ?? firstChildValue);
+    const handleItemClick = React30__namespace.useCallback((event) => {
       const v = event.currentTarget.value;
       setValue(v);
       onChange?.(v);
     }, [onChange]);
-    const clonedChildren = React29__namespace.Children.map(children, (child) => {
-      return React29__namespace.cloneElement(child, {
+    const clonedChildren = React30__namespace.Children.map(children, (child) => {
+      return React30__namespace.cloneElement(child, {
         onClick: handleItemClick,
         selected: value === child.props.value,
         variant
       });
     });
-    const childrenLength = React29__namespace.Children.count(children);
+    const childrenLength = React30__namespace.Children.count(children);
     return /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { loading, children: /* @__PURE__ */ jsxRuntime.jsx(
       "div",
       {
@@ -1311,11 +1365,11 @@ var ButtonGroupRadio = React29__namespace.forwardRef(
 );
 var NOOP = () => {
 };
-var CheckboxGroupContext = React29__namespace.createContext(null);
+var CheckboxGroupContext = React30__namespace.createContext(null);
 function useCheckboxGroupContext() {
-  return React29__namespace.useContext(CheckboxGroupContext);
+  return React30__namespace.useContext(CheckboxGroupContext);
 }
-var CheckboxGroupBase = React29__namespace.forwardRef(
+var CheckboxGroupBase = React30__namespace.forwardRef(
   function CheckboxGroup(props, ref) {
     const {
       children,
@@ -1327,10 +1381,10 @@ var CheckboxGroupBase = React29__namespace.forwardRef(
       className,
       ...rest
     } = props;
-    const [uncontrolledValue, setUncontrolledValue] = React29__namespace.useState(defaultValue ?? []);
+    const [uncontrolledValue, setUncontrolledValue] = React30__namespace.useState(defaultValue ?? []);
     const isControlled = controlledValue !== void 0;
     const value = isControlled ? controlledValue : uncontrolledValue;
-    const toggle = React29__namespace.useCallback(
+    const toggle = React30__namespace.useCallback(
       (itemValue) => {
         const next = value.includes(itemValue) ? value.filter((v) => v !== itemValue) : [...value, itemValue];
         if (!isControlled) {
@@ -1340,12 +1394,12 @@ var CheckboxGroupBase = React29__namespace.forwardRef(
       },
       [value, isControlled, onValueChange]
     );
-    React29__namespace.useEffect(() => {
+    React30__namespace.useEffect(() => {
       if (isControlled) {
         setUncontrolledValue(controlledValue);
       }
     }, [isControlled, controlledValue]);
-    const ctx = React29__namespace.useMemo(() => ({ value, toggle }), [value, toggle]);
+    const ctx = React30__namespace.useMemo(() => ({ value, toggle }), [value, toggle]);
     return /* @__PURE__ */ jsxRuntime.jsx(CheckboxGroupContext.Provider, { value: ctx, children: /* @__PURE__ */ jsxRuntime.jsx(
       "div",
       {
@@ -1403,7 +1457,7 @@ var IndeterminateIcon = ({ className }) => /* @__PURE__ */ jsxRuntime.jsx(
     children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M0 0H12V2H0V0Z", fill: "currentColor" })
   }
 );
-var CheckboxBase = React29__namespace.forwardRef(
+var CheckboxBase = React30__namespace.forwardRef(
   function Checkbox(props, ref) {
     const {
       icon,
@@ -1424,8 +1478,8 @@ var CheckboxBase = React29__namespace.forwardRef(
       ...rest
     } = props;
     const group = useCheckboxGroupContext();
-    const hiddenInputRef = React29__namespace.useRef(null);
-    const setHiddenInputRef = React29__namespace.useCallback(
+    const hiddenInputRef = React30__namespace.useRef(null);
+    const setHiddenInputRef = React30__namespace.useCallback(
       (node) => {
         hiddenInputRef.current = node;
         if (typeof ref === "function") {
@@ -1438,7 +1492,7 @@ var CheckboxBase = React29__namespace.forwardRef(
     );
     const isInGroup = group !== null && value !== void 0;
     const groupChecked = isInGroup ? group.value.includes(value) : void 0;
-    const [internalChecked, setInternalChecked] = React29__namespace.useState(
+    const [internalChecked, setInternalChecked] = React30__namespace.useState(
       defaultChecked ?? false
     );
     const isControlled = checkedProp !== void 0 || isInGroup;
@@ -1450,7 +1504,7 @@ var CheckboxBase = React29__namespace.forwardRef(
     } else {
       checkedState = internalChecked;
     }
-    const handleCheckedChange = React29__namespace.useCallback(
+    const handleCheckedChange = React30__namespace.useCallback(
       (nextChecked) => {
         if (readOnly) return;
         if (!isControlled) {
@@ -1614,7 +1668,7 @@ function resolveSpacing(v) {
   }
   return void 0;
 }
-var Link = React29__namespace.default.forwardRef(
+var Link = React30__namespace.default.forwardRef(
   function Link2(props, ref) {
     const {
       external,
@@ -1703,7 +1757,7 @@ var Link = React29__namespace.default.forwardRef(
     ) });
   }
 );
-var LinkBox = React29__namespace.default.forwardRef(
+var LinkBox = React30__namespace.default.forwardRef(
   function LinkBox2(props, ref) {
     const { className, ...rest } = props;
     return /* @__PURE__ */ jsxRuntime.jsx(
@@ -1716,7 +1770,7 @@ var LinkBox = React29__namespace.default.forwardRef(
     );
   }
 );
-var LinkOverlay = React29__namespace.default.forwardRef(
+var LinkOverlay = React30__namespace.default.forwardRef(
   function LinkOverlay2(props, ref) {
     const {
       children,
@@ -1797,8 +1851,8 @@ var LinkOverlay = React29__namespace.default.forwardRef(
   }
 );
 function useUpdateEffect(effect, deps) {
-  const isFirstMount = React29__namespace.default.useRef(true);
-  React29__namespace.default.useEffect(() => {
+  const isFirstMount = React30__namespace.default.useRef(true);
+  React30__namespace.default.useEffect(() => {
     if (isFirstMount.current) {
       isFirstMount.current = false;
       return;
@@ -1815,8 +1869,8 @@ function scrollToElement(id) {
 var CUT_ID = "CollapsibleDetails";
 var CollapsibleDetails = (props) => {
   const { children, id = CUT_ID, onClick, isExpanded: isExpandedProp = false, text: textProp, loading, noScroll, ...rest } = props;
-  const [isExpanded, setIsExpanded] = React29__namespace.default.useState(isExpandedProp);
-  const handleClick = React29__namespace.default.useCallback((event) => {
+  const [isExpanded, setIsExpanded] = React30__namespace.default.useState(isExpandedProp);
+  const handleClick = React30__namespace.default.useCallback((event) => {
     setIsExpanded((flag) => !flag);
     if (!noScroll) {
       scrollToElement(id);
@@ -1847,11 +1901,11 @@ var CollapsibleDetails = (props) => {
 var CollapsibleList = (props) => {
   const CUT_LENGTH = 3;
   const { items, renderItem, triggerProps, cutLength = CUT_LENGTH, text: textProp, defaultExpanded = false, className, ...rest } = props;
-  const [isExpanded, setIsExpanded] = React29__namespace.default.useState(defaultExpanded);
-  React29__namespace.default.useEffect(() => {
+  const [isExpanded, setIsExpanded] = React30__namespace.default.useState(defaultExpanded);
+  React30__namespace.default.useEffect(() => {
     setIsExpanded(defaultExpanded);
   }, [defaultExpanded]);
-  const handleToggle = React29__namespace.default.useCallback(() => {
+  const handleToggle = React30__namespace.default.useCallback(() => {
     setIsExpanded((flag) => !flag);
   }, []);
   const text = isExpanded ? textProp?.[1] ?? "Hide" : textProp?.[0] ?? "Show all";
@@ -1868,10 +1922,10 @@ var CollapsibleList = (props) => {
     ) })
   ] }) });
 };
-var ColorModeContext = React29__namespace.createContext(void 0);
+var ColorModeContext = React30__namespace.createContext(void 0);
 function ColorModeProvider(props) {
   const { children, defaultTheme = "light", value: controlledValue, onValueChange } = props;
-  const [internalMode, setInternalMode] = React29__namespace.useState(() => {
+  const [internalMode, setInternalMode] = React30__namespace.useState(() => {
     if (controlledValue === "dark" || controlledValue === "light") {
       return controlledValue;
     }
@@ -1881,7 +1935,7 @@ function ColorModeProvider(props) {
     return defaultTheme === "dark" ? "dark" : "light";
   });
   const colorMode = controlledValue === "dark" || controlledValue === "light" ? controlledValue : internalMode;
-  const setColorMode = React29__namespace.useCallback((mode) => {
+  const setColorMode = React30__namespace.useCallback((mode) => {
     const resolved = mode === "dark" ? "dark" : "light";
     setInternalMode(resolved);
     onValueChange?.(resolved);
@@ -1890,19 +1944,19 @@ function ColorModeProvider(props) {
       document.documentElement.classList.toggle("light", resolved === "light");
     }
   }, [onValueChange]);
-  const toggleColorMode = React29__namespace.useCallback(() => {
+  const toggleColorMode = React30__namespace.useCallback(() => {
     setColorMode(colorMode === "dark" ? "light" : "dark");
   }, [colorMode, setColorMode]);
-  const ctx = React29__namespace.useMemo(
+  const ctx = React30__namespace.useMemo(
     () => ({ colorMode, setColorMode, toggleColorMode }),
     [colorMode, setColorMode, toggleColorMode]
   );
   return /* @__PURE__ */ jsxRuntime.jsx(ColorModeContext.Provider, { value: ctx, children });
 }
 function useColorMode() {
-  const ctx = React29__namespace.useContext(ColorModeContext);
+  const ctx = React30__namespace.useContext(ColorModeContext);
   if (!ctx) {
-    const [mode, setMode] = React29__namespace.useState(() => {
+    const [mode, setMode] = React30__namespace.useState(() => {
       if (typeof document !== "undefined" && document.documentElement.classList.contains("dark")) {
         return "dark";
       }
@@ -1946,9 +2000,9 @@ function BackToButton({ onClick }) {
     }
   );
 }
-var DialogSizeContext = React29__namespace.createContext({ size: "md" });
+var DialogSizeContext = React30__namespace.createContext({ size: "md" });
 function useDialogSizeContext() {
-  return React29__namespace.useContext(DialogSizeContext);
+  return React30__namespace.useContext(DialogSizeContext);
 }
 var CONTENT_SIZE_MAP = {
   sm: "max-w-[400px]",
@@ -1980,15 +2034,15 @@ var DialogRoot = ({
   modal = true
   // motionPreset is intentionally unused -- kept for API compat
 }) => {
-  const handleOpenChange = React29__namespace.useCallback(
+  const handleOpenChange = React30__namespace.useCallback(
     (nextOpen) => {
       onOpenChange?.({ open: nextOpen });
     },
     [onOpenChange]
   );
-  const ctx = React29__namespace.useMemo(() => ({ size }), [size]);
+  const ctx = React30__namespace.useMemo(() => ({ size }), [size]);
   return /* @__PURE__ */ jsxRuntime.jsx(DialogSizeContext.Provider, { value: ctx, children: /* @__PURE__ */ jsxRuntime.jsx(
-    dialog.Dialog,
+    gui.Dialog,
     {
       open,
       defaultOpen,
@@ -1998,7 +2052,7 @@ var DialogRoot = ({
     }
   ) });
 };
-var DialogContent = React29__namespace.forwardRef(function DialogContent2(props, ref) {
+var DialogContent = React30__namespace.forwardRef(function DialogContent2(props, ref) {
   const {
     children,
     portalled: _portalled = true,
@@ -2014,9 +2068,9 @@ var DialogContent = React29__namespace.forwardRef(function DialogContent2(props,
     ..._paddingTop !== void 0 ? { paddingTop: typeof _paddingTop === "number" ? `${_paddingTop * 4}px` : _paddingTop } : {}
   };
   const { size } = useDialogSizeContext();
-  return /* @__PURE__ */ jsxRuntime.jsxs(dialog.Dialog.Portal, { children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs(gui.Dialog.Portal, { children: [
     backdrop && /* @__PURE__ */ jsxRuntime.jsx(
-      dialog.Dialog.Overlay,
+      gui.Dialog.Overlay,
       {
         unstyled: true,
         className: "fixed inset-0 z-[1400] bg-black/80"
@@ -2031,7 +2085,7 @@ var DialogContent = React29__namespace.forwardRef(function DialogContent2(props,
           "overflow-hidden"
         ),
         children: /* @__PURE__ */ jsxRuntime.jsx(
-          dialog.Dialog.Content,
+          gui.Dialog.Content,
           {
             ref,
             unstyled: true,
@@ -2055,11 +2109,11 @@ var DialogContent = React29__namespace.forwardRef(function DialogContent2(props,
     )
   ] });
 });
-var DialogCloseTrigger = React29__namespace.forwardRef(function DialogCloseTrigger2(props, ref) {
+var DialogCloseTrigger = React30__namespace.forwardRef(function DialogCloseTrigger2(props, ref) {
   const { className, ...rest } = props;
-  return /* @__PURE__ */ jsxRuntime.jsx(dialog.Dialog.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(CloseButton, { ref, className, ...rest, children: props.children }) });
+  return /* @__PURE__ */ jsxRuntime.jsx(gui.Dialog.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(CloseButton, { ref, className, ...rest, children: props.children }) });
 });
-var DialogHeader = React29__namespace.forwardRef(function DialogHeader2(props, ref) {
+var DialogHeader = React30__namespace.forwardRef(function DialogHeader2(props, ref) {
   const { startElement: startElementProp, onBackToClick, className, children, ...rest } = props;
   const startElement = startElementProp ?? (onBackToClick ? /* @__PURE__ */ jsxRuntime.jsx(BackToButton, { onClick: onBackToClick }) : void 0);
   return /* @__PURE__ */ jsxRuntime.jsxs(
@@ -2074,7 +2128,7 @@ var DialogHeader = React29__namespace.forwardRef(function DialogHeader2(props, r
       children: [
         startElement,
         /* @__PURE__ */ jsxRuntime.jsx(
-          dialog.Dialog.Title,
+          gui.Dialog.Title,
           {
             unstyled: true,
             className: cn(
@@ -2089,7 +2143,7 @@ var DialogHeader = React29__namespace.forwardRef(function DialogHeader2(props, r
     }
   );
 });
-var DialogBody = React29__namespace.forwardRef(function DialogBody2({ className, pt, display, flexDir, style: styleProp, ...props }, ref) {
+var DialogBody = React30__namespace.forwardRef(function DialogBody2({ className, pt, display, flexDir, style: styleProp, ...props }, ref) {
   const bodyStyle = {
     ...styleProp,
     ...pt !== void 0 ? { paddingTop: typeof pt === "number" ? `${pt * 4}px` : pt } : {},
@@ -2106,7 +2160,7 @@ var DialogBody = React29__namespace.forwardRef(function DialogBody2({ className,
     }
   );
 });
-var DialogFooter = React29__namespace.forwardRef(function DialogFooter2({ className, ...props }, ref) {
+var DialogFooter = React30__namespace.forwardRef(function DialogFooter2({ className, ...props }, ref) {
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {
@@ -2116,13 +2170,13 @@ var DialogFooter = React29__namespace.forwardRef(function DialogFooter2({ classN
     }
   );
 });
-var DialogBackdrop = dialog.Dialog.Overlay;
-var DialogTitle = dialog.Dialog.Title;
-var DialogDescription = dialog.Dialog.Description;
-var DialogTrigger = dialog.Dialog.Trigger;
-var DialogActionTrigger = dialog.Dialog.Close;
-var DrawerPlacementContext = React29__namespace.createContext("right");
-var DrawerSizeContext = React29__namespace.createContext("md");
+var DialogBackdrop = gui.Dialog.Overlay;
+var DialogTitle = gui.Dialog.Title;
+var DialogDescription = gui.Dialog.Description;
+var DialogTrigger = gui.Dialog.Trigger;
+var DialogActionTrigger = gui.Dialog.Close;
+var DrawerPlacementContext = React30__namespace.createContext("right");
+var DrawerSizeContext = React30__namespace.createContext("md");
 var DrawerRoot = (props) => {
   const {
     children,
@@ -2133,7 +2187,7 @@ var DrawerRoot = (props) => {
     modal = true,
     size = "md"
   } = props;
-  const handleOpenChange = React29__namespace.useCallback((nextOpen) => {
+  const handleOpenChange = React30__namespace.useCallback((nextOpen) => {
     onOpenChange?.({ open: nextOpen });
   }, [onOpenChange]);
   return /* @__PURE__ */ jsxRuntime.jsx(DrawerPlacementContext.Provider, { value: placement, children: /* @__PURE__ */ jsxRuntime.jsx(DrawerSizeContext.Provider, { value: size, children: /* @__PURE__ */ jsxRuntime.jsx(
@@ -2175,11 +2229,11 @@ var SIZE_CLASSES6 = {
   top: { xs: "h-40", sm: "h-60", md: "h-80", lg: "h-96", xl: "h-[480px]", full: "h-screen" },
   bottom: { xs: "h-40", sm: "h-60", md: "h-80", lg: "h-96", xl: "h-[480px]", full: "h-screen" }
 };
-var DrawerContent = React29__namespace.forwardRef(
+var DrawerContent = React30__namespace.forwardRef(
   function DrawerContent2(props, ref) {
     const { children, portalled = true, portalRef, offset: _offset, backdrop = true, className, ...rest } = props;
-    const placement = React29__namespace.useContext(DrawerPlacementContext);
-    const size = React29__namespace.useContext(DrawerSizeContext);
+    const placement = React30__namespace.useContext(DrawerPlacementContext);
+    const size = React30__namespace.useContext(DrawerSizeContext);
     const content = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
       backdrop && /* @__PURE__ */ jsxRuntime.jsx(
         RadixDialog__namespace.Overlay,
@@ -2212,7 +2266,7 @@ var DrawerContent = React29__namespace.forwardRef(
     return content;
   }
 );
-var DrawerCloseTrigger = React29__namespace.forwardRef(function DrawerCloseTrigger2(props, ref) {
+var DrawerCloseTrigger = React30__namespace.forwardRef(function DrawerCloseTrigger2(props, ref) {
   return /* @__PURE__ */ jsxRuntime.jsx(RadixDialog__namespace.Close, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
     CloseButton,
     {
@@ -2226,17 +2280,17 @@ var DrawerTrigger = (props) => {
   const { asChild = true, ...rest } = props;
   return /* @__PURE__ */ jsxRuntime.jsx(RadixDialog__namespace.Trigger, { asChild, ...rest });
 };
-var DrawerHeader = React29__namespace.forwardRef(
+var DrawerHeader = React30__namespace.forwardRef(
   function DrawerHeader2({ className, ...props }, ref) {
     return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: cn("flex flex-col gap-1.5 p-6 pb-0", className), ...props });
   }
 );
-var DrawerBody = React29__namespace.forwardRef(
+var DrawerBody = React30__namespace.forwardRef(
   function DrawerBody2({ className, ...props }, ref) {
     return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: cn("flex-1 overflow-auto p-6", className), ...props });
   }
 );
-var DrawerFooter = React29__namespace.forwardRef(
+var DrawerFooter = React30__namespace.forwardRef(
   function DrawerFooter2({ className, ...props }, ref) {
     return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: cn("flex items-center justify-end gap-2 p-6 pt-0", className), ...props });
   }
@@ -2249,7 +2303,7 @@ function upperFirst(str) {
   return str.charAt(0).toUpperCase() + str.slice(1);
 }
 var ICONS = {};
-var EmptyState = React29__namespace.forwardRef(
+var EmptyState = React30__namespace.forwardRef(
   function EmptyState2(props, ref) {
     const { title, description, term, type = "query", icon, children, className, ...rest } = props;
     const titleContent = (() => {
@@ -2309,7 +2363,7 @@ function getComponentDisplayName(type) {
   if ("displayName" in type) return type.displayName;
   return void 0;
 }
-var Field = React29__namespace.forwardRef(
+var Field = React30__namespace.forwardRef(
   function Field2(props, ref) {
     const {
       label,
@@ -2361,14 +2415,14 @@ var Field = React29__namespace.forwardRef(
         }
       );
       const helperTextElement = helperText ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-1.5 text-xs text-[var(--color-text-secondary,theme(colors.gray.400))]", children: helperText }) : null;
-      const child2 = React29__namespace.Children.only(children);
+      const child2 = React30__namespace.Children.only(children);
       const isInputGroup = getComponentDisplayName(child2.type) === "InputGroup";
       if (isInputGroup) {
-        const inputElement2 = React29__namespace.cloneElement(
-          React29__namespace.Children.only(child2.props.children),
+        const inputElement2 = React30__namespace.cloneElement(
+          React30__namespace.Children.only(child2.props.children),
           injectedProps2
         );
-        const groupInputElement = React29__namespace.cloneElement(
+        const groupInputElement = React30__namespace.cloneElement(
           child2,
           {},
           inputElement2,
@@ -2391,7 +2445,7 @@ var Field = React29__namespace.forwardRef(
           }
         );
       }
-      const inputElement = React29__namespace.cloneElement(child2, injectedProps2);
+      const inputElement = React30__namespace.cloneElement(child2, injectedProps2);
       return /* @__PURE__ */ jsxRuntime.jsxs(
         "div",
         {
@@ -2413,8 +2467,8 @@ var Field = React29__namespace.forwardRef(
     const injectedProps = {
       size
     };
-    const child = React29__namespace.Children.only(children);
-    const clonedChild = React29__namespace.cloneElement(child, injectedProps);
+    const child = React30__namespace.Children.only(children);
+    const clonedChild = React30__namespace.cloneElement(child, injectedProps);
     return /* @__PURE__ */ jsxRuntime.jsxs(
       "div",
       {
@@ -2457,7 +2511,7 @@ var LEVEL_CLASSES = {
   "3": "text-[14px] leading-[20px] font-semibold lg:text-[18px] lg:leading-[24px] lg:font-medium"
 };
 var BASE_CLASSES4 = "font-heading text-heading";
-var Heading = React29__namespace.default.forwardRef(
+var Heading = React30__namespace.default.forwardRef(
   function Heading2({ level, className, mb, size: _size, style: styleProp, ...rest }, ref) {
     const Tag3 = level ? LEVEL_TAG[level] : "h2";
     const levelClasses = level ? LEVEL_CLASSES[level] : void 0;
@@ -2473,7 +2527,7 @@ var Heading = React29__namespace.default.forwardRef(
     );
   }
 );
-var IconButtonFrame = core.styled(core.View, {
+var IconButtonFrame = gui.styled(gui.View, {
   name: "LuxIconButton",
   render: /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button" }),
   role: "button",
@@ -2543,7 +2597,7 @@ var ICON_SIZE_CLASSES = {
   md: "[&_svg]:size-5"
 };
 var SP2 = 4;
-var IconButton = React29__namespace.forwardRef(
+var IconButton = React30__namespace.forwardRef(
   function IconButton2(props, ref) {
     const {
       size,
@@ -2594,7 +2648,7 @@ var IconButton = React29__namespace.forwardRef(
         ref,
         size,
         disabled: !loadingSkeleton && (loading || disabled) || void 0,
-        render: _as ? React29__namespace.createElement(_as) : void 0,
+        render: _as ? React30__namespace.createElement(_as) : void 0,
         className: combinedClassName,
         style: mergedStyle,
         ...expanded ? { "data-expanded": true } : {},
@@ -2765,31 +2819,31 @@ function extractStyleProps(props) {
   }
   return { styleProps, rest };
 }
-var Image2 = React29__namespace.default.forwardRef(
+var Image2 = React30__namespace.default.forwardRef(
   function Image3(props, ref) {
     const { fallback, src, onLoad, onError, skeletonWidth, skeletonHeight, alt, className, style: styleProp, ...allRest } = props;
     const { styleProps, rest: extraProps } = extractStyleProps(allRest);
-    const [loading, setLoading] = React29__namespace.default.useState(true);
-    const [error, setError] = React29__namespace.default.useState(false);
-    const handleLoadError = React29__namespace.default.useCallback((event) => {
+    const [loading, setLoading] = React30__namespace.default.useState(true);
+    const [error, setError] = React30__namespace.default.useState(false);
+    const handleLoadError = React30__namespace.default.useCallback((event) => {
       setError(true);
       setLoading(false);
       onError?.(event);
     }, [onError]);
-    const handleLoadSuccess = React29__namespace.default.useCallback((event) => {
+    const handleLoadSuccess = React30__namespace.default.useCallback((event) => {
       setLoading(false);
       onLoad?.(event);
     }, [onLoad]);
     const passthroughProps = allRest;
     if (!src && fallback) {
-      if (React29__namespace.default.isValidElement(fallback)) {
-        return React29__namespace.default.cloneElement(fallback, passthroughProps);
+      if (React30__namespace.default.isValidElement(fallback)) {
+        return React30__namespace.default.cloneElement(fallback, passthroughProps);
       }
       return fallback;
     }
     if (error) {
-      if (React29__namespace.default.isValidElement(fallback)) {
-        return React29__namespace.default.cloneElement(fallback, passthroughProps);
+      if (React30__namespace.default.isValidElement(fallback)) {
+        return React30__namespace.default.cloneElement(fallback, passthroughProps);
       }
       return fallback;
     }
@@ -2845,14 +2899,22 @@ var INPUT_VARIANT_CLASSES = {
   filled: "border-0 bg-[var(--color-input-filled-bg,theme(colors.gray.100))]",
   unstyled: "border-0 bg-transparent p-0 h-auto"
 };
-var Input = React29__namespace.default.forwardRef(
-  ({ size = "md", variant = "outline", className, ...rest }, ref) => {
+var Input = React30__namespace.default.forwardRef(
+  ({ size = "md", variant = "outline", className, onChange, onChangeText, ...rest }, ref) => {
+    const handleChange = React30__namespace.default.useCallback(
+      (event) => {
+        onChange?.(event);
+        onChangeText?.(event.target.value);
+      },
+      [onChange, onChangeText]
+    );
     return /* @__PURE__ */ jsxRuntime.jsx(
       "input",
       {
         ref,
         className: cn(INPUT_BASE, INPUT_SIZE_CLASSES[size], INPUT_VARIANT_CLASSES[variant], className),
-        ...rest
+        ...rest,
+        onChange: handleChange
       }
     );
   }
@@ -2863,7 +2925,7 @@ function getComponentDisplayName2(type) {
   if ("displayName" in type) return type.displayName;
   return void 0;
 }
-var InputGroup = React29__namespace.forwardRef(
+var InputGroup = React30__namespace.forwardRef(
   function InputGroup2(props, ref) {
     const {
       startElement,
@@ -2876,11 +2938,11 @@ var InputGroup = React29__namespace.forwardRef(
       className,
       ...rest
     } = props;
-    const startElementRef = React29__namespace.useRef(null);
-    const endElementRef = React29__namespace.useRef(null);
-    const groupRef = React29__namespace.useRef(null);
-    const [inlinePaddings, setInlinePaddings] = React29__namespace.useState();
-    const calculateInlinePaddings = React29__namespace.useCallback(() => {
+    const startElementRef = React30__namespace.useRef(null);
+    const endElementRef = React30__namespace.useRef(null);
+    const groupRef = React30__namespace.useRef(null);
+    const [inlinePaddings, setInlinePaddings] = React30__namespace.useState();
+    const calculateInlinePaddings = React30__namespace.useCallback(() => {
       const startWidth = startElementRef.current?.getBoundingClientRect().width ?? 0;
       const endWidth = endElementRef.current?.getBoundingClientRect().width ?? 0;
       setInlinePaddings({
@@ -2888,7 +2950,7 @@ var InputGroup = React29__namespace.forwardRef(
         end: endWidth
       });
     }, []);
-    React29__namespace.useEffect(() => {
+    React30__namespace.useEffect(() => {
       if (!groupRef.current) return;
       let timeoutId;
       const intersectionObserver = new IntersectionObserver(
@@ -2908,7 +2970,7 @@ var InputGroup = React29__namespace.forwardRef(
         }
       };
     }, [calculateInlinePaddings]);
-    React29__namespace.useEffect(() => {
+    React30__namespace.useEffect(() => {
       calculateInlinePaddings();
       const resizeHandler = esToolkit.debounce(calculateInlinePaddings, 300);
       const resizeObserver = new ResizeObserver(resizeHandler);
@@ -2919,7 +2981,7 @@ var InputGroup = React29__namespace.forwardRef(
         resizeObserver.disconnect();
       };
     }, [calculateInlinePaddings]);
-    const combinedRef = React29__namespace.useCallback((node) => {
+    const combinedRef = React30__namespace.useCallback((node) => {
       groupRef.current = node;
       if (typeof ref === "function") {
         ref(node);
@@ -2948,11 +3010,11 @@ var InputGroup = React29__namespace.forwardRef(
               children: startElement
             }
           ),
-          React29__namespace.Children.map(children, (child) => {
+          React30__namespace.Children.map(children, (child) => {
             if (getComponentDisplayName2(child.type) !== "FieldInput") {
               return child;
             }
-            return React29__namespace.cloneElement(child, {
+            return React30__namespace.cloneElement(child, {
               ...startElement && { ps: startOffset ?? (inlinePaddings?.start ? `${inlinePaddings.start}px` : void 0) },
               ...endElement && { pe: endOffset ?? (inlinePaddings?.end ? `${inlinePaddings.end}px` : void 0) },
               // hide input value and placeholder for the first render
@@ -2993,7 +3055,7 @@ function parsePlacement(placement) {
   }
   return { side, align };
 }
-var PositioningContext = React29__namespace.createContext({
+var PositioningContext = React30__namespace.createContext({
   side: "bottom",
   align: "start",
   sideOffset: 4,
@@ -3023,13 +3085,13 @@ var MenuRoot = (props) => {
     }
   };
   const { side, align } = parsePlacement(mergedPositioning.placement);
-  const positioningValue = React29__namespace.useMemo(() => ({
+  const positioningValue = React30__namespace.useMemo(() => ({
     side,
     align,
     sideOffset: mergedPositioning.offset?.mainAxis ?? 4,
     alignOffset: mergedPositioning.offset?.crossAxis ?? 0
   }), [side, align, mergedPositioning.offset?.mainAxis, mergedPositioning.offset?.crossAxis]);
-  const handleOpenChange = React29__namespace.useCallback((isOpen) => {
+  const handleOpenChange = React30__namespace.useCallback((isOpen) => {
     onOpenChange?.({ open: isOpen });
   }, [onOpenChange]);
   return /* @__PURE__ */ jsxRuntime.jsx(PositioningContext.Provider, { value: positioningValue, children: /* @__PURE__ */ jsxRuntime.jsx(
@@ -3043,13 +3105,13 @@ var MenuRoot = (props) => {
     }
   ) });
 };
-var MenuTrigger = React29__namespace.forwardRef(function MenuTrigger2(props, ref) {
+var MenuTrigger = React30__namespace.forwardRef(function MenuTrigger2(props, ref) {
   const { asChild = false, ...rest } = props;
   return /* @__PURE__ */ jsxRuntime.jsx(DropdownMenu__namespace.Trigger, { asChild, ref, ...rest });
 });
-var MenuContent = React29__namespace.forwardRef(function MenuContent2(props, ref) {
+var MenuContent = React30__namespace.forwardRef(function MenuContent2(props, ref) {
   const { portalled = true, portalRef, className, zIndex, minW, style, ...rest } = props;
-  const positioning = React29__namespace.useContext(PositioningContext);
+  const positioning = React30__namespace.useContext(PositioningContext);
   const mergedStyle = {
     ...style,
     ...zIndex !== void 0 ? { zIndex: typeof zIndex === "string" ? `var(--z-index-${zIndex}, ${zIndex})` : zIndex } : {},
@@ -3084,7 +3146,7 @@ var MenuContent = React29__namespace.forwardRef(function MenuContent2(props, ref
   }
   return /* @__PURE__ */ jsxRuntime.jsx(DropdownMenu__namespace.Portal, { container: portalRef?.current ?? void 0, children: content });
 });
-var MenuItem = React29__namespace.forwardRef(function MenuItem2(props, ref) {
+var MenuItem = React30__namespace.forwardRef(function MenuItem2(props, ref) {
   const { className, value: _value, asChild, closeOnSelect: _closeOnSelect, disabled, children, onClick, ...rest } = props;
   return /* @__PURE__ */ jsxRuntime.jsx(
     DropdownMenu__namespace.Item,
@@ -3106,11 +3168,11 @@ var MenuItem = React29__namespace.forwardRef(function MenuItem2(props, ref) {
     }
   );
 });
-var MenuItemText = React29__namespace.forwardRef(function MenuItemText2(props, ref) {
+var MenuItemText = React30__namespace.forwardRef(function MenuItemText2(props, ref) {
   const { className, ...rest } = props;
   return /* @__PURE__ */ jsxRuntime.jsx("span", { ref, className: cn("flex-1", className), ...rest });
 });
-React29__namespace.forwardRef(function MenuItemCommand2(props, ref) {
+React30__namespace.forwardRef(function MenuItemCommand2(props, ref) {
   const { className, ...rest } = props;
   return /* @__PURE__ */ jsxRuntime.jsx(
     "span",
@@ -3121,7 +3183,7 @@ React29__namespace.forwardRef(function MenuItemCommand2(props, ref) {
     }
   );
 });
-var MenuSeparator = React29__namespace.forwardRef(function MenuSeparator2(props, ref) {
+var MenuSeparator = React30__namespace.forwardRef(function MenuSeparator2(props, ref) {
   const { className, ...rest } = props;
   return /* @__PURE__ */ jsxRuntime.jsx(
     DropdownMenu__namespace.Separator,
@@ -3132,14 +3194,14 @@ var MenuSeparator = React29__namespace.forwardRef(function MenuSeparator2(props,
     }
   );
 });
-var MenuItemGroup = React29__namespace.forwardRef(function MenuItemGroup2(props, ref) {
+var MenuItemGroup = React30__namespace.forwardRef(function MenuItemGroup2(props, ref) {
   const { title, children, className, ...rest } = props;
   return /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenu__namespace.Group, { ref, className, ...rest, children: [
     title && /* @__PURE__ */ jsxRuntime.jsx(DropdownMenu__namespace.Label, { className: "px-2 py-1.5 text-xs font-semibold select-none opacity-60", children: title }),
     children
   ] });
 });
-var MenuArrow = React29__namespace.forwardRef(function MenuArrow2(props, ref) {
+var MenuArrow = React30__namespace.forwardRef(function MenuArrow2(props, ref) {
   const { className, ...rest } = props;
   return /* @__PURE__ */ jsxRuntime.jsx(
     DropdownMenu__namespace.Arrow,
@@ -3150,7 +3212,7 @@ var MenuArrow = React29__namespace.forwardRef(function MenuArrow2(props, ref) {
     }
   );
 });
-var MenuCheckboxItem = React29__namespace.forwardRef(function MenuCheckboxItem2(props, ref) {
+var MenuCheckboxItem = React30__namespace.forwardRef(function MenuCheckboxItem2(props, ref) {
   const { className, children, checked, onCheckedChange, onClick, ...rest } = props;
   return /* @__PURE__ */ jsxRuntime.jsxs(
     DropdownMenu__namespace.CheckboxItem,
@@ -3174,7 +3236,7 @@ var MenuCheckboxItem = React29__namespace.forwardRef(function MenuCheckboxItem2(
     }
   );
 });
-var MenuRadioItemGroup = React29__namespace.forwardRef(function MenuRadioItemGroup2(props, ref) {
+var MenuRadioItemGroup = React30__namespace.forwardRef(function MenuRadioItemGroup2(props, ref) {
   const { value, onValueChange, ...rest } = props;
   return /* @__PURE__ */ jsxRuntime.jsx(
     DropdownMenu__namespace.RadioGroup,
@@ -3186,7 +3248,7 @@ var MenuRadioItemGroup = React29__namespace.forwardRef(function MenuRadioItemGro
     }
   );
 });
-var MenuRadioItem = React29__namespace.forwardRef(function MenuRadioItem2(props, ref) {
+var MenuRadioItem = React30__namespace.forwardRef(function MenuRadioItem2(props, ref) {
   const { className, children, value, onClick, ...rest } = props;
   const { value: _v, ...radixRest } = rest;
   return /* @__PURE__ */ jsxRuntime.jsxs(
@@ -3209,11 +3271,11 @@ var MenuRadioItem = React29__namespace.forwardRef(function MenuRadioItem2(props,
     }
   );
 });
-React29__namespace.forwardRef(function MenuContextTrigger2(props, ref) {
+React30__namespace.forwardRef(function MenuContextTrigger2(props, ref) {
   const { asChild: _asChild, ...rest } = props;
   return /* @__PURE__ */ jsxRuntime.jsx("span", { ref, ...rest });
 });
-var MenuTriggerItem = React29__namespace.forwardRef(function MenuTriggerItem2(props, ref) {
+var MenuTriggerItem = React30__namespace.forwardRef(function MenuTriggerItem2(props, ref) {
   const { startIcon, children, className, ...rest } = props;
   return /* @__PURE__ */ jsxRuntime.jsx(DropdownMenu__namespace.Sub, { children: /* @__PURE__ */ jsxRuntime.jsxs(
     DropdownMenu__namespace.SubTrigger,
@@ -3248,7 +3310,7 @@ var INPUT_BASE2 = [
 ].join(" ");
 var INPUT_FILLED = "border-[var(--color-input-border)]";
 var INPUT_INVALID = "border-[var(--color-border-error)] hover:border-[var(--color-border-error)]";
-var PinInput = React29__namespace.forwardRef(
+var PinInput = React30__namespace.forwardRef(
   function PinInput2(props, ref) {
     const {
       count = 6,
@@ -3266,12 +3328,12 @@ var PinInput = React29__namespace.forwardRef(
       bgColor,
       className
     } = props;
-    const inputRefs = React29__namespace.useRef([]);
-    const values = React29__namespace.useMemo(
+    const inputRefs = React30__namespace.useRef([]);
+    const values = React30__namespace.useMemo(
       () => controlledValue ?? Array.from({ length: count }).fill(""),
       [controlledValue, count]
     );
-    const updateValue = React29__namespace.useCallback((index, char) => {
+    const updateValue = React30__namespace.useCallback((index, char) => {
       const next = [...values];
       next[index] = char;
       onValueChange?.({ value: next });
@@ -3279,11 +3341,11 @@ var PinInput = React29__namespace.forwardRef(
         onValueComplete?.({ value: next });
       }
     }, [values, onValueChange, onValueComplete]);
-    const focusInput = React29__namespace.useCallback((index) => {
+    const focusInput = React30__namespace.useCallback((index) => {
       const clamped = Math.max(0, Math.min(index, count - 1));
       inputRefs.current[clamped]?.focus();
     }, [count]);
-    const handleInput = React29__namespace.useCallback((index, e) => {
+    const handleInput = React30__namespace.useCallback((index, e) => {
       const target = e.currentTarget;
       const char = target.value.slice(-1);
       updateValue(index, char);
@@ -3291,7 +3353,7 @@ var PinInput = React29__namespace.forwardRef(
         focusInput(index + 1);
       }
     }, [count, updateValue, focusInput]);
-    const handleKeyDown = React29__namespace.useCallback((index, e) => {
+    const handleKeyDown = React30__namespace.useCallback((index, e) => {
       if (e.key === "Backspace") {
         if (values[index]) {
           updateValue(index, "");
@@ -3308,7 +3370,7 @@ var PinInput = React29__namespace.forwardRef(
         e.preventDefault();
       }
     }, [count, values, updateValue, focusInput]);
-    const handlePaste = React29__namespace.useCallback((e) => {
+    const handlePaste = React30__namespace.useCallback((e) => {
       e.preventDefault();
       const pasted = e.clipboardData.getData("text/plain").trim();
       if (!pasted) {
@@ -3325,18 +3387,18 @@ var PinInput = React29__namespace.forwardRef(
       }
       focusInput(Math.min(chars.length, count - 1));
     }, [count, values, onValueChange, onValueComplete, focusInput]);
-    const handleFocus = React29__namespace.useCallback((e) => {
+    const handleFocus = React30__namespace.useCallback((e) => {
       e.currentTarget.select();
     }, []);
-    const handleNoop = React29__namespace.useCallback(() => {
+    const handleNoop = React30__namespace.useCallback(() => {
     }, []);
-    const setInputRef = React29__namespace.useCallback((index) => (el) => {
+    const setInputRef = React30__namespace.useCallback((index) => (el) => {
       inputRefs.current[index] = el;
     }, []);
-    const onInputAtIndex = React29__namespace.useCallback((index) => (e) => {
+    const onInputAtIndex = React30__namespace.useCallback((index) => (e) => {
       handleInput(index, e);
     }, [handleInput]);
-    const onKeyDownAtIndex = React29__namespace.useCallback((index) => (e) => {
+    const onKeyDownAtIndex = React30__namespace.useCallback((index) => (e) => {
       handleKeyDown(index, e);
     }, [handleKeyDown]);
     const bgStyle = bgColor ? { backgroundColor: `var(--color-${bgColor.replace(/\./g, "-")})` } : void 0;
@@ -3397,7 +3459,7 @@ function parsePlacement2(placement) {
   }
   return { side, align };
 }
-var PositioningContext2 = React29__namespace.createContext({
+var PositioningContext2 = React30__namespace.createContext({
   side: "bottom",
   align: "start",
   sideOffset: 4,
@@ -3431,7 +3493,7 @@ var PopoverRoot = (props) => {
     }
   };
   const { side, align } = parsePlacement2(mergedPositioning.placement);
-  const positioningValue = React29__namespace.useMemo(() => ({
+  const positioningValue = React30__namespace.useMemo(() => ({
     side,
     align,
     sideOffset: mergedPositioning.offset?.mainAxis ?? 4,
@@ -3448,13 +3510,13 @@ var PopoverRoot = (props) => {
     autoFocus,
     closeOnInteractOutside
   ]);
-  const handleOpenChange = React29__namespace.useCallback((isOpen) => {
+  const handleOpenChange = React30__namespace.useCallback((isOpen) => {
     onOpenChange?.({ open: isOpen });
   }, [onOpenChange]);
   const placement = mergedPositioning.placement ?? "bottom-start";
   const offset = mergedPositioning.offset?.mainAxis ?? 4;
   return /* @__PURE__ */ jsxRuntime.jsx(PositioningContext2.Provider, { value: positioningValue, children: /* @__PURE__ */ jsxRuntime.jsx(
-    popover.Popover,
+    gui.Popover,
     {
       open,
       defaultOpen,
@@ -3466,11 +3528,11 @@ var PopoverRoot = (props) => {
     }
   ) });
 };
-var PopoverTrigger = React29__namespace.forwardRef(function PopoverTrigger2(props, ref) {
+var PopoverTrigger = React30__namespace.forwardRef(function PopoverTrigger2(props, ref) {
   const { asChild = true, ...rest } = props;
-  return /* @__PURE__ */ jsxRuntime.jsx(popover.Popover.Trigger, { asChild: asChild ? "except-style" : void 0, ref, ...rest });
+  return /* @__PURE__ */ jsxRuntime.jsx(gui.Popover.Trigger, { asChild: asChild ? "except-style" : void 0, ref, ...rest });
 });
-var PopoverContent = React29__namespace.forwardRef(function PopoverContent2(props, ref) {
+var PopoverContent = React30__namespace.forwardRef(function PopoverContent2(props, ref) {
   const { portalled = true, portalRef: _portalRef, className, w, minW, maxW, paddingTop, style: styleProp, ...rest } = props;
   const resolvedW = typeof w === "object" ? w.base ?? w.lg : w;
   const contentStyle = {
@@ -3481,7 +3543,7 @@ var PopoverContent = React29__namespace.forwardRef(function PopoverContent2(prop
     ...paddingTop !== void 0 ? { paddingTop: typeof paddingTop === "number" ? `${paddingTop * 4}px` : paddingTop } : {}
   };
   return /* @__PURE__ */ jsxRuntime.jsx(
-    popover.Popover.Content,
+    gui.Popover.Content,
     {
       ref,
       unstyled: true,
@@ -3501,10 +3563,10 @@ var PopoverContent = React29__namespace.forwardRef(function PopoverContent2(prop
     }
   );
 });
-var PopoverArrow = React29__namespace.forwardRef(function PopoverArrow2(props, ref) {
+var PopoverArrow = React30__namespace.forwardRef(function PopoverArrow2(props, ref) {
   const { className, ...rest } = props;
   return /* @__PURE__ */ jsxRuntime.jsx(
-    popover.Popover.Arrow,
+    gui.Popover.Arrow,
     {
       ref,
       unstyled: true,
@@ -3513,10 +3575,10 @@ var PopoverArrow = React29__namespace.forwardRef(function PopoverArrow2(props, r
     }
   );
 });
-var PopoverCloseTrigger = React29__namespace.forwardRef(function PopoverCloseTrigger2(props, ref) {
+var PopoverCloseTrigger = React30__namespace.forwardRef(function PopoverCloseTrigger2(props, ref) {
   const { className, ...rest } = props;
   return /* @__PURE__ */ jsxRuntime.jsx(
-    popover.Popover.Close,
+    gui.Popover.Close,
     {
       unstyled: true,
       className: cn("absolute top-1 right-1", className),
@@ -3527,14 +3589,14 @@ var PopoverCloseTrigger = React29__namespace.forwardRef(function PopoverCloseTri
     }
   );
 });
-var PopoverCloseTriggerWrapper = React29__namespace.forwardRef(function PopoverCloseTriggerWrapper2(props, ref) {
+var PopoverCloseTriggerWrapper = React30__namespace.forwardRef(function PopoverCloseTriggerWrapper2(props, ref) {
   const { disabled, children, ...rest } = props;
   if (disabled) {
     return children;
   }
-  return /* @__PURE__ */ jsxRuntime.jsx(popover.Popover.Close, { ref, ...rest, asChild: true, children });
+  return /* @__PURE__ */ jsxRuntime.jsx(gui.Popover.Close, { ref, ...rest, asChild: true, children });
 });
-var PopoverBody = React29__namespace.forwardRef(function PopoverBody2(props, ref) {
+var PopoverBody = React30__namespace.forwardRef(function PopoverBody2(props, ref) {
   const {
     className,
     style: styleProp,
@@ -3572,7 +3634,7 @@ var PopoverBody = React29__namespace.forwardRef(function PopoverBody2(props, ref
     }
   );
 });
-var PopoverHeader = React29__namespace.forwardRef(function PopoverHeader2(props, ref) {
+var PopoverHeader = React30__namespace.forwardRef(function PopoverHeader2(props, ref) {
   const { className, ...rest } = props;
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
@@ -3583,7 +3645,7 @@ var PopoverHeader = React29__namespace.forwardRef(function PopoverHeader2(props,
     }
   );
 });
-var PopoverFooter = React29__namespace.forwardRef(function PopoverFooter2(props, ref) {
+var PopoverFooter = React30__namespace.forwardRef(function PopoverFooter2(props, ref) {
   const { className, ...rest } = props;
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
@@ -3594,7 +3656,7 @@ var PopoverFooter = React29__namespace.forwardRef(function PopoverFooter2(props,
     }
   );
 });
-var PopoverTitle = React29__namespace.forwardRef(function PopoverTitle2(props, ref) {
+var PopoverTitle = React30__namespace.forwardRef(function PopoverTitle2(props, ref) {
   const { className, ...rest } = props;
   return /* @__PURE__ */ jsxRuntime.jsx(
     "h3",
@@ -3605,7 +3667,7 @@ var PopoverTitle = React29__namespace.forwardRef(function PopoverTitle2(props, r
     }
   );
 });
-var PopoverDescription = React29__namespace.forwardRef(function PopoverDescription2(props, ref) {
+var PopoverDescription = React30__namespace.forwardRef(function PopoverDescription2(props, ref) {
   const { className, ...rest } = props;
   return /* @__PURE__ */ jsxRuntime.jsx(
     "p",
@@ -3627,7 +3689,7 @@ function normalizeValue(value, min, max) {
   if (max <= min) return 0;
   return Math.round((value - min) / (max - min) * 100);
 }
-var Progress = React29__namespace.forwardRef(
+var Progress = React30__namespace.forwardRef(
   function Progress2(props, ref) {
     const {
       value,
@@ -3704,12 +3766,12 @@ var SIZE_MAP = {
   lg: { size: 48, thickness: 7, textClass: "text-sm" },
   xl: { size: 64, thickness: 8, textClass: "text-sm" }
 };
-var Ctx = React29__namespace.createContext({
+var Ctx = React30__namespace.createContext({
   value: 0,
   size: "md",
   colorPalette: "blue"
 });
-var ProgressCircleRoot = React29__namespace.forwardRef(function ProgressCircleRoot2(props, ref) {
+var ProgressCircleRoot = React30__namespace.forwardRef(function ProgressCircleRoot2(props, ref) {
   const {
     value = 0,
     size = "md",
@@ -3718,7 +3780,7 @@ var ProgressCircleRoot = React29__namespace.forwardRef(function ProgressCircleRo
     children,
     ...rest
   } = props;
-  const ctx = React29__namespace.useMemo(
+  const ctx = React30__namespace.useMemo(
     () => ({ value: value ?? null, size, colorPalette }),
     [value, size, colorPalette]
   );
@@ -3736,9 +3798,9 @@ var ProgressCircleRoot = React29__namespace.forwardRef(function ProgressCircleRo
     }
   ) });
 });
-var ProgressCircleRing = React29__namespace.forwardRef(function ProgressCircleRing2(props, ref) {
+var ProgressCircleRing = React30__namespace.forwardRef(function ProgressCircleRing2(props, ref) {
   const { trackColor, cap, color, className, ...rest } = props;
-  const { value, size: sizeKey } = React29__namespace.useContext(Ctx);
+  const { value, size: sizeKey } = React30__namespace.useContext(Ctx);
   const { size, thickness } = SIZE_MAP[sizeKey];
   const radius = size / 2 - thickness / 2;
   const circumference = 2 * Math.PI * radius;
@@ -3793,9 +3855,9 @@ var ProgressCircleRing = React29__namespace.forwardRef(function ProgressCircleRi
     }
   );
 });
-var ProgressCircleValueText = React29__namespace.forwardRef(function ProgressCircleValueText2(props, ref) {
+var ProgressCircleValueText = React30__namespace.forwardRef(function ProgressCircleValueText2(props, ref) {
   const { className, children, ...rest } = props;
-  const { value, size: sizeKey } = React29__namespace.useContext(Ctx);
+  const { value, size: sizeKey } = React30__namespace.useContext(Ctx);
   const { textClass } = SIZE_MAP[sizeKey];
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
@@ -3839,8 +3901,8 @@ var SIZE_CLASSES8 = {
     label: "text-base"
   }
 };
-var RadioSizeContext = React29__namespace.createContext("md");
-var RadioGroupBase = React29__namespace.forwardRef(
+var RadioSizeContext = React30__namespace.createContext("md");
+var RadioGroupBase = React30__namespace.forwardRef(
   function RadioGroup2(props, ref) {
     const {
       children,
@@ -3857,7 +3919,7 @@ var RadioGroupBase = React29__namespace.forwardRef(
       className,
       ...rest
     } = props;
-    const handleValueChange = React29__namespace.useCallback(
+    const handleValueChange = React30__namespace.useCallback(
       (nextValue) => {
         if (readOnly) return;
         onValueChange?.({ value: nextValue });
@@ -3890,10 +3952,10 @@ var RadioGroupBase = React29__namespace.forwardRef(
 var RadioGroup3 = RadioGroupBase;
 var NOOP2 = () => {
 };
-var RadioBase = React29__namespace.forwardRef(
+var RadioBase = React30__namespace.forwardRef(
   function Radio(props, ref) {
     const { children, inputProps, rootRef, value, disabled, className, ...rest } = props;
-    const size = React29__namespace.useContext(RadioSizeContext);
+    const size = React30__namespace.useContext(RadioSizeContext);
     const sizeClasses2 = SIZE_CLASSES8[size];
     return /* @__PURE__ */ jsxRuntime.jsxs(
       "label",
@@ -3955,23 +4017,23 @@ var RadioBase = React29__namespace.forwardRef(
 var Radio2 = RadioBase;
 var StarFilledIcon = ({ className }) => /* @__PURE__ */ jsxRuntime.jsx("svg", { className, viewBox: "0 0 20 20", fill: "currentColor", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z" }) });
 var StarOutlineIcon = ({ className }) => /* @__PURE__ */ jsxRuntime.jsx("svg", { className, viewBox: "0 0 20 20", fill: "none", stroke: "currentColor", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z", strokeWidth: "1.5" }) });
-var Rating = React29__namespace.forwardRef(
+var Rating = React30__namespace.forwardRef(
   function Rating2(props, ref) {
     const { count = 5, label: labelProp, defaultValue = 0, onValueChange, readOnly, className, ...rest } = props;
-    const [value, setValue] = React29__namespace.useState(defaultValue);
-    const [hoveredIndex, setHoveredIndex] = React29__namespace.useState(-1);
+    const [value, setValue] = React30__namespace.useState(defaultValue);
+    const [hoveredIndex, setHoveredIndex] = React30__namespace.useState(-1);
     const highlightedIndex = hoveredIndex >= 0 && !readOnly ? hoveredIndex + 1 : value;
     const label = Array.isArray(labelProp) ? labelProp[highlightedIndex - 1] : labelProp;
-    const handleClick = React29__namespace.useCallback((index) => () => {
+    const handleClick = React30__namespace.useCallback((index) => () => {
       if (readOnly) return;
       setValue(index);
       onValueChange?.({ value: index });
     }, [readOnly, onValueChange]);
-    const handleMouseEnter = React29__namespace.useCallback((index) => () => {
+    const handleMouseEnter = React30__namespace.useCallback((index) => () => {
       if (readOnly) return;
       setHoveredIndex(index);
     }, [readOnly]);
-    const handleMouseLeave = React29__namespace.useCallback(() => {
+    const handleMouseLeave = React30__namespace.useCallback(() => {
       setHoveredIndex(-1);
     }, []);
     return /* @__PURE__ */ jsxRuntime.jsxs("div", { ref, className: cn("inline-flex items-center gap-1", className), ...rest, children: [
@@ -3999,14 +4061,14 @@ var Rating = React29__namespace.forwardRef(
     ] });
   }
 );
-function createListCollection(config) {
-  return { items: config.items };
+function createListCollection(config2) {
+  return { items: config2.items };
 }
 var ArrowIcon2 = ({ className }) => /* @__PURE__ */ jsxRuntime.jsx("svg", { className, viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M7.5 15L12.5 10L7.5 5", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) });
 var CheckIcon2 = ({ className }) => /* @__PURE__ */ jsxRuntime.jsx("svg", { className, viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M16.667 5L7.5 14.167 3.333 10", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) });
 function FilterInput({ placeholder, initialValue = "", onChange }) {
-  const [value, setValue] = React29__namespace.useState(initialValue);
-  const handleChange = React29__namespace.useCallback((e) => {
+  const [value, setValue] = React30__namespace.useState(initialValue);
+  const handleChange = React30__namespace.useCallback((e) => {
     setValue(e.target.value);
     onChange?.(e.target.value);
   }, [onChange]);
@@ -4025,15 +4087,15 @@ function FilterInput({ placeholder, initialValue = "", onChange }) {
     }
   );
 }
-var SelectInternalContext = React29__namespace.createContext(null);
+var SelectInternalContext = React30__namespace.createContext(null);
 function useSelectInternalContext() {
-  const ctx = React29__namespace.useContext(SelectInternalContext);
+  const ctx = React30__namespace.useContext(SelectInternalContext);
   if (!ctx) {
     throw new Error("Select compound components must be rendered inside <SelectRoot>");
   }
   return ctx;
 }
-var SelectRoot = React29__namespace.forwardRef(
+var SelectRoot = React30__namespace.forwardRef(
   function SelectRoot2(props, ref) {
     const {
       children,
@@ -4064,21 +4126,21 @@ var SelectRoot = React29__namespace.forwardRef(
       hideFrom: _hideFrom
     } = props;
     const collection = collectionProp ?? createListCollection({ items: [] });
-    const [internalValue, setInternalValue] = React29__namespace.useState(defaultValueArr ?? []);
+    const [internalValue, setInternalValue] = React30__namespace.useState(defaultValueArr ?? []);
     const currentValue = valueProp ?? internalValue;
-    const selectedItems = React29__namespace.useMemo(() => {
+    const selectedItems = React30__namespace.useMemo(() => {
       return currentValue.map((v) => collection.items.find((item) => item.value === v)).filter(Boolean);
     }, [currentValue, collection.items]);
-    const [open, setOpen] = React29__namespace.useState(defaultOpen ?? false);
+    const [open, setOpen] = React30__namespace.useState(defaultOpen ?? false);
     const isOpen = openProp ?? open;
-    const handleOpenChange = React29__namespace.useCallback((nextOpen) => {
+    const handleOpenChange = React30__namespace.useCallback((nextOpen) => {
       setOpen(nextOpen);
       onOpenChange?.(nextOpen);
       if (!nextOpen) {
         onInteractOutside?.();
       }
     }, [onOpenChange, onInteractOutside]);
-    const handleRadixValueChange = React29__namespace.useCallback((radixValue) => {
+    const handleRadixValueChange = React30__namespace.useCallback((radixValue) => {
       const nextArr = [radixValue];
       if (!valueProp) {
         setInternalValue(nextArr);
@@ -4086,7 +4148,7 @@ var SelectRoot = React29__namespace.forwardRef(
       const items = collection.items.filter((item) => nextArr.includes(item.value));
       onValueChangeProp?.({ value: nextArr, items });
     }, [valueProp, collection.items, onValueChangeProp]);
-    const ctxValue = React29__namespace.useMemo(() => ({
+    const ctxValue = React30__namespace.useMemo(() => ({
       value: currentValue,
       selectedItems,
       collection,
@@ -4106,7 +4168,7 @@ var SelectRoot = React29__namespace.forwardRef(
       if (typeof v === "string") return v;
       return v.base ?? v.lg ?? Object.values(v)[0];
     };
-    const inlineStyle = React29__namespace.useMemo(() => {
+    const inlineStyle = React30__namespace.useMemo(() => {
       const s = { ...style };
       const rw = resolveVal(w);
       if (rw) s.width = rw;
@@ -4144,7 +4206,7 @@ var SelectRoot = React29__namespace.forwardRef(
     ) });
   }
 );
-var SelectControl = React29__namespace.forwardRef(
+var SelectControl = React30__namespace.forwardRef(
   function SelectControl2(props, ref) {
     const { children, noIndicator, triggerProps, loading, defaultValue } = props;
     const ctx = useSelectInternalContext();
@@ -4181,11 +4243,11 @@ var SelectControl = React29__namespace.forwardRef(
     return trigger;
   }
 );
-var SelectClearTrigger = React29__namespace.forwardRef(
+var SelectClearTrigger = React30__namespace.forwardRef(
   function SelectClearTrigger2(props, ref) {
     const { className, ...rest } = props;
     const ctx = useSelectInternalContext();
-    const handleClick = React29__namespace.useCallback(() => {
+    const handleClick = React30__namespace.useCallback(() => {
       ctx.onValueChange({ value: [], items: [] });
     }, [ctx]);
     return /* @__PURE__ */ jsxRuntime.jsx(
@@ -4202,7 +4264,7 @@ var SelectClearTrigger = React29__namespace.forwardRef(
     );
   }
 );
-var SelectContent = React29__namespace.forwardRef(
+var SelectContent = React30__namespace.forwardRef(
   function SelectContent2(props, ref) {
     const { portalled = true, portalRef, children, className, ...rest } = props;
     const content = /* @__PURE__ */ jsxRuntime.jsx(
@@ -4229,7 +4291,7 @@ var SelectContent = React29__namespace.forwardRef(
     return content;
   }
 );
-var SelectItem = React29__namespace.forwardRef(
+var SelectItem = React30__namespace.forwardRef(
   function SelectItem2(props, ref) {
     const { item, children, className, ...rest } = props;
     return /* @__PURE__ */ jsxRuntime.jsxs(
@@ -4257,7 +4319,7 @@ var SelectItem = React29__namespace.forwardRef(
     );
   }
 );
-var SelectValueText = React29__namespace.forwardRef(
+var SelectValueText = React30__namespace.forwardRef(
   function SelectValueText2(props, ref) {
     const { children, size, required, invalid, errorText, mode, className, style, placeholder: placeholderProp, ...rest } = props;
     const ctx = useSelectInternalContext();
@@ -4313,7 +4375,7 @@ var SelectValueText = React29__namespace.forwardRef(
     );
   }
 );
-var SelectItemGroup = React29__namespace.forwardRef(
+var SelectItemGroup = React30__namespace.forwardRef(
   function SelectItemGroup2(props, ref) {
     const { children, label, className, ...rest } = props;
     return /* @__PURE__ */ jsxRuntime.jsxs(RadixSelect__namespace.Group, { ref, className: cn("py-1", className), ...rest, children: [
@@ -4324,7 +4386,7 @@ var SelectItemGroup = React29__namespace.forwardRef(
 );
 var SelectLabel = RadixSelect__namespace.Label;
 var SelectItemText = RadixSelect__namespace.ItemText;
-var Select = React29__namespace.forwardRef((props, ref) => {
+var Select = React30__namespace.forwardRef((props, ref) => {
   const { collection, placeholder, portalled = true, loading, errorText, contentProps, contentHeader, itemFilter, mode, ...rest } = props;
   return /* @__PURE__ */ jsxRuntime.jsxs(
     SelectRoot,
@@ -4346,7 +4408,7 @@ var Select = React29__namespace.forwardRef((props, ref) => {
         ) }),
         /* @__PURE__ */ jsxRuntime.jsxs(SelectContent, { portalled, ...contentProps, children: [
           contentHeader,
-          collection.items.filter(itemFilter ?? (() => true)).map((item) => /* @__PURE__ */ jsxRuntime.jsxs(React29__namespace.Fragment, { children: [
+          collection.items.filter(itemFilter ?? (() => true)).map((item) => /* @__PURE__ */ jsxRuntime.jsxs(React30__namespace.Fragment, { children: [
             /* @__PURE__ */ jsxRuntime.jsx(SelectItem, { item, children: item.renderLabel ? item.renderLabel("item") : item.label }),
             item.afterElement
           ] }, item.value))
@@ -4355,19 +4417,19 @@ var Select = React29__namespace.forwardRef((props, ref) => {
     }
   );
 });
-var SelectAsync = React29__namespace.forwardRef((props, ref) => {
+var SelectAsync = React30__namespace.forwardRef((props, ref) => {
   const { placeholder, portalled = true, loading, loadOptions, extraControls, onValueChange, errorText, mode, contentHeader, ...rest } = props;
-  const [collection, setCollection] = React29__namespace.useState(createListCollection({ items: [] }));
-  const [inputValue, setInputValue] = React29__namespace.useState("");
-  const [value, setValue] = React29__namespace.useState([]);
+  const [collection, setCollection] = React30__namespace.useState(createListCollection({ items: [] }));
+  const [inputValue, setInputValue] = React30__namespace.useState("");
+  const [value, setValue] = React30__namespace.useState([]);
   const debouncedInputValue = usehooks.useDebounce(inputValue, 300);
-  React29__namespace.useEffect(() => {
+  React30__namespace.useEffect(() => {
     loadOptions(debouncedInputValue, value).then(setCollection);
   }, [debouncedInputValue, loadOptions, value]);
-  const handleFilterChange = React29__namespace.useCallback((val) => {
+  const handleFilterChange = React30__namespace.useCallback((val) => {
     setInputValue(val);
   }, []);
-  const handleValueChange = React29__namespace.useCallback(({ value: v, items }) => {
+  const handleValueChange = React30__namespace.useCallback(({ value: v, items }) => {
     setValue(v);
     onValueChange?.({ value: v, items });
   }, [onValueChange]);
@@ -4426,7 +4488,7 @@ var VERTICAL_SIZE_CLASSES = {
   md: "border-l-2",
   lg: "border-l-[3px]"
 };
-var Separator2 = React29__namespace.default.forwardRef(
+var Separator2 = React30__namespace.default.forwardRef(
   function Separator3({ orientation = "horizontal", variant = "solid", size = "sm", className, ...rest }, ref) {
     const isVertical = orientation === "vertical";
     return /* @__PURE__ */ jsxRuntime.jsx(
@@ -4450,7 +4512,7 @@ var Separator2 = React29__namespace.default.forwardRef(
 );
 var THUMB_SIZE = 20;
 var TRACK_HEIGHT = 6;
-var Slider = React29__namespace.forwardRef(
+var Slider = React30__namespace.forwardRef(
   function Slider2(props, ref) {
     const {
       marks: marksProp,
@@ -4569,7 +4631,7 @@ var SIZE_CLASSES9 = {
     label: "text-base"
   }
 };
-var SwitchBase = React29__namespace.forwardRef(
+var SwitchBase = React30__namespace.forwardRef(
   function Switch(props, ref) {
     const {
       inputProps,
@@ -4588,10 +4650,10 @@ var SwitchBase = React29__namespace.forwardRef(
       className,
       ...rest
     } = props;
-    const [internalChecked, setInternalChecked] = React29__namespace.useState(defaultChecked ?? false);
+    const [internalChecked, setInternalChecked] = React30__namespace.useState(defaultChecked ?? false);
     const isControlled = checkedProp !== void 0;
     const checkedState = isControlled ? checkedProp : internalChecked;
-    const handleCheckedChange = React29__namespace.useCallback(
+    const handleCheckedChange = React30__namespace.useCallback(
       (nextChecked) => {
         if (!isControlled) {
           setInternalChecked(nextChecked);
@@ -4856,7 +4918,7 @@ function resolveResponsive(value) {
   }
   return void 0;
 }
-var TableRoot = React29__namespace.forwardRef(
+var TableRoot = React30__namespace.forwardRef(
   function TableRoot2(props, ref) {
     const { className, style: styleProp, children, ...other } = props;
     const rawMinW = other.minWidth ?? other.minW;
@@ -4879,7 +4941,7 @@ var TableRoot = React29__namespace.forwardRef(
     );
   }
 );
-var TableHeader = React29__namespace.forwardRef(
+var TableHeader = React30__namespace.forwardRef(
   function TableHeader2(props, ref) {
     const { className, style: styleProp, children, ...other } = props;
     const { style: extracted, rest } = extractStyles(other);
@@ -4896,7 +4958,7 @@ var TableHeader = React29__namespace.forwardRef(
     );
   }
 );
-var TableBody = React29__namespace.forwardRef(
+var TableBody = React30__namespace.forwardRef(
   function TableBody2(props, ref) {
     const { className, style: styleProp, children, ...other } = props;
     const { style: extracted, rest } = extractStyles(other);
@@ -4913,7 +4975,7 @@ var TableBody = React29__namespace.forwardRef(
     );
   }
 );
-var TableRow = React29__namespace.forwardRef(
+var TableRow = React30__namespace.forwardRef(
   function TableRow2(props, ref) {
     const { className, style: styleProp, children, ...other } = props;
     const { style: extracted, rest } = extractStyles(other);
@@ -4930,7 +4992,7 @@ var TableRow = React29__namespace.forwardRef(
     );
   }
 );
-var TableCell = React29__namespace.forwardRef(
+var TableCell = React30__namespace.forwardRef(
   function TableCell2(props, ref) {
     const { isNumeric, className, style: styleProp, children, ...other } = props;
     const { style: extracted, rest } = extractStyles(other);
@@ -4951,7 +5013,7 @@ var TableCell = React29__namespace.forwardRef(
     );
   }
 );
-var TableColumnHeader = React29__namespace.forwardRef(
+var TableColumnHeader = React30__namespace.forwardRef(
   function TableColumnHeader2(props, ref) {
     const { isNumeric, className, style: styleProp, children, ...other } = props;
     const { style: extracted, rest } = extractStyles(other);
@@ -4978,7 +5040,7 @@ var TableColumnHeader = React29__namespace.forwardRef(
 );
 var TableColumnHeaderSortable = (props) => {
   const { sortField, sortValue, onSortToggle, children, disabled, indicatorPosition = "left", contentAfter, ...rest } = props;
-  const handleSortToggle = React29__namespace.useCallback(() => {
+  const handleSortToggle = React30__namespace.useCallback(() => {
     onSortToggle(sortField);
   }, [onSortToggle, sortField]);
   const isActive = sortValue.includes(sortField);
@@ -5004,16 +5066,16 @@ var TableColumnHeaderSortable = (props) => {
 var ACTION_BAR_SHADOW = "0 4px 4px -4px rgb(0 0 0 / 10%), 0 2px 4px -4px rgb(0 0 0 / 6%)";
 var TableHeaderSticky = (props) => {
   const { top, children, className, style: styleProp, ...rest } = props;
-  const ref = React29__namespace.useRef(null);
-  const [isStuck, setIsStuck] = React29__namespace.useState(false);
-  const handleScroll = React29__namespace.useCallback(() => {
+  const ref = React30__namespace.useRef(null);
+  const [isStuck, setIsStuck] = React30__namespace.useState(false);
+  const handleScroll = React30__namespace.useCallback(() => {
     if (Number(ref.current?.getBoundingClientRect().y) <= (Number(top) || 0)) {
       setIsStuck(true);
     } else {
       setIsStuck(false);
     }
   }, [top]);
-  React29__namespace.useEffect(() => {
+  React30__namespace.useEffect(() => {
     const throttledHandleScroll = esToolkit.throttle(handleScroll, 300);
     window.addEventListener("scroll", throttledHandleScroll);
     return () => {
@@ -5035,7 +5097,7 @@ var TableHeaderSticky = (props) => {
     }
   );
 };
-var TableCaption = React29__namespace.forwardRef(
+var TableCaption = React30__namespace.forwardRef(
   function TableCaption2(props, ref) {
     const { className, style: styleProp, children, ...other } = props;
     const { style: extracted, rest } = extractStyles(other);
@@ -5052,7 +5114,7 @@ var TableCaption = React29__namespace.forwardRef(
     );
   }
 );
-var TableFooter = React29__namespace.forwardRef(
+var TableFooter = React30__namespace.forwardRef(
   function TableFooter2(props, ref) {
     const { className, style: styleProp, children, ...other } = props;
     const { style: extracted, rest } = extractStyles(other);
@@ -5069,7 +5131,7 @@ var TableFooter = React29__namespace.forwardRef(
     );
   }
 );
-var TableScrollWrapper = React29__namespace.forwardRef(
+var TableScrollWrapper = React30__namespace.forwardRef(
   function TableScrollWrapper2(props, ref) {
     const { className, children, ...rest } = props;
     return /* @__PURE__ */ jsxRuntime.jsx(
@@ -5088,7 +5150,7 @@ var ROOT_SIZE_CLASSES = {
   md: "[--tabs-height:2.5rem] [--tabs-content-padding:1.5rem]",
   free: ""
 };
-var TabsRoot = React29__namespace.forwardRef(
+var TabsRoot = React30__namespace.forwardRef(
   function TabsRoot2(props, ref) {
     const {
       variant = "solid",
@@ -5100,7 +5162,7 @@ var TabsRoot = React29__namespace.forwardRef(
       className,
       ...rest
     } = props;
-    const handleValueChange = React29__namespace.useCallback(
+    const handleValueChange = React30__namespace.useCallback(
       (value) => {
         if (!onValueChange) return;
         onValueChange({ value });
@@ -5125,7 +5187,7 @@ var TabsRoot = React29__namespace.forwardRef(
     );
   }
 );
-var TabsList = React29__namespace.forwardRef(
+var TabsList = React30__namespace.forwardRef(
   function TabsList2(props, ref) {
     const {
       className,
@@ -5179,7 +5241,7 @@ var TRIGGER_VARIANT_CLASSES = {
   segmented: "bg-transparent text-text-primary border-2 border-solid border-selected-control-bg hover:text-hover data-[state=active]:text-selected-control-text data-[state=active]:bg-selected-control-bg data-[state=active]:border-selected-control-bg data-[state=active]:hover:text-selected-control-text",
   unstyled: ""
 };
-var TabsTrigger = React29__namespace.forwardRef(
+var TabsTrigger = React30__namespace.forwardRef(
   function TabsTrigger2(props, ref) {
     const {
       className,
@@ -5199,7 +5261,7 @@ var TabsTrigger = React29__namespace.forwardRef(
       visibility: _visibility,
       ...rest
     } = props;
-    const internalRef = React29__namespace.useRef(null);
+    const internalRef = React30__namespace.useRef(null);
     const mergedRef = useMergedRef(ref, internalRef);
     const { variant, size, fitted } = useTabsContext(internalRef);
     return /* @__PURE__ */ jsxRuntime.jsx(
@@ -5219,7 +5281,7 @@ var TabsTrigger = React29__namespace.forwardRef(
     );
   }
 );
-var TabsContent = React29__namespace.forwardRef(
+var TabsContent = React30__namespace.forwardRef(
   function TabsContent2(props, ref) {
     const { className, padding: _padding, ...rest } = props;
     return /* @__PURE__ */ jsxRuntime.jsx(
@@ -5253,8 +5315,8 @@ var TabsCounter = ({ count }) => {
   );
 };
 function useTabsContext(triggerRef) {
-  const [ctx, setCtx] = React29__namespace.useState({ variant: "solid", size: "md", fitted: false });
-  React29__namespace.useEffect(() => {
+  const [ctx, setCtx] = React30__namespace.useState({ variant: "solid", size: "md", fitted: false });
+  React30__namespace.useEffect(() => {
     const el = triggerRef.current;
     if (!el) return;
     const root = el.closest("[data-variant]");
@@ -5268,7 +5330,7 @@ function useTabsContext(triggerRef) {
   return ctx;
 }
 function useMergedRef(...refs) {
-  return React29__namespace.useCallback(
+  return React30__namespace.useCallback(
     (instance) => {
       for (const ref of refs) {
         if (!ref) continue;
@@ -5306,7 +5368,7 @@ var TAG_SELECTED_CLASSES = [
   "hover:opacity-76"
 ].join(" ");
 var TAG_DISABLED_CLASSES = "opacity-40 pointer-events-none cursor-not-allowed";
-var Tag = React29__namespace.forwardRef(
+var Tag = React30__namespace.forwardRef(
   function Tag2(props, ref) {
     const {
       variant,
@@ -5393,14 +5455,22 @@ var TEXTAREA_VARIANT_CLASSES = {
   filled: "border-0 bg-[var(--color-input-filled-bg,theme(colors.gray.100))]",
   unstyled: "border-0 bg-transparent p-0"
 };
-var Textarea = React29__namespace.default.forwardRef(
-  ({ size = "md", variant = "outline", className, ...rest }, ref) => {
+var Textarea = React30__namespace.default.forwardRef(
+  ({ size = "md", variant = "outline", className, onChange, onChangeText, ...rest }, ref) => {
+    const handleChange = React30__namespace.default.useCallback(
+      (event) => {
+        onChange?.(event);
+        onChangeText?.(event.target.value);
+      },
+      [onChange, onChangeText]
+    );
     return /* @__PURE__ */ jsxRuntime.jsx(
       "textarea",
       {
         ref,
         className: cn(TEXTAREA_BASE, TEXTAREA_SIZE_CLASSES[size], TEXTAREA_VARIANT_CLASSES[variant], className),
-        ...rest
+        ...rest,
+        onChange: handleChange
       }
     );
   }
@@ -5529,7 +5599,7 @@ function QuoteCell({ value, highlight, align = "right", onClick, className }) {
 }
 var CALL_HEADERS = ["Bid", "Ask", "Last", "Vol", "OI", "IV", "Delta"];
 var PUT_HEADERS = ["Delta", "IV", "OI", "Vol", "Last", "Ask", "Bid"];
-var OptionChain = React29__namespace.forwardRef(
+var OptionChain = React30__namespace.forwardRef(
   function OptionChain2(props, ref) {
     const {
       symbol: _symbol,
@@ -5540,7 +5610,7 @@ var OptionChain = React29__namespace.forwardRef(
       className,
       ...rest
     } = props;
-    const handleClick = React29__namespace.useCallback(
+    const handleClick = React30__namespace.useCallback(
       (quote, type, strike) => {
         if (!quote || !onSelectContract) return;
         onSelectContract({
@@ -5720,7 +5790,7 @@ function GreekItem({ def, value, compact }) {
     }
   );
 }
-var GreeksDisplay = React29__namespace.forwardRef(
+var GreeksDisplay = React30__namespace.forwardRef(
   function GreeksDisplay2(props, ref) {
     const {
       delta,
@@ -5951,7 +6021,7 @@ function LegRow({ leg, index, strikes, expirations, removable, onChange, onRemov
     )
   ] });
 }
-var StrategyBuilder = React29__namespace.forwardRef(
+var StrategyBuilder = React30__namespace.forwardRef(
   function StrategyBuilder2(props, ref) {
     const {
       underlying,
@@ -5963,12 +6033,12 @@ var StrategyBuilder = React29__namespace.forwardRef(
       ...rest
     } = props;
     const defaultExp = expirations[0] ?? "";
-    const [strategyType, setStrategyType] = React29__namespace.useState("bull_call_spread");
-    const [legs, setLegs] = React29__namespace.useState(() => {
+    const [strategyType, setStrategyType] = React30__namespace.useState("bull_call_spread");
+    const [legs, setLegs] = React30__namespace.useState(() => {
       const preset = STRATEGY_PRESETS.find((p) => p.value === "bull_call_spread");
       return preset ? preset.buildLegs(strikes, spotPrice, defaultExp) : [];
     });
-    const handleStrategyChange = React29__namespace.useCallback(
+    const handleStrategyChange = React30__namespace.useCallback(
       (e) => {
         const type = e.target.value;
         setStrategyType(type);
@@ -5979,7 +6049,7 @@ var StrategyBuilder = React29__namespace.forwardRef(
       },
       [strikes, spotPrice, defaultExp]
     );
-    const handleLegChange = React29__namespace.useCallback(
+    const handleLegChange = React30__namespace.useCallback(
       (index, leg) => {
         setLegs((prev) => {
           const next = [...prev];
@@ -5989,13 +6059,13 @@ var StrategyBuilder = React29__namespace.forwardRef(
       },
       []
     );
-    const handleLegRemove = React29__namespace.useCallback(
+    const handleLegRemove = React30__namespace.useCallback(
       (index) => {
         setLegs((prev) => prev.filter((_, i) => i !== index));
       },
       []
     );
-    const handleAddLeg = React29__namespace.useCallback(() => {
+    const handleAddLeg = React30__namespace.useCallback(() => {
       if (legs.length >= 4) return;
       const atm = findATM(strikes, spotPrice);
       setLegs((prev) => [
@@ -6003,14 +6073,14 @@ var StrategyBuilder = React29__namespace.forwardRef(
         { action: "buy", type: "call", strike: atm, expiration: defaultExp, quantity: 1 }
       ]);
     }, [legs.length, strikes, spotPrice, defaultExp]);
-    const netPremium = React29__namespace.useMemo(() => {
+    const netPremium = React30__namespace.useMemo(() => {
       return legs.reduce((sum, leg) => {
         if (leg.premium === void 0) return sum;
         const sign = leg.action === "buy" ? -1 : 1;
         return sum + sign * leg.premium * leg.quantity;
       }, 0);
     }, [legs]);
-    const handleSubmit = React29__namespace.useCallback(() => {
+    const handleSubmit = React30__namespace.useCallback(() => {
       if (!onSubmit || legs.length === 0) return;
       onSubmit({
         type: strategyType,
@@ -6131,7 +6201,7 @@ function buildPath(points, vb, width, height) {
   return parts.join(" ");
 }
 var LEG_COLORS = ["#6366f1", "#f59e0b", "#ec4899", "#06b6d4"];
-var PnlDiagram = React29__namespace.forwardRef(
+var PnlDiagram = React30__namespace.forwardRef(
   function PnlDiagram2(props, ref) {
     const {
       legs,
@@ -6140,10 +6210,10 @@ var PnlDiagram = React29__namespace.forwardRef(
       className,
       ...rest
     } = props;
-    const containerRef = React29__namespace.useRef(null);
-    const [hoverX, setHoverX] = React29__namespace.useState(null);
-    const [dims, setDims] = React29__namespace.useState({ width: 600, height: 240 });
-    React29__namespace.useEffect(() => {
+    const containerRef = React30__namespace.useRef(null);
+    const [hoverX, setHoverX] = React30__namespace.useState(null);
+    const [dims, setDims] = React30__namespace.useState({ width: 600, height: 240 });
+    React30__namespace.useEffect(() => {
       const el = containerRef.current;
       if (!el) return;
       const observer = new ResizeObserver((entries) => {
@@ -6166,7 +6236,7 @@ var PnlDiagram = React29__namespace.forwardRef(
     const xMax = maxStrike + range * 0.3;
     const SAMPLES = 200;
     const step = (xMax - xMin) / SAMPLES;
-    const combinedPoints = React29__namespace.useMemo(() => {
+    const combinedPoints = React30__namespace.useMemo(() => {
       const pts = [];
       for (let i = 0; i <= SAMPLES; i++) {
         const price = xMin + i * step;
@@ -6174,7 +6244,7 @@ var PnlDiagram = React29__namespace.forwardRef(
       }
       return pts;
     }, [legs, multiplier, xMin, step]);
-    const legPointSets = React29__namespace.useMemo(() => {
+    const legPointSets = React30__namespace.useMemo(() => {
       return legs.map((leg) => {
         const pts = [];
         for (let i = 0; i <= SAMPLES; i++) {
@@ -6195,7 +6265,7 @@ var PnlDiagram = React29__namespace.forwardRef(
     const chartH = height - PADDING.top - PADDING.bottom;
     const scaleX = (x) => PADDING.left + (x - vb.xMin) / (vb.xMax - vb.xMin) * chartW;
     const scaleY = (y) => PADDING.top + chartH - (y - vb.yMin) / (vb.yMax - vb.yMin) * chartH;
-    const breakevens = React29__namespace.useMemo(() => {
+    const breakevens = React30__namespace.useMemo(() => {
       const pts = [];
       for (let i = 1; i < combinedPoints.length; i++) {
         const prev = combinedPoints[i - 1];
@@ -6212,7 +6282,7 @@ var PnlDiagram = React29__namespace.forwardRef(
     const maxGainPoint = combinedPoints.find((p) => p.y === maxGain);
     const maxLossPoint = combinedPoints.find((p) => p.y === maxLoss);
     const zeroY = scaleY(0);
-    const handleMouseMove = React29__namespace.useCallback(
+    const handleMouseMove = React30__namespace.useCallback(
       (e) => {
         const rect = e.currentTarget.getBoundingClientRect();
         const mouseX = e.clientX - rect.left;
@@ -6225,7 +6295,7 @@ var PnlDiagram = React29__namespace.forwardRef(
       },
       [vb.xMin, vb.xMax, chartW]
     );
-    const handleMouseLeave = React29__namespace.useCallback(() => setHoverX(null), []);
+    const handleMouseLeave = React30__namespace.useCallback(() => setHoverX(null), []);
     const hoverPnl = hoverX !== null ? calcTotalPnl(legs, hoverX, multiplier) : null;
     buildPath(
       combinedPoints.map((p) => ({ x: scaleX(p.x), y: scaleY(p.y) })).map((p) => ({ x: p.x - PADDING.left, y: p.y - PADDING.top })),
@@ -6529,7 +6599,7 @@ function formatDate(date) {
   const d = new Date(date);
   return d.toLocaleDateString("en-US", { month: "short", day: "numeric" });
 }
-var OptionPositionCard = React29__namespace.forwardRef(
+var OptionPositionCard = React30__namespace.forwardRef(
   function OptionPositionCard2(props, ref) {
     const {
       position,
@@ -6691,7 +6761,7 @@ function ExpirationPill({ exp, isSelected, onClick }) {
     }
   );
 }
-var ExpirationSelector = React29__namespace.forwardRef(
+var ExpirationSelector = React30__namespace.forwardRef(
   function ExpirationSelector2(props, ref) {
     const {
       expirations,
@@ -6701,8 +6771,8 @@ var ExpirationSelector = React29__namespace.forwardRef(
       className,
       ...rest
     } = props;
-    const scrollRef = React29__namespace.useRef(null);
-    React29__namespace.useEffect(() => {
+    const scrollRef = React30__namespace.useRef(null);
+    React30__namespace.useEffect(() => {
       const container = scrollRef.current;
       if (!container) return;
       const selectedEl = container.querySelector('[data-selected="true"]');
@@ -6784,7 +6854,7 @@ var bankColors = {
   divider: "#222222",
   disabled: "#444444"
 };
-var BankCard = core.styled(core.View, {
+var BankCard = gui.styled(gui.View, {
   name: "BankCard",
   backgroundColor: bankColors.card,
   borderRadius: 24,
@@ -6805,7 +6875,7 @@ var BankCard = core.styled(core.View, {
     size: "md"
   }
 });
-var BankInput = core.styled(core.Text, {
+var BankInput = gui.styled(gui.Text, {
   name: "BankInput",
   render: "input",
   backgroundColor: bankColors.input,
@@ -6841,7 +6911,7 @@ var BankInput = core.styled(core.Text, {
     size: "md"
   }
 });
-var BankButton = core.styled(core.View, {
+var BankButton = gui.styled(gui.View, {
   name: "BankButton",
   render: "button",
   backgroundColor: bankColors.accent,
@@ -6886,7 +6956,7 @@ var BankButton = core.styled(core.View, {
     variant: "primary"
   }
 });
-var BankButtonText = core.styled(core.Text, {
+var BankButtonText = gui.styled(gui.Text, {
   name: "BankButtonText",
   color: "#000000",
   fontSize: 16,
@@ -6900,7 +6970,7 @@ var BankButtonText = core.styled(core.Text, {
     }
   }
 });
-var BankHeading = core.styled(core.Text, {
+var BankHeading = gui.styled(gui.Text, {
   name: "BankHeading",
   color: bankColors.text,
   fontWeight: "700",
@@ -6917,7 +6987,7 @@ var BankHeading = core.styled(core.Text, {
     size: "lg"
   }
 });
-var BankText = core.styled(core.Text, {
+var BankText = gui.styled(gui.Text, {
   name: "BankText",
   color: bankColors.textMuted,
   fontSize: 16,
@@ -6941,13 +7011,13 @@ function BankField({
   error,
   children
 }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs(core.View, { gap: 8, width: "100%", children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs(gui.View, { gap: 8, width: "100%", children: [
     label && /* @__PURE__ */ jsxRuntime.jsx(BankText, { variant: "label", children: label }),
     children,
     error && /* @__PURE__ */ jsxRuntime.jsx(BankText, { variant: "error", children: error })
   ] });
 }
-var BankAlert = core.styled(core.View, {
+var BankAlert = gui.styled(gui.View, {
   name: "BankAlert",
   borderRadius: 12,
   padding: 16,
@@ -6966,7 +7036,7 @@ var BankAlert = core.styled(core.View, {
     }
   }
 });
-var BankAlertText = core.styled(core.Text, {
+var BankAlertText = gui.styled(gui.Text, {
   name: "BankAlertText",
   fontSize: 14,
   variants: {
@@ -6976,7 +7046,7 @@ var BankAlertText = core.styled(core.Text, {
     }
   }
 });
-var BankPinBox = core.styled(core.Text, {
+var BankPinBox = gui.styled(gui.Text, {
   name: "BankPinBox",
   render: "input",
   backgroundColor: bankColors.input,
@@ -6999,13 +7069,13 @@ var BankPinBox = core.styled(core.Text, {
     }
   }
 });
-var BankDivider = core.styled(core.View, {
+var BankDivider = gui.styled(gui.View, {
   name: "BankDivider",
   height: 1,
   width: "100%",
   backgroundColor: bankColors.divider
 });
-var BankPage = core.styled(core.View, {
+var BankPage = gui.styled(gui.View, {
   name: "BankPage",
   backgroundColor: bankColors.bg,
   minHeight: "100vh",
@@ -7074,6 +7144,7 @@ exports.IconButton = IconButton;
 exports.Image = Image2;
 exports.Input = Input;
 exports.InputGroup = InputGroup;
+exports.LUX_BRAND = LUX_BRAND;
 exports.Link = Link;
 exports.LinkBox = LinkBox;
 exports.LinkExternalIcon = LinkExternalIcon;
@@ -7092,6 +7163,7 @@ exports.MenuTrigger = MenuTrigger;
 exports.MenuTriggerItem = MenuTriggerItem;
 exports.OptionChain = OptionChain;
 exports.OptionPositionCard = OptionPositionCard;
+exports.PARS_GOLD = PARS_GOLD;
 exports.PinInput = PinInput;
 exports.PnlDiagram = PnlDiagram;
 exports.PopoverArrow = PopoverArrow;
@@ -7153,7 +7225,10 @@ exports.Tooltip = Tooltip;
 exports.bankColors = bankColors;
 exports.buttonVariants = buttonVariants;
 exports.cn = cn;
+exports.config = config;
 exports.createListCollection = createListCollection;
+exports.guiConfig = lux_config_default;
+exports.luxThemes = luxThemes;
 exports.toaster = toaster;
 exports.useAccordion = useAccordion;
 exports.useColorMode = useColorMode;