@neut/ui 0.0.15 → 0.0.17

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

@@ -0,0 +1,96 @@
+import { clsx as e } from "../../../utils/clsx.js";
+import { useContextMenuSubmenu as t } from "../context-menu.context.js";
+import { useContextMenuEntry as n } from "../context-menu.entry.js";
+import { contextMenuSubTriggerClass as r } from "../context-menu.styles.js";
+import { createComponent as i, delegateEvents as a, insert as o, mergeProps as s, spread as c, template as l, use as u } from "solid-js/web";
+import { createEffect as d, onCleanup as f, onMount as p, splitProps as m } from "solid-js";
+import { ChevronRight as h } from "lucide-solid";
+//#region src/components/context-menu/ContextMenuSubTrigger/ContextMenuSubTrigger.tsx
+var g = /*#__PURE__*/ l("<div role=menuitem aria-haspopup=menu tabindex=-1 data-slot=context-menu-sub-trigger>");
+function _(a) {
+	let l = t("ContextMenuSubTrigger"), [_, v] = m(a, [
+		"class",
+		"children",
+		"inset",
+		"disabled",
+		"label",
+		"openOnHover",
+		"delay",
+		"closeDelay",
+		"onClick"
+	]), y = () => !!_.disabled || l.disabled(), b, x = n({
+		component: "ContextMenuSubTrigger",
+		element: () => b,
+		disabled: y,
+		label: () => _.label,
+		hasPopup: () => !0,
+		openPopup: (e, t) => l.openSubmenu(e, t)
+	});
+	p(() => {
+		l.setItemId(x.id), f(() => l.setItemId(void 0));
+	});
+	let S = !1;
+	d(() => {
+		let e = l.parentPopup.openPopupState();
+		if (e?.id === x.id) {
+			S = !0;
+			return;
+		}
+		if (S && l.open()) {
+			S = !1, l.setOpen(!1, e ? "sibling-open" : "list-navigation");
+			return;
+		}
+		l.open() || (S = !1);
+	});
+	let C, w = () => {
+		C !== void 0 && (window.clearTimeout(C), C = void 0);
+	};
+	f(w), d(() => {
+		l.open() && w();
+	});
+	let T = () => {
+		x.highlight(), l.cancelClose(), !y() && (_.openOnHover === !1 || l.open() || (w(), C = window.setTimeout(() => {
+			C = void 0, l.openSubmenu("trigger-hover");
+		}, _.delay ?? 100)));
+	}, E = () => {
+		w(), l.open() && l.scheduleClose(_.closeDelay ?? 0);
+	}, D = (e) => {
+		y() || (_.onClick?.(e), !e.defaultPrevented && (l.open() ? l.closeSubmenu("trigger-press", e, !1) : l.openSubmenu("trigger-press", e)));
+	};
+	return (() => {
+		var t = g();
+		return t.$$pointermove = () => x.highlight(), t.addEventListener("pointerleave", E), t.addEventListener("pointerenter", T), t.$$click = D, u((e) => {
+			b = e, l.setTrigger(e), f(() => l.setTrigger(void 0));
+		}, t), c(t, s({
+			get id() {
+				return x.id;
+			},
+			get "aria-expanded"() {
+				return l.open() ? "true" : "false";
+			},
+			get "data-inset"() {
+				return _.inset ? "" : void 0;
+			},
+			get "data-open"() {
+				return l.open() ? "" : void 0;
+			},
+			get "data-highlighted"() {
+				return x.isActive() ? "" : void 0;
+			},
+			get "data-disabled"() {
+				return y() ? "" : void 0;
+			},
+			get "aria-disabled"() {
+				return y() ? "true" : void 0;
+			},
+			get class() {
+				return e(r, _.class);
+			}
+		}, v), !1, !0), o(t, () => _.children, null), o(t, i(h, { class: "ml-auto" }), null), t;
+	})();
+}
+a(["click", "pointermove"]);
+//#endregion
+export { _ as ContextMenuSubTrigger };
+
+//# sourceMappingURL=ContextMenuSubTrigger.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ContextMenuSubTrigger.js","names":["createEffect","onCleanup","onMount","splitProps","ChevronRight","clsx","useContextMenuSubmenu","useContextMenuEntry","contextMenuSubTriggerClass","ContextMenuSubTriggerProps","ContextMenuSubTrigger","props","submenu","local","rest","disabled","element","HTMLDivElement","entry","component","label","hasPopup","openPopup","reason","event","openSubmenu","setItemId","id","undefined","openedViaParent","state","parentPopup","openPopupState","open","setOpen","openTimer","clearOpenTimer","window","clearTimeout","handlePointerEnter","highlight","cancelClose","openOnHover","setTimeout","delay","handlePointerLeave","scheduleClose","closeDelay","handleClick","e","MouseEvent","onClick","defaultPrevented","closeSubmenu","_el$","_tmpl$","$$pointermove","addEventListener","$$click","_$use","el","setTrigger","_$spread","_$mergeProps","aria-expanded","data-inset","inset","data-open","data-highlighted","isActive","data-disabled","aria-disabled","class","_$insert","children","_$createComponent","_$delegateEvents","_$mergeProps","_$createComponent","_$delegateEvents","_tmpl$","ContextMenuSubTrigger","submenu","useContextMenuSubmenu","local","rest","splitProps","props","disabled","element","entry","useContextMenuEntry","reason","event","onCleanup","openedViaParent","state","openTimer","clearOpenTimer","createEffect","handlePointerEnter","handlePointerLeave","handleClick","_el$","use","el","spread","mergeProps","\"class\"","clsx","contextMenuSubTriggerClass","insert","createComponent","ChevronRight","delegateEvents"],"sources":["../../../../src/components/context-menu/ContextMenuSubTrigger/ContextMenuSubTrigger.tsx"],"sourcesContent":["import { createEffect, onCleanup, onMount, splitProps } from \"solid-js\";\nimport { ChevronRight } from \"lucide-solid\";\nimport { clsx } from \"~/utils\";\nimport { useContextMenuSubmenu } from \"../context-menu.context\";\nimport { useContextMenuEntry } from \"../context-menu.entry\";\nimport { contextMenuSubTriggerClass } from \"../context-menu.styles\";\nimport type { ContextMenuSubTriggerProps } from \"./ContextMenuSubTrigger.types\";\n\n/**\n * 打开子菜单的菜单项。内置一个右向箭头(和 shadcn 一致),\n * 悬停 `delay` 毫秒后打开,点击切换,右方向键由父浮层的键盘处理逻辑打开。\n */\nexport function ContextMenuSubTrigger(props: ContextMenuSubTriggerProps) {\n  const submenu = useContextMenuSubmenu(\"ContextMenuSubTrigger\");\n  const [local, rest] = splitProps(props, [\n    \"class\",\n    \"children\",\n    \"inset\",\n    \"disabled\",\n    \"label\",\n    \"openOnHover\",\n    \"delay\",\n    \"closeDelay\",\n    \"onClick\",\n  ]);\n\n  const disabled = () => !!local.disabled || submenu.disabled();\n\n  let element: HTMLDivElement | undefined;\n\n  const entry = useContextMenuEntry({\n    component: \"ContextMenuSubTrigger\",\n    element: () => element,\n    disabled,\n    label: () => local.label,\n    hasPopup: () => true,\n    openPopup: (reason, event) => submenu.openSubmenu(reason, event),\n  });\n\n  onMount(() => {\n    submenu.setItemId(entry.id);\n    onCleanup(() => submenu.setItemId(undefined));\n  });\n\n  // 父浮层里\"当前打开的子菜单\"一旦不是自己(比如高亮移到了别的项),\n  // 就同步关掉自己,保证同一时间只有一个子菜单。\n  // `openedViaParent` 用来区分\"由本触发器经父浮层打开的\"与\"受控模式直接打开的\",\n  // 后者不会被这里的同步逻辑误关。\n  let openedViaParent = false;\n  createEffect(() => {\n    const state = submenu.parentPopup.openPopupState();\n    if (state?.id === entry.id) {\n      openedViaParent = true;\n      return;\n    }\n    if (openedViaParent && submenu.open()) {\n      openedViaParent = false;\n      submenu.setOpen(false, state ? \"sibling-open\" : \"list-navigation\");\n      return;\n    }\n    if (!submenu.open()) openedViaParent = false;\n  });\n\n  let openTimer: number | undefined;\n  const clearOpenTimer = () => {\n    if (openTimer !== undefined) {\n      window.clearTimeout(openTimer);\n      openTimer = undefined;\n    }\n  };\n  onCleanup(clearOpenTimer);\n\n  // 子菜单一旦（以任何方式）打开就撤销还在等待的悬停定时器，\n  // 否则它会在之后触发 openSubmenu，把刚关掉的子菜单又打开。\n  createEffect(() => {\n    if (submenu.open()) clearOpenTimer();\n  });\n\n  const handlePointerEnter = () => {\n    entry.highlight();\n    submenu.cancelClose();\n    if (disabled()) return;\n    if (local.openOnHover === false || submenu.open()) return;\n    clearOpenTimer();\n    openTimer = window.setTimeout(() => {\n      openTimer = undefined;\n      submenu.openSubmenu(\"trigger-hover\");\n    }, local.delay ?? 100);\n  };\n\n  const handlePointerLeave = () => {\n    clearOpenTimer();\n    if (submenu.open()) submenu.scheduleClose(local.closeDelay ?? 0);\n  };\n\n  const handleClick = (e: MouseEvent) => {\n    if (disabled()) return;\n    local.onClick?.(e);\n    if (e.defaultPrevented) return;\n\n    if (submenu.open()) {\n      submenu.closeSubmenu(\"trigger-press\", e, false);\n    } else {\n      submenu.openSubmenu(\"trigger-press\", e);\n    }\n  };\n\n  return (\n    <div\n      ref={(el) => {\n        element = el;\n        // 子菜单以触发器元素为定位锚点,必须登记到 SubmenuContext,\n        // 否则 SubContent 的 positioner 拿不到 reference,浮层会停在\n        // 未定位状态(opacity:0)或落到错误坐标。\n        submenu.setTrigger(el);\n        onCleanup(() => submenu.setTrigger(undefined));\n      }}\n      id={entry.id}\n      role=\"menuitem\"\n      aria-haspopup=\"menu\"\n      aria-expanded={submenu.open() ? \"true\" : \"false\"}\n      tabIndex={-1}\n      data-slot=\"context-menu-sub-trigger\"\n      data-inset={local.inset ? \"\" : undefined}\n      data-open={submenu.open() ? \"\" : undefined}\n      data-highlighted={entry.isActive() ? \"\" : undefined}\n      data-disabled={disabled() ? \"\" : undefined}\n      aria-disabled={disabled() ? \"true\" : undefined}\n      onClick={handleClick}\n      onPointerEnter={handlePointerEnter}\n      onPointerLeave={handlePointerLeave}\n      onPointerMove={() => entry.highlight()}\n      class={clsx(contextMenuSubTriggerClass, local.class)}\n      {...rest}\n    >\n      {local.children}\n      <ChevronRight class=\"ml-auto\" />\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/components/context-menu/ContextMenuSubTrigger/ContextMenuSubTrigger.types.d.ts

