@xihan-ui/vue 1.1.0 → 2.0.0

package/README.md

@@ -1,13 +1,13 @@
 # @xihan-ui/vue
 
-Vue 3 适配器：121 个组件的 Vue 形态，外加对应的 composables。行为全部来自 `@xihan-ui/headless`，这一层只负责把它接到 Vue 的响应式与渲染上。
+Vue 3 适配器：134 个组件的 Vue 形态，外加对应的 composables。行为全部来自 `@xihan-ui/headless`，这一层只负责把它接到 Vue 的响应式与渲染上。
 
 **谁会装它**：在 Vue 里用这套组件的人装它。样式另装 `@xihan-ui/styles`，或者自己写。
 
 ## 用法
 
 ```ts
-import { XhButton, XhDialog } from '@xihan-ui/vue'
+import { XhButton, XhDialogContent, XhDialogRoot, XhDialogTrigger } from '@xihan-ui/vue'
 import '@xihan-ui/styles'
 ```
 

package/dist/backgrounds.d.ts

@@ -17,8 +17,8 @@ interface UseBackgroundOptions {
 interface UseBackgroundReturn {
   readonly surface: ShallowRef<BackgroundSurface | null>;
   /**
-   * 挂载点。直接当模板 ref 用：`<div :ref="visual.attach">`，
-   * 渲染器会在元素进出 DOM 时把元素或 null 交进来。
+   * 挂载点。直接作为模板 ref 使用：`<div :ref="visual.attach">`，
+   * 渲染器会在元素进出 DOM 时把元素或 null 传入。
    */
   attach: (element: Element | null) => void;
   setEffect: (effect: BackgroundEffect | string) => void;
@@ -29,16 +29,16 @@ interface UseBackgroundReturn {
   destroy: () => void;
 }
 /**
- * 建一张受 Vue 生命周期管理的视觉画面。
+ * 建立一张受 Vue 生命周期管理的视觉画面。
  *
- * 用**函数式 ref** 而不是监听一个模板 ref：元素由渲染器直接交到手上，
- * 不经过响应式与调度队列，因此不受 flush 时序影响，元素换了也一定收得到。
- * 组件卸载时自动销毁；在 setup 之外调用则需自己调 destroy。
+ * 使用函数式 ref 而不是监听一个模板 ref：元素由渲染器直接交付，
+ * 不经过响应式与调度队列，因此不受 flush 时序影响，元素更换后也一定能收到。
+ * 组件卸载时自动销毁；在 setup 之外调用则需自行调用 destroy。
  */
 declare function useBackground(options: UseBackgroundOptions): UseBackgroundReturn;
 /**
- * `<XhBackground>` —— 独立视觉组件。默认插槽的内容浮在效果之上；
- * 画布铺满根元素且 pointer-events: none，不会挡住插槽里的交互。
+ * `<XhBackground>`：独立视觉组件。默认插槽的内容浮在效果之上；
+ * 画布铺满根元素且 pointer-events: none，不会遮挡插槽中的交互。
  */
 declare const XhBackground: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
   effect: {
@@ -53,12 +53,12 @@ declare const XhBackground: import("vue").DefineComponent<import("vue").ExtractP
     type: PropType<BackgroundQuality>;
     default: undefined;
   };
-  /** 数据驱动点云。效果的粒子通道是 cloud 模式时才有意义。 */
+  /** 数据驱动点云。效果的粒子通道为 cloud 模式时才有意义。 */
   cloud: {
     type: PropType<PointCloud | null>;
     default: null;
   };
-  /** 换点云时的形变时长（秒）。 */
+  /** 更换点云时的形变时长（秒）。 */
   morphDuration: {
     type: NumberConstructor;
     default: undefined;
@@ -79,7 +79,7 @@ declare const XhBackground: import("vue").DefineComponent<import("vue").ExtractP
     type: BooleanConstructor;
     default: boolean;
   };
-  /** 渲染成什么标签。 */
+  /** 渲染为哪个标签。 */
   as: {
     type: StringConstructor;
     default: string;
@@ -99,12 +99,12 @@ declare const XhBackground: import("vue").DefineComponent<import("vue").ExtractP
     type: PropType<BackgroundQuality>;
     default: undefined;
   };
-  /** 数据驱动点云。效果的粒子通道是 cloud 模式时才有意义。 */
+  /** 数据驱动点云。效果的粒子通道为 cloud 模式时才有意义。 */
   cloud: {
     type: PropType<PointCloud | null>;
     default: null;
   };
-  /** 换点云时的形变时长（秒）。 */
+  /** 更换点云时的形变时长（秒）。 */
   morphDuration: {
     type: NumberConstructor;
     default: undefined;
@@ -125,7 +125,7 @@ declare const XhBackground: import("vue").DefineComponent<import("vue").ExtractP
     type: BooleanConstructor;
     default: boolean;
   };
-  /** 渲染成什么标签。 */
+  /** 渲染为哪个标签。 */
   as: {
     type: StringConstructor;
     default: string;
@@ -143,9 +143,9 @@ declare const XhBackground: import("vue").DefineComponent<import("vue").ExtractP
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 type BackgroundDirectiveValue = BackgroundEffect | string | UseBackgroundOptions;
 /**
- * `v-background` —— 给任意元素铺一层视觉背景。
+ * `v-background`：为任意元素铺设一层视觉背景。
  *
- * 用在组件上时，Vue 会把指令落到该组件的单一根元素上，所以给现成组件加背景不需要改组件：
+ * 用在组件上时，Vue 会把指令落到该组件的单一根元素上，因此为现成组件添加背景不需要修改组件：
  *
  * ```vue
  * <XhButton v-background="fluidEffect">提交</XhButton>

package/dist/backgrounds.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"backgrounds.d.ts","names":[],"sources":["../src/backgrounds.ts"],"mappings":";;;UA4BiB;EACf,QAAQ;EACR,SAAS,eAAe;EACxB,UAAU;;EAEV;;EAEA;;EAEA;;EAEA;;UAGe;WACN,SAAS,WAAW;;;;;EAK7B,SAAS,SAAS;EAClB,YAAY,QAAQ;EACpB,YAAY,OAAO,eAAe;EAClC,WAAW,OAAO,YAAY,UAAU;EACxC;EACA;EACA;;;;;;;;;iBAUc,cAAc,SAAS,uBAAuB;;;;;cAwCjD,4BAAY,8BAAA;;IAGe,MAAA,SAAS;;;;IACnB,MAAA,SAAS,eAAe;;;;IACvB,MAAA,SAAS;;;;;IAEX,MAAA,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAJE,MAAA,SAAS;;;;IACnB,MAAA,SAAS,eAAe;;;;IACvB,MAAA,SAAS;;;;;IAEX,MAAA,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;qCAuFpC;KAEU,2BAA2B,4BAA4B;;;;;;;;;;;cAoBtD,aAAa,UAAU,aAAa"}
+{"version":3,"file":"backgrounds.d.ts","names":[],"sources":["../src/backgrounds.ts"],"mappings":";;;UAiCiB;EACf,QAAQ;EACR,SAAS,eAAe;EACxB,UAAU;;EAEV;;EAEA;;EAEA;;EAEA;;UAGe;WACN,SAAS,WAAW;;;;;EAK7B,SAAS,SAAS;EAClB,YAAY,QAAQ;EACpB,YAAY,OAAO,eAAe;EAClC,WAAW,OAAO,YAAY,UAAU;EACxC;EACA;EACA;;;;;;;;;iBAUc,cAAc,SAAS,uBAAuB;;;;;cAwCjD,4BAAY,8BAAA;;IAGe,MAAA,SAAS;;;;IACnB,MAAA,SAAS,eAAe;;;;IACvB,MAAA,SAAS;;;;;IAEX,MAAA,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAJE,MAAA,SAAS;;;;IACnB,MAAA,SAAS,eAAe;;;;IACvB,MAAA,SAAS;;;;;IAEX,MAAA,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;qCAuFpC;KAEU,2BAA2B,4BAA4B;;;;;;;;;;;cAoBtD,aAAa,UAAU,aAAa"}

package/dist/backgrounds.js

@@ -2,11 +2,11 @@ import { defineComponent, getCurrentScope, h, onScopeDispose, shallowRef } from
 import { createBackgroundSurface } from "@xihan-ui/backgrounds";
 //#region src/backgrounds.ts
 /**
-* 建一张受 Vue 生命周期管理的视觉画面。
+* 建立一张受 Vue 生命周期管理的视觉画面。
 *
-* 用**函数式 ref** 而不是监听一个模板 ref：元素由渲染器直接交到手上，
-* 不经过响应式与调度队列，因此不受 flush 时序影响，元素换了也一定收得到。
-* 组件卸载时自动销毁；在 setup 之外调用则需自己调 destroy。
+* 使用函数式 ref 而不是监听一个模板 ref：元素由渲染器直接交付，
+* 不经过响应式与调度队列，因此不受 flush 时序影响，元素更换后也一定能收到。
+* 组件卸载时自动销毁；在 setup 之外调用则需自行调用 destroy。
 */
 function useBackground(options) {
 	const surface = shallowRef(null);
@@ -36,8 +36,8 @@ function useBackground(options) {
 	};
 }
 /**
-* `<XhBackground>` —— 独立视觉组件。默认插槽的内容浮在效果之上；
-* 画布铺满根元素且 pointer-events: none，不会挡住插槽里的交互。
+* `<XhBackground>`：独立视觉组件。默认插槽的内容浮在效果之上；
+* 画布铺满根元素且 pointer-events: none，不会遮挡插槽中的交互。
 */
 const XhBackground = defineComponent({
 	name: "XhBackground",
@@ -54,12 +54,12 @@ const XhBackground = defineComponent({
 			type: String,
 			default: void 0
 		},
-		/** 数据驱动点云。效果的粒子通道是 cloud 模式时才有意义。 */
+		/** 数据驱动点云。效果的粒子通道为 cloud 模式时才有意义。 */
 		cloud: {
 			type: Object,
 			default: null
 		},
-		/** 换点云时的形变时长（秒）。 */
+		/** 更换点云时的形变时长（秒）。 */
 		morphDuration: {
 			type: Number,
 			default: void 0
@@ -80,7 +80,7 @@ const XhBackground = defineComponent({
 			type: Boolean,
 			default: true
 		},
-		/** 渲染成什么标签。 */
+		/** 渲染为哪个标签。 */
 		as: {
 			type: String,
 			default: "div"
@@ -101,9 +101,9 @@ const XhBackground = defineComponent({
 		let appliedCloud = null;
 		let appliedAutoplay = props.autoplay;
 		/**
-		* 把当前 props 推到画面上。在渲染函数里调用而不是挂 watcher：
-		* 渲染函数一定会随 props 变化重跑，且这里读到的参数值同时建立了依赖追踪，
-		* 调用方原地改参数对象里的某一项也收得到。
+		* 把当前 props 推送到画面上。在渲染函数中调用而不是挂 watcher：
+		* 渲染函数一定会随 props 变化重新运行，且这里读到的参数值同时建立了依赖追踪，
+		* 调用方就地修改参数对象中的某一项也能收到。
 		*/
 		function sync() {
 			const surface = api.surface.value;
@@ -151,9 +151,9 @@ function toOptions(value) {
 }
 const mounted = /* @__PURE__ */ new WeakMap();
 /**
-* `v-background` —— 给任意元素铺一层视觉背景。
+* `v-background`：为任意元素铺设一层视觉背景。
 *
-* 用在组件上时，Vue 会把指令落到该组件的单一根元素上，所以给现成组件加背景不需要改组件：
+* 用在组件上时，Vue 会把指令落到该组件的单一根元素上，因此为现成组件添加背景不需要修改组件：
 *
 * ```vue
 * <XhButton v-background="fluidEffect">提交</XhButton>

package/dist/backgrounds.js.map

@@ -1 +1 @@
-{"version":3,"file":"backgrounds.js","names":[],"sources":["../src/backgrounds.ts"],"sourcesContent":["// @xihan-ui/vue/backgrounds —— 视觉层的 Vue 适配。\n//\n// 与主入口分开：@xihan-ui/backgrounds 是可选 peer，不用视觉效果的应用不会因为装了本包\n// 而多出一个 WebGL 引擎。用之前先装 @xihan-ui/backgrounds。\n//\n// 三种用法，从轻到重：\n//   v-background   给任意元素或组件的根元素铺一层背景，一个字都不用改组件\n//   XhBackground   独立的视觉组件，插槽内容浮在效果之上\n//   useBackground  自己拿画面实例，接自定义调度或调参面板\n\nimport type {\n  BackgroundEffect,\n  BackgroundQuality,\n  BackgroundSurface,\n  MorphOptions,\n  ParamValue,\n  PointCloud,\n} from '@xihan-ui/backgrounds'\nimport type { Directive, PropType, ShallowRef, VNodeRef } from 'vue'\nimport { createBackgroundSurface } from '@xihan-ui/backgrounds'\nimport {\n  defineComponent,\n  getCurrentScope,\n  h,\n  onScopeDispose,\n  shallowRef,\n} from 'vue'\n\nexport interface UseBackgroundOptions {\n  effect: BackgroundEffect | string\n  params?: Record<string, ParamValue>\n  quality?: BackgroundQuality\n  /** 自动绑定指针事件，默认 true。 */\n  pointer?: boolean\n  /** 创建后立即播放，默认 true。 */\n  autoplay?: boolean\n  /** 系统开启减弱动态效果时冻结时间轴，默认 true。 */\n  respectReducedMotion?: boolean\n  /** 滚出视口时暂停绘制，默认 true。 */\n  pauseOffscreen?: boolean\n}\n\nexport interface UseBackgroundReturn {\n  readonly surface: ShallowRef<BackgroundSurface | null>\n  /**\n   * 挂载点。直接当模板 ref 用：`<div :ref=\"visual.attach\">`，\n   * 渲染器会在元素进出 DOM 时把元素或 null 交进来。\n   */\n  attach: (element: Element | null) => void\n  setEffect: (effect: BackgroundEffect | string) => void\n  setParams: (patch: Record<string, ParamValue>) => void\n  setCloud: (cloud: PointCloud, options?: MorphOptions) => void\n  play: () => void\n  pause: () => void\n  destroy: () => void\n}\n\n/**\n * 建一张受 Vue 生命周期管理的视觉画面。\n *\n * 用**函数式 ref** 而不是监听一个模板 ref：元素由渲染器直接交到手上，\n * 不经过响应式与调度队列，因此不受 flush 时序影响，元素换了也一定收得到。\n * 组件卸载时自动销毁；在 setup 之外调用则需自己调 destroy。\n */\nexport function useBackground(options: UseBackgroundOptions): UseBackgroundReturn {\n  const surface = shallowRef<BackgroundSurface | null>(null)\n  // 元素没换就不动画面：函数式 ref 每次 patch 都会被再调一遍，\n  // 不挡住的话每渲染一帧就销毁重建一次，画面永远停在创建时那份参数上\n  let attached: HTMLElement | null = null\n\n  function attach(element: Element | null): void {\n    const el = element instanceof HTMLElement ? element : null\n    if (el === attached)\n      return\n    attached = el\n    surface.value?.destroy()\n    surface.value = el === null ? null : createBackgroundSurface(el, options)\n  }\n\n  function destroy(): void {\n    attached = null\n    surface.value?.destroy()\n    surface.value = null\n  }\n\n  if (getCurrentScope())\n    onScopeDispose(destroy)\n\n  return {\n    surface,\n    attach,\n    setEffect: (effect): void => surface.value?.setEffect(effect),\n    setParams: (patch): void => surface.value?.setParams(patch),\n    setCloud: (cloud, morph): void => surface.value?.setCloud(cloud, morph),\n    play: (): void => surface.value?.play(),\n    pause: (): void => surface.value?.pause(),\n    destroy,\n  }\n}\n\n/**\n * `<XhBackground>` —— 独立视觉组件。默认插槽的内容浮在效果之上；\n * 画布铺满根元素且 pointer-events: none，不会挡住插槽里的交互。\n */\nexport const XhBackground = defineComponent({\n  name: 'XhBackground',\n  props: {\n    effect: { type: [Object, String] as PropType<BackgroundEffect | string>, required: true },\n    params: { type: Object as PropType<Record<string, ParamValue>>, default: undefined },\n    quality: { type: String as PropType<BackgroundQuality>, default: undefined },\n    /** 数据驱动点云。效果的粒子通道是 cloud 模式时才有意义。 */\n    cloud: { type: Object as PropType<PointCloud | null>, default: null },\n    /** 换点云时的形变时长（秒）。 */\n    morphDuration: { type: Number, default: undefined },\n    pointer: { type: Boolean, default: true },\n    autoplay: { type: Boolean, default: true },\n    respectReducedMotion: { type: Boolean, default: true },\n    pauseOffscreen: { type: Boolean, default: true },\n    /** 渲染成什么标签。 */\n    as: { type: String, default: 'div' },\n  },\n  setup(props, { slots, expose }) {\n    const api = useBackground({\n      effect: props.effect,\n      params: props.params,\n      quality: props.quality,\n      pointer: props.pointer,\n      autoplay: props.autoplay,\n      respectReducedMotion: props.respectReducedMotion,\n      pauseOffscreen: props.pauseOffscreen,\n    })\n\n    let appliedEffect: BackgroundEffect | string | undefined\n    let appliedQuality: BackgroundQuality | undefined\n    let appliedCloud: PointCloud | null = null\n    let appliedAutoplay = props.autoplay\n\n    /**\n     * 把当前 props 推到画面上。在渲染函数里调用而不是挂 watcher：\n     * 渲染函数一定会随 props 变化重跑，且这里读到的参数值同时建立了依赖追踪，\n     * 调用方原地改参数对象里的某一项也收得到。\n     */\n    function sync(): void {\n      const surface = api.surface.value\n      if (surface === null)\n        return\n      if (props.effect !== appliedEffect) {\n        surface.setEffect(props.effect)\n        appliedEffect = props.effect\n      }\n      if (props.quality !== undefined && props.quality !== appliedQuality) {\n        surface.setQuality(props.quality)\n        appliedQuality = props.quality\n      }\n      if (props.params !== undefined)\n        surface.setParams(props.params)\n      if (props.cloud && props.cloud !== appliedCloud) {\n        // 第一份点云直接就位，之后的换形态才走过渡\n        surface.setCloud(props.cloud, { duration: appliedCloud === null ? 0 : props.morphDuration })\n        appliedCloud = props.cloud\n      }\n      if (props.autoplay !== appliedAutoplay) {\n        if (props.autoplay)\n          surface.play()\n        else surface.pause()\n        appliedAutoplay = props.autoplay\n      }\n    }\n\n    // 签名照 VNodeRef 的函数式 ref 写：渲染器在元素进出 DOM 时把元素或 null 交进来。\n    // 同一个元素会被反复交进来，attach 对此幂等；只有真换了画面才重置记账。\n    const mount: VNodeRef = (element): void => {\n      const previous = api.surface.value\n      api.attach(element instanceof HTMLElement ? element : null)\n      const current = api.surface.value\n      if (current === previous || current === null)\n        return\n      appliedEffect = props.effect\n      appliedQuality = props.quality\n      appliedCloud = null\n      appliedAutoplay = props.autoplay\n      sync()\n    }\n\n    expose(api)\n\n    return () => {\n      sync()\n      return h(\n        props.as,\n        // 不发 data-scope：这个宿主不归任何皮肤管，几何全在 features/backgrounds 的内联样式里，\n        // 指令用法（v-background 挂在作者自己的元素上）更是连这层壳都没有。\n        // 发了 scope 而没有对应皮肤，开发模式的皮肤在场探测会给出一条永远修不掉的警告\n        { ref: mount },\n        slots.default?.(),\n      )\n    }\n  },\n})\n\nexport type BackgroundDirectiveValue = BackgroundEffect | string | UseBackgroundOptions\n\nfunction toOptions(value: BackgroundDirectiveValue): UseBackgroundOptions {\n  if (typeof value === 'string')\n    return { effect: value }\n  return 'effect' in value ? value : { effect: value }\n}\n\nconst mounted = new WeakMap<HTMLElement, { surface: BackgroundSurface, effect: BackgroundEffect | string }>()\n\n/**\n * `v-background` —— 给任意元素铺一层视觉背景。\n *\n * 用在组件上时，Vue 会把指令落到该组件的单一根元素上，所以给现成组件加背景不需要改组件：\n *\n * ```vue\n * <XhButton v-background=\"fluidEffect\">提交</XhButton>\n * <div v-background=\"{ effect: 'aurora', params: { speed: 1.6 } }\" />\n * ```\n */\nexport const vBackground: Directive<HTMLElement, BackgroundDirectiveValue> = {\n  mounted(el, binding) {\n    const options = toOptions(binding.value)\n    mounted.set(el, { surface: createBackgroundSurface(el, options), effect: options.effect })\n  },\n  updated(el, binding) {\n    const entry = mounted.get(el)\n    if (entry === undefined)\n      return\n    const options = toOptions(binding.value)\n    if (options.effect !== entry.effect) {\n      entry.surface.setEffect(options.effect)\n      entry.effect = options.effect\n    }\n    if (options.params !== undefined)\n      entry.surface.setParams(options.params)\n  },\n  unmounted(el) {\n    mounted.get(el)?.surface.destroy()\n    mounted.delete(el)\n  },\n}\n"],"mappings":"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"}
+{"version":3,"file":"backgrounds.js","names":[],"sources":["../src/backgrounds.ts"],"sourcesContent":["/*\n * Copyright (c) 2021-Present XiHanFun and contributors.\n * Licensed under the MIT License. See LICENSE in the project root for license information.\n */\n\n// @xihan-ui/vue/backgrounds —— 视觉层的 Vue 适配。\n//\n// 与主入口分开：@xihan-ui/backgrounds 是可选 peer，不用视觉效果的应用不会因为装了本包\n// 而多出一个 WebGL 引擎。用之前先装 @xihan-ui/backgrounds。\n//\n// 三种用法，从轻到重：\n//   v-background   给任意元素或组件的根元素铺一层背景，一个字都不用改组件\n//   XhBackground   独立的视觉组件，插槽内容浮在效果之上\n//   useBackground  自己拿画面实例，接自定义调度或调参面板\n\nimport type {\n  BackgroundEffect,\n  BackgroundQuality,\n  BackgroundSurface,\n  MorphOptions,\n  ParamValue,\n  PointCloud,\n} from '@xihan-ui/backgrounds'\nimport type { Directive, PropType, ShallowRef, VNodeRef } from 'vue'\nimport { createBackgroundSurface } from '@xihan-ui/backgrounds'\nimport {\n  defineComponent,\n  getCurrentScope,\n  h,\n  onScopeDispose,\n  shallowRef,\n} from 'vue'\n\nexport interface UseBackgroundOptions {\n  effect: BackgroundEffect | string\n  params?: Record<string, ParamValue>\n  quality?: BackgroundQuality\n  /** 自动绑定指针事件，默认 true。 */\n  pointer?: boolean\n  /** 创建后立即播放，默认 true。 */\n  autoplay?: boolean\n  /** 系统开启减弱动态效果时冻结时间轴，默认 true。 */\n  respectReducedMotion?: boolean\n  /** 滚出视口时暂停绘制，默认 true。 */\n  pauseOffscreen?: boolean\n}\n\nexport interface UseBackgroundReturn {\n  readonly surface: ShallowRef<BackgroundSurface | null>\n  /**\n   * 挂载点。直接作为模板 ref 使用：`<div :ref=\"visual.attach\">`，\n   * 渲染器会在元素进出 DOM 时把元素或 null 传入。\n   */\n  attach: (element: Element | null) => void\n  setEffect: (effect: BackgroundEffect | string) => void\n  setParams: (patch: Record<string, ParamValue>) => void\n  setCloud: (cloud: PointCloud, options?: MorphOptions) => void\n  play: () => void\n  pause: () => void\n  destroy: () => void\n}\n\n/**\n * 建立一张受 Vue 生命周期管理的视觉画面。\n *\n * 使用函数式 ref 而不是监听一个模板 ref：元素由渲染器直接交付，\n * 不经过响应式与调度队列，因此不受 flush 时序影响，元素更换后也一定能收到。\n * 组件卸载时自动销毁；在 setup 之外调用则需自行调用 destroy。\n */\nexport function useBackground(options: UseBackgroundOptions): UseBackgroundReturn {\n  const surface = shallowRef<BackgroundSurface | null>(null)\n  // 元素没换就不动画面：函数式 ref 每次 patch 都会被再调一遍，\n  // 不挡住的话每渲染一帧就销毁重建一次，画面永远停在创建时那份参数上\n  let attached: HTMLElement | null = null\n\n  function attach(element: Element | null): void {\n    const el = element instanceof HTMLElement ? element : null\n    if (el === attached)\n      return\n    attached = el\n    surface.value?.destroy()\n    surface.value = el === null ? null : createBackgroundSurface(el, options)\n  }\n\n  function destroy(): void {\n    attached = null\n    surface.value?.destroy()\n    surface.value = null\n  }\n\n  if (getCurrentScope())\n    onScopeDispose(destroy)\n\n  return {\n    surface,\n    attach,\n    setEffect: (effect): void => surface.value?.setEffect(effect),\n    setParams: (patch): void => surface.value?.setParams(patch),\n    setCloud: (cloud, morph): void => surface.value?.setCloud(cloud, morph),\n    play: (): void => surface.value?.play(),\n    pause: (): void => surface.value?.pause(),\n    destroy,\n  }\n}\n\n/**\n * `<XhBackground>`：独立视觉组件。默认插槽的内容浮在效果之上；\n * 画布铺满根元素且 pointer-events: none，不会遮挡插槽中的交互。\n */\nexport const XhBackground = defineComponent({\n  name: 'XhBackground',\n  props: {\n    effect: { type: [Object, String] as PropType<BackgroundEffect | string>, required: true },\n    params: { type: Object as PropType<Record<string, ParamValue>>, default: undefined },\n    quality: { type: String as PropType<BackgroundQuality>, default: undefined },\n    /** 数据驱动点云。效果的粒子通道为 cloud 模式时才有意义。 */\n    cloud: { type: Object as PropType<PointCloud | null>, default: null },\n    /** 更换点云时的形变时长（秒）。 */\n    morphDuration: { type: Number, default: undefined },\n    pointer: { type: Boolean, default: true },\n    autoplay: { type: Boolean, default: true },\n    respectReducedMotion: { type: Boolean, default: true },\n    pauseOffscreen: { type: Boolean, default: true },\n    /** 渲染为哪个标签。 */\n    as: { type: String, default: 'div' },\n  },\n  setup(props, { slots, expose }) {\n    const api = useBackground({\n      effect: props.effect,\n      params: props.params,\n      quality: props.quality,\n      pointer: props.pointer,\n      autoplay: props.autoplay,\n      respectReducedMotion: props.respectReducedMotion,\n      pauseOffscreen: props.pauseOffscreen,\n    })\n\n    let appliedEffect: BackgroundEffect | string | undefined\n    let appliedQuality: BackgroundQuality | undefined\n    let appliedCloud: PointCloud | null = null\n    let appliedAutoplay = props.autoplay\n\n    /**\n     * 把当前 props 推送到画面上。在渲染函数中调用而不是挂 watcher：\n     * 渲染函数一定会随 props 变化重新运行，且这里读到的参数值同时建立了依赖追踪，\n     * 调用方就地修改参数对象中的某一项也能收到。\n     */\n    function sync(): void {\n      const surface = api.surface.value\n      if (surface === null)\n        return\n      if (props.effect !== appliedEffect) {\n        surface.setEffect(props.effect)\n        appliedEffect = props.effect\n      }\n      if (props.quality !== undefined && props.quality !== appliedQuality) {\n        surface.setQuality(props.quality)\n        appliedQuality = props.quality\n      }\n      if (props.params !== undefined)\n        surface.setParams(props.params)\n      if (props.cloud && props.cloud !== appliedCloud) {\n        // 第一份点云直接就位，之后的换形态才走过渡\n        surface.setCloud(props.cloud, { duration: appliedCloud === null ? 0 : props.morphDuration })\n        appliedCloud = props.cloud\n      }\n      if (props.autoplay !== appliedAutoplay) {\n        if (props.autoplay)\n          surface.play()\n        else surface.pause()\n        appliedAutoplay = props.autoplay\n      }\n    }\n\n    // 签名照 VNodeRef 的函数式 ref 写：渲染器在元素进出 DOM 时把元素或 null 交进来。\n    // 同一个元素会被反复交进来，attach 对此幂等；只有真换了画面才重置记账。\n    const mount: VNodeRef = (element): void => {\n      const previous = api.surface.value\n      api.attach(element instanceof HTMLElement ? element : null)\n      const current = api.surface.value\n      if (current === previous || current === null)\n        return\n      appliedEffect = props.effect\n      appliedQuality = props.quality\n      appliedCloud = null\n      appliedAutoplay = props.autoplay\n      sync()\n    }\n\n    expose(api)\n\n    return () => {\n      sync()\n      return h(\n        props.as,\n        // 不发 data-scope：这个宿主不归任何皮肤管，几何全在 features/backgrounds 的内联样式里，\n        // 指令用法（v-background 挂在作者自己的元素上）更是连这层壳都没有。\n        // 发了 scope 而没有对应皮肤，开发模式的皮肤在场探测会给出一条永远修不掉的警告\n        { ref: mount },\n        slots.default?.(),\n      )\n    }\n  },\n})\n\nexport type BackgroundDirectiveValue = BackgroundEffect | string | UseBackgroundOptions\n\nfunction toOptions(value: BackgroundDirectiveValue): UseBackgroundOptions {\n  if (typeof value === 'string')\n    return { effect: value }\n  return 'effect' in value ? value : { effect: value }\n}\n\nconst mounted = new WeakMap<HTMLElement, { surface: BackgroundSurface, effect: BackgroundEffect | string }>()\n\n/**\n * `v-background`：为任意元素铺设一层视觉背景。\n *\n * 用在组件上时，Vue 会把指令落到该组件的单一根元素上，因此为现成组件添加背景不需要修改组件：\n *\n * ```vue\n * <XhButton v-background=\"fluidEffect\">提交</XhButton>\n * <div v-background=\"{ effect: 'aurora', params: { speed: 1.6 } }\" />\n * ```\n */\nexport const vBackground: Directive<HTMLElement, BackgroundDirectiveValue> = {\n  mounted(el, binding) {\n    const options = toOptions(binding.value)\n    mounted.set(el, { surface: createBackgroundSurface(el, options), effect: options.effect })\n  },\n  updated(el, binding) {\n    const entry = mounted.get(el)\n    if (entry === undefined)\n      return\n    const options = toOptions(binding.value)\n    if (options.effect !== entry.effect) {\n      entry.surface.setEffect(options.effect)\n      entry.effect = options.effect\n    }\n    if (options.params !== undefined)\n      entry.surface.setParams(options.params)\n  },\n  unmounted(el) {\n    mounted.get(el)?.surface.destroy()\n    mounted.delete(el)\n  },\n}\n"],"mappings":"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"}

package/dist/behavior.d.ts

@@ -1,38 +1,41 @@
 import { MaybeRefOrGetter, Ref } from "vue";
-import { RuntimeConfig } from "@xihan-ui/kernel";
-import { HoverIntentOptions, ScrollMetrics, ScrollTrackerOptions, StickToBottomOptions, StickToBottomState, Typeahead, TypeaheadOptions } from "@xihan-ui/behavior";
+import { HoverIntentOptions, RuntimeConfig, ScrollMetrics, ScrollTrackerOptions, StickToBottomOptions, StickToBottomState, Typeahead, TypeaheadOptions } from "@xihan-ui/core";
 //#region src/behavior.d.ts
 /**
- * 按需加解滚动锁。锁是引用计数的，多处同时锁不会互相踩。
+ * 按需加解滚动锁。锁是引用计数的，多处同时加锁不会互相干扰。
  *
- * 锁哪个元素由 `config.scrollRoot?.()` 决定；宿主把滚动搬进了内容容器
- * （body 自己不滚）时必须在配置里注入，否则锁到的是不滚的那个。
+ * 锁定哪个元素由 `config.scrollRoot()` 决定；宿主把滚动移入内容容器
+ * （body 自身不滚动）时必须在配置中注入，否则锁定的是不滚动的元素。
  */
 declare function useScrollLock(active: MaybeRefOrGetter<boolean>, config: MaybeRefOrGetter<RuntimeConfig>): void;
 /**
- * 悬停意图：进触发器停够时长才报开，离开时按安全三角判断是不是正朝浮层去。
- * 用于自建的悬停浮层，省掉「斜着划向子菜单半路就关了」那类手写延时。
+ * 悬停意图：进入触发器停留足够时长才报告展开，离开时按安全三角判断是否正朝浮层移动。
+ * 用于自建的悬停浮层，省去斜向划向子菜单时中途关闭这类手写延时。
  */
-declare function useHoverIntent(options: HoverIntentOptions): void;
-/** 观察滚动容器的位置与尺寸，值变了才回调。返回最近一次量到的值。 */
+interface UseHoverIntentOptions extends Omit<HoverIntentOptions, 'trigger'> {
+  /** 当前悬停宿主；模板 ref 尚未就位或节点暂时不渲染时返回 null。 */
+  getTriggerEl: () => HTMLElement | null;
+}
+declare function useHoverIntent(options: MaybeRefOrGetter<UseHoverIntentOptions>): void;
+/** 观察滚动容器的位置与尺寸，值变化时才回调。返回最近一次测得的值。 */
 declare function useScrollTracker(options: ScrollTrackerOptions): Ref<ScrollMetrics | null>;
 interface StickToBottom {
   /** 当前贴底状态，随原语的回调更新。 */
   state: Ref<StickToBottomState | null>;
-  /** 滚到底部并恢复粘附，默认 'smooth'，reducedMotion 为真时强制 'instant'。 */
+  /** 滚动到底部并恢复粘附，默认 'smooth'，reducedMotion 为真时强制 'instant'。 */
   scrollToBottom: (behavior?: 'smooth' | 'instant') => void;
-  /** 重新读取 scrollEl / contentEl，节点变了就解绑重绑。 */
+  /** 重新读取 scrollEl / contentEl，节点变化时解绑重绑。 */
   retarget: () => void;
 }
 /**
- * 内容增长时保持贴底，用户往上滚过就松手不再跟。
+ * 内容增长时保持粘底，用户向上滚动后即停止跟随。
  *
- * 两个 getter 里读的是 ref 时自动重绑：原语在建好那一刻就绑一次，
- * 而 setup 阶段模板 ref 还是 null，不重绑等于没挂上。
+ * 两个 getter 中读取的是 ref 时自动重绑：原语在建立时就绑定一次，
+ * 而 setup 阶段模板 ref 仍为 null，不重绑等于未挂载。
  */
 declare function useStickToBottom(options: StickToBottomOptions): StickToBottom;
-/** 连续敲字母跳到匹配项的缓冲，超时自动清空。 */
+/** 连续输入字母跳转到匹配项的缓冲，超时自动清空。 */
 declare function useTypeahead(options?: TypeaheadOptions): Typeahead;
 //#endregion
-export { StickToBottom, useHoverIntent, useScrollLock, useScrollTracker, useStickToBottom, useTypeahead };
+export { StickToBottom, UseHoverIntentOptions, useHoverIntent, useScrollLock, useScrollTracker, useStickToBottom, useTypeahead };
 //# sourceMappingURL=behavior.d.ts.map

package/dist/behavior.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"behavior.d.ts","names":[],"sources":["../src/behavior.ts"],"mappings":";;;;;;;;;;iBAoCgB,cACd,QAAQ,2BACR,QAAQ,iBAAiB;;;;;iBAwBX,eAAe,SAAS;;iBAMxB,iBAAiB,SAAS,uBAAuB,IAAI;UAapD;;EAEf,OAAO,IAAI;;EAEX,iBAAiB;;EAEjB;;;;;;;;iBASc,iBAAiB,SAAS,uBAAuB;;iBAejD,aAAa,UAAS,mBAAwB"}
+{"version":3,"file":"behavior.d.ts","names":[],"sources":["../src/behavior.ts"],"mappings":";;;;;;;;;iBAwCgB,cACd,QAAQ,2BACR,QAAQ,iBAAiB;;;;;UAgCV,8BAA8B,KAAK;;EAElD,oBAAoB;;iBAGN,eAAe,SAAS,iBAAiB;;iBA8CzC,iBAAiB,SAAS,uBAAuB,IAAI;UAapD;;EAEf,OAAO,IAAI;;EAEX,iBAAiB;;EAEjB;;;;;;;;iBASc,iBAAiB,SAAS,uBAAuB;;iBAejD,aAAa,UAAS,mBAAwB"}

package/dist/behavior.js

@@ -1,32 +1,74 @@
-import { onScopeDispose, ref, toValue, watch } from "vue";
-import { acquireScrollLock, createScrollTracker, createStickToBottom, createTypeahead, trackHoverIntent } from "@xihan-ui/behavior";
+import { onMounted, onScopeDispose, ref, toValue, watch } from "vue";
+import { acquireScrollLock, createScrollTracker, createStickToBottom, createTypeahead, trackHoverIntent } from "@xihan-ui/core";
 //#region src/behavior.ts
 /**
-* 按需加解滚动锁。锁是引用计数的，多处同时锁不会互相踩。
+* 按需加解滚动锁。锁是引用计数的，多处同时加锁不会互相干扰。
 *
-* 锁哪个元素由 `config.scrollRoot?.()` 决定；宿主把滚动搬进了内容容器
-* （body 自己不滚）时必须在配置里注入，否则锁到的是不滚的那个。
+* 锁定哪个元素由 `config.scrollRoot()` 决定；宿主把滚动移入内容容器
+* （body 自身不滚动）时必须在配置中注入，否则锁定的是不滚动的元素。
 */
 function useScrollLock(active, config) {
 	let handle = null;
+	let stopWatching = null;
 	const release = () => {
-		handle?.dispose();
+		const current = handle;
 		handle = null;
+		current?.dispose();
 	};
-	watch(() => toValue(active), (on) => {
-		if (on && !handle) handle = acquireScrollLock({ config: toValue(config) });
-		else if (!on) release();
-	}, { immediate: true });
-	onScopeDispose(release);
+	onMounted(() => {
+		stopWatching = watch(() => toValue(active), (on) => {
+			if (on && !handle) handle = acquireScrollLock({ config: toValue(config) });
+			else if (!on) release();
+		}, {
+			immediate: true,
+			flush: "post"
+		});
+	});
+	onScopeDispose(() => {
+		stopWatching?.();
+		stopWatching = null;
+		release();
+	});
 }
-/**
-* 悬停意图：进触发器停够时长才报开，离开时按安全三角判断是不是正朝浮层去。
-* 用于自建的悬停浮层，省掉「斜着划向子菜单半路就关了」那类手写延时。
-*/
 function useHoverIntent(options) {
-	onScopeDispose(trackHoverIntent(options));
+	const readOptions = () => toValue(options);
+	let stopTracking = null;
+	let stopWatching = null;
+	const release = () => {
+		stopTracking?.();
+		stopTracking = null;
+	};
+	onMounted(() => {
+		stopWatching = watch([
+			() => readOptions().getTriggerEl(),
+			() => readOptions().openDelay,
+			() => readOptions().closeDelay,
+			() => readOptions().buffer
+		], ([trigger]) => {
+			release();
+			if (trigger === null) return;
+			const current = readOptions();
+			stopTracking = trackHoverIntent({
+				trigger,
+				getContentEl: () => readOptions().getContentEl(),
+				openDelay: current.openDelay,
+				closeDelay: current.closeDelay,
+				buffer: current.buffer,
+				onOpenIntent: () => readOptions().onOpenIntent(),
+				onCloseIntent: () => readOptions().onCloseIntent()
+			});
+		}, {
+			immediate: true,
+			flush: "post"
+		});
+	});
+	onScopeDispose(() => {
+		stopWatching?.();
+		stopWatching = null;
+		release();
+	});
 }
-/** 观察滚动容器的位置与尺寸，值变了才回调。返回最近一次量到的值。 */
+/** 观察滚动容器的位置与尺寸，值变化时才回调。返回最近一次测得的值。 */
 function useScrollTracker(options) {
 	const metrics = ref(null);
 	const handle = createScrollTracker({
@@ -40,10 +82,10 @@ function useScrollTracker(options) {
 	return metrics;
 }
 /**
-* 内容增长时保持贴底，用户往上滚过就松手不再跟。
+* 内容增长时保持粘底，用户向上滚动后即停止跟随。
 *
-* 两个 getter 里读的是 ref 时自动重绑：原语在建好那一刻就绑一次，
-* 而 setup 阶段模板 ref 还是 null，不重绑等于没挂上。
+* 两个 getter 中读取的是 ref 时自动重绑：原语在建立时就绑定一次，
+* 而 setup 阶段模板 ref 仍为 null，不重绑等于未挂载。
 */
 function useStickToBottom(options) {
 	const state = ref(null);
@@ -62,7 +104,7 @@ function useStickToBottom(options) {
 		retarget: handle.retarget
 	};
 }
-/** 连续敲字母跳到匹配项的缓冲，超时自动清空。 */
+/** 连续输入字母跳转到匹配项的缓冲，超时自动清空。 */
 function useTypeahead(options = {}) {
 	const typeahead = createTypeahead(options);
 	onScopeDispose(() => typeahead.clear());

package/dist/behavior.js.map

@@ -1 +1 @@
-{"version":3,"file":"behavior.js","names":[],"sources":["../src/behavior.ts"],"sourcesContent":["// @xihan-ui/vue/behavior —— 行为原语的 Vue 包装。\n//\n// @xihan-ui/behavior 里的原语都是框架无关的：收一份配置与几个元素 getter，\n// 返回一个要自己释放的句柄。接进 Vue 无非是把释放挂到作用域结束，\n// 于是这些包装只做那一件事，不改原语的语义、也不加新概念。\n//\n// 与主入口分开：自建浮层才用得上这一层，不用的应用不必把它压进主入口的体积。\n// 需要层栈仪式的那几个（消解层、焦点域、背景失活）不在这里——\n// 它们要按顺序接四五个东西，接错的表现是「点子菜单父层跟着关」这种不报错的怪症，\n// 那种场景请直接用库里现成的浮层组件。\nimport type {\n  HoverIntentOptions,\n  ScrollMetrics,\n  ScrollTrackerOptions,\n  StickToBottomOptions,\n  StickToBottomState,\n  Typeahead,\n  TypeaheadOptions,\n} from '@xihan-ui/behavior'\nimport type { RuntimeConfig } from '@xihan-ui/kernel'\nimport type { MaybeRefOrGetter, Ref } from 'vue'\nimport {\n  acquireScrollLock,\n  createScrollTracker,\n  createStickToBottom,\n  createTypeahead,\n  trackHoverIntent,\n} from '@xihan-ui/behavior'\nimport { onScopeDispose, ref, toValue, watch } from 'vue'\n\n/**\n * 按需加解滚动锁。锁是引用计数的，多处同时锁不会互相踩。\n *\n * 锁哪个元素由 `config.scrollRoot?.()` 决定；宿主把滚动搬进了内容容器\n * （body 自己不滚）时必须在配置里注入，否则锁到的是不滚的那个。\n */\nexport function useScrollLock(\n  active: MaybeRefOrGetter<boolean>,\n  config: MaybeRefOrGetter<RuntimeConfig>,\n): void {\n  let handle: { dispose: () => void } | null = null\n  const release = (): void => {\n    handle?.dispose()\n    handle = null\n  }\n  watch(\n    () => toValue(active),\n    (on) => {\n      if (on && !handle)\n        handle = acquireScrollLock({ config: toValue(config) })\n      else if (!on)\n        release()\n    },\n    { immediate: true },\n  )\n  onScopeDispose(release)\n}\n\n/**\n * 悬停意图：进触发器停够时长才报开，离开时按安全三角判断是不是正朝浮层去。\n * 用于自建的悬停浮层，省掉「斜着划向子菜单半路就关了」那类手写延时。\n */\nexport function useHoverIntent(options: HoverIntentOptions): void {\n  const stop = trackHoverIntent(options)\n  onScopeDispose(stop)\n}\n\n/** 观察滚动容器的位置与尺寸，值变了才回调。返回最近一次量到的值。 */\nexport function useScrollTracker(options: ScrollTrackerOptions): Ref<ScrollMetrics | null> {\n  const metrics = ref<ScrollMetrics | null>(null)\n  const handle = createScrollTracker({\n    ...options,\n    onChange: (next) => {\n      metrics.value = next\n      options.onChange?.(next)\n    },\n  })\n  onScopeDispose(() => handle.dispose())\n  return metrics\n}\n\nexport interface StickToBottom {\n  /** 当前贴底状态，随原语的回调更新。 */\n  state: Ref<StickToBottomState | null>\n  /** 滚到底部并恢复粘附，默认 'smooth'，reducedMotion 为真时强制 'instant'。 */\n  scrollToBottom: (behavior?: 'smooth' | 'instant') => void\n  /** 重新读取 scrollEl / contentEl，节点变了就解绑重绑。 */\n  retarget: () => void\n}\n\n/**\n * 内容增长时保持贴底，用户往上滚过就松手不再跟。\n *\n * 两个 getter 里读的是 ref 时自动重绑：原语在建好那一刻就绑一次，\n * 而 setup 阶段模板 ref 还是 null，不重绑等于没挂上。\n */\nexport function useStickToBottom(options: StickToBottomOptions): StickToBottom {\n  const state = ref<StickToBottomState | null>(null)\n  const handle = createStickToBottom({\n    ...options,\n    onChange: (next) => {\n      state.value = next\n      options.onChange?.(next)\n    },\n  })\n  watch([() => options.scrollEl(), () => options.contentEl()], () => handle.retarget())\n  onScopeDispose(() => handle.dispose())\n  return { state, scrollToBottom: handle.scrollToBottom, retarget: handle.retarget }\n}\n\n/** 连续敲字母跳到匹配项的缓冲，超时自动清空。 */\nexport function useTypeahead(options: TypeaheadOptions = {}): Typeahead {\n  const typeahead = createTypeahead(options)\n  onScopeDispose(() => typeahead.clear())\n  return typeahead\n}\n"],"mappings":";;;;;;;;;AAoCA,SAAgB,cACd,QACA,QACM;CACN,IAAI,SAAyC;CAC7C,MAAM,gBAAsB;EAC1B,QAAQ,QAAQ;EAChB,SAAS;CACX;CACA,YACQ,QAAQ,MAAM,IACnB,OAAO;EACN,IAAI,MAAM,CAAC,QACT,SAAS,kBAAkB,EAAE,QAAQ,QAAQ,MAAM,EAAE,CAAC;OACnD,IAAI,CAAC,IACR,QAAQ;CACZ,GACA,EAAE,WAAW,KAAK,CACpB;CACA,eAAe,OAAO;AACxB;;;;;AAMA,SAAgB,eAAe,SAAmC;CAEhE,eADa,iBAAiB,OACZ,CAAC;AACrB;;AAGA,SAAgB,iBAAiB,SAA0D;CACzF,MAAM,UAAU,IAA0B,IAAI;CAC9C,MAAM,SAAS,oBAAoB;EACjC,GAAG;EACH,WAAW,SAAS;GAClB,QAAQ,QAAQ;GAChB,QAAQ,WAAW,IAAI;EACzB;CACF,CAAC;CACD,qBAAqB,OAAO,QAAQ,CAAC;CACrC,OAAO;AACT;;;;;;;AAiBA,SAAgB,iBAAiB,SAA8C;CAC7E,MAAM,QAAQ,IAA+B,IAAI;CACjD,MAAM,SAAS,oBAAoB;EACjC,GAAG;EACH,WAAW,SAAS;GAClB,MAAM,QAAQ;GACd,QAAQ,WAAW,IAAI;EACzB;CACF,CAAC;CACD,MAAM,OAAO,QAAQ,SAAS,SAAS,QAAQ,UAAU,CAAC,SAAS,OAAO,SAAS,CAAC;CACpF,qBAAqB,OAAO,QAAQ,CAAC;CACrC,OAAO;EAAE;EAAO,gBAAgB,OAAO;EAAgB,UAAU,OAAO;CAAS;AACnF;;AAGA,SAAgB,aAAa,UAA4B,CAAC,GAAc;CACtE,MAAM,YAAY,gBAAgB,OAAO;CACzC,qBAAqB,UAAU,MAAM,CAAC;CACtC,OAAO;AACT"}
+{"version":3,"file":"behavior.js","names":[],"sources":["../src/behavior.ts"],"sourcesContent":["/*\n * Copyright (c) 2021-Present XiHanFun and contributors.\n * Licensed under the MIT License. See LICENSE in the project root for license information.\n */\n\n// @xihan-ui/vue/behavior —— 行为原语的 Vue 包装。\n//\n// @xihan-ui/core 里的原语都是框架无关的：收一份配置与 DOM 输入，返回一个要自己\n// 释放的句柄。Vue 包装把建立、节点换代与释放对齐到组件生命周期，不改原语语义。\n//\n// 与主入口分开：自建浮层才用得上这一层，不用的应用不必把它压进主入口的体积。\n// 需要层栈仪式的那几个（消解层、焦点域、背景失活）不在这里——\n// 它们要按顺序接四五个东西，接错的表现是「点子菜单父层跟着关」这种不报错的怪症，\n// 那种场景请直接用库里现成的浮层组件。\nimport type {\n  HoverIntentOptions as CoreHoverIntentOptions,\n  RuntimeConfig,\n  ScrollMetrics,\n  ScrollTrackerOptions,\n  StickToBottomOptions,\n  StickToBottomState,\n  Typeahead,\n  TypeaheadOptions,\n} from '@xihan-ui/core'\nimport type { MaybeRefOrGetter, Ref } from 'vue'\nimport {\n  acquireScrollLock,\n  createScrollTracker,\n  createStickToBottom,\n  createTypeahead,\n  trackHoverIntent,\n} from '@xihan-ui/core'\nimport { onMounted, onScopeDispose, ref, toValue, watch } from 'vue'\n\n/**\n * 按需加解滚动锁。锁是引用计数的，多处同时加锁不会互相干扰。\n *\n * 锁定哪个元素由 `config.scrollRoot()` 决定；宿主把滚动移入内容容器\n * （body 自身不滚动）时必须在配置中注入，否则锁定的是不滚动的元素。\n */\nexport function useScrollLock(\n  active: MaybeRefOrGetter<boolean>,\n  config: MaybeRefOrGetter<RuntimeConfig>,\n): void {\n  let handle: { dispose: () => void } | null = null\n  let stopWatching: (() => void) | null = null\n  const release = (): void => {\n    const current = handle\n    handle = null\n    current?.dispose()\n  }\n  onMounted(() => {\n    stopWatching = watch(\n      () => toValue(active),\n      (on) => {\n        if (on && !handle)\n          handle = acquireScrollLock({ config: toValue(config) })\n        else if (!on)\n          release()\n      },\n      { immediate: true, flush: 'post' },\n    )\n  })\n  onScopeDispose(() => {\n    stopWatching?.()\n    stopWatching = null\n    release()\n  })\n}\n\n/**\n * 悬停意图：进入触发器停留足够时长才报告展开，离开时按安全三角判断是否正朝浮层移动。\n * 用于自建的悬停浮层，省去斜向划向子菜单时中途关闭这类手写延时。\n */\nexport interface UseHoverIntentOptions extends Omit<CoreHoverIntentOptions, 'trigger'> {\n  /** 当前悬停宿主；模板 ref 尚未就位或节点暂时不渲染时返回 null。 */\n  getTriggerEl: () => HTMLElement | null\n}\n\nexport function useHoverIntent(options: MaybeRefOrGetter<UseHoverIntentOptions>): void {\n  const readOptions = (): UseHoverIntentOptions => toValue(options)\n  let stopTracking: (() => void) | null = null\n  let stopWatching: (() => void) | null = null\n\n  const release = (): void => {\n    stopTracking?.()\n    stopTracking = null\n  }\n\n  onMounted(() => {\n    stopWatching = watch(\n      [\n        () => readOptions().getTriggerEl(),\n        () => readOptions().openDelay,\n        () => readOptions().closeDelay,\n        () => readOptions().buffer,\n      ],\n      ([trigger]) => {\n        release()\n        // null 是 Vue 模板节点尚未在场的明确生命周期状态；节点出现后本 watcher 会建立绑定。\n        if (trigger === null)\n          return\n        const current = readOptions()\n        stopTracking = trackHoverIntent({\n          trigger,\n          getContentEl: () => readOptions().getContentEl(),\n          openDelay: current.openDelay,\n          closeDelay: current.closeDelay,\n          buffer: current.buffer,\n          onOpenIntent: () => readOptions().onOpenIntent(),\n          onCloseIntent: () => readOptions().onCloseIntent(),\n        })\n      },\n      { immediate: true, flush: 'post' },\n    )\n  })\n\n  onScopeDispose(() => {\n    stopWatching?.()\n    stopWatching = null\n    release()\n  })\n}\n\n/** 观察滚动容器的位置与尺寸，值变化时才回调。返回最近一次测得的值。 */\nexport function useScrollTracker(options: ScrollTrackerOptions): Ref<ScrollMetrics | null> {\n  const metrics = ref<ScrollMetrics | null>(null)\n  const handle = createScrollTracker({\n    ...options,\n    onChange: (next) => {\n      metrics.value = next\n      options.onChange?.(next)\n    },\n  })\n  onScopeDispose(() => handle.dispose())\n  return metrics\n}\n\nexport interface StickToBottom {\n  /** 当前贴底状态，随原语的回调更新。 */\n  state: Ref<StickToBottomState | null>\n  /** 滚动到底部并恢复粘附，默认 'smooth'，reducedMotion 为真时强制 'instant'。 */\n  scrollToBottom: (behavior?: 'smooth' | 'instant') => void\n  /** 重新读取 scrollEl / contentEl，节点变化时解绑重绑。 */\n  retarget: () => void\n}\n\n/**\n * 内容增长时保持粘底，用户向上滚动后即停止跟随。\n *\n * 两个 getter 中读取的是 ref 时自动重绑：原语在建立时就绑定一次，\n * 而 setup 阶段模板 ref 仍为 null，不重绑等于未挂载。\n */\nexport function useStickToBottom(options: StickToBottomOptions): StickToBottom {\n  const state = ref<StickToBottomState | null>(null)\n  const handle = createStickToBottom({\n    ...options,\n    onChange: (next) => {\n      state.value = next\n      options.onChange?.(next)\n    },\n  })\n  watch([() => options.scrollEl(), () => options.contentEl()], () => handle.retarget())\n  onScopeDispose(() => handle.dispose())\n  return { state, scrollToBottom: handle.scrollToBottom, retarget: handle.retarget }\n}\n\n/** 连续输入字母跳转到匹配项的缓冲，超时自动清空。 */\nexport function useTypeahead(options: TypeaheadOptions = {}): Typeahead {\n  const typeahead = createTypeahead(options)\n  onScopeDispose(() => typeahead.clear())\n  return typeahead\n}\n"],"mappings":";;;;;;;;;AAwCA,SAAgB,cACd,QACA,QACM;CACN,IAAI,SAAyC;CAC7C,IAAI,eAAoC;CACxC,MAAM,gBAAsB;EAC1B,MAAM,UAAU;EAChB,SAAS;EACT,SAAS,QAAQ;CACnB;CACA,gBAAgB;EACd,eAAe,YACP,QAAQ,MAAM,IACnB,OAAO;GACN,IAAI,MAAM,CAAC,QACT,SAAS,kBAAkB,EAAE,QAAQ,QAAQ,MAAM,EAAE,CAAC;QACnD,IAAI,CAAC,IACR,QAAQ;EACZ,GACA;GAAE,WAAW;GAAM,OAAO;EAAO,CACnC;CACF,CAAC;CACD,qBAAqB;EACnB,eAAe;EACf,eAAe;EACf,QAAQ;CACV,CAAC;AACH;AAWA,SAAgB,eAAe,SAAwD;CACrF,MAAM,oBAA2C,QAAQ,OAAO;CAChE,IAAI,eAAoC;CACxC,IAAI,eAAoC;CAExC,MAAM,gBAAsB;EAC1B,eAAe;EACf,eAAe;CACjB;CAEA,gBAAgB;EACd,eAAe,MACb;SACQ,YAAY,CAAC,CAAC,aAAa;SAC3B,YAAY,CAAC,CAAC;SACd,YAAY,CAAC,CAAC;SACd,YAAY,CAAC,CAAC;EACtB,IACC,CAAC,aAAa;GACb,QAAQ;GAER,IAAI,YAAY,MACd;GACF,MAAM,UAAU,YAAY;GAC5B,eAAe,iBAAiB;IAC9B;IACA,oBAAoB,YAAY,CAAC,CAAC,aAAa;IAC/C,WAAW,QAAQ;IACnB,YAAY,QAAQ;IACpB,QAAQ,QAAQ;IAChB,oBAAoB,YAAY,CAAC,CAAC,aAAa;IAC/C,qBAAqB,YAAY,CAAC,CAAC,cAAc;GACnD,CAAC;EACH,GACA;GAAE,WAAW;GAAM,OAAO;EAAO,CACnC;CACF,CAAC;CAED,qBAAqB;EACnB,eAAe;EACf,eAAe;EACf,QAAQ;CACV,CAAC;AACH;;AAGA,SAAgB,iBAAiB,SAA0D;CACzF,MAAM,UAAU,IAA0B,IAAI;CAC9C,MAAM,SAAS,oBAAoB;EACjC,GAAG;EACH,WAAW,SAAS;GAClB,QAAQ,QAAQ;GAChB,QAAQ,WAAW,IAAI;EACzB;CACF,CAAC;CACD,qBAAqB,OAAO,QAAQ,CAAC;CACrC,OAAO;AACT;;;;;;;AAiBA,SAAgB,iBAAiB,SAA8C;CAC7E,MAAM,QAAQ,IAA+B,IAAI;CACjD,MAAM,SAAS,oBAAoB;EACjC,GAAG;EACH,WAAW,SAAS;GAClB,MAAM,QAAQ;GACd,QAAQ,WAAW,IAAI;EACzB;CACF,CAAC;CACD,MAAM,OAAO,QAAQ,SAAS,SAAS,QAAQ,UAAU,CAAC,SAAS,OAAO,SAAS,CAAC;CACpF,qBAAqB,OAAO,QAAQ,CAAC;CACrC,OAAO;EAAE;EAAO,gBAAgB,OAAO;EAAgB,UAAU,OAAO;CAAS;AACnF;;AAGA,SAAgB,aAAa,UAA4B,CAAC,GAAc;CACtE,MAAM,YAAY,gBAAgB,OAAO;CACzC,qBAAqB,UAAU,MAAM,CAAC;CACtC,OAAO;AACT"}

package/dist/components/accordion/accordion.d.ts

@@ -1,39 +1,37 @@
 import { PayloadOf } from "../../runtime/payload.js";
 import { PropType, VNode } from "vue";
+import { ControlVariant, Direction, Orientation, Size, Tone } from "@xihan-ui/core";
 import { AccordionNode, AccordionSchema } from "@xihan-ui/headless";
-import { Direction, Orientation, Size, Tone } from "@xihan-ui/kernel";
 //#region src/components/accordion/accordion.d.ts
 type AccordionProps = AccordionSchema['props'];
 declare const XhAccordionRoot: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
   collection: {
     type: PropType<AccordionNode[]>;
-    default: undefined;
   };
   value: {
     type: PropType<string[]>;
-    default: undefined;
   };
   defaultValue: {
     type: PropType<string[]>;
-    default: undefined;
   };
   multiple: BooleanConstructor;
   collapsible: BooleanConstructor;
+  loop: BooleanConstructor;
+  disabled: BooleanConstructor;
+  variant: {
+    type: PropType<ControlVariant>;
+  };
   orientation: {
     type: PropType<Orientation>;
-    default: undefined;
   };
   dir: {
     type: PropType<Direction>;
-    default: undefined;
   };
   tone: {
     type: PropType<Tone>;
-    default: undefined;
   };
   size: {
     type: PropType<Size>;
-    default: undefined;
   };
 }>, () => VNode<import("vue").RendererNode, import("vue").RendererElement, {
   [key: string]: any;
@@ -43,47 +41,40 @@ declare const XhAccordionRoot: import("vue").DefineComponent<import("vue").Extra
 }, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
   collection: {
     type: PropType<AccordionNode[]>;
-    default: undefined;
   };
   value: {
     type: PropType<string[]>;
-    default: undefined;
   };
   defaultValue: {
     type: PropType<string[]>;
-    default: undefined;
   };
   multiple: BooleanConstructor;
   collapsible: BooleanConstructor;
+  loop: BooleanConstructor;
+  disabled: BooleanConstructor;
+  variant: {
+    type: PropType<ControlVariant>;
+  };
   orientation: {
     type: PropType<Orientation>;
-    default: undefined;
   };
   dir: {
     type: PropType<Direction>;
-    default: undefined;
   };
   tone: {
     type: PropType<Tone>;
-    default: undefined;
   };
   size: {
     type: PropType<Size>;
-    default: undefined;
   };
 }>> & Readonly<{
   "onValue-change"?: ((_details: import("@xihan-ui/headless").AccordionValueChangeDetails) => any) | undefined;
   "onUpdate:value"?: ((_value: string[]) => any) | undefined;
 }>, {
-  value: string[];
   multiple: boolean;
   collapsible: boolean;
-  collection: AccordionNode[];
-  defaultValue: string[];
-  orientation: Orientation;
-  dir: Direction;
-  tone: Tone;
-  size: Size;
+  loop: boolean;
+  disabled: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 declare const XhAccordionItem: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
   value: {
@@ -108,6 +99,10 @@ declare const XhAccordionItem: import("vue").DefineComponent<import("vue").Extra
 }>> & Readonly<{}>, {
   disabled: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+/** 条目之间的分隔线，纯视觉；不渲染它时条目直接相邻 */
+declare const XhAccordionItemSeparator: import("vue").DefineComponent<{}, () => VNode<import("vue").RendererNode, import("vue").RendererElement, {
+  [key: string]: any;
+}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 declare const XhAccordionHeader: import("vue").DefineComponent<{}, () => VNode<import("vue").RendererNode, import("vue").RendererElement, {
   [key: string]: any;
 }>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
@@ -121,5 +116,5 @@ declare const XhAccordionIndicator: import("vue").DefineComponent<{}, () => VNod
   [key: string]: any;
 }>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 //#endregion
-export { XhAccordionContent, XhAccordionHeader, XhAccordionIndicator, XhAccordionItem, XhAccordionRoot, XhAccordionTrigger };
+export { XhAccordionContent, XhAccordionHeader, XhAccordionIndicator, XhAccordionItem, XhAccordionItemSeparator, XhAccordionRoot, XhAccordionTrigger };
 //# sourceMappingURL=accordion.d.ts.map

package/dist/components/accordion/accordion.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"accordion.d.ts","names":[],"sources":["../../../src/components/accordion/accordion.ts"],"mappings":";;;;;KASK,iBAAiB;cAET,+BAAe,8BAAA;;IAGK,MAAA,SAAS;;;;IACd,MAAA;;;;IACO,MAAA;;;;;;IAGA,MAAA,SAAS;;;;IAEjB,MAAA,SAAS;;;;IACR,MAAA,SAAS;;;;IACT,MAAA,SAAS;;;;;;EAIN,iBAAA,UAAA,UAAU;EACZ,iBAAA,QAAA,UAAU;;;IAdN,MAAA,SAAS;;;;IACd,MAAA;;;;IACO,MAAA;;;;;;IAGA,MAAA,SAAS;;;;IAEjB,MAAA,SAAS;;;;IACR,MAAA,SAAS;;;;IACT,MAAA,SAAS;;;;;;;;;;;;;;;;qCAwBnC;cAEW,+BAAe,8BAAA;;;;;;;;;;;;;;;;;;;;;;qCAgB1B;cAGW,iCAAiB,0BAAA,oBAAA,4BAAA;;8BAO5B,qCAAA,iDAAA,aAAA,eAAA,oDAAA;cAEW,kCAAkB,0BAAA,oBAAA,4BAAA;;8BAO7B,qCAAA,iDAAA,aAAA,eAAA,oDAAA;cAEW,kCAAkB,0BAAA,oBAAA,4BAAA;;8BAoB7B,qCAAA,iDAAA,aAAA,eAAA,oDAAA;cAEW,oCAAoB,0BAAA,oBAAA,4BAAA;;8BAO/B,qCAAA,iDAAA,aAAA,eAAA,oDAAA"}
+{"version":3,"file":"accordion.d.ts","names":[],"sources":["../../../src/components/accordion/accordion.ts"],"mappings":";;;;;KAgBK,iBAAiB;cAET,+BAAe,8BAAA;;IAGK,MAAA,SAAS;;;IACd,MAAA;;;IACO,MAAA;;;;;;;IAKJ,MAAA,SAAS;;;IACL,MAAA,SAAS;;;IAEjB,MAAA,SAAS;;;IACR,MAAA,SAAS;;;IACT,MAAA,SAAS;;;;;EAIN,iBAAA,UAAA,UAAU;EACZ,iBAAA,QAAA,UAAU;;;IAjBN,MAAA,SAAS;;;IACd,MAAA;;;IACO,MAAA;;;;;;;IAKJ,MAAA,SAAS;;;IACL,MAAA,SAAS;;;IAEjB,MAAA,SAAS;;;IACR,MAAA,SAAS;;;IACT,MAAA,SAAS;;;;;;;;;;qCAwBnC;cAEW,+BAAe,8BAAA;;;;;;;;;;;;;;;;;;;;;;qCAgB1B;;cAGW,wCAAwB,0BAAA,oBAAA,4BAAA;;8BAMnC,qCAAA,iDAAA,aAAA,eAAA,oDAAA;cAGW,iCAAiB,0BAAA,oBAAA,4BAAA;;8BAO5B,qCAAA,iDAAA,aAAA,eAAA,oDAAA;cAEW,kCAAkB,0BAAA,oBAAA,4BAAA;;8BAO7B,qCAAA,iDAAA,aAAA,eAAA,oDAAA;cAEW,kCAAkB,0BAAA,oBAAA,4BAAA;;8BAoB7B,qCAAA,iDAAA,aAAA,eAAA,oDAAA;cAEW,oCAAoB,0BAAA,oBAAA,4BAAA;;8BAO/B,qCAAA,iDAAA,aAAA,eAAA,oDAAA"}