@xihan-ui/vue 1.0.0 → 2.0.0

package/dist/components/virtualizer/virtualizer.d.ts

@@ -1,22 +1,19 @@
 import { PayloadOf } from "../../runtime/payload.js";
 import { PropType, SlotsType, VNode } from "vue";
-import { VirtualizerApi, VirtualizerChangeDetails, VirtualizerSchema } from "@xihan-ui/headless";
+import { VirtualizerApi, VirtualizerRangeChangeDetails, VirtualizerSchema } from "@xihan-ui/headless";
 //#region src/components/virtualizer/virtualizer.d.ts
 type VirtualizerProps = VirtualizerSchema['props'];
-/** 默认插槽的载荷：此刻该渲染的条目与总长、可视区首末下标与滚动态，以及滚动与量尺寸的动作。 */
+/** 默认插槽的载荷：当前应渲染的条目与总长、可视区首末下标与滚动态，以及滚动与测量尺寸的动作。 */
 type VirtualizerRootSlotProps = Pick<VirtualizerApi, 'virtualItems' | 'totalSize' | 'startIndex' | 'endIndex' | 'scrolling' | 'lanes' | 'scrollToIndex' | 'measureElement' | 'measure'>;
 declare const XhVirtualizerRoot: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
   count: {
     type: NumberConstructor;
-    default: undefined;
   };
   estimateSize: {
     type: PropType<number | ((index: number) => number)>;
-    default: undefined;
   };
   overscan: {
     type: NumberConstructor;
-    default: undefined;
   };
   horizontal: {
     type: BooleanConstructor;
@@ -24,44 +21,35 @@ declare const XhVirtualizerRoot: import("vue").DefineComponent<import("vue").Ext
   };
   gap: {
     type: NumberConstructor;
-    default: undefined;
   };
   getItemKey: {
     type: PropType<(index: number) => string | number>;
-    default: undefined;
   };
   scrollMargin: {
     type: NumberConstructor;
-    default: undefined;
   };
   paddingStart: {
     type: NumberConstructor;
-    default: undefined;
   };
   paddingEnd: {
     type: NumberConstructor;
-    default: undefined;
   };
   lanes: {
     type: NumberConstructor;
-    default: undefined;
   };
 }>, () => VNode<import("vue").RendererNode, import("vue").RendererElement, {
   [key: string]: any;
 }>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-  change: (_details: PayloadOf<VirtualizerProps, "onChange">) => true;
+  'range-change': (_details: PayloadOf<VirtualizerProps, "onRangeChange">) => true;
 }, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
   count: {
     type: NumberConstructor;
-    default: undefined;
   };
   estimateSize: {
     type: PropType<number | ((index: number) => number)>;
-    default: undefined;
   };
   overscan: {
     type: NumberConstructor;
-    default: undefined;
   };
   horizontal: {
     type: BooleanConstructor;
@@ -69,41 +57,26 @@ declare const XhVirtualizerRoot: import("vue").DefineComponent<import("vue").Ext
   };
   gap: {
     type: NumberConstructor;
-    default: undefined;
   };
   getItemKey: {
     type: PropType<(index: number) => string | number>;
-    default: undefined;
   };
   scrollMargin: {
     type: NumberConstructor;
-    default: undefined;
   };
   paddingStart: {
     type: NumberConstructor;
-    default: undefined;
   };
   paddingEnd: {
     type: NumberConstructor;
-    default: undefined;
   };
   lanes: {
     type: NumberConstructor;
-    default: undefined;
   };
 }>> & Readonly<{
-  onChange?: ((_details: VirtualizerChangeDetails) => any) | undefined;
+  "onRange-change"?: ((_details: VirtualizerRangeChangeDetails) => any) | undefined;
 }>, {
   horizontal: boolean;
-  count: number;
-  gap: number;
-  lanes: number;
-  estimateSize: number | ((index: number) => number);
-  overscan: number;
-  getItemKey: (index: number) => string | number;
-  scrollMargin: number;
-  paddingStart: number;
-  paddingEnd: number;
 }, SlotsType<{
   default?: (props: VirtualizerRootSlotProps) => VNode[];
 }>, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
@@ -114,12 +87,12 @@ declare const XhVirtualizerContent: 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>;
 declare const XhVirtualizerItem: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
-  /** 这个节点是第几条。 */
+  /** 该节点的下标。 */
   value: {
     type: PropType<number | string>;
     required: true;
   };
-  /** 是否把真实尺寸回喂给内核；不开时条目尺寸按 estimateSize 算。 */
+  /** 是否把真实尺寸回传给内核；未开启时条目尺寸按 estimateSize 计算。 */
   measure: {
     type: BooleanConstructor;
     default: undefined;
@@ -127,12 +100,12 @@ declare const XhVirtualizerItem: import("vue").DefineComponent<import("vue").Ext
 }>, () => VNode<import("vue").RendererNode, import("vue").RendererElement, {
   [key: string]: any;
 }>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
-  /** 这个节点是第几条。 */
+  /** 该节点的下标。 */
   value: {
     type: PropType<number | string>;
     required: true;
   };