@@ -0,0 +1,21 @@
+import { ParentProps } from 'solid-js';
+import { BaseProps } from '../../../types';
+/**
+ * ContextMenuSubTrigger props,对齐 Base UI `ContextMenu.SubmenuTrigger`。
+ * 渲染一个带右侧箭头图标的菜单项,悬停/点击/右方向键都会打开子菜单。
+ */
+export interface ContextMenuSubTriggerProps extends BaseProps, ParentProps {
+    /** 左侧对齐到带图标项的文字位置 */
+    inset?: boolean;
+    disabled?: boolean;
+    /** 键盘字符导航匹配用的文本 */
+    label?: string;
+    /** 悬停是否打开子菜单,默认 true */
+    openOnHover?: boolean;
+    /** 悬停多久后打开(毫秒),默认 100 */
+    delay?: number;
+    /** 移出多久后关闭(毫秒),默认 0;实现里会保留 100ms 的穿越容忍 */
+    closeDelay?: number;
+    onClick?: (event: MouseEvent) => void;
+    [key: string]: any;
+}

package/dist/components/context-menu/ContextMenuSubTrigger/index.d.ts

@@ -0,0 +1,2 @@
+export { ContextMenuSubTrigger } from './ContextMenuSubTrigger';
+export type { ContextMenuSubTriggerProps } from './ContextMenuSubTrigger.types';

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

@@ -0,0 +1,13 @@
+import { ValidComponent } from 'solid-js';
+import { ContextMenuTriggerProps } from './ContextMenuTrigger.types';
+/**
+ * ContextMenu 的触发区域,默认渲染 `<div>`,支持通过 `component` 多态渲染成
+ * 任意标签或组件(与 TooltipTrigger 一致)。通过以下方式打开菜单:
+ * - 右键(contextmenu 事件),锚定到鼠标坐标
+ * - 触摸/手写笔长按 500ms,锚定到按下坐标
+ * - 键盘 Shift+F10 或菜单键,锚定到触发器中心
+ *
+ * 事件逻辑在 `useContextMenuTrigger` 里用 `addEventListener` 绑定,因此调用方
+ * 自己传入的 `onClick` / `onContextMenu` 不会被覆盖。
+ */
+export declare const ContextMenuTrigger: <T extends ValidComponent = "div">(props: ContextMenuTriggerProps<T>) => import('solid-js').JSX.Element;

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

