@zerodep-dev/vue-tsx-pro-ui 0.3.1 → 0.3.2

package/dist/overlay/Drawer.js.map

@@ -1 +1 @@
-{"version":3,"file":"Drawer.js","names":["_isVNode","_vtp_bindable","_vtp_readonlyProp","_vtp_restProps","_vtp_untrack","_createVNode","_mergeProps"],"sources":["../../src/overlay/Drawer.tsx"],"sourcesContent":["/**\n * 抽屉：贴着视口一侧滑入的模态面板。内核见 Modal.tsx（与 Dialog、AlertDialog 共用）。\n *\n *   <Drawer _open={filtering} side=\"end\" title=\"筛选\">…</Drawer>\n */\nimport { _component } from '@zerodep-dev/vue-tsx-pro-tsx';\nimport * as css from '@zerodep-dev/vue-tsx-pro-tsx/styles';\nimport type { ContainerSizes } from '../layout/Container';\nimport { useLang } from '../config/context';\nimport { useDefaults } from '../config/defaults';\nimport { useRecipe } from '../config/styles';\nimport { ResizeHandle, type ResizeHandleProps } from '../layout/ResizeHandle';\nimport {\n  useDetachedOverlay,\n  type DetachedOverlayHandle,\n  type DetachedOverlayOptions,\n} from './detached';\nimport { ModalCore, modalPartStyles, type ModalProps } from './ModalCore';\nimport { t } from '../config/theme/tokens';\n\n/** 抽屉从哪一侧滑入；start / end 是逻辑方向，从右到左排版下左右互换 */\nexport interface DrawerSides {\n  /** 起始边（从左到右排版时是左侧）：导航菜单 */\n  start: unknown;\n  /** 结束边（默认，从左到右排版时是右侧）：详情、筛选、表单 */\n  end: unknown;\n  /** 顶部 */\n  top: unknown;\n  /** 底部：手机上的操作面板 */\n  bottom: unknown;\n}\n\n/** 抽屉的外观选项；可以用 createUi / Provider 的 defaults.Drawer 统一改默认值 */\nexport interface DrawerOptions {\n  /** 宽度（左右两侧）档位，与 Container 相同，默认 xs（30rem）；上下两侧时高度由内容决定，最多到视口高度 */\n  size?: keyof ContainerSizes;\n  /**\n   * 靠正文的一边可以拖动调整宽度（也能聚焦后用 ← / →，双击回到初始宽度），能一直拖到只剩一窄条、\n   * 让出后面的页面；只用于左右两侧\n   * @default true\n   */\n  resizable?: boolean;\n}\n\n/** 未声明的属性落到 dialog 上 */\nexport interface DrawerProps extends ModalProps, DrawerOptions {\n  /** 从哪一侧滑入，默认 end */\n  side?: keyof DrawerSides;\n  /** 宽度（px，左右两侧）：写了就不按 size 的档位；父级写 _width={x} 记住拖动后的宽度 */\n  _width?: number | null;\n  /**\n   * 拖动时的最小宽度（px）：默认只留一窄条（几乎关上，还能拖回来）；比内容窄时内容被裁掉，不挤成一列\n   * @default 48\n   */\n  minWidth?: number;\n  /** 宽度调整手柄的部件属性 */\n  propsResizeHandle?: Partial<ResizeHandleProps>;\n}\n\n/**\n * 抽屉的配方：部件同 ModalCore（base 并进了 modalPartStyles）；root 是 dialog 元素（去掉居中、按所在一侧定位与滑入），\n * 能拖动调整宽度时标题行、说明、正文、页脚保持最小宽度\n */\nexport const drawerRecipe = css.recipe({\n  name: 'Drawer',\n  parts: ['root', 'header', 'title', 'close', 'description', 'body', 'bodyContent', 'footer'],\n  base: {\n    ...modalPartStyles,\n    root: {\n      ...modalPartStyles.root,\n      margin: 0,\n      // 给了 width 时宽度写在行内，最多到视口宽\n      maxWidth: '100vw',\n      maxHeight: '100dvh',\n      borderRadius: 0,\n      // 进场从所在一侧滑入（@starting-style），离场滑回去（allow-discrete，离场过渡目前只有 Chromium）；\n      // “减少动态效果”时时长为 0。打开时 translate 是 none 而不是 0 0：否则抽屉会成为 fixed 子元素\n      // （移进来的 Toaster）的包含块；关闭时不显示，移到所在一侧之外没有这个问题\n      transition: {\n        default: `translate ${t.durations.md} ${t.easings.exit}, display ${t.durations.md} allow-discrete, overlay ${t.durations.md} allow-discrete`,\n        ':modal': `translate ${t.durations.lg} ${t.easings.enter}, display ${t.durations.lg} allow-discrete, overlay ${t.durations.lg} allow-discrete`,\n      },\n    },\n  },\n  variants: {\n    // 左右两侧占满视口高度、宽度看档位，上下两侧占满视口宽度、高度由内容决定。\n    // 位置用逻辑属性，从右到左排版自动换边；translate 是物理方向，用 :dir() 区分\n    side: {\n      start: {\n        root: {\n          insetBlock: 0,\n          width: '_full',\n          height: '100dvh',\n          overflow: 'hidden',\n          insetInlineStart: 0,\n          insetInlineEnd: 'auto',\n          borderInlineStartWidth: 0,\n          translate: {\n            default: '-100% 0',\n            ':dir(rtl)': '100% 0',\n            ':modal': {\n              default: 'none',\n              '@starting-style': { default: '-100% 0', ':dir(rtl)': '100% 0' },\n            },\n          },\n        },\n      },\n      end: {\n        root: {\n          insetBlock: 0,\n          width: '_full',\n          height: '100dvh',\n          overflow: 'hidden',\n          insetInlineStart: 'auto',\n          insetInlineEnd: 0,\n          borderInlineEndWidth: 0,\n          translate: {\n            default: '100% 0',\n            ':dir(rtl)': '-100% 0',\n            ':modal': {\n              default: 'none',\n              '@starting-style': { default: '100% 0', ':dir(rtl)': '-100% 0' },\n            },\n          },\n        },\n      },\n      top: {\n        root: {\n          insetInline: 0,\n          width: '100vw',\n          height: 'auto',\n          top: 0,\n          bottom: 'auto',\n          borderBlockStartWidth: 0,\n          translate: {\n            default: '0 -100%',\n            ':modal': { default: 'none', '@starting-style': '0 -100%' },\n          },\n        },\n      },\n      bottom: {\n        root: {\n          insetInline: 0,\n          width: '100vw',\n          height: 'auto',\n          top: 'auto',\n          bottom: 0,\n          borderBlockEndWidth: 0,\n          translate: {\n            default: '0 100%',\n            ':modal': { default: 'none', '@starting-style': '0 100%' },\n          },\n        },\n      },\n    },\n    // 左右两侧、没给 width 时的宽度档位\n    size: {\n      xs: { root: { maxWidth: `min(${t.sizes.xs}, 100vw)` } },\n      sm: { root: { maxWidth: `min(${t.sizes.sm}, 100vw)` } },\n      md: { root: { maxWidth: `min(${t.sizes.md}, 100vw)` } },\n      lg: { root: { maxWidth: `min(${t.sizes.lg}, 100vw)` } },\n      xl: { root: { maxWidth: `min(${t.sizes.xl}, 100vw)` } },\n    },\n    // 能拖动调整宽度（左右两侧）：拖窄以后内容保持能读的最小宽度，多出来的被面板裁掉\n    resizable: {\n      true: {\n        header: { minWidth: 'min(20rem, 100vw - 3rem)' },\n        description: { minWidth: 'min(20rem, 100vw - 3rem)' },\n        body: { minWidth: 'min(20rem, 100vw - 3rem)' },\n        footer: { minWidth: 'min(20rem, 100vw - 3rem)' },\n      },\n    },\n  },\n});\n\n/** 抽屉的部件（createUi / Provider 的 styles.Drawer 按它定制） */\nexport type DrawerPart = (typeof drawerRecipe.parts)[number];\n\n/** 抽屉：贴着视口一侧滑入的模态面板 */\nexport const Drawer = _component(\n  ({\n    _open: open = _bindable(false),\n    side = 'end',\n    size,\n    _width: width = _bindable<number | null>(null),\n    resizable,\n    minWidth = 48,\n    propsResizeHandle,\n    ...rest\n  }: DrawerProps) => {\n    const appearance = useDefaults('Drawer', () => ({ size, resizable }), {\n      size: 'xs',\n      resizable: true,\n    });\n    const messages = useLang();\n    const recipe = useRecipe(drawerRecipe);\n    // 双击回到打开时的宽度\n    const initialWidth = _untrack(width);\n    return () => {\n      const inline = side === 'start' || side === 'end';\n      const resizing = inline && appearance().resizable;\n      const s = recipe({\n        side,\n        size: inline && width == null ? appearance().size : undefined,\n        resizable: resizing,\n      });\n      return (\n        <ModalCore\n          {...rest}\n          _open={open}\n          parts={s}\n          style={inline && width != null ? { width: `${width}px` } : undefined}\n          data-side={side}\n          edge={\n            resizing && (\n              <ResizeHandle\n                aria-label={messages.drawerResize}\n                minWidth={minWidth}\n                maxWidth={typeof window === 'undefined' ? undefined : window.innerWidth - 48}\n                defaultWidth={initialWidth ?? undefined}\n                {...propsResizeHandle}\n                edge={side === 'end' ? 'start' : 'end'}\n                width={width ?? undefined}\n                onWidthChange={(next: number) => (width = next)}\n              />\n            )\n          }\n        />\n      );\n    };\n  },\n);\n\n/** useDrawer 返回的：open 打开一个抽屉 */\nexport interface DrawerApi {\n  /** 打开抽屉：属性同 Drawer（open 由句柄管理），content 是正文；返回句柄 */\n  open(options: DetachedOverlayOptions<DrawerProps>): DetachedOverlayHandle<DrawerProps>;\n}\n\n/**\n * 命令式抽屉：在组件 setup 里调用，用法同 useDialog。从表格的一行打开详情、编辑时不必在页面里放一个 Drawer 再管 open：\n *\n *   const drawer = useDrawer();\n *   drawer.open({ title: `订单 ${row.id}`, size: 'md', content: (handle) => <OrderForm id={row.id} onSaved={handle.close} /> });\n */\nexport function useDrawer(): DrawerApi {\n  const open = useDetachedOverlay<DrawerProps>((props, host, children) => (\n    <Drawer {...props} _open={host.open}>\n      {children}\n    </Drawer>\n  ));\n  return { open };\n}\n"],"mappings":"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"}
+{"version":3,"file":"Drawer.js","names":["_isVNode","_vtp_bindable","_vtp_readonlyProp","_vtp_restProps","_vtp_untrack","_createVNode","_mergeProps"],"sources":["../../src/overlay/Drawer.tsx"],"sourcesContent":["/**\n * 抽屉：贴着视口一侧滑入的模态面板。内核见 Modal.tsx（与 Dialog、AlertDialog 共用）。\n *\n *   <Drawer _open={filtering} side=\"end\" title=\"筛选\">…</Drawer>\n */\nimport { _component } from '@zerodep-dev/vue-tsx-pro-tsx';\nimport { css } from '@zerodep-dev/vue-tsx-pro-tsx/styles';\nimport type { ContainerSizes } from '../layout/Container';\nimport { useLang } from '../config/context';\nimport { useDefaults } from '../config/defaults';\nimport { useRecipe } from '../config/styles';\nimport { ResizeHandle, type ResizeHandleProps } from '../layout/ResizeHandle';\nimport {\n  useDetachedOverlay,\n  type DetachedOverlayHandle,\n  type DetachedOverlayOptions,\n} from './detached';\nimport { ModalCore, modalPartStyles, type ModalProps } from './ModalCore';\nimport { t } from '../config/theme/tokens';\n\n/** 抽屉从哪一侧滑入；start / end 是逻辑方向，从右到左排版下左右互换 */\nexport interface DrawerSides {\n  /** 起始边（从左到右排版时是左侧）：导航菜单 */\n  start: unknown;\n  /** 结束边（默认，从左到右排版时是右侧）：详情、筛选、表单 */\n  end: unknown;\n  /** 顶部 */\n  top: unknown;\n  /** 底部：手机上的操作面板 */\n  bottom: unknown;\n}\n\n/** 抽屉的外观选项；可以用 createUi / Provider 的 defaults.Drawer 统一改默认值 */\nexport interface DrawerOptions {\n  /** 宽度（左右两侧）档位，与 Container 相同，默认 xs（30rem）；上下两侧时高度由内容决定，最多到视口高度 */\n  size?: keyof ContainerSizes;\n  /**\n   * 靠正文的一边可以拖动调整宽度（也能聚焦后用 ← / →，双击回到初始宽度），能一直拖到只剩一窄条、\n   * 让出后面的页面；只用于左右两侧\n   * @default true\n   */\n  resizable?: boolean;\n}\n\n/** 未声明的属性落到 dialog 上 */\nexport interface DrawerProps extends ModalProps, DrawerOptions {\n  /** 从哪一侧滑入，默认 end */\n  side?: keyof DrawerSides;\n  /** 宽度（px，左右两侧）：写了就不按 size 的档位；父级写 _width={x} 记住拖动后的宽度 */\n  _width?: number | null;\n  /**\n   * 拖动时的最小宽度（px）：默认只留一窄条（几乎关上，还能拖回来）；比内容窄时内容被裁掉，不挤成一列\n   * @default 48\n   */\n  minWidth?: number;\n  /** 宽度调整手柄的部件属性 */\n  propsResizeHandle?: Partial<ResizeHandleProps>;\n}\n\n/**\n * 抽屉的配方：部件同 ModalCore（base 并进了 modalPartStyles）；root 是 dialog 元素（去掉居中、按所在一侧定位与滑入），\n * 能拖动调整宽度时标题行、说明、正文、页脚保持最小宽度\n */\nexport const drawerRecipe = css.recipe({\n  name: 'Drawer',\n  parts: ['root', 'header', 'title', 'close', 'description', 'body', 'bodyContent', 'footer'],\n  base: {\n    ...modalPartStyles,\n    root: {\n      ...modalPartStyles.root,\n      margin: 0,\n      // 给了 width 时宽度写在行内，最多到视口宽\n      maxWidth: '100vw',\n      maxHeight: '100dvh',\n      borderRadius: 0,\n      // 进场从所在一侧滑入（@starting-style），离场滑回去（allow-discrete，离场过渡目前只有 Chromium）；\n      // “减少动态效果”时时长为 0。打开时 translate 是 none 而不是 0 0：否则抽屉会成为 fixed 子元素\n      // （移进来的 Toaster）的包含块；关闭时不显示，移到所在一侧之外没有这个问题\n      transition: {\n        default: `translate ${t.durations.md} ${t.easings.exit}, display ${t.durations.md} allow-discrete, overlay ${t.durations.md} allow-discrete`,\n        ':modal': `translate ${t.durations.lg} ${t.easings.enter}, display ${t.durations.lg} allow-discrete, overlay ${t.durations.lg} allow-discrete`,\n      },\n    },\n  },\n  variants: {\n    // 左右两侧占满视口高度、宽度看档位，上下两侧占满视口宽度、高度由内容决定。\n    // 位置用逻辑属性，从右到左排版自动换边；translate 是物理方向，用 :dir() 区分\n    side: {\n      start: {\n        root: {\n          insetBlock: 0,\n          width: '_full',\n          height: '100dvh',\n          overflow: 'hidden',\n          insetInlineStart: 0,\n          insetInlineEnd: 'auto',\n          borderInlineStartWidth: 0,\n          translate: {\n            default: '-100% 0',\n            ':dir(rtl)': '100% 0',\n            ':modal': {\n              default: 'none',\n              '@starting-style': { default: '-100% 0', ':dir(rtl)': '100% 0' },\n            },\n          },\n        },\n      },\n      end: {\n        root: {\n          insetBlock: 0,\n          width: '_full',\n          height: '100dvh',\n          overflow: 'hidden',\n          insetInlineStart: 'auto',\n          insetInlineEnd: 0,\n          borderInlineEndWidth: 0,\n          translate: {\n            default: '100% 0',\n            ':dir(rtl)': '-100% 0',\n            ':modal': {\n              default: 'none',\n              '@starting-style': { default: '100% 0', ':dir(rtl)': '-100% 0' },\n            },\n          },\n        },\n      },\n      top: {\n        root: {\n          insetInline: 0,\n          width: '100vw',\n          height: 'auto',\n          top: 0,\n          bottom: 'auto',\n          borderBlockStartWidth: 0,\n          translate: {\n            default: '0 -100%',\n            ':modal': { default: 'none', '@starting-style': '0 -100%' },\n          },\n        },\n      },\n      bottom: {\n        root: {\n          insetInline: 0,\n          width: '100vw',\n          height: 'auto',\n          top: 'auto',\n          bottom: 0,\n          borderBlockEndWidth: 0,\n          translate: {\n            default: '0 100%',\n            ':modal': { default: 'none', '@starting-style': '0 100%' },\n          },\n        },\n      },\n    },\n    // 左右两侧、没给 width 时的宽度档位\n    size: {\n      xs: { root: { maxWidth: `min(${t.sizes.xs}, 100vw)` } },\n      sm: { root: { maxWidth: `min(${t.sizes.sm}, 100vw)` } },\n      md: { root: { maxWidth: `min(${t.sizes.md}, 100vw)` } },\n      lg: { root: { maxWidth: `min(${t.sizes.lg}, 100vw)` } },\n      xl: { root: { maxWidth: `min(${t.sizes.xl}, 100vw)` } },\n    },\n    // 能拖动调整宽度（左右两侧）：拖窄以后内容保持能读的最小宽度，多出来的被面板裁掉\n    resizable: {\n      true: {\n        header: { minWidth: 'min(20rem, 100vw - 3rem)' },\n        description: { minWidth: 'min(20rem, 100vw - 3rem)' },\n        body: { minWidth: 'min(20rem, 100vw - 3rem)' },\n        footer: { minWidth: 'min(20rem, 100vw - 3rem)' },\n      },\n    },\n  },\n});\n\n/** 抽屉的部件（createUi / Provider 的 styles.Drawer 按它定制） */\nexport type DrawerPart = (typeof drawerRecipe.parts)[number];\n\n/** 抽屉：贴着视口一侧滑入的模态面板 */\nexport const Drawer = _component(\n  ({\n    _open: open = _bindable(false),\n    side = 'end',\n    size,\n    _width: width = _bindable<number | null>(null),\n    resizable,\n    minWidth = 48,\n    propsResizeHandle,\n    ...rest\n  }: DrawerProps) => {\n    const appearance = useDefaults('Drawer', () => ({ size, resizable }), {\n      size: 'xs',\n      resizable: true,\n    });\n    const messages = useLang();\n    const recipe = useRecipe(drawerRecipe);\n    // 双击回到打开时的宽度\n    const initialWidth = _untrack(width);\n    return () => {\n      const inline = side === 'start' || side === 'end';\n      const resizing = inline && appearance().resizable;\n      const s = recipe({\n        side,\n        size: inline && width == null ? appearance().size : undefined,\n        resizable: resizing,\n      });\n      return (\n        <ModalCore\n          {...rest}\n          _open={open}\n          parts={s}\n          style={inline && width != null ? { width: `${width}px` } : undefined}\n          data-side={side}\n          edge={\n            resizing && (\n              <ResizeHandle\n                aria-label={messages.drawerResize}\n                minWidth={minWidth}\n                maxWidth={typeof window === 'undefined' ? undefined : window.innerWidth - 48}\n                defaultWidth={initialWidth ?? undefined}\n                {...propsResizeHandle}\n                edge={side === 'end' ? 'start' : 'end'}\n                width={width ?? undefined}\n                onWidthChange={(next: number) => (width = next)}\n              />\n            )\n          }\n        />\n      );\n    };\n  },\n);\n\n/** useDrawer 返回的：open 打开一个抽屉 */\nexport interface DrawerApi {\n  /** 打开抽屉：属性同 Drawer（open 由句柄管理），content 是正文；返回句柄 */\n  open(options: DetachedOverlayOptions<DrawerProps>): DetachedOverlayHandle<DrawerProps>;\n}\n\n/**\n * 命令式抽屉：在组件 setup 里调用，用法同 useDialog。从表格的一行打开详情、编辑时不必在页面里放一个 Drawer 再管 open：\n *\n *   const drawer = useDrawer();\n *   drawer.open({ title: `订单 ${row.id}`, size: 'md', content: (handle) => <OrderForm id={row.id} onSaved={handle.close} /> });\n */\nexport function useDrawer(): DrawerApi {\n  const open = useDetachedOverlay<DrawerProps>((props, host, children) => (\n    <Drawer {...props} _open={host.open}>\n      {children}\n    </Drawer>\n  ));\n  return { open };\n}\n"],"mappings":"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"}

package/dist/overlay/HoverCard.d.ts

@@ -1,4 +1,4 @@
-import * as css from '@zerodep-dev/vue-tsx-pro-tsx/styles';
+import { css } from '@zerodep-dev/vue-tsx-pro-tsx/styles';
 import type { VNodeChild } from 'vue';
 import { type FloatingOptions, type FloatingPlacement } from '../utils/dom/floating';
 import { type OpenChangeProps } from '../utils/dom/open-change';

package/dist/overlay/HoverCard.js

