@neut/ui 0.0.17 → 0.0.18

package/dist/components/context-menu/ContextMenuContent/context-menu.highlight.d.ts

@@ -0,0 +1,33 @@
+import { Accessor } from 'solid-js';
+import { ContextMenuItemEntry } from '../context-menu.types';
+/**
+ * 浮层内的高亮导航。
+ *
+ * 单一职责：维护"当前高亮的是哪一项"，并提供移动/跳到首尾的能力。
+ * 交互模型是焦点留在 popup 上、高亮用 `aria-activedescendant` 表达，
+ * 因此这里只改 id，不碰真实焦点。
+ */
+/** 键盘移动时的目标下标（-1 表示列表为空，调用方据此放弃） */
+export declare function resolveNextActiveIndex(currentIndex: number, delta: 1 | -1, length: number, loopFocus: boolean): number;
+export interface CreateHighlightOptions {
+    /** 全部菜单项（按 DOM 顺序），用于反查当前高亮项 */
+    orderedItems: Accessor<ContextMenuItemEntry[]>;
+    /** 可参与导航的菜单项（排除 disabled） */
+    enabledItems: Accessor<ContextMenuItemEntry[]>;
+    loopFocus: () => boolean;
+    /** 当前展开的子菜单项 id（没有展开时为 undefined） */
+    openPopupId: Accessor<string | undefined>;
+    /** 关闭已展开的子菜单 */
+    closeOpenPopup: () => void;
+    /** 本浮层是否打开；关闭时清空高亮，保证下次从第一项开始 */
+    open: Accessor<boolean>;
+}
+export interface HighlightNavigation {
+    activeId: Accessor<string | undefined>;
+    activeEntry: Accessor<ContextMenuItemEntry | undefined>;
+    setActiveId: (id: string | undefined) => void;
+    moveActive: (delta: 1 | -1) => void;
+    focusFirst: () => void;
+    focusLast: () => void;
+}
+export declare function createHighlight(options: CreateHighlightOptions): HighlightNavigation;

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

