@ai-matrx/design-system 0.86.334 → 0.86.336

package/dist/item.cjs

@@ -195,6 +195,12 @@ function RadixChevronUpIcon(props) {
     }
   ) });
 }
+function PanelLeftIcon(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("svg", { ...lucideProps("panel-left", props), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("rect", { width: "18", height: "18", x: "3", y: "3", rx: "2" }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M9 3v18" })
+  ] });
+}
 
 // src/cn.ts
 var import_clsx = require("clsx");
@@ -571,7 +577,6 @@ function keepMovedFocus(handler) {
 var import_jsx_runtime6 = require("react/jsx-runtime");
 var DropdownMenu = DropdownMenuPrimitive.Root;
 var DropdownMenuTrigger = DropdownMenuPrimitive.Trigger;
-var DropdownMenuSub = DropdownMenuPrimitive.Sub;
 var MENU_SURFACE_CLASS = "z-[10001] min-w-[8rem] max-h-[var(--radix-dropdown-menu-content-available-height)] overflow-y-auto overflow-x-hidden overscroll-contain rounded-md border bg-popover p-1 text-popover-foreground";
 var MENU_ITEM_CLASS = "relative flex select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:text-disabled-foreground";
 var MENU_INDICATOR_ITEM_CLASS = "relative flex select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:text-disabled-foreground";
@@ -1326,7 +1331,6 @@ var React9 = __toESM(require("react"), 1);
 var import_jsx_runtime11 = require("react/jsx-runtime");
 var ContextMenu = ContextMenuPrimitive.Root;
 var ContextMenuTrigger = ContextMenuPrimitive.Trigger;
-var ContextMenuSub = ContextMenuPrimitive.Sub;
 var SURFACE_CLASS = "z-[10001] min-w-[8rem] max-h-[var(--radix-context-menu-content-available-height)] overflow-y-auto overflow-x-hidden overscroll-contain rounded-md border bg-popover p-1 text-popover-foreground";
 var ITEM_CLASS = "relative flex select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:text-disabled-foreground";
 var INDICATOR_ITEM_CLASS = "relative flex select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:text-disabled-foreground";
@@ -1483,19 +1487,381 @@ var ContextMenuShortcut = ({
 );
 ContextMenuShortcut.displayName = "ContextMenuShortcut";
 
+// src/menu-look.tsx
+var React11 = __toESM(require("react"), 1);
+var DropdownMenuPrimitive2 = __toESM(require("@radix-ui/react-dropdown-menu"), 1);
+var ContextMenuPrimitive2 = __toESM(require("@radix-ui/react-context-menu"), 1);
+
+// src/popover.tsx
+var PopoverPrimitive = __toESM(require("@radix-ui/react-popover"), 1);
+var React10 = __toESM(require("react"), 1);
+var import_jsx_runtime12 = require("react/jsx-runtime");
+var POPOVER_WIDTH_CLASS = {
+  xs: "w-48",
+  sm: "w-60",
+  md: "w-72",
+  lg: "w-80",
+  xl: "w-[26rem]",
+  "2xl": "w-[34rem]"
+};
+var POPOVER_PADDING_CLASS = {
+  none: "p-0",
+  xs: "p-1",
+  sm: "p-2",
+  md: "p-3",
+  default: "p-4"
+};
+var PopoverContent = React10.forwardRef(
+  ({
+    className,
+    align = "center",
+    sideOffset = 4,
+    container,
+    animated = true,
+    sizing = "fixed",
+    surface = "default",
+    width = "md",
+    padding = "default",
+    collisionPadding = 16,
+    onCloseAutoFocus,
+    ...props
+  }, ref) => {
+    const portalContainer = usePortalContainer(container);
+    return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(PopoverPrimitive.Portal, { container: portalContainer, children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+      PopoverPrimitive.Content,
+      {
+        ref,
+        align,
+        sideOffset,
+        collisionPadding,
+        "data-surface": surface === "solid" ? "solid" : void 0,
+        "data-width": sizing === "content" ? void 0 : width,
+        "data-padding": padding,
+        className: cn(
+          // Cap to the viewport space Radix measured and scroll — a popover taller
+          // than the screen must never trap the user with unreachable content.
+          // z must EQUAL the dialog layer (z-[10000]), never exceed it: with equal
+          // z, DOM portal order decides, so a dialog opened FROM a popover stacks
+          // above it, and a popover opened from a dialog still stacks above the
+          // dialog. z-[10001] buried dialogs behind fullscreen popovers.
+          "z-[10000] max-h-[var(--radix-popover-content-available-height)] overflow-y-auto overscroll-contain rounded-md border bg-popover text-popover-foreground shadow-md outline-none",
+          POPOVER_PADDING_CLASS[padding],
+          sizing === "content" ? "w-auto min-w-[min(max(var(--radix-popover-trigger-width),20rem),calc(100vw-2rem))] max-w-[min(28rem,calc(100vw-2rem))]" : cn(POPOVER_WIDTH_CLASS[width], "max-w-[calc(100vw-2rem)]"),
+          surface === "solid" && SOLID_SURFACE_CLASS,
+          animated && MOTION_POPPER,
+          className
+        ),
+        ...props,
+        onCloseAutoFocus: keepMovedFocus(onCloseAutoFocus)
+      }
+    ) });
+  }
+);
+PopoverContent.displayName = PopoverPrimitive.Content.displayName;
+
+// src/menu-look.tsx
+var import_jsx_runtime13 = require("react/jsx-runtime");
+var MENU_LOOK_CLASS = {
+  panel: "cm-menu",
+  item: "cm-item",
+  iconSlot: "cm-icon-slot",
+  icon: "cm-icon",
+  text: "cm-text",
+  label: "cm-label",
+  hint: "cm-hint",
+  current: "cm-current",
+  chevron: "cm-chevron",
+  search: "cm-search",
+  trail: "cm-trail",
+  badge: "cm-badge",
+  shortcut: "cm-shortcut",
+  control: "cm-control",
+  divider: "cm-divider",
+  sectionLabel: "cm-section-label",
+  header: "cm-header",
+  headerMark: "cm-header-mark",
+  headerText: "cm-header-text",
+  headerTitle: "cm-header-title",
+  headerSubtitle: "cm-header-subtitle",
+  danger: "cm-danger",
+  dimmed: "cm-dimmed"
+};
+function MenuLookIconSlot({ children }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: MENU_LOOK_CLASS.iconSlot, children });
+}
+function MenuLookRowBody({ icon, label, labelTitle, description, trail, badge, shortcut, current }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(import_jsx_runtime13.Fragment, { children: [
+    icon ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(MenuLookIconSlot, { children: icon }) : null,
+    /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("span", { className: MENU_LOOK_CLASS.text, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: MENU_LOOK_CLASS.label, title: labelTitle, children: label }),
+      description ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: MENU_LOOK_CLASS.hint, children: description }) : null
+    ] }),
+    trail ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: MENU_LOOK_CLASS.trail, children: trail }) : null,
+    badge ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: MENU_LOOK_CLASS.badge, children: badge }) : null,
+    shortcut ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("kbd", { className: MENU_LOOK_CLASS.shortcut, children: shortcut }) : null,
+    current ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(RadixCheckIcon, { className: MENU_LOOK_CLASS.current, "aria-hidden": "true", "data-menu-current-mark": "" }) : null
+  ] });
+}
+function menuLookItemClass({ destructive, dimmed } = {}) {
+  return `${MENU_LOOK_CLASS.item}${destructive ? ` ${MENU_LOOK_CLASS.danger}` : ""}${dimmed ? ` ${MENU_LOOK_CLASS.dimmed}` : ""}`;
+}
+function DeclaredOverflow({ label, children }) {
+  const fade = useScrollFade();
+  const viewport = React11.useRef(null);
+  const setViewport = React11.useCallback(
+    (node) => {
+      viewport.current = node;
+      fade.ref(node);
+    },
+    [fade.ref]
+  );
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(import_jsx_runtime13.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { ref: setViewport, className: "cm-viewport", "data-slot": "menu-look-viewport", children }),
+    fade.state.bottom ? /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
+      "button",
+      {
+        type: "button",
+        className: "cm-more-below",
+        "data-slot": "menu-look-more-below",
+        tabIndex: -1,
+        "aria-hidden": "true",
+        onPointerDown: (event) => event.preventDefault(),
+        onClick: () => viewport.current?.scrollTo({ top: viewport.current.scrollHeight, behavior: "smooth" }),
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(RadixChevronDownIcon, { "aria-hidden": "true" }),
+          label
+        ]
+      }
+    ) : null
+  ] });
+}
+var MenuLookContent = React11.forwardRef(function MenuLookContent2({ size = "standard", density = "comfortable", moreBelowLabel, children, ...props }, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+    DropdownMenuContent,
+    {
+      ref,
+      surface: "solid",
+      "data-menu-look": "",
+      "data-menu-family": "dropdown",
+      "data-size": size,
+      "data-density": density,
+      ...moreBelowLabel ? { "data-overflow": "declared" } : {},
+      ...props,
+      className: MENU_LOOK_CLASS.panel,
+      children: moreBelowLabel ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(DeclaredOverflow, { label: moreBelowLabel, children }) : children
+    }
+  );
+});
+var MenuLookSubContent = React11.forwardRef(function MenuLookSubContent2({ size = "standard", density = "comfortable", fit = "menu", ...props }, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+    DropdownMenuSubContent,
+    {
+      ref,
+      surface: "solid",
+      "data-menu-look": "",
+      "data-menu-family": "dropdown",
+      "data-size": size,
+      "data-density": density,
+      "data-fit": fit,
+      ...props,
+      className: MENU_LOOK_CLASS.panel
+    }
+  );
+});
+var MenuLookContextContent = React11.forwardRef(function MenuLookContextContent2({ size = "standard", density = "comfortable", ...props }, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+    ContextMenuContent,
+    {
+      ref,
+      "data-menu-look": "",
+      "data-menu-family": "context",
+      "data-size": size,
+      "data-density": density,
+      ...props,
+      className: MENU_LOOK_CLASS.panel
+    }
+  );
+});
+var MenuLookContextSubContent = React11.forwardRef(function MenuLookContextSubContent2({ size = "standard", density = "comfortable", fit = "menu", ...props }, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+    ContextMenuSubContent,
+    {
+      ref,
+      "data-menu-look": "",
+      "data-menu-family": "context",
+      "data-size": size,
+      "data-density": density,
+      "data-fit": fit,
+      ...props,
+      className: MENU_LOOK_CLASS.panel
+    }
+  );
+});
+function menuLookRows(P, family) {
+  const Item3 = React11.forwardRef(function MenuLookItem2({ icon, label, labelTitle, description, trail, badge, shortcut, current, destructive, dimmed, href, target, linkProps, ...props }, ref) {
+    const className = menuLookItemClass({ destructive, dimmed });
+    const body = /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(MenuLookRowBody, { icon, label, labelTitle, description, trail, badge, shortcut, current });
+    const mark = current ? { "data-current": "" } : {};
+    if (href) {
+      return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(P.Item, { ref, asChild: true, "data-slot": `${family}-item`, ...props, ...mark, className, children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("a", { href, target, rel: target === "_blank" ? "noopener noreferrer" : void 0, ...linkProps, children: body }) });
+    }
+    return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(P.Item, { ref, "data-slot": `${family}-item`, ...props, ...mark, className, children: body });
+  });
+  const SubTrigger3 = React11.forwardRef(function MenuLookSubTrigger2({ icon, label, labelTitle, description, trail, badge, shortcut, current, ...props }, ref) {
+    return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(P.SubTrigger, { ref, "data-slot": `${family}-sub-trigger`, ...props, ...current ? { "data-current": "" } : {}, className: MENU_LOOK_CLASS.item, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(MenuLookRowBody, { icon, label, labelTitle, description, trail, badge, shortcut }),
+      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(RadixChevronRightIcon, { className: MENU_LOOK_CLASS.chevron, "aria-hidden": "true" })
+    ] });
+  });
+  const CheckboxItem3 = React11.forwardRef(function MenuLookCheckboxItem2({ icon, label, labelTitle, description, trail, badge, shortcut, checked, ...props }, ref) {
+    const on = checked === true;
+    return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(P.CheckboxItem, { ref, ...checked === void 0 ? {} : { checked }, ...props, className: MENU_LOOK_CLASS.item, children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(MenuLookRowBody, { icon: on ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(RadixCheckIcon, { className: MENU_LOOK_CLASS.icon }) : icon ?? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: MENU_LOOK_CLASS.icon, "aria-hidden": "true" }), label, labelTitle, description, trail, badge, shortcut }) });
+  });
+  const RadioItem3 = React11.forwardRef(function MenuLookRadioItem2({ icon, label, labelTitle, description, trail, badge, shortcut, ...props }, ref) {
+    return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(P.RadioItem, { ref, ...props, className: MENU_LOOK_CLASS.item, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(MenuLookRowBody, { icon, label, labelTitle, description, trail, badge, shortcut }),
+      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(P.ItemIndicator, { className: MENU_LOOK_CLASS.current, "data-menu-current-mark": "", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(RadixCheckIcon, { "aria-hidden": "true" }) })
+    ] });
+  });
+  const Label3 = React11.forwardRef(function MenuLookLabel2({ description, children, ...props }, ref) {
+    if (!description) return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(P.Label, { ref, ...props, className: MENU_LOOK_CLASS.sectionLabel, children });
+    return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(P.Label, { ref, ...props, "data-has-hint": "", className: MENU_LOOK_CLASS.sectionLabel, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { children }),
+      /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: MENU_LOOK_CLASS.hint, children: description })
+    ] });
+  });
+  const Separator3 = React11.forwardRef(function MenuLookSeparator2(props, ref) {
+    return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(P.Separator, { ref, ...props, className: MENU_LOOK_CLASS.divider });
+  });
+  return { Item: Item3, SubTrigger: SubTrigger3, CheckboxItem: CheckboxItem3, RadioItem: RadioItem3, Label: Label3, Separator: Separator3 };
+}
+var dropdownRows = menuLookRows(DropdownMenuPrimitive2, "dropdown-menu");
+var contextRows = menuLookRows(ContextMenuPrimitive2, "context-menu");
+var MenuLookItem = dropdownRows.Item;
+var MenuLookSub = DropdownMenuPrimitive2.Sub;
+var MenuLookSubTrigger = dropdownRows.SubTrigger;
+var MenuLookCheckboxItem = dropdownRows.CheckboxItem;
+var MenuLookRadioItem = dropdownRows.RadioItem;
+var MenuLookLabel = dropdownRows.Label;
+var MenuLookSeparator = dropdownRows.Separator;
+var MenuLookContextItem = contextRows.Item;
+var MenuLookContextSub = ContextMenuPrimitive2.Sub;
+var MenuLookContextSubTrigger = contextRows.SubTrigger;
+var MenuLookContextCheckboxItem = contextRows.CheckboxItem;
+var MenuLookContextRadioItem = contextRows.RadioItem;
+var MenuLookContextLabel = contextRows.Label;
+var MenuLookContextSeparator = contextRows.Separator;
+var MenuLookPanel = React11.forwardRef(function MenuLookPanel2({ size = "standard", density = "comfortable", surface = "floating", fillBelow, role = "menu", ...props }, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+    "div",
+    {
+      ref,
+      role,
+      "data-menu-look": "",
+      "data-menu-family": "panel",
+      "data-surface": surface,
+      ...fillBelow ? { "data-fill-below": fillBelow } : {},
+      "data-size": size,
+      "data-density": density,
+      ...props,
+      className: MENU_LOOK_CLASS.panel
+    }
+  );
+});
+var MenuLookPopoverContent = React11.forwardRef(function MenuLookPopoverContent2({ size = "standard", density = "comfortable", role = "menu", ...props }, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+    PopoverContent,
+    {
+      ref,
+      role,
+      surface: "solid",
+      padding: "none",
+      animated: true,
+      "data-menu-look": "",
+      "data-menu-family": "panel",
+      "data-in-popover": "",
+      "data-surface": "floating",
+      "data-size": size,
+      "data-density": density,
+      ...props,
+      className: MENU_LOOK_CLASS.panel
+    }
+  );
+});
+var MenuLookPanelItem = React11.forwardRef(function MenuLookPanelItem2({ icon, label, labelTitle, description, trail, badge, shortcut, current, pressed, destructive, dimmed, href, target, rel, as, linkProps, onClick, role = "menuitem", ...props }, ref) {
+  const marked = Boolean(current || pressed);
+  const body = /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(MenuLookRowBody, { icon, label, labelTitle, description, trail, badge, shortcut, current: marked });
+  const className = menuLookItemClass({ destructive, dimmed });
+  const mark = marked ? { "data-current": "" } : {};
+  if (href) {
+    const Link = as ?? "a";
+    return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+      Link,
+      {
+        ref,
+        href,
+        target,
+        rel: rel ?? (target === "_blank" ? "noopener noreferrer" : void 0),
+        role,
+        onClick,
+        ...props,
+        ...linkProps,
+        ...mark,
+        className,
+        children: body
+      }
+    );
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+    "button",
+    {
+      ref,
+      type: "button",
+      role,
+      onClick,
+      ...pressed === void 0 ? {} : { "aria-pressed": pressed },
+      ...props,
+      ...mark,
+      className,
+      children: body
+    }
+  );
+});
+var MenuLookPanelControlRow = React11.forwardRef(function MenuLookPanelControlRow2({ icon, label, description, control, as = "div", ...props }, ref) {
+  const Row = as;
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(Row, { ref, "data-control-row": "", ...props, className: MENU_LOOK_CLASS.item, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(MenuLookRowBody, { icon, label, description }),
+    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: MENU_LOOK_CLASS.control, children: control })
+  ] });
+});
+var MenuLookSearch = React11.forwardRef(function MenuLookSearch2({ placeholder = "Search", ...props }, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: MENU_LOOK_CLASS.search, "data-menu-look-search": "", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+    "input",
+    {
+      ref,
+      type: "search",
+      autoComplete: "off",
+      spellCheck: false,
+      placeholder,
+      "aria-label": props["aria-label"] ?? placeholder,
+      ...props
+    }
+  ) });
+});
+
 // src/item/ItemMenuDrawer.tsx
 var import_react5 = require("react");
 
 // src/drawer.tsx
 var import_react_tree = require("@ai-matrx/kit/react-tree");
