@neut/ui 0.0.16 → 0.0.18

package/dist/components/context-menu/ContextMenuContent/useContextMenuContent.js

@@ -1,153 +1,87 @@
-import { createPositioner as e } from "../../../lib/positioner/create-positioner.js";
-import { offset as t } from "../../../lib/positioner/middleware/offset.js";
-import { shift as n } from "../../../lib/positioner/middleware/shift.js";
-import { flip as r } from "../../../lib/positioner/middleware/flip.js";
-import { size as i } from "../../../lib/positioner/middleware/size.js";
-import { hide as a } from "../../../lib/positioner/middleware/hide.js";
-import { containingBlockOffset as o } from "../../../lib/positioner/middleware/containing-block-offset.js";
-import { toContextMenuPlacement as s } from "../context-menu.utils.js";
-import { createEffect as c, createMemo as l, createSignal as u, createUniqueId as d, onCleanup as f } from "solid-js";
+import { handleMenuKeyDown as e } from "../context-menu.keyboard.js";
+import { createHighlight as t } from "./context-menu.highlight.js";
+import { createPopupPositioner as n } from "./context-menu.positioner.js";
+import { createItemCollection as r } from "./context-menu.popup-items.js";
+import { createTypeahead as i } from "../context-menu.typeahead.js";
+import { createSignal as a, createUniqueId as o, onCleanup as s } from "solid-js";
 //#region src/components/context-menu/ContextMenuContent/useContextMenuContent.ts