@@ -0,0 +1,41 @@
+import { createEffect as e, createMemo as t, createSignal as n } from "solid-js";
+//#region src/components/context-menu/ContextMenuContent/context-menu.highlight.ts
+function r(e, t, n, r) {
+	if (n <= 0) return -1;
+	if (e === -1) return t > 0 ? 0 : n - 1;
+	let i = e + t;
+	return i < 0 ? r ? n - 1 : 0 : i >= n ? r ? 0 : n - 1 : i;
+}
+function i(i) {
+	let [a, o] = n(), s = (e) => {
+		o(e);
+		let t = i.openPopupId();
+		t !== void 0 && t !== e && i.closeOpenPopup();
+	}, c = t(() => i.orderedItems().find((e) => e.id === a()));
+	return e(() => {
+		let e = c();
+		e && e.element.scrollIntoView({ block: "nearest" });
+	}), e(() => {
+		i.open() || (o(void 0), i.closeOpenPopup());
+	}), {
+		activeId: a,
+		activeEntry: c,
+		setActiveId: s,
+		moveActive(e) {
+			let t = i.enabledItems(), n = r(t.findIndex((e) => e.id === a()), e, t.length, i.loopFocus());
+			n !== -1 && s(t[n].id);
+		},
+		focusFirst() {
+			let e = i.enabledItems();
+			s(e.length > 0 ? e[0].id : void 0);
+		},
+		focusLast() {
+			let e = i.enabledItems();
+			s(e.length > 0 ? e[e.length - 1].id : void 0);
+		}
+	};
+}
+//#endregion
+export { i as createHighlight, r as resolveNextActiveIndex };
+
+//# sourceMappingURL=context-menu.highlight.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"context-menu.highlight.js","names":["resolveNextActiveIndex","length","currentIndex","delta","next","loopFocus","createHighlight","activeId","setActiveIdInternal","createSignal","setActiveId","id","openId","options","activeEntry","createMemo","item","createEffect","entry","list","nextIndex"],"sources":["../../../../src/components/context-menu/ContextMenuContent/context-menu.highlight.ts"],"sourcesContent":["import {\n  createEffect,\n  createMemo,\n  createSignal,\n  type Accessor,\n} from \"solid-js\";\nimport type { ContextMenuItemEntry } from \"../context-menu.types\";\n\n/**\n * 浮层内的高亮导航。\n *\n * 单一职责：维护\"当前高亮的是哪一项\"，并提供移动/跳到首尾的能力。\n * 交互模型是焦点留在 popup 上、高亮用 `aria-activedescendant` 表达，\n * 因此这里只改 id，不碰真实焦点。\n */\n\n/** 键盘移动时的目标下标（-1 表示列表为空，调用方据此放弃） */\nexport function resolveNextActiveIndex(\n  currentIndex: number,\n  delta: 1 | -1,\n  length: number,\n  loopFocus: boolean,\n): number {\n  if (length <= 0) return -1;\n  if (currentIndex === -1) return delta > 0 ? 0 : length - 1;\n\n  const next = currentIndex + delta;\n  if (next < 0) return loopFocus ? length - 1 : 0;\n  if (next >= length) return loopFocus ? 0 : length - 1;\n  return next;\n}\n\nexport interface CreateHighlightOptions {\n  /** 全部菜单项（按 DOM 顺序），用于反查当前高亮项 */\n  orderedItems: Accessor<ContextMenuItemEntry[]>;\n  /** 可参与导航的菜单项（排除 disabled） */\n  enabledItems: Accessor<ContextMenuItemEntry[]>;\n  loopFocus: () => boolean;\n  /** 当前展开的子菜单项 id（没有展开时为 undefined） */\n  openPopupId: Accessor<string | undefined>;\n  /** 关闭已展开的子菜单 */\n  closeOpenPopup: () => void;\n  /** 本浮层是否打开；关闭时清空高亮，保证下次从第一项开始 */\n  open: Accessor<boolean>;\n}\n\nexport interface HighlightNavigation {\n  activeId: Accessor<string | undefined>;\n  activeEntry: Accessor<ContextMenuItemEntry | undefined>;\n  setActiveId: (id: string | undefined) => void;\n  moveActive: (delta: 1 | -1) => void;\n  focusFirst: () => void;\n  focusLast: () => void;\n}\n\nexport function createHighlight(\n  options: CreateHighlightOptions,\n): HighlightNavigation {\n  const [activeId, setActiveIdInternal] = createSignal<string | undefined>();\n\n  /** 高亮某项；若高亮切到了别的项，顺手关掉已展开的子菜单 */\n  const setActiveId = (id: string | undefined) => {\n    setActiveIdInternal(id);\n    const openId = options.openPopupId();\n    if (openId !== undefined && openId !== id) options.closeOpenPopup();\n  };\n\n  const activeEntry = createMemo(() =>\n    options.orderedItems().find((item) => item.id === activeId()),\n  );\n\n  // 高亮项变化时滚动到可见区域\n  createEffect(() => {\n    const entry = activeEntry();\n    if (!entry) return;\n    entry.element.scrollIntoView({ block: \"nearest\" });\n  });\n\n  // 关闭时清空高亮与子菜单状态\n  createEffect(() => {\n    if (options.open()) return;\n    setActiveIdInternal(undefined);\n    options.closeOpenPopup();\n  });\n\n  return {\n    activeId,\n    activeEntry,\n    setActiveId,\n    moveActive(delta) {\n      const list = options.enabledItems();\n      const currentIndex = list.findIndex((item) => item.id === activeId());\n      const nextIndex = resolveNextActiveIndex(\n        currentIndex,\n        delta,\n        list.length,\n        options.loopFocus(),\n      );\n      if (nextIndex === -1) return;\n      setActiveId(list[nextIndex]!.id);\n    },\n    focusFirst() {\n      const list = options.enabledItems();\n      setActiveId(list.length > 0 ? list[0]!.id : undefined);\n    },\n    focusLast() {\n      const list = options.enabledItems();\n      setActiveId(list.length > 0 ? list[list.length - 1]!.id : undefined);\n    },\n  };\n}\n"],"mappings":";;AAiBA,SAAgBA,EACd,GACA,GACA,GACA,GACQ;CACR,IAAIC,KAAU,GAAG,OAAO;CACxB,IAAIC,MAAiB,IAAI,OAAOC,IAAQ,IAAI,IAAIF,IAAS;CAEzD,IAAMG,IAAOF,IAAeC;CAG5B,OAFIC,IAAO,IAAUC,IAAYJ,IAAS,IAAI,IAC1CG,KAAQH,IAAeI,IAAY,IAAIJ,IAAS,IAC7CG;AACT;AAyBA,SAAgBE,EACd,GACqB;CACrB,IAAM,CAACC,GAAUC,KAAuBC,EAAiC,GAGnEC,KAAe,MAA2B;EAC9C,EAAoBC,CAAE;EACtB,IAAMC,IAASC,EAAQ,YAAY;EACnC,AAAID,MAAW,KAAA,KAAaA,MAAWD,KAAIE,EAAQ,eAAe;CACpE,GAEMC,IAAcC,QAClBF,EAAQ,aAAa,CAAC,CAAC,MAAM,MAASG,EAAK,OAAOT,EAAS,CAAC,CAC9D;CAgBA,OAbAU,QAAmB;EACjB,IAAMC,IAAQJ,EAAY;EAC1B,AAAKI,KACLA,EAAM,QAAQ,eAAe,EAAE,OAAO,UAAU,CAAC;CACnD,CAAC,GAGDD,QAAmB;EACjB,AAAIJ,EAAQ,KAAK,MACjBL,EAAoB,KAAA,CAAS,GAC7BK,EAAQ,eAAe;CACzB,CAAC,GAEM;EACL;EACA;EACA;EACA,WAAW,GAAO;GAChB,IAAMM,IAAON,EAAQ,aAAa,GAE5BO,IAAYpB,EADGmB,EAAK,WAAW,MAASH,EAAK,OAAOT,EAAS,CAEjE,GACAJ,GACAgB,EAAK,QACLN,EAAQ,UAAU,CACpB;GACA,AAAIO,MAAc,MAClBV,EAAYS,EAAKC,EAAU,CAAE,EAAE;EACjC;EACA,aAAa;GACX,IAAMD,IAAON,EAAQ,aAAa;GAClC,EAAYM,EAAK,SAAS,IAAIA,EAAK,EAAE,CAAE,KAAK,KAAA,CAAS;EACvD;EACA,YAAY;GACV,IAAMA,IAAON,EAAQ,aAAa;GAClC,EAAYM,EAAK,SAAS,IAAIA,EAAKA,EAAK,SAAS,EAAE,CAAE,KAAK,KAAA,CAAS;EACrE;CACF;AACF"}