@@ -0,0 +1,34 @@
+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";
+//#region src/components/context-menu/ContextMenuTrigger/ContextMenuTrigger.tsx
+var o = (o) => {
+	let { ctx: s, attachListeners: c } = n();
+	return i(r, a(o, {
+		get component() {
+			return o.component ?? "div";
+		},
+		ref(e) {
+			var n = t((e) => s.setTrigger(e), o.ref, c);
+			typeof n == "function" && n(e);
+		},
+		"data-slot": "context-menu-trigger",
+		get "data-popup-open"() {
+			return s.open() ? "" : void 0;
+		},
+		get "data-pressed"() {
+			return s.open() ? "" : void 0;
+		},
+		get tabIndex() {
+			return o.tabIndex ?? 0;
+		},
+		get class() {
+			return e("select-none", o.class);
+		}
+	}));
+};
+//#endregion
+export { o as ContextMenuTrigger };
+
+//# sourceMappingURL=ContextMenuTrigger.js.map

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

@@ -0,0 +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"}

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

@@ -0,0 +1,15 @@
+import { ValidComponent } from 'solid-js';
+import { PolymorphicProps } from '../../../types';
+/**
+ * ContextMenuTrigger props,对齐 Base UI `ContextMenu.Trigger`。
+ * 与 TooltipTrigger / Button 一致支持多态渲染:通过 `component` 指定真实标签或
+ * 组件,默认渲染 `<div>`(与 shadcn 的用法一致)。
+ *
+ * @example
+ * ```tsx
+ * <ContextMenuTrigger>右键区域</ContextMenuTrigger>
+ * <ContextMenuTrigger component="button">按钮触发器</ContextMenuTrigger>
+ * <ContextMenuTrigger component={A} href="/docs">链接触发器</ContextMenuTrigger>
+ * ```
+ */
+export type ContextMenuTriggerProps<T extends ValidComponent = "div"> = PolymorphicProps<T>;

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

@@ -0,0 +1,4 @@
+export { ContextMenuTrigger } from './ContextMenuTrigger';
+export type { ContextMenuTriggerProps } from './ContextMenuTrigger.types';
+export { useContextMenuTrigger } from './useContextMenuTrigger';
+export type { UseContextMenuTriggerResult } from './useContextMenuTrigger';

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

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

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