-var React12 = __toESM(require("react"), 1);
+var React14 = __toESM(require("react"), 1);
 var import_vaul = require("vaul");
 
 // src/floating-layer.tsx
 var import_react_focus_scope = require("@radix-ui/react-focus-scope");
 var import_react_slot3 = require("@radix-ui/react-slot");
-var React10 = __toESM(require("react"), 1);
-var import_jsx_runtime12 = require("react/jsx-runtime");
+var React12 = __toESM(require("react"), 1);
+var import_jsx_runtime14 = require("react/jsx-runtime");
 var FLOATING_LAYER_ATTR = "data-matrx-floating-layer";
 var REGISTRY_SLOT = /* @__PURE__ */ Symbol.for("ai-matrx.design-system.modal-layer-registry");
 var registryHost = globalThis;
@@ -1534,7 +1900,7 @@ function isModalLayerOpen() {
   return registry.count > 0;
 }
 function useModalLayer(active) {
-  React10.useLayoutEffect(() => active ? registerModalLayer() : void 0, [active]);
+  React12.useLayoutEffect(() => active ? registerModalLayer() : void 0, [active]);
 }
 var POPPER_WRAPPER = "[data-radix-popper-content-wrapper]";
 function isInsideFloatingLayer(target) {
@@ -1549,8 +1915,8 @@ function keepFloatingLayersInside(handler) {
   };
 }
 var preventAutoFocus = (event) => event.preventDefault();