package/dist/components/context-menu/ContextMenuContent/context-menu.popup-items.d.ts

@@ -0,0 +1,25 @@
+import { Accessor } from 'solid-js';
+import { ContextMenuItemEntry } from '../context-menu.types';
+/**
+ * 浮层内的菜单项集合。
+ *
+ * 单一职责：维护"这一层里注册了哪些菜单项"，并给出两种派生视图——
+ * 按 DOM 顺序排好的全部项、以及其中未禁用的项。浮层之间的父子关系、
+ * 高亮与定位都不在这里。
+ */
+/** 按 DOM 顺序比较两个菜单项：A 在 B 之前返回 -1，之后返回 1，同一元素返回 0 */
+export declare function compareItemElements(a: ContextMenuItemEntry, b: ContextMenuItemEntry): number;
+export interface ItemCollection {
+    /** 按注册时机排列的原始列表（`orderedItems` 之前的状态） */
+    items: Accessor<ContextMenuItemEntry[]>;
+    registerItem: (entry: ContextMenuItemEntry) => () => void;
+    /**
+     * 按 DOM 顺序排序后的列表。
+     * 调用方常用 `<For>` 动态生成菜单项，注册顺序与实际渲染顺序可能不同，
+     * 而"上一项/下一项"必须按用户看到的顺序走。
+     */
+    orderedItems: Accessor<ContextMenuItemEntry[]>;
+    /** 可参与键盘导航的项（排除 disabled） */
+    enabledItems: Accessor<ContextMenuItemEntry[]>;
+}
+export declare function createItemCollection(): ItemCollection;

