@luxfi/ui 7.4.15 → 8.0.0

package/dist/index.cjs

@@ -8,8 +8,7 @@ var guiConfig = require('@hanzo/ui/gui-config');
 var v5 = require('@hanzogui/config/v5');
 var v5Css = require('@hanzogui/config/v5-css');
 var jsxRuntime = require('react/jsx-runtime');
-var clsx = require('clsx');
-var tailwindMerge = require('tailwind-merge');
+var ui = require('@hanzo/ui');
 var lucideReact = require('lucide-react');
 var usehooks = require('@uidotdev/usehooks');
 var esToolkit = require('es-toolkit');
@@ -245,9 +244,6 @@ var AppProvider = ({
   const theme = defaultTheme ?? whiteLabel.theme;
   return /* @__PURE__ */ jsxRuntime.jsx(WhiteLabelContext.Provider, { value: whiteLabel, children: /* @__PURE__ */ jsxRuntime.jsx(gui.GuiProvider, { config: lux_config_default, defaultTheme: theme, children: /* @__PURE__ */ jsxRuntime.jsx(reactQuery.QueryClientProvider, { client: queryClient ?? defaultQueryClient, children }) }) });
 };
-function cn(...inputs) {
-  return tailwindMerge.twMerge(clsx.clsx(inputs));
-}
 var NARROW_PX = 640;
 var TOUCH_PX = 1024;
 function useBelow(px) {
@@ -932,7 +928,7 @@ var Row = ({ item, onDone, menu }) => {
     item.hint ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs opacity-60", children: item.hint }) : null,
     item.selected ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, { "aria-hidden": "true", className: "h-4 w-4 shrink-0" }) : null
   ] });