@@ -0,0 +1,47 @@
+import { useContextMenuContext as e } from "../ContextMenu/ContextMenu.context.js";
+import { onCleanup as t } from "solid-js";
+//#region src/components/context-menu/ContextMenuTrigger/useContextMenuTrigger.ts
+var n = 500, r = 10;
+function i() {
+	let i = e("ContextMenuTrigger");
+	return {
+		ctx: i,
+		attachListeners: (e) => {
+			let a, o, s = () => {
+				a !== void 0 && (window.clearTimeout(a), a = void 0);
+			}, c = (t) => {
+				if (i.disabled()) return;
+				let n = t;
+				n.preventDefault(), i.openAt(n.clientX, n.clientY, e, n, "trigger-press");
+			}, l = (t) => {
+				let r = t;
+				r.pointerType === "mouse" || i.disabled() || (o = {
+					x: r.clientX,
+					y: r.clientY
+				}, s(), a = window.setTimeout(() => {
+					a = void 0, i.openAt(r.clientX, r.clientY, e, r, "trigger-press");
+				}, n));
+			}, u = (e) => {
+				if (!o || a === void 0) return;
+				let t = e, n = t.clientX - o.x, i = t.clientY - o.y;
+				Math.hypot(n, i) > r && s();
+			}, d = () => {
+				o = void 0, s();
+			}, f = (t) => {
+				if (i.disabled()) return;
+				let n = t;
+				if (!(n.key === "ContextMenu" || n.shiftKey && n.key === "F10")) return;
+				n.preventDefault();
+				let r = e.getBoundingClientRect();
+				i.openAt(r.left + r.width / 2, r.top + r.height / 2, e, n, "trigger-press");
+			};
+			e.addEventListener("contextmenu", c), e.addEventListener("pointerdown", l), e.addEventListener("pointermove", u), e.addEventListener("pointerup", d), e.addEventListener("pointercancel", d), e.addEventListener("keydown", f), t(() => {
+				s(), e.removeEventListener("contextmenu", c), e.removeEventListener("pointerdown", l), e.removeEventListener("pointermove", u), e.removeEventListener("pointerup", d), e.removeEventListener("pointercancel", d), e.removeEventListener("keydown", f);
+			});
+		}
+	};
+}
+//#endregion
+export { i as useContextMenuTrigger };
+
+//# sourceMappingURL=useContextMenuTrigger.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"useContextMenuTrigger.js","names":["LONG_PRESS_DELAY","LONG_PRESS_MOVE_TOLERANCE","useContextMenuTrigger","ctx","useContextMenuContext","longPressTimer","pressOrigin","clearLongPress","onContextMenu","e","event","el","onPointerDown","onPointerMove","dx","dy","onPointerEnd","onKeyDown","rect","onCleanup"],"sources":["../../../../src/components/context-menu/ContextMenuTrigger/useContextMenuTrigger.ts"],"sourcesContent":["import { onCleanup } from \"solid-js\";\nimport { useContextMenuContext } from \"../ContextMenu/ContextMenu.context\";\n\n/** 触摸长按唤起菜单的时间阈值(毫秒),与 Base UI 保持一致 */\nconst LONG_PRESS_DELAY = 500;\n/** 长按期间允许的手指抖动距离(像素),超过即取消 */\nconst LONG_PRESS_MOVE_TOLERANCE = 10;\n\nexport interface UseContextMenuTriggerResult {\n  ctx: ReturnType<typeof useContextMenuContext>;\n  /**\n   * 把右键 / 长按 / 键盘唤起菜单的原生事件绑定到真正的 DOM 元素上(通过 ref 调用)。\n   * 用 addEventListener 而不是 JSX 的 onXxx prop,是为了不占用这些 prop 名——\n   * 调用方可以在触发器上自由传自己的 `onClick` / `onContextMenu`,两者互不覆盖。\n   * 这与 TooltipTrigger 是同一套约定。\n   */\n  attachListeners: (el: Element) => void;\n}\n\n/**\n * 封装 ContextMenuTrigger 需要绑定的所有事件逻辑:\n * - contextmenu(右键):锚定到鼠标坐标\n * - pointerdown(触摸/手写笔)后持续 500ms 视为长按,锚定到按下坐标;抖动超过\n *   阈值、抬起或取消都会撤销\n * - keydown(Shift+F10 / 菜单键):锚定到触发器中心,满足键盘可达性\n *\n * 事件直接绑在 `el` 上,不依赖具体标签类型,因此触发器可以多态渲染成\n * div / button / 任意组件。回调参数统一声明为 `Event` 再在内部收窄,\n * 这是为了兼容 `Element.addEventListener` 的重载(与 TooltipTrigger 一致)。\n */\nexport function useContextMenuTrigger(): UseContextMenuTriggerResult {\n  const ctx = useContextMenuContext(\"ContextMenuTrigger\");\n\n  const attachListeners = (el: Element) => {\n    let longPressTimer: number | undefined;\n    let pressOrigin: { x: number; y: number } | undefined;\n\n    const clearLongPress = () => {\n      if (longPressTimer !== undefined) {\n        window.clearTimeout(longPressTimer);\n        longPressTimer = undefined;\n      }\n    };\n\n    const onContextMenu = (event: Event) => {\n      if (ctx.disabled()) return;\n      const e = event as MouseEvent;\n      e.preventDefault();\n      ctx.openAt(e.clientX, e.clientY, el, e, \"trigger-press\");\n    };\n\n    const onPointerDown = (event: Event) => {\n      const e = event as PointerEvent;\n      // 鼠标右键由 contextmenu 处理,这里只负责触摸/手写笔长按\n      if (e.pointerType === \"mouse\" || ctx.disabled()) return;\n      pressOrigin = { x: e.clientX, y: e.clientY };\n      clearLongPress();\n      longPressTimer = window.setTimeout(() => {\n        longPressTimer = undefined;\n        ctx.openAt(e.clientX, e.clientY, el, e, \"trigger-press\");\n      }, LONG_PRESS_DELAY);\n    };\n\n    const onPointerMove = (event: Event) => {\n      if (!pressOrigin || longPressTimer === undefined) return;\n      const e = event as PointerEvent;\n      const dx = e.clientX - pressOrigin.x;\n      const dy = e.clientY - pressOrigin.y;\n      if (Math.hypot(dx, dy) > LONG_PRESS_MOVE_TOLERANCE) clearLongPress();\n    };\n\n    const onPointerEnd = () => {\n      pressOrigin = undefined;\n      clearLongPress();\n    };\n\n    const onKeyDown = (event: Event) => {\n      if (ctx.disabled()) return;\n      const e = event as KeyboardEvent;\n      const isMenuKey =\n        e.key === \"ContextMenu\" || (e.shiftKey && e.key === \"F10\");\n      if (!isMenuKey) return;\n      e.preventDefault();\n      const rect = el.getBoundingClientRect();\n      ctx.openAt(\n        rect.left + rect.width / 2,\n        rect.top + rect.height / 2,\n        el,\n        e,\n        \"trigger-press\",\n      );\n    };\n\n    el.addEventListener(\"contextmenu\", onContextMenu);\n    el.addEventListener(\"pointerdown\", onPointerDown);\n    el.addEventListener(\"pointermove\", onPointerMove);\n    el.addEventListener(\"pointerup\", onPointerEnd);\n    el.addEventListener(\"pointercancel\", onPointerEnd);\n    el.addEventListener(\"keydown\", onKeyDown);\n\n    onCleanup(() => {\n      clearLongPress();\n      el.removeEventListener(\"contextmenu\", onContextMenu);\n      el.removeEventListener(\"pointerdown\", onPointerDown);\n      el.removeEventListener(\"pointermove\", onPointerMove);\n      el.removeEventListener(\"pointerup\", onPointerEnd);\n      el.removeEventListener(\"pointercancel\", onPointerEnd);\n      el.removeEventListener(\"keydown\", onKeyDown);\n    });\n  };\n\n  return { ctx, attachListeners };\n}\n"],"mappings":";;;AAIA,IAAMA,IAAmB,KAEnBC,IAA4B;AAwBlC,SAAgBC,IAAqD;CACnE,IAAMC,IAAMC,EAAsB,oBAAoB;CAgFtD,OAAO;EAAE;EAAK,kBA9EW,MAAgB;GACvC,IAAIC,GACAC,GAEEC,UAAuB;IAC3B,AAAIF,MAAmB,KAAA,MACrB,OAAO,aAAaA,CAAc,GAClC,IAAiB,KAAA;GAErB,GAEMG,KAAiB,MAAiB;IACtC,IAAIL,EAAI,SAAS,GAAG;IACpB,IAAMM,IAAIC;IAEV,AADAD,EAAE,eAAe,GACjBN,EAAI,OAAOM,EAAE,SAASA,EAAE,SAASE,GAAIF,GAAG,eAAe;GACzD,GAEMG,KAAiB,MAAiB;IACtC,IAAMH,IAAIC;IAEV,AAAID,EAAE,gBAAgB,WAAWN,EAAI,SAAS,MAC9C,IAAc;KAAE,GAAGM,EAAE;KAAS,GAAGA,EAAE;IAAQ,GAC3CF,EAAe,GACf,IAAiB,OAAO,iBAAiB;KAEvC,AADA,IAAiB,KAAA,GACjBJ,EAAI,OAAOM,EAAE,SAASA,EAAE,SAASE,GAAIF,GAAG,eAAe;IACzD,GAAGT,CAAgB;GACrB,GAEMa,KAAiB,MAAiB;IACtC,IAAI,CAACP,KAAeD,MAAmB,KAAA,GAAW;IAClD,IAAMI,IAAIC,GACJI,IAAKL,EAAE,UAAUH,EAAY,GAC7BS,IAAKN,EAAE,UAAUH,EAAY;IACnC,AAAI,KAAK,MAAMQ,GAAIC,CAAE,IAAId,KAA2BM,EAAe;GACrE,GAEMS,UAAqB;IAEzB,AADA,IAAc,KAAA,GACdT,EAAe;GACjB,GAEMU,KAAa,MAAiB;IAClC,IAAId,EAAI,SAAS,GAAG;IACpB,IAAMM,IAAIC;IAGV,IAAI,EADFD,EAAE,QAAQ,iBAAkBA,EAAE,YAAYA,EAAE,QAAQ,QACtC;IAChB,EAAE,eAAe;IACjB,IAAMS,IAAOP,EAAG,sBAAsB;IACtC,EAAI,OACFO,EAAK,OAAOA,EAAK,QAAQ,GACzBA,EAAK,MAAMA,EAAK,SAAS,GACzBP,GACAF,GACA,eACF;GACF;GASA,AAPAE,EAAG,iBAAiB,eAAeH,CAAa,GAChDG,EAAG,iBAAiB,eAAeC,CAAa,GAChDD,EAAG,iBAAiB,eAAeE,CAAa,GAChDF,EAAG,iBAAiB,aAAaK,CAAY,GAC7CL,EAAG,iBAAiB,iBAAiBK,CAAY,GACjDL,EAAG,iBAAiB,WAAWM,CAAS,GAExCE,QAAgB;IAOd,AANAZ,EAAe,GACfI,EAAG,oBAAoB,eAAeH,CAAa,GACnDG,EAAG,oBAAoB,eAAeC,CAAa,GACnDD,EAAG,oBAAoB,eAAeE,CAAa,GACnDF,EAAG,oBAAoB,aAAaK,CAAY,GAChDL,EAAG,oBAAoB,iBAAiBK,CAAY,GACpDL,EAAG,oBAAoB,WAAWM,CAAS;GAC7C,CAAC;EACH;CAE8B;AAChC"}

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