-  /** 是否把真实尺寸回喂给内核；不开时条目尺寸按 estimateSize 算。 */
+  /** 是否把真实尺寸回传给内核；未开启时条目尺寸按 estimateSize 计算。 */
   measure: {
     type: BooleanConstructor;
     default: undefined;

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

@@ -1 +1 @@
-{"version":3,"file":"virtualizer.d.ts","names":[],"sources":["../../../src/components/virtualizer/virtualizer.ts"],"mappings":";;;;KAOK,mBAAmB;;KAGZ,2BAA2B,KACrC;cAYW,iCAAiB,8BAAA;;;;;;IAKkB,MAAA,oBAAoB;;;;;;;;;;;;;;;;IAIhC,MAAA,UAAU;;;;;;;;;;;;;;;;;;;;;;EAQvB,SAAA,UAAA,UAAU;;;;;;;IAZe,MAAA,oBAAoB;;;;;;;;;;;;;;;;IAIhC,MAAA,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;EAJ6B,yBAAA;;EAItB,aAAA;;;;;EAWvC,WAAC,OAAO,6BAA6B;kCAkBjD;cAEW,qCAAqB,0BAAA,oBAAA,4BAAA;;8BAUhC,qCAAA,iDAAA,aAAA,eAAA,oDAAA;cAEW,oCAAoB,0BAAA,oBAAA,4BAAA;;8BAS/B,qCAAA,iDAAA,aAAA,eAAA,oDAAA;cAEW,iCAAiB,8BAAA;;;IAIS,MAAA;;;;;;;;;;;;;IAAA,MAAA;;;;;;;;;;qCAqBrC"}
+{"version":3,"file":"virtualizer.d.ts","names":[],"sources":["../../../src/components/virtualizer/virtualizer.ts"],"mappings":";;;;KAcK,mBAAmB;;KAGZ,2BAA2B,KACrC;cAYW,iCAAiB,8BAAA;;;;;IAKkB,MAAA,oBAAoB;;;;;;;;;;;;;IAIhC,MAAA,UAAU;;;;;;;;;;;;;;;;;EAQf,iBAAA,UAAA,UAAU;;;;;;IAZO,MAAA,oBAAoB;;;;;;;;;;;;;IAIhC,MAAA,UAAU;;;;;;;;;;;;;;;;;;;EAWhC,WAAC,OAAO,6BAA6B;kCAkBjD;cAEW,qCAAqB,0BAAA,oBAAA,4BAAA;;8BAUhC,qCAAA,iDAAA,aAAA,eAAA,oDAAA;cAEW,oCAAoB,0BAAA,oBAAA,4BAAA;;8BAS/B,qCAAA,iDAAA,aAAA,eAAA,oDAAA;cAEW,iCAAiB,8BAAA;;;IAIS,MAAA;;;;;;;;;;;;;IAAA,MAAA;;;;;;;;;;qCAqBrC"}

package/dist/components/virtualizer/virtualizer.js

@@ -5,51 +5,24 @@ import { defineComponent, h, onMounted, onUpdated, ref } from "vue";
 const XhVirtualizerRoot = defineComponent({
 	name: "XhVirtualizerRoot",
 	props: {
-		count: {
-			type: Number,
-			default: void 0
-		},
-		estimateSize: {
-			type: [Number, Function],
-			default: void 0
-		},
-		overscan: {
-			type: Number,
-			default: void 0
-		},
+		count: { type: Number },
+		estimateSize: { type: [Number, Function] },
+		overscan: { type: Number },
 		horizontal: {
 			type: Boolean,
 			default: void 0
 		},
-		gap: {
-			type: Number,
-			default: void 0
-		},
-		getItemKey: {
-			type: Function,
-			default: void 0
-		},
-		scrollMargin: {
-			type: Number,
-			default: void 0
-		},
-		paddingStart: {
-			type: Number,
-			default: void 0
-		},
-		paddingEnd: {
-			type: Number,
-			default: void 0
-		},
-		lanes: {
-			type: Number,
-			default: void 0
-		}
+		gap: { type: Number },
+		getItemKey: { type: Function },
+		scrollMargin: { type: Number },
+		paddingStart: { type: Number },
+		paddingEnd: { type: Number },
+		lanes: { type: Number }
 	},
-	emits: { change: (_details) => true },
+	emits: { "range-change": (_details) => true },
 	slots: Object,
 	setup(props, { slots, emit }) {
-		const notify = (details) => emit("change", details);
+		const notify = (details) => emit("range-change", details);
 		const ctx = useVirtualizer(props, notify);
 		provideVirtualizer(ctx);
 		return () => h("div", ctx.api.value.getRootProps(), slots.default?.({
@@ -88,12 +61,12 @@ const XhVirtualizerContent = defineComponent({
 const XhVirtualizerItem = defineComponent({
 	name: "XhVirtualizerItem",
 	props: {
-		/** 这个节点是第几条。 */
+		/** 该节点的下标。 */
 		value: {
 			type: [Number, String],
 			required: true
 		},
-		/** 是否把真实尺寸回喂给内核；不开时条目尺寸按 estimateSize 算。 */
+		/** 是否把真实尺寸回传给内核；未开启时条目尺寸按 estimateSize 计算。 */
 		measure: {
 			type: Boolean,
 			default: void 0

package/dist/components/virtualizer/virtualizer.js.map

@@ -1 +1 @@
-{"version":3,"file":"virtualizer.js","names":[],"sources":["../../../src/components/virtualizer/virtualizer.ts"],"sourcesContent":["import type { VirtualizerApi, VirtualizerChangeDetails, VirtualizerSchema } from '@xihan-ui/headless'\nimport type { PropType, SlotsType, VNode } from 'vue'\nimport type { PayloadOf } from '../../runtime/payload'\nimport { defineComponent, h, onMounted, onUpdated, ref } from 'vue'\nimport { provideVirtualizer, useVirtualizerContext } from './context'\nimport { useVirtualizer } from './use-virtualizer'\n\ntype VirtualizerProps = VirtualizerSchema['props']\n\n/** 默认插槽的载荷：此刻该渲染的条目与总长、可视区首末下标与滚动态，以及滚动与量尺寸的动作。 */\nexport type VirtualizerRootSlotProps = Pick<\n  VirtualizerApi,\n  | 'virtualItems'\n  | 'totalSize'\n  | 'startIndex'\n  | 'endIndex'\n  | 'scrolling'\n  | 'lanes'\n  | 'scrollToIndex'\n  | 'measureElement'\n  | 'measure'\n>\n\nexport const XhVirtualizerRoot = defineComponent({\n  name: 'XhVirtualizerRoot',\n  // 有机器与 connect 兜底的 prop 一律 default: undefined\n  props: {\n    count: { type: Number, default: undefined },\n    estimateSize: { type: [Number, Function] as PropType<number | ((index: number) => number)>, default: undefined },\n    overscan: { type: Number, default: undefined },\n    horizontal: { type: Boolean, default: undefined },\n    gap: { type: Number, default: undefined },\n    getItemKey: { type: Function as PropType<(index: number) => string | number>, default: undefined },\n    scrollMargin: { type: Number, default: undefined },\n    paddingStart: { type: Number, default: undefined },\n    paddingEnd: { type: Number, default: undefined },\n    lanes: { type: Number, default: undefined },\n  },\n  // change 携带当前该渲染哪些条目的详情\n  emits: {\n    change: (_details: PayloadOf<VirtualizerProps, 'onChange'>) => true,\n  },\n  slots: Object as SlotsType<{\n    default?: (props: VirtualizerRootSlotProps) => VNode[]\n  }>,\n  setup(props, { slots, emit }) {\n    const notify: VirtualizerProps['onChange'] = (details: VirtualizerChangeDetails) => emit('change', details)\n    const ctx = useVirtualizer(props as VirtualizerProps, notify)\n    provideVirtualizer(ctx)\n    return () => h('div', ctx.api.value.getRootProps() as Record<string, unknown>, slots.default?.({\n      virtualItems: ctx.api.value.virtualItems,\n      totalSize: ctx.api.value.totalSize,\n      startIndex: ctx.api.value.startIndex,\n      endIndex: ctx.api.value.endIndex,\n      scrolling: ctx.api.value.scrolling,\n      lanes: ctx.api.value.lanes,\n      scrollToIndex: ctx.api.value.scrollToIndex,\n      measureElement: ctx.api.value.measureElement,\n      measure: ctx.api.value.measure,\n    }))\n  },\n})\n\nexport const XhVirtualizerViewport = defineComponent({\n  name: 'XhVirtualizerViewport',\n  setup(_, { slots }) {\n    const ctx = useVirtualizerContext()\n    // 视口节点经 ref 交给机器，由内核在效应里接上\n    return () => h('div', {\n      ...ctx.api.value.getViewportProps() as Record<string, unknown>,\n      ref: ctx.viewportRef,\n    }, slots.default?.())\n  },\n})\n\nexport const XhVirtualizerContent = defineComponent({\n  name: 'XhVirtualizerContent',\n  setup(_, { slots }) {\n    const ctx = useVirtualizerContext()\n    return () => h('div', {\n      ...ctx.api.value.getContentProps() as Record<string, unknown>,\n      ref: ctx.contentRef,\n    }, slots.default?.())\n  },\n})\n\nexport const XhVirtualizerItem = defineComponent({\n  name: 'XhVirtualizerItem',\n  props: {\n    /** 这个节点是第几条。 */\n    value: { type: [Number, String] as PropType<number | string>, required: true },\n    /** 是否把真实尺寸回喂给内核；不开时条目尺寸按 estimateSize 算。 */\n    measure: { type: Boolean, default: undefined },\n  },\n  setup(props, { slots }) {\n    const ctx = useVirtualizerContext()\n    const el = ref<HTMLElement | null>(null)\n\n    // 在挂载与更新后量尺寸，此时节点已落进 DOM\n    const report = (): void => {\n      if (props.measure)\n        ctx.api.value.measureElement(el.value)\n    }\n    onMounted(report)\n    onUpdated(report)\n\n    return () => h('div', {\n      ...ctx.api.value.getItemProps({ index: Number(props.value) }) as Record<string, unknown>,\n      ref: el,\n    }, slots.default?.())\n  },\n})\n"],"mappings":";;;;AAuBA,MAAa,oBAAoB,gBAAgB;CAC/C,MAAM;CAEN,OAAO;EACL,OAAO;GAAE,MAAM;GAAQ,SAAS,KAAA;EAAU;EAC1C,cAAc;GAAE,MAAM,CAAC,QAAQ,QAAQ;GAAqD,SAAS,KAAA;EAAU;EAC/G,UAAU;GAAE,MAAM;GAAQ,SAAS,KAAA;EAAU;EAC7C,YAAY;GAAE,MAAM;GAAS,SAAS,KAAA;EAAU;EAChD,KAAK;GAAE,MAAM;GAAQ,SAAS,KAAA;EAAU;EACxC,YAAY;GAAE,MAAM;GAA0D,SAAS,KAAA;EAAU;EACjG,cAAc;GAAE,MAAM;GAAQ,SAAS,KAAA;EAAU;EACjD,cAAc;GAAE,MAAM;GAAQ,SAAS,KAAA;EAAU;EACjD,YAAY;GAAE,MAAM;GAAQ,SAAS,KAAA;EAAU;EAC/C,OAAO;GAAE,MAAM;GAAQ,SAAS,KAAA;EAAU;CAC5C;CAEA,OAAO,EACL,SAAS,aAAsD,KACjE;CACA,OAAO;CAGP,MAAM,OAAO,EAAE,OAAO,QAAQ;EAC5B,MAAM,UAAwC,YAAsC,KAAK,UAAU,OAAO;EAC1G,MAAM,MAAM,eAAe,OAA2B,MAAM;EAC5D,mBAAmB,GAAG;EACtB,aAAa,EAAE,OAAO,IAAI,IAAI,MAAM,aAAa,GAA8B,MAAM,UAAU;GAC7F,cAAc,IAAI,IAAI,MAAM;GAC5B,WAAW,IAAI,IAAI,MAAM;GACzB,YAAY,IAAI,IAAI,MAAM;GAC1B,UAAU,IAAI,IAAI,MAAM;GACxB,WAAW,IAAI,IAAI,MAAM;GACzB,OAAO,IAAI,IAAI,MAAM;GACrB,eAAe,IAAI,IAAI,MAAM;GAC7B,gBAAgB,IAAI,IAAI,MAAM;GAC9B,SAAS,IAAI,IAAI,MAAM;EACzB,CAAC,CAAC;CACJ;AACF,CAAC;AAED,MAAa,wBAAwB,gBAAgB;CACnD,MAAM;CACN,MAAM,GAAG,EAAE,SAAS;EAClB,MAAM,MAAM,sBAAsB;EAElC,aAAa,EAAE,OAAO;GACpB,GAAG,IAAI,IAAI,MAAM,iBAAiB;GAClC,KAAK,IAAI;EACX,GAAG,MAAM,UAAU,CAAC;CACtB;AACF,CAAC;AAED,MAAa,uBAAuB,gBAAgB;CAClD,MAAM;CACN,MAAM,GAAG,EAAE,SAAS;EAClB,MAAM,MAAM,sBAAsB;EAClC,aAAa,EAAE,OAAO;GACpB,GAAG,IAAI,IAAI,MAAM,gBAAgB;GACjC,KAAK,IAAI;EACX,GAAG,MAAM,UAAU,CAAC;CACtB;AACF,CAAC;AAED,MAAa,oBAAoB,gBAAgB;CAC/C,MAAM;CACN,OAAO;;EAEL,OAAO;GAAE,MAAM,CAAC,QAAQ,MAAM;GAAgC,UAAU;EAAK;;EAE7E,SAAS;GAAE,MAAM;GAAS,SAAS,KAAA;EAAU;CAC/C;CACA,MAAM,OAAO,EAAE,SAAS;EACtB,MAAM,MAAM,sBAAsB;EAClC,MAAM,KAAK,IAAwB,IAAI;EAGvC,MAAM,eAAqB;GACzB,IAAI,MAAM,SACR,IAAI,IAAI,MAAM,eAAe,GAAG,KAAK;EACzC;EACA,UAAU,MAAM;EAChB,UAAU,MAAM;EAEhB,aAAa,EAAE,OAAO;GACpB,GAAG,IAAI,IAAI,MAAM,aAAa,EAAE,OAAO,OAAO,MAAM,KAAK,EAAE,CAAC;GAC5D,KAAK;EACP,GAAG,MAAM,UAAU,CAAC;CACtB;AACF,CAAC"}
+{"version":3,"file":"virtualizer.js","names":[],"sources":["../../../src/components/virtualizer/virtualizer.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// 提供 virtualizer 相关实现。\n\nimport type { VirtualizerApi, VirtualizerRangeChangeDetails, VirtualizerSchema } from '@xihan-ui/headless'\nimport type { PropType, SlotsType, VNode } from 'vue'\nimport type { PayloadOf } from '../../runtime/payload'\nimport { defineComponent, h, onMounted, onUpdated, ref } from 'vue'\nimport { provideVirtualizer, useVirtualizerContext } from './context'\nimport { useVirtualizer } from './use-virtualizer'\n\ntype VirtualizerProps = VirtualizerSchema['props']\n\n/** 默认插槽的载荷：当前应渲染的条目与总长、可视区首末下标与滚动态，以及滚动与测量尺寸的动作。 */\nexport type VirtualizerRootSlotProps = Pick<\n  VirtualizerApi,\n  | 'virtualItems'\n  | 'totalSize'\n  | 'startIndex'\n  | 'endIndex'\n  | 'scrolling'\n  | 'lanes'\n  | 'scrollToIndex'\n  | 'measureElement'\n  | 'measure'\n>\n\nexport const XhVirtualizerRoot = defineComponent({\n  name: 'XhVirtualizerRoot',\n  // 有机器与 connect 兜底的 prop：普通类型省略 default，Boolean 显式保留 undefined\n  props: {\n    count: { type: Number },\n    estimateSize: { type: [Number, Function] as PropType<number | ((index: number) => number)> },\n    overscan: { type: Number },\n    horizontal: { type: Boolean, default: undefined },\n    gap: { type: Number },\n    getItemKey: { type: Function as PropType<(index: number) => string | number> },\n    scrollMargin: { type: Number },\n    paddingStart: { type: Number },\n    paddingEnd: { type: Number },\n    lanes: { type: Number },\n  },\n  // change 携带当前该渲染哪些条目的详情\n  emits: {\n    'range-change': (_details: PayloadOf<VirtualizerProps, 'onRangeChange'>) => true,\n  },\n  slots: Object as SlotsType<{\n    default?: (props: VirtualizerRootSlotProps) => VNode[]\n  }>,\n  setup(props, { slots, emit }) {\n    const notify: VirtualizerProps['onRangeChange'] = (details: VirtualizerRangeChangeDetails) => emit('range-change', details)\n    const ctx = useVirtualizer(props as VirtualizerProps, notify)\n    provideVirtualizer(ctx)\n    return () => h('div', ctx.api.value.getRootProps() as Record<string, unknown>, slots.default?.({\n      virtualItems: ctx.api.value.virtualItems,\n      totalSize: ctx.api.value.totalSize,\n      startIndex: ctx.api.value.startIndex,\n      endIndex: ctx.api.value.endIndex,\n      scrolling: ctx.api.value.scrolling,\n      lanes: ctx.api.value.lanes,\n      scrollToIndex: ctx.api.value.scrollToIndex,\n      measureElement: ctx.api.value.measureElement,\n      measure: ctx.api.value.measure,\n    }))\n  },\n})\n\nexport const XhVirtualizerViewport = defineComponent({\n  name: 'XhVirtualizerViewport',\n  setup(_, { slots }) {\n    const ctx = useVirtualizerContext()\n    // 视口节点经 ref 交给机器，由内核在效应里接上\n    return () => h('div', {\n      ...ctx.api.value.getViewportProps() as Record<string, unknown>,\n      ref: ctx.viewportRef,\n    }, slots.default?.())\n  },\n})\n\nexport const XhVirtualizerContent = defineComponent({\n  name: 'XhVirtualizerContent',\n  setup(_, { slots }) {\n    const ctx = useVirtualizerContext()\n    return () => h('div', {\n      ...ctx.api.value.getContentProps() as Record<string, unknown>,\n      ref: ctx.contentRef,\n    }, slots.default?.())\n  },\n})\n\nexport const XhVirtualizerItem = defineComponent({\n  name: 'XhVirtualizerItem',\n  props: {\n    /** 该节点的下标。 */\n    value: { type: [Number, String] as PropType<number | string>, required: true },\n    /** 是否把真实尺寸回传给内核；未开启时条目尺寸按 estimateSize 计算。 */\n    measure: { type: Boolean, default: undefined },\n  },\n  setup(props, { slots }) {\n    const ctx = useVirtualizerContext()\n    const el = ref<HTMLElement | null>(null)\n\n    // 在挂载与更新后量尺寸，此时节点已落进 DOM\n    const report = (): void => {\n      if (props.measure)\n        ctx.api.value.measureElement(el.value)\n    }\n    onMounted(report)\n    onUpdated(report)\n\n    return () => h('div', {\n      ...ctx.api.value.getItemProps({ index: Number(props.value) }) as Record<string, unknown>,\n      ref: el,\n    }, slots.default?.())\n  },\n})\n"],"mappings":";;;;AA8BA,MAAa,oBAAoB,gBAAgB;CAC/C,MAAM;CAEN,OAAO;EACL,OAAO,EAAE,MAAM,OAAO;EACtB,cAAc,EAAE,MAAM,CAAC,QAAQ,QAAQ,EAAoD;EAC3F,UAAU,EAAE,MAAM,OAAO;EACzB,YAAY;GAAE,MAAM;GAAS,SAAS,KAAA;EAAU;EAChD,KAAK,EAAE,MAAM,OAAO;EACpB,YAAY,EAAE,MAAM,SAAyD;EAC7E,cAAc,EAAE,MAAM,OAAO;EAC7B,cAAc,EAAE,MAAM,OAAO;EAC7B,YAAY,EAAE,MAAM,OAAO;EAC3B,OAAO,EAAE,MAAM,OAAO;CACxB;CAEA,OAAO,EACL,iBAAiB,aAA2D,KAC9E;CACA,OAAO;CAGP,MAAM,OAAO,EAAE,OAAO,QAAQ;EAC5B,MAAM,UAA6C,YAA2C,KAAK,gBAAgB,OAAO;EAC1H,MAAM,MAAM,eAAe,OAA2B,MAAM;EAC5D,mBAAmB,GAAG;EACtB,aAAa,EAAE,OAAO,IAAI,IAAI,MAAM,aAAa,GAA8B,MAAM,UAAU;GAC7F,cAAc,IAAI,IAAI,MAAM;GAC5B,WAAW,IAAI,IAAI,MAAM;GACzB,YAAY,IAAI,IAAI,MAAM;GAC1B,UAAU,IAAI,IAAI,MAAM;GACxB,WAAW,IAAI,IAAI,MAAM;GACzB,OAAO,IAAI,IAAI,MAAM;GACrB,eAAe,IAAI,IAAI,MAAM;GAC7B,gBAAgB,IAAI,IAAI,MAAM;GAC9B,SAAS,IAAI,IAAI,MAAM;EACzB,CAAC,CAAC;CACJ;AACF,CAAC;AAED,MAAa,wBAAwB,gBAAgB;CACnD,MAAM;CACN,MAAM,GAAG,EAAE,SAAS;EAClB,MAAM,MAAM,sBAAsB;EAElC,aAAa,EAAE,OAAO;GACpB,GAAG,IAAI,IAAI,MAAM,iBAAiB;GAClC,KAAK,IAAI;EACX,GAAG,MAAM,UAAU,CAAC;CACtB;AACF,CAAC;AAED,MAAa,uBAAuB,gBAAgB;CAClD,MAAM;CACN,MAAM,GAAG,EAAE,SAAS;EAClB,MAAM,MAAM,sBAAsB;EAClC,aAAa,EAAE,OAAO;GACpB,GAAG,IAAI,IAAI,MAAM,gBAAgB;GACjC,KAAK,IAAI;EACX,GAAG,MAAM,UAAU,CAAC;CACtB;AACF,CAAC;AAED,MAAa,oBAAoB,gBAAgB;CAC/C,MAAM;CACN,OAAO;;EAEL,OAAO;GAAE,MAAM,CAAC,QAAQ,MAAM;GAAgC,UAAU;EAAK;;EAE7E,SAAS;GAAE,MAAM;GAAS,SAAS,KAAA;EAAU;CAC/C;CACA,MAAM,OAAO,EAAE,SAAS;EACtB,MAAM,MAAM,sBAAsB;EAClC,MAAM,KAAK,IAAwB,IAAI;EAGvC,MAAM,eAAqB;GACzB,IAAI,MAAM,SACR,IAAI,IAAI,MAAM,eAAe,GAAG,KAAK;EACzC;EACA,UAAU,MAAM;EAChB,UAAU,MAAM;EAEhB,aAAa,EAAE,OAAO;GACpB,GAAG,IAAI,IAAI,MAAM,aAAa,EAAE,OAAO,OAAO,MAAM,KAAK,EAAE,CAAC;GAC5D,KAAK;EACP,GAAG,MAAM,UAAU,CAAC;CACtB;AACF,CAAC"}

package/dist/components/watermark/context.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"context.d.ts","names":[],"sources":["../../../src/components/watermark/context.ts"],"mappings":";;;UAIiB;EACf,KAAK,YAAY;;iBAKH,iBAAiB,KAAK;iBAItB,uBAAuB"}
+{"version":3,"file":"context.d.ts","names":[],"sources":["../../../src/components/watermark/context.ts"],"mappings":";;;UAWiB;EACf,KAAK,YAAY;;iBAKH,iBAAiB,KAAK;iBAItB,uBAAuB"}

package/dist/components/watermark/context.js.map

@@ -1 +1 @@
-{"version":3,"file":"context.js","names":[],"sources":["../../../src/components/watermark/context.ts"],"sourcesContent":["import type { WatermarkApi } from '@xihan-ui/headless'\nimport type { ComputedRef, InjectionKey } from 'vue'\nimport { inject, provide } from 'vue'\n\nexport interface WatermarkContext {\n  api: ComputedRef<WatermarkApi>\n}\n\nconst KEY: InjectionKey<WatermarkContext> = Symbol.for('xh-watermark')\n\nexport function provideWatermark(ctx: WatermarkContext): void {\n  provide(KEY, ctx)\n}\n\nexport function useWatermarkContext(): WatermarkContext {\n  const ctx = inject(KEY, null)\n  if (!ctx)\n    throw new Error('[xh] Watermark 部件必须用在 XhWatermarkRoot 内')\n  return ctx\n}\n"],"mappings":";;AAQA,MAAM,MAAsC,OAAO,IAAI,cAAc;AAErE,SAAgB,iBAAiB,KAA6B;CAC5D,QAAQ,KAAK,GAAG;AAClB;AAEA,SAAgB,sBAAwC;CACtD,MAAM,MAAM,OAAO,KAAK,IAAI;CAC5B,IAAI,CAAC,KACH,MAAM,IAAI,MAAM,yCAAyC;CAC3D,OAAO;AACT"}
+{"version":3,"file":"context.js","names":[],"sources":["../../../src/components/watermark/context.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// 提供 context 相关实现。\n\nimport type { WatermarkApi } from '@xihan-ui/headless'\nimport type { ComputedRef, InjectionKey } from 'vue'\nimport { inject, provide } from 'vue'\n\nexport interface WatermarkContext {\n  api: ComputedRef<WatermarkApi>\n}\n\nconst KEY: InjectionKey<WatermarkContext> = Symbol.for('xh-watermark')\n\nexport function provideWatermark(ctx: WatermarkContext): void {\n  provide(KEY, ctx)\n}\n\nexport function useWatermarkContext(): WatermarkContext {\n  const ctx = inject(KEY, null)\n  if (!ctx)\n    throw new Error('[xh] Watermark 部件必须用在 XhWatermarkRoot 内')\n  return ctx\n}\n"],"mappings":";;AAeA,MAAM,MAAsC,OAAO,IAAI,cAAc;AAErE,SAAgB,iBAAiB,KAA6B;CAC5D,QAAQ,KAAK,GAAG;AAClB;AAEA,SAAgB,sBAAwC;CACtD,MAAM,MAAM,OAAO,KAAK,IAAI;CAC5B,IAAI,CAAC,KACH,MAAM,IAAI,MAAM,yCAAyC;CAC3D,OAAO;AACT"}

package/dist/components/watermark/watermark.d.ts

@@ -1,61 +1,64 @@
 import { PropType } from "vue";
+import { WatermarkImageSize } from "@xihan-ui/headless";
 //#region src/components/watermark/watermark.d.ts
 /**
- * 盖水印的那块地。图样由 connect 算成一张 SVG，写成根上的内联 CSS 变量，
- * 由皮肤铺成一层盖在内容之上的伪元素——印子因此不进无障碍树、不吃点击、也选不中。
+ * 水印覆盖的区域。图样由 connect 计算为一张 SVG，写为根上的内联 CSS 变量，
+ * 由皮肤铺为一层覆盖在内容之上的伪元素：印记因此不进入无障碍树、不接收点击、也不可选中。
  */
 declare const XhWatermarkRoot: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
   text: {
     type: PropType<string | string[]>;
-    default: undefined;
   };
   rotate: {
     type: NumberConstructor;
-    default: undefined;
   };
   gap: {
     type: NumberConstructor;
-    default: undefined;
   };
   fontSize: {
     type: NumberConstructor;
-    default: undefined;
   };
   opacity: {
     type: NumberConstructor;
-    default: undefined;
+  };
+  fontFamily: {
+    type: StringConstructor;
+  };
+  image: {
+    type: StringConstructor;
+  };
+  imageSize: {
+    type: PropType<WatermarkImageSize>;
   };
 }>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
   [key: string]: any;
 }>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
   text: {
     type: PropType<string | string[]>;
-    default: undefined;
   };
   rotate: {
     type: NumberConstructor;
-    default: undefined;
   };
   gap: {
     type: NumberConstructor;
-    default: undefined;
   };
   fontSize: {
     type: NumberConstructor;
-    default: undefined;
   };
   opacity: {
     type: NumberConstructor;
-    default: undefined;
-  };
-}>> & Readonly<{}>, {
-  text: string | string[];
-  gap: number;
-  rotate: number;
-  fontSize: number;
-  opacity: number;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
-/** 被盖住的那段内容。 */
+  };
+  fontFamily: {
+    type: StringConstructor;
+  };
+  image: {
+    type: StringConstructor;
+  };
+  imageSize: {
+    type: PropType<WatermarkImageSize>;
+  };
+}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+/** 被覆盖的内容。 */
 declare const XhWatermarkContent: import("vue").DefineComponent<{}, () => import("vue").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>;

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

@@ -1 +1 @@
-{"version":3,"file":"watermark.d.ts","names":[],"sources":["../../../src/components/watermark/watermark.ts"],"mappings":";;;;;;cAWa,+BAAe,8BAAA;;IAIS,MAAA;;;;;;;;;;;;;;;;;;;;;;;IAAA,MAAA;;;;;;;;;;;;;;;;;;;;;;;;;qCAWnC;;cAGW,kCAAkB,wCAAA,oBAAA,4BAAA;;8BAM7B,qCAAA,iDAAA,aAAA,eAAA,oDAAA"}
+{"version":3,"file":"watermark.d.ts","names":[],"sources":["../../../src/components/watermark/watermark.ts"],"mappings":";;;;;;;cAkBa,+BAAe,8BAAA;;IAIS,MAAA;;;;;;;;;;;;;;;;;;;;;IAOJ,MAAA,SAAS;;;;;;IAPL,MAAA;;;;;;;;;;;;;;;;;;;;;IAOJ,MAAA,SAAS;;MAOxC,oDAAA;;cAGW,kCAAkB,wCAAA,oBAAA,4BAAA;;8BAM7B,qCAAA,iDAAA,aAAA,eAAA,oDAAA"}

package/dist/components/watermark/watermark.js

@@ -4,32 +4,20 @@ import { computed, defineComponent, h } from "vue";
 import { connectWatermark } from "@xihan-ui/headless";
 //#region src/components/watermark/watermark.ts
 /**
-* 盖水印的那块地。图样由 connect 算成一张 SVG，写成根上的内联 CSS 变量，
-* 由皮肤铺成一层盖在内容之上的伪元素——印子因此不进无障碍树、不吃点击、也选不中。
+* 水印覆盖的区域。图样由 connect 计算为一张 SVG，写为根上的内联 CSS 变量，
+* 由皮肤铺为一层覆盖在内容之上的伪元素：印记因此不进入无障碍树、不接收点击、也不可选中。
 */
 const XhWatermarkRoot = defineComponent({
 	name: "XhWatermarkRoot",
 	props: {
-		text: {
-			type: [String, Array],
-			default: void 0
-		},
-		rotate: {
-			type: Number,
-			default: void 0
-		},
-		gap: {
-			type: Number,
-			default: void 0
-		},
-		fontSize: {
-			type: Number,
-			default: void 0
-		},
-		opacity: {
-			type: Number,
-			default: void 0
-		}
+		text: { type: [String, Array] },
+		rotate: { type: Number },
+		gap: { type: Number },
+		fontSize: { type: Number },
+		opacity: { type: Number },
+		fontFamily: { type: String },
+		image: { type: String },
+		imageSize: { type: Object }
 	},
 	setup(props, { slots }) {
 		const api = computed(() => connectWatermark(props, vueNormalize));
@@ -37,7 +25,7 @@ const XhWatermarkRoot = defineComponent({
 		return () => h("div", api.value.getRootProps(), slots.default?.());
 	}
 });
-/** 被盖住的那段内容。 */
+/** 被覆盖的内容。 */
 const XhWatermarkContent = defineComponent({
 	name: "XhWatermarkContent",
 	setup(_, { slots }) {

package/dist/components/watermark/watermark.js.map

@@ -1 +1 @@
-{"version":3,"file":"watermark.js","names":[],"sources":["../../../src/components/watermark/watermark.ts"],"sourcesContent":["import type { WatermarkProps } from '@xihan-ui/headless'\nimport type { PropType } from 'vue'\nimport { connectWatermark } from '@xihan-ui/headless'\nimport { computed, defineComponent, h } from 'vue'\nimport { vueNormalize } from '../../runtime/normalize-props'\nimport { provideWatermark, useWatermarkContext } from './context'\n\n/**\n * 盖水印的那块地。图样由 connect 算成一张 SVG，写成根上的内联 CSS 变量，\n * 由皮肤铺成一层盖在内容之上的伪元素——印子因此不进无障碍树、不吃点击、也选不中。\n */\nexport const XhWatermarkRoot = defineComponent({\n  name: 'XhWatermarkRoot',\n  // 有 connect 兜底的 prop 一律 default: undefined\n  props: {\n    text: { type: [String, Array] as PropType<string | string[]>, default: undefined },\n    rotate: { type: Number, default: undefined },\n    gap: { type: Number, default: undefined },\n    fontSize: { type: Number, default: undefined },\n    opacity: { type: Number, default: undefined },\n  },\n  setup(props, { slots }) {\n    const api = computed(() => connectWatermark(props as WatermarkProps, vueNormalize))\n    provideWatermark({ api })\n    return () => h('div', api.value.getRootProps() as Record<string, unknown>, slots.default?.())\n  },\n})\n\n/** 被盖住的那段内容。 */\nexport const XhWatermarkContent = defineComponent({\n  name: 'XhWatermarkContent',\n  setup(_, { slots }) {\n    const ctx = useWatermarkContext()\n    return () => h('div', ctx.api.value.getContentProps() as Record<string, unknown>, slots.default?.())\n  },\n})\n"],"mappings":";;;;;;;;;AAWA,MAAa,kBAAkB,gBAAgB;CAC7C,MAAM;CAEN,OAAO;EACL,MAAM;GAAE,MAAM,CAAC,QAAQ,KAAK;GAAkC,SAAS,KAAA;EAAU;EACjF,QAAQ;GAAE,MAAM;GAAQ,SAAS,KAAA;EAAU;EAC3C,KAAK;GAAE,MAAM;GAAQ,SAAS,KAAA;EAAU;EACxC,UAAU;GAAE,MAAM;GAAQ,SAAS,KAAA;EAAU;EAC7C,SAAS;GAAE,MAAM;GAAQ,SAAS,KAAA;EAAU;CAC9C;CACA,MAAM,OAAO,EAAE,SAAS;EACtB,MAAM,MAAM,eAAe,iBAAiB,OAAyB,YAAY,CAAC;EAClF,iBAAiB,EAAE,IAAI,CAAC;EACxB,aAAa,EAAE,OAAO,IAAI,MAAM,aAAa,GAA8B,MAAM,UAAU,CAAC;CAC9F;AACF,CAAC;;AAGD,MAAa,qBAAqB,gBAAgB;CAChD,MAAM;CACN,MAAM,GAAG,EAAE,SAAS;EAClB,MAAM,MAAM,oBAAoB;EAChC,aAAa,EAAE,OAAO,IAAI,IAAI,MAAM,gBAAgB,GAA8B,MAAM,UAAU,CAAC;CACrG;AACF,CAAC"}
+{"version":3,"file":"watermark.js","names":[],"sources":["../../../src/components/watermark/watermark.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// 提供 watermark 相关实现。\n\nimport type { WatermarkImageSize, WatermarkProps } from '@xihan-ui/headless'\nimport type { PropType } from 'vue'\nimport { connectWatermark } from '@xihan-ui/headless'\nimport { computed, defineComponent, h } from 'vue'\nimport { vueNormalize } from '../../runtime/normalize-props'\nimport { provideWatermark, useWatermarkContext } from './context'\n\n/**\n * 水印覆盖的区域。图样由 connect 计算为一张 SVG，写为根上的内联 CSS 变量，\n * 由皮肤铺为一层覆盖在内容之上的伪元素：印记因此不进入无障碍树、不接收点击、也不可选中。\n */\nexport const XhWatermarkRoot = defineComponent({\n  name: 'XhWatermarkRoot',\n  // 有 connect 兜底的 prop：普通类型省略 default，Boolean 显式保留 undefined\n  props: {\n    text: { type: [String, Array] as PropType<string | string[]> },\n    rotate: { type: Number },\n    gap: { type: Number },\n    fontSize: { type: Number },\n    opacity: { type: Number },\n    fontFamily: { type: String },\n    image: { type: String },\n    imageSize: { type: Object as PropType<WatermarkImageSize> },\n  },\n  setup(props, { slots }) {\n    const api = computed(() => connectWatermark(props as WatermarkProps, vueNormalize))\n    provideWatermark({ api })\n    return () => h('div', api.value.getRootProps() as Record<string, unknown>, slots.default?.())\n  },\n})\n\n/** 被覆盖的内容。 */\nexport const XhWatermarkContent = defineComponent({\n  name: 'XhWatermarkContent',\n  setup(_, { slots }) {\n    const ctx = useWatermarkContext()\n    return () => h('div', ctx.api.value.getContentProps() as Record<string, unknown>, slots.default?.())\n  },\n})\n"],"mappings":";;;;;;;;;AAkBA,MAAa,kBAAkB,gBAAgB;CAC7C,MAAM;CAEN,OAAO;EACL,MAAM,EAAE,MAAM,CAAC,QAAQ,KAAK,EAAiC;EAC7D,QAAQ,EAAE,MAAM,OAAO;EACvB,KAAK,EAAE,MAAM,OAAO;EACpB,UAAU,EAAE,MAAM,OAAO;EACzB,SAAS,EAAE,MAAM,OAAO;EACxB,YAAY,EAAE,MAAM,OAAO;EAC3B,OAAO,EAAE,MAAM,OAAO;EACtB,WAAW,EAAE,MAAM,OAAuC;CAC5D;CACA,MAAM,OAAO,EAAE,SAAS;EACtB,MAAM,MAAM,eAAe,iBAAiB,OAAyB,YAAY,CAAC;EAClF,iBAAiB,EAAE,IAAI,CAAC;EACxB,aAAa,EAAE,OAAO,IAAI,MAAM,aAAa,GAA8B,MAAM,UAAU,CAAC;CAC9F;AACF,CAAC;;AAGD,MAAa,qBAAqB,gBAAgB;CAChD,MAAM;CACN,MAAM,GAAG,EAAE,SAAS;EAClB,MAAM,MAAM,oBAAoB;EAChC,aAAa,EAAE,OAAO,IAAI,IAAI,MAAM,gBAAgB,GAA8B,MAAM,UAAU,CAAC;CACrG;AACF,CAAC"}

package/dist/config/config.d.ts

@@ -1,37 +1,44 @@
 import { ComputedRef, MaybeRefOrGetter } from "vue";
 import { XhConfigBase, XhTranslationOverrides } from "@xihan-ui/headless";
+import { VisualEnvironmentControllerOptions } from "@xihan-ui/core/visual-environment";
 //#region src/config/config.d.ts
+type BindVisualRoot<T> = T extends unknown ? Omit<T, 'parent' | 'root'> & {
+  root: Element;
+} : never;
+type XhVisualEnvironmentConfig = BindVisualRoot<VisualEnvironmentControllerOptions>;
 interface XhConfig extends XhConfigBase {
   /**
-   * 浮层默认挂到哪个容器；返回 null 即挂 body。
-   * 应用级默认，实例上写了容器的以实例为准。
+   * 浮层默认挂载的容器；返回 null 即挂载到 body。
+   * 应用级默认，实例上写了容器时以实例为准。
    */
   portalContainer?: () => Element | null;
+  /** 本次 provide 的七轴视觉环境；root 必须显式给出，不推测组件 DOM。 */
+  visualEnvironment?: XhVisualEnvironmentConfig;
 }
 /**
  * 本层与外层逐键合并。
  *
- * 键缺席与写成 undefined 都算「这一层没说」，一律回落外层——子树注入只想改文案时，
- * 不该把外层的 locale 与 portalContainer 一并抹掉。
+ * 键缺席与写为 undefined 都视为本层未声明，一律回落外层：子树注入只需要改文案时，
+ * 不应把外层的 locale 与 portalContainer 一并清除。
  */
 declare function mergeXhConfig$1(base: XhConfig | undefined, over: XhConfig): XhConfig;
 /**
- * 注入一份配置，作用于本组件子树。传 ref/getter 即可运行时切语言，组件跟着重渲。
+ * 注入一份配置，作用于本组件子树。传 ref/getter 即可在运行时切换语言，组件随之重渲。
  *
  * 嵌套注入按键合并，不整份遮蔽：内层只写了 translations 时，外层的 locale 仍然生效。
  */
 declare function provideXhConfig(config: MaybeRefOrGetter<XhConfig>): void;
-/** 读当前作用域的全局配置（已与外层合并）；没注入时得到空对象。 */
+/** 读取当前作用域的全局配置（已与外层合并）；未注入时得到空对象。 */
 declare function useXhConfig(): ComputedRef<XhConfig>;
 /**
- * 把全局配置垫进组件 props：translations 按键合并（实例键胜出），
- * locale 与 size 在实例没给时回落全局。没注入配置时原样返回，零开销。
+ * 把全局配置合入组件 props：translations 按键合并（实例键优先），
+ * locale 与 size 在实例未提供时回落全局。未注入配置时原样返回，零开销。
  * 只能在 setup 期调用。
  *
- * 跑机器的组件不必逐个调它——useMachine 那一处已经把 locale 与 size 并进去了；
- * 这个函数管两件那里管不到的事：按组件名分桶的 translations，以及没有机器的那十几个组件。
+ * 运行状态机的组件不必逐个调用它：useMachine 已经把 locale 与 size 合并进去；
+ * 本函数负责两件那里无法覆盖的事：按组件名分桶的 translations，以及没有状态机的组件。
  */
 declare function withXhConfig<T extends object>(component: keyof XhTranslationOverrides, props: T): T;
 //#endregion
-export { XhConfig, type XhTranslationOverrides, mergeXhConfig$1 as mergeXhConfig, provideXhConfig, useXhConfig, withXhConfig };
+export { XhConfig, type XhTranslationOverrides, XhVisualEnvironmentConfig, mergeXhConfig$1 as mergeXhConfig, provideXhConfig, useXhConfig, withXhConfig };
 //# sourceMappingURL=config.d.ts.map

package/dist/config/config.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"config.d.ts","names":[],"sources":["../../src/config/config.ts"],"mappings":";;;UAWiB,iBAAiB;;;;;EAKhC,wBAAwB;;;;;;;;iBAWV,gBAAc,MAAM,sBAAsB,MAAM,WAAW;;;;;;iBAS3D,gBAAgB,QAAQ,iBAAiB;;iBA0BzC,eAAe,YAAY;;;;;;;;;iBAa3B,aAAa,kBAAkB,iBAAiB,wBAAwB,OAAO,IAAI"}
+{"version":3,"file":"config.d.ts","names":[],"sources":["../../src/config/config.ts"],"mappings":";;;;KAoBK,eAAe,KAAK,oBAAoB,KAAK;EAA0B,MAAM;;KACtE,4BAA4B,eAAe;UAEtC,iBAAiB;;;;;EAKhC,wBAAwB;;EAExB,oBAAoB;;;;;;;;iBAYN,gBAAc,MAAM,sBAAsB,MAAM,WAAW;;;;;;iBAS3D,gBAAgB,QAAQ,iBAAiB;;iBA0CzC,eAAe,YAAY;;;;;;;;;iBAa3B,aAAa,kBAAkB,iBAAiB,wBAAwB,OAAO,IAAI"}

package/dist/config/config.js

@@ -1,52 +1,71 @@
-import { computed, inject, provide, toValue, watch } from "vue";
+import { computed, inject, onScopeDispose, provide, shallowRef, toValue, watch } from "vue";
 import { SIZE_IS_NOT_AXIS, componentTranslations, mergeXhConfig } from "@xihan-ui/headless";
-import { setMotionOverride } from "@xihan-ui/motion";
+import { createVisualEnvironmentController } from "@xihan-ui/core/visual-environment";
 //#region src/config/config.ts
 const KEY = Symbol.for("xh-config");
+const VISUAL_KEY = Symbol.for("xh-visual-environment");
 /**
 * 本层与外层逐键合并。
 *
-* 键缺席与写成 undefined 都算「这一层没说」，一律回落外层——子树注入只想改文案时，
-* 不该把外层的 locale 与 portalContainer 一并抹掉。
+* 键缺席与写为 undefined 都视为本层未声明，一律回落外层：子树注入只需要改文案时，
+* 不应把外层的 locale 与 portalContainer 一并清除。
 */
 function mergeXhConfig$1(base, over) {
 	return mergeXhConfig(base, over);
 }
 /**
-* 注入一份配置，作用于本组件子树。传 ref/getter 即可运行时切语言，组件跟着重渲。
+* 注入一份配置，作用于本组件子树。传 ref/getter 即可在运行时切换语言，组件随之重渲。
 *
 * 嵌套注入按键合并，不整份遮蔽：内层只写了 translations 时，外层的 locale 仍然生效。
 */
 function provideXhConfig(config) {
-	applyMotionOverride(config);
 	const parent = inject(KEY, void 0);
-	if (!parent) {
-		provide(KEY, config);
-		return;
-	}
-	provide(KEY, () => mergeXhConfig$1(toValue(parent), toValue(config)));
-}
-/**
-* 这一层写了 motion 才调 setMotionOverride；缺席不碰——别的地方设的 override 不在这里清。
-* 配置是 ref/getter 时跟着它变。
-*/
-function applyMotionOverride(config) {
-	watch(() => toValue(config).motion, (motion) => {
-		if (motion !== void 0) setMotionOverride(motion);
+	provide(KEY, parent ? () => mergeXhConfig$1(toValue(parent), toValue(config)) : config);
+	const parentVisual = inject(VISUAL_KEY, void 0);
+	const localVisual = shallowRef();
+	const visual = computed(() => localVisual.value ?? parentVisual?.value);
+	provide(VISUAL_KEY, visual);
+	const stop = watch(() => {
+		const binding = toValue(config).visualEnvironment;
+		return [
+			binding?.root,
+			binding?.storageKey,
+			binding?.onStorageError,
+			binding?.motionSink,
+			binding?.initial?.mode,
+			binding?.initial?.brand,
+			binding?.initial?.density,
+			binding?.initial?.dir,
+			binding?.initial?.contrast,
+			binding?.initial?.motion,
+			binding?.initial?.transparency,
+			parentVisual?.value
+		];
+	}, ([_root, _storageKey, _onStorageError, _motionSink, _mode, _brand, _density, _dir, _contrast, _motion, _transparency, inherited]) => {
+		const binding = toValue(config).visualEnvironment;
+		localVisual.value?.dispose();
+		localVisual.value = binding ? createVisualEnvironmentController({
+			...binding,
+			parent: inherited
+		}) : void 0;
 	}, { immediate: true });
+	onScopeDispose(() => {
+		stop();
+		localVisual.value?.dispose();
+	});
 }
-/** 读当前作用域的全局配置（已与外层合并）；没注入时得到空对象。 */
+/** 读取当前作用域的全局配置（已与外层合并）；未注入时得到空对象。 */
 function useXhConfig() {
 	const injected = inject(KEY, void 0);
 	return computed(() => toValue(injected) ?? {});
 }
 /**
-* 把全局配置垫进组件 props：translations 按键合并（实例键胜出），
-* locale 与 size 在实例没给时回落全局。没注入配置时原样返回，零开销。
+* 把全局配置合入组件 props：translations 按键合并（实例键优先），
+* locale 与 size 在实例未提供时回落全局。未注入配置时原样返回，零开销。
 * 只能在 setup 期调用。
 *
-* 跑机器的组件不必逐个调它——useMachine 那一处已经把 locale 与 size 并进去了；
-* 这个函数管两件那里管不到的事：按组件名分桶的 translations，以及没有机器的那十几个组件。
+* 运行状态机的组件不必逐个调用它：useMachine 已经把 locale 与 size 合并进去；
+* 本函数负责两件那里无法覆盖的事：按组件名分桶的 translations，以及没有状态机的组件。
 */
 function withXhConfig(component, props) {
 	const injected = inject(KEY, void 0);

package/dist/config/config.js.map

@@ -1 +1 @@
-{"version":3,"file":"config.js","names":["mergeXhConfig","mergeBase"],"sources":["../../src/config/config.ts"],"sourcesContent":["// 全局配置注入：应用级默认值，实例上写了的以实例为准。\n// 取值优先级：实例 props > 最近一层注入 > 外层注入 > 组件内建默认（英文）。\n// 注入是可选的——不 provide 时组件走原路，零开销。\nimport type { XhConfigBase, XhTranslationOverrides } from '@xihan-ui/headless'\nimport type { ComputedRef, InjectionKey, MaybeRefOrGetter } from 'vue'\nimport { componentTranslations, mergeXhConfig as mergeBase, SIZE_IS_NOT_AXIS } from '@xihan-ui/headless'\nimport { setMotionOverride } from '@xihan-ui/motion'\nimport { computed, inject, provide, toValue, watch } from 'vue'\n\nexport type { XhTranslationOverrides }\n\nexport interface XhConfig extends XhConfigBase {\n  /**\n   * 浮层默认挂到哪个容器；返回 null 即挂 body。\n   * 应用级默认，实例上写了容器的以实例为准。\n   */\n  portalContainer?: () => Element | null\n}\n\nconst KEY: InjectionKey<MaybeRefOrGetter<XhConfig>> = Symbol.for('xh-config')\n\n/**\n * 本层与外层逐键合并。\n *\n * 键缺席与写成 undefined 都算「这一层没说」，一律回落外层——子树注入只想改文案时，\n * 不该把外层的 locale 与 portalContainer 一并抹掉。\n */\nexport function mergeXhConfig(base: XhConfig | undefined, over: XhConfig): XhConfig {\n  return mergeBase(base, over)\n}\n\n/**\n * 注入一份配置，作用于本组件子树。传 ref/getter 即可运行时切语言，组件跟着重渲。\n *\n * 嵌套注入按键合并，不整份遮蔽：内层只写了 translations 时，外层的 locale 仍然生效。\n */\nexport function provideXhConfig(config: MaybeRefOrGetter<XhConfig>): void {\n  applyMotionOverride(config)\n  const parent = inject(KEY, undefined)\n  if (!parent) {\n    provide(KEY, config)\n    return\n  }\n  provide(KEY, () => mergeXhConfig(toValue(parent), toValue(config)))\n}\n\n/**\n * 这一层写了 motion 才调 setMotionOverride；缺席不碰——别的地方设的 override 不在这里清。\n * 配置是 ref/getter 时跟着它变。\n */\nfunction applyMotionOverride(config: MaybeRefOrGetter<XhConfig>): void {\n  watch(\n    () => toValue(config).motion,\n    (motion) => {\n      if (motion !== undefined)\n        setMotionOverride(motion)\n    },\n    { immediate: true },\n  )\n}\n\n/** 读当前作用域的全局配置（已与外层合并）；没注入时得到空对象。 */\nexport function useXhConfig(): ComputedRef<XhConfig> {\n  const injected = inject(KEY, undefined)\n  return computed(() => toValue(injected) ?? {})\n}\n\n/**\n * 把全局配置垫进组件 props：translations 按键合并（实例键胜出），\n * locale 与 size 在实例没给时回落全局。没注入配置时原样返回，零开销。\n * 只能在 setup 期调用。\n *\n * 跑机器的组件不必逐个调它——useMachine 那一处已经把 locale 与 size 并进去了；\n * 这个函数管两件那里管不到的事：按组件名分桶的 translations，以及没有机器的那十几个组件。\n */\nexport function withXhConfig<T extends object>(component: keyof XhTranslationOverrides, props: T): T {\n  const injected = inject(KEY, undefined)\n  if (!injected)\n    return props\n  return new Proxy(props, {\n    get(target, key, receiver) {\n      const value = Reflect.get(target, key, receiver)\n      if (key === 'translations')\n        return componentTranslations(component, value as object | undefined, toValue(injected) ?? {})\n      if (key === 'locale')\n        return value ?? toValue(injected)?.locale\n      if (key === 'size' && !SIZE_IS_NOT_AXIS.has(component))\n        return value ?? toValue(injected)?.size\n      return value\n    },\n  }) as T\n}\n"],"mappings":";;;;AAmBA,MAAM,MAAgD,OAAO,IAAI,WAAW;;;;;;;AAQ5E,SAAgBA,gBAAc,MAA4B,MAA0B;CAClF,OAAOC,cAAU,MAAM,IAAI;AAC7B;;;;;;AAOA,SAAgB,gBAAgB,QAA0C;CACxE,oBAAoB,MAAM;CAC1B,MAAM,SAAS,OAAO,KAAK,KAAA,CAAS;CACpC,IAAI,CAAC,QAAQ;EACX,QAAQ,KAAK,MAAM;EACnB;CACF;CACA,QAAQ,WAAWD,gBAAc,QAAQ,MAAM,GAAG,QAAQ,MAAM,CAAC,CAAC;AACpE;;;;;AAMA,SAAS,oBAAoB,QAA0C;CACrE,YACQ,QAAQ,MAAM,CAAC,CAAC,SACrB,WAAW;EACV,IAAI,WAAW,KAAA,GACb,kBAAkB,MAAM;CAC5B,GACA,EAAE,WAAW,KAAK,CACpB;AACF;;AAGA,SAAgB,cAAqC;CACnD,MAAM,WAAW,OAAO,KAAK,KAAA,CAAS;CACtC,OAAO,eAAe,QAAQ,QAAQ,KAAK,CAAC,CAAC;AAC/C;;;;;;;;;AAUA,SAAgB,aAA+B,WAAyC,OAAa;CACnG,MAAM,WAAW,OAAO,KAAK,KAAA,CAAS;CACtC,IAAI,CAAC,UACH,OAAO;CACT,OAAO,IAAI,MAAM,OAAO,EACtB,IAAI,QAAQ,KAAK,UAAU;EACzB,MAAM,QAAQ,QAAQ,IAAI,QAAQ,KAAK,QAAQ;EAC/C,IAAI,QAAQ,gBACV,OAAO,sBAAsB,WAAW,OAA6B,QAAQ,QAAQ,KAAK,CAAC,CAAC;EAC9F,IAAI,QAAQ,UACV,OAAO,SAAS,QAAQ,QAAQ,CAAC,EAAE;EACrC,IAAI,QAAQ,UAAU,CAAC,iBAAiB,IAAI,SAAS,GACnD,OAAO,SAAS,QAAQ,QAAQ,CAAC,EAAE;EACrC,OAAO;CACT,EACF,CAAC;AACH"}
+{"version":3,"file":"config.js","names":["mergeXhConfig","mergeBase"],"sources":["../../src/config/config.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// 全局配置注入：应用级默认值，实例上写了的以实例为准。\n// 取值优先级：实例 props > 最近一层注入 > 外层注入 > 组件内建默认（英文）。\n// 注入是可选的——不 provide 时组件走原路，零开销。\nimport type {\n  VisualEnvironmentController,\n  VisualEnvironmentControllerOptions,\n} from '@xihan-ui/core/visual-environment'\nimport type { XhConfigBase, XhTranslationOverrides } from '@xihan-ui/headless'\nimport type { ComputedRef, InjectionKey, MaybeRefOrGetter } from 'vue'\nimport { createVisualEnvironmentController } from '@xihan-ui/core/visual-environment'\nimport { componentTranslations, mergeXhConfig as mergeBase, SIZE_IS_NOT_AXIS } from '@xihan-ui/headless'\nimport { computed, inject, onScopeDispose, provide, shallowRef, toValue, watch } from 'vue'\n\nexport type { XhTranslationOverrides }\n\ntype BindVisualRoot<T> = T extends unknown ? Omit<T, 'parent' | 'root'> & { root: Element } : never\nexport type XhVisualEnvironmentConfig = BindVisualRoot<VisualEnvironmentControllerOptions>\n\nexport interface XhConfig extends XhConfigBase {\n  /**\n   * 浮层默认挂载的容器；返回 null 即挂载到 body。\n   * 应用级默认，实例上写了容器时以实例为准。\n   */\n  portalContainer?: () => Element | null\n  /** 本次 provide 的七轴视觉环境；root 必须显式给出，不推测组件 DOM。 */\n  visualEnvironment?: XhVisualEnvironmentConfig\n}\n\nconst KEY: InjectionKey<MaybeRefOrGetter<XhConfig>> = Symbol.for('xh-config')\nconst VISUAL_KEY: InjectionKey<ComputedRef<VisualEnvironmentController | undefined>> = Symbol.for('xh-visual-environment')\n\n/**\n * 本层与外层逐键合并。\n *\n * 键缺席与写为 undefined 都视为本层未声明，一律回落外层：子树注入只需要改文案时，\n * 不应把外层的 locale 与 portalContainer 一并清除。\n */\nexport function mergeXhConfig(base: XhConfig | undefined, over: XhConfig): XhConfig {\n  return mergeBase(base, over)\n}\n\n/**\n * 注入一份配置，作用于本组件子树。传 ref/getter 即可在运行时切换语言，组件随之重渲。\n *\n * 嵌套注入按键合并，不整份遮蔽：内层只写了 translations 时，外层的 locale 仍然生效。\n */\nexport function provideXhConfig(config: MaybeRefOrGetter<XhConfig>): void {\n  const parent = inject(KEY, undefined)\n  provide(KEY, parent ? () => mergeXhConfig(toValue(parent), toValue(config)) : config)\n\n  const parentVisual = inject(VISUAL_KEY, undefined)\n  const localVisual = shallowRef<VisualEnvironmentController>()\n  const visual = computed(() => localVisual.value ?? parentVisual?.value)\n  provide(VISUAL_KEY, visual)\n  const stop = watch(\n    () => {\n      const binding = toValue(config).visualEnvironment\n      return [\n        binding?.root,\n        binding?.storageKey,\n        binding?.onStorageError,\n        binding?.motionSink,\n        binding?.initial?.mode,\n        binding?.initial?.brand,\n        binding?.initial?.density,\n        binding?.initial?.dir,\n        binding?.initial?.contrast,\n        binding?.initial?.motion,\n        binding?.initial?.transparency,\n        parentVisual?.value,\n      ] as const\n    },\n    ([_root, _storageKey, _onStorageError, _motionSink, _mode, _brand, _density, _dir, _contrast, _motion, _transparency, inherited]) => {\n      const binding = toValue(config).visualEnvironment\n      localVisual.value?.dispose()\n      localVisual.value = binding\n        ? createVisualEnvironmentController({ ...binding, parent: inherited })\n        : undefined\n    },\n    { immediate: true },\n  )\n  onScopeDispose(() => {\n    stop()\n    localVisual.value?.dispose()\n  })\n}\n\n/** 读取当前作用域的全局配置（已与外层合并）；未注入时得到空对象。 */\nexport function useXhConfig(): ComputedRef<XhConfig> {\n  const injected = inject(KEY, undefined)\n  return computed(() => toValue(injected) ?? {})\n}\n\n/**\n * 把全局配置合入组件 props：translations 按键合并（实例键优先），\n * locale 与 size 在实例未提供时回落全局。未注入配置时原样返回，零开销。\n * 只能在 setup 期调用。\n *\n * 运行状态机的组件不必逐个调用它：useMachine 已经把 locale 与 size 合并进去；\n * 本函数负责两件那里无法覆盖的事：按组件名分桶的 translations，以及没有状态机的组件。\n */\nexport function withXhConfig<T extends object>(component: keyof XhTranslationOverrides, props: T): T {\n  const injected = inject(KEY, undefined)\n  if (!injected)\n    return props\n  return new Proxy(props, {\n    get(target, key, receiver) {\n      const value = Reflect.get(target, key, receiver)\n      if (key === 'translations')\n        return componentTranslations(component, value as object | undefined, toValue(injected) ?? {})\n      if (key === 'locale')\n        return value ?? toValue(injected)?.locale\n      if (key === 'size' && !SIZE_IS_NOT_AXIS.has(component))\n        return value ?? toValue(injected)?.size\n      return value\n    },\n  }) as T\n}\n"],"mappings":";;;;AAiCA,MAAM,MAAgD,OAAO,IAAI,WAAW;AAC5E,MAAM,aAAiF,OAAO,IAAI,uBAAuB;;;;;;;AAQzH,SAAgBA,gBAAc,MAA4B,MAA0B;CAClF,OAAOC,cAAU,MAAM,IAAI;AAC7B;;;;;;AAOA,SAAgB,gBAAgB,QAA0C;CACxE,MAAM,SAAS,OAAO,KAAK,KAAA,CAAS;CACpC,QAAQ,KAAK,eAAeD,gBAAc,QAAQ,MAAM,GAAG,QAAQ,MAAM,CAAC,IAAI,MAAM;CAEpF,MAAM,eAAe,OAAO,YAAY,KAAA,CAAS;CACjD,MAAM,cAAc,WAAwC;CAC5D,MAAM,SAAS,eAAe,YAAY,SAAS,cAAc,KAAK;CACtE,QAAQ,YAAY,MAAM;CAC1B,MAAM,OAAO,YACL;EACJ,MAAM,UAAU,QAAQ,MAAM,CAAC,CAAC;EAChC,OAAO;GACL,SAAS;GACT,SAAS;GACT,SAAS;GACT,SAAS;GACT,SAAS,SAAS;GAClB,SAAS,SAAS;GAClB,SAAS,SAAS;GAClB,SAAS,SAAS;GAClB,SAAS,SAAS;GAClB,SAAS,SAAS;GAClB,SAAS,SAAS;GAClB,cAAc;EAChB;CACF,IACC,CAAC,OAAO,aAAa,iBAAiB,aAAa,OAAO,QAAQ,UAAU,MAAM,WAAW,SAAS,eAAe,eAAe;EACnI,MAAM,UAAU,QAAQ,MAAM,CAAC,CAAC;EAChC,YAAY,OAAO,QAAQ;EAC3B,YAAY,QAAQ,UAChB,kCAAkC;GAAE,GAAG;GAAS,QAAQ;EAAU,CAAC,IACnE,KAAA;CACN,GACA,EAAE,WAAW,KAAK,CACpB;CACA,qBAAqB;EACnB,KAAK;EACL,YAAY,OAAO,QAAQ;CAC7B,CAAC;AACH;;AAGA,SAAgB,cAAqC;CACnD,MAAM,WAAW,OAAO,KAAK,KAAA,CAAS;CACtC,OAAO,eAAe,QAAQ,QAAQ,KAAK,CAAC,CAAC;AAC/C;;;;;;;;;AAUA,SAAgB,aAA+B,WAAyC,OAAa;CACnG,MAAM,WAAW,OAAO,KAAK,KAAA,CAAS;CACtC,IAAI,CAAC,UACH,OAAO;CACT,OAAO,IAAI,MAAM,OAAO,EACtB,IAAI,QAAQ,KAAK,UAAU;EACzB,MAAM,QAAQ,QAAQ,IAAI,QAAQ,KAAK,QAAQ;EAC/C,IAAI,QAAQ,gBACV,OAAO,sBAAsB,WAAW,OAA6B,QAAQ,QAAQ,KAAK,CAAC,CAAC;EAC9F,IAAI,QAAQ,UACV,OAAO,SAAS,QAAQ,QAAQ,CAAC,EAAE;EACrC,IAAI,QAAQ,UAAU,CAAC,iBAAiB,IAAI,SAAS,GACnD,OAAO,SAAS,QAAQ,QAAQ,CAAC,EAAE;EACrC,OAAO;CACT,EACF,CAAC;AACH"}