@optiaxiom/react 1.5.0 → 1.5.2

package/dist/cjs/unstable.js

@@ -3,87 +3,99 @@
 
 var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
-var IconMagnifyingGlass = require('./IconMagnifyingGlass-DdX-kGbo.js');
-require('./assets/src/layers/layers.css.ts.vanilla-Dclj4WBX.css');
-require('./assets/src/breadcrumb/BreadcrumbItem.css.ts.vanilla-hg5woSam.css');
-require('./assets/src/breadcrumb/BreadcrumbLink.css.ts.vanilla-Bb5x75nR.css');
-var reactId = require('@radix-ui/react-id');
-require('./assets/src/cover/Cover.css.ts.vanilla-Bhl8iscl.css');
-require('./assets/src/card/Card.css.ts.vanilla-DRIhuJ1b.css');
-var reactContext = require('@radix-ui/react-context');
+var IconMagnifyingGlass = require('./IconMagnifyingGlass-CacSUrdL.js');
 var reactUseControllableState = require('@radix-ui/react-use-controllable-state');
-var clsx = require('clsx');
-require('./assets/src/card/CardCheckbox.css.ts.vanilla-BQmA1GnW.css');
-require('./assets/src/card/CardHeader.css.ts.vanilla-BKZog4uY.css');
-require('./assets/src/card/CardPreview.css.ts.vanilla-rMcmXL4l.css');
 var downshift = require('downshift');
-require('./assets/src/highlight/Highlight.css.ts.vanilla-DOwxn4GA.css');
-require('./assets/src/inline-input/InlineInput.css.ts.vanilla-BGlStM9W.css');
-require('./assets/src/layout/Layouts.css.ts.vanilla-BlEAI9ha.css');
+var reactContext = require('@radix-ui/react-context');
 var reactComposeRefs = require('@radix-ui/react-compose-refs');
-require('./assets/src/menu/MenuDialogContent.css.ts.vanilla-D8P1_hWq.css');
-require('./assets/src/menu/MenuInput.css.ts.vanilla-rG8GuTkp.css');
+require('./assets/src/layers/layers.css.ts.vanilla-Civa05NT.css');
+require('./assets/src/menu/MenuDialogContent.css.ts.vanilla-DzL9QYXt.css');
+require('./assets/src/menu/MenuInput.css.ts.vanilla-h2ap7D1w.css');
+require('./assets/src/breadcrumb/Breadcrumb.css.ts.vanilla-DUpbZMlu.css');
+require('./assets/src/breadcrumb/BreadcrumbItem.css.ts.vanilla-BwQYNtNR.css');
+var reactId = require('@radix-ui/react-id');
+require('./assets/src/cover/Cover.css.ts.vanilla-B917GpyM.css');
+require('./assets/src/card/Card.css.ts.vanilla-BXn3GyGV.css');
+var clsx = require('clsx');
+require('./assets/src/card/CardCheckbox.css.ts.vanilla-Cc9swtry.css');
+require('./assets/src/card/CardHeader.css.ts.vanilla-CyeV8u85.css');
+require('./assets/src/card/CardPreview.css.ts.vanilla-C6u08X0W.css');
+require('./assets/src/highlight/Highlight.css.ts.vanilla-DckVHko3.css');
+require('./assets/src/inline-input/InlineInput.css.ts.vanilla-DBG0upye.css');
+require('./assets/src/layout/Layouts.css.ts.vanilla-Bk-AKk_C.css');
 var reactSlot = require('@radix-ui/react-slot');
-require('./assets/src/pill/Pill.css.ts.vanilla-OjU6W6Y3.css');
+require('./assets/src/pill/Pill.css.ts.vanilla-BDiGt1qn.css');
 var helpers = require('@dnd-kit/helpers');
 var react = require('@dnd-kit/react');
-require('./assets/src/sortable/Sortable.css.ts.vanilla-DC5LTQ8N.css');
-require('./assets/src/sortable/SortableHandle.css.ts.vanilla-BGpVQBe_.css');
+require('./assets/src/sortable/Sortable.css.ts.vanilla-DgrF6r4-.css');
+require('./assets/src/sortable/SortableHandle.css.ts.vanilla-CXUp0pMb.css');
 var sortable = require('@dnd-kit/react/sortable');
-require('./assets/src/sortable/SortableItem.css.ts.vanilla-6ttddd8f.css');
-require('./assets/src/avatar/AvatarGroup.css.ts.vanilla-BopGCQ-R.css');
-require('./assets/src/actions/ActionsContent.css.ts.vanilla-CQHrzlcL.css');
-require('./assets/src/table/Table.css.ts.vanilla-DRTckl_I.css');
-require('./assets/src/table/TableBody.css.ts.vanilla-CkDN5-4K.css');
-require('./assets/src/table/TableRow.css.ts.vanilla-NYW4Uw9y.css');
-require('./assets/src/table/TableCell.css.ts.vanilla-Bry58N9S.css');
-require('./assets/src/table/TableHeader.css.ts.vanilla-IOX7pyGu.css');
-require('./assets/src/table/TableHeaderCell.css.ts.vanilla-BW37-stS.css');
-require('./assets/src/data-table/DataTableHeaderCell.css.ts.vanilla-DNpXsbZo.css');
+require('./assets/src/sortable/SortableItem.css.ts.vanilla-BfyK8VBg.css');
+require('./assets/src/avatar/AvatarGroup.css.ts.vanilla-CjP4uWdY.css');
+require('./assets/src/actions/ActionsContent.css.ts.vanilla-CvGF514_.css');
+require('./assets/src/table/Table.css.ts.vanilla-BvVvA-0l.css');
+require('./assets/src/table/TableBody.css.ts.vanilla-DabIaLb3.css');
+require('./assets/src/table/TableRow.css.ts.vanilla-DyIpaig8.css');
+require('./assets/src/table/TableCell.css.ts.vanilla-exHiypp2.css');
+require('./assets/src/table/TableHeader.css.ts.vanilla--HgBQDMl.css');
+require('./assets/src/table/TableHeaderCell.css.ts.vanilla-BWxRQAQ6.css');
+require('./assets/src/data-table/DataTableHeaderCell.css.ts.vanilla-1vYxWRKv.css');
 require('react-day-picker');
 require('@radix-ui/react-popper');
 require('@optiaxiom/globals');
 require('@radix-ui/react-tooltip');
-require('./assets/src/calendar/CalendarDayButton.css.ts.vanilla-DVnXE0ON.css');
-require('./assets/src/calendar/CalendarMonths.css.ts.vanilla-Bk3EYZsx.css');
-require('./assets/src/calendar/CalendarNav.css.ts.vanilla-DSb7Uxf2.css');
-require('./assets/src/input/InputControl.css.ts.vanilla-nfmZzL1M.css');
-require('./assets/src/avatar/AvatarGroup.css.ts.vanilla-BopGCQ-R.css');
-require('./assets/src/input/InputRoot.css.ts.vanilla-DV9HPDg-.css');
+require('./assets/src/calendar/Calendar.css.ts.vanilla-DtN3_ehV.css');
+require('./assets/src/calendar/CalendarDayButton.css.ts.vanilla-BL314mBN.css');
+require('./assets/src/calendar/CalendarMonths.css.ts.vanilla-B4Er5kv8.css');
+require('./assets/src/calendar/CalendarNav.css.ts.vanilla-Cb1DMVNp.css');
+require('./assets/src/input/InputControl.css.ts.vanilla-DBw833_v.css');
+require('./assets/src/avatar/AvatarGroup.css.ts.vanilla-CjP4uWdY.css');
+require('./assets/src/input/InputRoot.css.ts.vanilla-eQ2oAvIr.css');
 require('@radix-ui/react-popover');