-  const className = cn(
+  const className = ui.cn(
     "flex w-full cursor-pointer select-none items-center gap-2.5 rounded-md px-2 py-2 text-left text-sm",
     "hover:bg-[rgba(127,127,127,0.14)]",
     item.danger && "text-[var(--color-text-error,#e5484d)]"
@@ -985,7 +981,7 @@ var Switcher = ({
       "aria-label": title,
       "aria-haspopup": "menu",
       "aria-expanded": open,
-      className: cn(
+      className: ui.cn(
         "flex max-w-[14rem] items-center gap-2 rounded-md px-2 py-1.5 text-sm font-medium",
         "hover:bg-[rgba(127,127,127,0.14)]"
       ),
@@ -1159,7 +1155,7 @@ var AppNav = ({
           {
             href: l.href,
             "aria-current": l.active ? "page" : void 0,
-            className: cn(
+            className: ui.cn(
               "rounded-md px-3 py-1.5 text-sm font-medium",
               l.active ? "bg-[rgba(127,127,127,0.14)]" : "opacity-75 hover:opacity-100"
             ),
@@ -1410,7 +1406,7 @@ var Skeleton = React32__namespace.forwardRef(
     const shimStyle = shimToStyle(props);
     const mergedStyle = Object.keys(shimStyle).length > 0 || styleProp ? { ...shimStyle, ...styleProp } : void 0;
     const hideBelowClass = props.hideBelow ? HIDE_BELOW_MAP[props.hideBelow] : void 0;
-    const cls = hideBelowClass ? cn(className, hideBelowClass) : className;
+    const cls = hideBelowClass ? ui.cn(className, hideBelowClass) : className;
     const htmlRest = stripShims(allRest);
     if (!loading) {
       if (asChild && React32__namespace.isValidElement(children)) return children;
@@ -1422,7 +1418,7 @@ var Skeleton = React32__namespace.forwardRef(
         {
           ref,
           "data-loading": true,
-          className: cn(SKELETON_CLASSES, "[&_*]:invisible", cls),
+          className: ui.cn(SKELETON_CLASSES, "[&_*]:invisible", cls),
           style: mergedStyle,
           ...htmlRest,
           children
@@ -1434,7 +1430,7 @@ var Skeleton = React32__namespace.forwardRef(
       {
         ref,
         "data-loading": true,
-        className: cn(SKELETON_CLASSES, children ? "[&_*]:invisible" : "min-h-5", cls),
+        className: ui.cn(SKELETON_CLASSES, children ? "[&_*]:invisible" : "min-h-5", cls),
         style: mergedStyle,
         ...htmlRest,
         children
@@ -1451,7 +1447,7 @@ var SkeletonCircle = React32__namespace.forwardRef(
       {
         ref,
         loading,
-        className: cn("rounded-full shrink-0", className),
+        className: ui.cn("rounded-full shrink-0", className),
         style: { width: dimension, height: dimension, ...rest.style },
         ...rest
       }
@@ -1461,11 +1457,11 @@ var SkeletonCircle = React32__namespace.forwardRef(
 var SkeletonText = React32__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(
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: ui.cn("flex w-full flex-col gap-2", className), ...rest, children: Array.from({ length: noOfLines }).map((_, index) => /* @__PURE__ */ jsxRuntime.jsx(
       Skeleton,
       {
         loading,
-        className: cn("h-4", index === noOfLines - 1 && "max-w-[80%]")
+        className: ui.cn("h-4", index === noOfLines - 1 && "max-w-[80%]")
       },
       index
     )) });
@@ -2520,40 +2516,40 @@ function stripUtmParams(url) {
   }
 }
 var VARIANT_CLASSES2 = {
-  primary: cn(
+  primary: ui.cn(
     "text-[var(--color-link-primary)]",
     "hover:no-underline hover:text-[var(--color-link-primary-hover)]",
     "data-[hover]:no-underline data-[hover]:text-[var(--color-link-primary-hover)]"
   ),
-  secondary: cn(
+  secondary: ui.cn(
     "text-[var(--color-link-secondary)]",
     "hover:no-underline hover:text-[var(--color-hover)]",
     "data-[hover]:no-underline data-[hover]:text-[var(--color-hover)]"
   ),
-  subtle: cn(
+  subtle: ui.cn(
     "text-[var(--color-link-subtle)]",
     "hover:text-[var(--color-link-subtle-hover)] hover:underline hover:decoration-[var(--color-link-subtle-hover)]",
     "data-[hover]:text-[var(--color-link-subtle-hover)] data-[hover]:underline data-[hover]:decoration-[var(--color-link-subtle-hover)]"
   ),
-  underlaid: cn(
+  underlaid: ui.cn(
     "text-[var(--color-link-primary)] bg-[var(--color-link-underlaid-bg)]",
     "px-2 py-1.5 rounded-md text-sm",
     "hover:text-[var(--color-link-primary-hover)] hover:no-underline",
     "data-[hover]:text-[var(--color-link-primary-hover)] data-[hover]:no-underline"
   ),
-  menu: cn(
+  menu: ui.cn(
     "text-[var(--color-link-menu)]",
     "hover:text-[var(--color-hover)] hover:no-underline",
     "data-[hover]:text-[var(--color-hover)] data-[hover]:no-underline"
   ),
-  navigation: cn(
+  navigation: ui.cn(
     "text-[var(--color-link-nav-fg)] bg-transparent",
     "hover:text-[var(--color-link-nav-fg-hover)] hover:no-underline",
     "data-[hover]:text-[var(--color-link-nav-fg-hover)] data-[hover]:no-underline",
     "data-[selected]:text-[var(--color-link-nav-fg-selected)] data-[selected]:bg-[var(--color-link-nav-bg-selected)]",
     "data-[active]:text-[var(--color-link-nav-fg-active)]"
   ),
-  plain: cn(
+  plain: ui.cn(
     "text-inherit",
     "hover:no-underline",
     "data-[hover]:no-underline"
@@ -2563,7 +2559,7 @@ var BASE_CLASSES2 = "inline-flex items-center gap-0 cursor-pointer data-[disable
 var LinkExternalIcon = ({ color }) => /* @__PURE__ */ jsxRuntime.jsx(
   ArrowIcon,
   {
-    className: cn(
+    className: ui.cn(
       "size-3 align-middle shrink-0",
       "group-hover:text-inherit"
     ),
@@ -2628,7 +2624,7 @@ var Link = React32__namespace.default.forwardRef(
     if (_minW !== void 0) shimStyle.minWidth = typeof _minW === "number" ? `${_minW * SPACING}px` : _minW;
     if (_justifyContent) shimStyle.justifyContent = _justifyContent;
     if (_position) shimStyle.position = _position;
-    const linkClasses = cn(BASE_CLASSES2, VARIANT_CLASSES2[variant], className);
+    const linkClasses = ui.cn(BASE_CLASSES2, VARIANT_CLASSES2[variant], className);
     const linkStyle = Object.keys(shimStyle).length > 0 ? shimStyle : void 0;
     if (external) {
       const processedHref = typeof href === "string" ? stripUtmParams(href) : href;
@@ -2636,7 +2632,7 @@ var Link = React32__namespace.default.forwardRef(
         "a",
         {
           href: processedHref,
-          className: cn("group", linkClasses),
+          className: ui.cn("group", linkClasses),
           style: linkStyle,
           target: "_blank",
           rel: "noopener noreferrer",
@@ -2680,7 +2676,7 @@ var LinkBox = React32__namespace.default.forwardRef(
       "div",
       {
         ref,
-        className: cn("relative", className),
+        className: ui.cn("relative", className),
         ...rest
       }
     );
@@ -2716,7 +2712,7 @@ var LinkOverlay = React32__namespace.default.forwardRef(
       position: _p2,
       ...rest
     } = props;
-    const overlayClasses = cn(
+    const overlayClasses = ui.cn(
       BASE_CLASSES2,
       VARIANT_CLASSES2[variant],
       // Static positioning with a ::before pseudo-element that covers the LinkBox
@@ -3005,7 +3001,7 @@ var DialogContent = React32__namespace.forwardRef(function DialogContent2(props,
     /* @__PURE__ */ jsxRuntime.jsx(
       "div",
       {
-        className: cn(
+        className: ui.cn(
           "fixed inset-0 z-[1400] flex w-screen h-dvh",
           "items-start lg:items-center justify-center",
           "overflow-hidden"
@@ -3015,7 +3011,7 @@ var DialogContent = React32__namespace.forwardRef(function DialogContent2(props,
           {
             ref,
             unstyled: true,
-            className: cn(
+            className: ui.cn(
               // Base content styles
               "relative flex flex-col w-full p-6 outline-none text-base",
               "bg-dialog-bg text-dialog-fg shadow-lg rounded-xl",
@@ -3046,7 +3042,7 @@ var DialogHeader = React32__namespace.forwardRef(function DialogHeader2(props, r
     "div",
     {
       ref,
-      className: cn(
+      className: ui.cn(
         "flex-none p-0 mb-2 flex items-center gap-x-2 min-h-[40px]",
         className
       ),
@@ -3057,7 +3053,7 @@ var DialogHeader = React32__namespace.forwardRef(function DialogHeader2(props, r
           gui.Dialog.Title,
           {
             unstyled: true,
-            className: cn(
+            className: ui.cn(
               "text-base lg:text-lg font-medium",
               "whitespace-nowrap overflow-hidden text-ellipsis"
             ),
@@ -3080,7 +3076,7 @@ var DialogBody = React32__namespace.forwardRef(function DialogBody2({ className,
     "div",
     {
       ref,
-      className: cn("flex-1 p-0 overflow-auto", className),
+      className: ui.cn("flex-1 p-0 overflow-auto", className),
       style: Object.keys(bodyStyle).length > 0 ? bodyStyle : void 0,
       ...props
     }
@@ -3091,7 +3087,7 @@ var DialogFooter = React32__namespace.forwardRef(function DialogFooter2({ classN
     "div",
     {
       ref,
-      className: cn("flex items-center justify-start gap-6 p-0 mt-6", className),
+      className: ui.cn("flex items-center justify-start gap-6 p-0 mt-6", className),
       ...props
     }
   );
@@ -3640,7 +3636,7 @@ var Image = React32__namespace.default.forwardRef(
           alt: alt || "",
           onError: handleLoadError,
           onLoad: handleLoadSuccess,
-          className: cn(className),
+          className: ui.cn(className),
           style: mergedStyle,
           ...extraProps
         }
@@ -3843,7 +3839,7 @@ var BOX = {
   hoverStyle: { borderColor: "var(--color-input-border-hover)" },
   focusStyle: {
     borderColor: "var(--color-input-border-focus)",
-    boxShadow: "0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)"
+    boxShadow: "var(--shadow-md)"
   },
   disabledStyle: { opacity: 0.4 }
 };
@@ -4083,7 +4079,7 @@ var PopoverContent = React32__namespace.forwardRef(function PopoverContent2(prop
     {
       ref,
       unstyled: true,
-      className: cn(
+      className: ui.cn(
         "z-50 rounded-lg border border-[var(--color-popover-border,var(--color-border-divider))]",
         "bg-[var(--color-popover-bg,var(--color-dialog-bg))]",
         "shadow-[var(--shadow-popover)]",
@@ -4106,7 +4102,7 @@ var PopoverArrow = React32__namespace.forwardRef(function PopoverArrow2(props, r
     {
       ref,
       unstyled: true,
-      className: cn("fill-[var(--color-popover-bg,var(--color-dialog-bg))]", className),
+      className: ui.cn("fill-[var(--color-popover-bg,var(--color-dialog-bg))]", className),
       ...rest
     }
   );
@@ -4117,7 +4113,7 @@ var PopoverCloseTrigger = React32__namespace.forwardRef(function PopoverCloseTri
     gui.Popover.Close,
     {
       unstyled: true,
-      className: cn("absolute top-1 right-1", className),
+      className: ui.cn("absolute top-1 right-1", className),
       ...rest,
       asChild: true,
       ref,
@@ -4164,7 +4160,7 @@ var PopoverBody = React32__namespace.forwardRef(function PopoverBody2(props, ref
     "div",
     {
       ref,
-      className: cn("p-4", className),
+      className: ui.cn("p-4", className),
       style: Object.keys(bodyStyle).length > 0 ? bodyStyle : void 0,
       ...rest
     }
@@ -4176,7 +4172,7 @@ var PopoverHeader = React32__namespace.forwardRef(function PopoverHeader2(props,
     "div",
     {
       ref,
-      className: cn("px-4 pt-4 pb-0 font-semibold", className),
+      className: ui.cn("px-4 pt-4 pb-0 font-semibold", className),
       ...rest
     }
   );
@@ -4187,7 +4183,7 @@ var PopoverFooter = React32__namespace.forwardRef(function PopoverFooter2(props,
     "div",
     {
       ref,
-      className: cn("px-4 pb-4 pt-0", className),
+      className: ui.cn("px-4 pb-4 pt-0", className),
       ...rest
     }
   );
@@ -4198,7 +4194,7 @@ var PopoverTitle = React32__namespace.forwardRef(function PopoverTitle2(props, r
     "h3",
     {
       ref,
-      className: cn("text-base font-semibold", className),
+      className: ui.cn("text-base font-semibold", className),
       ...rest
     }
   );
@@ -4209,7 +4205,7 @@ var PopoverDescription = React32__namespace.forwardRef(function PopoverDescripti
     "p",
     {
       ref,
-      className: cn("text-sm", className),
+      className: ui.cn("text-sm", className),
       ...rest
     }
   );
@@ -4351,7 +4347,7 @@ var ProgressCircleRing = React32__namespace.forwardRef(function ProgressCircleRi
       width: size,
       height: size,
       viewBox: `0 0 ${size} ${size}`,
-      className: value === null ? cn("lux-spin", className) : className,
+      className: value === null ? ui.cn("lux-spin", className) : className,
       ...rest,
       children: [
         /* @__PURE__ */ jsxRuntime.jsx(
@@ -4601,7 +4597,7 @@ function FilterInput({ placeholder, initialValue = "", onChange }) {
       placeholder,
       value,
       onChange: handleChange,
-      className: cn(
+      className: ui.cn(
         "w-full px-3 py-2 text-sm outline-none",
         "bg-transparent border-b border-[var(--color-border-divider)]",
         "placeholder:text-[var(--color-input-placeholder)]"
@@ -4714,7 +4710,7 @@ var SelectRoot = React32__namespace.forwardRef(
           "div",
           {
             ref,
-            className: cn("relative inline-flex", className),
+            className: ui.cn("relative inline-flex", className),
             style: inlineStyle,
             "data-invalid": invalid || void 0,
             "data-disabled": disabled || void 0,
@@ -4739,7 +4735,7 @@ var SelectControl = React32__namespace.forwardRef(
         ref,
         asChild,
         unstyled: true,
-        className: cn(
+        className: ui.cn(
           "group peer inline-flex items-center gap-2 cursor-pointer",
           "rounded-lg text-sm transition-colors outline-none",
           "border border-[var(--color-input-border)] bg-[var(--color-input-bg)] text-[var(--color-input-fg)]",
@@ -4778,7 +4774,7 @@ var SelectClearTrigger = React32__namespace.forwardRef(
         ref,
         type: "button",
         onClick: handleClick,
-        className: cn("pointer-events-auto", className),
+        className: ui.cn("pointer-events-auto", className),
         "aria-label": "Clear selection",
         ...rest,
         children: /* @__PURE__ */ jsxRuntime.jsx("svg", { className: "h-5 w-5", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M18 6L6 18M6 6l12 12", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round" }) })
@@ -4797,7 +4793,7 @@ var SelectContent = React32__namespace.forwardRef(
       /* @__PURE__ */ jsxRuntime.jsx(gui.Select.Content, { ...rest, children: /* @__PURE__ */ jsxRuntime.jsx(
         gui.Select.Viewport,
         {
-          className: cn(
+          className: ui.cn(
             "min-w-[8rem] overflow-hidden rounded-lg p-1",
             "bg-[var(--color-popover-bg)] shadow-[var(--shadow-popover)]",
             "border border-[var(--color-border-divider)]",
@@ -4824,7 +4820,7 @@ var SelectItem = React32__namespace.forwardRef(
         ref,
         index: index ?? 0,
         value: item.value,
-        className: cn(
+        className: ui.cn(
           "relative flex cursor-pointer select-none items-center gap-2",
           "rounded-md px-3 py-2 text-sm outline-none",
           "text-[var(--color-text-primary)]",
@@ -4858,7 +4854,7 @@ var SelectValueText = React32__namespace.forwardRef(
         const label = size === "lg" ? /* @__PURE__ */ jsxRuntime.jsx(
           "span",
           {
-            className: cn(
+            className: ui.cn(
               "text-xs block",
               invalid ? "text-[var(--color-text-error)]" : "text-[var(--color-input-placeholder)]"
             ),
@@ -4892,7 +4888,7 @@ var SelectValueText = React32__namespace.forwardRef(
       {
         ref,
         placeholder: placeholderText,
-        className: cn("flex flex-col justify-center min-w-0 truncate", className),
+        className: ui.cn("flex flex-col justify-center min-w-0 truncate", className),
         ...rest,
         children: content
       }
@@ -4902,7 +4898,7 @@ var SelectValueText = React32__namespace.forwardRef(
 var SelectItemGroup = React32__namespace.forwardRef(
   function SelectItemGroup2(props, ref) {
     const { children, label, className, ...rest } = props;
-    return /* @__PURE__ */ jsxRuntime.jsxs(gui.Select.Group, { ref, className: cn("py-1", className), ...rest, children: [
+    return /* @__PURE__ */ jsxRuntime.jsxs(gui.Select.Group, { ref, className: ui.cn("py-1", className), ...rest, children: [
       /* @__PURE__ */ jsxRuntime.jsx(gui.Select.Label, { className: "px-3 py-1.5 text-xs font-medium text-[var(--color-text-secondary)]", children: label }),
       children
     ] });
@@ -5091,7 +5087,7 @@ var Slider = React32__namespace.forwardRef(
                 borderWidth: 2,
                 borderColor: ACTIVE,
                 backgroundColor: WHITE,
-                boxShadow: "0 1px 2px 0 rgba(0,0,0,0.05)",
+                boxShadow: "var(--shadow-sm)",
                 transition: "quick",
                 hoverStyle: { borderColor: ACTIVE_HOVER },
                 focusStyle: { outlineWidth: 2, outlineStyle: "solid", outlineColor: ACTIVE, outlineOffset: 2 },
@@ -5216,7 +5212,7 @@ var SwitchBase = React32__namespace.forwardRef(
                     height: s.thumb,
                     borderRadius: 9999,
                     backgroundColor: WHITE2,
-                    boxShadow: "0 1px 2px 0 rgba(0,0,0,0.05)",
+                    boxShadow: "var(--shadow-sm)",
                     children: thumbLabel && /* @__PURE__ */ jsxRuntime.jsx(gui.Text, { width: "100%", height: "100%", textAlign: "center", fontSize: 8, children: checkedState ? thumbLabel.on : thumbLabel.off })
                   }
                 )
@@ -5437,7 +5433,7 @@ var TableRoot = React32__namespace.forwardRef(
       "table",
       {
         ref,
-        className: cn("w-full border-collapse text-sm", className),
+        className: ui.cn("w-full border-collapse text-sm", className),
         style: merged,
         ...rest,
         children
@@ -5454,7 +5450,7 @@ var TableHeader = React32__namespace.forwardRef(
       "thead",
       {
         ref,
-        className: cn("", className),
+        className: ui.cn("", className),
         style: merged,
         ...rest,
         children
@@ -5471,7 +5467,7 @@ var TableBody = React32__namespace.forwardRef(
       "tbody",
       {
         ref,
-        className: cn("", className),
+        className: ui.cn("", className),
         style: merged,
         ...rest,
         children
@@ -5488,7 +5484,7 @@ var TableRow = React32__namespace.forwardRef(
       "tr",
       {
         ref,
-        className: cn("", className),
+        className: ui.cn("", className),
         style: merged,
         ...rest,
         children
@@ -5509,7 +5505,7 @@ var TableCell = React32__namespace.forwardRef(
       "td",
       {
         ref,
-        className: cn("px-3 py-2.5 align-top text-sm", className),
+        className: ui.cn("px-3 py-2.5 align-top text-sm", className),
         style: merged,
         ...rest,
         children
@@ -5530,7 +5526,7 @@ var TableColumnHeader = React32__namespace.forwardRef(
       "th",
       {
         ref,
-        className: cn(
+        className: ui.cn(
           "px-3 py-2 text-xs font-semibold uppercase tracking-wider",
           "bg-[var(--color-table-header-bg)] text-[var(--color-table-header-fg)]",
           className
@@ -5554,7 +5550,7 @@ var TableColumnHeaderSortable = (props) => {
       isActive && /* @__PURE__ */ jsxRuntime.jsx(
         "span",
         {
-          className: cn(
+          className: ui.cn(
             "absolute top-0 inline-flex h-full w-4 items-center",
             indicatorPosition === "left" ? "-left-5" : "-right-5",
             isAsc ? "-rotate-90" : "rotate-90"
@@ -5590,7 +5586,7 @@ var TableHeaderSticky = (props) => {
     TableHeader,
     {
       ref,
-      className: cn("sticky z-[1] bg-white dark:bg-black", className),
+      className: ui.cn("sticky z-[1] bg-white dark:bg-black", className),
       style: {
         top: top ? `${top}px` : 0,
         boxShadow: isStuck ? ACTION_BAR_SHADOW : "none",
@@ -5610,7 +5606,7 @@ var TableCaption = React32__namespace.forwardRef(
       "caption",
       {
         ref,
-        className: cn("px-3 py-2 text-sm text-[var(--color-table-header-fg)]", className),
+        className: ui.cn("px-3 py-2 text-sm text-[var(--color-table-header-fg)]", className),
         style: merged,
         ...rest,
         children
@@ -5627,7 +5623,7 @@ var TableFooter = React32__namespace.forwardRef(
       "tfoot",
       {
         ref,
-        className: cn("", className),
+        className: ui.cn("", className),
         style: merged,
         ...rest,
         children
@@ -5642,7 +5638,7 @@ var TableScrollWrapper = React32__namespace.forwardRef(
       "div",
       {
         ref,
-        className: cn("w-full overflow-x-auto", className),
+        className: ui.cn("w-full overflow-x-auto", className),
         ...rest,
         children
       }
@@ -7660,6 +7656,10 @@ var BankPage = gui.styled(gui.View, {
   padding: 16
 });
 
+Object.defineProperty(exports, "cn", {
+  enumerable: true,
+  get: function () { return ui.cn; }
+});
 exports.AccordionItem = AccordionItem;
 exports.AccordionItemContent = AccordionItemContent;
 exports.AccordionItemTrigger = AccordionItemTrigger;
@@ -7812,7 +7812,6 @@ exports.Toaster = Toaster;
 exports.Tooltip = Tooltip;
 exports.UserMenu = UserMenu;
 exports.bankColors = bankColors;
-exports.cn = cn;
 exports.config = config;
 exports.createListCollection = createListCollection;
 exports.currentHost = currentHost;