@@ -0,0 +1,14 @@
+import { ContextMenuGroupContextValue, ContextMenuPopupContextValue, ContextMenuRadioGroupContextValue, ContextMenuSubmenuContextValue } from './context-menu.types';
+/**
+ * 内部运行时 context。与 `ContextMenu/ContextMenu.context.ts`(根状态)分开:
+ * 根 context 由公开的 `<ContextMenu>` 提供,这里几个由各个浮层/分组组件提供,
+ * 属于实现细节,不对外导出。
+ */
+export declare const ContextMenuPopupContext: import('solid-js').Context<ContextMenuPopupContextValue | undefined>;
+export declare function useContextMenuPopup(component: string): ContextMenuPopupContextValue;
+export declare const ContextMenuSubmenuContext: import('solid-js').Context<ContextMenuSubmenuContextValue | undefined>;
+export declare function useContextMenuSubmenu(component: string): ContextMenuSubmenuContextValue;
+export declare const ContextMenuRadioGroupContext: import('solid-js').Context<ContextMenuRadioGroupContextValue | undefined>;
+export declare function useContextMenuRadioGroup(component: string): ContextMenuRadioGroupContextValue;
+export declare const ContextMenuGroupContext: import('solid-js').Context<ContextMenuGroupContextValue | undefined>;
+export declare function useContextMenuGroup(component: string): ContextMenuGroupContextValue;

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

@@ -0,0 +1,25 @@
+import { createContext as e, useContext as t } from "solid-js";
+//#region src/components/context-menu/context-menu.context.ts
+var n = e();
+function r(e) {
+	let r = t(n);
+	if (!r) throw Error(`<${e}> 必须渲染在 <ContextMenuContent> 内部`);
+	return r;
+}
+var i = e();
+function a(e) {
+	let n = t(i);
+	if (!n) throw Error(`<${e}> 必须渲染在 <ContextMenuSub> 内部`);
+	return n;
+}
+var o = e();
+function s(e) {
+	let n = t(o);
+	if (!n) throw Error(`<${e}> 必须渲染在 <ContextMenuRadioGroup> 内部`);
+	return n;
+}
+var c = e();
+//#endregion
+export { c as ContextMenuGroupContext, n as ContextMenuPopupContext, o as ContextMenuRadioGroupContext, i as ContextMenuSubmenuContext, r as useContextMenuPopup, s as useContextMenuRadioGroup, a as useContextMenuSubmenu };
+
+//# sourceMappingURL=context-menu.context.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"context-menu.context.js","names":["ContextMenuPopupContext","createContext","useContextMenuPopup","ctx","useContext","component","ContextMenuSubmenuContext","useContextMenuSubmenu","ContextMenuRadioGroupContext","useContextMenuRadioGroup","ContextMenuGroupContext"],"sources":["../../../src/components/context-menu/context-menu.context.ts"],"sourcesContent":["import { createContext, useContext } from \"solid-js\";\nimport type {\n  ContextMenuGroupContextValue,\n  ContextMenuPopupContextValue,\n  ContextMenuRadioGroupContextValue,\n  ContextMenuSubmenuContextValue,\n} from \"./context-menu.types\";\n\n/**\n * 内部运行时 context。与 `ContextMenu/ContextMenu.context.ts`(根状态)分开:\n * 根 context 由公开的 `<ContextMenu>` 提供,这里几个由各个浮层/分组组件提供,\n * 属于实现细节,不对外导出。\n */\n\nexport const ContextMenuPopupContext =\n  createContext<ContextMenuPopupContextValue>();\n\nexport function useContextMenuPopup(\n  component: string,\n): ContextMenuPopupContextValue {\n  const ctx = useContext(ContextMenuPopupContext);\n  if (!ctx) {\n    throw new Error(`<${component}> 必须渲染在 <ContextMenuContent> 内部`);\n  }\n  return ctx;\n}\n\nexport const ContextMenuSubmenuContext =\n  createContext<ContextMenuSubmenuContextValue>();\n\nexport function useContextMenuSubmenu(\n  component: string,\n): ContextMenuSubmenuContextValue {\n  const ctx = useContext(ContextMenuSubmenuContext);\n  if (!ctx) {\n    throw new Error(`<${component}> 必须渲染在 <ContextMenuSub> 内部`);\n  }\n  return ctx;\n}\n\nexport const ContextMenuRadioGroupContext =\n  createContext<ContextMenuRadioGroupContextValue>();\n\nexport function useContextMenuRadioGroup(\n  component: string,\n): ContextMenuRadioGroupContextValue {\n  const ctx = useContext(ContextMenuRadioGroupContext);\n  if (!ctx) {\n    throw new Error(`<${component}> 必须渲染在 <ContextMenuRadioGroup> 内部`);\n  }\n  return ctx;\n}\n\nexport const ContextMenuGroupContext =\n  createContext<ContextMenuGroupContextValue>();\n\nexport function useContextMenuGroup(\n  component: string,\n): ContextMenuGroupContextValue {\n  const ctx = useContext(ContextMenuGroupContext);\n  if (!ctx) {\n    throw new Error(`<${component}> 必须渲染在 <ContextMenuGroup> 内部`);\n  }\n  return ctx;\n}\n"],"mappings":";;AAcA,IAAaA,IACXC,EAA4C;AAE9C,SAAgBC,EACd,GAC8B;CAC9B,IAAMC,IAAMC,EAAWJ,CAAuB;CAC9C,IAAI,CAACG,GACH,MAAU,MAAM,IAAIE,EAAU,gCAAgC;CAEhE,OAAOF;AACT;AAEA,IAAaG,IACXL,EAA8C;AAEhD,SAAgBM,EACd,GACgC;CAChC,IAAMJ,IAAMC,EAAWE,CAAyB;CAChD,IAAI,CAACH,GACH,MAAU,MAAM,IAAIE,EAAU,4BAA4B;CAE5D,OAAOF;AACT;AAEA,IAAaK,IACXP,EAAiD;AAEnD,SAAgBQ,EACd,GACmC;CACnC,IAAMN,IAAMC,EAAWI,CAA4B;CACnD,IAAI,CAACL,GACH,MAAU,MAAM,IAAIE,EAAU,mCAAmC;CAEnE,OAAOF;AACT;AAEA,IAAaO,IACXT,EAA4C"}

package/dist/components/context-menu/context-menu.entry.d.ts

@@ -0,0 +1,28 @@
+import { ContextMenuChangeEventReason, ContextMenuPopupContextValue } from './context-menu.types';
+export interface UseContextMenuEntryOptions {
+    /** 用于报错信息里指明是哪个组件 */
+    component: string;
+    /** 菜单项的真实 DOM 元素 */
+    element: () => HTMLElement | undefined;
+    disabled: () => boolean;
+    /** 键盘字符导航用的文本;缺省时回退到元素的 textContent */
+    label: () => string | undefined;
+    hasPopup?: () => boolean;
+    /** 键盘 Enter/Space 激活:默认触发一次 click,复用同一条 onClick 逻辑 */
+    activate?: () => void;
+    openPopup?: (reason: ContextMenuChangeEventReason, event?: Event) => void;
+}
+export interface UseContextMenuEntryResult {
+    popup: ContextMenuPopupContextValue;
+    /** 稳定的 DOM id,直接用于 id / aria-activedescendant */
+    id: string;
+    isActive: () => boolean;
+    /** 鼠标进入时高亮(受 highlightItemOnHover 控制) */
+    highlight: () => void;
+}
+/**
+ * 菜单项(Item / CheckboxItem / RadioItem / SubmenuTrigger)共用的注册与高亮逻辑。
+ * 每个项在挂载时把自己登记到所属浮层,卸载时注销,键盘导航与 typeahead 都基于
+ * 这份注册表。
+ */
+export declare function useContextMenuEntry(options: UseContextMenuEntryOptions): UseContextMenuEntryResult;

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