-require('./assets/src/avatar/AvatarGroup.css.ts.vanilla-BopGCQ-R.css');
-require('./assets/src/toggle-input/ToggleInput.css.ts.vanilla-CCXnMKDM.css');
-require('./assets/src/toggle-input/ToggleInputControl.css.ts.vanilla-CjmvydXp.css');
-require('./assets/src/checkbox/CheckboxControl.css.ts.vanilla-DsEEG4cq.css');
-require('./assets/src/listbox/ListboxCheckboxItem.css.ts.vanilla-CO9UYuYz.css');
-require('./assets/src/listbox/ListboxItem.css.ts.vanilla-C6F6cJM6.css');
-require('./assets/src/listbox/ListboxItemIndicator.css.ts.vanilla-BYQQkUoP.css');
-require('./assets/src/skeleton/Skeleton.css.ts.vanilla-BDczmgVK.css');
+require('./assets/src/avatar/AvatarGroup.css.ts.vanilla-CjP4uWdY.css');
+require('./assets/src/toggle-input/ToggleInput.css.ts.vanilla-eoPceij7.css');
+require('./assets/src/toggle-input/ToggleInputControl.css.ts.vanilla-B-zjJRlF.css');
+require('./assets/src/checkbox/CheckboxControl.css.ts.vanilla-qcoZrDec.css');
+require('./assets/src/listbox/ListboxCheckboxItem.css.ts.vanilla-BTi1iegz.css');
+require('./assets/src/listbox/ListboxItem.css.ts.vanilla-CTxYEg_L.css');
+require('./assets/src/listbox/ListboxItemIndicator.css.ts.vanilla-CIu7N2Mr.css');
+require('./assets/src/skeleton/Skeleton.css.ts.vanilla-BfgQ5fq2.css');
 require('@tanstack/react-virtual');
 require('@radix-ui/react-separator');
-require('./assets/src/separator/Separator.css.ts.vanilla-BqyG84oT.css');
-require('./assets/src/switch/Switch.css.ts.vanilla-BezJzmsV.css');
-require('./assets/src/modal/ModalListbox.css.ts.vanilla-Dwc1LppA.css');
+require('./assets/src/separator/Separator.css.ts.vanilla-DMsXuGAu.css');
+require('./assets/src/switch/Switch.css.ts.vanilla-DhRBupkx.css');
+require('./assets/src/modal/ModalListbox.css.ts.vanilla-BgnugODO.css');
 require('@radix-ui/react-dialog');
-require('./assets/src/dialog/DialogBody.css.ts.vanilla-BMyUtJSV.css');
+require('./assets/src/dialog/DialogBody.css.ts.vanilla-yQEzJWEo.css');
 require('@vanilla-extract/dynamic');
-require('./assets/src/backdrop/Backdrop.css.ts.vanilla-pOrYXbTf.css');
+require('./assets/src/backdrop/Backdrop.css.ts.vanilla-D33wSGgi.css');
 require('@radix-ui/react-dismissable-layer');
 require('@radix-ui/react-focus-guards');
 require('react-remove-scroll');
 require('@radix-ui/react-portal');
-require('./assets/src/dialog/DialogContent.css.ts.vanilla-D0cw8qnd.css');
-require('./assets/src/text/Text.css.ts.vanilla-DuuK1SVw.css');
+require('./assets/src/dialog/DialogContent.css.ts.vanilla-hpJXAAN1.css');
+require('./assets/src/text/Text.css.ts.vanilla-BC9J5flx.css');
 require('@radix-ui/react-visually-hidden');
-require('./assets/src/dialog/DialogHeader.css.ts.vanilla-DDjHJ5Rg.css');
-require('./assets/src/button/ButtonRoot.css.ts.vanilla-O9AqM-cn.css');
-require('./assets/src/button/ButtonLoadable.css.ts.vanilla-BaizcQx4.css');
-require('./assets/src/spinner/Spinner.css.ts.vanilla-rC41IFce.css');
-require('./assets/src/transition/Transition.css.ts.vanilla-BLq6D2sV.css');
+require('./assets/src/dialog/DialogHeader.css.ts.vanilla-BEUYXojv.css');
+require('./assets/src/button/ButtonRoot.css.ts.vanilla-CLFm0omN.css');
+require('./assets/src/button/ButtonLoadable.css.ts.vanilla-B6WvMVkO.css');
+require('./assets/src/spinner/Spinner.css.ts.vanilla-BQNWCClo.css');
+require('./assets/src/transition/Transition.css.ts.vanilla-BGU_i7CP.css');
 require('@optiaxiom/globals/fonts');
-require('./assets/src/sprinkles/properties.css.ts.vanilla-BbsOICsR.css');
-require('./assets/src/box/Box.css.ts.vanilla-DN4ECRY3.css');
-require('./assets/src/link/Link.css.ts.vanilla-BW1It0AR.css');
+require('./assets/src/sprinkles/properties.css.ts.vanilla-dY7X2ULz.css');
+require('./assets/src/box/Box.css.ts.vanilla-CEk-jwDq.css');
+require('./assets/src/link/Link.css.ts.vanilla-C_eRdnPL.css');
+
+const useFocusBookmark = (ref) => {
+  React.useEffect(() => {
+    IconMagnifyingGlass.bookmarks.current.push(ref);
+    return () => {
+      IconMagnifyingGlass.bookmarks.current = IconMagnifyingGlass.bookmarks.current.filter(
+        (bookmark) => bookmark !== ref
+      );
+    };
+  }, [ref]);
+};
 
 const keyNameMap = {
   " ": "space",
@@ -186,214 +198,6 @@ function useHotkeys(hotkeys, tagsToIgnore = ["INPUT", "TEXTAREA", "SELECT"], tri
   }, [hotkeys]);
 }
 