-var FloatingLayer = React10.forwardRef(({ children }, ref) => {
-  const [opener] = React10.useState(
+var FloatingLayer = React12.forwardRef(({ children }, ref) => {
+  const [opener] = React12.useState(
     () => typeof document === "undefined" ? null : document.activeElement
   );
   const returnFocus = (event) => {
@@ -1561,7 +1927,7 @@ var FloatingLayer = React10.forwardRef(({ children }, ref) => {
       opener.focus({ preventScroll: true });
     }
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
     import_react_focus_scope.FocusScope,
     {
       asChild: true,
@@ -1569,7 +1935,7 @@ var FloatingLayer = React10.forwardRef(({ children }, ref) => {
       loop: false,
       onMountAutoFocus: preventAutoFocus,
       onUnmountAutoFocus: returnFocus,
-      children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
         import_react_slot3.Slot,
         {
           ref,
@@ -1584,25 +1950,25 @@ var FloatingLayer = React10.forwardRef(({ children }, ref) => {
 FloatingLayer.displayName = "FloatingLayer";
 
 // src/radix-dialog-modal-context.tsx
-var React11 = __toESM(require("react"), 1);
-var import_jsx_runtime13 = require("react/jsx-runtime");
+var React13 = __toESM(require("react"), 1);
+var import_jsx_runtime15 = require("react/jsx-runtime");
 var CONTEXT_SLOT2 = /* @__PURE__ */ Symbol.for("ai-matrx.design-system.dialog-modal-context");
 var contextRegistry2 = globalThis;
-var RadixDialogModalContext = contextRegistry2[CONTEXT_SLOT2] ??= React11.createContext(true);
+var RadixDialogModalContext = contextRegistry2[CONTEXT_SLOT2] ??= React13.createContext(true);
 function RadixDialogModalProvider({
   children,
   modal
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(RadixDialogModalContext.Provider, { value: modal, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(RadixDialogModalContext.Provider, { value: modal, children });
 }
 function useRadixDialogModal() {
-  return React11.useContext(RadixDialogModalContext);
+  return React13.useContext(RadixDialogModalContext);
 }
 
 // src/drawer.tsx
-var import_jsx_runtime14 = require("react/jsx-runtime");
-var DrawerDirectionContext = React12.createContext("bottom");
-var useDrawerDirection = () => React12.useContext(DrawerDirectionContext);
+var import_jsx_runtime16 = require("react/jsx-runtime");
+var DrawerDirectionContext = React14.createContext("bottom");
+var useDrawerDirection = () => React14.useContext(DrawerDirectionContext);
 var Drawer = ({
   children,
   shouldScaleBackground = true,
@@ -1616,7 +1982,7 @@ var Drawer = ({
     }
     onOpenChange?.(open);
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(RadixDialogModalProvider, { modal: true, children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(DrawerDirectionContext.Provider, { value: direction, children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(RadixDialogModalProvider, { modal: true, children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(DrawerDirectionContext.Provider, { value: direction, children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
     import_vaul.Drawer.Root,
     {
       modal: true,
@@ -1632,7 +1998,7 @@ Drawer.displayName = "Drawer";
 var DrawerTrigger = import_vaul.Drawer.Trigger;
 var DrawerPortal = import_vaul.Drawer.Portal;
 var DrawerClose = import_vaul.Drawer.Close;
-var DrawerOverlay = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+var DrawerOverlay = React14.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
   import_vaul.Drawer.Overlay,
   {
     ref,
@@ -1645,7 +2011,7 @@ var DrawerOverlay = React12.forwardRef(({ className, ...props }, ref) => /* @__P
   }
 ));
 DrawerOverlay.displayName = import_vaul.Drawer.Overlay.displayName;
-var DrawerDescription = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+var DrawerDescription = React14.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
   import_vaul.Drawer.Description,
   {
     ref,
@@ -1655,9 +2021,9 @@ var DrawerDescription = React12.forwardRef(({ className, ...props }, ref) => /*
   }
 ));
 DrawerDescription.displayName = import_vaul.Drawer.Description.displayName;
-var DrawerContentPrimitive = React12.forwardRef(({ onInteractOutside, ...props }, ref) => {
+var DrawerContentPrimitive = React14.forwardRef(({ onInteractOutside, ...props }, ref) => {
   useModalLayer(true);
-  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
     import_vaul.Drawer.Content,
     {
       "data-matrx-entrance": "none",
@@ -1681,13 +2047,13 @@ var SIZE_CLASSES = {
   left: { adaptive: "w-auto max-w-[92vw]", full: "h-dvh w-[92vw] max-w-sm" },
   right: { adaptive: "w-auto max-w-[92vw]", full: "h-dvh w-[92vw] max-w-sm" }
 };
-var DrawerContent = React12.forwardRef(({ className, children, size = "adaptive", showHandle, ...props }, ref) => {
+var DrawerContent = React14.forwardRef(({ className, children, size = "adaptive", showHandle, ...props }, ref) => {
   const direction = useDrawerDirection();
   const hasDescription = (0, import_react_tree.treeContainsComponent)(children, DrawerDescription) || (0, import_react_tree.treeContainsComponent)(children, import_vaul.Drawer.Description);
   const withHandle = showHandle ?? (direction === "bottom" || direction === "top");
-  return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(DrawerPortal, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(DrawerOverlay, {}),
-    /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(DrawerPortal, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(DrawerOverlay, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
       DrawerContentPrimitive,
       {
         ref,
@@ -1704,7 +2070,7 @@ var DrawerContent = React12.forwardRef(({ className, children, size = "adaptive"
         children: [
           withHandle ? (
             // Rule 3: the pill is 4px; the TARGET is 44px.
-            /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
               "div",
               {
                 "aria-hidden": true,
@@ -1713,7 +2079,7 @@ var DrawerContent = React12.forwardRef(({ className, children, size = "adaptive"
                   "flex min-h-11 w-full shrink-0 cursor-grab items-center justify-center active:cursor-grabbing",
                   direction === "top" && "order-last"
                 ),
-                children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: "h-1 w-[100px] rounded-full bg-muted" })
+                children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "h-1 w-[100px] rounded-full bg-muted" })
               }
             )
           ) : null,
@@ -1727,7 +2093,7 @@ DrawerContent.displayName = "DrawerContent";
 var DrawerHeader = ({
   className,
   ...props
-}) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+}) => /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
   "div",
   {
     "data-slot": "drawer-header",
@@ -1742,7 +2108,7 @@ DrawerHeader.displayName = "DrawerHeader";
 var DrawerBody = ({
   className,
   ...props
-}) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+}) => /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
   "div",
   {
     "data-slot": "drawer-body",
@@ -1754,7 +2120,7 @@ DrawerBody.displayName = "DrawerBody";
 var DrawerFooter = ({
   className,
   ...props
-}) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+}) => /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
   "div",
   {
     "data-slot": "drawer-footer",
@@ -1763,7 +2129,7 @@ var DrawerFooter = ({
   }
 );
 DrawerFooter.displayName = "DrawerFooter";
-var DrawerTitle = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+var DrawerTitle = React14.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
   import_vaul.Drawer.Title,
   {
     ref,
@@ -1795,7 +2161,7 @@ function resolveItemMenuConfig(input) {
 }
 
 // src/item/ItemMenuDrawer.tsx
-var import_jsx_runtime15 = require("react/jsx-runtime");
+var import_jsx_runtime17 = require("react/jsx-runtime");
 function resolveSections(config, path) {
   let sections = config.sections;
   let title = null;
@@ -1836,24 +2202,24 @@ function ItemMenuDrawer({
     if (!next) setPath([]);
     onOpenChange(next);
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Drawer, { open, onOpenChange: handleOpenChange, children: /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(DrawerContent, { className: "max-h-[80dvh] flex flex-col", children: [
-    atRoot ? headerTitle ? /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "flex-shrink-0 border-b border-border px-4 pb-3 pt-1", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(DrawerTitle, { className: "text-center text-[15px] font-semibold", children: headerTitle }),
-      config.header?.description && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("p", { className: "mt-1 text-center type-body text-muted-foreground", children: config.header.description })
-    ] }) : /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(DrawerTitle, { className: "sr-only", children: "Options" }) : /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "flex h-11 flex-shrink-0 items-center border-b border-border px-1", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Drawer, { open, onOpenChange: handleOpenChange, children: /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(DrawerContent, { className: "max-h-[80dvh] flex flex-col", children: [
+    atRoot ? headerTitle ? /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "flex-shrink-0 border-b border-border px-4 pb-3 pt-1", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(DrawerTitle, { className: "text-center text-[15px] font-semibold", children: headerTitle }),
+      config.header?.description && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("p", { className: "mt-1 text-center type-body text-muted-foreground", children: config.header.description })
+    ] }) : /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(DrawerTitle, { className: "sr-only", children: "Options" }) : /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "flex h-11 flex-shrink-0 items-center border-b border-border px-1", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
         "button",
         {
           type: "button",
           onClick: pop,
           "aria-label": "Back",
           className: "flex h-9 items-center gap-1 rounded-md px-2 text-sm text-muted-foreground hover:bg-accent hover:text-foreground",
-          children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(ChevronLeftIcon, { className: "h-5 w-5" })
+          children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(ChevronLeftIcon, { className: "h-5 w-5" })
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(DrawerTitle, { className: "flex-1 truncate pr-10 text-center text-[15px] font-semibold", children: headerTitle ?? "Options" })
+      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(DrawerTitle, { className: "flex-1 truncate pr-10 text-center text-[15px] font-semibold", children: headerTitle ?? "Options" })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
+    /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
       "div",
       {
         className: cn(
@@ -1865,10 +2231,10 @@ function ItemMenuDrawer({
           sections.map((section, sIdx) => {
             const visible = section.items.filter((e) => !e.hidden);
             if (visible.length === 0) return null;
-            return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { children: [
-              sIdx > 0 && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "my-1 h-px bg-border" }),
-              section.label && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "px-4 pb-1 pt-2 type-secondary font-medium uppercase tracking-wide text-muted-foreground", children: section.label }),
-              visible.map((entry) => /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+            return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { children: [
+              sIdx > 0 && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "my-1 h-px bg-border" }),
+              section.label && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "px-4 pb-1 pt-2 type-secondary font-medium uppercase tracking-wide text-muted-foreground", children: section.label }),
+              visible.map((entry) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
                 DrawerEntry,
                 {
                   entry,
@@ -1902,8 +2268,8 @@ function DrawerEntry({
     disabled ? "opacity-50" : "active:bg-accent",
     destructive && "text-destructive"
   );
-  const content = /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_jsx_runtime15.Fragment, { children: [
-    Icon && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+  const content = /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_jsx_runtime17.Fragment, { children: [
+    Icon && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
       Icon,
       {
         className: cn(
@@ -1912,19 +2278,19 @@ function DrawerEntry({
         )
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("span", { className: "flex min-w-0 flex-1 flex-col", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: "truncate text-[15px]", title: entry.description, children: entry.label }),
-      disabled && entry.disabledReason ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: "truncate type-body text-muted-foreground", children: entry.disabledReason }) : null
+    /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("span", { className: "flex min-w-0 flex-1 flex-col", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: "truncate text-[15px]", title: entry.description, children: entry.label }),
+      disabled && entry.disabledReason ? /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: "truncate type-body text-muted-foreground", children: entry.disabledReason }) : null
     ] })
   ] });
   if (isSubmenu(entry)) {
-    return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("button", { type: "button", disabled, onClick: onDrill, className: rowClass, children: [
+    return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("button", { type: "button", disabled, onClick: onDrill, className: rowClass, children: [
       content,
-      /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(ChevronRightIcon, { className: "h-5 w-5 shrink-0 text-muted-foreground" })
+      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(ChevronRightIcon, { className: "h-5 w-5 shrink-0 text-muted-foreground" })
     ] });
   }
   if (isCheckbox(entry)) {
-    return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
       "button",
       {
         type: "button",
@@ -1933,13 +2299,13 @@ function DrawerEntry({
         className: rowClass,
         children: [
           content,
-          entry.checked && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(CheckIcon, { className: "h-5 w-5 shrink-0 text-primary" })
+          entry.checked && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(CheckIcon, { className: "h-5 w-5 shrink-0 text-primary" })
         ]
       }
     );
   }
   if (isLink(entry)) {
-    return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
       "a",
       {
         href: entry.href,
@@ -1951,7 +2317,7 @@ function DrawerEntry({
       }
     );
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
     "button",
     {
       type: "button",
@@ -1967,19 +2333,19 @@ function DrawerEntry({
 }
 
 // src/item/host.tsx
-var React13 = __toESM(require("react"), 1);
-var import_jsx_runtime16 = require("react/jsx-runtime");
+var React15 = __toESM(require("react"), 1);
+var import_jsx_runtime18 = require("react/jsx-runtime");
 var HOST_KEY = /* @__PURE__ */ Symbol.for("@ai-matrx/design-system/item-menu-host");
 var hostRegistry2 = globalThis;
-var ItemMenuHostContext = hostRegistry2[HOST_KEY] ?? (hostRegistry2[HOST_KEY] = React13.createContext(null));
+var ItemMenuHostContext = hostRegistry2[HOST_KEY] ?? (hostRegistry2[HOST_KEY] = React15.createContext(null));
 function ItemMenuHostProvider({
   host,
   children
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ItemMenuHostContext.Provider, { value: host, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ItemMenuHostContext.Provider, { value: host, children });
 }
 function useItemMenuHost() {
-  return React13.useContext(ItemMenuHostContext);
+  return React15.useContext(ItemMenuHostContext);
 }
 
 // src/item/run-entry.ts
@@ -2008,54 +2374,39 @@ function runToggle(entry, next) {
 }
 
 // src/item/ItemMenu.tsx
-var import_jsx_runtime17 = require("react/jsx-runtime");
+var import_jsx_runtime19 = require("react/jsx-runtime");
 var dropdownFamily = {
-  Item: DropdownMenuItem,
-  CheckboxItem: DropdownMenuCheckboxItem,
-  Sub: DropdownMenuSub,
-  SubTrigger: DropdownMenuSubTrigger,
-  SubContent: DropdownMenuSubContent,
-  Separator: DropdownMenuSeparator,
-  Label: DropdownMenuLabel,
-  Shortcut: DropdownMenuShortcut
+  Item: MenuLookItem,
+  CheckboxItem: MenuLookCheckboxItem,
+  Sub: MenuLookSub,
+  SubTrigger: MenuLookSubTrigger,
+  SubContent: MenuLookSubContent,
+  Separator: MenuLookSeparator,
+  Label: MenuLookLabel
 };
 var contextFamily = {
-  Item: ContextMenuItem,
-  CheckboxItem: ContextMenuCheckboxItem,
-  Sub: ContextMenuSub,
-  SubTrigger: ContextMenuSubTrigger,
-  SubContent: ContextMenuSubContent,
-  Separator: ContextMenuSeparator,
-  Label: ContextMenuLabel,
-  Shortcut: ContextMenuShortcut
+  Item: MenuLookContextItem,
+  CheckboxItem: MenuLookContextCheckboxItem,
+  Sub: MenuLookContextSub,
+  SubTrigger: MenuLookContextSubTrigger,
+  SubContent: MenuLookContextSubContent,
+  Separator: MenuLookContextSeparator,
+  Label: MenuLookContextLabel
 };
-var DESTRUCTIVE_ITEM_CLASS = "text-destructive-ink focus:bg-destructive/10 focus:text-destructive-ink [&_svg]:text-destructive-ink";
-function EntryInner({
-  entry,
-  Shortcut,
-  showShortcut = true
-}) {
+function entryRow(entry, { showShortcut = true } = {}) {
   const Icon = entry.icon;
-  const destructive = isCommand(entry) && entry.tone === "destructive";
-  const shortcutText = isCommand(entry) || isCheckbox(entry) ? entry.shortcut ?? entry.shortcutKey?.toUpperCase() : void 0;
-  const secondLine = entry.disabled && entry.disabledReason ? entry.disabledReason : void 0;
-  return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_jsx_runtime17.Fragment, { children: [
-    Icon && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
-      Icon,
-      {
-        className: cn(
-          "h-4 w-4 shrink-0",
-          destructive ? "text-destructive" : entry.iconClassName ?? "text-muted-foreground"
-        )
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("span", { className: "flex min-w-0 flex-1 flex-col", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: "truncate", title: entry.description, children: entry.label }),
-      secondLine && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: "truncate type-secondary text-muted-foreground", children: secondLine })
-    ] }),
-    entry.badge && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: "ml-2 shrink-0 rounded border border-border px-1.5 py-px type-meta font-medium uppercase tracking-wide text-muted-foreground", children: entry.badge }),
-    showShortcut && shortcutText && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Shortcut, { children: shortcutText })
-  ] });
+  const shortcut = showShortcut && (isCommand(entry) || isCheckbox(entry)) ? entry.shortcut ?? entry.shortcutKey?.toUpperCase() : void 0;
+  return {
+    // A destructive row's glyph takes the row's danger tone (menu-look.css); others keep their own color.
+    icon: Icon ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(Icon, { className: isCommand(entry) && entry.tone === "destructive" ? void 0 : entry.iconClassName }) : void 0,
+    label: entry.label,
+    labelTitle: entry.description,
+    // The only second line an entry draws is why it is disabled; `description` is hover text
+    // (Arman, 2026-10-14: no "novels" in menus).
+    description: entry.disabled && entry.disabledReason ? entry.disabledReason : void 0,
+    badge: entry.badge,
+    shortcut
+  };
 }
 function MenuSections({
   family,
@@ -2063,10 +2414,10 @@ function MenuSections({
   onCloseRequest
 }) {
   const visibleSections = sections.map((s) => ({ ...s, items: s.items.filter((e) => !e.hidden) })).filter((s) => s.items.length > 0);
-  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_jsx_runtime17.Fragment, { children: visibleSections.map((section, sIdx) => /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_react6.Fragment, { children: [
-    sIdx > 0 && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(family.Separator, {}),
-    section.label && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(family.Label, { className: "text-xs font-medium uppercase tracking-wide text-muted-foreground", children: section.label }),
-    section.items.map((entry) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_jsx_runtime19.Fragment, { children: visibleSections.map((section, sIdx) => /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_react6.Fragment, { children: [
+    sIdx > 0 && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(family.Separator, {}),
+    section.label && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(family.Label, { children: section.label }),
+    section.items.map((entry) => /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
       MenuLeaf,
       {
         family,
@@ -2088,18 +2439,11 @@ function MenuLeaf({
 }) {
   const toastPromise = useItemMenuHost()?.toastPromise;
   if (isSubmenu(entry)) {
-    return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(family.Sub, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(family.SubTrigger, { disabled: entry.disabled, className: "gap-2", onPointerLeave: (event) => {
+    return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(family.Sub, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(family.SubTrigger, { ...entryRow(entry, { showShortcut: false }), disabled: entry.disabled, onPointerLeave: (event) => {
         if (entry.renderContent && event.relatedTarget instanceof Element && event.relatedTarget.closest("[data-canonical-alchemy-submenu]")) event.preventDefault();
-      }, children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
-        EntryInner,
-        {
-          entry,
-          Shortcut: family.Shortcut,
-          showShortcut: false
-        }
-      ) }),
-      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(family.SubContent, { onFocusOutside: keepCanonicalPaletteInteraction, onPointerDownOutside: keepCanonicalPaletteInteraction, className: entry.renderContent ? "p-0 [--radix-popover-content-available-height:var(--radix-dropdown-menu-content-available-height)]" : void 0, children: entry.renderContent ? entry.renderContent(onCloseRequest) : /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+      } }),
+      /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(family.SubContent, { onFocusOutside: keepCanonicalPaletteInteraction, onPointerDownOutside: keepCanonicalPaletteInteraction, fit: entry.renderContent ? "content" : "menu", children: entry.renderContent ? entry.renderContent(onCloseRequest) : /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
         MenuSections,
         {
           family,
@@ -2110,40 +2454,36 @@ function MenuLeaf({
     ] });
   }
   if (isCheckbox(entry)) {
-    return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
       family.CheckboxItem,
       {
+        ...entryRow(entry),
         checked: entry.checked,
         disabled: entry.disabled,
         onSelect: (e) => e.preventDefault(),
-        onCheckedChange: (next) => runToggle(entry, next),
-        className: "gap-2",
-        children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(EntryInner, { entry, Shortcut: family.Shortcut })
+        onCheckedChange: (next) => runToggle(entry, next)
       }
     );
   }
   if (isLink(entry)) {
-    return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(family.Item, { asChild: true, disabled: entry.disabled, className: "gap-2", children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
-      "a",
+    return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+      family.Item,
       {
+        ...entryRow(entry),
+        disabled: entry.disabled,
         href: entry.href,
         target: entry.target,
-        rel: entry.target === "_blank" ? "noopener noreferrer" : void 0,
-        onClick: onCloseRequest,
-        children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(EntryInner, { entry, Shortcut: family.Shortcut })
+        linkProps: { onClick: onCloseRequest }
       }
-    ) });
+    );
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
     family.Item,
     {
+      ...entryRow(entry),
       disabled: entry.disabled,
-      onSelect: () => runCommand(entry, toastPromise),
-      className: cn(
-        "gap-2",
-        entry.tone === "destructive" && DESTRUCTIVE_ITEM_CLASS
-      ),
-      children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(EntryInner, { entry, Shortcut: family.Shortcut })
+      destructive: entry.tone === "destructive",
+      onSelect: () => runCommand(entry, toastPromise)
     }
   );
 }
@@ -2168,7 +2508,7 @@ function makeShortcutHandler(config, close, toastPromise) {
   };
 }
 function RowAlchemyIcon(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, ...props, children: ALCHEMY_GLYPH_PATHS.portal.map((d, index) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("path", { d }, index)) });
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, ...props, children: ALCHEMY_GLYPH_PATHS.portal.map((d, index) => /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("path", { d }, index)) });
 }
 function hasVisibleEntry(config, id) {
   const entries = config?.sections.flatMap((section) => section.items) ?? [];
@@ -2197,7 +2537,7 @@ function RowAlchemySubmenuContent({ onClose, restoreFocus }) {
     mountMenu?.(target.current, () => closeRef.current(), () => focusRef.current());
     return () => mountMenu?.(null);
   }, [mountMenu]);
-  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { ref: target, "data-canonical-alchemy-submenu": true, "aria-label": "Alchemy output options", onKeyDown: (event) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { ref: target, "data-canonical-alchemy-submenu": true, "aria-label": "Alchemy output options", onKeyDown: (event) => {
     if (event.key === "Tab") event.stopPropagation();
   } });
 }
@@ -2210,7 +2550,6 @@ function ItemMenu({
   open: openProp,
   onOpenChange,
   onCloseAutoFocus,
-  contentMinWidth = "12rem",
   presentation = "auto"
 }) {
   const toastPromise = useItemMenuHost()?.toastPromise;
@@ -2234,7 +2573,7 @@ function ItemMenu({
     icon: RowAlchemyIcon,
     disabled: rowAlchemy.copy.disabled,
     sections: [],
-    renderContent: (onClose) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(RowAlchemySubmenuContent, { onClose, restoreFocus: () => (dropdownTriggerRef.current ?? restoreTargetRef.current)?.focus() })
+    renderContent: (onClose) => /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(RowAlchemySubmenuContent, { onClose, restoreFocus: () => (dropdownTriggerRef.current ?? restoreTargetRef.current)?.focus() })
   } : null;
   const normalSections = baseConfig?.sections.map((section, index) => ({ section, index })).filter(({ section }) => section.id !== "danger" && !containsDestructiveAction(section.items)) ?? [];
   const targetSection = (normalSections.find(({ section }) => !section.label) ?? normalSections[0])?.index;
@@ -2248,20 +2587,6 @@ function ItemMenu({
     ...baseConfig,
     sections: targetSection !== void 0 ? baseConfig.sections.map((section, index) => index === targetSection ? { ...section, items: [...section.items, ...injectedRowItems] } : section) : [{ id: "actions", items: injectedRowItems }, ...baseConfig.sections]
   } : baseConfig;
-  const scrollFade = useScrollFade();
-  const viewportRef = (0, import_react6.useRef)(null);
-  const setViewport = (0, import_react6.useCallback)(
-    (node) => {
-      viewportRef.current = node;
-      scrollFade.ref(node);
-    },
-    [scrollFade.ref]
-  );
-  const scrollToEnd = () => {
-    const el = viewportRef.current;
-    if (!el) return;
-    el.scrollTo({ top: el.scrollHeight, behavior: "smooth" });
-  };
   const handleOpenChange = (next) => {
     if (!isControlled) setUncontrolledOpen(next);
     onOpenChange?.(next);
@@ -2278,8 +2603,8 @@ function ItemMenu({
     dropdownTriggerRef.current?.focus();
   }, [armed]);
   if (mode === "drawer") {
-    return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_jsx_runtime17.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_jsx_runtime19.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
         import_react_slot4.Slot,
         {
           onClick: (e) => {
@@ -2290,7 +2615,7 @@ function ItemMenu({
           children
         }
       ),
-      resolved && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+      resolved && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
         ItemMenuDrawer,
         {
           open,
@@ -2303,7 +2628,7 @@ function ItemMenu({
     ] });
   }
   if (!live) {
-    return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
       import_react_slot4.Slot,
       {
         "data-item-menu-trigger": "idle",
@@ -2326,20 +2651,17 @@ function ItemMenu({
       }
     );
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(DropdownMenu, { open, onOpenChange: handleOpenChange, modal: false, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(DropdownMenuTrigger, { ref: dropdownTriggerRef, asChild: true, children }),
-    resolved && /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
-      DropdownMenuContent,
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(DropdownMenu, { open, onOpenChange: handleOpenChange, modal: false, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(DropdownMenuTrigger, { ref: dropdownTriggerRef, asChild: true, children }),
+    resolved && /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
+      MenuLookContent,
       {
         onFocusOutside: keepCanonicalPaletteInteraction,
         onPointerDownOutside: keepCanonicalPaletteInteraction,
         align,
         ...side ? { side } : {},
         collisionPadding: 12,
-        className: cn(
-          "flex max-h-[var(--radix-dropdown-menu-content-available-height)] flex-col overflow-hidden p-0"
-        ),
-        style: { minWidth: contentMinWidth },
+        moreBelowLabel: "More actions below",
         ...onCloseAutoFocus ? { onCloseAutoFocus } : {},
         onKeyDown: makeShortcutHandler(
           resolved,
@@ -2347,42 +2669,13 @@ function ItemMenu({
           toastPromise
         ),
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
-            "div",
-            {
-              ref: setViewport,
-              "data-slot": "item-menu-viewport",
-              className: "min-h-0 flex-1 overflow-y-auto overscroll-contain p-1",
-              children: [
-                resolved.header?.title && /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(DropdownMenuLabel, { className: "text-xs", children: [
-                  resolved.header.title,
-                  resolved.header.description && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: "mt-0.5 block type-meta font-normal text-muted-foreground", children: resolved.header.description })
-                ] }),
-                /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
-                  MenuSections,
-                  {
-                    family: dropdownFamily,
-                    sections: resolved.sections,
-                    onCloseRequest: () => handleOpenChange(false)
-                  }
-                )
-              ]
-            }
-          ),
-          scrollFade.state.bottom && /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
-            "button",
+          resolved.header?.title && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(MenuLookLabel, { description: resolved.header.description, children: resolved.header.title }),
+          /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+            MenuSections,
             {
-              type: "button",
-              "data-slot": "item-menu-more-below",
-              tabIndex: -1,
-              "aria-hidden": "true",
-              onPointerDown: (e) => e.preventDefault(),
-              onClick: scrollToEnd,
-              className: "flex w-full shrink-0 items-center justify-center gap-1 border-t border-border bg-popover px-2 py-1 text-[11px] font-medium text-muted-foreground hover:bg-accent hover:text-accent-foreground",
-              children: [
-                /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(ChevronDownIcon, { className: "h-3 w-3" }),
-                "More actions below"
-              ]
+              family: dropdownFamily,
+              sections: resolved.sections,
+              onCloseRequest: () => handleOpenChange(false)
             }
           )
         ]
@@ -2393,10 +2686,10 @@ function ItemMenu({
 ItemMenu.routeHeaderMenu = true;
 function ItemContextMenu(props) {
   const host = useItemMenuHost();
-  if (props.enabled === false) return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_jsx_runtime17.Fragment, { children: props.children });
+  if (props.enabled === false) return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_jsx_runtime19.Fragment, { children: props.children });
   const HostMenu = host?.ContextMenu;
-  if (HostMenu) return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(HostMenu, { ...props });
-  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(DefaultItemContextMenu, { ...props });
+  if (HostMenu) return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(HostMenu, { ...props });
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(DefaultItemContextMenu, { ...props });
 }
 function DefaultItemContextMenu({
   config,
@@ -2407,7 +2700,7 @@ function DefaultItemContextMenu({
 }) {
   const [resolved, setResolved] = (0, import_react6.useState)(null);
   const targetRef = (0, import_react6.useRef)(null);
-  return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
     ContextMenu,
     {
       modal: false,
@@ -2419,7 +2712,7 @@ function DefaultItemContextMenu({
         onOpenChange?.(open);
       },
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
           ContextMenuTrigger,
           {
             asChild: true,
@@ -2429,17 +2722,10 @@ function DefaultItemContextMenu({
             children
           }
         ),
-        resolved && /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
-          ContextMenuContent,
-          {
-            className: "z-[9999] min-w-[12rem]",
-            onCloseAutoFocus,
-            children: [
-              resolved.header?.title && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(ContextMenuLabel, { className: "text-xs font-medium text-muted-foreground", children: resolved.header.title }),
-              /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(MenuSections, { family: contextFamily, sections: resolved.sections, onCloseRequest: () => onOpenChange?.(false) })
-            ]
-          }
-        )
+        resolved && /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(MenuLookContextContent, { onCloseAutoFocus, children: [
+          resolved.header?.title && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(MenuLookContextLabel, { description: resolved.header.description, children: resolved.header.title }),
+          /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(MenuSections, { family: contextFamily, sections: resolved.sections, onCloseRequest: () => onOpenChange?.(false) })
+        ] })
       ]
     }
   );
@@ -2448,7 +2734,7 @@ declareLazyDataProps(ItemMenu, ["config"]);
 declareLazyDataProps(ItemContextMenu, ["config"]);
 
 // src/item/ItemRow.tsx
-var import_jsx_runtime18 = require("react/jsx-runtime");
+var import_jsx_runtime20 = require("react/jsx-runtime");
 var SIZE = {
   // A nested sub-row (a conversation's helpers under it in the chat sidebar):
   // finer and quieter than its parent, so a tree reads at a glance.
@@ -2537,7 +2823,7 @@ function ItemRow({
   const startInlineRename = () => {
     if (canRename) setEditing(true);
   };
-  const labelNode = editing && rename ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+  const labelNode = editing && rename ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
     EditableLabel,
     {
       activation: "controlled",
@@ -2552,17 +2838,17 @@ function ItemRow({
       className: "flex-1",
       inputClassName: cn("font-normal", sz.text)
     }
-  ) : subtitle != null ? /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("span", { className: "flex min-w-0 flex-1 flex-col", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { className: cn("item-fade min-w-0", sz.text), title: label, children: label }),
-    /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { className: "min-w-0 truncate type-secondary text-muted-foreground", "data-item-subtitle": "", children: subtitle })
-  ] }) : /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { className: cn("item-fade min-w-0 flex-1", sz.text), title: label, children: label });
-  const primaryInner = /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_jsx_runtime18.Fragment, { children: [
-    leading != null && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { className: "flex shrink-0 items-center", children: leading }),
+  ) : subtitle != null ? /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("span", { className: "flex min-w-0 flex-1 flex-col", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: cn("item-fade min-w-0", sz.text), title: label, children: label }),
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "min-w-0 truncate type-secondary text-muted-foreground", "data-item-subtitle": "", children: subtitle })
+  ] }) : /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: cn("item-fade min-w-0 flex-1", sz.text), title: label, children: label });
+  const primaryInner = /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_jsx_runtime20.Fragment, { children: [
+    leading != null && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "flex shrink-0 items-center", children: leading }),
     labelNode,
     secondaryLabel && // Clamped: a secondary value can be a sentence (a lineage edge's
     // "140 cards - 1 section could not be covered …"). Unclamped it pushed
     // the label out of the row (owner, 2026-10-04).
-    /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
       "span",
       {
         className: cn(
@@ -2573,14 +2859,14 @@ function ItemRow({
         children: secondaryLabel
       }
     ),
-    (trailing != null || trailingOnHover != null) && /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("span", { className: "item-shift flex shrink-0 items-center gap-1 pr-0.5", children: [
+    (trailing != null || trailingOnHover != null) && /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("span", { className: "item-shift flex shrink-0 items-center gap-1 pr-0.5", children: [
       trailing,
-      trailingOnHover != null && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { className: cn("hidden", REVEAL_DISPLAY), "data-item-trailing-hover": "", children: trailingOnHover })
+      trailingOnHover != null && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: cn("hidden", REVEAL_DISPLAY), "data-item-trailing-hover": "", children: trailingOnHover })
     ] })
   ] });
   const twoLine = subtitle != null && !editing;
   const sideBySide = actions != null || leadingControl != null;
-  const disclosureButton = disclosure ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+  const disclosureButton = disclosure ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
     Button2,
     {
       type: "button",
@@ -2592,7 +2878,7 @@ function ItemRow({
         e.stopPropagation();
         disclosure.onToggle();
       },
-      icon: disclosure.open ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ChevronDownIcon, { className: sz.icon }) : /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ChevronRightIcon, { className: sz.icon }),
+      icon: disclosure.open ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(ChevronDownIcon, { className: sz.icon }) : /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(ChevronRightIcon, { className: sz.icon }),
       className: "shrink-0"
     }
   ) : null;
@@ -2611,11 +2897,11 @@ function ItemRow({
   } : void 0;
   let primary;
   if (editing || disabled) {
-    primary = /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: primaryClass, style: indentStyle, "data-item-primary": "", children: primaryInner });
+    primary = /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: primaryClass, style: indentStyle, "data-item-primary": "", children: primaryInner });
   } else if (href) {
     const RegisteredLink = getTapTargetLinkComponent();
     const Link = RegisteredLink ?? "a";
-    primary = /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+    primary = /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
       Link,
       {
         href,
@@ -2637,7 +2923,7 @@ function ItemRow({
       }
     );
   } else {
-    primary = /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+    primary = /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
       "button",
       {
         type: "button",
@@ -2654,19 +2940,19 @@ function ItemRow({
       }
     );
   }
-  const kebab = mappedMenu && !editing ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+  const kebab = mappedMenu && !editing ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
     ItemMenu,
     {
       config: mappedMenu,
       align: "end",
       onCloseAutoFocus: handleCloseAutoFocus,
-      children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
         Button2,
         {
           type: "button",
           variant: "quiet",
           "aria-label": kebabAriaLabel ?? `Options for ${label}`,
-          icon: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(MoreHorizontalIcon, { className: sz.icon }),
+          icon: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(MoreHorizontalIcon, { className: sz.icon }),
           "aria-haspopup": "menu",
           onClick: (e) => e.stopPropagation(),
           "data-item-kebab": "",
@@ -2682,7 +2968,7 @@ function ItemRow({
       )
     }
   ) : null;
-  const row = /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
+  const row = /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
     "div",
     {
       "data-active": active || void 0,
@@ -2695,9 +2981,9 @@ function ItemRow({
         className
       ),
       children: [
-        leadingControl != null ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { className: "flex shrink-0 items-center pl-2", "data-item-leading-control": "", children: leadingControl }) : null,
+        leadingControl != null ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "flex shrink-0 items-center pl-2", "data-item-leading-control": "", children: leadingControl }) : null,
         primary,
-        !sideBySide && disclosureButton ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+        !sideBySide && disclosureButton ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
           "span",
           {
             className: "item-shift absolute inset-y-0 right-1 flex items-center",
@@ -2706,7 +2992,7 @@ function ItemRow({
           }
         ) : null,
         !sideBySide && kebab,
-        sideBySide && (actions != null || kebab || disclosureButton) ? /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
+        sideBySide && (actions != null || kebab || disclosureButton) ? /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
           "span",
           {
             className: "flex shrink-0 items-center [&>:not(.matrx-tap-target,.matrx-alchemy)]:mx-0.5",
@@ -2722,7 +3008,7 @@ function ItemRow({
     }
   );
   if (!mappedMenu || disableContextMenu) return row;
-  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
     ItemContextMenu,
     {
       config: mappedMenu,
@@ -2744,13 +3030,13 @@ function ItemRow({
 
 // src/checkbox.tsx
 var CheckboxPrimitive = __toESM(require("@radix-ui/react-checkbox"), 1);
-var React14 = __toESM(require("react"), 1);
-var import_jsx_runtime19 = require("react/jsx-runtime");
+var React16 = __toESM(require("react"), 1);
+var import_jsx_runtime21 = require("react/jsx-runtime");
 var CHECKBOX_SIZES = {
   sm: { root: "h-3.5 w-3.5 rounded-xs", glyph: "h-3 w-3" },
   md: { root: "h-4 w-4 rounded-sm", glyph: "h-3.5 w-3.5" }
 };
-var Checkbox = React14.forwardRef(({ className, size = "md", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+var Checkbox = React16.forwardRef(({ className, size = "md", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
   CheckboxPrimitive.Root,
   {
     ref,
@@ -2761,12 +3047,12 @@ var Checkbox = React14.forwardRef(({ className, size = "md", ...props }, ref) =>
       className
     ),
     ...props,
-    children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+    children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
       CheckboxPrimitive.Indicator,
       {
         "data-slot": "checkbox-indicator",
         className: "flex items-center justify-center text-current",
-        children: props.checked === "indeterminate" ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(DividerHorizontalIcon, { className: CHECKBOX_SIZES[size].glyph }) : /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(RadixCheckIcon, { className: CHECKBOX_SIZES[size].glyph })
+        children: props.checked === "indeterminate" ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(DividerHorizontalIcon, { className: CHECKBOX_SIZES[size].glyph }) : /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(RadixCheckIcon, { className: CHECKBOX_SIZES[size].glyph })
       }
     )
   }
@@ -2777,46 +3063,46 @@ Checkbox.displayName = CheckboxPrimitive.Root.displayName;
 var DialogPrimitive2 = __toESM(require("@radix-ui/react-dialog"), 1);
 var VisuallyHidden = __toESM(require("@radix-ui/react-visually-hidden"), 1);
 var import_react_tree2 = require("@ai-matrx/kit/react-tree");
-var React17 = __toESM(require("react"), 1);
+var React19 = __toESM(require("react"), 1);
 
 // src/close-slot.tsx
 var DialogPrimitive = __toESM(require("@radix-ui/react-dialog"), 1);
-var React15 = __toESM(require("react"), 1);
-var import_jsx_runtime20 = require("react/jsx-runtime");
+var React17 = __toESM(require("react"), 1);
+var import_jsx_runtime22 = require("react/jsx-runtime");
 var CLOSE_CONTROL_CLASSES = "flex h-11 w-11 shrink-0 items-center justify-center rounded-sm text-muted-foreground ring-offset-background transition-colors hover:text-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none lg:h-8 lg:w-8";
 function CloseControl({ className }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(DialogPrimitive.Close, { "data-slot": "dialog-close", "aria-label": "Close", className: cn(CLOSE_CONTROL_CLASSES, className), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(XIcon, { className: "h-4 w-4", "aria-hidden": "true" }),
-    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "sr-only", children: "Close" })
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(DialogPrimitive.Close, { "data-slot": "dialog-close", "aria-label": "Close", className: cn(CLOSE_CONTROL_CLASSES, className), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(XIcon, { className: "h-4 w-4", "aria-hidden": "true" }),
+    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "sr-only", children: "Close" })
   ] });
 }
-var CloseSlotContext = React15.createContext(null);
-var SearchRowCloseSlotContext = React15.createContext(null);
+var CloseSlotContext = React17.createContext(null);
+var SearchRowCloseSlotContext = React17.createContext(null);
 function useCloseSlot(enabled) {
-  const [claims, setClaims] = React15.useState([]);
+  const [claims, setClaims] = React17.useState([]);
   const owner = claims[0] ?? null;
-  const claim = React15.useCallback((id) => {
+  const claim = React17.useCallback((id) => {
     setClaims((list) => [...list, id]);
     return () => setClaims((list) => list.filter((c) => c !== id));
   }, []);
-  const slot = React15.useMemo(() => enabled ? { claim, owner } : null, [enabled, claim, owner]);
+  const slot = React17.useMemo(() => enabled ? { claim, owner } : null, [enabled, claim, owner]);
   return { slot, claimed: owner !== null };
 }
 var CloseSlotProvider = CloseSlotContext.Provider;
 var SearchRowCloseSlotProvider = SearchRowCloseSlotContext.Provider;
 function useClaim(context, declined) {
-  const slot = React15.useContext(context);
-  const id = React15.useId();
+  const slot = React17.useContext(context);
+  const id = React17.useId();
   const claim = slot?.claim;
   const wants = claim !== void 0 && !declined;
-  React15.useLayoutEffect(() => wants && claim ? claim(id) : void 0, [wants, claim, id]);
+  React17.useLayoutEffect(() => wants && claim ? claim(id) : void 0, [wants, claim, id]);
   return wants && slot?.owner === id;
 }
 function useCloseSlotClaim(declined = false) {
   return useClaim(CloseSlotContext, declined);
 }
 function CloseRow({ className }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { "data-slot": "close-row", className: cn("flex justify-end", className), children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(CloseControl, {}) });
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { "data-slot": "close-row", className: cn("flex justify-end", className), children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CloseControl, {}) });
 }
 var BODY_LAYOUT = /^!?(?:[a-z0-9]+:)*(?:flex|grid|flex-(?:row|col)(?:-reverse)?|grid-(?:cols|rows|flow)-\S+|place-\S+|items-\S+|justify-\S+|content-\S+|gap(?:-[xy])?-\S+|space-[xy]-\S+|text-(?:left|center|right|start|end)|flex-wrap|flex-nowrap)$/;
 var OLD_CLOSE_RESERVE = /^pr-(?:8|9|10|11|12|14|16)$/;
@@ -2839,24 +3125,24 @@ function HeaderWithClose({
 }) {
   const owns = useCloseSlotClaim(/(?:^|\s)(?:sr-only|hidden)(?:\s|$)/.test(className ?? ""));
   if (!owns) {
-    return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { "data-slot": slotName, className: cn(baseClassName, className), ...props, children });
+    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { "data-slot": slotName, className: cn(baseClassName, className), ...props, children });
   }
   const { row, body } = splitHeaderClasses(className);
   const rowish = /(?:^|\s)(?:[a-z0-9]+:)*flex-row(?:\s|$)/.test(body);
-  return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { "data-slot": slotName, "data-has-close": "", className: cn("flex gap-2", rowish ? "items-center" : "items-start", row), ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { "data-slot": `${slotName}-body`, className: cn("min-w-0 flex-1", baseClassName, body), children }),
-    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(CloseControl, { className: cn("-mr-2", !rowish && closeOffsetClassName) })
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { "data-slot": slotName, "data-has-close": "", className: cn("flex gap-2", rowish ? "items-center" : "items-start", row), ...props, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { "data-slot": `${slotName}-body`, className: cn("min-w-0 flex-1", baseClassName, body), children }),
+    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CloseControl, { className: cn("-mr-2", !rowish && closeOffsetClassName) })
   ] });
 }
 
 // src/look.tsx
-var React16 = __toESM(require("react"), 1);
-var import_jsx_runtime21 = require("react/jsx-runtime");
+var React18 = __toESM(require("react"), 1);
+var import_jsx_runtime23 = require("react/jsx-runtime");
 var CONTEXT_SLOT3 = /* @__PURE__ */ Symbol.for("ai-matrx.design-system.look-context");
 var registry2 = globalThis;
-var LookContext = registry2[CONTEXT_SLOT3] ??= React16.createContext("web");
+var LookContext = registry2[CONTEXT_SLOT3] ??= React18.createContext("web");
 function useLook() {
-  return React16.useContext(LookContext);
+  return React18.useContext(LookContext);
 }
 
 // src/use-is-mobile.ts
@@ -3110,8 +3396,8 @@ function useDragMove(options) {
 }
 
 // src/dialog.tsx
-var import_jsx_runtime22 = require("react/jsx-runtime");
-var DialogWindowedByDefaultContext = React17.createContext(false);
+var import_jsx_runtime24 = require("react/jsx-runtime");
+var DialogWindowedByDefaultContext = React19.createContext(false);
 var Dialog = ({
   children,
   ...props
@@ -3119,7 +3405,7 @@ var Dialog = ({
   const isMobile = (0, import_media_query3.useIsMobile)();
   const desktopLook = useLook() === "desktop";
   const modal = desktopLook || (props.modal ?? isMobile);
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(DialogWindowedByDefaultContext.Provider, { value: !desktopLook && props.modal === void 0, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(RadixDialogModalProvider, { modal, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(DialogPrimitive2.Root, { ...props, modal, children }) }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(DialogWindowedByDefaultContext.Provider, { value: !desktopLook && props.modal === void 0, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(RadixDialogModalProvider, { modal, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(DialogPrimitive2.Root, { ...props, modal, children }) }) });
 };
 Dialog.displayName = "Dialog";
 var DialogPortal = ({
@@ -3127,13 +3413,13 @@ var DialogPortal = ({
   ...props
 }) => {
   const resolved = usePortalContainer(container);
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(DialogPrimitive2.Portal, { container: resolved ?? null, ...props });
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(DialogPrimitive2.Portal, { container: resolved ?? null, ...props });
 };
 DialogPortal.displayName = "DialogPortal";
 var CONTEXT_SLOT4 = /* @__PURE__ */ Symbol.for("ai-matrx.design-system.dialog-container-context");
 var contextRegistry3 = globalThis;
-var DialogContainerContext = contextRegistry3[CONTEXT_SLOT4] ??= React17.createContext(null);
-var DialogOverlay = React17.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+var DialogContainerContext = contextRegistry3[CONTEXT_SLOT4] ??= React19.createContext(null);
+var DialogOverlay = React19.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
   DialogPrimitive2.Overlay,
   {
     ref,
@@ -3149,10 +3435,10 @@ var DialogOverlay = React17.forwardRef(({ className, ...props }, ref) => /* @__P
   }
 ));
 DialogOverlay.displayName = DialogPrimitive2.Overlay.displayName;
-var DialogContentPrimitive = React17.forwardRef(({ onInteractOutside, onCloseAutoFocus, ...props }, ref) => {
+var DialogContentPrimitive = React19.forwardRef(({ onInteractOutside, onCloseAutoFocus, ...props }, ref) => {
   const isModal = useRadixDialogModal();
   useModalLayer(isModal);
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
     DialogPrimitive2.Content,
     {
       ...props,
@@ -3167,7 +3453,7 @@ DialogContentPrimitive.displayName = "DialogContentPrimitive";
 var DIALOG_DESKTOP_CLASSES = "matrx-dialog-card fixed inset-0 z-[10000] m-auto grid h-fit min-w-0 w-full max-w-lg gap-4 max-h-[85dvh] overflow-y-auto overscroll-contain [--dialog-pad:1.5rem] overflow-x-clip border bg-background p-6 shadow-lg [overflow-wrap:anywhere] [&>*]:min-w-0 [&>*]:max-w-full sm:rounded-lg";
 var DIALOG_MOBILE_SHEET_CLASSES = "matrx-mobile-sheet matrx-dialog-card fixed inset-x-0 bottom-0 left-0 right-0 top-auto z-[10000] flex min-w-0 flex-col w-full max-w-full max-h-[90dvh] gap-4 [--dialog-pad:1rem] overflow-x-clip border-t bg-background p-4 pb-safe shadow-lg [overflow-wrap:anywhere] [&>*]:min-w-0 [&>*]:max-w-full rounded-t-2xl rounded-b-none overflow-y-auto overscroll-contain";
 var DIALOG_MOBILE_SHEET_OVERRIDE = "inset-x-0 bottom-0 left-0 right-0 top-auto translate-none w-full max-w-full max-h-[90dvh] rounded-b-none rounded-t-2xl overflow-y-auto";
-var DialogWindowHandleContext = React17.createContext(null);
+var DialogWindowHandleContext = React19.createContext(null);
 var WINDOW_KEEP_VISIBLE = 80;
 var DIALOG_SIZE_CLASS = {
   sm: "max-w-md",
@@ -3178,7 +3464,7 @@ var DIALOG_SIZE_CLASS = {
   full: "max-w-[calc(100vw-2rem)]",
   screen: "max-w-none w-screen h-dvh max-h-none rounded-none sm:rounded-none"
 };
-var DialogContent = React17.forwardRef(
+var DialogContent = React19.forwardRef(
   ({
     className,
     children,
@@ -3203,13 +3489,13 @@ var DialogContent = React17.forwardRef(
     const desktopLook = useLook() === "desktop";
     const asSheet = mobileSheet && isMobile && !desktopLook;
     const windowed = !isModal && !asSheet;
-    const windowedByDefault = React17.useContext(DialogWindowedByDefaultContext);
-    const [containerEl, setContainerEl] = React17.useState(
+    const windowedByDefault = React19.useContext(DialogWindowedByDefaultContext);
+    const [containerEl, setContainerEl] = React19.useState(
       null
     );
     const stacks = windowed && windowedByDefault;
-    const [behind, setBehind] = React17.useState(false);
-    React17.useEffect(() => {
+    const [behind, setBehind] = React19.useState(false);
+    React19.useEffect(() => {
       if (!stacks || !containerEl) return;
       const onFront = (event) => {
         const element = event.detail?.element ?? null;
@@ -3225,7 +3511,7 @@ var DialogContent = React17.forwardRef(
       setBehind(false);
       announceLayerFront(containerEl);
     };
-    const [offset, setOffset] = React17.useState({ x: 0, y: 0 });
+    const [offset, setOffset] = React19.useState({ x: 0, y: 0 });
     const drag = useDragMove({
       element: containerEl,
       enabled: windowed,
@@ -3234,11 +3520,11 @@ var DialogContent = React17.forwardRef(
       constrain: (next) => clampRectToViewport(next, readViewport(), { keepVisible: WINDOW_KEEP_VISIBLE }),
       onCommit: (_rect, commit) => setOffset(commit.offset)
     });
-    const handle = React17.useMemo(
+    const handle = React19.useMemo(
       () => windowed ? { onPointerDown: drag.onPointerDown, onDoubleClick: () => setOffset({ x: 0, y: 0 }) } : null,
       [windowed, drag.onPointerDown]
     );
-    const mergedRef = React17.useCallback(
+    const mergedRef = React19.useCallback(
       (node) => {
         setContainerEl(node);
         if (typeof ref === "function") ref(node);
@@ -3250,9 +3536,9 @@ var DialogContent = React17.forwardRef(
     const closeSlot = useCloseSlot(showCloseButton && !desktopLook);
     const hasTitle = (0, import_react_tree2.treeContainsComponent)(children, DialogTitle) || (0, import_react_tree2.treeContainsComponent)(children, DialogPrimitive2.Title);
     const hasDescription = (0, import_react_tree2.treeContainsComponent)(children, DialogDescription) || (0, import_react_tree2.treeContainsComponent)(children, DialogPrimitive2.Description);
-    return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(DialogPortal, { container, children: [
-      isModal ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(DialogOverlay, {}) : null,
-      /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(DialogPortal, { container, children: [
+      isModal ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(DialogOverlay, {}) : null,
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
         DialogContentPrimitive,
         {
           ref: mergedRef,
@@ -3303,9 +3589,9 @@ var DialogContent = React17.forwardRef(
           ...hasDescription ? {} : { "aria-describedby": void 0 },
           ...props,
           children: [
-            hasTitle ? null : /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(VisuallyHidden.Root, { children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(DialogPrimitive2.Title, { children: "Dialog" }) }),
-            closeSlot.slot && !closeSlot.claimed ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CloseRow, {}) : null,
-            /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CloseSlotProvider, { value: closeSlot.slot, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(DialogContainerContext.Provider, { value: containerEl, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(DialogWindowHandleContext.Provider, { value: handle, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+            hasTitle ? null : /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(VisuallyHidden.Root, { children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(DialogPrimitive2.Title, { children: "Dialog" }) }),
+            closeSlot.slot && !closeSlot.claimed ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(CloseRow, {}) : null,
+            /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(CloseSlotProvider, { value: closeSlot.slot, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(DialogContainerContext.Provider, { value: containerEl, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(DialogWindowHandleContext.Provider, { value: handle, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
               PortalContainerProvider,
               {
                 container: containerEl ?? injectedContainer ?? null,
@@ -3323,8 +3609,8 @@ var DialogHeader = ({
   className,
   ...props
 }) => {
-  const handle = React17.useContext(DialogWindowHandleContext);
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+  const handle = React19.useContext(DialogWindowHandleContext);
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
     HeaderWithClose,
     {
       slotName: "dialog-header",
@@ -3344,7 +3630,7 @@ DialogHeader.displayName = "DialogHeader";
 var DialogFooter = ({
   className,
   ...props
-}) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+}) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
   "div",
   {
     "data-slot": "dialog-footer",
@@ -3378,7 +3664,7 @@ var DialogFooter = ({
   }
 );
 DialogFooter.displayName = "DialogFooter";
-var DialogTitle = React17.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+var DialogTitle = React19.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
   DialogPrimitive2.Title,
   {
     ref,
@@ -3388,7 +3674,7 @@ var DialogTitle = React17.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 DialogTitle.displayName = DialogPrimitive2.Title.displayName;
-var DialogDescription = React17.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+var DialogDescription = React19.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
   DialogPrimitive2.Description,
   {
     ref,
@@ -3400,8 +3686,8 @@ var DialogDescription = React17.forwardRef(({ className, ...props }, ref) => /*
 DialogDescription.displayName = DialogPrimitive2.Description.displayName;
 
 // src/input.tsx
-var React18 = __toESM(require("react"), 1);
-var import_jsx_runtime23 = require("react/jsx-runtime");
+var React20 = __toESM(require("react"), 1);
+var import_jsx_runtime25 = require("react/jsx-runtime");
 var getVariantStyles = (variant = "default") => {
   const baseStyles = `flex h-10 w-full ${FIELD_SURFACE_CLASS} text-foreground shadow-input rounded-md px-3 py-2 text-sm file:border-0 file:bg-transparent
     file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground
@@ -3429,9 +3715,9 @@ var getVariantStyles = (variant = "default") => {
       return baseStyles;
   }
 };
-var Input = React18.forwardRef(
+var Input = React20.forwardRef(
   ({ className, type, variant = "default", ...props }, ref) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
       "input",
       {
         type,
@@ -3443,7 +3729,7 @@ var Input = React18.forwardRef(
   }
 );
 Input.displayName = "Input";
-var EnterInput = React18.forwardRef(
+var EnterInput = React20.forwardRef(
   ({ onEnter, ...props }, ref) => {
     const handleKeyDown = (e) => {
       if (e.key === "Enter" && onEnter) {
@@ -3451,7 +3737,7 @@ var EnterInput = React18.forwardRef(
         onEnter();
       }
     };
-    return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
       Input,
       {
         ...props,
@@ -3467,11 +3753,11 @@ var EnterInput = React18.forwardRef(
   }
 );
 EnterInput.displayName = "EnterInput";
-var BasicInput = React18.forwardRef(
+var BasicInput = React20.forwardRef(
   // `variant` is accepted (prop-compatible with Input) but intentionally
   // unused — and destructured so it never leaks onto the DOM element.
   ({ className, type, variant: _variant = "default", ...props }, ref) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
       "input",
       {
         type,
@@ -3486,10 +3772,10 @@ var BasicInput = React18.forwardRef(
   }
 );
 BasicInput.displayName = "BasicInput";
-var InputWithPrefix = React18.forwardRef(({ prefix, prefixInset = "default", className, wrapperClassName, ...props }, ref) => {
+var InputWithPrefix = React20.forwardRef(({ prefix, prefixInset = "default", className, wrapperClassName, ...props }, ref) => {
   const edge = prefixInset === "edge";
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: cn("relative", wrapperClassName), children: [
-    prefix && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: cn("relative", wrapperClassName), children: [
+    prefix && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
       "div",
       {
         className: cn(
@@ -3500,7 +3786,7 @@ var InputWithPrefix = React18.forwardRef(({ prefix, prefixInset = "default", cla
         children: prefix
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
       Input,
       {
         ref,
@@ -3513,7 +3799,7 @@ var InputWithPrefix = React18.forwardRef(({ prefix, prefixInset = "default", cla
 InputWithPrefix.displayName = "InputWithPrefix";
 
 // src/item/ProductSidebarTop.tsx
-var import_jsx_runtime24 = require("react/jsx-runtime");
+var import_jsx_runtime26 = require("react/jsx-runtime");
 function splitSidebarPlaces(places, chosen) {
   const byId = new Map(places.map((p) => [p.id, p]));
   const above = chosen.map((id) => byId.get(id)).filter((p) => p != null);
@@ -3542,15 +3828,15 @@ function ProductSidebarTop({
       search.onChange("");
     }
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { "data-product-sidebar-top": "", className: cn("flex shrink-0 flex-col gap-1 px-2 pb-1 pt-2", className), children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { "data-product-sidebar-top": "", className: cn("flex shrink-0 flex-col gap-1 px-2 pb-1 pt-2", className), children: [
     status,
-    /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex flex-col", children: [
-      newItem ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { className: "flex flex-col", children: [
+      newItem ? /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
         ItemRow,
         {
           size: "sm",
           label: newItem.label ?? "New",
-          leading: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(PlusIcon, { className: "size-4" }),
+          leading: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(PlusIcon, { className: "size-4" }),
           href: newItem.href,
           openInPlace: newItem.href ? true : void 0,
           onOpen: newItem.onOpen,
@@ -3558,37 +3844,37 @@ function ProductSidebarTop({
           disableContextMenu: true
         }
       ) : null,
-      above.map((p) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(PlaceRow, { place: p, onOpen: onOpenPlace ? open : void 0, sourceFeature, chevron: true }, p.id)),
-      more.length > 0 || groups.length > 0 || onEditSidebar ? /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(DropdownMenu, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { "data-sidebar-more-trigger": "", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+      above.map((p) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(PlaceRow, { place: p, onOpen: onOpenPlace ? open : void 0, sourceFeature, chevron: true }, p.id)),
+      more.length > 0 || groups.length > 0 || onEditSidebar ? /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(DropdownMenu, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { "data-sidebar-more-trigger": "", children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
           ItemRow,
           {
             size: "sm",
             label: "More",
-            leading: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(MoreHorizontalIcon, { className: "size-4" }),
+            leading: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(MoreHorizontalIcon, { className: "size-4" }),
             sourceFeature,
             disableContextMenu: true
           }
         ) }) }),
-        /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(DropdownMenuContent, { align: "start", className: "w-56", children: [
-          more.map((p) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(PlaceMenuItem, { place: p, onOpen: open }, p.id)),
-          groups.map((g, i) => /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { role: "group", "aria-label": g.label, children: [
-            more.length > 0 || i > 0 ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(DropdownMenuSeparator, {}) : null,
-            g.label ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(DropdownMenuLabel, { children: g.label }) : null,
-            g.places.map((p) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(PlaceMenuItem, { place: p, onOpen: open }, p.id))
+        /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(MenuLookContent, { align: "start", "data-sidebar-more-menu": "", children: [
+          more.map((p) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(PlaceMenuItem, { place: p, onOpen: open }, p.id)),
+          groups.map((g, i) => /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { role: "group", "aria-label": g.label, children: [
+            more.length > 0 || i > 0 ? /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(MenuLookSeparator, {}) : null,
+            g.label ? /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(MenuLookLabel, { children: g.label }) : null,
+            g.places.map((p) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(PlaceMenuItem, { place: p, onOpen: open }, p.id))
           ] }, g.id)),
-          onEditSidebar ? /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_jsx_runtime24.Fragment, { children: [
-            more.length > 0 || groups.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(DropdownMenuSeparator, {}) : null,
-            /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(DropdownMenuItem, { onSelect: onEditSidebar, children: "Edit sidebar\u2026" })
+          onEditSidebar ? /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_jsx_runtime26.Fragment, { children: [
+            more.length > 0 || groups.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(MenuLookSeparator, {}) : null,
+            /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(MenuLookItem, { icon: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(PanelLeftIcon, {}), label: "Edit sidebar\u2026", onSelect: onEditSidebar })
           ] }) : null
         ] })
       ] }) : null
     ] }),
     children,
-    search ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+    search ? /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
       InputWithPrefix,
       {
-        prefix: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(SearchIcon, { className: "size-4" }),
+        prefix: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(SearchIcon, { className: "size-4" }),
         prefixInset: "edge",
         value: search.value,
         onChange: (e) => search.onChange(e.target.value),
@@ -3609,29 +3895,29 @@ function PlaceRow({
   chevron
 }) {
   const Icon = place.icon;
-  const trailing = chevron ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(ChevronRightIcon, { className: "size-4 text-muted-foreground" }) : void 0;
+  const trailing = chevron ? /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(ChevronRightIcon, { className: "size-4 text-muted-foreground" }) : void 0;
   if (place.children && place.children.length > 0) {
-    return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(DropdownMenu, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { "data-sidebar-place": place.id, "data-sidebar-place-flyout": "", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(DropdownMenu, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { "data-sidebar-place": place.id, "data-sidebar-place-flyout": "", children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
         ItemRow,
         {
           size: "sm",
           label: place.label,
-          leading: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Icon, { className: "size-4" }),
+          leading: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Icon, { className: "size-4" }),
           trailing,
           sourceFeature,
           disableContextMenu: true
         }
       ) }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(DropdownMenuContent, { side: "right", align: "start", className: "w-56", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(FlyoutItems, { place, onOpen: (p) => onOpen ? onOpen(p) : goTo(p) }) })
+      /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(MenuLookContent, { side: "right", align: "start", "data-sidebar-place-menu": place.id, children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(FlyoutItems, { place, onOpen: (p) => onOpen ? onOpen(p) : goTo(p) }) })
     ] });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { "data-sidebar-place": place.id, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { "data-sidebar-place": place.id, children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
     ItemRow,
     {
       size: "sm",
       label: place.label,
-      leading: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Icon, { className: "size-4" }),
+      leading: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Icon, { className: "size-4" }),
       trailing,
       href: place.href,
       openInPlace: place.href && onOpen ? true : void 0,
@@ -3643,38 +3929,26 @@ function PlaceRow({
 }
 function FlyoutItems({ place, onOpen }) {
   const Icon = place.icon;
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_jsx_runtime24.Fragment, { children: [
-    place.href ? /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_jsx_runtime24.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(DropdownMenuItem, { onSelect: () => onOpen({ ...place, children: void 0 }), children: [
-        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Icon, { className: "size-4" }),
-        place.label
-      ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(DropdownMenuSeparator, {})
+  return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_jsx_runtime26.Fragment, { children: [
+    place.href ? /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_jsx_runtime26.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(MenuLookItem, { icon: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Icon, {}), label: place.label, onSelect: () => onOpen({ ...place, children: void 0 }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(MenuLookSeparator, {})
     ] }) : null,
     (place.children ?? []).map((c) => {
       const CIcon = c.icon;
-      return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(DropdownMenuItem, { onSelect: () => onOpen(c), children: [
-        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(CIcon, { className: "size-4" }),
-        c.label
-      ] }, c.id);
+      return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(MenuLookItem, { icon: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(CIcon, {}), label: c.label, onSelect: () => onOpen(c) }, c.id);
     })
   ] });
 }
 function PlaceMenuItem({ place, onOpen }) {
   const Icon = place.icon;
   if (place.children && place.children.length > 0) {
-    return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(DropdownMenuSub, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(DropdownMenuSubTrigger, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Icon, { className: "size-4" }),
-        place.label
-      ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(DropdownMenuSubContent, { className: "w-56", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(FlyoutItems, { place, onOpen }) })
+    return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(MenuLookSub, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(MenuLookSubTrigger, { icon: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Icon, {}), label: place.label, "data-sidebar-more-place": place.id }),
+      /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(MenuLookSubContent, { children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(FlyoutItems, { place, onOpen }) })
     ] });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(DropdownMenuItem, { onSelect: () => onOpen(place), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Icon, { className: "size-4" }),
-    place.label
-  ] });
+  return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(MenuLookItem, { icon: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Icon, {}), label: place.label, onSelect: () => onOpen(place), "data-sidebar-more-place": place.id });
 }
 function goTo(place) {
   if (place.href && typeof window !== "undefined") window.location.assign(place.href);
@@ -3686,14 +3960,14 @@ function SidebarPlacesChooser({
   title = "Above More"
 }) {
   const flip = (id) => onChange(places.filter((p) => p.id === id ? !chosen.includes(id) : chosen.includes(p.id)).map((p) => p.id));
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("section", { className: "flex flex-col gap-1", "data-sidebar-places-chooser": "", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "text-sm font-medium text-foreground", children: title }),
+  return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("section", { className: "flex flex-col gap-1", "data-sidebar-places-chooser": "", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("span", { className: "text-sm font-medium text-foreground", children: title }),
     places.map((p) => {
       const Icon = p.icon;
-      return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("label", { className: "flex h-8 cursor-pointer items-center gap-2 rounded-md px-1 text-sm hover:bg-muted", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Checkbox, { size: "sm", checked: chosen.includes(p.id), onCheckedChange: () => flip(p.id) }),
-        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Icon, { className: "size-4 text-muted-foreground" }),
-        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "text-foreground", children: p.label })
+      return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("label", { className: "flex h-8 cursor-pointer items-center gap-2 rounded-md px-1 text-sm hover:bg-muted", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Checkbox, { size: "sm", checked: chosen.includes(p.id), onCheckedChange: () => flip(p.id) }),
+        /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Icon, { className: "size-4 text-muted-foreground" }),
+        /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("span", { className: "text-foreground", children: p.label })
       ] }, p.id);
     })
   ] });
@@ -3706,15 +3980,15 @@ function SidebarEditDialog({
   saveLabel = "Save as my default",
   children
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Dialog, { open, onOpenChange, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(DialogContent, { size: "sm", onOpenAutoFocus: (e) => e.preventDefault(), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(DialogHeader, { children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(DialogTitle, { children: "Edit sidebar" }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex flex-col gap-4", children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Dialog, { open, onOpenChange, children: /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(DialogContent, { size: "sm", onOpenAutoFocus: (e) => e.preventDefault(), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(DialogHeader, { children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(DialogTitle, { children: "Edit sidebar" }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { className: "flex flex-col gap-4", children: [
       children,
-      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "h-5 truncate text-sm text-destructive", role: "status", children: refusal ?? "" })
+      /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { className: "h-5 truncate text-sm text-destructive", role: "status", children: refusal ?? "" })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(DialogFooter, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Button, { variant: "ghost", onClick: () => onOpenChange(false), children: "Cancel" }),
-      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Button, { onClick: onSave, children: saveLabel })
+    /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(DialogFooter, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Button, { variant: "ghost", onClick: () => onOpenChange(false), children: "Cancel" }),
+      /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Button, { onClick: onSave, children: saveLabel })
     ] })
   ] }) });
 }