@@ -0,0 +1,31 @@
+import { useContextMenuPopup as e } from "./context-menu.context.js";
+import { createUniqueId as t, onCleanup as n, onMount as r } from "solid-js";
+//#region src/components/context-menu/context-menu.entry.ts
+function i(i) {
+	let a = e(i.component), o = `context-menu-item-${t()}`;
+	return r(() => {
+		let e = i.element();
+		if (!e) return;
+		let t = {
+			id: o,
+			element: e,
+			disabled: i.disabled,
+			label: () => i.label() ?? e.textContent?.trim() ?? "",
+			hasPopup: i.hasPopup ?? (() => !1),
+			activate: i.activate ?? (() => e.click()),
+			openPopup: i.openPopup
+		}, r = a.registerItem(t);
+		n(r);
+	}), {
+		popup: a,
+		id: o,
+		isActive: () => a.activeId() === o,
+		highlight: () => {
+			a.highlightItemOnHover() && !i.disabled() && a.highlight(o);
+		}
+	};
+}
+//#endregion
+export { i as useContextMenuEntry };
+
+//# sourceMappingURL=context-menu.entry.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"context-menu.entry.js","names":["useContextMenuEntry","popup","useContextMenuPopup","options","id","createUniqueId","onMount","element","entry","unregister"],"sources":["../../../src/components/context-menu/context-menu.entry.ts"],"sourcesContent":["import { createUniqueId, onCleanup, onMount } from \"solid-js\";\nimport { useContextMenuPopup } from \"./context-menu.context\";\nimport type {\n  ContextMenuChangeEventReason,\n  ContextMenuItemEntry,\n  ContextMenuPopupContextValue,\n} from \"./context-menu.types\";\n\nexport interface UseContextMenuEntryOptions {\n  /** 用于报错信息里指明是哪个组件 */\n  component: string;\n  /** 菜单项的真实 DOM 元素 */\n  element: () => HTMLElement | undefined;\n  disabled: () => boolean;\n  /** 键盘字符导航用的文本;缺省时回退到元素的 textContent */\n  label: () => string | undefined;\n  hasPopup?: () => boolean;\n  /** 键盘 Enter/Space 激活:默认触发一次 click,复用同一条 onClick 逻辑 */\n  activate?: () => void;\n  openPopup?: (reason: ContextMenuChangeEventReason, event?: Event) => void;\n}\n\nexport interface UseContextMenuEntryResult {\n  popup: ContextMenuPopupContextValue;\n  /** 稳定的 DOM id,直接用于 id / aria-activedescendant */\n  id: string;\n  isActive: () => boolean;\n  /** 鼠标进入时高亮(受 highlightItemOnHover 控制) */\n  highlight: () => void;\n}\n\n/**\n * 菜单项(Item / CheckboxItem / RadioItem / SubmenuTrigger)共用的注册与高亮逻辑。\n * 每个项在挂载时把自己登记到所属浮层,卸载时注销,键盘导航与 typeahead 都基于\n * 这份注册表。\n */\nexport function useContextMenuEntry(\n  options: UseContextMenuEntryOptions,\n): UseContextMenuEntryResult {\n  const popup = useContextMenuPopup(options.component);\n  const id = `context-menu-item-${createUniqueId()}`;\n\n  onMount(() => {\n    const element = options.element();\n    if (!element) return;\n\n    const entry: ContextMenuItemEntry = {\n      id,\n      element,\n      disabled: options.disabled,\n      label: () => options.label() ?? element.textContent?.trim() ?? \"\",\n      hasPopup: options.hasPopup ?? (() => false),\n      activate: options.activate ?? (() => element.click()),\n      openPopup: options.openPopup,\n    };\n\n    const unregister = popup.registerItem(entry);\n    onCleanup(unregister);\n  });\n\n  return {\n    popup,\n    id,\n    isActive: () => popup.activeId() === id,\n    highlight: () => {\n      if (!popup.highlightItemOnHover() || options.disabled()) return;\n      popup.highlight(id);\n    },\n  };\n}\n"],"mappings":";;;AAoCA,SAAgBA,EACd,GAC2B;CAC3B,IAAMC,IAAQC,EAAoBC,EAAQ,SAAS,GAC7CC,IAAK,qBAAqBC,EAAe;CAoB/C,OAlBAC,QAAc;EACZ,IAAMC,IAAUJ,EAAQ,QAAQ;EAChC,IAAI,CAACI,GAAS;EAEd,IAAMC,IAA8B;GAClC;GACA;GACA,UAAUL,EAAQ;GAClB,aAAaA,EAAQ,MAAM,KAAKI,EAAQ,aAAa,KAAK,KAAK;GAC/D,UAAUJ,EAAQ,mBAAmB;GACrC,UAAUA,EAAQ,mBAAmBI,EAAQ,MAAM;GACnD,WAAWJ,EAAQ;EACrB,GAEMM,IAAaR,EAAM,aAAaO,CAAK;EAC3C,EAAUC,CAAU;CACtB,CAAC,GAEM;EACL;EACA;EACA,gBAAgBR,EAAM,SAAS,MAAMG;EACrC,iBAAiB;GACf,AAAKH,EAAM,qBAAqB,KAAK,GAAQ,SAAS,KACtDA,EAAM,UAAUG,CAAE;EACpB;CACF;AACF"}

package/dist/components/context-menu/context-menu.styles.d.ts

