@ai-matrx/design-system 0.86.335 → 0.86.337

package/dist/record-list.cjs

@@ -945,7 +945,6 @@ function keepMovedFocus(handler) {
 var import_jsx_runtime13 = 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";
@@ -1700,7 +1699,6 @@ var React10 = __toESM(require("react"), 1);
 var import_jsx_runtime18 = 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";
@@ -1857,19 +1855,381 @@ var ContextMenuShortcut = ({
 );
 ContextMenuShortcut.displayName = "ContextMenuShortcut";
 
+// src/menu-look.tsx
+var React12 = __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 React11 = __toESM(require("react"), 1);
+var import_jsx_runtime19 = 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 = React11.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_runtime19.jsx)(PopoverPrimitive.Portal, { container: portalContainer, children: /* @__PURE__ */ (0, import_jsx_runtime19.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_runtime20 = 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_runtime20.jsx)("span", { className: MENU_LOOK_CLASS.iconSlot, children });
+}
+function MenuLookRowBody({ icon, label, labelTitle, description, trail, badge, shortcut, current }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_jsx_runtime20.Fragment, { children: [
+    icon ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(MenuLookIconSlot, { children: icon }) : null,
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("span", { className: MENU_LOOK_CLASS.text, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: MENU_LOOK_CLASS.label, title: labelTitle, children: label }),
+      description ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: MENU_LOOK_CLASS.hint, children: description }) : null
+    ] }),
+    trail ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: MENU_LOOK_CLASS.trail, children: trail }) : null,
+    badge ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: MENU_LOOK_CLASS.badge, children: badge }) : null,
+    shortcut ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("kbd", { className: MENU_LOOK_CLASS.shortcut, children: shortcut }) : null,
+    current ? /* @__PURE__ */ (0, import_jsx_runtime20.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 = React12.useRef(null);
+  const setViewport = React12.useCallback(
+    (node) => {
+      viewport.current = node;
+      fade.ref(node);
+    },
+    [fade.ref]
+  );
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_jsx_runtime20.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { ref: setViewport, className: "cm-viewport", "data-slot": "menu-look-viewport", children }),
+    fade.state.bottom ? /* @__PURE__ */ (0, import_jsx_runtime20.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_runtime20.jsx)(RadixChevronDownIcon, { "aria-hidden": "true" }),
+          label
+        ]
+      }
+    ) : null
+  ] });
+}
+var MenuLookContent = React12.forwardRef(function MenuLookContent2({ size = "standard", density = "comfortable", moreBelowLabel, children, ...props }, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime20.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_runtime20.jsx)(DeclaredOverflow, { label: moreBelowLabel, children }) : children
+    }
+  );
+});
+var MenuLookSubContent = React12.forwardRef(function MenuLookSubContent2({ size = "standard", density = "comfortable", fit = "menu", ...props }, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime20.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 = React12.forwardRef(function MenuLookContextContent2({ size = "standard", density = "comfortable", ...props }, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+    ContextMenuContent,
+    {
+      ref,
+      "data-menu-look": "",
+      "data-menu-family": "context",
+      "data-size": size,
+      "data-density": density,
+      ...props,
+      className: MENU_LOOK_CLASS.panel
+    }
+  );
+});
+var MenuLookContextSubContent = React12.forwardRef(function MenuLookContextSubContent2({ size = "standard", density = "comfortable", fit = "menu", ...props }, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime20.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 = React12.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_runtime20.jsx)(MenuLookRowBody, { icon, label, labelTitle, description, trail, badge, shortcut, current });
+    const mark = current ? { "data-current": "" } : {};
+    if (href) {
+      return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(P.Item, { ref, asChild: true, "data-slot": `${family}-item`, ...props, ...mark, className, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("a", { href, target, rel: target === "_blank" ? "noopener noreferrer" : void 0, ...linkProps, children: body }) });
+    }
+    return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(P.Item, { ref, "data-slot": `${family}-item`, ...props, ...mark, className, children: body });
+  });
+  const SubTrigger3 = React12.forwardRef(function MenuLookSubTrigger2({ icon, label, labelTitle, description, trail, badge, shortcut, current, ...props }, ref) {
+    return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(P.SubTrigger, { ref, "data-slot": `${family}-sub-trigger`, ...props, ...current ? { "data-current": "" } : {}, className: MENU_LOOK_CLASS.item, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(MenuLookRowBody, { icon, label, labelTitle, description, trail, badge, shortcut }),
+      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(RadixChevronRightIcon, { className: MENU_LOOK_CLASS.chevron, "aria-hidden": "true" })
+    ] });
+  });
+  const CheckboxItem3 = React12.forwardRef(function MenuLookCheckboxItem2({ icon, label, labelTitle, description, trail, badge, shortcut, checked, ...props }, ref) {
+    const on = checked === true;
+    return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(P.CheckboxItem, { ref, ...checked === void 0 ? {} : { checked }, ...props, className: MENU_LOOK_CLASS.item, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(MenuLookRowBody, { icon: on ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(RadixCheckIcon, { className: MENU_LOOK_CLASS.icon }) : icon ?? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: MENU_LOOK_CLASS.icon, "aria-hidden": "true" }), label, labelTitle, description, trail, badge, shortcut }) });
+  });
+  const RadioItem3 = React12.forwardRef(function MenuLookRadioItem2({ icon, label, labelTitle, description, trail, badge, shortcut, ...props }, ref) {
+    return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(P.RadioItem, { ref, ...props, className: MENU_LOOK_CLASS.item, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(MenuLookRowBody, { icon, label, labelTitle, description, trail, badge, shortcut }),
+      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(P.ItemIndicator, { className: MENU_LOOK_CLASS.current, "data-menu-current-mark": "", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(RadixCheckIcon, { "aria-hidden": "true" }) })
+    ] });
+  });
+  const Label3 = React12.forwardRef(function MenuLookLabel2({ description, children, ...props }, ref) {
+    if (!description) return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(P.Label, { ref, ...props, className: MENU_LOOK_CLASS.sectionLabel, children });
+    return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(P.Label, { ref, ...props, "data-has-hint": "", className: MENU_LOOK_CLASS.sectionLabel, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { children }),
+      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: MENU_LOOK_CLASS.hint, children: description })
+    ] });
+  });
+  const Separator3 = React12.forwardRef(function MenuLookSeparator2(props, ref) {
+    return /* @__PURE__ */ (0, import_jsx_runtime20.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 = React12.forwardRef(function MenuLookPanel2({ size = "standard", density = "comfortable", surface = "floating", fillBelow, role = "menu", ...props }, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime20.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 = React12.forwardRef(function MenuLookPopoverContent2({ size = "standard", density = "comfortable", role = "menu", ...props }, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime20.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 = React12.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_runtime20.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_runtime20.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_runtime20.jsx)(
+    "button",
+    {
+      ref,
+      type: "button",
+      role,
+      onClick,
+      ...pressed === void 0 ? {} : { "aria-pressed": pressed },
+      ...props,
+      ...mark,
+      className,
+      children: body
+    }
+  );
+});
+var MenuLookPanelControlRow = React12.forwardRef(function MenuLookPanelControlRow2({ icon, label, description, control, as = "div", ...props }, ref) {
+  const Row = as;
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(Row, { ref, "data-control-row": "", ...props, className: MENU_LOOK_CLASS.item, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(MenuLookRowBody, { icon, label, description }),
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: MENU_LOOK_CLASS.control, children: control })
+  ] });
+});
+var MenuLookSearch = React12.forwardRef(function MenuLookSearch2({ placeholder = "Search", ...props }, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: MENU_LOOK_CLASS.search, "data-menu-look-search": "", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+    "input",
+    {
+      ref,
+      type: "search",
+      autoComplete: "off",
+      spellCheck: false,
+      placeholder,
+      "aria-label": props["aria-label"] ?? placeholder,
+      ...props
+    }
+  ) });
+});
+
 // src/item/ItemMenuDrawer.tsx
 var import_react6 = require("react");
 
 // src/drawer.tsx
 var import_react_tree = require("@ai-matrx/kit/react-tree");