@@ -8,7 +8,7 @@ import { openSetter } from "../utils/dom/open-change.js";
 import { useHoverLayer } from "../utils/dom/hover-layer.js";
 import { Fragment, createVNode } from "vue";
 import { _component, bindable, childrenProp, mergeJsxProps, readonlyProp, restProps } from "@zerodep-dev/vue-tsx-pro-tsx";
-import * as css from "@zerodep-dev/vue-tsx-pro-tsx/styles";
+import { css } from "@zerodep-dev/vue-tsx-pro-tsx/styles";
 //#region src/overlay/HoverCard.tsx
 /** 交给触发器的属性：展开到触发元素上（`{...props}`） */
 /** 未声明的属性落到卡片的 div 上 */

package/dist/overlay/HoverCard.js.map

@@ -1 +1 @@
-{"version":3,"file":"HoverCard.js","names":["_vtp_bindable","_vtp_readonlyProp","_vtp_childrenProp","_vtp_restProps","_createVNode","_Fragment","_mergeProps"],"sources":["../../src/overlay/HoverCard.tsx"],"sourcesContent":["/**\n * 悬停卡片：指针停在触发器（通常是链接、用户名）上、或用键盘聚焦它时，弹出一张富内容卡片（用户资料、链接预览）。\n * 开关时机同 Tooltip（useHoverIntent：停留后打开、可以移到卡片上、同组只开一个、刚关掉一个时下一个直接打开），\n * 定位同 Popover（floating-ui，可选箭头）。参考 Radix HoverCard。\n *\n *   <HoverCard trigger={(props) => <Link {...props} href=\"/u/ada\">@ada</Link>}>\n *     <Avatar name=\"Ada Lovelace\" /> …\n *   </HoverCard>\n *\n * 卡片只是预览：里面的信息要在别处也能拿到（触屏没有悬停）。卡片里可以有链接、按钮：\n * 键盘聚焦触发器打开后按 Tab 进入卡片，焦点离开触发器与卡片时关闭；Esc 关闭。\n * 用 popover=\"manual\" 渲染在顶层，不会关掉正打开的菜单或弹出框。开关、定位、Esc 见 useHoverLayer（与 Tooltip 共用）。\n */\nimport { _component } from '@zerodep-dev/vue-tsx-pro-tsx';\nimport * as css from '@zerodep-dev/vue-tsx-pro-tsx/styles';\nimport type { VNodeChild } from 'vue';\nimport {\n  floatingStyles,\n  type FloatingOptions,\n  type FloatingPlacement,\n} from '../utils/dom/floating';\nimport { createHoverGroup } from '../utils/dom/hover-intent';\nimport { openSetter, type OpenChangeProps } from '../utils/dom/open-change';\nimport { useHoverLayer } from '../utils/dom/hover-layer';\nimport { useLazyContent, type LazyContentOptions } from '../utils/motion/presence';\nimport { mergeAttrs, type PartProps } from '../utils/props';\nimport { transitions } from '../utils/style/transitions';\nimport { useMounted } from '../utils/dom/mounted';\n\n/** 交给触发器的属性：展开到触发元素上（`{...props}`） */\nexport interface HoverCardTriggerProps {\n  /** 取得触发器元素：定位的参照 */\n  ref: (element: unknown) => void;\n  /** 指针进入：等 delay 后打开 */\n  onPointerenter: (event: PointerEvent) => void;\n  /** 指针离开：稍后关闭（可以移到卡片上） */\n  onPointerleave: (event: PointerEvent) => void;\n  /** 按下（点击）触发器时关闭 */\n  onPointerdown: (event: PointerEvent) => void;\n  /** 键盘聚焦时立即打开 */\n  onFocus: (event: FocusEvent) => void;\n  /** 焦点离开（不是移进卡片）时关闭 */\n  onBlur: (event: FocusEvent) => void;\n}\n\n/** 未声明的属性落到卡片的 div 上 */\nexport interface HoverCardProps\n  extends\n    PartProps<'div', 'id' | 'popover'>,\n    Pick<FloatingOptions, 'offset'>,\n    LazyContentOptions,\n    OpenChangeProps {\n  /** 是否打开：父级可以写 _open={x} 控制或得知 */\n  _open?: boolean;\n  /** 弹出位置，默认 bottom；空间不够时自动翻转 */\n  placement?: FloatingPlacement;\n  /** 指针停留多久后打开（毫秒），默认 700 */\n  delay?: number;\n  /** 指针离开多久后关闭（毫秒），默认 300 */\n  closeDelay?: number;\n  /** 不打开（触发器照常渲染） */\n  disabled?: boolean;\n  /** 显示指向触发器的箭头 */\n  arrow?: boolean;\n  /** 触发器：`(props) => <Link {...props} … />` */\n  trigger: (props: HoverCardTriggerProps) => VNodeChild;\n  /** 箭头的部件属性 */\n  propsArrow?: PartProps<'span'>;\n  /** 卡片内容 */\n  children?: VNodeChild;\n}\n\n/** HoverCard 的样式：panel */\nexport const hoverCardStyles = css.create({\n  panel: { padding: '_md', maxWidth: 'min(22em, calc(100vw - 2em))' },\n});\n\n/** 所有悬停卡片一组：同一时间只开一个 */\nconst hoverCards = createHoverGroup();\n\n/** 悬停卡片：悬停或键盘聚焦时在触发器旁边显示富内容 */\nexport const HoverCard = _component(\n  ({\n    _open: open = _bindable(false),\n    onOpenChange,\n    placement = 'bottom',\n    offset,\n    delay = 700,\n    closeDelay = 300,\n    disabled = false,\n    arrow = false,\n    trigger,\n    propsArrow,\n    lazy = true,\n    children,\n    ...rest\n  }: HoverCardProps) => {\n    // 面板挂载后才渲染：关着时本来就看不见；服务端渲染时也不输出，触发器在 <p> 里时 <div> 不会把段落提前截断，水合对得上\n    const mounted = useMounted();\n    const showContent = useLazyContent(\n      () => open,\n      () => lazy,\n    );\n    const layer = useHoverLayer(\n      hoverCards,\n      () => ({ open, disabled, placement, offset, delay, closeDelay }),\n      openSetter(\n        () => open,\n        (next) => (open = next),\n        () => onOpenChange,\n      ),\n    );\n\n    return () => (\n      <>\n        {trigger({\n          ref: layer.anchorRef,\n          ...layer.hover.trigger,\n          // Tab 进卡片（下一个可聚焦元素）时不关\n          onBlur: (event: FocusEvent) => {\n            if (!layer.contains(event.relatedTarget)) layer.hover.closeNow('focus', event);\n          },\n        })}\n        {mounted.value && (\n          <div\n            {...mergeAttrs<'div'>(\n              {\n                sx: [\n                  floatingStyles.anchored,\n                  floatingStyles.surface,\n                  hoverCardStyles.panel,\n                  transitions.scale,\n                  arrow && floatingStyles.withArrow,\n                ],\n              },\n              rest,\n              {\n                ref: layer.panelRef,\n                id: layer.id,\n                popover: 'manual',\n                ...layer.hover.panel,\n                onFocusout: (event: FocusEvent) => {\n                  if (!layer.contains(event.relatedTarget)) layer.hover.closeNow('focus', event);\n                },\n              },\n            )}\n            data-state={open && !disabled ? 'open' : 'closed'}\n          >\n            {showContent() && children}\n            {arrow && <span {...layer.arrowProps(propsArrow)} />}\n          </div>\n        )}\n      </>\n    );\n  },\n);\n"],"mappings":";;;;;;;;;;;;;;;AAyEA,IAAa,kBAAkB,IAAI,OAAO,EACxC,OAAO;CAAE,SAAS;CAAO,UAAU;AAA+B,EACpE,CAAC;;AAGD,IAAM,aAAa,iBAAiB;;AAGpC,IAAa,YAAY,0BACvB,QAAA,SAcsB;CAAA,MAAA,OAAAA,SAAA,QAAA,eAbI,OAAK,KAAA,IAAA;CAAA,MAAA,eAAAC,aAAA,QAAA,cAAA;CAAA,MAAA,YAAAA,aAAA,QAAA,aAEjB,QAAQ;CAAA,MAAA,SAAAA,aAAA,QAAA,QAAA;CAAA,MAAA,QAAAA,aAAA,QAAA,SAEZ,GAAG;CAAA,MAAA,aAAAA,aAAA,QAAA,cACE,GAAG;CAAA,MAAA,WAAAA,aAAA,QAAA,YACL,KAAK;CAAA,MAAA,QAAAA,aAAA,QAAA,SACR,KAAK;CAAA,MAAA,UAAAA,aAAA,QAAA,SAAA;CAAA,MAAA,aAAAA,aAAA,QAAA,YAAA;CAAA,MAAA,OAAAA,aAAA,QAAA,QAGN,IAAI;CAAA,MAAA,WAAAC,aAAA,MAAA;CAAA,MAER,OAAIC,UAAA,QAAA,MAAA,KAAA;CAGP,MAAM,UAAU,WAAW;CAC3B,MAAM,cAAc,qBAClB,KAAA,aACA,KAAA,KACF;CACA,MAAM,QAAQ,cACZ,mBACO;EAAE,MAAI,KAAA;EAAE,UAAQ,SAAA;EAAE,WAAS,UAAA;EAAE,QAAM,OAAA;EAAE,OAAK,MAAA;EAAE,YAAU,WAAA;CAAC,IAC9D,iBACE,KAAA,QACC,SAAU,KAAA,QAAO,YAClB,aAAA,KACF,CACF;CAEA,aAAOC,YAAAC,UAAA,MAAA,CAEF,QAAA,MAAQ;EACP,KAAK,MAAM;EACX,GAAG,MAAM,MAAM;EAEf,SAAS,UAAsB;GAC7B,IAAI,CAAC,MAAM,SAAS,MAAM,aAAa,GAAG,MAAM,MAAM,SAAS,SAAS,KAAK;EAC/E;CACF,CAAC,GACA,QAAQ,SAAKD,YAAA,OAAAE,cAEN,WACF,EACE,IAAI;EACF,eAAe;EACf,eAAe;EACf,gBAAgB;EAChB,YAAY;EACZ,MAAA,SAAS,eAAe;CAAS,EAErC,GACA,MACA;EACE,KAAK,MAAM;EACX,IAAI,MAAM;EACV,SAAS;EACT,GAAG,MAAM,MAAM;EACf,aAAa,UAAsB;GACjC,IAAI,CAAC,MAAM,SAAS,MAAM,aAAa,GAAG,MAAM,MAAM,SAAS,SAAS,KAAK;EAC/E;CACF,CACF,GAAC,EAAA,cACW,KAAA,SAAQ,CAAA,SAAA,QAAY,SAAS,SAAQ,CAAA,GAAA,CAEhD,YAAY,KAAC,SAAA,OACb,MAAA,SAAAF,YAAA,QAAmB,MAAM,WAAU,WAAA,KAAW,GAAC,IAAA,CAAI,CAAA,CAEvD,CAAA;AAGP,GAAC;CAAA,MAAA;CAAA,OAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;CAAA;AAAA,CACH"}
+{"version":3,"file":"HoverCard.js","names":["_vtp_bindable","_vtp_readonlyProp","_vtp_childrenProp","_vtp_restProps","_createVNode","_Fragment","_mergeProps"],"sources":["../../src/overlay/HoverCard.tsx"],"sourcesContent":["/**\n * 悬停卡片：指针停在触发器（通常是链接、用户名）上、或用键盘聚焦它时，弹出一张富内容卡片（用户资料、链接预览）。\n * 开关时机同 Tooltip（useHoverIntent：停留后打开、可以移到卡片上、同组只开一个、刚关掉一个时下一个直接打开），\n * 定位同 Popover（floating-ui，可选箭头）。参考 Radix HoverCard。\n *\n *   <HoverCard trigger={(props) => <Link {...props} href=\"/u/ada\">@ada</Link>}>\n *     <Avatar name=\"Ada Lovelace\" /> …\n *   </HoverCard>\n *\n * 卡片只是预览：里面的信息要在别处也能拿到（触屏没有悬停）。卡片里可以有链接、按钮：\n * 键盘聚焦触发器打开后按 Tab 进入卡片，焦点离开触发器与卡片时关闭；Esc 关闭。\n * 用 popover=\"manual\" 渲染在顶层，不会关掉正打开的菜单或弹出框。开关、定位、Esc 见 useHoverLayer（与 Tooltip 共用）。\n */\nimport { _component } from '@zerodep-dev/vue-tsx-pro-tsx';\nimport { css } from '@zerodep-dev/vue-tsx-pro-tsx/styles';\nimport type { VNodeChild } from 'vue';\nimport {\n  floatingStyles,\n  type FloatingOptions,\n  type FloatingPlacement,\n} from '../utils/dom/floating';\nimport { createHoverGroup } from '../utils/dom/hover-intent';\nimport { openSetter, type OpenChangeProps } from '../utils/dom/open-change';\nimport { useHoverLayer } from '../utils/dom/hover-layer';\nimport { useLazyContent, type LazyContentOptions } from '../utils/motion/presence';\nimport { mergeAttrs, type PartProps } from '../utils/props';\nimport { transitions } from '../utils/style/transitions';\nimport { useMounted } from '../utils/dom/mounted';\n\n/** 交给触发器的属性：展开到触发元素上（`{...props}`） */\nexport interface HoverCardTriggerProps {\n  /** 取得触发器元素：定位的参照 */\n  ref: (element: unknown) => void;\n  /** 指针进入：等 delay 后打开 */\n  onPointerenter: (event: PointerEvent) => void;\n  /** 指针离开：稍后关闭（可以移到卡片上） */\n  onPointerleave: (event: PointerEvent) => void;\n  /** 按下（点击）触发器时关闭 */\n  onPointerdown: (event: PointerEvent) => void;\n  /** 键盘聚焦时立即打开 */\n  onFocus: (event: FocusEvent) => void;\n  /** 焦点离开（不是移进卡片）时关闭 */\n  onBlur: (event: FocusEvent) => void;\n}\n\n/** 未声明的属性落到卡片的 div 上 */\nexport interface HoverCardProps\n  extends\n    PartProps<'div', 'id' | 'popover'>,\n    Pick<FloatingOptions, 'offset'>,\n    LazyContentOptions,\n    OpenChangeProps {\n  /** 是否打开：父级可以写 _open={x} 控制或得知 */\n  _open?: boolean;\n  /** 弹出位置，默认 bottom；空间不够时自动翻转 */\n  placement?: FloatingPlacement;\n  /** 指针停留多久后打开（毫秒），默认 700 */\n  delay?: number;\n  /** 指针离开多久后关闭（毫秒），默认 300 */\n  closeDelay?: number;\n  /** 不打开（触发器照常渲染） */\n  disabled?: boolean;\n  /** 显示指向触发器的箭头 */\n  arrow?: boolean;\n  /** 触发器：`(props) => <Link {...props} … />` */\n  trigger: (props: HoverCardTriggerProps) => VNodeChild;\n  /** 箭头的部件属性 */\n  propsArrow?: PartProps<'span'>;\n  /** 卡片内容 */\n  children?: VNodeChild;\n}\n\n/** HoverCard 的样式：panel */\nexport const hoverCardStyles = css.create({\n  panel: { padding: '_md', maxWidth: 'min(22em, calc(100vw - 2em))' },\n});\n\n/** 所有悬停卡片一组：同一时间只开一个 */\nconst hoverCards = createHoverGroup();\n\n/** 悬停卡片：悬停或键盘聚焦时在触发器旁边显示富内容 */\nexport const HoverCard = _component(\n  ({\n    _open: open = _bindable(false),\n    onOpenChange,\n    placement = 'bottom',\n    offset,\n    delay = 700,\n    closeDelay = 300,\n    disabled = false,\n    arrow = false,\n    trigger,\n    propsArrow,\n    lazy = true,\n    children,\n    ...rest\n  }: HoverCardProps) => {\n    // 面板挂载后才渲染：关着时本来就看不见；服务端渲染时也不输出，触发器在 <p> 里时 <div> 不会把段落提前截断，水合对得上\n    const mounted = useMounted();\n    const showContent = useLazyContent(\n      () => open,\n      () => lazy,\n    );\n    const layer = useHoverLayer(\n      hoverCards,\n      () => ({ open, disabled, placement, offset, delay, closeDelay }),\n      openSetter(\n        () => open,\n        (next) => (open = next),\n        () => onOpenChange,\n      ),\n    );\n\n    return () => (\n      <>\n        {trigger({\n          ref: layer.anchorRef,\n          ...layer.hover.trigger,\n          // Tab 进卡片（下一个可聚焦元素）时不关\n          onBlur: (event: FocusEvent) => {\n            if (!layer.contains(event.relatedTarget)) layer.hover.closeNow('focus', event);\n          },\n        })}\n        {mounted.value && (\n          <div\n            {...mergeAttrs<'div'>(\n              {\n                sx: [\n                  floatingStyles.anchored,\n                  floatingStyles.surface,\n                  hoverCardStyles.panel,\n                  transitions.scale,\n                  arrow && floatingStyles.withArrow,\n                ],\n              },\n              rest,\n              {\n                ref: layer.panelRef,\n                id: layer.id,\n                popover: 'manual',\n                ...layer.hover.panel,\n                onFocusout: (event: FocusEvent) => {\n                  if (!layer.contains(event.relatedTarget)) layer.hover.closeNow('focus', event);\n                },\n              },\n            )}\n            data-state={open && !disabled ? 'open' : 'closed'}\n          >\n            {showContent() && children}\n            {arrow && <span {...layer.arrowProps(propsArrow)} />}\n          </div>\n        )}\n      </>\n    );\n  },\n);\n"],"mappings":";;;;;;;;;;;;;;;AAyEA,IAAa,kBAAkB,IAAI,OAAO,EACxC,OAAO;CAAE,SAAS;CAAO,UAAU;AAA+B,EACpE,CAAC;;AAGD,IAAM,aAAa,iBAAiB;;AAGpC,IAAa,YAAY,0BACvB,QAAA,SAcsB;CAAA,MAAA,OAAAA,SAAA,QAAA,eAbI,OAAK,KAAA,IAAA;CAAA,MAAA,eAAAC,aAAA,QAAA,cAAA;CAAA,MAAA,YAAAA,aAAA,QAAA,aAEjB,QAAQ;CAAA,MAAA,SAAAA,aAAA,QAAA,QAAA;CAAA,MAAA,QAAAA,aAAA,QAAA,SAEZ,GAAG;CAAA,MAAA,aAAAA,aAAA,QAAA,cACE,GAAG;CAAA,MAAA,WAAAA,aAAA,QAAA,YACL,KAAK;CAAA,MAAA,QAAAA,aAAA,QAAA,SACR,KAAK;CAAA,MAAA,UAAAA,aAAA,QAAA,SAAA;CAAA,MAAA,aAAAA,aAAA,QAAA,YAAA;CAAA,MAAA,OAAAA,aAAA,QAAA,QAGN,IAAI;CAAA,MAAA,WAAAC,aAAA,MAAA;CAAA,MAER,OAAIC,UAAA,QAAA,MAAA,KAAA;CAGP,MAAM,UAAU,WAAW;CAC3B,MAAM,cAAc,qBAClB,KAAA,aACA,KAAA,KACF;CACA,MAAM,QAAQ,cACZ,mBACO;EAAE,MAAI,KAAA;EAAE,UAAQ,SAAA;EAAE,WAAS,UAAA;EAAE,QAAM,OAAA;EAAE,OAAK,MAAA;EAAE,YAAU,WAAA;CAAC,IAC9D,iBACE,KAAA,QACC,SAAU,KAAA,QAAO,YAClB,aAAA,KACF,CACF;CAEA,aAAOC,YAAAC,UAAA,MAAA,CAEF,QAAA,MAAQ;EACP,KAAK,MAAM;EACX,GAAG,MAAM,MAAM;EAEf,SAAS,UAAsB;GAC7B,IAAI,CAAC,MAAM,SAAS,MAAM,aAAa,GAAG,MAAM,MAAM,SAAS,SAAS,KAAK;EAC/E;CACF,CAAC,GACA,QAAQ,SAAKD,YAAA,OAAAE,cAEN,WACF,EACE,IAAI;EACF,eAAe;EACf,eAAe;EACf,gBAAgB;EAChB,YAAY;EACZ,MAAA,SAAS,eAAe;CAAS,EAErC,GACA,MACA;EACE,KAAK,MAAM;EACX,IAAI,MAAM;EACV,SAAS;EACT,GAAG,MAAM,MAAM;EACf,aAAa,UAAsB;GACjC,IAAI,CAAC,MAAM,SAAS,MAAM,aAAa,GAAG,MAAM,MAAM,SAAS,SAAS,KAAK;EAC/E;CACF,CACF,GAAC,EAAA,cACW,KAAA,SAAQ,CAAA,SAAA,QAAY,SAAS,SAAQ,CAAA,GAAA,CAEhD,YAAY,KAAC,SAAA,OACb,MAAA,SAAAF,YAAA,QAAmB,MAAM,WAAU,WAAA,KAAW,GAAC,IAAA,CAAI,CAAA,CAEvD,CAAA;AAGP,GAAC;CAAA,MAAA;CAAA,OAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;CAAA;AAAA,CACH"}

package/dist/overlay/Lightbox.d.ts

@@ -1,4 +1,4 @@
-import * as css from '@zerodep-dev/vue-tsx-pro-tsx/styles';
+import { css } from '@zerodep-dev/vue-tsx-pro-tsx/styles';
 import { type VNodeChild } from 'vue';
 import { type IconButtonProps } from '../base/IconButton';
 import { type OpenChangeProps } from '../utils/dom/open-change';