package/dist/components/context-menu/ContextMenuContent/context-menu.popup-items.js

@@ -0,0 +1,20 @@
+import { createMemo as e, createSignal as t } from "solid-js";
+//#region src/components/context-menu/ContextMenuContent/context-menu.popup-items.ts
+function n(e, t) {
+	return e.element === t.element ? 0 : e.element.compareDocumentPosition(t.element) & Node.DOCUMENT_POSITION_FOLLOWING ? -1 : 1;
+}
+function r() {
+	let [r, i] = t([]), a = e(() => [...r()].sort(n));
+	return {
+		items: r,
+		orderedItems: a,
+		enabledItems: e(() => a().filter((e) => !e.disabled())),
+		registerItem(e) {
+			return i((t) => [...t, e]), () => i((t) => t.filter((t) => t.id !== e.id));
+		}
+	};
+}
+//#endregion
+export { n as compareItemElements, r as createItemCollection };
+
+//# sourceMappingURL=context-menu.popup-items.js.map

package/dist/components/context-menu/ContextMenuContent/context-menu.popup-items.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"context-menu.popup-items.js","names":["compareItemElements","a","b","createItemCollection","items","setItems","createSignal","orderedItems","createMemo","item","list","entry","it"],"sources":["../../../../src/components/context-menu/ContextMenuContent/context-menu.popup-items.ts"],"sourcesContent":["import { createMemo, createSignal, type Accessor } from \"solid-js\";\nimport type { ContextMenuItemEntry } from \"../context-menu.types\";\n\n/**\n * 浮层内的菜单项集合。\n *\n * 单一职责：维护\"这一层里注册了哪些菜单项\"，并给出两种派生视图——\n * 按 DOM 顺序排好的全部项、以及其中未禁用的项。浮层之间的父子关系、\n * 高亮与定位都不在这里。\n */\n\n/** 按 DOM 顺序比较两个菜单项：A 在 B 之前返回 -1，之后返回 1，同一元素返回 0 */\nexport function compareItemElements(\n  a: ContextMenuItemEntry,\n  b: ContextMenuItemEntry,\n): number {\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\nexport interface ItemCollection {\n  /** 按注册时机排列的原始列表（`orderedItems` 之前的状态） */\n  items: Accessor<ContextMenuItemEntry[]>;\n  registerItem: (entry: ContextMenuItemEntry) => () => void;\n  /**\n   * 按 DOM 顺序排序后的列表。\n   * 调用方常用 `<For>` 动态生成菜单项，注册顺序与实际渲染顺序可能不同，\n   * 而\"上一项/下一项\"必须按用户看到的顺序走。\n   */\n  orderedItems: Accessor<ContextMenuItemEntry[]>;\n  /** 可参与键盘导航的项（排除 disabled） */\n  enabledItems: Accessor<ContextMenuItemEntry[]>;\n}\n\nexport function createItemCollection(): ItemCollection {\n  const [items, setItems] = createSignal<ContextMenuItemEntry[]>([]);\n\n  const orderedItems = createMemo(() => [...items()].sort(compareItemElements));\n\n  return {\n    items,\n    orderedItems,\n    enabledItems: createMemo(() =>\n      orderedItems().filter((item) => !item.disabled()),\n    ),\n    registerItem(entry) {\n      setItems((list) => [...list, entry]);\n      return () => setItems((list) => list.filter((it) => it.id !== entry.id));\n    },\n  };\n}\n"],"mappings":";;AAYA,SAAgBA,EACd,GACA,GACQ;CAGR,OAFIC,EAAE,YAAYC,EAAE,UAAgB,IACnBD,EAAE,QAAQ,wBAAwBC,EAAE,OAC9C,IAAW,KAAK,8BAA8B,KAAK;AAC5D;AAgBA,SAAgBC,IAAuC;CACrD,IAAM,CAACC,GAAOC,KAAYC,EAAqC,CAAC,CAAC,GAE3DC,IAAeC,QAAiB,CAAC,GAAGJ,EAAM,CAAC,CAAC,CAAC,KAAKJ,CAAmB,CAAC;CAE5E,OAAO;EACL;EACA;EACA,cAAcQ,QACZD,EAAa,CAAC,CAAC,QAAQ,MAAS,CAACE,EAAK,SAAS,CAAC,CAClD;EACA,aAAa,GAAO;GAElB,OADAJ,GAAU,MAAS,CAAC,GAAGK,GAAMC,CAAK,CAAC,SACtBN,GAAU,MAASK,EAAK,QAAQ,MAAOE,EAAG,OAAOD,EAAM,EAAE,CAAC;EACzE;CACF;AACF"}