-var React13 = __toESM(require("react"), 1);
+var React15 = __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 React11 = __toESM(require("react"), 1);
-var import_jsx_runtime19 = require("react/jsx-runtime");
+var React13 = __toESM(require("react"), 1);
+var import_jsx_runtime21 = 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;
@@ -1908,7 +2268,7 @@ function isModalLayerOpen() {
   return registry2.count > 0;
 }
 function useModalLayer(active) {
-  React11.useLayoutEffect(() => active ? registerModalLayer() : void 0, [active]);
+  React13.useLayoutEffect(() => active ? registerModalLayer() : void 0, [active]);
 }
 var POPPER_WRAPPER = "[data-radix-popper-content-wrapper]";
 function isInsideFloatingLayer(target) {
@@ -1923,8 +2283,8 @@ function keepFloatingLayersInside(handler) {
   };
 }
 var preventAutoFocus = (event) => event.preventDefault();
-var FloatingLayer = React11.forwardRef(({ children }, ref) => {
-  const [opener] = React11.useState(
+var FloatingLayer = React13.forwardRef(({ children }, ref) => {
+  const [opener] = React13.useState(
     () => typeof document === "undefined" ? null : document.activeElement
   );
   const returnFocus = (event) => {
@@ -1935,7 +2295,7 @@ var FloatingLayer = React11.forwardRef(({ children }, ref) => {
       opener.focus({ preventScroll: true });
     }
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
     import_react_focus_scope.FocusScope,
     {
       asChild: true,
@@ -1943,7 +2303,7 @@ var FloatingLayer = React11.forwardRef(({ children }, ref) => {
       loop: false,
       onMountAutoFocus: preventAutoFocus,
       onUnmountAutoFocus: returnFocus,
-      children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
         import_react_slot3.Slot,
         {
           ref,
@@ -1958,22 +2318,22 @@ var FloatingLayer = React11.forwardRef(({ children }, ref) => {
 FloatingLayer.displayName = "FloatingLayer";
 
 // src/radix-dialog-modal-context.tsx
-var React12 = __toESM(require("react"), 1);
-var import_jsx_runtime20 = require("react/jsx-runtime");
+var React14 = __toESM(require("react"), 1);
+var import_jsx_runtime22 = 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] ??= React12.createContext(true);
+var RadixDialogModalContext = contextRegistry2[CONTEXT_SLOT2] ??= React14.createContext(true);
 function RadixDialogModalProvider({
   children,
   modal
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(RadixDialogModalContext.Provider, { value: modal, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(RadixDialogModalContext.Provider, { value: modal, children });
 }
 
 // src/drawer.tsx
-var import_jsx_runtime21 = require("react/jsx-runtime");
-var DrawerDirectionContext = React13.createContext("bottom");
-var useDrawerDirection = () => React13.useContext(DrawerDirectionContext);
+var import_jsx_runtime23 = require("react/jsx-runtime");
+var DrawerDirectionContext = React15.createContext("bottom");
+var useDrawerDirection = () => React15.useContext(DrawerDirectionContext);
 var Drawer = ({
   children,
   shouldScaleBackground = true,
@@ -1987,7 +2347,7 @@ var Drawer = ({
     }
     onOpenChange?.(open);
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(RadixDialogModalProvider, { modal: true, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(DrawerDirectionContext.Provider, { value: direction, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(RadixDialogModalProvider, { modal: true, children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(DrawerDirectionContext.Provider, { value: direction, children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
     import_vaul.Drawer.Root,
     {
       modal: true,
@@ -2003,7 +2363,7 @@ Drawer.displayName = "Drawer";
 var DrawerTrigger = import_vaul.Drawer.Trigger;
 var DrawerPortal = import_vaul.Drawer.Portal;
 var DrawerClose = import_vaul.Drawer.Close;
-var DrawerOverlay = React13.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+var DrawerOverlay = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
   import_vaul.Drawer.Overlay,
   {
     ref,
@@ -2016,7 +2376,7 @@ var DrawerOverlay = React13.forwardRef(({ className, ...props }, ref) => /* @__P
   }
 ));
 DrawerOverlay.displayName = import_vaul.Drawer.Overlay.displayName;
-var DrawerDescription = React13.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+var DrawerDescription = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
   import_vaul.Drawer.Description,
   {
     ref,
@@ -2026,9 +2386,9 @@ var DrawerDescription = React13.forwardRef(({ className, ...props }, ref) => /*
   }
 ));
 DrawerDescription.displayName = import_vaul.Drawer.Description.displayName;
-var DrawerContentPrimitive = React13.forwardRef(({ onInteractOutside, ...props }, ref) => {
+var DrawerContentPrimitive = React15.forwardRef(({ onInteractOutside, ...props }, ref) => {
   useModalLayer(true);
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
     import_vaul.Drawer.Content,
     {
       "data-matrx-entrance": "none",
@@ -2052,13 +2412,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 = React13.forwardRef(({ className, children, size = "adaptive", showHandle, ...props }, ref) => {
+var DrawerContent = React15.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_runtime21.jsxs)(DrawerPortal, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(DrawerOverlay, {}),
-    /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(DrawerPortal, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(DrawerOverlay, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
       DrawerContentPrimitive,
       {
         ref,
@@ -2075,7 +2435,7 @@ var DrawerContent = React13.forwardRef(({ className, children, size = "adaptive"
         children: [
           withHandle ? (
             // Rule 3: the pill is 4px; the TARGET is 44px.
-            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
               "div",
               {
                 "aria-hidden": true,
@@ -2084,7 +2444,7 @@ var DrawerContent = React13.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_runtime21.jsx)("div", { className: "h-1 w-[100px] rounded-full bg-muted" })
+                children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "h-1 w-[100px] rounded-full bg-muted" })
               }
             )
           ) : null,
@@ -2098,7 +2458,7 @@ DrawerContent.displayName = "DrawerContent";
 var DrawerHeader = ({
   className,
   ...props
-}) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+}) => /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
   "div",
   {
     "data-slot": "drawer-header",
@@ -2113,7 +2473,7 @@ DrawerHeader.displayName = "DrawerHeader";
 var DrawerBody = ({
   className,
   ...props
-}) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+}) => /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
   "div",
   {
     "data-slot": "drawer-body",
@@ -2125,7 +2485,7 @@ DrawerBody.displayName = "DrawerBody";
 var DrawerFooter = ({
   className,
   ...props
-}) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+}) => /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
   "div",
   {
     "data-slot": "drawer-footer",
@@ -2134,7 +2494,7 @@ var DrawerFooter = ({
   }
 );
 DrawerFooter.displayName = "DrawerFooter";
-var DrawerTitle = React13.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+var DrawerTitle = React15.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
   import_vaul.Drawer.Title,
   {
     ref,
@@ -2166,7 +2526,7 @@ function resolveItemMenuConfig(input) {
 }
 
 // src/item/ItemMenuDrawer.tsx
-var import_jsx_runtime22 = require("react/jsx-runtime");
+var import_jsx_runtime24 = require("react/jsx-runtime");
 function resolveSections(config, path) {
   let sections = config.sections;
   let title = null;
@@ -2207,24 +2567,24 @@ function ItemMenuDrawer({
     if (!next) setPath([]);
     onOpenChange(next);
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Drawer, { open, onOpenChange: handleOpenChange, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(DrawerContent, { className: "max-h-[80dvh] flex flex-col", children: [
-    atRoot ? headerTitle ? /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex-shrink-0 border-b border-border px-4 pb-3 pt-1", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(DrawerTitle, { className: "text-center text-[15px] font-semibold", children: headerTitle }),
-      config.header?.description && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("p", { className: "mt-1 text-center type-body text-muted-foreground", children: config.header.description })
-    ] }) : /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(DrawerTitle, { className: "sr-only", children: "Options" }) : /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex h-11 flex-shrink-0 items-center border-b border-border px-1", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Drawer, { open, onOpenChange: handleOpenChange, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(DrawerContent, { className: "max-h-[80dvh] flex flex-col", children: [
+    atRoot ? headerTitle ? /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex-shrink-0 border-b border-border px-4 pb-3 pt-1", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(DrawerTitle, { className: "text-center text-[15px] font-semibold", children: headerTitle }),
+      config.header?.description && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("p", { className: "mt-1 text-center type-body text-muted-foreground", children: config.header.description })
+    ] }) : /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(DrawerTitle, { className: "sr-only", children: "Options" }) : /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex h-11 flex-shrink-0 items-center border-b border-border px-1", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime24.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_runtime22.jsx)(ChevronLeftIcon, { className: "h-5 w-5" })
+          children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(ChevronLeftIcon, { className: "h-5 w-5" })
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(DrawerTitle, { className: "flex-1 truncate pr-10 text-center text-[15px] font-semibold", children: headerTitle ?? "Options" })
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(DrawerTitle, { className: "flex-1 truncate pr-10 text-center text-[15px] font-semibold", children: headerTitle ?? "Options" })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
       "div",
       {
         className: cn(
@@ -2236,10 +2596,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_runtime22.jsxs)("div", { children: [
-              sIdx > 0 && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "my-1 h-px bg-border" }),
-              section.label && /* @__PURE__ */ (0, import_jsx_runtime22.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_runtime22.jsx)(
+            return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { children: [
+              sIdx > 0 && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "my-1 h-px bg-border" }),
+              section.label && /* @__PURE__ */ (0, import_jsx_runtime24.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_runtime24.jsx)(
                 DrawerEntry,
                 {
                   entry,
@@ -2273,8 +2633,8 @@ function DrawerEntry({
     disabled ? "opacity-50" : "active:bg-accent",
     destructive && "text-destructive"
   );
-  const content = /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_jsx_runtime22.Fragment, { children: [
-    Icon && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+  const content = /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_jsx_runtime24.Fragment, { children: [
+    Icon && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
       Icon,
       {
         className: cn(
@@ -2283,19 +2643,19 @@ function DrawerEntry({
         )
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("span", { className: "flex min-w-0 flex-1 flex-col", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "truncate text-[15px]", title: entry.description, children: entry.label }),
-      disabled && entry.disabledReason ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "truncate type-body text-muted-foreground", children: entry.disabledReason }) : null
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("span", { className: "flex min-w-0 flex-1 flex-col", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "truncate text-[15px]", title: entry.description, children: entry.label }),
+      disabled && entry.disabledReason ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "truncate type-body text-muted-foreground", children: entry.disabledReason }) : null
     ] })
   ] });
   if (isSubmenu(entry)) {
-    return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("button", { type: "button", disabled, onClick: onDrill, className: rowClass, children: [
+    return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("button", { type: "button", disabled, onClick: onDrill, className: rowClass, children: [
       content,
-      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(ChevronRightIcon, { className: "h-5 w-5 shrink-0 text-muted-foreground" })
+      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(ChevronRightIcon, { className: "h-5 w-5 shrink-0 text-muted-foreground" })
     ] });
   }
   if (isCheckbox(entry)) {
-    return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
       "button",
       {
         type: "button",
@@ -2304,13 +2664,13 @@ function DrawerEntry({
         className: rowClass,
         children: [
           content,
-          entry.checked && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CheckIcon, { className: "h-5 w-5 shrink-0 text-primary" })
+          entry.checked && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(CheckIcon, { className: "h-5 w-5 shrink-0 text-primary" })
         ]
       }
     );
   }
   if (isLink(entry)) {
-    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
       "a",
       {
         href: entry.href,
@@ -2322,7 +2682,7 @@ function DrawerEntry({
       }
     );
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
     "button",
     {
       type: "button",
@@ -2338,13 +2698,13 @@ function DrawerEntry({
 }
 
 // src/item/host.tsx
-var React14 = __toESM(require("react"), 1);
-var import_jsx_runtime23 = require("react/jsx-runtime");
+var React16 = __toESM(require("react"), 1);
+var import_jsx_runtime25 = 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] = React14.createContext(null));
+var ItemMenuHostContext = hostRegistry2[HOST_KEY] ?? (hostRegistry2[HOST_KEY] = React16.createContext(null));
 function useItemMenuHost() {
-  return React14.useContext(ItemMenuHostContext);
+  return React16.useContext(ItemMenuHostContext);
 }
 
 // src/item/run-entry.ts
@@ -2373,54 +2733,39 @@ function runToggle(entry, next) {
 }
 
 // src/item/ItemMenu.tsx
-var import_jsx_runtime24 = require("react/jsx-runtime");
+var import_jsx_runtime26 = 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_runtime24.jsxs)(import_jsx_runtime24.Fragment, { children: [
-    Icon && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
-      Icon,
-      {
-        className: cn(
-          "h-4 w-4 shrink-0",
-          destructive ? "text-destructive" : entry.iconClassName ?? "text-muted-foreground"
-        )
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("span", { className: "flex min-w-0 flex-1 flex-col", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "truncate", title: entry.description, children: entry.label }),
-      secondLine && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "truncate type-secondary text-muted-foreground", children: secondLine })
-    ] }),
-    entry.badge && /* @__PURE__ */ (0, import_jsx_runtime24.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_runtime24.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_runtime26.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,
@@ -2428,10 +2773,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_runtime24.jsx)(import_jsx_runtime24.Fragment, { children: visibleSections.map((section, sIdx) => /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_react7.Fragment, { children: [
-    sIdx > 0 && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(family.Separator, {}),
-    section.label && /* @__PURE__ */ (0, import_jsx_runtime24.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_runtime24.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_jsx_runtime26.Fragment, { children: visibleSections.map((section, sIdx) => /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_react7.Fragment, { children: [
+    sIdx > 0 && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(family.Separator, {}),
+    section.label && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(family.Label, { children: section.label }),
+    section.items.map((entry) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
       MenuLeaf,
       {
         family,
@@ -2453,18 +2798,11 @@ function MenuLeaf({
 }) {
   const toastPromise = useItemMenuHost()?.toastPromise;
   if (isSubmenu(entry)) {
-    return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(family.Sub, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(family.SubTrigger, { disabled: entry.disabled, className: "gap-2", onPointerLeave: (event) => {
+    return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(family.Sub, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime26.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_runtime24.jsx)(
-        EntryInner,
-        {
-          entry,
-          Shortcut: family.Shortcut,
-          showShortcut: false
-        }
-      ) }),
-      /* @__PURE__ */ (0, import_jsx_runtime24.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_runtime24.jsx)(
+      } }),
+      /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(family.SubContent, { onFocusOutside: keepCanonicalPaletteInteraction, onPointerDownOutside: keepCanonicalPaletteInteraction, fit: entry.renderContent ? "content" : "menu", children: entry.renderContent ? entry.renderContent(onCloseRequest) : /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
         MenuSections,
         {
           family,
@@ -2475,40 +2813,36 @@ function MenuLeaf({
     ] });
   }
   if (isCheckbox(entry)) {
-    return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime26.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_runtime24.jsx)(EntryInner, { entry, Shortcut: family.Shortcut })
+        onCheckedChange: (next) => runToggle(entry, next)
       }
     );
   }
   if (isLink(entry)) {
-    return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(family.Item, { asChild: true, disabled: entry.disabled, className: "gap-2", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
-      "a",
+    return /* @__PURE__ */ (0, import_jsx_runtime26.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_runtime24.jsx)(EntryInner, { entry, Shortcut: family.Shortcut })
+        linkProps: { onClick: onCloseRequest }
       }
-    ) });
+    );
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime26.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_runtime24.jsx)(EntryInner, { entry, Shortcut: family.Shortcut })
+      destructive: entry.tone === "destructive",
+      onSelect: () => runCommand(entry, toastPromise)
     }
   );
 }
@@ -2533,7 +2867,7 @@ function makeShortcutHandler(config, close, toastPromise) {
   };
 }
 function RowAlchemyIcon(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime24.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_runtime24.jsx)("path", { d }, index)) });
+  return /* @__PURE__ */ (0, import_jsx_runtime26.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_runtime26.jsx)("path", { d }, index)) });
 }
 function hasVisibleEntry(config, id) {
   const entries = config?.sections.flatMap((section) => section.items) ?? [];
@@ -2562,7 +2896,7 @@ function RowAlchemySubmenuContent({ onClose, restoreFocus }) {
     mountMenu?.(target.current, () => closeRef.current(), () => focusRef.current());
     return () => mountMenu?.(null);
   }, [mountMenu]);
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { ref: target, "data-canonical-alchemy-submenu": true, "aria-label": "Alchemy output options", onKeyDown: (event) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { ref: target, "data-canonical-alchemy-submenu": true, "aria-label": "Alchemy output options", onKeyDown: (event) => {
     if (event.key === "Tab") event.stopPropagation();
   } });
 }
@@ -2575,7 +2909,6 @@ function ItemMenu({
   open: openProp,
   onOpenChange,
   onCloseAutoFocus,
-  contentMinWidth = "12rem",
   presentation = "auto"
 }) {
   const toastPromise = useItemMenuHost()?.toastPromise;
@@ -2599,7 +2932,7 @@ function ItemMenu({
     icon: RowAlchemyIcon,
     disabled: rowAlchemy.copy.disabled,
     sections: [],
-    renderContent: (onClose) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(RowAlchemySubmenuContent, { onClose, restoreFocus: () => (dropdownTriggerRef.current ?? restoreTargetRef.current)?.focus() })
+    renderContent: (onClose) => /* @__PURE__ */ (0, import_jsx_runtime26.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;
@@ -2613,20 +2946,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_react7.useRef)(null);
-  const setViewport = (0, import_react7.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);
@@ -2643,8 +2962,8 @@ function ItemMenu({
     dropdownTriggerRef.current?.focus();
   }, [armed]);
   if (mode === "drawer") {
-    return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_jsx_runtime24.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_jsx_runtime26.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
         import_react_slot4.Slot,
         {
           onClick: (e) => {
@@ -2655,7 +2974,7 @@ function ItemMenu({
           children
         }
       ),
-      resolved && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+      resolved && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
         ItemMenuDrawer,
         {
           open,
@@ -2668,7 +2987,7 @@ function ItemMenu({
     ] });
   }
   if (!live) {
-    return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
       import_react_slot4.Slot,
       {
         "data-item-menu-trigger": "idle",
@@ -2691,20 +3010,17 @@ function ItemMenu({
       }
     );
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(DropdownMenu, { open, onOpenChange: handleOpenChange, modal: false, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(DropdownMenuTrigger, { ref: dropdownTriggerRef, asChild: true, children }),
-    resolved && /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
-      DropdownMenuContent,
+  return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(DropdownMenu, { open, onOpenChange: handleOpenChange, modal: false, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(DropdownMenuTrigger, { ref: dropdownTriggerRef, asChild: true, children }),
+    resolved && /* @__PURE__ */ (0, import_jsx_runtime26.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,
@@ -2712,42 +3028,13 @@ function ItemMenu({
           toastPromise
         ),
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
-            "div",
+          resolved.header?.title && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(MenuLookLabel, { description: resolved.header.description, children: resolved.header.title }),
+          /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+            MenuSections,
             {
-              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_runtime24.jsxs)(DropdownMenuLabel, { className: "text-xs", children: [
-                  resolved.header.title,
-                  resolved.header.description && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "mt-0.5 block type-meta font-normal text-muted-foreground", children: resolved.header.description })
-                ] }),
-                /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
-                  MenuSections,
-                  {
-                    family: dropdownFamily,
-                    sections: resolved.sections,
-                    onCloseRequest: () => handleOpenChange(false)
-                  }
-                )
-              ]
-            }
-          ),
-          scrollFade.state.bottom && /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
-            "button",
-            {
-              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_runtime24.jsx)(ChevronDownIcon, { className: "h-3 w-3" }),
-                "More actions below"
-              ]
+              family: dropdownFamily,
+              sections: resolved.sections,
+              onCloseRequest: () => handleOpenChange(false)
             }
           )
         ]
@@ -2758,10 +3045,10 @@ function ItemMenu({
 ItemMenu.routeHeaderMenu = true;
 function ItemContextMenu(props) {
   const host = useItemMenuHost();
-  if (props.enabled === false) return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_jsx_runtime24.Fragment, { children: props.children });
+  if (props.enabled === false) return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_jsx_runtime26.Fragment, { children: props.children });
   const HostMenu = host?.ContextMenu;
-  if (HostMenu) return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(HostMenu, { ...props });
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(DefaultItemContextMenu, { ...props });
+  if (HostMenu) return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(HostMenu, { ...props });
+  return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(DefaultItemContextMenu, { ...props });
 }
 function DefaultItemContextMenu({
   config,
@@ -2772,7 +3059,7 @@ function DefaultItemContextMenu({
 }) {
   const [resolved, setResolved] = (0, import_react7.useState)(null);
   const targetRef = (0, import_react7.useRef)(null);
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
     ContextMenu,
     {
       modal: false,
@@ -2784,7 +3071,7 @@ function DefaultItemContextMenu({
         onOpenChange?.(open);
       },
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
           ContextMenuTrigger,
           {
             asChild: true,
@@ -2794,17 +3081,10 @@ function DefaultItemContextMenu({
             children
           }
         ),
-        resolved && /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
-          ContextMenuContent,
-          {
-            className: "z-[9999] min-w-[12rem]",
-            onCloseAutoFocus,
-            children: [
-              resolved.header?.title && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(ContextMenuLabel, { className: "text-xs font-medium text-muted-foreground", children: resolved.header.title }),
-              /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(MenuSections, { family: contextFamily, sections: resolved.sections, onCloseRequest: () => onOpenChange?.(false) })
-            ]
-          }
-        )
+        resolved && /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(MenuLookContextContent, { onCloseAutoFocus, children: [
+          resolved.header?.title && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(MenuLookContextLabel, { description: resolved.header.description, children: resolved.header.title }),
+          /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(MenuSections, { family: contextFamily, sections: resolved.sections, onCloseRequest: () => onOpenChange?.(false) })
+        ] })
       ]
     }
   );
@@ -2813,7 +3093,7 @@ declareLazyDataProps(ItemMenu, ["config"]);
 declareLazyDataProps(ItemContextMenu, ["config"]);
 
 // src/item/ItemRow.tsx
-var import_jsx_runtime25 = require("react/jsx-runtime");
+var import_jsx_runtime27 = 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.
@@ -2902,7 +3182,7 @@ function ItemRow({
   const startInlineRename = () => {
     if (canRename) setEditing(true);
   };
-  const labelNode = editing && rename ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+  const labelNode = editing && rename ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
     EditableLabel,
     {
       activation: "controlled",
@@ -2917,17 +3197,17 @@ function ItemRow({
       className: "flex-1",
       inputClassName: cn("font-normal", sz.text)
     }
-  ) : subtitle != null ? /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("span", { className: "flex min-w-0 flex-1 flex-col", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { className: cn("item-fade min-w-0", sz.text), title: label, children: label }),
-    /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { className: "min-w-0 truncate type-secondary text-muted-foreground", "data-item-subtitle": "", children: subtitle })
-  ] }) : /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { className: cn("item-fade min-w-0 flex-1", sz.text), title: label, children: label });
-  const primaryInner = /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(import_jsx_runtime25.Fragment, { children: [
-    leading != null && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { className: "flex shrink-0 items-center", children: leading }),
+  ) : subtitle != null ? /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("span", { className: "flex min-w-0 flex-1 flex-col", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("span", { className: cn("item-fade min-w-0", sz.text), title: label, children: label }),
+    /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("span", { className: "min-w-0 truncate type-secondary text-muted-foreground", "data-item-subtitle": "", children: subtitle })
+  ] }) : /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("span", { className: cn("item-fade min-w-0 flex-1", sz.text), title: label, children: label });
+  const primaryInner = /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_jsx_runtime27.Fragment, { children: [
+    leading != null && /* @__PURE__ */ (0, import_jsx_runtime27.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_runtime25.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
       "span",
       {
         className: cn(
@@ -2938,14 +3218,14 @@ function ItemRow({
         children: secondaryLabel
       }
     ),
-    (trailing != null || trailingOnHover != null) && /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("span", { className: "item-shift flex shrink-0 items-center gap-1 pr-0.5", children: [
+    (trailing != null || trailingOnHover != null) && /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("span", { className: "item-shift flex shrink-0 items-center gap-1 pr-0.5", children: [
       trailing,
-      trailingOnHover != null && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { className: cn("hidden", REVEAL_DISPLAY), "data-item-trailing-hover": "", children: trailingOnHover })
+      trailingOnHover != null && /* @__PURE__ */ (0, import_jsx_runtime27.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_runtime25.jsx)(
+  const disclosureButton = disclosure ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
     Button2,
     {
       type: "button",
@@ -2957,7 +3237,7 @@ function ItemRow({
         e.stopPropagation();
         disclosure.onToggle();
       },
-      icon: disclosure.open ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(ChevronDownIcon, { className: sz.icon }) : /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(ChevronRightIcon, { className: sz.icon }),
+      icon: disclosure.open ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(ChevronDownIcon, { className: sz.icon }) : /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(ChevronRightIcon, { className: sz.icon }),
       className: "shrink-0"
     }
   ) : null;
@@ -2976,11 +3256,11 @@ function ItemRow({
   } : void 0;
   let primary;
   if (editing || disabled) {
-    primary = /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: primaryClass, style: indentStyle, "data-item-primary": "", children: primaryInner });
+    primary = /* @__PURE__ */ (0, import_jsx_runtime27.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_runtime25.jsx)(
+    primary = /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
       Link,
       {
         href,
@@ -3002,7 +3282,7 @@ function ItemRow({
       }
     );
   } else {
-    primary = /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+    primary = /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
       "button",
       {
         type: "button",
@@ -3019,19 +3299,19 @@ function ItemRow({
       }
     );
   }
-  const kebab = mappedMenu && !editing ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+  const kebab = mappedMenu && !editing ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
     ItemMenu,
     {
       config: mappedMenu,
       align: "end",
       onCloseAutoFocus: handleCloseAutoFocus,
-      children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
         Button2,
         {
           type: "button",
           variant: "quiet",
           "aria-label": kebabAriaLabel ?? `Options for ${label}`,
-          icon: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(MoreHorizontalIcon, { className: sz.icon }),
+          icon: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(MoreHorizontalIcon, { className: sz.icon }),
           "aria-haspopup": "menu",
           onClick: (e) => e.stopPropagation(),
           "data-item-kebab": "",
@@ -3047,7 +3327,7 @@ function ItemRow({
       )
     }
   ) : null;
-  const row = /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
+  const row = /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
     "div",
     {
       "data-active": active || void 0,
@@ -3060,9 +3340,9 @@ function ItemRow({
         className
       ),
       children: [
-        leadingControl != null ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { className: "flex shrink-0 items-center pl-2", "data-item-leading-control": "", children: leadingControl }) : null,
+        leadingControl != null ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("span", { className: "flex shrink-0 items-center pl-2", "data-item-leading-control": "", children: leadingControl }) : null,
         primary,
-        !sideBySide && disclosureButton ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+        !sideBySide && disclosureButton ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
           "span",
           {
             className: "item-shift absolute inset-y-0 right-1 flex items-center",
@@ -3071,7 +3351,7 @@ function ItemRow({
           }
         ) : null,
         !sideBySide && kebab,
-        sideBySide && (actions != null || kebab || disclosureButton) ? /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
+        sideBySide && (actions != null || kebab || disclosureButton) ? /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
           "span",
           {
             className: "flex shrink-0 items-center [&>:not(.matrx-tap-target,.matrx-alchemy)]:mx-0.5",
@@ -3087,7 +3367,7 @@ function ItemRow({
     }
   );
   if (!mappedMenu || disableContextMenu) return row;
-  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
     ItemContextMenu,
     {
       config: mappedMenu,
@@ -3109,13 +3389,13 @@ function ItemRow({
 
 // src/checkbox.tsx
 var CheckboxPrimitive = __toESM(require("@radix-ui/react-checkbox"), 1);
-var React15 = __toESM(require("react"), 1);
-var import_jsx_runtime26 = require("react/jsx-runtime");
+var React17 = __toESM(require("react"), 1);
+var import_jsx_runtime28 = 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 = React15.forwardRef(({ className, size = "md", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+var Checkbox = React17.forwardRef(({ className, size = "md", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
   CheckboxPrimitive.Root,
   {
     ref,
@@ -3126,12 +3406,12 @@ var Checkbox = React15.forwardRef(({ className, size = "md", ...props }, ref) =>
       className
     ),
     ...props,
-    children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+    children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
       CheckboxPrimitive.Indicator,
       {
         "data-slot": "checkbox-indicator",
         className: "flex items-center justify-center text-current",
-        children: props.checked === "indeterminate" ? /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(DividerHorizontalIcon, { className: CHECKBOX_SIZES[size].glyph }) : /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(RadixCheckIcon, { className: CHECKBOX_SIZES[size].glyph })
+        children: props.checked === "indeterminate" ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(DividerHorizontalIcon, { className: CHECKBOX_SIZES[size].glyph }) : /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(RadixCheckIcon, { className: CHECKBOX_SIZES[size].glyph })
       }
     )
   }
@@ -3172,7 +3452,7 @@ var MAC_ROW_HEIGHT_BY_DENSITY = {
 };
 
 // src/record-list/RecordList.tsx
-var import_jsx_runtime27 = require("react/jsx-runtime");
+var import_jsx_runtime29 = require("react/jsx-runtime");
 function RecordList({
   items,
   getKey,
@@ -3202,7 +3482,7 @@ function RecordList({
 }) {
   const listRef = (0, import_react9.useRef)(null);
   if (items.length === 0) {
-    return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className, "data-record-list": "", ...{ [MAC_LIST_ATTRIBUTE]: "" }, children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(ReadEmpty, { read, children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(ListEmptyView, { emptyState }) }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className, "data-record-list": "", ...{ [MAC_LIST_ATTRIBUTE]: "" }, children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(ReadEmpty, { read, children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(ListEmptyView, { emptyState }) }) });
   }
   const selectable = selectedKeys !== void 0;
   const selected = new Set(selectedKeys ?? []);
@@ -3225,9 +3505,9 @@ function RecordList({
       next.focus();
     }
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { className: cn("flex flex-col gap-2", className), "data-record-list": "", ...{ [MAC_LIST_ATTRIBUTE]: "" }, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(ReadStaleNotice, { read }),
-    /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { className: cn("flex flex-col gap-2", className), "data-record-list": "", ...{ [MAC_LIST_ATTRIBUTE]: "" }, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(ReadStaleNotice, { read }),
+    /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
       "ul",
       {
         ref: listRef,
@@ -3247,7 +3527,7 @@ function RecordList({
           const lead = leading?.(item);
           const trail = trailing?.(item);
           const sub = subtitle?.(item);
-          return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("li", { "data-record-key": key, children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+          return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("li", { "data-record-key": key, children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
             ItemRow,
             {
               label: name,
@@ -3267,7 +3547,7 @@ function RecordList({
               ...surfaceName ? { surfaceName } : {},
               ...rowEntity ? { entity: rowEntity } : {},
               ...selectable ? {
-                leadingControl: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+                leadingControl: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
                   Checkbox,
                   {
                     size: "sm",