package/dist/overlay/Lightbox.js

@@ -9,7 +9,7 @@ import { openSetter } from "../utils/dom/open-change.js";
 import { usePanZoom } from "../utils/dom/pan-zoom.js";
 import { createTextVNode, createVNode, nextTick, onBeforeUnmount, ref, shallowRef } from "vue";
 import { _component, bindable, effect, mergeJsxProps, readonlyProp, restProps } from "@zerodep-dev/vue-tsx-pro-tsx";
-import * as css from "@zerodep-dev/vue-tsx-pro-tsx/styles";
+import { css } from "@zerodep-dev/vue-tsx-pro-tsx/styles";
 import { ChevronLeft, ChevronRight, Download, RotateCcw, RotateCw, Undo2, X, ZoomIn, ZoomOut } from "@lucide/icons";
 //#region src/overlay/Lightbox.tsx
 /**

package/dist/overlay/Lightbox.js.map

@@ -1 +1 @@
-{"version":3,"file":"Lightbox.js","names":["_vtp_bindable","_vtp_readonlyProp","_vtp_restProps","_vue_shallowRef","_vue_ref","_createVNode","_mergeProps","_createTextVNode"],"sources":["../../src/overlay/Lightbox.tsx"],"sourcesContent":["/**\n * 图片预览（全屏的模态 dialog）：深色背景上看大图——缩放、拖动、旋转、还原、下载，几张图时左右切换。\n * Image 的 preview 打开它（同一个 ImageGroup 里的图共用一个），也可以单独用。参考 Ant Design Image 的预览、Element Plus 的 image-viewer。\n *\n *   <Lightbox _open={viewing} _index={at} items={[{ src: '/photos/1.jpg', alt: '支架正面' }, …]} />\n *\n * - 平移与缩放建在 usePanZoom 上：拖动平移，滚轮、触控板、捏合以指针为中心缩放，双击放大 / 还原；\n *   打开或换一张时整张图放进视口（不超过原大）。旋转以 90° 为一档，转完重新放进视口。\n * - 键盘：← / → 上一张、下一张，+ / − 缩放，0 还原，R 向右旋转，Esc 关闭；焦点在工具栏与图片区之间循环（模态）。\n * - 读屏：dialog 的名称是“图片预览”，图片区是 role=\"img\"、名称是图片的 alt；换一张时念出“第 2 张，共 5 张”。\n *\n * 部件：Root（dialog）、Toolbar（div）、Counter（span）、Viewport（div）、Image（img）、Previous、Next（IconButton）、Caption（div）。\n */\nimport {\n  ChevronLeft,\n  ChevronRight,\n  Download,\n  RotateCcw,\n  RotateCw,\n  Undo2,\n  X,\n  ZoomIn,\n  ZoomOut,\n} from '@lucide/icons';\nimport { _component } from '@zerodep-dev/vue-tsx-pro-tsx';\nimport * as css from '@zerodep-dev/vue-tsx-pro-tsx/styles';\nimport { nextTick, onBeforeUnmount, type VNodeChild } from 'vue';\nimport { IconButton, type IconButtonProps } from '../base/IconButton';\nimport { IconLinkButton, type IconLinkButtonProps } from '../base/IconLinkButton';\nimport { useLang } from '../config/context';\nimport { clamp } from '../utils/data/number';\nimport { openSetter, type OpenChangeProps, type OpenChangeReasons } from '../utils/dom/open-change';\nimport { openModalDialog } from '../utils/dom/overlay';\nimport { usePanZoom } from '../utils/dom/pan-zoom';\nimport { mergeAttrs, mergePartProps, type PartProps } from '../utils/props';\nimport { transitions } from '../utils/style/transitions';\n\n/** 一张图 */\nexport interface LightboxItem {\n  /** 大图的地址 */\n  src: string;\n  /** 图片的说明（读屏念它） */\n  alt: string;\n  /** 图片下方的说明文字 */\n  caption?: VNodeChild;\n  /** 下载时的文件名；false 不显示下载按钮 */\n  download?: string | false;\n}\n\n/** 打开、关联由组件管理；未声明的属性落到 dialog 上 */\nexport interface LightboxProps\n  extends PartProps<'dialog', 'open' | 'aria-label' | 'aria-labelledby'>, OpenChangeProps {\n  /** 是否打开：父级写 _open={x}；Esc、关闭按钮会关上并写回 */\n  _open?: boolean;\n  /** 图片 */\n  items: readonly LightboxItem[];\n  /** 当前第几张，从 0 开始：父级可以写 _index={x} */\n  _index?: number;\n  /** 到头之后从另一头继续，默认 false */\n  loop?: boolean;\n  /** 工具栏按钮的部件属性 */\n  propsButton?: Partial<IconButtonProps>;\n  /** 图片区（视口）的部件属性 */\n  propsViewport?: PartProps<'div'>;\n  /** 说明文字的部件属性 */\n  propsCaption?: PartProps<'div'>;\n}\n\n/** Lightbox 的样式：root、toolbar、counter、viewport、content、image、side、previous、next、caption、button */\nexport const lightboxStyles = css.create({\n  root: {\n    // 占满视口：原生 dialog 默认有最大宽高与边框\n    boxSizing: 'border-box',\n    width: '100vw',\n    height: '100dvh',\n    maxWidth: 'none',\n    maxHeight: 'none',\n    margin: 0,\n    padding: 0,\n    borderWidth: 0,\n    display: { default: 'none', ':modal': 'flex' },\n    flexDirection: 'column',\n    // 图片预览总是深色背景：不跟主题变（看图片本身的颜色）\n    backgroundColor: 'rgb(0 0 0 / 0.86)',\n    color: 'white',\n    colorScheme: 'dark',\n  },\n  toolbar: {\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'flex-end',\n    gap: '_xs',\n    paddingBlock: '_sm',\n    paddingInline: '_md',\n    flexShrink: 0,\n  },\n  counter: {\n    marginInlineEnd: 'auto',\n    fontVariantNumeric: 'tabular-nums',\n    fontSize: '_sm',\n    opacity: 0.8,\n  },\n  zoom: {\n    minWidth: '3.5em',\n    textAlign: 'center',\n    fontSize: '_sm',\n    fontVariantNumeric: 'tabular-nums',\n  },\n  viewport: {\n    position: 'relative',\n    flexGrow: 1,\n    minHeight: 0,\n    overflow: 'hidden',\n    cursor: { default: 'grab', ':active': 'grabbing' },\n    outline: 'none',\n  },\n  // 平移与缩放作用在它上面（transform-origin 左上角）；它的大小是旋转之后图片占的框\n  content: { position: 'absolute', top: 0, left: 0, transformOrigin: '0 0' },\n  // 图片以框的中心旋转\n  image: {\n    position: 'absolute',\n    top: '50%',\n    left: '50%',\n    maxWidth: 'none',\n    userSelect: 'none',\n    pointerEvents: 'none',\n  },\n  smooth: { transitionProperty: 'transform', transitionDuration: '_md' },\n  side: {\n    position: 'absolute',\n    top: '50%',\n    translate: '0 -50%',\n    zIndex: 1,\n  },\n  previous: { insetInlineStart: '_md' },\n  next: { insetInlineEnd: '_md' },\n  caption: {\n    flexShrink: 0,\n    paddingBlock: '_md',\n    paddingInline: '_xl',\n    textAlign: 'center',\n    fontSize: '_sm',\n    opacity: 0.9,\n  },\n  // 深色背景上的按钮：文字白色，悬停时浅一点的底\n  button: {\n    color: 'white',\n    backgroundColor: { default: 'transparent', ':hover': 'rgb(255 255 255 / 0.12)' },\n  },\n});\n\n/** Lightbox 的动态样式：平移缩放、框的大小、图片的大小与旋转 */\nexport const lightboxDynamicStyles = css.create({\n  transform: (transform: string) => ({ transform }),\n  box: (width: number, height: number) => ({ width: `${width}px`, height: `${height}px` }),\n  image: (width: number, height: number, degrees: number) => ({\n    width: `${width}px`,\n    height: `${height}px`,\n    transform: `translate(-50%, -50%) rotate(${degrees}deg)`,\n  }),\n});\n\n/** 图片预览：全屏 dialog，缩放、拖动、旋转、左右切换 */\nexport const Lightbox = _component(\n  ({\n    _open: open = _bindable(false),\n    onOpenChange,\n    items,\n    _index: index = _bindable(0),\n    loop = false,\n    propsButton,\n    propsViewport,\n    propsCaption,\n    ...rest\n  }: LightboxProps) => {\n    const lang = useLang();\n    let dialog = _state.raw<HTMLDialogElement | null>(null);\n    let viewport = _state.raw<HTMLElement | null>(null);\n    // 当前图片的原始大小（加载后知道）与旋转（0、90、180、270）\n    let natural = _state<{ width: number; height: number } | null>(null);\n    let rotation = _state(0);\n    let release: (() => void) | undefined;\n    let closing: keyof OpenChangeReasons | undefined;\n    const setOpen = openSetter(\n      () => open,\n      (next) => (open = next),\n      () => onOpenChange,\n    );\n\n    const current = () => items[clamp(index, 0, Math.max(0, items.length - 1))];\n    /** 旋转之后图片占的框 */\n    const box = () => {\n      if (!natural) return { width: 0, height: 0 };\n      const sideways = rotation % 180 !== 0;\n      return sideways\n        ? { width: natural.height, height: natural.width }\n        : { width: natural.width, height: natural.height };\n    };\n\n    const view = usePanZoom({\n      viewport: () => viewport,\n      min: 0.05,\n      max: 8,\n      bounds: () => (natural ? box() : undefined),\n      initial: () => ({ x: 0, y: 0, scale: 1 }),\n    });\n\n    /** 整张图放进视口（不超过原大）：打开、换一张、旋转之后 */\n    function fitImage() {\n      if (!natural) return;\n      view.fit(box(), 24);\n    }\n\n    function go(step: 1 | -1) {\n      if (items.length < 2) return;\n      const next = index + step;\n      if (next < 0 || next >= items.length) {\n        if (!loop) return;\n        index = (next + items.length) % items.length;\n      } else index = next;\n    }\n\n    function rotate(step: 1 | -1) {\n      rotation = (rotation + step * 90 + 360) % 360;\n      void nextTick(fitImage);\n    }\n\n    function reset() {\n      rotation = 0;\n      void nextTick(fitImage);\n    }\n\n    function onLoad(event: Event) {\n      const image = event.currentTarget as HTMLImageElement;\n      natural = { width: image.naturalWidth, height: image.naturalHeight };\n      void nextTick(fitImage);\n    }\n\n    function onKeydown(event: KeyboardEvent) {\n      if (event.altKey || event.ctrlKey || event.metaKey) return;\n      if (event.key === 'ArrowLeft' || event.key === 'ArrowRight') {\n        // 从右到左排版时左右对调\n        const rtl = dialog ? getComputedStyle(dialog).direction === 'rtl' : false;\n        go((event.key === 'ArrowRight') !== rtl ? 1 : -1);\n        event.preventDefault();\n      } else if (event.key === 'r' || event.key === 'R') {\n        rotate(1);\n        event.preventDefault();\n      }\n    }\n\n    function close() {\n      closing = 'close';\n      dialog?.close();\n    }\n\n    // 不论怎么关上（Esc、关闭按钮、open 改成 false），原生 close 事件都会来\n    function onClose() {\n      release?.();\n      release = undefined;\n      const reason = closing ?? 'escape';\n      closing = undefined;\n      setOpen(false, reason);\n    }\n\n    // 换一张：原图大小重新量，方向回正\n    _effect(() => {\n      void current()?.src;\n      natural = null;\n      rotation = 0;\n    });\n    _effect(() => {\n      if (open && dialog && !dialog.open) {\n        release = openModalDialog(dialog);\n        void nextTick(() => viewport?.focus());\n      } else if (!open && dialog?.open) dialog.close();\n    });\n    // 预先加载前后两张：切换时不闪\n    _effect(() => {\n      if (!open) return;\n      for (const step of [-1, 1]) {\n        const neighbour = items[index + step];\n        if (neighbour) new Image().src = neighbour.src;\n      }\n    });\n    onBeforeUnmount(() => release?.());\n\n    const button = (props: Partial<IconButtonProps>) =>\n      mergePartProps<IconButtonProps>(\n        {\n          icon: X,\n          variant: 'ghost',\n          tone: 'neutral',\n          sx: lightboxStyles.button,\n          'aria-label': '',\n        },\n        propsButton,\n        props,\n      );\n\n    return () => {\n      const item = current();\n      const total = items.length;\n      const { width, height } = box();\n      const canDownload = item && item.download !== false;\n      return (\n        <dialog\n          {...mergeAttrs<'dialog'>({ sx: [lightboxStyles.root, transitions.backdrop] }, rest, {\n            ref: _toRef(dialog),\n            'aria-label': lang.lightboxLabel,\n            onClose,\n            onKeydown,\n          })}\n        >\n          <div {...css.attrs(lightboxStyles.toolbar)}>\n            <span {...css.attrs(lightboxStyles.counter)} aria-live=\"polite\">\n              {total > 1 ? lang.lightboxCounter(index + 1, total) : ''}\n            </span>\n            <IconButton\n              {...button({\n                icon: ZoomOut,\n                'aria-label': lang.lightboxZoomOut,\n                onClick: () => view.zoomOut(),\n              })}\n            />\n            <span {...css.attrs(lightboxStyles.zoom)} aria-hidden=\"true\">\n              {Math.round(view.scale * 100)}%\n            </span>\n            <IconButton\n              {...button({\n                icon: ZoomIn,\n                'aria-label': lang.lightboxZoomIn,\n                onClick: () => view.zoomIn(),\n              })}\n            />\n            <IconButton\n              {...button({\n                icon: RotateCcw,\n                'aria-label': lang.lightboxRotateLeft,\n                onClick: () => rotate(-1),\n              })}\n            />\n            <IconButton\n              {...button({\n                icon: RotateCw,\n                'aria-label': lang.lightboxRotateRight,\n                onClick: () => rotate(1),\n              })}\n            />\n            <IconButton\n              {...button({ icon: Undo2, 'aria-label': lang.lightboxReset, onClick: reset })}\n            />\n            {canDownload && (\n              <IconLinkButton\n                {...mergePartProps<IconLinkButtonProps>(\n                  {\n                    icon: Download,\n                    variant: 'ghost',\n                    tone: 'neutral',\n                    sx: lightboxStyles.button,\n                    'aria-label': lang.lightboxDownload,\n                    href: item.src,\n                  },\n                  // 下载而不是打开：download 是文件名，空字符串时用地址里的名字\n                  { download: item.download ?? '' } as Partial<IconLinkButtonProps>,\n                )}\n              />\n            )}\n            <IconButton\n              {...button({\n                icon: X,\n                'aria-label': lang.close,\n                onClick: close,\n              })}\n            />\n          </div>\n          <div\n            {...mergeAttrs<'div'>({ sx: lightboxStyles.viewport }, propsViewport, {\n              ...view.viewportProps,\n              ref: _toRef(viewport),\n              tabindex: 0,\n              role: 'img',\n              'aria-label': item?.alt,\n            })}\n          >\n            {item && (\n              <div\n                {...css.attrs(\n                  lightboxStyles.content,\n                  !view.interacting && lightboxStyles.smooth,\n                  lightboxDynamicStyles.transform(view.transform),\n                  lightboxDynamicStyles.box(width, height),\n                )}\n              >\n                <img\n                  key={item.src}\n                  src={item.src}\n                  alt=\"\"\n                  draggable={false}\n                  onLoad={onLoad}\n                  {...css.attrs(\n                    lightboxStyles.image,\n                    natural && lightboxDynamicStyles.image(natural.width, natural.height, rotation),\n                  )}\n                />\n              </div>\n            )}\n          </div>\n          {total > 1 && (loop || index > 0) && (\n            <IconButton\n              {...button({\n                icon: ChevronLeft,\n                propsIcon: { flipInRtl: true },\n                radius: 'full',\n                sx: [lightboxStyles.button, lightboxStyles.side, lightboxStyles.previous],\n                'aria-label': lang.lightboxPrevious,\n                onClick: () => go(-1),\n              })}\n            />\n          )}\n          {total > 1 && (loop || index < total - 1) && (\n            <IconButton\n              {...button({\n                icon: ChevronRight,\n                propsIcon: { flipInRtl: true },\n                radius: 'full',\n                sx: [lightboxStyles.button, lightboxStyles.side, lightboxStyles.next],\n                'aria-label': lang.lightboxNext,\n                onClick: () => go(1),\n              })}\n            />\n          )}\n          {item?.caption != null && (\n            <div {...mergeAttrs<'div'>({ sx: lightboxStyles.caption }, propsCaption)}>\n              {item.caption}\n            </div>\n          )}\n        </dialog>\n      );\n    };\n  },\n);\n"],"mappings":"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"}
+{"version":3,"file":"Lightbox.js","names":["_vtp_bindable","_vtp_readonlyProp","_vtp_restProps","_vue_shallowRef","_vue_ref","_createVNode","_mergeProps","_createTextVNode"],"sources":["../../src/overlay/Lightbox.tsx"],"sourcesContent":["/**\n * 图片预览（全屏的模态 dialog）：深色背景上看大图——缩放、拖动、旋转、还原、下载，几张图时左右切换。\n * Image 的 preview 打开它（同一个 ImageGroup 里的图共用一个），也可以单独用。参考 Ant Design Image 的预览、Element Plus 的 image-viewer。\n *\n *   <Lightbox _open={viewing} _index={at} items={[{ src: '/photos/1.jpg', alt: '支架正面' }, …]} />\n *\n * - 平移与缩放建在 usePanZoom 上：拖动平移，滚轮、触控板、捏合以指针为中心缩放，双击放大 / 还原；\n *   打开或换一张时整张图放进视口（不超过原大）。旋转以 90° 为一档，转完重新放进视口。\n * - 键盘：← / → 上一张、下一张，+ / − 缩放，0 还原，R 向右旋转，Esc 关闭；焦点在工具栏与图片区之间循环（模态）。\n * - 读屏：dialog 的名称是“图片预览”，图片区是 role=\"img\"、名称是图片的 alt；换一张时念出“第 2 张，共 5 张”。\n *\n * 部件：Root（dialog）、Toolbar（div）、Counter（span）、Viewport（div）、Image（img）、Previous、Next（IconButton）、Caption（div）。\n */\nimport {\n  ChevronLeft,\n  ChevronRight,\n  Download,\n  RotateCcw,\n  RotateCw,\n  Undo2,\n  X,\n  ZoomIn,\n  ZoomOut,\n} from '@lucide/icons';\nimport { _component } from '@zerodep-dev/vue-tsx-pro-tsx';\nimport { css } from '@zerodep-dev/vue-tsx-pro-tsx/styles';\nimport { nextTick, onBeforeUnmount, type VNodeChild } from 'vue';\nimport { IconButton, type IconButtonProps } from '../base/IconButton';\nimport { IconLinkButton, type IconLinkButtonProps } from '../base/IconLinkButton';\nimport { useLang } from '../config/context';\nimport { clamp } from '../utils/data/number';\nimport { openSetter, type OpenChangeProps, type OpenChangeReasons } from '../utils/dom/open-change';\nimport { openModalDialog } from '../utils/dom/overlay';\nimport { usePanZoom } from '../utils/dom/pan-zoom';\nimport { mergeAttrs, mergePartProps, type PartProps } from '../utils/props';\nimport { transitions } from '../utils/style/transitions';\n\n/** 一张图 */\nexport interface LightboxItem {\n  /** 大图的地址 */\n  src: string;\n  /** 图片的说明（读屏念它） */\n  alt: string;\n  /** 图片下方的说明文字 */\n  caption?: VNodeChild;\n  /** 下载时的文件名；false 不显示下载按钮 */\n  download?: string | false;\n}\n\n/** 打开、关联由组件管理；未声明的属性落到 dialog 上 */\nexport interface LightboxProps\n  extends PartProps<'dialog', 'open' | 'aria-label' | 'aria-labelledby'>, OpenChangeProps {\n  /** 是否打开：父级写 _open={x}；Esc、关闭按钮会关上并写回 */\n  _open?: boolean;\n  /** 图片 */\n  items: readonly LightboxItem[];\n  /** 当前第几张，从 0 开始：父级可以写 _index={x} */\n  _index?: number;\n  /** 到头之后从另一头继续，默认 false */\n  loop?: boolean;\n  /** 工具栏按钮的部件属性 */\n  propsButton?: Partial<IconButtonProps>;\n  /** 图片区（视口）的部件属性 */\n  propsViewport?: PartProps<'div'>;\n  /** 说明文字的部件属性 */\n  propsCaption?: PartProps<'div'>;\n}\n\n/** Lightbox 的样式：root、toolbar、counter、viewport、content、image、side、previous、next、caption、button */\nexport const lightboxStyles = css.create({\n  root: {\n    // 占满视口：原生 dialog 默认有最大宽高与边框\n    boxSizing: 'border-box',\n    width: '100vw',\n    height: '100dvh',\n    maxWidth: 'none',\n    maxHeight: 'none',\n    margin: 0,\n    padding: 0,\n    borderWidth: 0,\n    display: { default: 'none', ':modal': 'flex' },\n    flexDirection: 'column',\n    // 图片预览总是深色背景：不跟主题变（看图片本身的颜色）\n    backgroundColor: 'rgb(0 0 0 / 0.86)',\n    color: 'white',\n    colorScheme: 'dark',\n  },\n  toolbar: {\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'flex-end',\n    gap: '_xs',\n    paddingBlock: '_sm',\n    paddingInline: '_md',\n    flexShrink: 0,\n  },\n  counter: {\n    marginInlineEnd: 'auto',\n    fontVariantNumeric: 'tabular-nums',\n    fontSize: '_sm',\n    opacity: 0.8,\n  },\n  zoom: {\n    minWidth: '3.5em',\n    textAlign: 'center',\n    fontSize: '_sm',\n    fontVariantNumeric: 'tabular-nums',\n  },\n  viewport: {\n    position: 'relative',\n    flexGrow: 1,\n    minHeight: 0,\n    overflow: 'hidden',\n    cursor: { default: 'grab', ':active': 'grabbing' },\n    outline: 'none',\n  },\n  // 平移与缩放作用在它上面（transform-origin 左上角）；它的大小是旋转之后图片占的框\n  content: { position: 'absolute', top: 0, left: 0, transformOrigin: '0 0' },\n  // 图片以框的中心旋转\n  image: {\n    position: 'absolute',\n    top: '50%',\n    left: '50%',\n    maxWidth: 'none',\n    userSelect: 'none',\n    pointerEvents: 'none',\n  },\n  smooth: { transitionProperty: 'transform', transitionDuration: '_md' },\n  side: {\n    position: 'absolute',\n    top: '50%',\n    translate: '0 -50%',\n    zIndex: 1,\n  },\n  previous: { insetInlineStart: '_md' },\n  next: { insetInlineEnd: '_md' },\n  caption: {\n    flexShrink: 0,\n    paddingBlock: '_md',\n    paddingInline: '_xl',\n    textAlign: 'center',\n    fontSize: '_sm',\n    opacity: 0.9,\n  },\n  // 深色背景上的按钮：文字白色，悬停时浅一点的底\n  button: {\n    color: 'white',\n    backgroundColor: { default: 'transparent', ':hover': 'rgb(255 255 255 / 0.12)' },\n  },\n});\n\n/** Lightbox 的动态样式：平移缩放、框的大小、图片的大小与旋转 */\nexport const lightboxDynamicStyles = css.create({\n  transform: (transform: string) => ({ transform }),\n  box: (width: number, height: number) => ({ width: `${width}px`, height: `${height}px` }),\n  image: (width: number, height: number, degrees: number) => ({\n    width: `${width}px`,\n    height: `${height}px`,\n    transform: `translate(-50%, -50%) rotate(${degrees}deg)`,\n  }),\n});\n\n/** 图片预览：全屏 dialog，缩放、拖动、旋转、左右切换 */\nexport const Lightbox = _component(\n  ({\n    _open: open = _bindable(false),\n    onOpenChange,\n    items,\n    _index: index = _bindable(0),\n    loop = false,\n    propsButton,\n    propsViewport,\n    propsCaption,\n    ...rest\n  }: LightboxProps) => {\n    const lang = useLang();\n    let dialog = _state.raw<HTMLDialogElement | null>(null);\n    let viewport = _state.raw<HTMLElement | null>(null);\n    // 当前图片的原始大小（加载后知道）与旋转（0、90、180、270）\n    let natural = _state<{ width: number; height: number } | null>(null);\n    let rotation = _state(0);\n    let release: (() => void) | undefined;\n    let closing: keyof OpenChangeReasons | undefined;\n    const setOpen = openSetter(\n      () => open,\n      (next) => (open = next),\n      () => onOpenChange,\n    );\n\n    const current = () => items[clamp(index, 0, Math.max(0, items.length - 1))];\n    /** 旋转之后图片占的框 */\n    const box = () => {\n      if (!natural) return { width: 0, height: 0 };\n      const sideways = rotation % 180 !== 0;\n      return sideways\n        ? { width: natural.height, height: natural.width }\n        : { width: natural.width, height: natural.height };\n    };\n\n    const view = usePanZoom({\n      viewport: () => viewport,\n      min: 0.05,\n      max: 8,\n      bounds: () => (natural ? box() : undefined),\n      initial: () => ({ x: 0, y: 0, scale: 1 }),\n    });\n\n    /** 整张图放进视口（不超过原大）：打开、换一张、旋转之后 */\n    function fitImage() {\n      if (!natural) return;\n      view.fit(box(), 24);\n    }\n\n    function go(step: 1 | -1) {\n      if (items.length < 2) return;\n      const next = index + step;\n      if (next < 0 || next >= items.length) {\n        if (!loop) return;\n        index = (next + items.length) % items.length;\n      } else index = next;\n    }\n\n    function rotate(step: 1 | -1) {\n      rotation = (rotation + step * 90 + 360) % 360;\n      void nextTick(fitImage);\n    }\n\n    function reset() {\n      rotation = 0;\n      void nextTick(fitImage);\n    }\n\n    function onLoad(event: Event) {\n      const image = event.currentTarget as HTMLImageElement;\n      natural = { width: image.naturalWidth, height: image.naturalHeight };\n      void nextTick(fitImage);\n    }\n\n    function onKeydown(event: KeyboardEvent) {\n      if (event.altKey || event.ctrlKey || event.metaKey) return;\n      if (event.key === 'ArrowLeft' || event.key === 'ArrowRight') {\n        // 从右到左排版时左右对调\n        const rtl = dialog ? getComputedStyle(dialog).direction === 'rtl' : false;\n        go((event.key === 'ArrowRight') !== rtl ? 1 : -1);\n        event.preventDefault();\n      } else if (event.key === 'r' || event.key === 'R') {\n        rotate(1);\n        event.preventDefault();\n      }\n    }\n\n    function close() {\n      closing = 'close';\n      dialog?.close();\n    }\n\n    // 不论怎么关上（Esc、关闭按钮、open 改成 false），原生 close 事件都会来\n    function onClose() {\n      release?.();\n      release = undefined;\n      const reason = closing ?? 'escape';\n      closing = undefined;\n      setOpen(false, reason);\n    }\n\n    // 换一张：原图大小重新量，方向回正\n    _effect(() => {\n      void current()?.src;\n      natural = null;\n      rotation = 0;\n    });\n    _effect(() => {\n      if (open && dialog && !dialog.open) {\n        release = openModalDialog(dialog);\n        void nextTick(() => viewport?.focus());\n      } else if (!open && dialog?.open) dialog.close();\n    });\n    // 预先加载前后两张：切换时不闪\n    _effect(() => {\n      if (!open) return;\n      for (const step of [-1, 1]) {\n        const neighbour = items[index + step];\n        if (neighbour) new Image().src = neighbour.src;\n      }\n    });\n    onBeforeUnmount(() => release?.());\n\n    const button = (props: Partial<IconButtonProps>) =>\n      mergePartProps<IconButtonProps>(\n        {\n          icon: X,\n          variant: 'ghost',\n          tone: 'neutral',\n          sx: lightboxStyles.button,\n          'aria-label': '',\n        },\n        propsButton,\n        props,\n      );\n\n    return () => {\n      const item = current();\n      const total = items.length;\n      const { width, height } = box();\n      const canDownload = item && item.download !== false;\n      return (\n        <dialog\n          {...mergeAttrs<'dialog'>({ sx: [lightboxStyles.root, transitions.backdrop] }, rest, {\n            ref: _toRef(dialog),\n            'aria-label': lang.lightboxLabel,\n            onClose,\n            onKeydown,\n          })}\n        >\n          <div {...css.attrs(lightboxStyles.toolbar)}>\n            <span {...css.attrs(lightboxStyles.counter)} aria-live=\"polite\">\n              {total > 1 ? lang.lightboxCounter(index + 1, total) : ''}\n            </span>\n            <IconButton\n              {...button({\n                icon: ZoomOut,\n                'aria-label': lang.lightboxZoomOut,\n                onClick: () => view.zoomOut(),\n              })}\n            />\n            <span {...css.attrs(lightboxStyles.zoom)} aria-hidden=\"true\">\n              {Math.round(view.scale * 100)}%\n            </span>\n            <IconButton\n              {...button({\n                icon: ZoomIn,\n                'aria-label': lang.lightboxZoomIn,\n                onClick: () => view.zoomIn(),\n              })}\n            />\n            <IconButton\n              {...button({\n                icon: RotateCcw,\n                'aria-label': lang.lightboxRotateLeft,\n                onClick: () => rotate(-1),\n              })}\n            />\n            <IconButton\n              {...button({\n                icon: RotateCw,\n                'aria-label': lang.lightboxRotateRight,\n                onClick: () => rotate(1),\n              })}\n            />\n            <IconButton\n              {...button({ icon: Undo2, 'aria-label': lang.lightboxReset, onClick: reset })}\n            />\n            {canDownload && (\n              <IconLinkButton\n                {...mergePartProps<IconLinkButtonProps>(\n                  {\n                    icon: Download,\n                    variant: 'ghost',\n                    tone: 'neutral',\n                    sx: lightboxStyles.button,\n                    'aria-label': lang.lightboxDownload,\n                    href: item.src,\n                  },\n                  // 下载而不是打开：download 是文件名，空字符串时用地址里的名字\n                  { download: item.download ?? '' } as Partial<IconLinkButtonProps>,\n                )}\n              />\n            )}\n            <IconButton\n              {...button({\n                icon: X,\n                'aria-label': lang.close,\n                onClick: close,\n              })}\n            />\n          </div>\n          <div\n            {...mergeAttrs<'div'>({ sx: lightboxStyles.viewport }, propsViewport, {\n              ...view.viewportProps,\n              ref: _toRef(viewport),\n              tabindex: 0,\n              role: 'img',\n              'aria-label': item?.alt,\n            })}\n          >\n            {item && (\n              <div\n                {...css.attrs(\n                  lightboxStyles.content,\n                  !view.interacting && lightboxStyles.smooth,\n                  lightboxDynamicStyles.transform(view.transform),\n                  lightboxDynamicStyles.box(width, height),\n                )}\n              >\n                <img\n                  key={item.src}\n                  src={item.src}\n                  alt=\"\"\n                  draggable={false}\n                  onLoad={onLoad}\n                  {...css.attrs(\n                    lightboxStyles.image,\n                    natural && lightboxDynamicStyles.image(natural.width, natural.height, rotation),\n                  )}\n                />\n              </div>\n            )}\n          </div>\n          {total > 1 && (loop || index > 0) && (\n            <IconButton\n              {...button({\n                icon: ChevronLeft,\n                propsIcon: { flipInRtl: true },\n                radius: 'full',\n                sx: [lightboxStyles.button, lightboxStyles.side, lightboxStyles.previous],\n                'aria-label': lang.lightboxPrevious,\n                onClick: () => go(-1),\n              })}\n            />\n          )}\n          {total > 1 && (loop || index < total - 1) && (\n            <IconButton\n              {...button({\n                icon: ChevronRight,\n                propsIcon: { flipInRtl: true },\n                radius: 'full',\n                sx: [lightboxStyles.button, lightboxStyles.side, lightboxStyles.next],\n                'aria-label': lang.lightboxNext,\n                onClick: () => go(1),\n              })}\n            />\n          )}\n          {item?.caption != null && (\n            <div {...mergeAttrs<'div'>({ sx: lightboxStyles.caption }, propsCaption)}>\n              {item.caption}\n            </div>\n          )}\n        </dialog>\n      );\n    };\n  },\n);\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqEA,IAAa,iBAAiB,IAAI,OAAO;CACvC,MAAM;EAEJ,WAAW;EACX,OAAO;EACP,QAAQ;EACR,UAAU;EACV,WAAW;EACX,QAAQ;EACR,SAAS;EACT,aAAa;EACb,SAAS;GAAE,SAAS;GAAQ,UAAU;EAAO;EAC7C,eAAe;EAEf,iBAAiB;EACjB,OAAO;EACP,aAAa;CACf;CACA,SAAS;EACP,SAAS;EACT,YAAY;EACZ,gBAAgB;EAChB,KAAK;EACL,cAAc;EACd,eAAe;EACf,YAAY;CACd;CACA,SAAS;EACP,iBAAiB;EACjB,oBAAoB;EACpB,UAAU;EACV,SAAS;CACX;CACA,MAAM;EACJ,UAAU;EACV,WAAW;EACX,UAAU;EACV,oBAAoB;CACtB;CACA,UAAU;EACR,UAAU;EACV,UAAU;EACV,WAAW;EACX,UAAU;EACV,QAAQ;GAAE,SAAS;GAAQ,WAAW;EAAW;EACjD,SAAS;CACX;CAEA,SAAS;EAAE,UAAU;EAAY,KAAK;EAAG,MAAM;EAAG,iBAAiB;CAAM;CAEzE,OAAO;EACL,UAAU;EACV,KAAK;EACL,MAAM;EACN,UAAU;EACV,YAAY;EACZ,eAAe;CACjB;CACA,QAAQ;EAAE,oBAAoB;EAAa,oBAAoB;CAAM;CACrE,MAAM;EACJ,UAAU;EACV,KAAK;EACL,WAAW;EACX,QAAQ;CACV;CACA,UAAU,EAAE,kBAAkB,MAAM;CACpC,MAAM,EAAE,gBAAgB,MAAM;CAC9B,SAAS;EACP,YAAY;EACZ,cAAc;EACd,eAAe;EACf,WAAW;EACX,UAAU;EACV,SAAS;CACX;CAEA,QAAQ;EACN,OAAO;EACP,iBAAiB;GAAE,SAAS;GAAe,UAAU;EAA0B;CACjF;AACF,CAAC;;AAGD,IAAa,wBAAwB,IAAI,OAAO;CAC9C,YAAY,eAAuB,EAAE,UAAU;CAC/C,MAAM,OAAe,YAAoB;EAAE,OAAO,GAAG,MAAK;EAAM,QAAQ,GAAG,OAAM;CAAK;CACtF,QAAQ,OAAe,QAAgB,aAAqB;EAC1D,OAAO,GAAG,MAAK;EACf,QAAQ,GAAG,OAAM;EACjB,WAAW,gCAAgC,QAAO;CACpD;AACF,CAAC;;AAGD,IAAa,WAAW,0BACtB,QAAA,SAUqB;CAAA,MAAA,OAAAA,SAAA,QAAA,eATK,OAAK,KAAA,IAAA;CAAA,MAAA,eAAAC,aAAA,QAAA,cAAA;CAAA,MAAA,QAAAA,aAAA,QAAA,OAAA;CAAA,MAAA,QAAAD,SAAA,QAAA,gBAGH,GAAC,KAAA,IAAA;CAAA,MAAA,OAAAC,aAAA,QAAA,QACpB,KAAK;CAAA,MAAA,cAAAA,aAAA,QAAA,aAAA;CAAA,MAAA,gBAAAA,aAAA,QAAA,eAAA;CAAA,MAAA,eAAAA,aAAA,QAAA,cAAA;CAAA,MAIT,OAAIC,UAAA,QAAA,MAAA,IAAA;CAEP,MAAM,OAAO,QAAQ;CACrB,IAAI,SAAMC,WAAwC,IAAI;CACtD,IAAI,WAAQA,WAAkC,IAAI;CAElD,IAAI,UAAOC,IAAoD,IAAI;CACnE,IAAI,WAAQA,IAAU,CAAC;CACvB,IAAI;CACJ,IAAI;CACJ,MAAM,UAAU,iBACd,KAAA,QACC,SAAU,KAAA,QAAO,YAClB,aAAA,KACF;CAEA,MAAM,gBAAgB,MAAA,MAAM,MAAK,MAAA,OAAQ,GAAG,KAAK,IAAI,GAAG,MAAA,MAAM,SAAS,CAAC,CAAC;;CAEzE,MAAM,YAAY;EAChB,IAAI,CAAA,QAAA,OAAU,OAAO;GAAE,OAAO;GAAG,QAAQ;EAAE;EAE3C,OADiB,SAAA,QAAW,QAAQ,IAEhC;GAAE,OAAO,QAAA,MAAQ;GAAQ,QAAQ,QAAA,MAAQ;EAAM,IAC/C;GAAE,OAAO,QAAA,MAAQ;GAAO,QAAQ,QAAA,MAAQ;EAAO;CACrD;CAEA,MAAM,OAAO,WAAW;EACtB,gBAAU,SAAA;EACV,KAAK;EACL,KAAK;EACL,cAAe,QAAA,QAAU,IAAI,IAAI,KAAA;EACjC,gBAAgB;GAAE,GAAG;GAAG,GAAG;GAAG,OAAO;EAAE;CACzC,CAAC;;CAGD,SAAS,WAAW;EAClB,IAAI,CAAA,QAAA,OAAU;EACd,KAAK,IAAI,IAAI,GAAG,EAAE;CACpB;CAEA,SAAS,GAAG,MAAc;EACxB,IAAI,MAAA,MAAM,SAAS,GAAG;EACtB,MAAM,OAAO,MAAA,QAAQ;EACrB,IAAI,OAAO,KAAK,QAAQ,MAAA,MAAM,QAAQ;GACpC,IAAI,CAAA,KAAA,OAAO;GACX,MAAA,SAAS,OAAO,MAAA,MAAM,UAAU,MAAA,MAAM;EACxC,OAAO,MAAA,QAAQ;CACjB;CAEA,SAAS,OAAO,MAAc;EAC5B,SAAA,SAAY,SAAA,QAAW,OAAO,KAAK,OAAO;EAC1C,SAAc,QAAQ;CACxB;CAEA,SAAS,QAAQ;EACf,SAAA,QAAW;EACX,SAAc,QAAQ;CACxB;CAEA,SAAS,OAAO,OAAc;EAC5B,MAAM,QAAQ,MAAM;EACpB,QAAA,QAAU;GAAE,OAAO,MAAM;GAAc,QAAQ,MAAM;EAAc;EACnE,SAAc,QAAQ;CACxB;CAEA,SAAS,UAAU,OAAsB;EACvC,IAAI,MAAM,UAAU,MAAM,WAAW,MAAM,SAAS;EACpD,IAAI,MAAM,QAAQ,eAAe,MAAM,QAAQ,cAAc;GAE3D,MAAM,MAAM,OAAA,QAAS,iBAAgB,OAAA,KAAO,CAAC,CAAC,cAAc,QAAQ;GACpE,GAAI,MAAM,QAAQ,iBAAkB,MAAM,IAAI,EAAE;GAChD,MAAM,eAAe;EACvB,OAAO,IAAI,MAAM,QAAQ,OAAO,MAAM,QAAQ,KAAK;GACjD,OAAO,CAAC;GACR,MAAM,eAAe;EACvB;CACF;CAEA,SAAS,QAAQ;EACf,UAAU;EACV,OAAA,OAAQ,MAAM;CAChB;CAGA,SAAS,UAAU;EACjB,UAAU;EACV,UAAU,KAAA;EACV,MAAM,SAAS,WAAW;EAC1B,UAAU,KAAA;EACV,QAAQ,OAAO,MAAM;CACvB;CAGA,aAAc;EACZ,QAAa,CAAC,EAAE;EAChB,QAAA,QAAU;EACV,SAAA,QAAW;CACb,CAAC;CACD,aAAc;EACZ,IAAI,KAAA,SAAA,OAAA,SAAkB,CAAC,OAAA,MAAO,MAAM;GAClC,UAAU,gBAAe,OAAA,KAAO;GAChC,eAAoB,SAAA,OAAU,MAAM,CAAC;EACvC,OAAO,IAAI,CAAA,KAAA,SAAS,OAAA,OAAQ,MAAM,OAAA,MAAO,MAAM;CACjD,CAAC;CAED,aAAc;EACZ,IAAI,CAAA,KAAA,OAAO;EACX,KAAK,MAAM,QAAQ,CAAC,IAAI,CAAC,GAAG;GAC1B,MAAM,YAAY,MAAA,MAAM,MAAA,QAAQ;GAChC,IAAI,WAAW,IAAI,MAAM,CAAC,CAAC,MAAM,UAAU;EAC7C;CACF,CAAC;CACD,sBAAsB,UAAU,CAAC;CAEjC,MAAM,UAAU,UACd,eACE;EACE,MAAM;EACN,SAAS;EACT,MAAM;EACN,IAAI,eAAe;EACnB,cAAc;CAChB,GAAC,YAAA,OAED,KACF;CAEF,aAAa;EACX,MAAM,OAAO,QAAQ;EACrB,MAAM,QAAQ,MAAA,MAAM;EACpB,MAAM,EAAE,OAAO,WAAW,IAAI;EAC9B,MAAM,cAAc,QAAQ,KAAK,aAAa;EAC9C,OAAAC,YAAA,UAEQ,WAAqB,EAAE,IAAI,CAAC,eAAe,MAAM,YAAY,QAAQ,EAAE,GAAG,MAAM;GAClF,KAAG;GACH,cAAc,KAAK;GACnB;GACA;EACF,CAAC,GAAC;GAAAA,YAAA,OAEO,IAAI,MAAM,eAAe,OAAO,GAAC;IAAAA,YAAA,QAAAC,cAC9B,IAAI,MAAM,eAAe,OAAO,GAAC,EAAA,aAAA,SAAA,CAAA,GAAA,CACxC,QAAQ,IAAI,KAAK,gBAAgB,MAAA,QAAQ,GAAG,KAAK,IAAI,EAAE,CAAA;IAAAD,YAAA,YAGpD,OAAO;KACT,MAAM;KACN,cAAc,KAAK;KACnB,eAAe,KAAK,QAAQ;IAC9B,CAAC,GAAC,IAAA;IAAAA,YAAA,QAAAC,cAEM,IAAI,MAAM,eAAe,IAAI,GAAC,EAAA,eAAA,OAAA,CAAA,GAAA,CACrC,KAAK,MAAM,KAAK,QAAQ,GAAG,GAACC,gBAAA,GAAA,CAAA,CAAA;IAAAF,YAAA,YAGzB,OAAO;KACT,MAAM;KACN,cAAc,KAAK;KACnB,eAAe,KAAK,OAAO;IAC7B,CAAC,GAAC,IAAA;IAAAA,YAAA,YAGE,OAAO;KACT,MAAM;KACN,cAAc,KAAK;KACnB,eAAe,OAAO,EAAE;IAC1B,CAAC,GAAC,IAAA;IAAAA,YAAA,YAGE,OAAO;KACT,MAAM;KACN,cAAc,KAAK;KACnB,eAAe,OAAO,CAAC;IACzB,CAAC,GAAC,IAAA;IAAAA,YAAA,YAGE,OAAO;KAAE,MAAM;KAAO,cAAc,KAAK;KAAe,SAAS;IAAM,CAAC,GAAC,IAAA;IAE9E,eAAWA,YAAA,gBAEJ,eACF;KACE,MAAM;KACN,SAAS;KACT,MAAM;KACN,IAAI,eAAe;KACnB,cAAc,KAAK;KACnB,MAAM,KAAK;IACb,GAEA,EAAE,UAAU,KAAK,YAAY,GAAG,CAClC,GAAC,IAAA;IAEJA,YAAA,YAEK,OAAO;KACT,MAAM;KACN,cAAc,KAAK;KACnB,SAAS;IACX,CAAC,GAAC,IAAA;GAAA,CAAA;GAAAA,YAAA,OAIA,WAAkB,EAAE,IAAI,eAAe,SAAS,GAAC,cAAA,OAAiB;IACpE,GAAG,KAAK;IACR,KAAG;IACH,UAAU;IACV,MAAM;IACN,cAAc,MAAM;GACtB,CAAC,GAAC,CAED,QAAIA,YAAA,OAEG,IAAI,MACN,eAAe,SAAO,IAAA,aACtB,CAAC,KAAK,eAAe,eAAe,QAAM,IAAA,GAAA,IAAA,KAC1C,sBAAsB,iBAAS,CAAC,KAAK,SAAS,GAAA,IAAA,GAAA,IAAA,KAC9C,sBAAsB,WAAG,CAAC,OAAO,MAAM,CAAA,CACzC,GAAC,CAAAA,YAAA,OAAAC,cAAA;IAAA,OAGM,KAAK;IAAG,OACR,KAAK;IAAG,OAAA;IAAA,aAEF;IAAK,UACR;GAAM,GACV,IAAI,MACN,eAAe,OACf,QAAA,SAAA,IAAA,KAAW,sBAAsB,aAAK;IAAC,QAAA,MAAQ;IAAO,QAAA,MAAQ;IAAM,SAAA;GAAA,GAAA,IAAA,CACtE,CAAC,GAAA,IAAA,CAAA,CAAA,CAGN,CAAA;GAEF,QAAQ,MAAM,KAAA,SAAQ,MAAA,QAAQ,MAAED,YAAA,YAEzB,OAAO;IACT,MAAM;IACN,WAAW,EAAE,WAAW,KAAK;IAC7B,QAAQ;IACR,IAAI;KAAC,eAAe;KAAQ,eAAe;KAAM,eAAe;IAAQ;IACxE,cAAc,KAAK;IACnB,eAAe,GAAG,EAAE;GACtB,CAAC,GAAC,IAAA;GAGL,QAAQ,MAAM,KAAA,SAAQ,MAAA,QAAQ,QAAQ,MAAEA,YAAA,YAEjC,OAAO;IACT,MAAM;IACN,WAAW,EAAE,WAAW,KAAK;IAC7B,QAAQ;IACR,IAAI;KAAC,eAAe;KAAQ,eAAe;KAAM,eAAe;IAAI;IACpE,cAAc,KAAK;IACnB,eAAe,GAAG,CAAC;GACrB,CAAC,GAAC,IAAA;GAGL,MAAM,WAAW,QAAIA,YAAA,OACX,WAAkB,EAAE,IAAI,eAAe,QAAQ,GAAC,aAAA,KAAc,GAAC,CACrE,KAAK,OAAO,CAAA;EAEhB,CAAA;CAGP;AACF,GAAC;CAAA,MAAA;CAAA,OAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;CAAA;AAAA,CACH"}

package/dist/overlay/Menu.d.ts

@@ -1,4 +1,4 @@
-import * as css from '@zerodep-dev/vue-tsx-pro-tsx/styles';
+import { css } from '@zerodep-dev/vue-tsx-pro-tsx/styles';
 import type { SxStyles } from '@zerodep-dev/vue-tsx-pro-tsx/styles';
 import { type VNodeChild } from 'vue';
 import { type IconData, type IconProps } from '../base/Icon';

package/dist/overlay/Menu.js

@@ -19,7 +19,7 @@ import { itemStyles } from "../utils/style/item-styles.js";
 import { rovingFocus } from "../utils/dom/roving-focus.js";
 import { Fragment, createVNode, isVNode, onBeforeUnmount, shallowRef, useId } from "vue";
 import { _component, bindable, childrenProp, childrenStable, createContext, effect, forwardChildren, mergeJsxProps, readonlyProp, restProps } from "@zerodep-dev/vue-tsx-pro-tsx";
-import * as css from "@zerodep-dev/vue-tsx-pro-tsx/styles";
+import { css } from "@zerodep-dev/vue-tsx-pro-tsx/styles";
 import { Check, ChevronRight, Dot } from "@lucide/icons";
 //#region src/overlay/Menu.tsx
 /**

package/dist/overlay/Menu.js.map

@@ -1 +1 @@
-{"version":3,"file":"Menu.js","names":["_isVNode","Menu","_vtp_bindable","_vtp_readonlyProp","_vtp_childrenProp","_vtp_restProps","_vue_shallowRef","_createVNode","_Fragment","_mergeProps","_vtp_childrenStable","Text","_vtp_forwardChildren"],"sources":["../../src/overlay/Menu.tsx"],"sourcesContent":["/**\n * 菜单（WAI-ARIA 的 Menu Button 模式）：按钮弹出一列操作，复合组件，参考 Radix DropdownMenu、React Aria Menu。\n *\n *   <Menu trigger={(props) => <Button {...props} iconEnd={ChevronDown}>操作</Button>}>\n *     <MenuItem icon={Pencil} onAction={edit}>编辑</MenuItem>\n *     <MenuItem icon={Copy} shortcut=\"Ctrl+D\" onAction={duplicate}>复制</MenuItem>\n *     <Separator decorative={false} />\n *     <MenuGroup label=\"视图\">\n *       <MenuCheckboxItem _checked={showGrid}>显示网格</MenuCheckboxItem>\n *     </MenuGroup>\n *     <MenuRadioGroup _value={sort} label=\"排序\">\n *       <MenuRadioItem value=\"name\">名称</MenuRadioItem>\n *       <MenuRadioItem value=\"date\">日期</MenuRadioItem>\n *     </MenuRadioGroup>\n *     <MenuLinkItem href=\"/settings\">设置</MenuLinkItem>\n *     <MenuItem icon={Trash2} tone=\"danger\" onAction={remove}>删除</MenuItem>\n *   </Menu>\n *\n * 键盘：触发器上 Enter / 空格 / ↓ 打开并聚焦第一项，↑ 打开并聚焦最后一项；菜单里 ↑↓ 移动（循环）、Home / End、\n * 按字母跳到以它开头的项（rovingFocus 的 typeahead），Enter / 空格执行，Esc 关闭并回到触发器，Tab 关闭并继续往后。\n * 执行普通项后关闭菜单；复选项默认不关（常连续勾选几项），单选项默认关闭；都可以用 closeOnSelect 改。\n * 原生 popover=\"auto\" 负责顶层、点击外部关闭与嵌套顺序，定位与焦点进出见 utils/dom/floating。\n */\nimport { Check, ChevronRight, Dot } from '@lucide/icons';\nimport { createContext, _component } from '@zerodep-dev/vue-tsx-pro-tsx';\nimport * as css from '@zerodep-dev/vue-tsx-pro-tsx/styles';\nimport type { SxStyles } from '@zerodep-dev/vue-tsx-pro-tsx/styles';\nimport { onBeforeUnmount, useId, type VNodeChild } from 'vue';\nimport { ButtonBase, type ButtonBaseProps } from '../base/ButtonBase';\nimport { Icon, type IconData, type IconProps } from '../base/Icon';\nimport { Text, type TextProps } from '../base/Text';\nimport {\n  floatingStyles,\n  pointAnchor,\n  useAnchoredPopover,\n  type FloatingOptions,\n  type FloatingPlacement,\n} from '../utils/dom/floating';\nimport { ariaKeyShortcut, formatHotkey, useHotkeys } from '../utils/dom/hotkeys';\nimport { ScrollArea } from '../layout/ScrollArea';\nimport { useRouterLink } from '../utils/dom/link';\nimport { toElement } from '../utils/dom/element';\nimport { useLazyContent, type LazyContentOptions } from '../utils/motion/presence';\nimport { childNodes } from '../utils/data/text';\nimport {\n  hasContent,\n  defaultLabelledBy,\n  mergeAttrs,\n  mergePartProps,\n  type PartProps,\n  type TriggerProps,\n} from '../utils/props';\nimport { itemStyles } from '../utils/style/item-styles';\nimport { focusRingStyles } from '../utils/style/styles';\nimport { rippleHostStyles, useRipple } from '../utils/dom/ripple';\nimport { openSetter, type OpenChangeProps } from '../utils/dom/open-change';\nimport { rovingFocus } from '../utils/dom/roving-focus';\nimport { inlineArrows, isRtl } from '../utils/dom/direction';\nimport { fontSizeStyles, type TextSize } from '../utils/style/typography';\nimport { transitions } from '../utils/style/transitions';\n\n/** Menu 交给菜单项的状态 */\nexport interface MenuState {\n  /** 波纹；不写时沿用配置 */\n  readonly ripple: boolean | undefined;\n  /** 执行了一项：关闭菜单（onOpenChange 的原因是 select），焦点回到触发器 */\n  close(event?: Event): void;\n}\n\n/** Menu 的上下文：自定义菜单项用 useMenuItem 读取 */\nexport const MenuContext = createContext<MenuState>('Menu');\n\n/** MenuRadioGroup 交给组内单选项的状态 */\nexport interface MenuRadioGroupState {\n  /** 选中的值 */\n  readonly value: string | undefined;\n  /** 选中一个值 */\n  select(value: string): void;\n}\n\n/** MenuRadioGroup 的上下文 */\nexport const MenuRadioGroupContext = createContext<MenuRadioGroupState>('MenuRadioGroup');\n\n/** 交给触发器的属性：展开到按钮上（`{...props}`） */\nexport interface MenuTriggerProps extends TriggerProps {\n  /** 菜单以触发器的文字作为名称（aria-labelledby） */\n  id: string;\n  /** 取得触发器元素：定位的参照、关闭后焦点回到这里 */\n  ref: (element: unknown) => void;\n  /** ↓ / ↑ 打开并聚焦第一项 / 最后一项 */\n  onKeydown: (event: KeyboardEvent) => void;\n  /** 告诉读屏这个按钮会打开菜单 */\n  'aria-haspopup': 'menu';\n}\n\n/** 未声明的属性落到菜单（role=\"menu\" 的 div）上 */\nexport interface MenuProps\n  extends\n    PartProps<'div', 'id' | 'popover' | 'role'>,\n    Pick<FloatingOptions, 'offset'>,\n    LazyContentOptions,\n    OpenChangeProps {\n  /** 是否打开：父级可以写 _open={x}；Esc、点击外部、执行菜单项都会关闭并写回 */\n  _open?: boolean;\n  /** 弹出位置，默认 bottom-start；空间不够时自动翻转 */\n  placement?: FloatingPlacement;\n  /** 字号档位，菜单项随之缩放；不写时继承上下文字号 */\n  size?: TextSize;\n  /** 菜单项按下时的波纹；不写时沿用 createUi / Provider 的 ripple */\n  ripple?: boolean;\n  /** 触发器：`(props) => <Button {...props}>操作</Button>`；ContextMenu 不用触发器时返回 null */\n  trigger: (props: MenuTriggerProps) => VNodeChild;\n  /** 从视口里这个点弹出（右键菜单的指针位置），不以触发器为锚点；关闭后焦点由使用方安排 */\n  point?: { x: number; y: number };\n  /** 菜单项：MenuItem、MenuLinkItem、MenuCheckboxItem、MenuRadioGroup、MenuGroup、MenuSub、Separator */\n  children?: VNodeChild;\n}\n\n/** 菜单项的选择器（漫游焦点、打开时聚焦第一项 / 最后一项） */\nconst ITEMS = '[role=\"menuitem\"], [role=\"menuitemcheckbox\"], [role=\"menuitemradio\"]';\n\n/** 菜单自己的可用项：不含子菜单里的 */\nfunction menuItemsOf(panel: HTMLElement | null): HTMLElement[] {\n  return [...(panel?.querySelectorAll<HTMLElement>(ITEMS) ?? [])].filter(\n    (item) =>\n      item.parentElement?.closest('[role=\"menu\"]') === panel &&\n      !item.matches(':disabled, [aria-disabled=\"true\"]'),\n  );\n}\n\n/** Menu 的样式：panel、content、label、indicator、hidden、shortcut、groupLabel */\nexport const menuStyles = css.create({\n  // 菜单项多时在 ScrollArea 里滚动（浮层滚动条）；内边距放在内容层上，滚动条贴着菜单边缘\n  panel: {\n    minWidth: '12em',\n    maxWidth: 'calc(100vw - 2em)',\n    lineHeight: '_normal',\n  },\n  content: { padding: '_xs' },\n  label: { flexGrow: 1, minWidth: 0 },\n  // 有说明时文字与说明上下排，作为一个整体占满剩余宽度\n  text: { display: 'flex', flexDirection: 'column', flexGrow: 1, minWidth: 0 },\n  description: { display: 'block' },\n  // 复选、单选的标记占一列，有没有勾都对齐\n  indicator: { flexShrink: 0, width: '1em' },\n  hidden: { visibility: 'hidden' },\n  shortcut: { flexShrink: 0, marginInlineStart: '_lg' },\n  groupLabel: {\n    display: 'block',\n    paddingBlock: '_xs',\n    paddingInline: '_sm',\n    fontWeight: '_semibold',\n  },\n});\n\n/** 菜单：触发器 + 弹出的一列菜单项 */\nexport const Menu = _component(\n  ({\n    _open: open = _bindable(false),\n    onOpenChange,\n    placement = 'bottom-start',\n    offset,\n    size,\n    ripple,\n    trigger,\n    point,\n    lazy = true,\n    children,\n    ...rest\n  }: MenuProps) => {\n    const id = useId();\n    // 菜单项的快捷键在菜单没打开时也要能用：有快捷键的菜单照常渲染菜单项\n    const showContent = useLazyContent(\n      () => open,\n      () => lazy,\n    );\n    const triggerId = `${id}-trigger`;\n    let anchor = _state.raw<HTMLElement | null>(null);\n    let panel = _state.raw<HTMLElement | null>(null);\n    // 打开时聚焦哪一项；Tab 关闭时焦点照常往后走，不还给触发器\n    let focusOnOpen: 'first' | 'last' = 'first';\n    let restoreFocus = true;\n\n    const enabledItems = () => menuItemsOf(panel);\n    const setOpen = openSetter(\n      () => open,\n      (next) => (open = next),\n      () => onOpenChange,\n    );\n\n    MenuContext.provide({\n      get ripple() {\n        return ripple;\n      },\n\n      close: (event) => setOpen(false, 'select', event),\n    });\n\n    function onTriggerKeydown(event: KeyboardEvent) {\n      if (event.key !== 'ArrowDown' && event.key !== 'ArrowUp') return;\n      event.preventDefault();\n      focusOnOpen = event.key === 'ArrowDown' ? 'first' : 'last';\n      setOpen(true, 'trigger', event);\n    }\n\n    function onPanelKeydown(event: KeyboardEvent) {\n      // Esc 也由原生 popover 关闭；这里显式关一次，不依赖各浏览器 close watcher 的细节（Firefox 偶尔不关）\n      if (event.key === 'Escape') {\n        event.preventDefault();\n        setOpen(false, 'escape', event);\n        return;\n      }\n      if (event.key !== 'Tab') return;\n      restoreFocus = false;\n      setOpen(false, 'focus', event);\n    }\n\n    const { onToggle } = useAnchoredPopover(\n      () => ({\n        open,\n        anchor: point ? pointAnchor(point.x, point.y) : anchor,\n        panel,\n        floating: { placement, offset, fitHeight: true },\n        restoreFocus,\n      }),\n      {\n        close: (reason, event) => setOpen(false, reason, event),\n        // 打开后聚焦第一项（↑ 打开时最后一项），并为下一次打开恢复默认\n        shown: () => {\n          const items = enabledItems();\n          (focusOnOpen === 'first' ? items[0] : items.at(-1))?.focus();\n          focusOnOpen = 'first';\n          restoreFocus = true;\n        },\n      },\n    );\n    _effect(() =>\n      panel\n        ? rovingFocus(panel, { items: ITEMS, orientation: 'vertical', loop: true, typeahead: true })\n        : undefined,\n    );\n\n    return () => (\n      <>\n        {trigger({\n          id: triggerId,\n          ref: (value) => (anchor = toElement(value)),\n          onClick: (event: MouseEvent) => setOpen(!open, 'trigger', event),\n          onKeydown: onTriggerKeydown,\n          'aria-haspopup': 'menu',\n          'aria-expanded': open,\n          'aria-controls': id,\n        })}\n        <div\n          {...mergeAttrs<'div'>(\n            {\n              sx: [\n                floatingStyles.anchored,\n                floatingStyles.surface,\n                floatingStyles.scrollPanel,\n                menuStyles.panel,\n                size && fontSizeStyles[size],\n                transitions.scale,\n              ],\n              // 右键菜单没有触发器：名称由使用方的 aria-label 给\n              'aria-labelledby': anchor ? defaultLabelledBy(rest, triggerId) : undefined,\n            },\n            rest,\n            {\n              ref: _toRef(panel),\n              id,\n              popover: 'auto',\n              role: 'menu',\n              onToggle,\n              onKeydown: onPanelKeydown,\n            },\n          )}\n          data-state={open ? 'open' : 'closed'}\n        >\n          <ScrollArea\n            focusable={false}\n            sx={floatingStyles.scrollArea}\n            propsContent={{ sx: menuStyles.content }}\n          >\n            {(showContent() || hasShortcut(children)) && children}\n          </ScrollArea>\n        </div>\n      </>\n    );\n  },\n);\n\n/** 菜单项内容（图标、文字、快捷键）的选项，各种菜单项共有 */\nexport interface MenuItemContentProps {\n  /** 文字前的图标 */\n  icon?: IconData;\n  /**\n   * 快捷键：`'Mod+D'`（Mod 在 macOS 上是 ⌘，其他系统是 Ctrl，写法见 useHotkeys）。右侧显示成当前系统的写法；\n   * MenuItem、MenuCheckboxItem、MenuRadioItem 在菜单挂载期间注册它（菜单不必打开），按下时执行这一项；\n   * 读屏从菜单项的 aria-keyshortcuts 得知快捷键\n   */\n  shortcut?: string;\n  /** 图标的部件属性 */\n  propsIcon?: Partial<IconProps>;\n  /** 文字层的部件属性 */\n  propsLabel?: PartProps<'span'>;\n  /** 快捷键提示的部件属性 */\n  propsShortcut?: Partial<TextProps>;\n  /** 文字下方的说明（第二行，弱化）：读屏把它当作这一项的描述（aria-describedby），不算进名称 */\n  description?: VNodeChild;\n  /** 说明的部件属性 */\n  propsDescription?: Partial<TextProps>;\n  children?: VNodeChild;\n}\n\n/** 复选、单选项的标记：占一列，没勾选时只占位，各项文字对齐 */\nexport interface MenuItemMark {\n  /** 勾选时显示的图标 */\n  icon: IconData;\n  /** 是否勾选 */\n  checked: boolean;\n  /** 标记图标的部件属性 */\n  props?: Partial<IconProps>;\n}\n\n/** 有说明的菜单项：文字与说明各自的 id（名称只取文字，说明作为描述） */\nexport interface MenuItemContentIds {\n  /** 文字的 id：菜单项的 aria-labelledby */\n  label: string;\n  /** 说明的 id：菜单项的 aria-describedby */\n  description: string;\n}\n\n/** 菜单项文字与说明的 id；在菜单项的 setup 里调用 */\nexport function useMenuItemContentIds(): MenuItemContentIds {\n  const id = useId();\n  return { label: `${id}-label`, description: `${id}-description` };\n}\n\n/** 有说明时菜单项的名称只取文字、说明作为描述；没有说明时名称就是全部内容 */\nexport function menuItemDescribedBy(description: VNodeChild | undefined, ids: MenuItemContentIds) {\n  return description == null\n    ? {}\n    : { 'aria-labelledby': ids.label, 'aria-describedby': ids.description };\n}\n\n/** 菜单项的内容：标记 + 图标 + 文字（与说明）+ 快捷键 */\nexport function menuItemContent(\n  {\n    icon,\n    shortcut,\n    description,\n    propsIcon,\n    propsLabel,\n    propsShortcut,\n    propsDescription,\n    children,\n  }: MenuItemContentProps,\n  mark?: MenuItemMark,\n  ids?: MenuItemContentIds,\n): VNodeChild {\n  return [\n    mark && (\n      <Icon\n        {...mergePartProps<IconProps>(\n          { icon: mark.icon, sx: [menuStyles.indicator, !mark.checked && menuStyles.hidden] },\n          mark.props,\n        )}\n      />\n    ),\n    icon && <Icon {...mergePartProps<IconProps>({ icon }, propsIcon)} />,\n    description == null ? (\n      <span {...mergeAttrs<'span'>({ sx: menuStyles.label }, propsLabel)}>{children}</span>\n    ) : (\n      <span {...css.attrs(menuStyles.text)}>\n        <span {...mergeAttrs<'span'>({ id: ids?.label }, propsLabel)}>{children}</span>\n        <Text\n          {...mergePartProps<TextProps>(\n            { tone: 'muted', size: 'sm', id: ids?.description, sx: menuStyles.description },\n            propsDescription,\n          )}\n        >\n          {description}\n        </Text>\n      </span>\n    ),\n    shortcut && (\n      <Text\n        {...mergePartProps<TextProps>(\n          { tone: 'muted', size: 'sm', sx: menuStyles.shortcut },\n          propsShortcut,\n          // 有 aria-keyshortcuts 时读屏从它念，显示的文字不重复念；序列键没有，照常念\n          { 'aria-hidden': keyShortcuts(shortcut) ? true : undefined },\n        )}\n      >\n        {formatHotkey(shortcut)}\n      </Text>\n    ),\n  ];\n}\n\n/** 快捷键交给读屏（aria-keyshortcuts）：右侧显示的快捷键文字对读屏隐藏，不重复念 */\nconst keyShortcuts = (shortcut: string | undefined) =>\n  shortcut ? ariaKeyShortcut(shortcut) : undefined;\n\n/** 菜单项的快捷键：不可用时不触发；按下时和点击这一项一样执行（不关心菜单是否打开） */\nfunction useItemShortcut(read: () => { shortcut?: string; disabled: boolean }, run: () => void) {\n  useHotkeys(() => {\n    const { shortcut, disabled } = read();\n    return shortcut && !disabled ? { [shortcut]: run } : {};\n  });\n}\n\n/** 菜单项的色调：菜单里只区分普通操作与破坏性操作，其余状态色会让一列选项显得像警报 */\nexport type MenuItemTone = 'neutral' | 'danger';\n\n/** 菜单项的外观：幽灵按钮，内容靠起始边排列 */\nexport function menuItemSx(tone: MenuItemTone, disabled: boolean): SxStyles {\n  return [\n    itemStyles.row,\n    tone === 'danger' ? itemStyles.danger : itemStyles.hoverable,\n    focusRingStyles.visible,\n    rippleHostStyles.host,\n    disabled && itemStyles.disabled,\n  ] as SxStyles;\n}\n\n/** 菜单项共用的：所在的菜单、按下的波纹（链接项用；按钮项由 ButtonBase 给出）、执行后关闭菜单 */\nexport function useMenuItem() {\n  const menu = MenuContext.inject();\n  return {\n    menu,\n    ripple: useRipple(() => menu.ripple),\n    close: (event?: Event) => menu.close(event),\n  };\n}\n\n/** 按钮类菜单项这一次渲染的取值 */\ninterface ButtonItemOptions {\n  role: 'menuitem' | 'menuitemcheckbox' | 'menuitemradio';\n  tone?: MenuItemTone;\n  disabled: boolean;\n  closeOnSelect: boolean;\n  /** 勾选与单选项的状态；普通项不写 */\n  checked?: boolean;\n  /** 勾选与单选项起始边的标记 */\n  indicator?: MenuItemMark;\n  content: MenuItemContentProps;\n  /** 使用方的其余属性，落到 button 上 */\n  attrs: object;\n}\n\n/**\n * 按钮类菜单项（MenuItem、MenuCheckboxItem、MenuRadioItem）共用的：快捷键、说明的关联、外观与角色，\n * 执行（点击、Enter、空格、快捷键）时调用 run，点击后按 closeOnSelect 关闭菜单。返回渲染函数\n */\nfunction useButtonItem(\n  read: () => { shortcut?: string; disabled: boolean },\n  run: () => void,\n): (options: ButtonItemOptions) => VNodeChild {\n  const item = useMenuItem();\n  const ids = useMenuItemContentIds();\n  useItemShortcut(read, run);\n  return ({\n    role,\n    tone = 'neutral',\n    disabled,\n    closeOnSelect,\n    checked,\n    indicator,\n    content,\n    attrs,\n  }) => (\n    <ButtonBase\n      {...mergePartProps<ButtonBaseProps>(\n        { sx: menuItemSx(tone, disabled), ripple: item.menu.ripple },\n        attrs as Partial<ButtonBaseProps>,\n        {\n          role,\n          disabled,\n          'aria-keyshortcuts': keyShortcuts(content.shortcut),\n          'aria-checked': checked,\n          ...menuItemDescribedBy(content.description, ids),\n          // 使用方的 onClick 先执行，preventDefault 可以拦下执行与关闭（mergeProps 的规则）\n          onClick: (event: MouseEvent) => {\n            run();\n            if (closeOnSelect) item.close(event);\n          },\n        },\n      )}\n      data-state={checked == null ? undefined : checked ? 'checked' : 'unchecked'}\n    >\n      {menuItemContent(content, indicator, ids)}\n    </ButtonBase>\n  );\n}\n\n/** 按钮类菜单项共有的属性；未声明的属性落到 button 上 */\nexport interface MenuButtonItemProps\n  // 原生的 onSelect 是文字选中事件，不是“选了这一项”：去掉它，误写成 onSelect 时类型检查会报错（用 onAction）\n  extends\n    PartProps<'button', 'role' | 'type' | 'disabled' | 'aria-checked' | 'onSelect'>,\n    MenuItemContentProps {\n  /** 不可用：跳过方向键移动，不能执行 */\n  disabled?: boolean;\n  /** 执行后是否关闭菜单 */\n  closeOnSelect?: boolean;\n}\n\n/** 未声明的属性落到 button（role=\"menuitem\"）上 */\nexport interface MenuItemProps extends MenuButtonItemProps {\n  /** 色调：删除等破坏性操作用 danger，默认 neutral */\n  tone?: MenuItemTone;\n  /** 执行（点击、Enter、空格）时调用；默认随后关闭菜单 */\n  onAction?: () => void;\n}\n\n/** 普通菜单项：执行一个操作 */\nexport const MenuItem = _component(\n  ({\n    tone = 'neutral',\n    disabled = false,\n    closeOnSelect = true,\n    onAction,\n    icon,\n    shortcut,\n    description,\n    propsIcon,\n    propsLabel,\n    propsShortcut,\n    propsDescription,\n    children,\n    ...rest\n  }: MenuItemProps) => {\n    const render = useButtonItem(\n      () => ({ shortcut, disabled }),\n      () => onAction?.(),\n    );\n    return () =>\n      render({\n        role: 'menuitem',\n        tone,\n        disabled,\n        closeOnSelect,\n        attrs: rest,\n        content: {\n          icon,\n          shortcut,\n          description,\n          propsIcon,\n          propsLabel,\n          propsShortcut,\n          propsDescription,\n          children,\n        },\n      });\n  },\n);\n\n/** 未声明的属性落到 a（role=\"menuitem\"）上 */\nexport interface MenuLinkItemProps\n  extends PartProps<'a', 'role' | 'aria-disabled'>, MenuItemContentProps {\n  /** 地址：站内链接经路由适配跳转，新标签页打开等照常交给浏览器 */\n  href: string;\n  /** 不可用：去掉 href，跳过方向键移动 */\n  disabled?: boolean;\n}\n\n/** 链接菜单项（a）：跳转到一个地址，随后关闭菜单 */\nexport const MenuLinkItem = _component(\n  ({\n    href,\n    disabled = false,\n    icon,\n    shortcut,\n    description,\n    propsIcon,\n    propsLabel,\n    propsShortcut,\n    propsDescription,\n    children,\n    ...rest\n  }: MenuLinkItemProps) => {\n    const item = useMenuItem();\n    const ids = useMenuItemContentIds();\n    const router = useRouterLink();\n    return () => (\n      <a\n        {...mergeAttrs<'a'>({ sx: menuItemSx('neutral', disabled) }, rest, {\n          role: 'menuitem',\n          href: disabled ? undefined : router.href(href),\n          'aria-keyshortcuts': keyShortcuts(shortcut),\n          'aria-disabled': disabled || undefined,\n          ...menuItemDescribedBy(description, ids),\n          onClick: (event: MouseEvent) => {\n            // 不可用的项不响应点击：不跳转，也不关闭菜单\n            if (disabled) return event.preventDefault();\n            router.onClick(event, href);\n            item.close(event);\n          },\n          ...item.ripple,\n        })}\n        data-disabled={disabled || undefined}\n      >\n        {menuItemContent(\n          {\n            icon,\n            shortcut,\n            description,\n            propsIcon,\n            propsLabel,\n            propsShortcut,\n            propsDescription,\n            children,\n          },\n          undefined,\n          ids,\n        )}\n      </a>\n    );\n  },\n);\n\n/** 未声明的属性落到 button（role=\"menuitemcheckbox\"）上 */\nexport interface MenuCheckboxItemProps extends MenuButtonItemProps {\n  /** 是否勾选：父级写 _checked={x} */\n  _checked?: boolean;\n  /** 勾选标记的部件属性 */\n  propsIndicator?: Partial<IconProps>;\n}\n\n/** 复选菜单项：切换一个开关；默认执行后不关闭菜单 */\nexport const MenuCheckboxItem = _component(\n  ({\n    _checked: checked = _bindable(false),\n    disabled = false,\n    closeOnSelect = false,\n    propsIndicator,\n    icon,\n    shortcut,\n    description,\n    propsIcon,\n    propsLabel,\n    propsShortcut,\n    propsDescription,\n    children,\n    ...rest\n  }: MenuCheckboxItemProps) => {\n    const render = useButtonItem(\n      () => ({ shortcut, disabled }),\n      () => (checked = !checked),\n    );\n    return () =>\n      render({\n        role: 'menuitemcheckbox',\n        disabled,\n        closeOnSelect,\n        checked,\n        indicator: { icon: Check, checked, props: propsIndicator },\n        attrs: rest,\n        content: {\n          icon,\n          shortcut,\n          description,\n          propsIcon,\n          propsLabel,\n          propsShortcut,\n          propsDescription,\n          children,\n        },\n      });\n  },\n);\n\n/** 未声明的属性落到分组的 div（role=\"group\"）上 */\nexport interface MenuGroupProps extends PartProps<'div', 'role'> {\n  /** 分组的标题（显示在组内第一行，同时是分组的名称） */\n  label?: VNodeChild;\n  /** 标题的部件属性 */\n  propsLabel?: Partial<TextProps>;\n  children?: VNodeChild;\n}\n\n/** 渲染分组：role=\"group\"，有标题时 aria-labelledby 指向它 */\nfunction renderGroup(\n  labelId: string,\n  { label, propsLabel, children, ...rest }: MenuGroupProps,\n): VNodeChild {\n  return (\n    <div\n      {...mergeAttrs<'div'>({}, rest, {\n        role: 'group',\n        'aria-labelledby': hasContent(label) ? labelId : undefined,\n      })}\n    >\n      {hasContent(label) && (\n        <Text\n          {...mergePartProps<TextProps>(\n            { tone: 'muted', size: 'sm', sx: menuStyles.groupLabel },\n            propsLabel,\n            { id: labelId },\n          )}\n        >\n          {label}\n        </Text>\n      )}\n      {children}\n    </div>\n  );\n}\n\n/** 菜单里的一组项，带可选的标题 */\nexport const MenuGroup = _component(({ label, propsLabel, children, ...rest }: MenuGroupProps) => {\n  const labelId = useId();\n  return () => renderGroup(labelId, { label, propsLabel, children, ...rest });\n});\n\n/** 未声明的属性落到分组的 div（role=\"group\"）上 */\nexport interface MenuRadioGroupProps extends MenuGroupProps {\n  /** 选中项的值：父级写 _value={x} */\n  _value?: string;\n}\n\n/** 一组单选菜单项：同一时间只选中一项 */\nexport const MenuRadioGroup = _component(\n  ({\n    _value: value = _bindable<string | undefined>(undefined),\n    label,\n    propsLabel,\n    children,\n    ...rest\n  }: MenuRadioGroupProps) => {\n    const labelId = useId();\n    MenuRadioGroupContext.provide({\n      get value() {\n        return value;\n      },\n      select: (next) => (value = next),\n    });\n    return () => renderGroup(labelId, { label, propsLabel, children, ...rest });\n  },\n);\n\n/** 未声明的属性落到 button（role=\"menuitemradio\"）上 */\nexport interface MenuRadioItemProps extends MenuButtonItemProps {\n  /** 这一项的值 */\n  value: string;\n  /** 选中标记的部件属性 */\n  propsIndicator?: Partial<IconProps>;\n}\n\n/** 单选菜单项：放在 MenuRadioGroup 里；默认执行后关闭菜单 */\nexport const MenuRadioItem = _component(\n  ({\n    value,\n    disabled = false,\n    closeOnSelect = true,\n    propsIndicator,\n    icon,\n    shortcut,\n    description,\n    propsIcon,\n    propsLabel,\n    propsShortcut,\n    propsDescription,\n    children,\n    ...rest\n  }: MenuRadioItemProps) => {\n    const group = MenuRadioGroupContext.inject();\n    const render = useButtonItem(\n      () => ({ shortcut, disabled }),\n      () => group.select(value),\n    );\n    return () => {\n      const checked = group.value === value;\n      return render({\n        role: 'menuitemradio',\n        disabled,\n        closeOnSelect,\n        checked,\n        indicator: { icon: Dot, checked, props: propsIndicator },\n        attrs: rest,\n        content: {\n          icon,\n          shortcut,\n          description,\n          propsIcon,\n          propsLabel,\n          propsShortcut,\n          propsDescription,\n          children,\n        },\n      });\n    };\n  },\n);\n\n/** 未声明的属性落到打开子菜单的 button（role=\"menuitem\"）上 */\nexport interface MenuSubProps\n  extends\n    PartProps<\n      'button',\n      'role' | 'type' | 'disabled' | 'aria-haspopup' | 'aria-expanded' | 'aria-controls'\n    >,\n    Omit<MenuItemContentProps, 'shortcut' | 'propsShortcut' | 'children'>,\n    OpenChangeProps {\n  /** 这一项的文字 */\n  label: VNodeChild;\n  /** 不可用：不能打开子菜单 */\n  disabled?: boolean;\n  /** 子菜单是否打开：父级可以写 _open={x} */\n  _open?: boolean;\n  /** 子菜单（role=\"menu\" 的 div）的部件属性 */\n  propsPanel?: PartProps<'div', 'id' | 'popover' | 'role'>;\n  /** 右侧箭头的部件属性 */\n  propsChevron?: Partial<IconProps>;\n  /** 子菜单里的项 */\n  children?: VNodeChild;\n}\n\n/** 指针停在子菜单项上多久后打开（毫秒） */\nconst SUBMENU_OPEN_DELAY = 100;\n/** 指针离开后，在安全三角里最多保持多久（毫秒） */\nconst SUBMENU_GRACE = 400;\n\ntype Point = readonly [number, number];\n\n/** 点 p 是否在三角形 abc 里（三条边的同侧判断） */\nfunction inTriangle(p: Point, a: Point, b: Point, c: Point) {\n  const side = (from: Point, to: Point) =>\n    (p[0] - to[0]) * (from[1] - to[1]) - (from[0] - to[0]) * (p[1] - to[1]);\n  const d1 = side(a, b);\n  const d2 = side(b, c);\n  const d3 = side(c, a);\n  return !((d1 < 0 || d2 < 0 || d3 < 0) && (d1 > 0 || d2 > 0 || d3 > 0));\n}\n\n/**\n * 子菜单：菜单里的一项，打开另一列菜单（WAI-ARIA 的子菜单）。→（从右到左排版时 ←）、Enter、空格打开并聚焦第一项，\n * 子菜单里 ←（→）或 Esc 关闭并回到这一项；指针停一会儿打开，朝子菜单斜着移动时经过别的项也不关（安全三角）。\n * 子菜单里执行一项后，整串菜单都关闭。\n *\n *   <MenuSub label=\"分享\" icon={Share}>\n *     <MenuItem onAction={copyLink}>复制链接</MenuItem>\n *   </MenuSub>\n */\nexport const MenuSub = _component(\n  ({\n    label,\n    _open: open = _bindable(false),\n    onOpenChange,\n    disabled = false,\n    icon,\n    propsIcon,\n    propsLabel,\n    propsPanel,\n    propsChevron,\n    children,\n    ...rest\n  }: MenuSubProps) => {\n    const parent = MenuContext.inject();\n    const id = useId();\n    const triggerId = `${id}-trigger`;\n    let trigger = _state.raw<HTMLElement | null>(null);\n    let panel = _state.raw<HTMLElement | null>(null);\n    let focusOnOpen = false;\n    let openTimer: ReturnType<typeof setTimeout> | undefined;\n    let stopGrace: (() => void) | undefined;\n    const setOpen = openSetter(\n      () => open,\n      (next) => (open = next),\n      () => onOpenChange,\n    );\n\n    MenuContext.provide({\n      get ripple() {\n        return parent.ripple;\n      },\n\n      close: (event) => {\n        setOpen(false, 'select', event);\n        parent.close(event);\n      },\n    });\n\n    const { onToggle } = useAnchoredPopover(\n      () => ({\n        open,\n        anchor: trigger,\n        panel,\n        // 往书写方向的结束边弹出；floating-ui 的 left / right 是物理方向\n        floating: {\n          placement: trigger && isRtl(trigger) ? 'left-start' : 'right-start',\n          offset: 2,\n          fitHeight: true,\n        },\n      }),\n      {\n        close: (reason, event) => setOpen(false, reason, event),\n        shown: () => {\n          if (focusOnOpen) menuItemsOf(panel)[0]?.focus();\n          focusOnOpen = false;\n        },\n      },\n    );\n    _effect(() =>\n      panel\n        ? rovingFocus(panel, { items: ITEMS, orientation: 'vertical', loop: true, typeahead: true })\n        : undefined,\n    );\n    onBeforeUnmount(() => {\n      clearTimeout(openTimer);\n      stopGrace?.();\n    });\n\n    const rtl = () => !!trigger && isRtl(trigger);\n\n    function openWithFocus(event: Event) {\n      if (disabled) return;\n      focusOnOpen = true;\n      // 已经开着（指针打开的）时直接把焦点移进去\n      if (open) menuItemsOf(panel)[0]?.focus();\n      setOpen(true, 'trigger', event);\n    }\n\n    function onTriggerKeydown(event: KeyboardEvent) {\n      if (event.key !== inlineArrows(rtl()).forward) return;\n      event.preventDefault();\n      openWithFocus(event);\n    }\n\n    function onPanelKeydown(event: KeyboardEvent) {\n      // Esc 只关最上层的子菜单，不冒泡到父菜单\n      if (event.key !== 'Escape' && event.key !== inlineArrows(rtl()).backward) return;\n      event.preventDefault();\n      event.stopPropagation();\n      setOpen(false, 'escape', event);\n    }\n\n    // 指针离开这一项：朝子菜单移动（在离开点与子菜单近边组成的三角形里）时保持打开，否则关闭\n    function onTriggerPointerleave(event: PointerEvent) {\n      clearTimeout(openTimer);\n      if (!open || !panel) return;\n      stopGrace?.();\n      const rect = panel.getBoundingClientRect();\n      const edge = rect.left >= event.clientX ? rect.left : rect.right;\n      const start: Point = [event.clientX, event.clientY];\n      const close = () => {\n        stopGrace?.();\n        setOpen(false, 'hover', event);\n      };\n      const onMove = (move: PointerEvent) => {\n        const target = move.target as Node;\n        if (panel?.contains(target) || trigger?.contains(target)) {\n          stopGrace?.();\n          return;\n        }\n        if (!inTriangle([move.clientX, move.clientY], start, [edge, rect.top], [edge, rect.bottom]))\n          close();\n      };\n      const timer = setTimeout(close, SUBMENU_GRACE);\n      document.addEventListener('pointermove', onMove);\n      stopGrace = () => {\n        clearTimeout(timer);\n        document.removeEventListener('pointermove', onMove);\n        stopGrace = undefined;\n      };\n    }\n\n    function onTriggerPointerenter(event: PointerEvent) {\n      if (disabled || event.pointerType === 'touch') return;\n      stopGrace?.();\n      clearTimeout(openTimer);\n      openTimer = setTimeout(() => setOpen(true, 'hover', event), SUBMENU_OPEN_DELAY);\n    }\n\n    return () => (\n      <>\n        <ButtonBase\n          {...mergePartProps<ButtonBaseProps>(\n            { sx: menuItemSx('neutral', disabled), ripple: parent.ripple },\n            rest as Partial<ButtonBaseProps>,\n            {\n              ref: (value: unknown) => (trigger = toElement(value)),\n              id: triggerId,\n              role: 'menuitem',\n              disabled,\n              'aria-haspopup': 'menu',\n              'aria-expanded': open,\n              'aria-controls': id,\n              onClick: openWithFocus,\n              onKeydown: onTriggerKeydown,\n              onPointerenter: onTriggerPointerenter,\n              onPointerleave: onTriggerPointerleave,\n            },\n          )}\n          data-state={open ? 'open' : 'closed'}\n        >\n          {menuItemContent({ icon, propsIcon, propsLabel, children: label })}\n          <Icon\n            {...mergePartProps<IconProps>(\n              { icon: ChevronRight, flipInRtl: true, sx: menuStyles.shortcut },\n              propsChevron,\n            )}\n          />\n        </ButtonBase>\n        <div\n          {...mergeAttrs<'div'>(\n            {\n              sx: [\n                floatingStyles.anchored,\n                floatingStyles.surface,\n                floatingStyles.scrollPanel,\n                menuStyles.panel,\n                transitions.scale,\n              ],\n              'aria-labelledby': defaultLabelledBy(propsPanel ?? {}, triggerId),\n            },\n            propsPanel,\n            {\n              ref: _toRef(panel),\n              id,\n              popover: 'auto',\n              role: 'menu',\n              onToggle,\n              onKeydown: onPanelKeydown,\n              onPointerenter: () => stopGrace?.(),\n            },\n          )}\n          data-state={open ? 'open' : 'closed'}\n        >\n          <ScrollArea\n            focusable={false}\n            sx={floatingStyles.scrollArea}\n            propsContent={{ sx: menuStyles.content }}\n          >\n            {children}\n          </ScrollArea>\n        </div>\n      </>\n    );\n  },\n);\n\n/**\n * 内容里有没有带快捷键的菜单项（含分组、子菜单里的）：只生成虚拟节点、不挂载。\n * 快捷键由菜单项注册，延迟渲染时菜单没打开就没有注册，所以这样的菜单不延迟\n */\nfunction hasShortcut(content: VNodeChild): boolean {\n  return childNodes(content).some((node) => {\n    if ((node.props as { shortcut?: unknown } | null)?.shortcut != null) return true;\n    const slot = (node.children as { default?: (...args: never[]) => VNodeChild } | null)?.default;\n    return typeof node.type === 'object' && typeof slot === 'function' && slot.length === 0\n      ? hasShortcut(slot())\n      : false;\n  });\n}\n"],"mappings":"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"}
+{"version":3,"file":"Menu.js","names":["_isVNode","Menu","_vtp_bindable","_vtp_readonlyProp","_vtp_childrenProp","_vtp_restProps","_vue_shallowRef","_createVNode","_Fragment","_mergeProps","_vtp_childrenStable","Text","_vtp_forwardChildren"],"sources":["../../src/overlay/Menu.tsx"],"sourcesContent":["/**\n * 菜单（WAI-ARIA 的 Menu Button 模式）：按钮弹出一列操作，复合组件，参考 Radix DropdownMenu、React Aria Menu。\n *\n *   <Menu trigger={(props) => <Button {...props} iconEnd={ChevronDown}>操作</Button>}>\n *     <MenuItem icon={Pencil} onAction={edit}>编辑</MenuItem>\n *     <MenuItem icon={Copy} shortcut=\"Ctrl+D\" onAction={duplicate}>复制</MenuItem>\n *     <Separator decorative={false} />\n *     <MenuGroup label=\"视图\">\n *       <MenuCheckboxItem _checked={showGrid}>显示网格</MenuCheckboxItem>\n *     </MenuGroup>\n *     <MenuRadioGroup _value={sort} label=\"排序\">\n *       <MenuRadioItem value=\"name\">名称</MenuRadioItem>\n *       <MenuRadioItem value=\"date\">日期</MenuRadioItem>\n *     </MenuRadioGroup>\n *     <MenuLinkItem href=\"/settings\">设置</MenuLinkItem>\n *     <MenuItem icon={Trash2} tone=\"danger\" onAction={remove}>删除</MenuItem>\n *   </Menu>\n *\n * 键盘：触发器上 Enter / 空格 / ↓ 打开并聚焦第一项，↑ 打开并聚焦最后一项；菜单里 ↑↓ 移动（循环）、Home / End、\n * 按字母跳到以它开头的项（rovingFocus 的 typeahead），Enter / 空格执行，Esc 关闭并回到触发器，Tab 关闭并继续往后。\n * 执行普通项后关闭菜单；复选项默认不关（常连续勾选几项），单选项默认关闭；都可以用 closeOnSelect 改。\n * 原生 popover=\"auto\" 负责顶层、点击外部关闭与嵌套顺序，定位与焦点进出见 utils/dom/floating。\n */\nimport { Check, ChevronRight, Dot } from '@lucide/icons';\nimport { createContext, _component } from '@zerodep-dev/vue-tsx-pro-tsx';\nimport { css } from '@zerodep-dev/vue-tsx-pro-tsx/styles';\nimport type { SxStyles } from '@zerodep-dev/vue-tsx-pro-tsx/styles';\nimport { onBeforeUnmount, useId, type VNodeChild } from 'vue';\nimport { ButtonBase, type ButtonBaseProps } from '../base/ButtonBase';\nimport { Icon, type IconData, type IconProps } from '../base/Icon';\nimport { Text, type TextProps } from '../base/Text';\nimport {\n  floatingStyles,\n  pointAnchor,\n  useAnchoredPopover,\n  type FloatingOptions,\n  type FloatingPlacement,\n} from '../utils/dom/floating';\nimport { ariaKeyShortcut, formatHotkey, useHotkeys } from '../utils/dom/hotkeys';\nimport { ScrollArea } from '../layout/ScrollArea';\nimport { useRouterLink } from '../utils/dom/link';\nimport { toElement } from '../utils/dom/element';\nimport { useLazyContent, type LazyContentOptions } from '../utils/motion/presence';\nimport { childNodes } from '../utils/data/text';\nimport {\n  hasContent,\n  defaultLabelledBy,\n  mergeAttrs,\n  mergePartProps,\n  type PartProps,\n  type TriggerProps,\n} from '../utils/props';\nimport { itemStyles } from '../utils/style/item-styles';\nimport { focusRingStyles } from '../utils/style/styles';\nimport { rippleHostStyles, useRipple } from '../utils/dom/ripple';\nimport { openSetter, type OpenChangeProps } from '../utils/dom/open-change';\nimport { rovingFocus } from '../utils/dom/roving-focus';\nimport { inlineArrows, isRtl } from '../utils/dom/direction';\nimport { fontSizeStyles, type TextSize } from '../utils/style/typography';\nimport { transitions } from '../utils/style/transitions';\n\n/** Menu 交给菜单项的状态 */\nexport interface MenuState {\n  /** 波纹；不写时沿用配置 */\n  readonly ripple: boolean | undefined;\n  /** 执行了一项：关闭菜单（onOpenChange 的原因是 select），焦点回到触发器 */\n  close(event?: Event): void;\n}\n\n/** Menu 的上下文：自定义菜单项用 useMenuItem 读取 */\nexport const MenuContext = createContext<MenuState>('Menu');\n\n/** MenuRadioGroup 交给组内单选项的状态 */\nexport interface MenuRadioGroupState {\n  /** 选中的值 */\n  readonly value: string | undefined;\n  /** 选中一个值 */\n  select(value: string): void;\n}\n\n/** MenuRadioGroup 的上下文 */\nexport const MenuRadioGroupContext = createContext<MenuRadioGroupState>('MenuRadioGroup');\n\n/** 交给触发器的属性：展开到按钮上（`{...props}`） */\nexport interface MenuTriggerProps extends TriggerProps {\n  /** 菜单以触发器的文字作为名称（aria-labelledby） */\n  id: string;\n  /** 取得触发器元素：定位的参照、关闭后焦点回到这里 */\n  ref: (element: unknown) => void;\n  /** ↓ / ↑ 打开并聚焦第一项 / 最后一项 */\n  onKeydown: (event: KeyboardEvent) => void;\n  /** 告诉读屏这个按钮会打开菜单 */\n  'aria-haspopup': 'menu';\n}\n\n/** 未声明的属性落到菜单（role=\"menu\" 的 div）上 */\nexport interface MenuProps\n  extends\n    PartProps<'div', 'id' | 'popover' | 'role'>,\n    Pick<FloatingOptions, 'offset'>,\n    LazyContentOptions,\n    OpenChangeProps {\n  /** 是否打开：父级可以写 _open={x}；Esc、点击外部、执行菜单项都会关闭并写回 */\n  _open?: boolean;\n  /** 弹出位置，默认 bottom-start；空间不够时自动翻转 */\n  placement?: FloatingPlacement;\n  /** 字号档位，菜单项随之缩放；不写时继承上下文字号 */\n  size?: TextSize;\n  /** 菜单项按下时的波纹；不写时沿用 createUi / Provider 的 ripple */\n  ripple?: boolean;\n  /** 触发器：`(props) => <Button {...props}>操作</Button>`；ContextMenu 不用触发器时返回 null */\n  trigger: (props: MenuTriggerProps) => VNodeChild;\n  /** 从视口里这个点弹出（右键菜单的指针位置），不以触发器为锚点；关闭后焦点由使用方安排 */\n  point?: { x: number; y: number };\n  /** 菜单项：MenuItem、MenuLinkItem、MenuCheckboxItem、MenuRadioGroup、MenuGroup、MenuSub、Separator */\n  children?: VNodeChild;\n}\n\n/** 菜单项的选择器（漫游焦点、打开时聚焦第一项 / 最后一项） */\nconst ITEMS = '[role=\"menuitem\"], [role=\"menuitemcheckbox\"], [role=\"menuitemradio\"]';\n\n/** 菜单自己的可用项：不含子菜单里的 */\nfunction menuItemsOf(panel: HTMLElement | null): HTMLElement[] {\n  return [...(panel?.querySelectorAll<HTMLElement>(ITEMS) ?? [])].filter(\n    (item) =>\n      item.parentElement?.closest('[role=\"menu\"]') === panel &&\n      !item.matches(':disabled, [aria-disabled=\"true\"]'),\n  );\n}\n\n/** Menu 的样式：panel、content、label、indicator、hidden、shortcut、groupLabel */\nexport const menuStyles = css.create({\n  // 菜单项多时在 ScrollArea 里滚动（浮层滚动条）；内边距放在内容层上，滚动条贴着菜单边缘\n  panel: {\n    minWidth: '12em',\n    maxWidth: 'calc(100vw - 2em)',\n    lineHeight: '_normal',\n  },\n  content: { padding: '_xs' },\n  label: { flexGrow: 1, minWidth: 0 },\n  // 有说明时文字与说明上下排，作为一个整体占满剩余宽度\n  text: { display: 'flex', flexDirection: 'column', flexGrow: 1, minWidth: 0 },\n  description: { display: 'block' },\n  // 复选、单选的标记占一列，有没有勾都对齐\n  indicator: { flexShrink: 0, width: '1em' },\n  hidden: { visibility: 'hidden' },\n  shortcut: { flexShrink: 0, marginInlineStart: '_lg' },\n  groupLabel: {\n    display: 'block',\n    paddingBlock: '_xs',\n    paddingInline: '_sm',\n    fontWeight: '_semibold',\n  },\n});\n\n/** 菜单：触发器 + 弹出的一列菜单项 */\nexport const Menu = _component(\n  ({\n    _open: open = _bindable(false),\n    onOpenChange,\n    placement = 'bottom-start',\n    offset,\n    size,\n    ripple,\n    trigger,\n    point,\n    lazy = true,\n    children,\n    ...rest\n  }: MenuProps) => {\n    const id = useId();\n    // 菜单项的快捷键在菜单没打开时也要能用：有快捷键的菜单照常渲染菜单项\n    const showContent = useLazyContent(\n      () => open,\n      () => lazy,\n    );\n    const triggerId = `${id}-trigger`;\n    let anchor = _state.raw<HTMLElement | null>(null);\n    let panel = _state.raw<HTMLElement | null>(null);\n    // 打开时聚焦哪一项；Tab 关闭时焦点照常往后走，不还给触发器\n    let focusOnOpen: 'first' | 'last' = 'first';\n    let restoreFocus = true;\n\n    const enabledItems = () => menuItemsOf(panel);\n    const setOpen = openSetter(\n      () => open,\n      (next) => (open = next),\n      () => onOpenChange,\n    );\n\n    MenuContext.provide({\n      get ripple() {\n        return ripple;\n      },\n\n      close: (event) => setOpen(false, 'select', event),\n    });\n\n    function onTriggerKeydown(event: KeyboardEvent) {\n      if (event.key !== 'ArrowDown' && event.key !== 'ArrowUp') return;\n      event.preventDefault();\n      focusOnOpen = event.key === 'ArrowDown' ? 'first' : 'last';\n      setOpen(true, 'trigger', event);\n    }\n\n    function onPanelKeydown(event: KeyboardEvent) {\n      // Esc 也由原生 popover 关闭；这里显式关一次，不依赖各浏览器 close watcher 的细节（Firefox 偶尔不关）\n      if (event.key === 'Escape') {\n        event.preventDefault();\n        setOpen(false, 'escape', event);\n        return;\n      }\n      if (event.key !== 'Tab') return;\n      restoreFocus = false;\n      setOpen(false, 'focus', event);\n    }\n\n    const { onToggle } = useAnchoredPopover(\n      () => ({\n        open,\n        anchor: point ? pointAnchor(point.x, point.y) : anchor,\n        panel,\n        floating: { placement, offset, fitHeight: true },\n        restoreFocus,\n      }),\n      {\n        close: (reason, event) => setOpen(false, reason, event),\n        // 打开后聚焦第一项（↑ 打开时最后一项），并为下一次打开恢复默认\n        shown: () => {\n          const items = enabledItems();\n          (focusOnOpen === 'first' ? items[0] : items.at(-1))?.focus();\n          focusOnOpen = 'first';\n          restoreFocus = true;\n        },\n      },\n    );\n    _effect(() =>\n      panel\n        ? rovingFocus(panel, { items: ITEMS, orientation: 'vertical', loop: true, typeahead: true })\n        : undefined,\n    );\n\n    return () => (\n      <>\n        {trigger({\n          id: triggerId,\n          ref: (value) => (anchor = toElement(value)),\n          onClick: (event: MouseEvent) => setOpen(!open, 'trigger', event),\n          onKeydown: onTriggerKeydown,\n          'aria-haspopup': 'menu',\n          'aria-expanded': open,\n          'aria-controls': id,\n        })}\n        <div\n          {...mergeAttrs<'div'>(\n            {\n              sx: [\n                floatingStyles.anchored,\n                floatingStyles.surface,\n                floatingStyles.scrollPanel,\n                menuStyles.panel,\n                size && fontSizeStyles[size],\n                transitions.scale,\n              ],\n              // 右键菜单没有触发器：名称由使用方的 aria-label 给\n              'aria-labelledby': anchor ? defaultLabelledBy(rest, triggerId) : undefined,\n            },\n            rest,\n            {\n              ref: _toRef(panel),\n              id,\n              popover: 'auto',\n              role: 'menu',\n              onToggle,\n              onKeydown: onPanelKeydown,\n            },\n          )}\n          data-state={open ? 'open' : 'closed'}\n        >\n          <ScrollArea\n            focusable={false}\n            sx={floatingStyles.scrollArea}\n            propsContent={{ sx: menuStyles.content }}\n          >\n            {(showContent() || hasShortcut(children)) && children}\n          </ScrollArea>\n        </div>\n      </>\n    );\n  },\n);\n\n/** 菜单项内容（图标、文字、快捷键）的选项，各种菜单项共有 */\nexport interface MenuItemContentProps {\n  /** 文字前的图标 */\n  icon?: IconData;\n  /**\n   * 快捷键：`'Mod+D'`（Mod 在 macOS 上是 ⌘，其他系统是 Ctrl，写法见 useHotkeys）。右侧显示成当前系统的写法；\n   * MenuItem、MenuCheckboxItem、MenuRadioItem 在菜单挂载期间注册它（菜单不必打开），按下时执行这一项；\n   * 读屏从菜单项的 aria-keyshortcuts 得知快捷键\n   */\n  shortcut?: string;\n  /** 图标的部件属性 */\n  propsIcon?: Partial<IconProps>;\n  /** 文字层的部件属性 */\n  propsLabel?: PartProps<'span'>;\n  /** 快捷键提示的部件属性 */\n  propsShortcut?: Partial<TextProps>;\n  /** 文字下方的说明（第二行，弱化）：读屏把它当作这一项的描述（aria-describedby），不算进名称 */\n  description?: VNodeChild;\n  /** 说明的部件属性 */\n  propsDescription?: Partial<TextProps>;\n  children?: VNodeChild;\n}\n\n/** 复选、单选项的标记：占一列，没勾选时只占位，各项文字对齐 */\nexport interface MenuItemMark {\n  /** 勾选时显示的图标 */\n  icon: IconData;\n  /** 是否勾选 */\n  checked: boolean;\n  /** 标记图标的部件属性 */\n  props?: Partial<IconProps>;\n}\n\n/** 有说明的菜单项：文字与说明各自的 id（名称只取文字，说明作为描述） */\nexport interface MenuItemContentIds {\n  /** 文字的 id：菜单项的 aria-labelledby */\n  label: string;\n  /** 说明的 id：菜单项的 aria-describedby */\n  description: string;\n}\n\n/** 菜单项文字与说明的 id；在菜单项的 setup 里调用 */\nexport function useMenuItemContentIds(): MenuItemContentIds {\n  const id = useId();\n  return { label: `${id}-label`, description: `${id}-description` };\n}\n\n/** 有说明时菜单项的名称只取文字、说明作为描述；没有说明时名称就是全部内容 */\nexport function menuItemDescribedBy(description: VNodeChild | undefined, ids: MenuItemContentIds) {\n  return description == null\n    ? {}\n    : { 'aria-labelledby': ids.label, 'aria-describedby': ids.description };\n}\n\n/** 菜单项的内容：标记 + 图标 + 文字（与说明）+ 快捷键 */\nexport function menuItemContent(\n  {\n    icon,\n    shortcut,\n    description,\n    propsIcon,\n    propsLabel,\n    propsShortcut,\n    propsDescription,\n    children,\n  }: MenuItemContentProps,\n  mark?: MenuItemMark,\n  ids?: MenuItemContentIds,\n): VNodeChild {\n  return [\n    mark && (\n      <Icon\n        {...mergePartProps<IconProps>(\n          { icon: mark.icon, sx: [menuStyles.indicator, !mark.checked && menuStyles.hidden] },\n          mark.props,\n        )}\n      />\n    ),\n    icon && <Icon {...mergePartProps<IconProps>({ icon }, propsIcon)} />,\n    description == null ? (\n      <span {...mergeAttrs<'span'>({ sx: menuStyles.label }, propsLabel)}>{children}</span>\n    ) : (\n      <span {...css.attrs(menuStyles.text)}>\n        <span {...mergeAttrs<'span'>({ id: ids?.label }, propsLabel)}>{children}</span>\n        <Text\n          {...mergePartProps<TextProps>(\n            { tone: 'muted', size: 'sm', id: ids?.description, sx: menuStyles.description },\n            propsDescription,\n          )}\n        >\n          {description}\n        </Text>\n      </span>\n    ),\n    shortcut && (\n      <Text\n        {...mergePartProps<TextProps>(\n          { tone: 'muted', size: 'sm', sx: menuStyles.shortcut },\n          propsShortcut,\n          // 有 aria-keyshortcuts 时读屏从它念，显示的文字不重复念；序列键没有，照常念\n          { 'aria-hidden': keyShortcuts(shortcut) ? true : undefined },\n        )}\n      >\n        {formatHotkey(shortcut)}\n      </Text>\n    ),\n  ];\n}\n\n/** 快捷键交给读屏（aria-keyshortcuts）：右侧显示的快捷键文字对读屏隐藏，不重复念 */\nconst keyShortcuts = (shortcut: string | undefined) =>\n  shortcut ? ariaKeyShortcut(shortcut) : undefined;\n\n/** 菜单项的快捷键：不可用时不触发；按下时和点击这一项一样执行（不关心菜单是否打开） */\nfunction useItemShortcut(read: () => { shortcut?: string; disabled: boolean }, run: () => void) {\n  useHotkeys(() => {\n    const { shortcut, disabled } = read();\n    return shortcut && !disabled ? { [shortcut]: run } : {};\n  });\n}\n\n/** 菜单项的色调：菜单里只区分普通操作与破坏性操作，其余状态色会让一列选项显得像警报 */\nexport type MenuItemTone = 'neutral' | 'danger';\n\n/** 菜单项的外观：幽灵按钮，内容靠起始边排列 */\nexport function menuItemSx(tone: MenuItemTone, disabled: boolean): SxStyles {\n  return [\n    itemStyles.row,\n    tone === 'danger' ? itemStyles.danger : itemStyles.hoverable,\n    focusRingStyles.visible,\n    rippleHostStyles.host,\n    disabled && itemStyles.disabled,\n  ] as SxStyles;\n}\n\n/** 菜单项共用的：所在的菜单、按下的波纹（链接项用；按钮项由 ButtonBase 给出）、执行后关闭菜单 */\nexport function useMenuItem() {\n  const menu = MenuContext.inject();\n  return {\n    menu,\n    ripple: useRipple(() => menu.ripple),\n    close: (event?: Event) => menu.close(event),\n  };\n}\n\n/** 按钮类菜单项这一次渲染的取值 */\ninterface ButtonItemOptions {\n  role: 'menuitem' | 'menuitemcheckbox' | 'menuitemradio';\n  tone?: MenuItemTone;\n  disabled: boolean;\n  closeOnSelect: boolean;\n  /** 勾选与单选项的状态；普通项不写 */\n  checked?: boolean;\n  /** 勾选与单选项起始边的标记 */\n  indicator?: MenuItemMark;\n  content: MenuItemContentProps;\n  /** 使用方的其余属性，落到 button 上 */\n  attrs: object;\n}\n\n/**\n * 按钮类菜单项（MenuItem、MenuCheckboxItem、MenuRadioItem）共用的：快捷键、说明的关联、外观与角色，\n * 执行（点击、Enter、空格、快捷键）时调用 run，点击后按 closeOnSelect 关闭菜单。返回渲染函数\n */\nfunction useButtonItem(\n  read: () => { shortcut?: string; disabled: boolean },\n  run: () => void,\n): (options: ButtonItemOptions) => VNodeChild {\n  const item = useMenuItem();\n  const ids = useMenuItemContentIds();\n  useItemShortcut(read, run);\n  return ({\n    role,\n    tone = 'neutral',\n    disabled,\n    closeOnSelect,\n    checked,\n    indicator,\n    content,\n    attrs,\n  }) => (\n    <ButtonBase\n      {...mergePartProps<ButtonBaseProps>(\n        { sx: menuItemSx(tone, disabled), ripple: item.menu.ripple },\n        attrs as Partial<ButtonBaseProps>,\n        {\n          role,\n          disabled,\n          'aria-keyshortcuts': keyShortcuts(content.shortcut),\n          'aria-checked': checked,\n          ...menuItemDescribedBy(content.description, ids),\n          // 使用方的 onClick 先执行，preventDefault 可以拦下执行与关闭（mergeProps 的规则）\n          onClick: (event: MouseEvent) => {\n            run();\n            if (closeOnSelect) item.close(event);\n          },\n        },\n      )}\n      data-state={checked == null ? undefined : checked ? 'checked' : 'unchecked'}\n    >\n      {menuItemContent(content, indicator, ids)}\n    </ButtonBase>\n  );\n}\n\n/** 按钮类菜单项共有的属性；未声明的属性落到 button 上 */\nexport interface MenuButtonItemProps\n  // 原生的 onSelect 是文字选中事件，不是“选了这一项”：去掉它，误写成 onSelect 时类型检查会报错（用 onAction）\n  extends\n    PartProps<'button', 'role' | 'type' | 'disabled' | 'aria-checked' | 'onSelect'>,\n    MenuItemContentProps {\n  /** 不可用：跳过方向键移动，不能执行 */\n  disabled?: boolean;\n  /** 执行后是否关闭菜单 */\n  closeOnSelect?: boolean;\n}\n\n/** 未声明的属性落到 button（role=\"menuitem\"）上 */\nexport interface MenuItemProps extends MenuButtonItemProps {\n  /** 色调：删除等破坏性操作用 danger，默认 neutral */\n  tone?: MenuItemTone;\n  /** 执行（点击、Enter、空格）时调用；默认随后关闭菜单 */\n  onAction?: () => void;\n}\n\n/** 普通菜单项：执行一个操作 */\nexport const MenuItem = _component(\n  ({\n    tone = 'neutral',\n    disabled = false,\n    closeOnSelect = true,\n    onAction,\n    icon,\n    shortcut,\n    description,\n    propsIcon,\n    propsLabel,\n    propsShortcut,\n    propsDescription,\n    children,\n    ...rest\n  }: MenuItemProps) => {\n    const render = useButtonItem(\n      () => ({ shortcut, disabled }),\n      () => onAction?.(),\n    );\n    return () =>\n      render({\n        role: 'menuitem',\n        tone,\n        disabled,\n        closeOnSelect,\n        attrs: rest,\n        content: {\n          icon,\n          shortcut,\n          description,\n          propsIcon,\n          propsLabel,\n          propsShortcut,\n          propsDescription,\n          children,\n        },\n      });\n  },\n);\n\n/** 未声明的属性落到 a（role=\"menuitem\"）上 */\nexport interface MenuLinkItemProps\n  extends PartProps<'a', 'role' | 'aria-disabled'>, MenuItemContentProps {\n  /** 地址：站内链接经路由适配跳转，新标签页打开等照常交给浏览器 */\n  href: string;\n  /** 不可用：去掉 href，跳过方向键移动 */\n  disabled?: boolean;\n}\n\n/** 链接菜单项（a）：跳转到一个地址，随后关闭菜单 */\nexport const MenuLinkItem = _component(\n  ({\n    href,\n    disabled = false,\n    icon,\n    shortcut,\n    description,\n    propsIcon,\n    propsLabel,\n    propsShortcut,\n    propsDescription,\n    children,\n    ...rest\n  }: MenuLinkItemProps) => {\n    const item = useMenuItem();\n    const ids = useMenuItemContentIds();\n    const router = useRouterLink();\n    return () => (\n      <a\n        {...mergeAttrs<'a'>({ sx: menuItemSx('neutral', disabled) }, rest, {\n          role: 'menuitem',\n          href: disabled ? undefined : router.href(href),\n          'aria-keyshortcuts': keyShortcuts(shortcut),\n          'aria-disabled': disabled || undefined,\n          ...menuItemDescribedBy(description, ids),\n          onClick: (event: MouseEvent) => {\n            // 不可用的项不响应点击：不跳转，也不关闭菜单\n            if (disabled) return event.preventDefault();\n            router.onClick(event, href);\n            item.close(event);\n          },\n          ...item.ripple,\n        })}\n        data-disabled={disabled || undefined}\n      >\n        {menuItemContent(\n          {\n            icon,\n            shortcut,\n            description,\n            propsIcon,\n            propsLabel,\n            propsShortcut,\n            propsDescription,\n            children,\n          },\n          undefined,\n          ids,\n        )}\n      </a>\n    );\n  },\n);\n\n/** 未声明的属性落到 button（role=\"menuitemcheckbox\"）上 */\nexport interface MenuCheckboxItemProps extends MenuButtonItemProps {\n  /** 是否勾选：父级写 _checked={x} */\n  _checked?: boolean;\n  /** 勾选标记的部件属性 */\n  propsIndicator?: Partial<IconProps>;\n}\n\n/** 复选菜单项：切换一个开关；默认执行后不关闭菜单 */\nexport const MenuCheckboxItem = _component(\n  ({\n    _checked: checked = _bindable(false),\n    disabled = false,\n    closeOnSelect = false,\n    propsIndicator,\n    icon,\n    shortcut,\n    description,\n    propsIcon,\n    propsLabel,\n    propsShortcut,\n    propsDescription,\n    children,\n    ...rest\n  }: MenuCheckboxItemProps) => {\n    const render = useButtonItem(\n      () => ({ shortcut, disabled }),\n      () => (checked = !checked),\n    );\n    return () =>\n      render({\n        role: 'menuitemcheckbox',\n        disabled,\n        closeOnSelect,\n        checked,\n        indicator: { icon: Check, checked, props: propsIndicator },\n        attrs: rest,\n        content: {\n          icon,\n          shortcut,\n          description,\n          propsIcon,\n          propsLabel,\n          propsShortcut,\n          propsDescription,\n          children,\n        },\n      });\n  },\n);\n\n/** 未声明的属性落到分组的 div（role=\"group\"）上 */\nexport interface MenuGroupProps extends PartProps<'div', 'role'> {\n  /** 分组的标题（显示在组内第一行，同时是分组的名称） */\n  label?: VNodeChild;\n  /** 标题的部件属性 */\n  propsLabel?: Partial<TextProps>;\n  children?: VNodeChild;\n}\n\n/** 渲染分组：role=\"group\"，有标题时 aria-labelledby 指向它 */\nfunction renderGroup(\n  labelId: string,\n  { label, propsLabel, children, ...rest }: MenuGroupProps,\n): VNodeChild {\n  return (\n    <div\n      {...mergeAttrs<'div'>({}, rest, {\n        role: 'group',\n        'aria-labelledby': hasContent(label) ? labelId : undefined,\n      })}\n    >\n      {hasContent(label) && (\n        <Text\n          {...mergePartProps<TextProps>(\n            { tone: 'muted', size: 'sm', sx: menuStyles.groupLabel },\n            propsLabel,\n            { id: labelId },\n          )}\n        >\n          {label}\n        </Text>\n      )}\n      {children}\n    </div>\n  );\n}\n\n/** 菜单里的一组项，带可选的标题 */\nexport const MenuGroup = _component(({ label, propsLabel, children, ...rest }: MenuGroupProps) => {\n  const labelId = useId();\n  return () => renderGroup(labelId, { label, propsLabel, children, ...rest });\n});\n\n/** 未声明的属性落到分组的 div（role=\"group\"）上 */\nexport interface MenuRadioGroupProps extends MenuGroupProps {\n  /** 选中项的值：父级写 _value={x} */\n  _value?: string;\n}\n\n/** 一组单选菜单项：同一时间只选中一项 */\nexport const MenuRadioGroup = _component(\n  ({\n    _value: value = _bindable<string | undefined>(undefined),\n    label,\n    propsLabel,\n    children,\n    ...rest\n  }: MenuRadioGroupProps) => {\n    const labelId = useId();\n    MenuRadioGroupContext.provide({\n      get value() {\n        return value;\n      },\n      select: (next) => (value = next),\n    });\n    return () => renderGroup(labelId, { label, propsLabel, children, ...rest });\n  },\n);\n\n/** 未声明的属性落到 button（role=\"menuitemradio\"）上 */\nexport interface MenuRadioItemProps extends MenuButtonItemProps {\n  /** 这一项的值 */\n  value: string;\n  /** 选中标记的部件属性 */\n  propsIndicator?: Partial<IconProps>;\n}\n\n/** 单选菜单项：放在 MenuRadioGroup 里；默认执行后关闭菜单 */\nexport const MenuRadioItem = _component(\n  ({\n    value,\n    disabled = false,\n    closeOnSelect = true,\n    propsIndicator,\n    icon,\n    shortcut,\n    description,\n    propsIcon,\n    propsLabel,\n    propsShortcut,\n    propsDescription,\n    children,\n    ...rest\n  }: MenuRadioItemProps) => {\n    const group = MenuRadioGroupContext.inject();\n    const render = useButtonItem(\n      () => ({ shortcut, disabled }),\n      () => group.select(value),\n    );\n    return () => {\n      const checked = group.value === value;\n      return render({\n        role: 'menuitemradio',\n        disabled,\n        closeOnSelect,\n        checked,\n        indicator: { icon: Dot, checked, props: propsIndicator },\n        attrs: rest,\n        content: {\n          icon,\n          shortcut,\n          description,\n          propsIcon,\n          propsLabel,\n          propsShortcut,\n          propsDescription,\n          children,\n        },\n      });\n    };\n  },\n);\n\n/** 未声明的属性落到打开子菜单的 button（role=\"menuitem\"）上 */\nexport interface MenuSubProps\n  extends\n    PartProps<\n      'button',\n      'role' | 'type' | 'disabled' | 'aria-haspopup' | 'aria-expanded' | 'aria-controls'\n    >,\n    Omit<MenuItemContentProps, 'shortcut' | 'propsShortcut' | 'children'>,\n    OpenChangeProps {\n  /** 这一项的文字 */\n  label: VNodeChild;\n  /** 不可用：不能打开子菜单 */\n  disabled?: boolean;\n  /** 子菜单是否打开：父级可以写 _open={x} */\n  _open?: boolean;\n  /** 子菜单（role=\"menu\" 的 div）的部件属性 */\n  propsPanel?: PartProps<'div', 'id' | 'popover' | 'role'>;\n  /** 右侧箭头的部件属性 */\n  propsChevron?: Partial<IconProps>;\n  /** 子菜单里的项 */\n  children?: VNodeChild;\n}\n\n/** 指针停在子菜单项上多久后打开（毫秒） */\nconst SUBMENU_OPEN_DELAY = 100;\n/** 指针离开后，在安全三角里最多保持多久（毫秒） */\nconst SUBMENU_GRACE = 400;\n\ntype Point = readonly [number, number];\n\n/** 点 p 是否在三角形 abc 里（三条边的同侧判断） */\nfunction inTriangle(p: Point, a: Point, b: Point, c: Point) {\n  const side = (from: Point, to: Point) =>\n    (p[0] - to[0]) * (from[1] - to[1]) - (from[0] - to[0]) * (p[1] - to[1]);\n  const d1 = side(a, b);\n  const d2 = side(b, c);\n  const d3 = side(c, a);\n  return !((d1 < 0 || d2 < 0 || d3 < 0) && (d1 > 0 || d2 > 0 || d3 > 0));\n}\n\n/**\n * 子菜单：菜单里的一项，打开另一列菜单（WAI-ARIA 的子菜单）。→（从右到左排版时 ←）、Enter、空格打开并聚焦第一项，\n * 子菜单里 ←（→）或 Esc 关闭并回到这一项；指针停一会儿打开，朝子菜单斜着移动时经过别的项也不关（安全三角）。\n * 子菜单里执行一项后，整串菜单都关闭。\n *\n *   <MenuSub label=\"分享\" icon={Share}>\n *     <MenuItem onAction={copyLink}>复制链接</MenuItem>\n *   </MenuSub>\n */\nexport const MenuSub = _component(\n  ({\n    label,\n    _open: open = _bindable(false),\n    onOpenChange,\n    disabled = false,\n    icon,\n    propsIcon,\n    propsLabel,\n    propsPanel,\n    propsChevron,\n    children,\n    ...rest\n  }: MenuSubProps) => {\n    const parent = MenuContext.inject();\n    const id = useId();\n    const triggerId = `${id}-trigger`;\n    let trigger = _state.raw<HTMLElement | null>(null);\n    let panel = _state.raw<HTMLElement | null>(null);\n    let focusOnOpen = false;\n    let openTimer: ReturnType<typeof setTimeout> | undefined;\n    let stopGrace: (() => void) | undefined;\n    const setOpen = openSetter(\n      () => open,\n      (next) => (open = next),\n      () => onOpenChange,\n    );\n\n    MenuContext.provide({\n      get ripple() {\n        return parent.ripple;\n      },\n\n      close: (event) => {\n        setOpen(false, 'select', event);\n        parent.close(event);\n      },\n    });\n\n    const { onToggle } = useAnchoredPopover(\n      () => ({\n        open,\n        anchor: trigger,\n        panel,\n        // 往书写方向的结束边弹出；floating-ui 的 left / right 是物理方向\n        floating: {\n          placement: trigger && isRtl(trigger) ? 'left-start' : 'right-start',\n          offset: 2,\n          fitHeight: true,\n        },\n      }),\n      {\n        close: (reason, event) => setOpen(false, reason, event),\n        shown: () => {\n          if (focusOnOpen) menuItemsOf(panel)[0]?.focus();\n          focusOnOpen = false;\n        },\n      },\n    );\n    _effect(() =>\n      panel\n        ? rovingFocus(panel, { items: ITEMS, orientation: 'vertical', loop: true, typeahead: true })\n        : undefined,\n    );\n    onBeforeUnmount(() => {\n      clearTimeout(openTimer);\n      stopGrace?.();\n    });\n\n    const rtl = () => !!trigger && isRtl(trigger);\n\n    function openWithFocus(event: Event) {\n      if (disabled) return;\n      focusOnOpen = true;\n      // 已经开着（指针打开的）时直接把焦点移进去\n      if (open) menuItemsOf(panel)[0]?.focus();\n      setOpen(true, 'trigger', event);\n    }\n\n    function onTriggerKeydown(event: KeyboardEvent) {\n      if (event.key !== inlineArrows(rtl()).forward) return;\n      event.preventDefault();\n      openWithFocus(event);\n    }\n\n    function onPanelKeydown(event: KeyboardEvent) {\n      // Esc 只关最上层的子菜单，不冒泡到父菜单\n      if (event.key !== 'Escape' && event.key !== inlineArrows(rtl()).backward) return;\n      event.preventDefault();\n      event.stopPropagation();\n      setOpen(false, 'escape', event);\n    }\n\n    // 指针离开这一项：朝子菜单移动（在离开点与子菜单近边组成的三角形里）时保持打开，否则关闭\n    function onTriggerPointerleave(event: PointerEvent) {\n      clearTimeout(openTimer);\n      if (!open || !panel) return;\n      stopGrace?.();\n      const rect = panel.getBoundingClientRect();\n      const edge = rect.left >= event.clientX ? rect.left : rect.right;\n      const start: Point = [event.clientX, event.clientY];\n      const close = () => {\n        stopGrace?.();\n        setOpen(false, 'hover', event);\n      };\n      const onMove = (move: PointerEvent) => {\n        const target = move.target as Node;\n        if (panel?.contains(target) || trigger?.contains(target)) {\n          stopGrace?.();\n          return;\n        }\n        if (!inTriangle([move.clientX, move.clientY], start, [edge, rect.top], [edge, rect.bottom]))\n          close();\n      };\n      const timer = setTimeout(close, SUBMENU_GRACE);\n      document.addEventListener('pointermove', onMove);\n      stopGrace = () => {\n        clearTimeout(timer);\n        document.removeEventListener('pointermove', onMove);\n        stopGrace = undefined;\n      };\n    }\n\n    function onTriggerPointerenter(event: PointerEvent) {\n      if (disabled || event.pointerType === 'touch') return;\n      stopGrace?.();\n      clearTimeout(openTimer);\n      openTimer = setTimeout(() => setOpen(true, 'hover', event), SUBMENU_OPEN_DELAY);\n    }\n\n    return () => (\n      <>\n        <ButtonBase\n          {...mergePartProps<ButtonBaseProps>(\n            { sx: menuItemSx('neutral', disabled), ripple: parent.ripple },\n            rest as Partial<ButtonBaseProps>,\n            {\n              ref: (value: unknown) => (trigger = toElement(value)),\n              id: triggerId,\n              role: 'menuitem',\n              disabled,\n              'aria-haspopup': 'menu',\n              'aria-expanded': open,\n              'aria-controls': id,\n              onClick: openWithFocus,\n              onKeydown: onTriggerKeydown,\n              onPointerenter: onTriggerPointerenter,\n              onPointerleave: onTriggerPointerleave,\n            },\n          )}\n          data-state={open ? 'open' : 'closed'}\n        >\n          {menuItemContent({ icon, propsIcon, propsLabel, children: label })}\n          <Icon\n            {...mergePartProps<IconProps>(\n              { icon: ChevronRight, flipInRtl: true, sx: menuStyles.shortcut },\n              propsChevron,\n            )}\n          />\n        </ButtonBase>\n        <div\n          {...mergeAttrs<'div'>(\n            {\n              sx: [\n                floatingStyles.anchored,\n                floatingStyles.surface,\n                floatingStyles.scrollPanel,\n                menuStyles.panel,\n                transitions.scale,\n              ],\n              'aria-labelledby': defaultLabelledBy(propsPanel ?? {}, triggerId),\n            },\n            propsPanel,\n            {\n              ref: _toRef(panel),\n              id,\n              popover: 'auto',\n              role: 'menu',\n              onToggle,\n              onKeydown: onPanelKeydown,\n              onPointerenter: () => stopGrace?.(),\n            },\n          )}\n          data-state={open ? 'open' : 'closed'}\n        >\n          <ScrollArea\n            focusable={false}\n            sx={floatingStyles.scrollArea}\n            propsContent={{ sx: menuStyles.content }}\n          >\n            {children}\n          </ScrollArea>\n        </div>\n      </>\n    );\n  },\n);\n\n/**\n * 内容里有没有带快捷键的菜单项（含分组、子菜单里的）：只生成虚拟节点、不挂载。\n * 快捷键由菜单项注册，延迟渲染时菜单没打开就没有注册，所以这样的菜单不延迟\n */\nfunction hasShortcut(content: VNodeChild): boolean {\n  return childNodes(content).some((node) => {\n    if ((node.props as { shortcut?: unknown } | null)?.shortcut != null) return true;\n    const slot = (node.children as { default?: (...args: never[]) => VNodeChild } | null)?.default;\n    return typeof node.type === 'object' && typeof slot === 'function' && slot.length === 0\n      ? hasShortcut(slot())\n      : false;\n  });\n}\n"],"mappings":"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"}

package/dist/overlay/Popconfirm.d.ts

@@ -1,4 +1,4 @@
-import * as css from '@zerodep-dev/vue-tsx-pro-tsx/styles';
+import { css } from '@zerodep-dev/vue-tsx-pro-tsx/styles';
 import { type VNodeChild } from 'vue';
 import { type ButtonProps } from '../base/Button';
 import { type IconData, type IconProps } from '../base/Icon';

package/dist/overlay/Popconfirm.js

@@ -9,7 +9,7 @@ import { openSetter } from "../utils/dom/open-change.js";
 import { Popover } from "./Popover.js";
 import { createVNode, ref, useId, watch } from "vue";
 import { _component, bindable, mergeJsxProps, readonlyProp, restProps } from "@zerodep-dev/vue-tsx-pro-tsx";
-import * as css from "@zerodep-dev/vue-tsx-pro-tsx/styles";
+import { css } from "@zerodep-dev/vue-tsx-pro-tsx/styles";
 //#region src/overlay/Popconfirm.tsx
 /** 未声明的属性落到弹出层的 div 上；位置、箭头、触发器同 Popover */
 /** Popconfirm 的样式：body、icon、title、description、footer */