package/dist/components/context-menu/ContextMenuContent/context-menu.positioner.d.ts

@@ -0,0 +1,31 @@
+import { Accessor } from 'solid-js';
+import { Placement, Positioner, ReferenceElement } from '../../../lib';
+import { ContextMenuAlign, ContextMenuSide } from '../context-menu.types';
+export interface PopupPositionerOptions {
+    /** 定位锚点：根菜单是鼠标坐标的虚拟元素，子菜单是子菜单触发器 */
+    reference: Accessor<ReferenceElement | undefined>;
+    /** 负责定位的外层元素 */
+    positionerElement: Accessor<HTMLElement | undefined>;
+    side: Accessor<ContextMenuSide>;
+    align: Accessor<ContextMenuAlign>;
+    dir: Accessor<"ltr" | "rtl" | "auto" | undefined>;
+    sideOffset: Accessor<number>;
+    alignOffset: Accessor<number>;
+    collisionPadding: Accessor<number>;
+}
+export interface PopupPositioner {
+    pos: Positioner;
+    availableHeight: Accessor<number | undefined>;
+    placement: Accessor<Placement>;
+}
+/**
+ * 浮层的定位配置。
+ *
+ * 单一职责：把 `side` / `align` / 偏移 / 碰撞内边距这些 props 翻译成
+ * middleware 组合（offset → flip → shift → size → hide → containingBlockOffset），
+ * 并把 size 中间件算出的可用高度暴露给调用方（用于 max-height 滚动）。
+ *
+ * `containingBlockOffset` 放在最后：Portal 里的浮层相对视口定位，
+ * 但祖先若有 `transform`，fixed 定位的参考系会变，需要补上这段偏移。
+ */
+export declare function createPopupPositioner(options: PopupPositionerOptions): PopupPositioner;

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