@@ -0,0 +1,18 @@
+/**
+ * 各子组件的类名常量。直接对齐 shadcn base 版 `context-menu.tsx`,
+ * 唯一的系统性改动是把 `focus:` 系列变体换成 `data-highlighted:`
+ * ——本实现的焦点始终在 popup 上,高亮项通过 `aria-activedescendant` +
+ * `data-highlighted` 表达,而不是真实聚焦到每一项。
+ */
+/** 普通菜单项 */
+export declare const contextMenuItemClass = "group/context-menu-item relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-inset:pl-8 data-[variant=destructive]:text-destructive data-[variant=destructive]:data-highlighted:bg-destructive/10 data-[variant=destructive]:data-highlighted:text-destructive dark:data-[variant=destructive]:data-highlighted:bg-destructive/20 data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 data-highlighted:bg-accent data-highlighted:text-accent-foreground data-highlighted:*:[svg]:text-accent-foreground data-[variant=destructive]:*:[svg]:text-destructive";
+/** 子菜单触发器(带一个自带的 ChevronRight 图标) */
+export declare const contextMenuSubTriggerClass = "flex cursor-default items-center rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-inset:pl-8 data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-accent data-highlighted:text-accent-foreground data-open:bg-accent data-open:text-accent-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4";
+/** 可勾选项(CheckboxItem / RadioItem 共用),右侧预留指示器位置 */
+export declare const contextMenuCheckableItemClass = "relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-8 pl-2 text-sm outline-hidden select-none data-inset:pl-8 data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 data-highlighted:bg-accent data-highlighted:text-accent-foreground";
+/** GroupLabel */
+export declare const contextMenuLabelClass = "px-2 py-1.5 text-xs font-medium text-muted-foreground data-inset:pl-8";
+/** 快捷键提示 */
+export declare const contextMenuShortcutClass = "ml-auto text-xs tracking-widest text-muted-foreground group-data-[highlighted]/context-menu-item:text-accent-foreground";
+/** 勾选/单选指示器的定位容器 */
+export declare const contextMenuIndicatorClass = "pointer-events-none absolute right-2 flex items-center justify-center";

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

@@ -0,0 +1,6 @@
+//#region src/components/context-menu/context-menu.styles.ts
+var e = "group/context-menu-item relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-inset:pl-8 data-[variant=destructive]:text-destructive data-[variant=destructive]:data-highlighted:bg-destructive/10 data-[variant=destructive]:data-highlighted:text-destructive dark:data-[variant=destructive]:data-highlighted:bg-destructive/20 data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 data-highlighted:bg-accent data-highlighted:text-accent-foreground data-highlighted:*:[svg]:text-accent-foreground data-[variant=destructive]:*:[svg]:text-destructive", t = "flex cursor-default items-center rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-inset:pl-8 data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-accent data-highlighted:text-accent-foreground data-open:bg-accent data-open:text-accent-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", n = "relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-8 pl-2 text-sm outline-hidden select-none data-inset:pl-8 data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 data-highlighted:bg-accent data-highlighted:text-accent-foreground", r = "px-2 py-1.5 text-xs font-medium text-muted-foreground data-inset:pl-8", i = "ml-auto text-xs tracking-widest text-muted-foreground group-data-[highlighted]/context-menu-item:text-accent-foreground", a = "pointer-events-none absolute right-2 flex items-center justify-center";
+//#endregion
+export { n as contextMenuCheckableItemClass, a as contextMenuIndicatorClass, e as contextMenuItemClass, r as contextMenuLabelClass, i as contextMenuShortcutClass, t as contextMenuSubTriggerClass };
+
+//# sourceMappingURL=context-menu.styles.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"context-menu.styles.js","names":["contextMenuItemClass","contextMenuSubTriggerClass","contextMenuCheckableItemClass","contextMenuLabelClass","contextMenuShortcutClass","contextMenuIndicatorClass"],"sources":["../../../src/components/context-menu/context-menu.styles.ts"],"sourcesContent":["/**\n * 各子组件的类名常量。直接对齐 shadcn base 版 `context-menu.tsx`,\n * 唯一的系统性改动是把 `focus:` 系列变体换成 `data-highlighted:`\n * ——本实现的焦点始终在 popup 上,高亮项通过 `aria-activedescendant` +\n * `data-highlighted` 表达,而不是真实聚焦到每一项。\n */\n\n/** 普通菜单项 */\nexport const contextMenuItemClass =\n  \"group/context-menu-item relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-inset:pl-8 data-[variant=destructive]:text-destructive data-[variant=destructive]:data-highlighted:bg-destructive/10 data-[variant=destructive]:data-highlighted:text-destructive dark:data-[variant=destructive]:data-highlighted:bg-destructive/20 data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 data-highlighted:bg-accent data-highlighted:text-accent-foreground data-highlighted:*:[svg]:text-accent-foreground data-[variant=destructive]:*:[svg]:text-destructive\";\n\n/** 子菜单触发器(带一个自带的 ChevronRight 图标) */\nexport const contextMenuSubTriggerClass =\n  \"flex cursor-default items-center rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-inset:pl-8 data-disabled:pointer-events-none data-disabled:opacity-50 data-highlighted:bg-accent data-highlighted:text-accent-foreground data-open:bg-accent data-open:text-accent-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\";\n\n/** 可勾选项(CheckboxItem / RadioItem 共用),右侧预留指示器位置 */\nexport const contextMenuCheckableItemClass =\n  \"relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-8 pl-2 text-sm outline-hidden select-none data-inset:pl-8 data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 data-highlighted:bg-accent data-highlighted:text-accent-foreground\";\n\n/** GroupLabel */\nexport const contextMenuLabelClass =\n  \"px-2 py-1.5 text-xs font-medium text-muted-foreground data-inset:pl-8\";\n\n/** 快捷键提示 */\nexport const contextMenuShortcutClass =\n  \"ml-auto text-xs tracking-widest text-muted-foreground group-data-[highlighted]/context-menu-item:text-accent-foreground\";\n\n/** 勾选/单选指示器的定位容器 */\nexport const contextMenuIndicatorClass =\n  \"pointer-events-none absolute right-2 flex items-center justify-center\";\n"],"mappings":";AAQA,IAAaA,IACX,mrBAGWC,IACX,mXAGWC,IACX,kVAGWC,IACX,yEAGWC,IACX,2HAGWC,IACX"}

package/dist/components/context-menu/context-menu.types.d.ts