-var p = 500;
-function m(m) {
-	let { root: h } = m, g = () => m.loopFocus?.() ?? h.loopFocus(), _ = () => m.orientation?.() ?? h.orientation(), v = () => m.highlightItemOnHover?.() ?? h.highlightItemOnHover(), [y, b] = u(), [x, S] = u(), [C, w] = u([]), [T, E] = u(), [D, O] = u(), [k, A] = u(), j = `context-menu-popup-${d()}`, M = e(m.reference, x, {
-		placement: () => s(m.side(), m.align(), m.dir()),
-		strategy: "fixed",
-		middleware: () => [
-			t({
-				mainAxis: m.sideOffset(),
-				crossAxis: m.alignOffset()
-			}),
-			r(),
-			n({ padding: m.collisionPadding() }),
-			i({
-				padding: m.collisionPadding(),
-				apply: ({ availableHeight: e }) => A(e)
-			}),
-			a(),
-			o()
-		]
-	}), N = l(() => [...C()].sort((e, t) => e.element === t.element ? 0 : e.element.compareDocumentPosition(t.element) & Node.DOCUMENT_POSITION_FOLLOWING ? -1 : 1)), P = l(() => N().filter((e) => !e.disabled())), F = () => N().find((e) => e.id === T()), I = (e) => (w((t) => [...t, e]), () => w((t) => t.filter((t) => t.id !== e.id))), L = () => O(void 0), R = (e) => {
-		E(e);
-		let t = D();
-		t && t.id !== e && L();
-	}, z = (e) => {
-		let t = P();
-		if (t.length === 0) return;
-		let n = t.findIndex((e) => e.id === T()), r;
-		n === -1 ? r = e > 0 ? 0 : t.length - 1 : (r = n + e, r < 0 ? r = g() ? t.length - 1 : 0 : r >= t.length && (r = g() ? 0 : t.length - 1)), R(t[r].id);
-	}, B = () => {
-		let e = P();
-		R(e.length > 0 ? e[0].id : void 0);
-	}, V = () => {
-		let e = P();
-		R(e.length > 0 ? e[e.length - 1].id : void 0);
-	};
-	c(() => {
-		let e = T();
-		e && N().find((t) => t.id === e)?.element.scrollIntoView({ block: "nearest" });
-	}), c(() => {
-		m.open() || (E(void 0), O(void 0));
+function c(c) {
+	let { root: l } = c, u = () => c.loopFocus?.() ?? l.loopFocus(), d = () => c.orientation?.() ?? l.orientation(), f = () => c.highlightItemOnHover?.() ?? l.highlightItemOnHover(), [p, m] = a(), [h, g] = a(), { registerItem: _, orderedItems: v, enabledItems: y } = r(), [b, x] = a(), S = `context-menu-popup-${o()}`, { pos: C, availableHeight: w, placement: T } = n({
+		reference: c.reference,
+		positionerElement: h,
+		side: c.side,
+		align: c.align,
+		dir: c.dir,
+		sideOffset: c.sideOffset,
+		alignOffset: c.alignOffset,
+		collisionPadding: c.collisionPadding
+	}), E = () => x(void 0), { activeId: D, activeEntry: O, setActiveId: k, moveActive: A, focusFirst: j, focusLast: M } = t({
+		orderedItems: v,
+		enabledItems: y,
+		loopFocus: u,
+		openPopupId: () => b()?.id,
+		closeOpenPopup: E,
+		open: c.open
+	}), N = i({
+		candidates: () => y().map((e) => ({
+			id: e.id,
+			label: e.label()
+		})),
+		onMatch: (e) => k(e)
 	});
-	let H = "", U, W = (e) => {
-		H += e.toLowerCase(), U !== void 0 && window.clearTimeout(U), U = window.setTimeout(() => {
-			H = "", U = void 0;
-		}, p);
-		let t = P().find((e) => e.label().toLowerCase().startsWith(H));
-		t && R(t.id);
-	};
-	return f(() => {
-		U !== void 0 && window.clearTimeout(U);
-	}), {
+	return s(() => N.dispose()), {
 		popupCtx: {
-			root: h,
-			parent: m.parent,
-			submenu: m.submenu,
-			menuId: j,
-			isSubmenu: m.isSubmenu,
-			popup: y,
-			setPopup: (e) => b(e),
-			items: N,
-			registerItem: I,
-			activeId: T,
-			setActiveId: R,
-			activeEntry: F,
-			moveActive: z,
-			focusFirst: B,
-			focusLast: V,
-			highlight: (e) => R(e),
-			openPopupState: D,
-			openPopup: (e, t, n) => O({
+			root: l,
+			parent: c.parent,
+			submenu: c.submenu,
+			menuId: S,
+			isSubmenu: c.isSubmenu,
+			popup: p,
+			setPopup: (e) => m(e),
+			items: v,
+			registerItem: _,
+			activeId: D,
+			setActiveId: k,
+			activeEntry: O,
+			moveActive: A,
+			focusFirst: j,
+			focusLast: M,
+			highlight: (e) => k(e),
+			openPopupState: b,
+			openPopup: (e, t, n) => x({
 				id: e,
 				reason: t,
 				event: n
 			}),
-			closeOpenPopup: L,
-			closeAll: (e, t) => h.closeAll(e, t),
-			highlightItemOnHover: v
-		},
-		pos: M,
-		popupEl: y,
-		setPopupEl: (e) => b(e),
-		positionerEl: x,
-		setPositionerEl: (e) => S(e),
-		availableHeight: k,
-		placement: M.placement,
-		onKeyDown: (e) => {
-			let t = m.submenu, n = _() === "horizontal";
-			switch (e.key) {
-				case "ArrowDown":
-					e.preventDefault(), z(1);
-					break;
-				case "ArrowUp":
-					e.preventDefault(), z(-1);
-					break;
-				case "ArrowRight": {
-					if (n) {
-						e.preventDefault(), z(1);
-						break;
-					}
-					let t = F();
-					t?.hasPopup() && (e.preventDefault(), t.openPopup?.("list-navigation", e));
-					break;
-				}
-				case "ArrowLeft":
-					if (n) {
-						e.preventDefault(), z(-1);
-						break;
-					}
-					t && (e.preventDefault(), e.stopPropagation(), t.closeSubmenu("list-navigation", e, !0));
-					break;
-				case "Home":
-					e.preventDefault(), B();
-					break;
-				case "End":
-					e.preventDefault(), V();
-					break;
-				case "Enter":
-				case " ": {
-					e.preventDefault();
-					let t = F();
-					t && !t.disabled() && t.activate();
-					break;
-				}
-				case "Escape":
-					e.preventDefault(), e.stopPropagation(), t && !t.closeParentOnEsc() ? t.closeSubmenu("escape-key", e, !0) : h.closeAll("escape-key", e);
-					break;
-				case "Tab":
-					e.preventDefault(), h.closeAll("focus-out", e);
-					break;
-				default: e.key.length === 1 && !e.ctrlKey && !e.metaKey && !e.altKey && W(e.key);
-			}
+			closeOpenPopup: E,
+			closeAll: (e, t) => l.closeAll(e, t),
+			highlightItemOnHover: f
 		},
+		pos: C,
+		popupEl: p,
+		setPopupEl: (e) => m(e),
+		positionerEl: h,
+		setPositionerEl: (e) => g(e),
+		availableHeight: w,
+		placement: T,
+		onKeyDown: (t) => e(t, {
+			horizontal: d() === "horizontal",
+			activeEntry: O,
+			moveActive: A,
+			focusFirst: j,
+			focusLast: M,
+			typeahead: (e) => N.handle(e),
+			submenu: c.submenu,
+			closeAll: (e, t) => l.closeAll(e, t)
+		}),
 		setupOnOpen: () => {
 			queueMicrotask(() => {
-				m.open() && (y()?.focus({ preventScroll: !0 }), T() === void 0 && B());
+				c.open() && (p()?.focus({ preventScroll: !0 }), D() === void 0 && j());
 			});
 		}
 	};
 }
 //#endregion
-export { m as createContextMenuPopupRuntime };
+export { c as createContextMenuPopupRuntime };
 
 //# sourceMappingURL=useContextMenuContent.js.map

package/dist/components/context-menu/ContextMenuContent/useContextMenuContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"useContextMenuContent.js","names":["TYPEAHEAD_TIMEOUT","createContextMenuPopupRuntime","options","loopFocus","root","orientation","highlightItemOnHover","popupEl","setPopupEl","createSignal","positionerEl","setPositionerEl","items","setItems","activeId","setActiveIdInternal","openPopupState","setOpenPopupState","availableHeight","setAvailableHeight","menuId","createUniqueId","pos","createPositioner","toContextMenuPlacement","offset","flip","shift","size","hide","containingBlockOffset","orderedItems","createMemo","a","b","enabledItems","item","activeEntry","registerItem","list","entry","it","closeOpenPopup","setActiveId","id","state","moveActive","currentIndex","nextIndex","delta","focusFirst","focusLast","createEffect","typeaheadBuffer","typeaheadTimer","runTypeahead","char","match","onCleanup","el","reason","event","submenu","horizontal"],"sources":["../../../../src/components/context-menu/ContextMenuContent/useContextMenuContent.ts"],"sourcesContent":["import {\n  createEffect,\n  createMemo,\n  createSignal,\n  createUniqueId,\n  onCleanup,\n  type Accessor,\n} from \"solid-js\";\nimport {\n  containingBlockOffset,\n  createPositioner,\n  flip,\n  hide,\n  offset,\n  shift,\n  size,\n  type Placement,\n  type Positioner,\n  type ReferenceElement,\n} from \"~/lib\";\nimport type {\n  ContextMenuAlign,\n  ContextMenuContextValue,\n  ContextMenuOpenPopupState,\n  ContextMenuItemEntry,\n  ContextMenuOrientation,\n  ContextMenuPopupContextValue,\n  ContextMenuSide,\n  ContextMenuSubmenuContextValue,\n} from \"../context-menu.types\";\nimport { toContextMenuPlacement } from \"../context-menu.utils\";\n\n/** 键盘字符导航的缓冲窗口(毫秒) */\nconst TYPEAHEAD_TIMEOUT = 500;\n\nexport interface CreateContextMenuPopupOptions {\n  root: ContextMenuContextValue;\n  /** 该浮层自身的打开状态(根菜单 = root.open,子菜单 = submenu.open) */\n  open: Accessor<boolean>;\n  /** 父级浮层:根菜单为 undefined,子菜单为触发它的那个浮层 */\n  parent?: ContextMenuPopupContextValue;\n  isSubmenu: boolean;\n  /** 定位锚点:根菜单是鼠标坐标的虚拟元素,子菜单是子菜单触发器 */\n  reference: Accessor<ReferenceElement | undefined>;\n  side: Accessor<ContextMenuSide>;\n  align: Accessor<ContextMenuAlign>;\n  sideOffset: Accessor<number>;\n  alignOffset: Accessor<number>;\n  collisionPadding: Accessor<number>;\n  dir: Accessor<\"ltr\" | \"rtl\" | \"auto\" | undefined>;\n  /** 子菜单可以覆盖根组件的行为;不传则回退到 root 上的值 */\n  loopFocus?: Accessor<boolean>;\n  orientation?: Accessor<ContextMenuOrientation>;\n  highlightItemOnHover?: Accessor<boolean>;\n  /** 子菜单场景下提供,用于 ArrowLeft / Escape 只关闭当前子菜单 */\n  submenu?: ContextMenuSubmenuContextValue;\n}\n\nexport interface ContextMenuPopupRuntime {\n  popupCtx: ContextMenuPopupContextValue;\n  pos: Positioner;\n  /** 真正承载焦点的 popup 元素 */\n  popupEl: Accessor<HTMLElement | undefined>;\n  setPopupEl: (el: HTMLElement | undefined) => void;\n  /** 负责定位的外层元素 */\n  positionerEl: Accessor<HTMLElement | undefined>;\n  setPositionerEl: (el: HTMLElement | undefined) => void;\n  /** size 中间件算出的可用高度,用于 max-height 滚动 */\n  availableHeight: Accessor<number | undefined>;\n  placement: Accessor<Placement>;\n  onKeyDown: (e: KeyboardEvent) => void;\n  /** 打开后聚焦 popup 并把高亮落到第一项 */\n  setupOnOpen: () => void;\n}\n\n/**\n * 一个浮层(根菜单或子菜单)的运行时:定位、菜单项注册、高亮/键盘导航、\n * 类型头(typeahead)以及开关联动都收敛在这里。`ContextMenuContent` 与\n * `ContextMenuSubContent` 共用它,只是传入的锚点与父子关系不同。\n *\n * 交互模型:焦点始终落在 popup 上,高亮项通过 `aria-activedescendant` 表达\n * (而不是把真实焦点在菜单项之间搬来搬去)。这与本项目 Select 的做法一致,\n * 既避免了焦点在 Portal / 子菜单之间的来回跳,也让\"关闭后把焦点还给触发器\"\n * 变得非常简单。\n */\nexport function createContextMenuPopupRuntime(\n  options: CreateContextMenuPopupOptions,\n): ContextMenuPopupRuntime {\n  const { root } = options;\n  const loopFocus = () => options.loopFocus?.() ?? root.loopFocus();\n  const orientation = () => options.orientation?.() ?? root.orientation();\n  const highlightItemOnHover = () =>\n    options.highlightItemOnHover?.() ?? root.highlightItemOnHover();\n\n  const [popupEl, setPopupEl] = createSignal<HTMLElement>();\n  const [positionerEl, setPositionerEl] = createSignal<HTMLElement>();\n  const [items, setItems] = createSignal<ContextMenuItemEntry[]>([]);\n  const [activeId, setActiveIdInternal] = createSignal<string | undefined>();\n  const [openPopupState, setOpenPopupState] =\n    createSignal<ContextMenuOpenPopupState>();\n  const [availableHeight, setAvailableHeight] = createSignal<number>();\n\n  const menuId = `context-menu-popup-${createUniqueId()}`;\n\n  const pos = createPositioner(options.reference, positionerEl, {\n    placement: () =>\n      toContextMenuPlacement(options.side(), options.align(), options.dir()),\n    strategy: \"fixed\",\n    middleware: () => [\n      offset({\n        mainAxis: options.sideOffset(),\n        crossAxis: options.alignOffset(),\n      }),\n      flip(),\n      shift({ padding: options.collisionPadding() }),\n      size({\n        padding: options.collisionPadding(),\n        apply: ({ availableHeight }) => setAvailableHeight(availableHeight),\n      }),\n      hide(),\n      containingBlockOffset(),\n    ],\n  });\n\n  // 按 DOM 顺序排序,避免调用方用 <For> 动态生成菜单项时顺序错乱。\n  const orderedItems = createMemo(() => {\n    const list = items();\n    return [...list].sort((a, b) => {\n      if (a.element === b.element) return 0;\n      const relation = a.element.compareDocumentPosition(b.element);\n      return relation & Node.DOCUMENT_POSITION_FOLLOWING ? -1 : 1;\n    });\n  });\n\n  const enabledItems = createMemo(() =>\n    orderedItems().filter((item) => !item.disabled()),\n  );\n\n  const activeEntry = () =>\n    orderedItems().find((item) => item.id === activeId());\n\n  const registerItem = (entry: ContextMenuItemEntry) => {\n    setItems((list) => [...list, entry]);\n    return () => setItems((list) => list.filter((it) => it.id !== entry.id));\n  };\n\n  const closeOpenPopup = () => setOpenPopupState(undefined);\n\n  /** 高亮某项;若高亮切到了别的项,顺手关掉已展开的子菜单 */\n  const setActiveId = (id: string | undefined) => {\n    setActiveIdInternal(id);\n    const state = openPopupState();\n    if (state && state.id !== id) closeOpenPopup();\n  };\n\n  const moveActive = (delta: 1 | -1) => {\n    const list = enabledItems();\n    if (list.length === 0) return;\n    const currentIndex = list.findIndex((item) => item.id === activeId());\n    let nextIndex: number;\n    if (currentIndex === -1) {\n      nextIndex = delta > 0 ? 0 : list.length - 1;\n    } else {\n      nextIndex = currentIndex + delta;\n      if (nextIndex < 0) {\n        nextIndex = loopFocus() ? list.length - 1 : 0;\n      } else if (nextIndex >= list.length) {\n        nextIndex = loopFocus() ? 0 : list.length - 1;\n      }\n    }\n    setActiveId(list[nextIndex].id);\n  };\n\n  const focusFirst = () => {\n    const list = enabledItems();\n    setActiveId(list.length > 0 ? list[0].id : undefined);\n  };\n\n  const focusLast = () => {\n    const list = enabledItems();\n    setActiveId(list.length > 0 ? list[list.length - 1].id : undefined);\n  };\n\n  // 高亮项变化时滚动到可见区域\n  createEffect(() => {\n    const id = activeId();\n    if (!id) return;\n    orderedItems()\n      .find((item) => item.id === id)\n      ?.element.scrollIntoView({ block: \"nearest\" });\n  });\n\n  // 关闭时清空高亮与子菜单状态,保证下次打开重新从第一项开始。\n  createEffect(() => {\n    if (!options.open()) {\n      setActiveIdInternal(undefined);\n      setOpenPopupState(undefined);\n    }\n  });\n\n  // --- 键盘字符导航 ---\n  let typeaheadBuffer = \"\";\n  let typeaheadTimer: number | undefined;\n\n  const runTypeahead = (char: string) => {\n    typeaheadBuffer += char.toLowerCase();\n    if (typeaheadTimer !== undefined) window.clearTimeout(typeaheadTimer);\n    typeaheadTimer = window.setTimeout(() => {\n      typeaheadBuffer = \"\";\n      typeaheadTimer = undefined;\n    }, TYPEAHEAD_TIMEOUT);\n\n    const match = enabledItems().find((item) =>\n      item.label().toLowerCase().startsWith(typeaheadBuffer),\n    );\n    if (match) setActiveId(match.id);\n  };\n\n  onCleanup(() => {\n    if (typeaheadTimer !== undefined) window.clearTimeout(typeaheadTimer);\n  });\n\n  const onKeyDown = (e: KeyboardEvent) => {\n    const submenu = options.submenu;\n    const horizontal = orientation() === \"horizontal\";\n\n    switch (e.key) {\n      case \"ArrowDown\":\n        e.preventDefault();\n        moveActive(1);\n        break;\n      case \"ArrowUp\":\n        e.preventDefault();\n        moveActive(-1);\n        break;\n      case \"ArrowRight\": {\n        if (horizontal) {\n          e.preventDefault();\n          moveActive(1);\n          break;\n        }\n        const entry = activeEntry();\n        if (entry?.hasPopup()) {\n          e.preventDefault();\n          entry.openPopup?.(\"list-navigation\", e);\n        }\n        break;\n      }\n      case \"ArrowLeft\": {\n        if (horizontal) {\n          e.preventDefault();\n          moveActive(-1);\n          break;\n        }\n        if (submenu) {\n          e.preventDefault();\n          // 阻止冒泡,避免父级浮层也处理这次按键\n          e.stopPropagation();\n          submenu.closeSubmenu(\"list-navigation\", e, true);\n        }\n        break;\n      }\n      case \"Home\":\n        e.preventDefault();\n        focusFirst();\n        break;\n      case \"End\":\n        e.preventDefault();\n        focusLast();\n        break;\n      case \"Enter\":\n      case \" \": {\n        e.preventDefault();\n        const entry = activeEntry();\n        if (entry && !entry.disabled()) entry.activate();\n        break;\n      }\n      case \"Escape\": {\n        e.preventDefault();\n        e.stopPropagation();\n        if (submenu && !submenu.closeParentOnEsc()) {\n          submenu.closeSubmenu(\"escape-key\", e, true);\n        } else {\n          root.closeAll(\"escape-key\", e);\n        }\n        break;\n      }\n      case \"Tab\": {\n        // 关闭菜单并把焦点交还触发器,浏览器随后的 Tab 会从触发器之后继续\n        e.preventDefault();\n        root.closeAll(\"focus-out\", e);\n        break;\n      }\n      default: {\n        if (e.key.length === 1 && !e.ctrlKey && !e.metaKey && !e.altKey) {\n          runTypeahead(e.key);\n        }\n      }\n    }\n  };\n\n  const popupCtx: ContextMenuPopupContextValue = {\n    root,\n    parent: options.parent,\n    submenu: options.submenu,\n    menuId,\n    isSubmenu: options.isSubmenu,\n    popup: popupEl,\n    setPopup: (el) => setPopupEl(el),\n    items: orderedItems,\n    registerItem,\n    activeId,\n    setActiveId,\n    activeEntry,\n    moveActive,\n    focusFirst,\n    focusLast,\n    highlight: (id) => setActiveId(id),\n    openPopupState,\n    openPopup: (id, reason, event) => setOpenPopupState({ id, reason, event }),\n    closeOpenPopup,\n    closeAll: (reason, event) => root.closeAll(reason, event),\n    highlightItemOnHover,\n  };\n\n  /** 浮层挂载完成后的收尾:聚焦 popup(键盘事件依赖它)并高亮第一项 */\n  const setupOnOpen = () => {\n    queueMicrotask(() => {\n      if (!options.open()) return;\n      popupEl()?.focus({ preventScroll: true });\n      if (activeId() === undefined) focusFirst();\n    });\n  };\n\n  return {\n    popupCtx,\n    pos,\n    popupEl,\n    setPopupEl: (el) => setPopupEl(el),\n    positionerEl,\n    setPositionerEl: (el) => setPositionerEl(el),\n    availableHeight,\n    placement: pos.placement,\n    onKeyDown,\n    setupOnOpen,\n  };\n}\n"],"mappings":"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"}
+{"version":3,"file":"useContextMenuContent.js","names":["createContextMenuPopupRuntime","options","loopFocus","root","orientation","highlightItemOnHover","popupEl","setPopupEl","createSignal","positionerEl","setPositionerEl","createItemCollection","openPopupState","setOpenPopupState","menuId","createUniqueId","createPopupPositioner","closeOpenPopup","createHighlight","typeahead","createTypeahead","enabledItems","item","setActiveId","id","onCleanup","el","orderedItems","reason","event","handleMenuKeyDown","char","e","activeId","focusFirst"],"sources":["../../../../src/components/context-menu/ContextMenuContent/useContextMenuContent.ts"],"sourcesContent":["import {\n  createSignal,\n  createUniqueId,\n  onCleanup,\n  type Accessor,\n} from \"solid-js\";\nimport type { Placement, Positioner, ReferenceElement } from \"~/lib\";\nimport type {\n  ContextMenuAlign,\n  ContextMenuContextValue,\n  ContextMenuOpenPopupState,\n  ContextMenuOrientation,\n  ContextMenuPopupContextValue,\n  ContextMenuSide,\n  ContextMenuSubmenuContextValue,\n} from \"../context-menu.types\";\nimport { handleMenuKeyDown } from \"../context-menu.keyboard\";\nimport { createHighlight } from \"./context-menu.highlight\";\nimport { createPopupPositioner } from \"./context-menu.positioner\";\nimport { createItemCollection } from \"./context-menu.popup-items\";\nimport { createTypeahead } from \"../context-menu.typeahead\";\n\nexport interface CreateContextMenuPopupOptions {\n  root: ContextMenuContextValue;\n  /** 该浮层自身的打开状态(根菜单 = root.open,子菜单 = submenu.open) */\n  open: Accessor<boolean>;\n  /** 父级浮层:根菜单为 undefined,子菜单为触发它的那个浮层 */\n  parent?: ContextMenuPopupContextValue;\n  isSubmenu: boolean;\n  /** 定位锚点:根菜单是鼠标坐标的虚拟元素,子菜单是子菜单触发器 */\n  reference: Accessor<ReferenceElement | undefined>;\n  side: Accessor<ContextMenuSide>;\n  align: Accessor<ContextMenuAlign>;\n  sideOffset: Accessor<number>;\n  alignOffset: Accessor<number>;\n  collisionPadding: Accessor<number>;\n  dir: Accessor<\"ltr\" | \"rtl\" | \"auto\" | undefined>;\n  /** 子菜单可以覆盖根组件的行为;不传则回退到 root 上的值 */\n  loopFocus?: Accessor<boolean>;\n  orientation?: Accessor<ContextMenuOrientation>;\n  highlightItemOnHover?: Accessor<boolean>;\n  /** 子菜单场景下提供,用于 ArrowLeft / Escape 只关闭当前子菜单 */\n  submenu?: ContextMenuSubmenuContextValue;\n}\n\nexport interface ContextMenuPopupRuntime {\n  popupCtx: ContextMenuPopupContextValue;\n  pos: Positioner;\n  /** 真正承载焦点的 popup 元素 */\n  popupEl: Accessor<HTMLElement | undefined>;\n  setPopupEl: (el: HTMLElement | undefined) => void;\n  /** 负责定位的外层元素 */\n  positionerEl: Accessor<HTMLElement | undefined>;\n  setPositionerEl: (el: HTMLElement | undefined) => void;\n  /** size 中间件算出的可用高度,用于 max-height 滚动 */\n  availableHeight: Accessor<number | undefined>;\n  placement: Accessor<Placement>;\n  onKeyDown: (e: KeyboardEvent) => void;\n  /** 打开后聚焦 popup 并把高亮落到第一项 */\n  setupOnOpen: () => void;\n}\n\n/**\n * 一个浮层(根菜单或子菜单)的运行时:定位、菜单项注册、高亮/键盘导航、\n * 类型头(typeahead)以及开关联动都收敛在这里。`ContextMenuContent` 与\n * `ContextMenuSubContent` 共用它,只是传入的锚点与父子关系不同。\n *\n * 交互模型:焦点始终落在 popup 上,高亮项通过 `aria-activedescendant` 表达\n * (而不是把真实焦点在菜单项之间搬来搬去)。这与本项目 Select 的做法一致,\n * 既避免了焦点在 Portal / 子菜单之间的来回跳,也让\"关闭后把焦点还给触发器\"\n * 变得非常简单。\n */\nexport function createContextMenuPopupRuntime(\n  options: CreateContextMenuPopupOptions,\n): ContextMenuPopupRuntime {\n  const { root } = options;\n  const loopFocus = () => options.loopFocus?.() ?? root.loopFocus();\n  const orientation = () => options.orientation?.() ?? root.orientation();\n  const highlightItemOnHover = () =>\n    options.highlightItemOnHover?.() ?? root.highlightItemOnHover();\n\n  const [popupEl, setPopupEl] = createSignal<HTMLElement>();\n  const [positionerEl, setPositionerEl] = createSignal<HTMLElement>();\n  const { registerItem, orderedItems, enabledItems } = createItemCollection();\n  const [openPopupState, setOpenPopupState] =\n    createSignal<ContextMenuOpenPopupState>();\n  const menuId = `context-menu-popup-${createUniqueId()}`;\n\n  const { pos, availableHeight, placement } = createPopupPositioner({\n    reference: options.reference,\n    positionerElement: positionerEl,\n    side: options.side,\n    align: options.align,\n    dir: options.dir,\n    sideOffset: options.sideOffset,\n    alignOffset: options.alignOffset,\n    collisionPadding: options.collisionPadding,\n  });\n\n  const closeOpenPopup = () => setOpenPopupState(undefined);\n\n  const highlight = createHighlight({\n    orderedItems,\n    enabledItems,\n    loopFocus,\n    openPopupId: () => openPopupState()?.id,\n    closeOpenPopup,\n    open: options.open,\n  });\n  const {\n    activeId,\n    activeEntry,\n    setActiveId,\n    moveActive,\n    focusFirst,\n    focusLast,\n  } = highlight;\n\n  // --- 键盘字符导航 ---\n  const typeahead = createTypeahead({\n    candidates: () =>\n      enabledItems().map((item) => ({ id: item.id, label: item.label() })),\n    onMatch: (id) => setActiveId(id),\n  });\n\n  onCleanup(() => typeahead.dispose());\n\n  const onKeyDown = (event: KeyboardEvent) =>\n    handleMenuKeyDown(event, {\n      horizontal: orientation() === \"horizontal\",\n      activeEntry,\n      moveActive,\n      focusFirst,\n      focusLast,\n      typeahead: (char) => typeahead.handle(char),\n      submenu: options.submenu,\n      closeAll: (reason, e) => root.closeAll(reason, e),\n    });\n\n  const popupCtx: ContextMenuPopupContextValue = {\n    root,\n    parent: options.parent,\n    submenu: options.submenu,\n    menuId,\n    isSubmenu: options.isSubmenu,\n    popup: popupEl,\n    setPopup: (el) => setPopupEl(el),\n    items: orderedItems,\n    registerItem,\n    activeId,\n    setActiveId,\n    activeEntry,\n    moveActive,\n    focusFirst,\n    focusLast,\n    highlight: (id) => setActiveId(id),\n    openPopupState,\n    openPopup: (id, reason, event) => setOpenPopupState({ id, reason, event }),\n    closeOpenPopup,\n    closeAll: (reason, event) => root.closeAll(reason, event),\n    highlightItemOnHover,\n  };\n\n  /** 浮层挂载完成后的收尾:聚焦 popup(键盘事件依赖它)并高亮第一项 */\n  const setupOnOpen = () => {\n    queueMicrotask(() => {\n      if (!options.open()) return;\n      popupEl()?.focus({ preventScroll: true });\n      if (activeId() === undefined) focusFirst();\n    });\n  };\n\n  return {\n    popupCtx,\n    pos,\n    popupEl,\n    setPopupEl: (el) => setPopupEl(el),\n    positionerEl,\n    setPositionerEl: (el) => setPositionerEl(el),\n    availableHeight,\n    placement,\n    onKeyDown,\n    setupOnOpen,\n  };\n}\n"],"mappings":";;;;;;;AAwEA,SAAgBA,EACd,GACyB;CACzB,IAAM,EAAE,YAASC,GACXC,UAAkBD,EAAQ,YAAY,KAAKE,EAAK,UAAU,GAC1DC,UAAoBH,EAAQ,cAAc,KAAKE,EAAK,YAAY,GAChEE,UACJJ,EAAQ,uBAAuB,KAAKE,EAAK,qBAAqB,GAE1D,CAACG,GAASC,KAAcC,EAA0B,GAClD,CAACC,GAAcC,KAAmBF,EAA0B,GAC5D,EAAE,iBAAc,iBAAc,oBAAiBG,EAAqB,GACpE,CAACC,GAAgBC,KACrBL,EAAwC,GACpCM,IAAS,sBAAsBC,EAAe,KAE9C,EAAE,QAAK,oBAAiB,iBAAcC,EAAsB;EAChE,WAAWf,EAAQ;EACnB,mBAAmBQ;EACnB,MAAMR,EAAQ;EACd,OAAOA,EAAQ;EACf,KAAKA,EAAQ;EACb,YAAYA,EAAQ;EACpB,aAAaA,EAAQ;EACrB,kBAAkBA,EAAQ;CAC5B,CAAC,GAEKgB,UAAuBJ,EAAkB,KAAA,CAAS,GAUlD,EACJ,aACA,gBACA,gBACA,eACA,eACA,iBAdgBK,EAAgB;EAChC;EACA;EACA;EACA,mBAAmBN,EAAe,CAAC,EAAE;EACrC;EACA,MAAMX,EAAQ;CAChB,CAQI,GAGEkB,IAAYC,EAAgB;EAChC,kBACEC,EAAa,CAAC,CAAC,KAAK,OAAU;GAAE,IAAIC,EAAK;GAAI,OAAOA,EAAK,MAAM;EAAE,EAAE;EACrE,UAAU,MAAOC,EAAYC,CAAE;CACjC,CAAC;CAiDD,OA/CAC,QAAgBN,EAAU,QAAQ,CAAC,GA+C5B;EACL;GAjCA;GACA,QAAQlB,EAAQ;GAChB,SAASA,EAAQ;GACjB;GACA,WAAWA,EAAQ;GACnB,OAAOK;GACP,WAAW,MAAOC,EAAWmB,CAAE;GAC/B,OAAOC;GACP;GACA;GACA;GACA;GACA;GACA;GACA;GACA,YAAY,MAAOJ,EAAYC,CAAE;GACjC;GACA,YAAY,GAAI,GAAQ,MAAUX,EAAkB;IAAE;IAAI;IAAQ;GAAM,CAAC;GACzE;GACA,WAAW,GAAQ,MAAUV,EAAK,SAASyB,GAAQC,CAAK;GACxD;EAaA;EACA;EACA;EACA,aAAa,MAAOtB,EAAWmB,CAAE;EACjC;EACA,kBAAkB,MAAOhB,EAAgBgB,CAAE;EAC3C;EACA;EACA,YAtDiB,MACjBI,EAAkBD,GAAO;GACvB,YAAYzB,EAAY,MAAM;GAC9B;GACA;GACA;GACA;GACA,YAAY,MAASe,EAAU,OAAOY,CAAI;GAC1C,SAAS9B,EAAQ;GACjB,WAAW,GAAQ,MAAME,EAAK,SAASyB,GAAQI,CAAC;EAClD,CAAC;EA6CD,mBAlBwB;GACxB,qBAAqB;IACnB,AAAK/B,EAAQ,KAAK,MAClBK,EAAQ,CAAC,EAAE,MAAM,EAAE,eAAe,GAAK,CAAC,GACpC2B,EAAS,MAAM,KAAA,KAAWC,EAAW;GAC3C,CAAC;EACH;CAaA;AACF"}

package/dist/components/context-menu/ContextMenuSub/ContextMenuSub.js

@@ -11,7 +11,8 @@ function l(l) {
 	};
 	s(T);
 	let E = (e, n, r) => {
-		l.open === void 0 && p(e), l.onOpenChange?.(e, t(n, r, b()));
+		let i = t(n, r, b());
+		l.onOpenChange?.(e, i), !i.isCanceled && l.open === void 0 && p(e);
 	}, D = (e, t, n = !1) => {
 		let r = S();
 		T(), m() && E(!1, e, t), r && d.openPopupState()?.id === r && d.closeOpenPopup(), n && r && (d.setActiveId(r), d.popup()?.focus({ preventScroll: !0 }));

package/dist/components/context-menu/ContextMenuSub/ContextMenuSub.js.map

@@ -1 +1 @@
-{"version":3,"file":"ContextMenuSub.js","names":["createMemo","createSignal","onCleanup","JSX","useContextMenuContext","ContextMenuSubmenuContext","useContextMenuPopup","ContextMenuChangeEventReason","ContextMenuSubmenuContextValue","createChangeEventDetails","ContextMenuSubProps","HOVER_CLOSE_GRACE","ContextMenuSub","props","Element","root","parentPopup","internalOpen","setInternalOpen","defaultOpen","open","undefined","disabled","closeParentOnEsc","loopFocus","orientation","highlightItemOnHover","trigger","setTrigger","HTMLElement","itemId","setItemId","closeTimer","cancelClose","window","clearTimeout","setOpen","next","reason","event","Event","onOpenChange","closeSubmenu","focusTrigger","id","openPopupState","closeOpenPopup","setActiveId","popup","focus","preventScroll","openSubmenu","openPopup","scheduleClose","delay","setTimeout","Math","max","ctx","_$createComponent","Provider","value","children","_$createComponent","HOVER_CLOSE_GRACE","ContextMenuSub","root","useContextMenuContext","parentPopup","useContextMenuPopup","internalOpen","setInternalOpen","createSignal","props","open","createMemo","disabled","closeParentOnEsc","loopFocus","orientation","highlightItemOnHover","trigger","setTrigger","itemId","setItemId","closeTimer","cancelClose","setOpen","next","createChangeEventDetails","reason","event","closeSubmenu","id","focusTrigger","ctx","delay","createComponent","ContextMenuSubmenuContext"],"sources":["../../../../src/components/context-menu/ContextMenuSub/ContextMenuSub.tsx"],"sourcesContent":["import { createMemo, createSignal, onCleanup, type JSX } from \"solid-js\";\nimport { useContextMenuContext } from \"../ContextMenu/ContextMenu.context\";\nimport {\n  ContextMenuSubmenuContext,\n  useContextMenuPopup,\n} from \"../context-menu.context\";\nimport type {\n  ContextMenuChangeEventReason,\n  ContextMenuSubmenuContextValue,\n} from \"../context-menu.types\";\nimport { createChangeEventDetails } from \"../context-menu.utils\";\nimport type { ContextMenuSubProps } from \"./ContextMenuSub.types\";\n\n/** 鼠标穿越触发器与子菜单之间的间隙时的防抖下限(毫秒) */\nconst HOVER_CLOSE_GRACE = 100;\n\n/**\n * 子菜单根组件:不渲染 DOM,维护子菜单的开关状态、定位锚点(触发器)与\n * 与父浮层之间的联动(同一时间只允许一个子菜单打开)。\n */\nexport function ContextMenuSub(props: ContextMenuSubProps): JSX.Element {\n  const root = useContextMenuContext(\"ContextMenuSub\");\n  const parentPopup = useContextMenuPopup(\"ContextMenuSub\");\n\n  const [internalOpen, setInternalOpen] = createSignal(\n    props.defaultOpen ?? false,\n  );\n  const open = createMemo(() =>\n    props.open !== undefined ? props.open : internalOpen(),\n  );\n  const disabled = createMemo(() => !!props.disabled);\n  const closeParentOnEsc = createMemo(() => !!props.closeParentOnEsc);\n  const loopFocus = createMemo(() => props.loopFocus ?? root.loopFocus());\n  const orientation = createMemo(() => props.orientation ?? root.orientation());\n  const highlightItemOnHover = createMemo(\n    () => props.highlightItemOnHover ?? root.highlightItemOnHover(),\n  );\n\n  const [trigger, setTrigger] = createSignal<HTMLElement>();\n  const [itemId, setItemId] = createSignal<string>();\n\n  let closeTimer: number | undefined;\n  const cancelClose = () => {\n    if (closeTimer !== undefined) {\n      window.clearTimeout(closeTimer);\n      closeTimer = undefined;\n    }\n  };\n  onCleanup(cancelClose);\n\n  const setOpen = (\n    next: boolean,\n    reason: ContextMenuChangeEventReason,\n    event?: Event,\n  ) => {\n    if (props.open === undefined) setInternalOpen(next);\n    props.onOpenChange?.(\n      next,\n      createChangeEventDetails(reason, event, trigger()),\n    );\n  };\n\n  const closeSubmenu = (\n    reason: ContextMenuChangeEventReason,\n    event?: Event,\n    focusTrigger = false,\n  ) => {\n    const id = itemId();\n    cancelClose();\n    // 先关自己再清父浮层的登记:写信号会同步刷新相关 effect,若反过来,\n    // 子菜单触发器的同步 effect 会抢先以 \"list-navigation\" 的 reason 关掉它,\n    // 覆盖掉这里想上报的真实关闭原因。\n    if (open()) setOpen(false, reason, event);\n    if (id && parentPopup.openPopupState()?.id === id) {\n      parentPopup.closeOpenPopup();\n    }\n\n    if (focusTrigger && id) {\n      // 焦点还给父浮层,并重新高亮触发器,键盘可以继续在父菜单里导航\n      parentPopup.setActiveId(id);\n      parentPopup.popup()?.focus({ preventScroll: true });\n    }\n  };\n\n  const openSubmenu = (reason: ContextMenuChangeEventReason, event?: Event) => {\n    if (disabled()) return;\n    const id = itemId();\n    if (!id) return;\n    cancelClose();\n    if (open()) return;\n    // 先登记到父浮层,父浮层据此保证\"同时只有一个子菜单打开\"\n    parentPopup.openPopup(id, reason, event);\n    setOpen(true, reason, event);\n  };\n\n  const scheduleClose = (delay = HOVER_CLOSE_GRACE) => {\n    cancelClose();\n    closeTimer = window.setTimeout(\n      () => {\n        closeTimer = undefined;\n        closeSubmenu(\"trigger-hover\");\n      },\n      Math.max(delay, HOVER_CLOSE_GRACE),\n    );\n  };\n\n  const ctx: ContextMenuSubmenuContextValue = {\n    root,\n    parentPopup,\n    open,\n    setOpen,\n    disabled,\n    closeParentOnEsc,\n    loopFocus,\n    orientation,\n    highlightItemOnHover,\n    trigger,\n    setTrigger,\n    itemId,\n    setItemId,\n    openSubmenu,\n    closeSubmenu,\n    scheduleClose,\n    cancelClose,\n  };\n\n  return (\n    <ContextMenuSubmenuContext.Provider value={ctx}>\n      {props.children}\n    </ContextMenuSubmenuContext.Provider>\n  );\n}\n"],"mappings":";;;;;;AAcA,IAAMW,IAAoB;AAM1B,SAAgBC,EAAeC,GAAyC;CACtE,IAAME,IAAOX,EAAsB,gBAAgB,GAC7CY,IAAcV,EAAoB,gBAAgB,GAElD,CAACW,GAAcC,KAAmBjB,EACtCY,EAAMM,eAAe,EACvB,GACMC,IAAOpB,QACXa,EAAMO,SAASC,KAAAA,IAAyBJ,EAAa,IAA1BJ,EAAMO,IACnC,GACME,IAAWtB,QAAiB,CAAC,CAACa,EAAMS,QAAQ,GAC5CC,IAAmBvB,QAAiB,CAAC,CAACa,EAAMU,gBAAgB,GAC5DC,IAAYxB,QAAiBa,EAAMW,aAAaT,EAAKS,UAAU,CAAC,GAChEC,IAAczB,QAAiBa,EAAMY,eAAeV,EAAKU,YAAY,CAAC,GACtEC,IAAuB1B,QACrBa,EAAMa,wBAAwBX,EAAKW,qBAAqB,CAChE,GAEM,CAACC,GAASC,KAAc3B,EAA0B,GAClD,CAAC6B,GAAQC,KAAa9B,EAAqB,GAE7C+B,GACEC,UAAoB;EACxB,AAAID,MAAeX,KAAAA,MACjBa,OAAOC,aAAaH,CAAU,GAC9BA,IAAaX,KAAAA;CAEjB;CACAnB,EAAU+B,CAAW;CAErB,IAAMG,KACJC,GACAC,GACAC,MACG;EAEH1B,AADIA,EAAMO,SAASC,KAAAA,KAAWH,EAAgBmB,CAAI,GAClDxB,EAAM4B,eACJJ,GACA5B,EAAyB6B,GAAQC,GAAOZ,EAAQ,CAAC,CACnD;CACF,GAEMe,KACJJ,GACAC,GACAI,IAAe,OACZ;EACH,IAAMC,IAAKd,EAAO;EAUlB,AATAG,EAAY,GAIRb,EAAK,KAAGgB,EAAQ,IAAOE,GAAQC,CAAK,GACpCK,KAAM5B,EAAY6B,eAAe,CAAC,EAAED,OAAOA,KAC7C5B,EAAY8B,eAAe,GAGzBH,KAAgBC,MAElB5B,EAAY+B,YAAYH,CAAE,GAC1B5B,EAAYgC,MAAM,CAAC,EAAEC,MAAM,EAAEC,eAAe,GAAK,CAAC;CAEtD,GAwBMQ,IAAsC;EAC1C3C;EACAC;EACAI;EACAgB;EACAd;EACAC;EACAC;EACAC;EACAC;EACAC;EACAC;EACAE;EACAC;EACAoB,cApCmBb,GAAsCC,MAAkB;GAC3E,IAAIjB,EAAS,GAAG;GAChB,IAAMsB,IAAKd,EAAO;GAClB,AAAKc,MACLX,EAAY,GACRb,GAAK,MAETJ,EAAYoC,UAAUR,GAAIN,GAAQC,CAAK,GACvCH,EAAQ,IAAME,GAAQC,CAAK;EAC7B;EA4BEG;EACAW,gBA3BqBC,IAAQ3C,MAAsB;GAEnDqB,AADAC,EAAY,GACZD,IAAaE,OAAOqB,iBACZ;IAEJb,AADAV,IAAaX,KAAAA,GACbqB,EAAa,eAAe;GAC9B,GACAc,KAAKC,IAAIH,GAAO3C,CAAiB,CACnC;EACF;EAmBEsB;CACF;CAEA,OAAA0B,EACGtD,EAA0BuD,UAAQ;EAACC,OAAOH;EAAG,IAAAI,WAAA;GAAA,OAC3CjD,EAAMiD;EAAQ;CAAA,CAAA;AAGrB"}
+{"version":3,"file":"ContextMenuSub.js","names":["createMemo","createSignal","onCleanup","JSX","useContextMenuContext","ContextMenuSubmenuContext","useContextMenuPopup","ContextMenuChangeEventReason","ContextMenuSubmenuContextValue","createChangeEventDetails","ContextMenuSubProps","HOVER_CLOSE_GRACE","ContextMenuSub","props","Element","root","parentPopup","internalOpen","setInternalOpen","defaultOpen","open","undefined","disabled","closeParentOnEsc","loopFocus","orientation","highlightItemOnHover","trigger","setTrigger","HTMLElement","itemId","setItemId","closeTimer","cancelClose","window","clearTimeout","setOpen","next","reason","event","Event","details","onOpenChange","isCanceled","closeSubmenu","focusTrigger","id","openPopupState","closeOpenPopup","setActiveId","popup","focus","preventScroll","openSubmenu","openPopup","scheduleClose","delay","setTimeout","Math","max","ctx","_$createComponent","Provider","value","children","_$createComponent","HOVER_CLOSE_GRACE","ContextMenuSub","root","useContextMenuContext","parentPopup","useContextMenuPopup","internalOpen","setInternalOpen","createSignal","props","open","createMemo","disabled","closeParentOnEsc","loopFocus","orientation","highlightItemOnHover","trigger","setTrigger","itemId","setItemId","closeTimer","cancelClose","setOpen","details","createChangeEventDetails","reason","event","next","closeSubmenu","id","focusTrigger","ctx","delay","createComponent","ContextMenuSubmenuContext"],"sources":["../../../../src/components/context-menu/ContextMenuSub/ContextMenuSub.tsx"],"sourcesContent":["import { createMemo, createSignal, onCleanup, type JSX } from \"solid-js\";\nimport { useContextMenuContext } from \"../ContextMenu/ContextMenu.context\";\nimport {\n  ContextMenuSubmenuContext,\n  useContextMenuPopup,\n} from \"../context-menu.context\";\nimport type {\n  ContextMenuChangeEventReason,\n  ContextMenuSubmenuContextValue,\n} from \"../context-menu.types\";\nimport { createChangeEventDetails } from \"../context-menu.utils\";\nimport type { ContextMenuSubProps } from \"./ContextMenuSub.types\";\n\n/** 鼠标穿越触发器与子菜单之间的间隙时的防抖下限(毫秒) */\nconst HOVER_CLOSE_GRACE = 100;\n\n/**\n * 子菜单根组件:不渲染 DOM,维护子菜单的开关状态、定位锚点(触发器)与\n * 与父浮层之间的联动(同一时间只允许一个子菜单打开)。\n */\nexport function ContextMenuSub(props: ContextMenuSubProps): JSX.Element {\n  const root = useContextMenuContext(\"ContextMenuSub\");\n  const parentPopup = useContextMenuPopup(\"ContextMenuSub\");\n\n  const [internalOpen, setInternalOpen] = createSignal(\n    props.defaultOpen ?? false,\n  );\n  const open = createMemo(() =>\n    props.open !== undefined ? props.open : internalOpen(),\n  );\n  const disabled = createMemo(() => !!props.disabled);\n  const closeParentOnEsc = createMemo(() => !!props.closeParentOnEsc);\n  const loopFocus = createMemo(() => props.loopFocus ?? root.loopFocus());\n  const orientation = createMemo(() => props.orientation ?? root.orientation());\n  const highlightItemOnHover = createMemo(\n    () => props.highlightItemOnHover ?? root.highlightItemOnHover(),\n  );\n\n  const [trigger, setTrigger] = createSignal<HTMLElement>();\n  const [itemId, setItemId] = createSignal<string>();\n\n  let closeTimer: number | undefined;\n  const cancelClose = () => {\n    if (closeTimer !== undefined) {\n      window.clearTimeout(closeTimer);\n      closeTimer = undefined;\n    }\n  };\n  onCleanup(cancelClose);\n\n  const setOpen = (\n    next: boolean,\n    reason: ContextMenuChangeEventReason,\n    event?: Event,\n  ) => {\n    const details = createChangeEventDetails(reason, event, trigger());\n    // 同根组件：先回调，cancel() 时不落状态\n    props.onOpenChange?.(next, details);\n    if (details.isCanceled) return;\n    if (props.open === undefined) setInternalOpen(next);\n  };\n\n  const closeSubmenu = (\n    reason: ContextMenuChangeEventReason,\n    event?: Event,\n    focusTrigger = false,\n  ) => {\n    const id = itemId();\n    cancelClose();\n    // 先关自己再清父浮层的登记:写信号会同步刷新相关 effect,若反过来,\n    // 子菜单触发器的同步 effect 会抢先以 \"list-navigation\" 的 reason 关掉它,\n    // 覆盖掉这里想上报的真实关闭原因。\n    if (open()) setOpen(false, reason, event);\n    if (id && parentPopup.openPopupState()?.id === id) {\n      parentPopup.closeOpenPopup();\n    }\n\n    if (focusTrigger && id) {\n      // 焦点还给父浮层,并重新高亮触发器,键盘可以继续在父菜单里导航\n      parentPopup.setActiveId(id);\n      parentPopup.popup()?.focus({ preventScroll: true });\n    }\n  };\n\n  const openSubmenu = (reason: ContextMenuChangeEventReason, event?: Event) => {\n    if (disabled()) return;\n    const id = itemId();\n    if (!id) return;\n    cancelClose();\n    if (open()) return;\n    // 先登记到父浮层,父浮层据此保证\"同时只有一个子菜单打开\"\n    parentPopup.openPopup(id, reason, event);\n    setOpen(true, reason, event);\n  };\n\n  const scheduleClose = (delay = HOVER_CLOSE_GRACE) => {\n    cancelClose();\n    closeTimer = window.setTimeout(\n      () => {\n        closeTimer = undefined;\n        closeSubmenu(\"trigger-hover\");\n      },\n      Math.max(delay, HOVER_CLOSE_GRACE),\n    );\n  };\n\n  const ctx: ContextMenuSubmenuContextValue = {\n    root,\n    parentPopup,\n    open,\n    setOpen,\n    disabled,\n    closeParentOnEsc,\n    loopFocus,\n    orientation,\n    highlightItemOnHover,\n    trigger,\n    setTrigger,\n    itemId,\n    setItemId,\n    openSubmenu,\n    closeSubmenu,\n    scheduleClose,\n    cancelClose,\n  };\n\n  return (\n    <ContextMenuSubmenuContext.Provider value={ctx}>\n      {props.children}\n    </ContextMenuSubmenuContext.Provider>\n  );\n}\n"],"mappings":";;;;;;AAcA,IAAMW,IAAoB;AAM1B,SAAgBC,EAAeC,GAAyC;CACtE,IAAME,IAAOX,EAAsB,gBAAgB,GAC7CY,IAAcV,EAAoB,gBAAgB,GAElD,CAACW,GAAcC,KAAmBjB,EACtCY,EAAMM,eAAe,EACvB,GACMC,IAAOpB,QACXa,EAAMO,SAASC,KAAAA,IAAyBJ,EAAa,IAA1BJ,EAAMO,IACnC,GACME,IAAWtB,QAAiB,CAAC,CAACa,EAAMS,QAAQ,GAC5CC,IAAmBvB,QAAiB,CAAC,CAACa,EAAMU,gBAAgB,GAC5DC,IAAYxB,QAAiBa,EAAMW,aAAaT,EAAKS,UAAU,CAAC,GAChEC,IAAczB,QAAiBa,EAAMY,eAAeV,EAAKU,YAAY,CAAC,GACtEC,IAAuB1B,QACrBa,EAAMa,wBAAwBX,EAAKW,qBAAqB,CAChE,GAEM,CAACC,GAASC,KAAc3B,EAA0B,GAClD,CAAC6B,GAAQC,KAAa9B,EAAqB,GAE7C+B,GACEC,UAAoB;EACxB,AAAID,MAAeX,KAAAA,MACjBa,OAAOC,aAAaH,CAAU,GAC9BA,IAAaX,KAAAA;CAEjB;CACAnB,EAAU+B,CAAW;CAErB,IAAMG,KACJC,GACAC,GACAC,MACG;EACH,IAAME,IAAUhC,EAAyB6B,GAAQC,GAAOZ,EAAQ,CAAC;EAGjE,AADAd,EAAM6B,eAAeL,GAAMI,CAAO,GAC9BA,GAAQE,cACR9B,EAAMO,SAASC,KAAAA,KAAWH,EAAgBmB,CAAI;CACpD,GAEMO,KACJN,GACAC,GACAM,IAAe,OACZ;EACH,IAAMC,IAAKhB,EAAO;EAUlB,AATAG,EAAY,GAIRb,EAAK,KAAGgB,EAAQ,IAAOE,GAAQC,CAAK,GACpCO,KAAM9B,EAAY+B,eAAe,CAAC,EAAED,OAAOA,KAC7C9B,EAAYgC,eAAe,GAGzBH,KAAgBC,MAElB9B,EAAYiC,YAAYH,CAAE,GAC1B9B,EAAYkC,MAAM,CAAC,EAAEC,MAAM,EAAEC,eAAe,GAAK,CAAC;CAEtD,GAwBMQ,IAAsC;EAC1C7C;EACAC;EACAI;EACAgB;EACAd;EACAC;EACAC;EACAC;EACAC;EACAC;EACAC;EACAE;EACAC;EACAsB,cApCmBf,GAAsCC,MAAkB;GAC3E,IAAIjB,EAAS,GAAG;GAChB,IAAMwB,IAAKhB,EAAO;GAClB,AAAKgB,MACLb,EAAY,GACRb,GAAK,MAETJ,EAAYsC,UAAUR,GAAIR,GAAQC,CAAK,GACvCH,EAAQ,IAAME,GAAQC,CAAK;EAC7B;EA4BEK;EACAW,gBA3BqBC,IAAQ7C,MAAsB;GAEnDqB,AADAC,EAAY,GACZD,IAAaE,OAAOuB,iBACZ;IAEJb,AADAZ,IAAaX,KAAAA,GACbuB,EAAa,eAAe;GAC9B,GACAc,KAAKC,IAAIH,GAAO7C,CAAiB,CACnC;EACF;EAmBEsB;CACF;CAEA,OAAA4B,EACGxD,EAA0ByD,UAAQ;EAACC,OAAOH;EAAG,IAAAI,WAAA;GAAA,OAC3CnD,EAAMmD;EAAQ;CAAA,CAAA;AAGrB"}

package/dist/components/context-menu/ContextMenuTrigger/ContextMenuTrigger.js

@@ -2,33 +2,43 @@ import { clsx as e } from "../../../utils/clsx.js";
 import { mergeRefs as t } from "../../../utils/ref.js";
 import { useContextMenuTrigger as n } from "./useContextMenuTrigger.js";
 import { Dynamic as r, createComponent as i, mergeProps as a } from "solid-js/web";
+import { splitProps as o } from "solid-js";
 //#region src/components/context-menu/ContextMenuTrigger/ContextMenuTrigger.tsx
-var o = (o) => {
-	let { ctx: s, attachListeners: c } = n();
-	return i(r, a(o, {
+var s = (s) => {
+	let { ctx: c, attachListeners: l } = n(), [u, d] = o(s, [
+		"component",
+		"class",
+		"classList",
+		"ref",
+		"tabIndex"
+	]);
+	return i(r, a(d, {
 		get component() {
-			return o.component ?? "div";
+			return u.component ?? "div";
 		},
 		ref(e) {
-			var n = t((e) => s.setTrigger(e), o.ref, c);
+			var n = t((e) => c.setTrigger(e), u.ref, l);
 			typeof n == "function" && n(e);
 		},
 		"data-slot": "context-menu-trigger",
 		get "data-popup-open"() {
-			return s.open() ? "" : void 0;
+			return c.open() ? "" : void 0;
 		},
 		get "data-pressed"() {
-			return s.open() ? "" : void 0;
+			return c.open() ? "" : void 0;
 		},
 		get tabIndex() {
-			return o.tabIndex ?? 0;
+			return u.tabIndex ?? 0;
 		},
 		get class() {
-			return e("select-none", o.class);
+			return e("select-none", u.class);
+		},
+		get classList() {
+			return u.classList;
 		}
 	}));
 };
 //#endregion
-export { o as ContextMenuTrigger };
+export { s as ContextMenuTrigger };
 
 //# sourceMappingURL=ContextMenuTrigger.js.map

package/dist/components/context-menu/ContextMenuTrigger/ContextMenuTrigger.js.map

@@ -1 +1 @@
-{"version":3,"file":"ContextMenuTrigger.js","names":["ValidComponent","Dynamic","clsx","mergeRefs","useContextMenuTrigger","ContextMenuTriggerProps","ContextMenuTrigger","props","T","ctx","attachListeners","_$createComponent","_$mergeProps","component","ref","r$","_ref$","el","setTrigger","HTMLElement","data-popup-open","open","undefined","data-pressed","tabIndex","class","_$createComponent","_$mergeProps","ContextMenuTrigger","useContextMenuTrigger","createComponent","Dynamic","mergeProps","props","_ref$","mergeRefs","ctx","el","attachListeners","r$","\"class\"","clsx"],"sources":["../../../../src/components/context-menu/ContextMenuTrigger/ContextMenuTrigger.tsx"],"sourcesContent":["import type { ValidComponent } from \"solid-js\";\nimport { Dynamic } from \"solid-js/web\";\nimport { clsx, mergeRefs } from \"~/utils\";\nimport { useContextMenuTrigger } from \"./useContextMenuTrigger\";\nimport type { ContextMenuTriggerProps } from \"./ContextMenuTrigger.types\";\n\n/**\n * ContextMenu 的触发区域,默认渲染 `<div>`,支持通过 `component` 多态渲染成\n * 任意标签或组件(与 TooltipTrigger 一致)。通过以下方式打开菜单:\n * - 右键(contextmenu 事件),锚定到鼠标坐标\n * - 触摸/手写笔长按 500ms,锚定到按下坐标\n * - 键盘 Shift+F10 或菜单键,锚定到触发器中心\n *\n * 事件逻辑在 `useContextMenuTrigger` 里用 `addEventListener` 绑定,因此调用方\n * 自己传入的 `onClick` / `onContextMenu` 不会被覆盖。\n */\nexport const ContextMenuTrigger = <T extends ValidComponent = \"div\">(\n  props: ContextMenuTriggerProps<T>,\n) => {\n  const { ctx, attachListeners } = useContextMenuTrigger();\n\n  return (\n    <Dynamic\n      {...props}\n      component={(props.component as ValidComponent) ?? \"div\"}\n      ref={mergeRefs(\n        (el) => ctx.setTrigger(el as HTMLElement),\n        props.ref,\n        attachListeners,\n      )}\n      data-slot=\"context-menu-trigger\"\n      data-popup-open={ctx.open() ? \"\" : undefined}\n      data-pressed={ctx.open() ? \"\" : undefined}\n      tabIndex={props.tabIndex ?? 0}\n      class={clsx(\"select-none\", props.class)}\n    />\n  );\n};\n"],"mappings":";;;;;AAgBA,IAAaM,KACXC,MACG;CACH,IAAM,EAAEE,QAAKC,uBAAoBN,EAAsB;CAEvD,OAAAO,EACGV,GAAOW,EACFL,GAAK;EAAA,IACTM,YAAS;GAAA,OAAGN,EAAMM,aAAgC;EAAK;EAAAC,IAAAC,GAAA;GAAA,IAAAC,IAClDb,GACFc,MAAOR,EAAIS,WAAWD,CAAiB,GACxCV,EAAMO,KACNJ,CACF;GAAC,OAAAM,KAAA,cAAAA,EAAAD,CAAA;EAAA;EAAA,aAAA;EAAA,IAAA,oBAAA;GAAA,OAEgBN,EAAIY,KAAK,IAAI,KAAKC,KAAAA;EAAS;EAAA,IAAA,iBAAA;GAAA,OAC9Bb,EAAIY,KAAK,IAAI,KAAKC,KAAAA;EAAS;EAAA,IACzCE,WAAQ;GAAA,OAAEjB,EAAMiB,YAAY;EAAC;EAAA,IAAAgB,QAAA;GAAA,OACtBtC,EAAK,eAAeK,EAAMkB,KAAK;EAAC;CAAA,CAAA,CAAA;AAG7C"}
+{"version":3,"file":"ContextMenuTrigger.js","names":["splitProps","ValidComponent","Dynamic","clsx","mergeRefs","useContextMenuTrigger","ContextMenuTriggerProps","ContextMenuTrigger","props","T","ctx","attachListeners","local","others","_$createComponent","_$mergeProps","component","ref","r$","_ref$","el","setTrigger","HTMLElement","Element","data-popup-open","open","undefined","data-pressed","tabIndex","class","classList","_$createComponent","_$mergeProps","ContextMenuTrigger","useContextMenuTrigger","local","others","splitProps","props","createComponent","Dynamic","mergeProps","_ref$","mergeRefs","ctx","el","attachListeners","r$","\"class\"","clsx"],"sources":["../../../../src/components/context-menu/ContextMenuTrigger/ContextMenuTrigger.tsx"],"sourcesContent":["import { splitProps, type ValidComponent } from \"solid-js\";\nimport { Dynamic } from \"solid-js/web\";\nimport { clsx, mergeRefs } from \"~/utils\";\nimport { useContextMenuTrigger } from \"./useContextMenuTrigger\";\nimport type { ContextMenuTriggerProps } from \"./ContextMenuTrigger.types\";\n\n/**\n * ContextMenu 的触发区域,默认渲染 `<div>`,支持通过 `component` 多态渲染成\n * 任意标签或组件(与 TooltipTrigger 一致)。通过以下方式打开菜单:\n * - 右键(contextmenu 事件),锚定到鼠标坐标\n * - 触摸/手写笔长按 500ms,锚定到按下坐标\n * - 键盘 Shift+F10 或菜单键,锚定到触发器中心\n *\n * 事件逻辑在 `useContextMenuTrigger` 里用 `addEventListener` 绑定,因此调用方\n * 自己传入的 `onClick` / `onContextMenu` 不会被覆盖。\n */\nexport const ContextMenuTrigger = <T extends ValidComponent = \"div\">(\n  props: ContextMenuTriggerProps<T>,\n) => {\n  const { ctx, attachListeners } = useContextMenuTrigger();\n\n  // class / classList 必须显式摘出来并一起传给 Dynamic：\n  // `{...props}` 之后再写显式 `class=` 会用 node.className 覆盖掉 classList\n  const [local, others] = splitProps(props as ContextMenuTriggerProps, [\n    \"component\",\n    \"class\",\n    \"classList\",\n    \"ref\",\n    \"tabIndex\",\n  ]);\n\n  return (\n    <Dynamic\n      {...others}\n      component={(local.component as ValidComponent) ?? \"div\"}\n      ref={mergeRefs(\n        (el) => ctx.setTrigger(el as HTMLElement),\n        local.ref as Element | ((el: Element) => void) | undefined,\n        attachListeners,\n      )}\n      data-slot=\"context-menu-trigger\"\n      data-popup-open={ctx.open() ? \"\" : undefined}\n      data-pressed={ctx.open() ? \"\" : undefined}\n      tabIndex={local.tabIndex ?? 0}\n      class={clsx(\"select-none\", local.class)}\n      classList={local.classList}\n    />\n  );\n};\n"],"mappings":";;;;;;AAgBA,IAAaO,KACXC,MACG;CACH,IAAM,EAAEE,QAAKC,uBAAoBN,EAAsB,GAIjD,CAACO,GAAOC,KAAUb,EAAWQ,GAAkC;EACnE;EACA;EACA;EACA;EACA;CAAU,CACX;CAED,OAAAM,EACGZ,GAAOa,EACFF,GAAM;EAAA,IACVG,YAAS;GAAA,OAAGJ,EAAMI,aAAgC;EAAK;EAAAC,IAAAC,GAAA;GAAA,IAAAC,IAClDf,GACFgB,MAAOV,EAAIW,WAAWD,CAAiB,GACxCR,EAAMK,KACNN,CACF;GAAC,OAAAQ,KAAA,cAAAA,EAAAD,CAAA;EAAA;EAAA,aAAA;EAAA,IAAA,oBAAA;GAAA,OAEgBR,EAAIe,KAAK,IAAI,KAAKC,KAAAA;EAAS;EAAA,IAAA,iBAAA;GAAA,OAC9BhB,EAAIe,KAAK,IAAI,KAAKC,KAAAA;EAAS;EAAA,IACzCE,WAAQ;GAAA,OAAEhB,EAAMgB,YAAY;EAAC;EAAA,IAAAoB,QAAA;GAAA,OACtB7C,EAAK,eAAeS,EAAMiB,KAAK;EAAC;EAAA,IACvCC,YAAS;GAAA,OAAElB,EAAMkB;EAAS;CAAA,CAAA,CAAA;AAGhC"}

package/dist/components/context-menu/ContextMenuTrigger/context-menu.long-press.d.ts

@@ -0,0 +1,24 @@
+export interface CreateLongPressOptions {
+    /** 按住多久算长按（毫秒） */
+    delayMs: number;
+    /** 允许的手指抖动距离（像素） */
+    tolerancePx: number;
+    /** 计时到点且未抖出容差时触发 */
+    onTrigger: () => void;
+}
+export interface LongPressGesture {
+    /** 手指按下：记录起点并开始计时（重复调用会重置计时） */
+    start: (x: number, y: number) => void;
+    /** 手指移动：抖出容差即取消 */
+    move: (x: number, y: number) => void;
+    /** 抬起 / 取消 / 卸载：停止计时 */
+    cancel: () => void;
+}
+/**
+ * 长按手势。
+ *
+ * 单一职责：一个"按住 delayMs 且抖动不超过 tolerancePx 才触发"的计时器状态机。
+ * 不碰 DOM、不读事件——起点坐标由调用方传入，因此可以用假定时器精确断言
+ * 计时、抖动取消与重复起点接管。
+ */
+export declare function createLongPress(options: CreateLongPressOptions): LongPressGesture;

package/dist/components/context-menu/ContextMenuTrigger/context-menu.long-press.js

@@ -0,0 +1,26 @@
+//#region src/components/context-menu/ContextMenuTrigger/context-menu.long-press.ts
+function e(e) {
+	let t, n, r = () => {
+		t !== void 0 && (window.clearTimeout(t), t = void 0);
+	};
+	return {
+		start(i, a) {
+			n = {
+				x: i,
+				y: a
+			}, r(), t = window.setTimeout(() => {
+				t = void 0, e.onTrigger();
+			}, e.delayMs);
+		},
+		move(i, a) {
+			n && t !== void 0 && Math.hypot(i - n.x, a - n.y) > e.tolerancePx && r();
+		},
+		cancel() {
+			n = void 0, r();
+		}
+	};
+}
+//#endregion
+export { e as createLongPress };
+
+//# sourceMappingURL=context-menu.long-press.js.map

package/dist/components/context-menu/ContextMenuTrigger/context-menu.long-press.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"context-menu.long-press.js","names":["createLongPress","timer","origin","clear","options","x","y"],"sources":["../../../../src/components/context-menu/ContextMenuTrigger/context-menu.long-press.ts"],"sourcesContent":["export interface CreateLongPressOptions {\n  /** 按住多久算长按（毫秒） */\n  delayMs: number;\n  /** 允许的手指抖动距离（像素） */\n  tolerancePx: number;\n  /** 计时到点且未抖出容差时触发 */\n  onTrigger: () => void;\n}\n\nexport interface LongPressGesture {\n  /** 手指按下：记录起点并开始计时（重复调用会重置计时） */\n  start: (x: number, y: number) => void;\n  /** 手指移动：抖出容差即取消 */\n  move: (x: number, y: number) => void;\n  /** 抬起 / 取消 / 卸载：停止计时 */\n  cancel: () => void;\n}\n\n/**\n * 长按手势。\n *\n * 单一职责：一个\"按住 delayMs 且抖动不超过 tolerancePx 才触发\"的计时器状态机。\n * 不碰 DOM、不读事件——起点坐标由调用方传入，因此可以用假定时器精确断言\n * 计时、抖动取消与重复起点接管。\n */\nexport function createLongPress(\n  options: CreateLongPressOptions,\n): LongPressGesture {\n  let timer: number | undefined;\n  let origin: { x: number; y: number } | undefined;\n\n  const clear = () => {\n    if (timer !== undefined) {\n      window.clearTimeout(timer);\n      timer = undefined;\n    }\n  };\n\n  return {\n    start(x, y) {\n      origin = { x, y };\n      clear();\n      timer = window.setTimeout(() => {\n        timer = undefined;\n        options.onTrigger();\n      }, options.delayMs);\n    },\n    move(x, y) {\n      if (!origin || timer === undefined) return;\n      if (Math.hypot(x - origin.x, y - origin.y) > options.tolerancePx) clear();\n    },\n    cancel() {\n      origin = undefined;\n      clear();\n    },\n  };\n}\n"],"mappings":";AAyBA,SAAgBA,EACd,GACkB;CAClB,IAAIC,GACAC,GAEEC,UAAc;EAClB,AAAIF,MAAU,KAAA,MACZ,OAAO,aAAaA,CAAK,GACzB,IAAQ,KAAA;CAEZ;CAEA,OAAO;EACL,MAAM,GAAG,GAAG;GAGV,AAFA,IAAS;IAAE;IAAG;GAAE,GAChBE,EAAM,GACN,IAAQ,OAAO,iBAAiB;IAE9B,AADA,IAAQ,KAAA,GACRC,EAAQ,UAAU;GACpB,GAAGA,EAAQ,OAAO;EACpB;EACA,KAAK,GAAG,GAAG;GACT,AAAKF,KAAUD,MAAU,KAAA,KACrB,KAAK,MAAMI,IAAIH,EAAO,GAAGI,IAAIJ,EAAO,CAAC,IAAIE,EAAQ,eAAaD,EAAM;EAC1E;EACA,SAAS;GAEP,AADA,IAAS,KAAA,GACTA,EAAM;EACR;CACF;AACF"}

package/dist/components/context-menu/ContextMenuTrigger/context-menu.trigger.utils.d.ts

@@ -0,0 +1,35 @@
+/** 触摸长按唤起菜单的时间阈值（毫秒），与 Base UI 保持一致 */
+export declare const LONG_PRESS_DELAY = 500;
+/** 长按期间允许的手指抖动距离（像素），超过即取消 */
+export declare const LONG_PRESS_MOVE_TOLERANCE = 10;
+/**
+ * 触发器"唤起菜单"的判定与锚点计算。
+ *
+ * 单一职责：只回答"这次事件该不该唤起""锚点坐标取哪里"，
+ * 不注册事件、不持有定时器状态。
+ */
+/**
+ * 键盘唤起：菜单键（ContextMenu）或 Shift+F10。
+ * 两者都是无障碍规范里"打开上下文菜单"的标准按键。
+ */
+export declare function isContextMenuKey(event: KeyboardEvent): boolean;
+/**
+ * 指针长按：只处理触摸/手写笔。
+ * 鼠标右键由原生 `contextmenu` 事件负责，再处理一次会重复打开。
+ */
+export declare function isLongPressPointer(event: PointerEvent): boolean;
+/** 手指是否已抖出容差（超过容差即取消长按，让用户能正常滚动） */
+export declare function isBeyondTolerance(origin: {
+    x: number;
+    y: number;
+}, x: number, y: number, tolerance?: number): boolean;
+/** 键盘唤起时的锚点：触发器矩形的中心（菜单贴着触发器弹出） */
+export declare function menuAnchorFromRect(rect: {
+    left: number;
+    top: number;
+    width: number;
+    height: number;
+}): {
+    x: number;
+    y: number;
+};

package/dist/components/context-menu/ContextMenuTrigger/context-menu.trigger.utils.js

@@ -0,0 +1,17 @@
+//#region src/components/context-menu/ContextMenuTrigger/context-menu.trigger.utils.ts
+function e(e) {
+	return e.key === "ContextMenu" || e.shiftKey && e.key === "F10";
+}
+function t(e) {
+	return e.pointerType !== "mouse";
+}
+function n(e) {
+	return {
+		x: e.left + e.width / 2,
+		y: e.top + e.height / 2
+	};
+}
+//#endregion
+export { e as isContextMenuKey, t as isLongPressPointer, n as menuAnchorFromRect };
+
+//# sourceMappingURL=context-menu.trigger.utils.js.map

package/dist/components/context-menu/ContextMenuTrigger/context-menu.trigger.utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"context-menu.trigger.utils.js","names":["isContextMenuKey","event","isLongPressPointer","menuAnchorFromRect","rect"],"sources":["../../../../src/components/context-menu/ContextMenuTrigger/context-menu.trigger.utils.ts"],"sourcesContent":["/** 触摸长按唤起菜单的时间阈值（毫秒），与 Base UI 保持一致 */\nexport const LONG_PRESS_DELAY = 500;\n/** 长按期间允许的手指抖动距离（像素），超过即取消 */\nexport const LONG_PRESS_MOVE_TOLERANCE = 10;\n\n/**\n * 触发器\"唤起菜单\"的判定与锚点计算。\n *\n * 单一职责：只回答\"这次事件该不该唤起\"\"锚点坐标取哪里\"，\n * 不注册事件、不持有定时器状态。\n */\n\n/**\n * 键盘唤起：菜单键（ContextMenu）或 Shift+F10。\n * 两者都是无障碍规范里\"打开上下文菜单\"的标准按键。\n */\nexport function isContextMenuKey(event: KeyboardEvent): boolean {\n  return event.key === \"ContextMenu\" || (event.shiftKey && event.key === \"F10\");\n}\n\n/**\n * 指针长按：只处理触摸/手写笔。\n * 鼠标右键由原生 `contextmenu` 事件负责，再处理一次会重复打开。\n */\nexport function isLongPressPointer(event: PointerEvent): boolean {\n  return event.pointerType !== \"mouse\";\n}\n\n/** 手指是否已抖出容差（超过容差即取消长按，让用户能正常滚动） */\nexport function isBeyondTolerance(\n  origin: { x: number; y: number },\n  x: number,\n  y: number,\n  tolerance: number = LONG_PRESS_MOVE_TOLERANCE,\n): boolean {\n  return Math.hypot(x - origin.x, y - origin.y) > tolerance;\n}\n\n/** 键盘唤起时的锚点：触发器矩形的中心（菜单贴着触发器弹出） */\nexport function menuAnchorFromRect(rect: {\n  left: number;\n  top: number;\n  width: number;\n  height: number;\n}): { x: number; y: number } {\n  return { x: rect.left + rect.width / 2, y: rect.top + rect.height / 2 };\n}\n"],"mappings":";AAgBA,SAAgBA,EAAiB,GAA+B;CAC9D,OAAOC,EAAM,QAAQ,iBAAkBA,EAAM,YAAYA,EAAM,QAAQ;AACzE;AAMA,SAAgBC,EAAmB,GAA8B;CAC/D,OAAOD,EAAM,gBAAgB;AAC/B;AAaA,SAAgBE,EAAmB,GAKN;CAC3B,OAAO;EAAE,GAAGC,EAAK,OAAOA,EAAK,QAAQ;EAAG,GAAGA,EAAK,MAAMA,EAAK,SAAS;CAAE;AACxE"}

package/dist/components/context-menu/ContextMenuTrigger/useContextMenuTrigger.d.ts

@@ -2,22 +2,20 @@ import { useContextMenuContext } from '../ContextMenu/ContextMenu.context';
 export interface UseContextMenuTriggerResult {
     ctx: ReturnType<typeof useContextMenuContext>;
     /**
-     * 把右键 / 长按 / 键盘唤起菜单的原生事件绑定到真正的 DOM 元素上(通过 ref 调用)。
-     * 用 addEventListener 而不是 JSX 的 onXxx prop,是为了不占用这些 prop 名——
-     * 调用方可以在触发器上自由传自己的 `onClick` / `onContextMenu`,两者互不覆盖。
+     * 把右键 / 长按 / 键盘唤起菜单的原生事件绑定到真正的 DOM 元素上（通过 ref 调用）。
+     * 用 addEventListener 而不是 JSX 的 onXxx prop，是为了不占用这些 prop 名——
+     * 调用方可以在触发器上自由传自己的 `onClick` / `onContextMenu`，两者互不覆盖。
      * 这与 TooltipTrigger 是同一套约定。
      */
     attachListeners: (el: Element) => void;
 }
 /**
- * 封装 ContextMenuTrigger 需要绑定的所有事件逻辑:
- * - contextmenu(右键):锚定到鼠标坐标
- * - pointerdown(触摸/手写笔)后持续 500ms 视为长按,锚定到按下坐标;抖动超过
- *   阈值、抬起或取消都会撤销
- * - keydown(Shift+F10 / 菜单键):锚定到触发器中心,满足键盘可达性
+ * ContextMenuTrigger 的事件接线：
+ * - contextmenu（右键）：锚定到鼠标坐标；
+ * - pointerdown（触摸/手写笔）长按 500ms：锚定到按下坐标（手势本身在
+ *   `context-menu.long-press`）；
+ * - keydown（Shift+F10 / 菜单键）：锚定到触发器中心，满足键盘可达性。
  *
- * 事件直接绑在 `el` 上,不依赖具体标签类型,因此触发器可以多态渲染成
- * div / button / 任意组件。回调参数统一声明为 `Event` 再在内部收窄,
- * 这是为了兼容 `Element.addEventListener` 的重载(与 TooltipTrigger 一致)。
+ * 判定与锚点计算都在 `context-menu.trigger.utils`，本 hook 只做绑定与清理。
  */
 export declare function useContextMenuTrigger(): UseContextMenuTriggerResult;