@@ -0,0 +1,39 @@
+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 { createSignal as c } from "solid-js";
+//#region src/components/context-menu/ContextMenuContent/context-menu.positioner.ts
+function l(l) {
+	let [u, d] = c(), f = e(l.reference, l.positionerElement, {
+		placement: () => s(l.side(), l.align(), l.dir()),
+		strategy: "fixed",
+		middleware: () => [
+			t({
+				mainAxis: l.sideOffset(),
+				crossAxis: l.alignOffset()
+			}),
+			r(),
+			n({ padding: l.collisionPadding() }),
+			i({
+				padding: l.collisionPadding(),
+				apply: ({ availableHeight: e }) => d(e)
+			}),
+			a(),
+			o()
+		]
+	});
+	return {
+		pos: f,
+		availableHeight: u,
+		placement: f.placement
+	};
+}
+//#endregion
+export { l as createPopupPositioner };
+
+//# sourceMappingURL=context-menu.positioner.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"context-menu.positioner.js","names":["createPopupPositioner","availableHeight","setAvailableHeight","createSignal","pos","createPositioner","options","toContextMenuPlacement","offset","flip","shift","size","hide","containingBlockOffset"],"sources":["../../../../src/components/context-menu/ContextMenuContent/context-menu.positioner.ts"],"sourcesContent":["import { createSignal, type Accessor } 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 { ContextMenuAlign, ContextMenuSide } from \"../context-menu.types\";\nimport { toContextMenuPlacement } from \"../context-menu.utils\";\n\nexport interface PopupPositionerOptions {\n  /** 定位锚点：根菜单是鼠标坐标的虚拟元素，子菜单是子菜单触发器 */\n  reference: Accessor<ReferenceElement | undefined>;\n  /** 负责定位的外层元素 */\n  positionerElement: Accessor<HTMLElement | undefined>;\n  side: Accessor<ContextMenuSide>;\n  align: Accessor<ContextMenuAlign>;\n  dir: Accessor<\"ltr\" | \"rtl\" | \"auto\" | undefined>;\n  sideOffset: Accessor<number>;\n  alignOffset: Accessor<number>;\n  collisionPadding: Accessor<number>;\n}\n\nexport interface PopupPositioner {\n  pos: Positioner;\n  availableHeight: Accessor<number | undefined>;\n  placement: Accessor<Placement>;\n}\n\n/**\n * 浮层的定位配置。\n *\n * 单一职责：把 `side` / `align` / 偏移 / 碰撞内边距这些 props 翻译成\n * middleware 组合（offset → flip → shift → size → hide → containingBlockOffset），\n * 并把 size 中间件算出的可用高度暴露给调用方（用于 max-height 滚动）。\n *\n * `containingBlockOffset` 放在最后：Portal 里的浮层相对视口定位，\n * 但祖先若有 `transform`，fixed 定位的参考系会变，需要补上这段偏移。\n */\nexport function createPopupPositioner(\n  options: PopupPositionerOptions,\n): PopupPositioner {\n  const [availableHeight, setAvailableHeight] = createSignal<number>();\n\n  const pos = createPositioner(options.reference, options.positionerElement, {\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  return { pos, availableHeight, placement: pos.placement };\n}\n"],"mappings":";;;;;;;;;;AA6CA,SAAgBA,EACd,GACiB;CACjB,IAAM,CAACC,GAAiBC,KAAsBC,EAAqB,GAE7DC,IAAMC,EAAiBC,EAAQ,WAAWA,EAAQ,mBAAmB;EACzE,iBACEC,EAAuBD,EAAQ,KAAK,GAAGA,EAAQ,MAAM,GAAGA,EAAQ,IAAI,CAAC;EACvE,UAAU;EACV,kBAAkB;GAChBE,EAAO;IACL,UAAUF,EAAQ,WAAW;IAC7B,WAAWA,EAAQ,YAAY;GACjC,CAAC;GACDG,EAAK;GACLC,EAAM,EAAE,SAASJ,EAAQ,iBAAiB,EAAE,CAAC;GAC7CK,EAAK;IACH,SAASL,EAAQ,iBAAiB;IAClC,QAAQ,EAAE,yBAAsBJ,EAAmBD,CAAe;GACpE,CAAC;GACDW,EAAK;GACLC,EAAsB;EACxB;CACF,CAAC;CAED,OAAO;EAAE;EAAK;EAAiB,WAAWT,EAAI;CAAU;AAC1D"}

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