@@ -0,0 +1,151 @@
+import { Accessor } from 'solid-js';
+import { ReferenceElement, VirtualElement } from '../../lib';
+/**
+ * Base UI 的 `Side`,额外支持逻辑方向 `inline-start` / `inline-end`。
+ * 逻辑方向会按 `dir` 解析成 left / right(RTL 下相反)。
+ */
+export type ContextMenuSide = "top" | "right" | "bottom" | "left" | "inline-start" | "inline-end";
+/** Base UI 的 `Align` */
+export type ContextMenuAlign = "start" | "center" | "end";
+/** Base UI 菜单的排列方向,决定方向键映射(默认 vertical) */
+export type ContextMenuOrientation = "vertical" | "horizontal";
+/**
+ * 对齐 Base UI 的 `ContextMenu.Root.ChangeEventReason`。
+ * 本实现会尽力给出语义正确的原因,部分原因(如 `trigger-hover`)只在子菜单里出现。
+ */
+export type ContextMenuChangeEventReason = "trigger-hover" | "trigger-focus" | "trigger-press" | "outside-press" | "focus-out" | "list-navigation" | "escape-key" | "item-press" | "close-press" | "sibling-open" | "cancel-open" | "imperative-action" | "none";
+/**
+ * 对齐 Base UI 的 `ChangeEventDetails`。`cancel()` / `allowPropagation()` 用于在
+ * 回调里干预组件的默认行为;Solid 下事件已派发,`allowPropagation` 只作为 API
+ * 对齐保留(本实现不主动阻止事件传播)。
+ */
+export interface ContextMenuChangeEventDetails<R extends string = ContextMenuChangeEventReason> {
+    reason: R;
+    event: Event | undefined;
+    trigger: Element | undefined;
+    /** 阻止组件处理本次变更(例如受控模式下不关闭) */
+    cancel: () => void;
+    /** API 对齐保留:允许事件继续传播 */
+    allowPropagation: () => void;
+    readonly isCanceled: boolean;
+    readonly isPropagationAllowed: boolean;
+}
+/** 一个已挂载菜单项在运行时的元信息,供键盘导航 / 无障碍 / 子菜单联动使用 */
+export interface ContextMenuItemEntry {
+    /** 稳定的 DOM id,同时用作 `aria-activedescendant` 的取值 */
+    id: string;
+    element: HTMLElement;
+    disabled: () => boolean;
+    /** 键盘字符导航时用于匹配的文本 */
+    label: () => string;
+    /** 是否是"打开子菜单"的项 */
+    hasPopup: () => boolean;
+    /** 键盘 Enter/Space 或点击时触发 */
+    activate: () => void;
+    /** 仅子菜单触发器:打开对应的子菜单 */
+    openPopup?: (reason: ContextMenuChangeEventReason, event?: Event) => void;
+}
+/** 根组件通过 context 暴露的状态与动作 */
+export interface ContextMenuContextValue {
+    open: Accessor<boolean>;
+    disabled: Accessor<boolean>;
+    loopFocus: Accessor<boolean>;
+    orientation: Accessor<ContextMenuOrientation>;
+    highlightItemOnHover: Accessor<boolean>;
+    /** 触发器元素,关闭时把焦点还给它 */
+    trigger: Accessor<HTMLElement | undefined>;
+    setTrigger: (el: HTMLElement | undefined) => void;
+    /** 右键菜单的虚拟锚点(鼠标坐标) */
+    anchor: Accessor<VirtualElement | undefined>;
+    contentId: string;
+    /** 关闭后是否把焦点还给触发器(Base UI Popup.finalFocus 的布尔子集) */
+    finalFocus: Accessor<boolean>;
+    setFinalFocus: (value: boolean) => void;
+    /** 在指定坐标打开(已打开时仅更新锚点) */
+    openAt: (x: number, y: number, contextElement: Element | undefined, event?: Event, reason?: ContextMenuChangeEventReason) => void;
+    /** 关闭整个菜单树 */
+    closeAll: (reason: ContextMenuChangeEventReason, event?: Event) => void;
+    /** 注册浮层容器元素(用于判断"点击是否发生在菜单内部") */
+    registerMenuElement: (el: HTMLElement) => () => void;
+    isInsideMenu: (node: Node | null) => boolean;
+}
+/** 每个浮层(根菜单 / 子菜单)各自维护的运行时上下文 */
+export interface ContextMenuPopupContextValue {
+    root: ContextMenuContextValue;
+    /** 父级浮层;根菜单为 undefined */
+    parent: ContextMenuPopupContextValue | undefined;
+    /** 该浮层所属的子菜单上下文;根菜单为 undefined */
+    submenu?: ContextMenuSubmenuContextValue;
+    menuId: string;
+    isSubmenu: boolean;
+    /** 真正承载焦点的 popup 元素 */
+    popup: Accessor<HTMLElement | undefined>;
+    setPopup: (el: HTMLElement | undefined) => void;
+    /** 以 DOM 顺序排列的已注册菜单项 */
+    items: Accessor<ContextMenuItemEntry[]>;
+    registerItem: (entry: ContextMenuItemEntry) => () => void;
+    activeId: Accessor<string | undefined>;
+    setActiveId: (id: string | undefined) => void;
+    activeEntry: () => ContextMenuItemEntry | undefined;
+    moveActive: (delta: 1 | -1) => void;
+    focusFirst: () => void;
+    focusLast: () => void;
+    /** 高亮指定项,并关闭其它项已打开的子菜单 */
+    highlight: (id: string | undefined) => void;
+    /** 当前由本浮层打开的二级菜单对应的项 id */
+    openPopupState: Accessor<ContextMenuOpenPopupState | undefined>;
+    openPopup: (id: string, reason: ContextMenuChangeEventReason, event?: Event) => void;
+    closeOpenPopup: () => void;
+    closeAll: (reason: ContextMenuChangeEventReason, event?: Event) => void;
+    highlightItemOnHover: Accessor<boolean>;
+}
+export interface ContextMenuOpenPopupState {
+    id: string;
+    reason: ContextMenuChangeEventReason;
+    event: Event | undefined;
+}
+/** 子菜单根组件提供的上下文 */
+export interface ContextMenuSubmenuContextValue {
+    root: ContextMenuContextValue;
+    /** 子菜单触发器所属的父浮层 */
+    parentPopup: ContextMenuPopupContextValue;
+    open: Accessor<boolean>;
+    setOpen: (open: boolean, reason: ContextMenuChangeEventReason, event?: Event) => void;
+    disabled: Accessor<boolean>;
+    closeParentOnEsc: Accessor<boolean>;
+    loopFocus: Accessor<boolean>;
+    orientation: Accessor<ContextMenuOrientation>;
+    highlightItemOnHover: Accessor<boolean>;
+    /** 子菜单触发器元素(同时是子菜单的定位锚点) */
+    trigger: Accessor<HTMLElement | undefined>;
+    setTrigger: (el: HTMLElement | undefined) => void;
+    /** 子菜单触发器在父浮层里注册的项 id */
+    itemId: Accessor<string | undefined>;
+    setItemId: (id: string | undefined) => void;
+    openSubmenu: (reason: ContextMenuChangeEventReason, event?: Event) => void;
+    closeSubmenu: (reason: ContextMenuChangeEventReason, event?: Event, focusTrigger?: boolean) => void;
+    /** 鼠标移出后延迟关闭(带防抖,避免穿越间隙时闪烁) */
+    scheduleClose: (delay?: number) => void;
+    cancelClose: () => void;
+}
+/** RadioGroup 共享给 RadioItem 的选中状态 */
+export interface ContextMenuRadioGroupContextValue {
+    value: Accessor<any>;
+    setValue: (value: any, event?: Event) => void;
+    disabled: Accessor<boolean>;
+}
+/** Group 与 GroupLabel 通过 id 建立 aria 关联 */
+export interface ContextMenuGroupContextValue {
+    labelId: Accessor<string | undefined>;
+    setLabelId: (id: string | undefined) => void;
+}
+/** Popup 定位所需的最小配置 */
+export interface ContextMenuPositioningOptions {
+    reference: Accessor<ReferenceElement | undefined>;
+    side: Accessor<ContextMenuSide>;
+    align: Accessor<ContextMenuAlign>;
+    sideOffset: Accessor<number>;
+    alignOffset: Accessor<number>;
+    collisionPadding: Accessor<number>;
+    dir: Accessor<"ltr" | "rtl" | "auto" | undefined>;
+}