-const Breadcrumb = React.forwardRef(
-  ({ children, className, ...props }, ref) => {
-    const { boxProps, restProps } = IconMagnifyingGlass.extractBoxProps(props);
-    return /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.Box, { asChild: true, className, ...boxProps, children: /* @__PURE__ */ jsxRuntime.jsx("nav", { "aria-label": "Breadcrumb", ref, ...restProps, children: /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.Box, { alignItems: "center", asChild: true, display: "flex", gap: "8", children: /* @__PURE__ */ jsxRuntime.jsx("ol", { children }) }) }) });
-  }
-);
-Breadcrumb.displayName = "@optiaxiom/react/Breadcrumb";
-
-function BreadcrumbEllipsis({ ...props }) {
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    IconMagnifyingGlass.Box,
-    {
-      "aria-hidden": true,
-      color: "fg.tertiary",
-      display: "grid",
-      placeItems: "center",
-      ...props,
-      children: /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.IconEllipsis, {})
-    }
-  );
-}
-BreadcrumbEllipsis.displayName = "@optiaxiom/react/BreadcrumbEllipsis";
-
-var item$1 = IconMagnifyingGlass.recipeRuntime({base:[{alignItems:'center',display:'inline-flex'},'_1tvk1kk']});
-
-const BreadcrumbItem = React.forwardRef(
-  ({ children, className, ...props }, ref) => {
-    const { boxProps, restProps } = IconMagnifyingGlass.extractBoxProps(props);
-    return /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.Box, { asChild: true, ...item$1({}, className), ...boxProps, children: /* @__PURE__ */ jsxRuntime.jsx("li", { ref, ...restProps, children }) });
-  }
-);
-BreadcrumbItem.displayName = "@optiaxiom/react/BreadcrumbItem";
-
-var link = IconMagnifyingGlass.recipeRuntime({base:[{fontSize:'md'},'f68k8j']});
-
-const BreadcrumbLink = React.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.Link, { ...link({}, className), ref, ...props });
-});
-BreadcrumbLink.displayName = "@optiaxiom/react/BreadcrumbLink";
-
-const BreadcrumbPage = React.forwardRef(
-  ({ ...props }, ref) => {
-    return /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.Box, { "aria-current": "page", asChild: true, color: "fg.default", fontSize: "md", children: /* @__PURE__ */ jsxRuntime.jsx("span", { ref, ...props }) });
-  }
-);
-BreadcrumbPage.displayName = "@optiaxiom/react/BreadcrumbPage";
-
-var card = IconMagnifyingGlass.recipeRuntime({base:['s4pjl2',{alignItems:'start',bg:'bg.default',border:'1',borderColor:'border.tertiary',color:'fg.default',fontSize:'md',gap:'8',justifyContent:'flex-start',p:'16'},'_1lxjfv8']});
-
-const [CardProvider, useCardContext] = reactContext.createContext("@optiaxiom/react/Card");
-
-const Card = React.forwardRef(
-  ({ children, className, ...props }, ref) => {
-    const descriptionId = reactId.useId();
-    const labelId = reactId.useId();
-    return /* @__PURE__ */ jsxRuntime.jsx(CardProvider, { descriptionId, labelId, children: /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.ActionsRoot, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.Flex, { ref, ...card({}, className), ...props, children }) }) });
-  }
-);
-Card.displayName = "@optiaxiom/react/Card";
-
-const CardAction = React.forwardRef(
-  ({ children, ...props }, ref) => {
-    return /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.ActionsContent, { flex: "1", ref, ...props, children });
-  }
-);
-CardAction.displayName = "@optiaxiom/react/CardAction";
-
-var checkbox = IconMagnifyingGlass.recipeRuntime({base:['_5tsbs3']});
-
-const CardCheckbox = React.forwardRef(
-  ({ className, onChange, ...props }, ref) => {
-    const labelPrefixId = reactId.useId();
-    const { labelId } = useCardContext("@optiaxiom/react/CardCheckbox");
-    const [checked, setChecked] = reactUseControllableState.useControllableState({
-      caller: "@optiaxiom/react/CardCheckbox",
-      defaultProp: props.defaultChecked,
-      prop: props.checked
-    });
-    return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-      /* @__PURE__ */ jsxRuntime.jsxs(IconMagnifyingGlass.VisuallyHidden, { id: labelPrefixId, children: [
-        "Check to ",
-        checked ? "unselect" : "select"
-      ] }),
-      /* @__PURE__ */ jsxRuntime.jsx(
-        IconMagnifyingGlass.Checkbox,
-        {
-          "aria-labelledby": clsx(labelPrefixId, labelId),
-          onChange: (event) => {
-            onChange?.(event);
-            setChecked(event.target.checked);
-          },
-          ref,
-          ...checkbox({}, className),
-          ...props
-        }
-      )
-    ] });
-  }
-);
-CardCheckbox.displayName = "@optiaxiom/react/CardCheckbox";
-
-const CardFooter = React.forwardRef(
-  ({ children, ...props }, ref) => {
-    return /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.Box, { alignSelf: "stretch", mt: "auto", ref, ...props, children });
-  }
-);
-CardFooter.displayName = "@optiaxiom/react/CardFooter";
-
-var addon = IconMagnifyingGlass.recipeRuntime({base:[{flex:'none',flexDirection:'row',gap:'8'}],variants:{slot:{after:'_19gi6xw',before:'_10btkuo'}}});
-var content$1 = IconMagnifyingGlass.recipeRuntime({base:[{flex:'1'},'imbwr5']});
-var header = IconMagnifyingGlass.recipeRuntime({base:[{alignSelf:'stretch',flexDirection:'row',gap:'12',justifyContent:'space-between'},'_1xurmxj']});
-
-const CardHeader = React.forwardRef(
-  ({ addonAfter, addonBefore, children, className, description, ...props }, ref) => {
-    const { descriptionId, labelId } = useCardContext(
-      "@optiaxiom/react/CardHeader"
-    );
-    return /* @__PURE__ */ jsxRuntime.jsxs(IconMagnifyingGlass.Flex, { ref, ...header({}, className), ...props, children: [
-      /* @__PURE__ */ jsxRuntime.jsxs(IconMagnifyingGlass.Box, { ...content$1(), children: [
-        /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.Heading, { fontSize: "md", fontWeight: "500", id: labelId, level: "2", children }),
-        description && /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.Box, { color: "fg.tertiary", fontSize: "sm", id: descriptionId, children: description })
-      ] }),
-      addonBefore && /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.Flex, { ...addon({ slot: "before" }), children: addonBefore }),
-      addonAfter && /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.Flex, { ...addon({ slot: "after" }), children: addonAfter })
-    ] });
-  }
-);
-CardHeader.displayName = "@optiaxiom/react/CardHeader";
-
-var image = IconMagnifyingGlass.recipeRuntime({base:{objectFit:'cover',rounded:'inherit',size:'full'}});
-
-const CardImage = React.forwardRef(
-  ({ alt = "", asChild, children, className, src, ...props }, ref) => {
-    return /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.Box, { asChild: true, ref, ...image({}, className), ...props, children: asChild ? children : /* @__PURE__ */ jsxRuntime.jsx("img", { alt, src }) });
-  }
-);
-CardImage.displayName = "@optiaxiom/react/CardImage";
-
-const CardLink = React.forwardRef(
-  ({ ...props }, ref) => {
-    return /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.Link, { appearance: "subtle", cover: true, ref, ...props });
-  }
-);
-CardLink.displayName = "@optiaxiom/react/CardLink";
-
-var overlay$1 = IconMagnifyingGlass.recipeRuntime({base:[{display:'flex',flexWrap:'wrap'},'fe2tz7']});
-var preview = IconMagnifyingGlass.recipeRuntime({base:[{alignSelf:'stretch',display:'grid',placeItems:'center'},'_1ubj5vj']});
-
-const CardPreview = React.forwardRef(
-  ({
-    addonBottomLeft,
-    addonBottomRight,
-    addonTopLeft,
-    addonTopRight,
-    children,
-    className,
-    ...props
-  }, ref) => {
-    return /* @__PURE__ */ jsxRuntime.jsxs(IconMagnifyingGlass.Box, { ref, ...preview({}, className), ...props, children: [
-      children,
-      (addonTopLeft || addonTopRight) && /* @__PURE__ */ jsxRuntime.jsxs(IconMagnifyingGlass.Box, { ...overlay$1(), children: [
-        /* @__PURE__ */ jsxRuntime.jsx(
-          IconMagnifyingGlass.Box,
-          {
-            alignItems: "center",
-            alignSelf: "start",
-            display: "flex",
-            justifyContent: "space-between",
-            children: addonTopLeft
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          IconMagnifyingGlass.Box,
-          {
-            alignItems: "center",
-            alignSelf: "start",
-            display: "flex",
-            justifyContent: "space-between",
-            children: addonTopRight
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.Box, { w: "full" }),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          IconMagnifyingGlass.Box,
-          {
-            alignItems: "center",
-            alignSelf: "end",
-            display: "flex",
-            justifyContent: "space-between",
-            children: addonBottomLeft
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          IconMagnifyingGlass.Box,
-          {
-            alignItems: "center",
-            alignSelf: "end",
-            display: "flex",
-            justifyContent: "space-between",
-            children: addonBottomRight
-          }
-        )
-      ] })
-    ] });
-  }
-);
-CardPreview.displayName = "@optiaxiom/react/CardPreview";
-
 const resolveItemProperty = (property, ...context) => typeof property === "function" ? property(...context) : property;
 const [CommandProvider, useCommandContext] = reactContext.createContext("@optiaxiom/react/Command");
 
@@ -494,7 +298,9 @@ function Command({
     itemToString: (item) => item !== null ? resolveItemProperty(item.label, { inputValue }) : "",
     onHighlightedIndexChange({ highlightedIndex: highlightedIndex2, type }) {
       setHighlightedIndex(highlightedIndex2);
-      if (highlightedIndex2 !== -1 && type === downshift.useCombobox.stateChangeTypes.ItemMouseMove) {
+      const item = items[highlightedIndex2];
+      const hasSubOptions = item && (typeof item.subOptions === "function" || !!item.subOptions?.length);
+      if (highlightedIndex2 !== -1 && (!hasSubOptions || type === downshift.useCombobox.stateChangeTypes.ItemMouseMove)) {
         onHover?.(items[highlightedIndex2]);
       }
     },
@@ -671,7 +477,7 @@ const CommandItem = React.forwardRef(
         size,
         tabIndex: -1,
         ...itemProps,
-        ...item.link && { href: item.link },
+        ...item.href && { href: item.href },
         children: IconMagnifyingGlass.decorateChildren(
           { asChild, children },
           (children2) => children2 ?? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
@@ -711,153 +517,14 @@ const CommandListbox = React.forwardRef(
 );
 CommandListbox.displayName = "@optiaxiom/react/CommandListbox";
 
-var mark = IconMagnifyingGlass.recipeRuntime({base:'_1c685zg'});
+const [MenuProvider, useMenuContext] = reactContext.createContext("@optiaxiom/react/Menu");
 
-const useHighlightedChunks = (content, query) => {
-  const terms = React.useMemo(
-    () => (Array.isArray(query) ? query : query ? [query] : []).map((q) => typeof q === "string" ? q.trim() : q).filter(Boolean),
-    [query]
-  );
-  if (terms.length === 0) {
-    return [{ chunk: content, highlighted: false }];
-  }
-  const pattern = new RegExp(
-    "(" + terms.map(
-      (term) => term instanceof RegExp ? term.source : `(?![^<>]*>)(^|\\b)(?=[^/.])${escapeRegExp(term)}`
-    ).join("|") + ")",
-    "gi"
-  );
-  return content.split(pattern).map((chunk) => ({ chunk, highlighted: pattern.test(chunk) }));
-};
-function escapeRegExp(string) {
-  return string.replace(/[/\-\\^$*+?.()|[\]{}]/g, "\\$&");
+function MenuPopover(props) {
+  return /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.Popover, { modal: true, ...props });
 }
+MenuPopover.displayName = "@optiaxiom/react/MenuPopover";
 
-const Highlight = React.forwardRef(
-  ({ children = (chunk) => chunk, content, query, ...props }, ref) => {
-    const chunks = useHighlightedChunks(content || "", query);
-    return /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.Box, { ref, ...props, children: chunks.map(({ chunk, highlighted }, index) => /* @__PURE__ */ jsxRuntime.jsx(React.Fragment, { children: highlighted ? children(
-      /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.Box, { asChild: true, ...mark(), children: /* @__PURE__ */ jsxRuntime.jsx("mark", { children: chunk }) })
-    ) : chunk }, index)) });
-  }
-);
-Highlight.displayName = "@optiaxiom/react/Highlight";
-
-var editor = IconMagnifyingGlass.recipeRuntime({base:'_4fqrgs',variants:{empty:{false:{},true:'kqwghv'}}});
-var input$1 = IconMagnifyingGlass.recipeRuntime({base:'_1nx10cc'});
-
-const InlineInput = React.forwardRef(
-  ({
-    className,
-    defaultValue = "",
-    disabled,
-    label,
-    multiline,
-    onValueChange,
-    placeholder,
-    value: valueProp,
-    ...props
-  }, ref) => {
-    const [value, setValue] = reactUseControllableState.useControllableState({
-      caller: "@optiaxiom/react/InlineInput",
-      defaultProp: defaultValue,
-      onChange: onValueChange,
-      prop: valueProp
-    });
-    const editorRef = React.useRef(null);
-    React.useEffect(() => {
-      if (!editorRef.current) {
-        return;
-      }
-      const clippedValue = multiline || !value?.includes("\n") ? value : value?.slice(0, value.indexOf("\n"));
-      if (getText(editorRef.current) !== clippedValue) {
-        if (document.activeElement === editorRef.current) {
-          const selection = window.getSelection();
-          if (!selection) {
-            return;
-          }
-          selection.getRangeAt(0).selectNodeContents(editorRef.current);
-          document.execCommand("insertHTML", false, clippedValue);
-        } else {
-          editorRef.current.innerText = clippedValue ?? "null";
-        }
-      }
-    }, [multiline, value]);
-    return /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.Box, { ref, ...input$1({}, className), ...props, children: /* @__PURE__ */ jsxRuntime.jsx(
-      IconMagnifyingGlass.Box,
-      {
-        "aria-multiline": multiline,
-        "aria-readonly": disabled,
-        contentEditable: !disabled && "plaintext-only",
-        "data-placeholder": placeholder ?? label,
-        onInput: (event) => {
-          setValue(getText(event.currentTarget));
-        },
-        onKeyDown: (event) => {
-          if (!multiline && event.key === "Enter") {
-            event.preventDefault();
-          }
-        },
-        onPaste: (event) => {
-          const value2 = event.clipboardData.getData("text");
-          if (!multiline && value2.includes("\n")) {
-            event.preventDefault();
-            const clippedValue = value2.slice(0, value2.indexOf("\n"));
-            document.execCommand("insertHTML", false, clippedValue);
-            setValue(getText(event.currentTarget));
-          }
-        },
-        ref: editorRef,
-        role: "textbox",
-        spellCheck: "true",
-        ...label && { "aria-label": label },
-        ...editor({ empty: !value?.length })
-      }
-    ) });
-  }
-);
-InlineInput.displayName = "@optiaxiom/react/InlineInput";
-function getText(element) {
-  const text = element.innerText;
-  if (text.endsWith("\n")) {
-    return text.slice(0, -1);
-  }
-  return text;
-}
-
-var layout = IconMagnifyingGlass.recipeRuntime({base:[{bg:'bg.page',display:'flex',flexDirection:'column',fontSize:'md'},'_13wtcwb']});
-
-const Layout = React.forwardRef(
-  ({ children, className, header, sidebar, ...props }, ref) => {
-    return /* @__PURE__ */ jsxRuntime.jsxs(IconMagnifyingGlass.Box, { ref, ...layout({}, className), ...props, children: [
-      header,
-      /* @__PURE__ */ jsxRuntime.jsxs(
-        IconMagnifyingGlass.Box,
-        {
-          alignItems: "stretch",
-          display: "flex",
-          flex: "1",
-          flexDirection: "row",
-          overflow: "auto",
-          children: [
-            sidebar,
-            /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.Box, { flex: "1", overflow: "auto", px: "32", py: "24", children })
-          ]
-        }
-      )
-    ] });
-  }
-);
-Layout.displayName = "@optiaxiom/react/Layout";
-
-const [MenuProvider, useMenuContext] = reactContext.createContext("@optiaxiom/react/Menu");
-
-function MenuPopover(props) {
-  return /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.Popover, { modal: true, ...props });
-}
-MenuPopover.displayName = "@optiaxiom/react/MenuPopover";
-
-const [MenuSubProvider, useMenuSubContext] = reactContext.createContext("@optiaxiom/react/MenuSub");
+const [MenuSubProvider, useMenuSubContext] = reactContext.createContext("@optiaxiom/react/MenuSub");
 
 function Menu({
   children,
@@ -1022,7 +689,7 @@ function Menu({
 }
 Menu.displayName = "@optiaxiom/react/Menu";
 
-var content = IconMagnifyingGlass.recipeRuntime({base:'lp6tc4'});
+var content$1 = IconMagnifyingGlass.recipeRuntime({base:'wg0nw9'});
 
 const MenuDialogContent = React.forwardRef(
   ({
@@ -1034,7 +701,7 @@ const MenuDialogContent = React.forwardRef(
     sideOffset: _sideOffset,
     ...props
   }, ref) => {
-    return /* @__PURE__ */ jsxRuntime.jsxs(IconMagnifyingGlass.DialogContent, { ref, ...content({}, className), ...props, children: [
+    return /* @__PURE__ */ jsxRuntime.jsxs(IconMagnifyingGlass.DialogContent, { ref, ...content$1({}, className), ...props, children: [
       children,
       /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.VisuallyHidden, { tabIndex: -1, children: /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.DialogHeader, { children: ariaLabel }) })
     ] });
@@ -1042,7 +709,7 @@ const MenuDialogContent = React.forwardRef(
 );
 MenuDialogContent.displayName = "@optiaxiom/react/MenuDialogContent";
 
-var input = IconMagnifyingGlass.recipeRuntime({variants:{size:{sm:{m:'4'},lg:[{border:'0',borderB:'1',borderColor:'border.secondary',rounded:'none'},'_17xoloo']}}});
+var input$1 = IconMagnifyingGlass.recipeRuntime({variants:{size:{sm:{m:'4'},lg:[{border:'0',borderB:'1',borderColor:'border.secondary',rounded:'none'},'_19rp306']}}});
 
 const MenuInput = React.forwardRef(
   ({ className, onKeyDown, ...props }, outerRef) => {
@@ -1053,6 +720,7 @@ const MenuInput = React.forwardRef(
       "@optiaxiom/react/MenuInput"
     );
     const ref = reactComposeRefs.useComposedRefs(inputRef, outerRef);
+    useFocusBookmark(inputRef);
     const [minWidth, setMinWidth] = React.useState(160);
     const containerRef = React.useRef(null);
     React.useEffect(() => {
@@ -1090,7 +758,7 @@ const MenuInput = React.forwardRef(
         },
         ref,
         size: size === "sm" ? "md" : "xl",
-        ...input({ size }, className),
+        ...input$1({ size }, className),
         ...props
       }
     ) });
@@ -1099,7 +767,7 @@ const MenuInput = React.forwardRef(
 MenuInput.displayName = "@optiaxiom/react/MenuInput";
 
 const MenuCheckboxItem = React.forwardRef(({ children, ...props }, ref) => {
-  const Comp = props.item.link ? "a" : "div";
+  const Comp = props.item.href ? "a" : "div";
   const { inputValue } = useCommandContext("@optiaxiom/react/MenuCheckboxItem");
   return /* @__PURE__ */ jsxRuntime.jsx(CommandItem, { asChild: true, ref, ...props, children: /* @__PURE__ */ jsxRuntime.jsx(
     IconMagnifyingGlass.ListboxCheckboxItem,
@@ -1108,7 +776,7 @@ const MenuCheckboxItem = React.forwardRef(({ children, ...props }, ref) => {
       asChild: true,
       description: props.item.description,
       onCheckedChange: () => !resolveItemProperty(props.item.disabledReason) && props.item.execute?.({ dismiss: false, inputValue }),
-      children: /* @__PURE__ */ jsxRuntime.jsx(Comp, { ...props.item.link && { href: props.item.link }, children })
+      children: /* @__PURE__ */ jsxRuntime.jsx(Comp, { ...props.item.href && { href: props.item.href }, children })
     }
   ) });
 });
@@ -1116,7 +784,7 @@ MenuCheckboxItem.displayName = "@optiaxiom/react/MenuCheckboxItem";
 
 const MenuItem = React.forwardRef(
   ({ children, ...props }, ref) => {
-    const Comp = props.item.link ? "a" : "div";
+    const Comp = props.item.href ? "a" : "div";
     return /* @__PURE__ */ jsxRuntime.jsx(CommandItem, { asChild: true, ref, ...props, children: /* @__PURE__ */ jsxRuntime.jsx(
       IconMagnifyingGlass.ListboxItem,
       {
@@ -1124,7 +792,7 @@ const MenuItem = React.forwardRef(
         asChild: true,
         description: props.item.description,
         intent: props.item.intent,
-        children: /* @__PURE__ */ jsxRuntime.jsx(Comp, { ...props.item.link && { href: props.item.link }, children })
+        children: /* @__PURE__ */ jsxRuntime.jsx(Comp, { ...props.item.href && { href: props.item.href }, children })
       }
     ) });
   }
@@ -1133,14 +801,14 @@ MenuItem.displayName = "@optiaxiom/react/MenuItem";
 
 const MenuRadioItem = React.forwardRef(
   ({ children, ...props }, ref) => {
-    const Comp = props.item.link ? "a" : "div";
+    const Comp = props.item.href ? "a" : "div";
     return /* @__PURE__ */ jsxRuntime.jsx(CommandItem, { asChild: true, ref, ...props, children: /* @__PURE__ */ jsxRuntime.jsx(
       IconMagnifyingGlass.ListboxRadioItem,
       {
         addonBefore: props.item.addon,
         asChild: true,
         description: props.item.description,
-        children: /* @__PURE__ */ jsxRuntime.jsx(Comp, { ...props.item.link && { href: props.item.link }, children })
+        children: /* @__PURE__ */ jsxRuntime.jsx(Comp, { ...props.item.href && { href: props.item.href }, children })
       }
     ) });
   }
@@ -1148,11 +816,14 @@ const MenuRadioItem = React.forwardRef(
 MenuRadioItem.displayName = "@optiaxiom/react/MenuRadioItem";
 
 const MenuSubInput = React.forwardRef(
-  ({ onKeyDown, ...props }, ref) => {
+  ({ onKeyDown, ...props }, outerRef) => {
     const { downshift, highlightedItem } = useCommandContext(
       "@optiaxiom/react/MenuSubInput"
     );
     const { setOpen } = useMenuSubContext("@optiaxiom/react/MenuSubInput");
+    const innerRef = React.useRef(null);
+    const ref = reactComposeRefs.useComposedRefs(innerRef, outerRef);
+    useFocusBookmark(innerRef);
     return /* @__PURE__ */ jsxRuntime.jsx(
       CommandInput,
       {
@@ -1190,25 +861,19 @@ const MenuSubContent = React.forwardRef(
       "@optiaxiom/react/MenuSubContent"
     );
     const {
-      highlightedItem,
+      highlightedItem: item,
       inputValue: parentInputValue,
       setInputValue: setParentInputValue
     } = useCommandContext("@optiaxiom/react/MenuSubContent");
     const {
       contentRef: parentContentRef,
       inputRef: parentInputRef,
-      open: parentSubMenuOpen,
       triggerRef: parentTriggerRef
     } = useMenuSubContext("@optiaxiom/react/MenuSubContent");
     const { open, presence } = IconMagnifyingGlass.usePopoverContext(
       "@optiaxiom/react/MenuSubContent"
     );
     const ref = reactComposeRefs.useComposedRefs(parentContentRef, outerRef);
-    const itemRef = React.useRef(highlightedItem);
-    if (parentSubMenuOpen && highlightedItem && (typeof highlightedItem.subOptions === "function" || !!highlightedItem.subOptions?.length)) {
-      itemRef.current = highlightedItem;
-    }
-    const item = itemRef.current;
     const [inputValue, setInputValue] = React.useState("");
     const options = React.useMemo(
       () => resolveItemProperty(item?.subOptions, { inputValue }) ?? [],
@@ -1239,11 +904,7 @@ const MenuSubContent = React.forwardRef(
         {
           align,
           alignOffset: item.subOptionsInputVisible ? -46 : -4,
-          minW: "trigger",
           onCloseAutoFocus: (event) => {
-            if (parentSubMenuOpen) {
-              return;
-            }
             event.preventDefault();
             parentInputRef.current?.focus();
           },
@@ -1256,6 +917,7 @@ const MenuSubContent = React.forwardRef(
               return;
             }
             event.preventDefault();
+            inputRef.current?.focus();
           },
           onPointerEnter: () => {
             if (item.subOptionsInputVisible) {
@@ -1438,37 +1100,33 @@ const MenuListbox = React.forwardRef(
 );
 MenuListbox.displayName = "@optiaxiom/react/MenuListbox";
 
-const MenuPopoverContent = React.forwardRef(({ style, ...props }, outerRef) => {
-  const { open } = useMenuContext("@optiaxiom/react/MenuPopoverContent");
+const MenuPopoverContentImpl = React.forwardRef(({ children, ...props }, outerRef) => {
+  const { side } = IconMagnifyingGlass.usePopoverContentContext(
+    "@optiaxiom/react/MenuPopoverContentImpl"
+  );
   const innerRef = React.useRef(null);
   const ref = reactComposeRefs.useComposedRefs(innerRef, outerRef);
-  const [minHeight, setMinHeight] = React.useState(0);
   React.useEffect(() => {
-    if (!open || props.side === "top") {
+    if (!innerRef.current || side !== "top") {
       return;
     }
     const observer = new ResizeObserver((entries) => {
-      for (const entry of entries) {
-        setMinHeight(entry.borderBoxSize[0].blockSize);
+      if (!innerRef.current) {
+        return;
       }
-    });
-    setMinHeight(0);
-    requestAnimationFrame(() => {
-      if (innerRef.current?.dataset.side === "top") {
-        observer.observe(innerRef.current);
+      for (const entry of entries) {
+        innerRef.current.style.minHeight = `${entry.borderBoxSize[0].blockSize}px`;
       }
     });
+    observer.observe(innerRef.current);
     return () => observer.disconnect();
-  }, [open, props.side]);
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    IconMagnifyingGlass.PopoverContent,
-    {
-      minW: "trigger",
-      ref,
-      style: { ...style, minHeight },
-      ...props
-    }
-  );
+  }, [side]);
+  return /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.Box, { ref, ...props, children });
+});
+MenuPopoverContentImpl.displayName = "@optiaxiom/react/MenuPopoverContentImpl";
+
+const MenuPopoverContent = React.forwardRef(({ children, ...props }, ref) => {
+  return /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.PopoverContent, { asChild: true, ref, ...props, children: /* @__PURE__ */ jsxRuntime.jsx(MenuPopoverContentImpl, { children }) });
 });
 MenuPopoverContent.displayName = "@optiaxiom/react/MenuPopoverContent";
 
@@ -1477,9 +1135,7 @@ const MenuContent = React.forwardRef(
     const innerRef = React.useRef(null);
     const ref = reactComposeRefs.useComposedRefs(innerRef, outerRef);
     const { labelId } = IconMagnifyingGlass.useFieldContext("@optiaxiom/react/MenuContent");
-    const { activeItemStack, inputVisible, placeholder, size } = useMenuContext(
-      "@optiaxiom/react/MenuContent"
-    );
+    const { activeItemStack, inputRef, inputVisible, placeholder, size } = useMenuContext("@optiaxiom/react/MenuContent");
     const { empty, loading } = useCommandContext(
       "@optiaxiom/react/MenuContent"
     );
@@ -1503,6 +1159,7 @@ const MenuContent = React.forwardRef(
             return;
           }
           event.preventDefault();
+          inputRef.current?.focus();
         },
         overflow: "hidden",
         p: size === "sm" ? "4" : "0",
@@ -1564,7 +1221,368 @@ const MenuTrigger = React.forwardRef(
 );
 MenuTrigger.displayName = "@optiaxiom/react/MenuTrigger";
 
-var pill = IconMagnifyingGlass.recipeRuntime({base:[{alignItems:'center',color:'fg.default',display:'flex',fontSize:'sm',gap:'4',px:'6',rounded:'md',whiteSpace:'nowrap'},'_1q0tpu1'],variants:{size:{xs:{h:'xs'},sm:{h:'sm'}}}});
+var list = IconMagnifyingGlass.recipeRuntime({base:[{alignItems:'center',color:'fg.default',display:'flex',fontSize:'md',gap:'8'},'hokenh']});
+
+var item$1 = IconMagnifyingGlass.recipeRuntime({base:[{alignItems:'center',display:'inline-flex',gap:'4',whiteSpace:'nowrap'},'_1j9zwag']});
+var link = IconMagnifyingGlass.recipeRuntime({base:'_19mm58o'});
+
+const BreadcrumbItem = React.forwardRef(
+  ({ addonAfter, children, className, current, href, ...props }, ref) => {
+    const { boxProps, restProps } = IconMagnifyingGlass.extractBoxProps(props);
+    return /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.Box, { asChild: true, ...item$1({}, className), ...boxProps, children: /* @__PURE__ */ jsxRuntime.jsxs("li", { ref, ...restProps, children: [
+      /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.Tooltip, { auto: true, content: children, children: /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.Text, { asChild: true, truncate: true, children: current || !href ? /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.Box, { "aria-current": current ? "page" : void 0, children }) : /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.Link, { appearance: "subtle", href, ...link(), children }) }) }),
+      addonAfter && /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.Flex, { asChild: true, flex: "none", flexDirection: "row", gap: "4", children: IconMagnifyingGlass.fallbackSpan(addonAfter) })
+    ] }) });
+  }
+);
+BreadcrumbItem.displayName = "@optiaxiom/react/BreadcrumbItem";
+
+const Breadcrumb = React.forwardRef(
+  ({ className, items, maxItems = 3, ...props }, ref) => {
+    const { boxProps, restProps } = IconMagnifyingGlass.extractBoxProps(props);
+    return /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.Box, { asChild: true, className, ...boxProps, children: /* @__PURE__ */ jsxRuntime.jsx("nav", { "aria-label": "Breadcrumb", ref, ...restProps, children: /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.Box, { asChild: true, ...list(), children: /* @__PURE__ */ jsxRuntime.jsx("ol", { children: renderItems(items, maxItems, (item, index) => /* @__PURE__ */ jsxRuntime.jsx(
+      BreadcrumbItem,
+      {
+        addonAfter: item.addonAfter,
+        current: index === items.length - 1,
+        href: item.href,
+        children: item.label
+      }
+    )) }) }) }) });
+  }
+);
+Breadcrumb.displayName = "@optiaxiom/react/Breadcrumb";
+const renderItems = (items, limit = items.length, renderItem) => {
+  if (limit < 0) {
+    limit = 0;
+  }
+  if (limit > items.length || typeof limit !== "number") {
+    limit = items.length;
+  }
+  const boundaries = [
+    0,
+    Math.floor(limit / 2),
+    items.length - Math.ceil(limit / 2),
+    items.length
+  ];
+  return [
+    ...items.slice(boundaries[0], boundaries[1]).map((item, index) => /* @__PURE__ */ jsxRuntime.jsx(React.Fragment, { children: renderItem(item, index) }, "left" + index)),
+    boundaries[2] > boundaries[1] && /* @__PURE__ */ jsxRuntime.jsx(BreadcrumbItem, { children: /* @__PURE__ */ jsxRuntime.jsxs(Menu, { options: items.slice(boundaries[1], boundaries[2]), children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        MenuTrigger,
+        {
+          appearance: "subtle",
+          "aria-label": "More items",
+          icon: /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.Box, { asChild: true, color: "fg.tertiary", children: /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.IconEllipsisSolid, {}) })
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(MenuContent, {})
+    ] }) }, "ellipsis"),
+    ...items.slice(boundaries[2], boundaries[3]).map((item, index) => /* @__PURE__ */ jsxRuntime.jsx(React.Fragment, { children: renderItem(item, boundaries[2] + index) }, "right" + index))
+  ];
+};
+
+var card = IconMagnifyingGlass.recipeRuntime({base:['_13ki7k0',{alignItems:'start',bg:'bg.default',border:'1',borderColor:'border.tertiary',color:'fg.default',fontSize:'md',gap:'8',justifyContent:'flex-start',p:'16'},'_17i0dkz']});
+
+const [CardProvider, useCardContext] = reactContext.createContext("@optiaxiom/react/Card");
+
+const Card = React.forwardRef(
+  ({ children, className, ...props }, ref) => {
+    const descriptionId = reactId.useId();
+    const labelId = reactId.useId();
+    return /* @__PURE__ */ jsxRuntime.jsx(CardProvider, { descriptionId, labelId, children: /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.ActionsRoot, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.Flex, { ref, ...card({}, className), ...props, children }) }) });
+  }
+);
+Card.displayName = "@optiaxiom/react/Card";
+
+const CardAction = React.forwardRef(
+  ({ children, ...props }, ref) => {
+    return /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.ActionsContent, { flex: "1", ref, ...props, children });
+  }
+);
+CardAction.displayName = "@optiaxiom/react/CardAction";
+
+var checkbox = IconMagnifyingGlass.recipeRuntime({base:['_13zh6km']});
+
+const CardCheckbox = React.forwardRef(
+  ({ className, onChange, ...props }, ref) => {
+    const labelPrefixId = reactId.useId();
+    const { labelId } = useCardContext("@optiaxiom/react/CardCheckbox");
+    const [checked, setChecked] = reactUseControllableState.useControllableState({
+      caller: "@optiaxiom/react/CardCheckbox",
+      defaultProp: props.defaultChecked,
+      prop: props.checked
+    });
+    return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(IconMagnifyingGlass.VisuallyHidden, { id: labelPrefixId, children: [
+        "Check to ",
+        checked ? "unselect" : "select"
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        IconMagnifyingGlass.Checkbox,
+        {
+          "aria-labelledby": clsx(labelPrefixId, labelId),
+          onChange: (event) => {
+            onChange?.(event);
+            setChecked(event.target.checked);
+          },
+          ref,
+          ...checkbox({}, className),
+          ...props
+        }
+      )
+    ] });
+  }
+);
+CardCheckbox.displayName = "@optiaxiom/react/CardCheckbox";
+
+const CardFooter = React.forwardRef(
+  ({ children, ...props }, ref) => {
+    return /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.Box, { alignSelf: "stretch", mt: "auto", ref, ...props, children });
+  }
+);
+CardFooter.displayName = "@optiaxiom/react/CardFooter";
+
+var addon = IconMagnifyingGlass.recipeRuntime({base:[{flex:'none',flexDirection:'row',gap:'8'}],variants:{slot:{after:'_14bdu5f',before:'_1jfaj5t'}}});
+var content = IconMagnifyingGlass.recipeRuntime({base:[{flex:'1'},'_18kaifv']});
+var header = IconMagnifyingGlass.recipeRuntime({base:[{alignSelf:'stretch',flexDirection:'row',gap:'12',justifyContent:'space-between'},'_82exht']});
+
+const CardHeader = React.forwardRef(
+  ({ addonAfter, addonBefore, children, className, description, ...props }, ref) => {
+    const { descriptionId, labelId } = useCardContext(
+      "@optiaxiom/react/CardHeader"
+    );
+    return /* @__PURE__ */ jsxRuntime.jsxs(IconMagnifyingGlass.Flex, { ref, ...header({}, className), ...props, children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(IconMagnifyingGlass.Box, { ...content(), children: [
+        /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.Heading, { fontSize: "md", fontWeight: "500", id: labelId, level: "2", children }),
+        description && /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.Box, { color: "fg.tertiary", fontSize: "sm", id: descriptionId, children: description })
+      ] }),
+      addonBefore && /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.Flex, { ...addon({ slot: "before" }), children: addonBefore }),
+      addonAfter && /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.Flex, { ...addon({ slot: "after" }), children: addonAfter })
+    ] });
+  }
+);
+CardHeader.displayName = "@optiaxiom/react/CardHeader";
+
+var image = IconMagnifyingGlass.recipeRuntime({base:{objectFit:'cover',rounded:'inherit',size:'full'}});
+
+const CardImage = React.forwardRef(
+  ({ alt = "", asChild, children, className, src, ...props }, ref) => {
+    return /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.Box, { asChild: true, ref, ...image({}, className), ...props, children: asChild ? children : /* @__PURE__ */ jsxRuntime.jsx("img", { alt, src }) });
+  }
+);
+CardImage.displayName = "@optiaxiom/react/CardImage";
+
+const CardLink = React.forwardRef(
+  ({ ...props }, ref) => {
+    return /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.Link, { appearance: "subtle", cover: true, ref, ...props });
+  }
+);
+CardLink.displayName = "@optiaxiom/react/CardLink";
+
+var overlay$1 = IconMagnifyingGlass.recipeRuntime({base:[{display:'flex',flexWrap:'wrap'},'_19zd54g']});
+var preview = IconMagnifyingGlass.recipeRuntime({base:[{alignSelf:'stretch',display:'grid',placeItems:'center'},'_1kquow4']});
+
+const CardPreview = React.forwardRef(
+  ({
+    addonBottomLeft,
+    addonBottomRight,
+    addonTopLeft,
+    addonTopRight,
+    children,
+    className,
+    ...props
+  }, ref) => {
+    return /* @__PURE__ */ jsxRuntime.jsxs(IconMagnifyingGlass.Box, { ref, ...preview({}, className), ...props, children: [
+      children,
+      (addonTopLeft || addonTopRight) && /* @__PURE__ */ jsxRuntime.jsxs(IconMagnifyingGlass.Box, { ...overlay$1(), children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          IconMagnifyingGlass.Box,
+          {
+            alignItems: "center",
+            alignSelf: "start",
+            display: "flex",
+            justifyContent: "space-between",
+            children: addonTopLeft
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          IconMagnifyingGlass.Box,
+          {
+            alignItems: "center",
+            alignSelf: "start",
+            display: "flex",
+            justifyContent: "space-between",
+            children: addonTopRight
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.Box, { w: "full" }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          IconMagnifyingGlass.Box,
+          {
+            alignItems: "center",
+            alignSelf: "end",
+            display: "flex",
+            justifyContent: "space-between",
+            children: addonBottomLeft
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          IconMagnifyingGlass.Box,
+          {
+            alignItems: "center",
+            alignSelf: "end",
+            display: "flex",
+            justifyContent: "space-between",
+            children: addonBottomRight
+          }
+        )
+      ] })
+    ] });
+  }
+);
+CardPreview.displayName = "@optiaxiom/react/CardPreview";
+
+var mark = IconMagnifyingGlass.recipeRuntime({base:'_1q93uho'});
+
+const useHighlightedChunks = (content, query) => {
+  const terms = React.useMemo(
+    () => (Array.isArray(query) ? query : query ? [query] : []).map((q) => typeof q === "string" ? q.trim() : q).filter(Boolean),
+    [query]
+  );
+  if (terms.length === 0) {
+    return [{ chunk: content, highlighted: false }];
+  }
+  const pattern = new RegExp(
+    "(" + terms.map(
+      (term) => term instanceof RegExp ? term.source : `(?![^<>]*>)(^|\\b)(?=[^/.])${escapeRegExp(term)}`
+    ).join("|") + ")",
+    "gi"
+  );
+  return content.split(pattern).map((chunk) => ({ chunk, highlighted: pattern.test(chunk) }));
+};
+function escapeRegExp(string) {
+  return string.replace(/[/\-\\^$*+?.()|[\]{}]/g, "\\$&");
+}
+
+const Highlight = React.forwardRef(
+  ({ children = (chunk) => chunk, content, query, ...props }, ref) => {
+    const chunks = useHighlightedChunks(content || "", query);
+    return /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.Box, { ref, ...props, children: chunks.map(({ chunk, highlighted }, index) => /* @__PURE__ */ jsxRuntime.jsx(React.Fragment, { children: highlighted ? children(
+      /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.Box, { asChild: true, ...mark(), children: /* @__PURE__ */ jsxRuntime.jsx("mark", { children: chunk }) })
+    ) : chunk }, index)) });
+  }
+);
+Highlight.displayName = "@optiaxiom/react/Highlight";
+
+var editor = IconMagnifyingGlass.recipeRuntime({base:'biri1h',variants:{empty:{false:{},true:'v6j8b8'}}});
+var input = IconMagnifyingGlass.recipeRuntime({base:'hg7nn6'});
+
+const InlineInput = React.forwardRef(
+  ({
+    className,
+    defaultValue = "",
+    disabled,
+    label,
+    multiline,
+    onValueChange,
+    placeholder,
+    value: valueProp,
+    ...props
+  }, ref) => {
+    const [value, setValue] = reactUseControllableState.useControllableState({
+      caller: "@optiaxiom/react/InlineInput",
+      defaultProp: defaultValue,
+      onChange: onValueChange,
+      prop: valueProp
+    });
+    const editorRef = React.useRef(null);
+    React.useEffect(() => {
+      if (!editorRef.current) {
+        return;
+      }
+      const clippedValue = multiline || !value?.includes("\n") ? value : value?.slice(0, value.indexOf("\n"));
+      if (getText(editorRef.current) !== clippedValue) {
+        if (document.activeElement === editorRef.current) {
+          const selection = window.getSelection();
+          if (!selection) {
+            return;
+          }
+          selection.getRangeAt(0).selectNodeContents(editorRef.current);
+          document.execCommand("insertHTML", false, clippedValue);
+        } else {
+          editorRef.current.innerText = clippedValue ?? "null";
+        }
+      }
+    }, [multiline, value]);
+    return /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.Box, { ref, ...input({}, className), ...props, children: /* @__PURE__ */ jsxRuntime.jsx(
+      IconMagnifyingGlass.Box,
+      {
+        "aria-multiline": multiline,
+        "aria-readonly": disabled,
+        contentEditable: !disabled && "plaintext-only",
+        "data-placeholder": placeholder ?? label,
+        onInput: (event) => {
+          setValue(getText(event.currentTarget));
+        },
+        onKeyDown: (event) => {
+          if (!multiline && event.key === "Enter") {
+            event.preventDefault();
+          }
+        },
+        onPaste: (event) => {
+          const value2 = event.clipboardData.getData("text");
+          if (!multiline && value2.includes("\n")) {
+            event.preventDefault();
+            const clippedValue = value2.slice(0, value2.indexOf("\n"));
+            document.execCommand("insertHTML", false, clippedValue);
+            setValue(getText(event.currentTarget));
+          }
+        },
+        ref: editorRef,
+        role: "textbox",
+        spellCheck: "true",
+        ...label && { "aria-label": label },
+        ...editor({ empty: !value?.length })
+      }
+    ) });
+  }
+);
+InlineInput.displayName = "@optiaxiom/react/InlineInput";
+function getText(element) {
+  const text = element.innerText;
+  if (text.endsWith("\n")) {
+    return text.slice(0, -1);
+  }
+  return text;
+}
+
+var layout = IconMagnifyingGlass.recipeRuntime({base:[{bg:'bg.page',display:'flex',flexDirection:'column',fontSize:'md'},'_1n9630q']});
+
+const Layout = React.forwardRef(
+  ({ children, className, header, sidebar, ...props }, ref) => {
+    return /* @__PURE__ */ jsxRuntime.jsxs(IconMagnifyingGlass.Box, { ref, ...layout({}, className), ...props, children: [
+      header,
+      /* @__PURE__ */ jsxRuntime.jsxs(
+        IconMagnifyingGlass.Box,
+        {
+          alignItems: "stretch",
+          display: "flex",
+          flex: "1",
+          flexDirection: "row",
+          overflow: "auto",
+          children: [
+            sidebar,
+            /* @__PURE__ */ jsxRuntime.jsx(IconMagnifyingGlass.Box, { flex: "1", overflow: "auto", px: "32", py: "24", children })
+          ]
+        }
+      )
+    ] });
+  }
+);
+Layout.displayName = "@optiaxiom/react/Layout";
+
+var pill = IconMagnifyingGlass.recipeRuntime({base:[{alignItems:'center',color:'fg.default',display:'flex',fontSize:'sm',gap:'4',px:'6',rounded:'md',whiteSpace:'nowrap'},'nbxhjo'],variants:{size:{xs:{h:'xs'},sm:{h:'sm'}}}});
 
 const Slot = reactSlot.createSlot("@optiaxiom/react/Pill");
 const Pill = React.forwardRef(
@@ -1595,7 +1613,7 @@ const PillGroup = React.forwardRef(
 );
 PillGroup.displayName = "@optiaxiom/react/PillGroup";
 
-var overlay = IconMagnifyingGlass.recipeRuntime({base:['_1ndhykc']});
+var overlay = IconMagnifyingGlass.recipeRuntime({base:['a4j6n8']});
 
 const [SortableProvider, useSortableContext] = reactContext.createContext("@optiaxiom/react/Sortable");
 
@@ -1651,7 +1669,7 @@ const Sortable = React.forwardRef(
 );
 Sortable.displayName = "@optiaxiom/react/Sortable";
 
-var handle = IconMagnifyingGlass.recipeRuntime({base:'_19q9ckt'});
+var handle = IconMagnifyingGlass.recipeRuntime({base:'_1is0nxq'});
 
 const [SortableItemProvider, useSortableItemContext] = reactContext.createContext("@optiaxiom/react/SortableItem");
 
@@ -1676,7 +1694,7 @@ const SortableHandle = React.forwardRef(
 );
 SortableHandle.displayName = "@optiaxiom/react/SortableHandle";
 
-var item = IconMagnifyingGlass.recipeRuntime({base:{transition:'opacity'},variants:{handle:{false:{},true:'xtw579'}}});
+var item = IconMagnifyingGlass.recipeRuntime({base:{transition:'opacity'},variants:{handle:{false:{},true:'mcj5xc'}}});
 
 const SortableItem = React.forwardRef(
   ({ children, className, style, ...props }, outerRef) => {
@@ -1742,10 +1760,6 @@ SpotlightTrigger.displayName = "@optiaxiom/react/SpotlightTrigger";
 exports.Calendar = IconMagnifyingGlass.Calendar;
 exports.DataTableHeaderCell = IconMagnifyingGlass.DataTableHeaderCell;
 exports.Breadcrumb = Breadcrumb;
-exports.BreadcrumbEllipsis = BreadcrumbEllipsis;
-exports.BreadcrumbItem = BreadcrumbItem;
-exports.BreadcrumbLink = BreadcrumbLink;
-exports.BreadcrumbPage = BreadcrumbPage;
 exports.Card = Card;
 exports.CardAction = CardAction;
 exports.CardCheckbox = CardCheckbox;