@zerodep-dev/vue-tsx-pro-ui 0.2.0 → 0.3.0

package/dist/feedback/LoadingOverlay.js.map

@@ -1 +1 @@
-{"version":3,"file":"LoadingOverlay.js","names":["_vtp_readonlyProp","_vtp_childrenProp","_vtp_restProps","_createVNode","_mergeProps"],"sources":["../../src/feedback/LoadingOverlay.tsx"],"sourcesContent":["/**\n * 加载遮罩（div）：盖住一块区域（卡片、表单、图表），内容保留在下面，中间显示加载指示。\n *\n *   <LoadingOverlay loading={saving}>\n *     <Form controller={form}>…</Form>\n *   </LoadingOverlay>\n *\n * 外层带 aria-busy；遮罩防闪烁（useDelayedLoading：很快完成时不出现，出现后至少显示一会儿），淡入淡出（usePresence）。\n * 遮罩挡住指针操作；键盘仍可操作下面的内容，需要禁止时由内容自己处理（如表单的 disabled）。\n */\nimport { _component } from '@zerodep-dev/vue-tsx-pro-tsx';\nimport * as css from '@zerodep-dev/vue-tsx-pro-tsx/styles';\nimport type { VNodeChild } from 'vue';\nimport { Spinner, type SpinnerProps } from '../base/Spinner';\nimport { useLang } from '../config/context';\nimport { useDelayedLoading } from '../utils/motion/delayed-loading';\nimport { usePresence } from '../utils/motion/presence';\nimport { mergeAttrs, mergePartProps, type PartProps } from '../utils/props';\nimport { presenceStyles } from '../utils/style/transitions';\nimport { t } from '../config/theme/tokens';\n\n/** 忙碌由组件按 loading 管理 */\nexport type LoadingOverlayManaged = 'aria-busy';\n\n/** 未声明的属性落到外层 div 上 */\nexport interface LoadingOverlayProps extends PartProps<'div', LoadingOverlayManaged> {\n  /** 加载中：盖上遮罩 */\n  loading?: boolean;\n  /** 读屏念的说明，默认取语言包（加载中） */\n  label?: string;\n  /** 遮罩下的内容模糊 */\n  blur?: boolean;\n  /** 遮罩的部件属性 */\n  propsOverlay?: PartProps<'div'>;\n  /** 加载指示的部件属性 */\n  propsSpinner?: Partial<SpinnerProps>;\n  children?: VNodeChild;\n}\n\n/** LoadingOverlay 的样式：root、overlay、blur、spinner */\nexport const loadingOverlayStyles = css.create({\n  // 遮罩按外层定位\n  root: { position: 'relative' },\n  overlay: {\n    position: 'absolute',\n    inset: 0,\n    zIndex: 1,\n    display: 'grid',\n    placeItems: 'center',\n    borderRadius: 'inherit',\n    backgroundColor: `color-mix(in srgb, ${t.colors.surface} 70%, transparent)`,\n    opacity: { default: 1, '@starting-style': 0 },\n    transition: `opacity ${t.durations.md} ${t.easings.enter}`,\n  },\n  blur: { backdropFilter: 'blur(2px)' },\n  spinner: { fontSize: '_xl', color: '_accent' },\n});\n\n/** 加载遮罩：盖住内容，显示加载指示 */\nexport const LoadingOverlay = _component(\n  ({\n    loading = false,\n    label,\n    blur = false,\n    propsOverlay,\n    propsSpinner,\n    children,\n    ...rest\n  }: LoadingOverlayProps) => {\n    const lang = useLang();\n    const shown = useDelayedLoading(() => loading);\n    const presence = usePresence(() => shown.value);\n\n    return () => (\n      <div\n        {...mergeAttrs<'div'>({ sx: loadingOverlayStyles.root }, rest, {\n          'aria-busy': loading || undefined,\n        })}\n      >\n        {children}\n        {presence.mounted && (\n          <div\n            {...mergeAttrs<'div'>(\n              {\n                sx: [\n                  loadingOverlayStyles.overlay,\n                  blur && loadingOverlayStyles.blur,\n                  presence.state === 'closed' && presenceStyles.leaving,\n                ],\n              },\n              propsOverlay,\n              { ref: presence.ref },\n            )}\n            data-state={presence.state}\n          >\n            <Spinner\n              {...mergePartProps<SpinnerProps>(\n                { sx: loadingOverlayStyles.spinner, label: label ?? lang.loading },\n                propsSpinner,\n              )}\n            />\n          </div>\n        )}\n      </div>\n    );\n  },\n);\n"],"mappings":";;;;;;;;;;;;;;AAwCA,IAAa,uBAAuB,IAAI,OAAO;CAE7C,MAAM,EAAE,UAAU,WAAW;CAC7B,SAAS;EACP,UAAU;EACV,OAAO;EACP,QAAQ;EACR,SAAS;EACT,YAAY;EACZ,cAAc;EACd,iBAAiB,sBAAsB,EAAE,OAAO,QAAO;EACvD,SAAS;GAAE,SAAS;GAAG,mBAAmB;EAAE;EAC5C,YAAY,WAAW,EAAE,UAAU,GAAE,GAAI,EAAE,QAAQ;CACrD;CACA,MAAM,EAAE,gBAAgB,YAAY;CACpC,SAAS;EAAE,UAAU;EAAO,OAAO;CAAU;AAC/C,CAAC;;AAGD,IAAa,iBAAiB,0BAC5B,QAAA,SAQ2B;CAAA,MAAA,UAAAA,aAAA,QAAA,WAPf,KAAK;CAAA,MAAA,QAAAA,aAAA,QAAA,OAAA;CAAA,MAAA,OAAAA,aAAA,QAAA,QAER,KAAK;CAAA,MAAA,eAAAA,aAAA,QAAA,cAAA;CAAA,MAAA,eAAAA,aAAA,QAAA,cAAA;CAAA,MAAA,WAAAC,aAAA,MAAA;CAAA,MAIT,OAAIC,UAAA,QAAA,MAAA,KAAA;CAEP,MAAM,OAAO,QAAQ;CACrB,MAAM,QAAQ,wBAAkB,QAAA,KAAa;CAC7C,MAAM,WAAW,kBAAkB,MAAM,KAAK;CAE9C,aAAOC,YAAA,OAEC,WAAkB,EAAE,IAAI,qBAAqB,KAAK,GAAG,MAAM,EAC7D,aAAa,QAAA,SAAW,KAAA,EAC1B,CAAC,GAAC,CAAA,SAAA,OAGD,SAAS,WAAOA,YAAA,OAAAC,WAET,WACF,EACE,IAAI;EACF,qBAAqB;EACrB,KAAA,SAAQ,qBAAqB;EAC7B,SAAS,UAAU,YAAY,eAAe;CAAO,EAEzD,GAAC,aAAA,OAED,EAAE,KAAK,SAAS,IAAI,CACtB,GAAC,EAAA,cACW,SAAS,MAAK,CAAA,GAAA,CAAAD,YAAA,SAGpB,eACF;EAAE,IAAI,qBAAqB;EAAS,OAAO,MAAA,SAAS,KAAK;CAAQ,GAAC,aAAA,KAEpE,GAAC,IAAA,CAAA,CAAA,CAGN,CAAA;AAGP,GAAC;CAAA,MAAA;CAAA,OAAA;EAAA;EAAA;EAAA;EAAA;EAAA;CAAA;AAAA,CACH"}
+{"version":3,"file":"LoadingOverlay.js","names":["_vtp_readonlyProp","_vtp_childrenProp","_vtp_restProps","_createVNode","_mergeProps"],"sources":["../../src/feedback/LoadingOverlay.tsx"],"sourcesContent":["/**\n * 加载遮罩（div）：盖住一块区域（卡片、表单、图表），内容保留在下面，中间显示加载指示。\n *\n *   <LoadingOverlay loading={saving}>\n *     <Form controller={form}>…</Form>\n *   </LoadingOverlay>\n *\n * 外层带 aria-busy；遮罩防闪烁（useDelayedLoading：很快完成时不出现，出现后至少显示一会儿），淡入淡出（usePresence）。\n * 遮罩挡住指针操作；键盘仍可操作下面的内容，需要禁止时由内容自己处理（如表单的 disabled）。\n */\nimport { _component } from '@zerodep-dev/vue-tsx-pro-tsx';\nimport * as css from '@zerodep-dev/vue-tsx-pro-tsx/styles';\nimport type { VNodeChild } from 'vue';\nimport { Spinner, type SpinnerProps } from '../base/Spinner';\nimport { useLang } from '../config/context';\nimport { useDelayedLoading } from '../utils/motion/delayed-loading';\nimport { usePresence } from '../utils/motion/presence';\nimport { mergeAttrs, mergePartProps, type PartProps } from '../utils/props';\nimport { presenceStyles } from '../utils/style/transitions';\nimport { t } from '../config/theme/tokens';\n\n/** 忙碌由组件按 loading 管理 */\nexport type LoadingOverlayManaged = 'aria-busy';\n\n/** 未声明的属性落到外层 div 上 */\nexport interface LoadingOverlayProps extends PartProps<'div', LoadingOverlayManaged> {\n  /** 加载中：盖上遮罩 */\n  loading?: boolean;\n  /** 读屏念的说明，默认取语言包（加载中） */\n  label?: string;\n  /** 遮罩下的内容模糊 */\n  blur?: boolean;\n  /** 遮罩的部件属性 */\n  propsOverlay?: PartProps<'div'>;\n  /** 加载指示的部件属性 */\n  propsSpinner?: Partial<SpinnerProps>;\n  children?: VNodeChild;\n}\n\n/** LoadingOverlay 的样式：root、overlay、blur、spinner */\nexport const loadingOverlayStyles = css.create({\n  // 遮罩按外层定位\n  root: { position: 'relative' },\n  overlay: {\n    position: 'absolute',\n    inset: 0,\n    zIndex: 1,\n    display: 'grid',\n    placeItems: 'center',\n    borderRadius: 'inherit',\n    backgroundColor: `color-mix(in srgb, ${t.colors.surface} 70%, transparent)`,\n    opacity: { default: 1, '@starting-style': 0 },\n    transition: `opacity ${t.durations.md} ${t.easings.enter}`,\n  },\n  blur: { backdropFilter: 'blur(2px)' },\n  spinner: { fontSize: '_xl', color: '_accent' },\n});\n\n/** 加载遮罩：盖住内容，显示加载指示 */\nexport const LoadingOverlay = _component(\n  ({\n    loading = false,\n    label,\n    blur = false,\n    propsOverlay,\n    propsSpinner,\n    children,\n    ...rest\n  }: LoadingOverlayProps) => {\n    const lang = useLang();\n    const shown = useDelayedLoading(() => loading);\n    const presence = usePresence(() => shown.value);\n\n    return () => (\n      <div\n        {...mergeAttrs<'div'>({ sx: loadingOverlayStyles.root }, rest, {\n          'aria-busy': loading || undefined,\n        })}\n      >\n        {children}\n        {presence.mounted && (\n          <div\n            {...mergeAttrs<'div'>(\n              {\n                sx: [\n                  loadingOverlayStyles.overlay,\n                  blur && loadingOverlayStyles.blur,\n                  presence.state === 'closed' && presenceStyles.leaving,\n                ],\n              },\n              propsOverlay,\n              { ref: presence.ref },\n            )}\n            data-state={presence.state}\n          >\n            <Spinner\n              {...mergePartProps<SpinnerProps>(\n                { sx: loadingOverlayStyles.spinner, label: label ?? lang.loading },\n                propsSpinner,\n              )}\n            />\n          </div>\n        )}\n      </div>\n    );\n  },\n);\n"],"mappings":";;;;;;;;;;;;;;AAwCA,IAAa,uBAAuB,IAAI,OAAO;CAE7C,MAAM,EAAE,UAAU,WAAW;CAC7B,SAAS;EACP,UAAU;EACV,OAAO;EACP,QAAQ;EACR,SAAS;EACT,YAAY;EACZ,cAAc;EACd,iBAAiB,sBAAsB,EAAE,OAAO,QAAO;EACvD,SAAS;GAAE,SAAS;GAAG,mBAAmB;EAAE;EAC5C,YAAY,WAAW,EAAE,UAAU,GAAE,GAAI,EAAE,QAAQ;CACrD;CACA,MAAM,EAAE,gBAAgB,YAAY;CACpC,SAAS;EAAE,UAAU;EAAO,OAAO;CAAU;AAC/C,CAAC;;AAGD,IAAa,iBAAiB,0BAC5B,QAAA,SAQ2B;CAAA,MAAA,UAAAA,aAAA,QAAA,WAPf,KAAK;CAAA,MAAA,QAAAA,aAAA,QAAA,OAAA;CAAA,MAAA,OAAAA,aAAA,QAAA,QAER,KAAK;CAAA,MAAA,eAAAA,aAAA,QAAA,cAAA;CAAA,MAAA,eAAAA,aAAA,QAAA,cAAA;CAAA,MAAA,WAAAC,aAAA,MAAA;CAAA,MAIT,OAAIC,UAAA,QAAA,MAAA,KAAA;CAEP,MAAM,OAAO,QAAQ;CACrB,MAAM,QAAQ,wBAAkB,QAAA,KAAa;CAC7C,MAAM,WAAW,kBAAkB,MAAM,KAAK;CAE9C,aAAOC,YAAA,OAEC,WAAkB,EAAE,IAAI,qBAAqB,KAAK,GAAG,MAAM,EAC7D,aAAa,QAAA,SAAW,KAAA,EAC1B,CAAC,GAAC,CAAA,SAAA,OAGD,SAAS,WAAOA,YAAA,OAAAC,cAET,WACF,EACE,IAAI;EACF,qBAAqB;EACrB,KAAA,SAAQ,qBAAqB;EAC7B,SAAS,UAAU,YAAY,eAAe;CAAO,EAEzD,GAAC,aAAA,OAED,EAAE,KAAK,SAAS,IAAI,CACtB,GAAC,EAAA,cACW,SAAS,MAAK,CAAA,GAAA,CAAAD,YAAA,SAGpB,eACF;EAAE,IAAI,qBAAqB;EAAS,OAAO,MAAA,SAAS,KAAK;CAAQ,GAAC,aAAA,KAEpE,GAAC,IAAA,CAAA,CAAA,CAGN,CAAA;AAGP,GAAC;CAAA,MAAA;CAAA,OAAA;EAAA;EAAA;EAAA;EAAA;EAAA;CAAA;AAAA,CACH"}

package/dist/feedback/Progress.js

@@ -1,4 +1,4 @@
-import { clamp } from "../utils/data/number.js";
+import { clamp, svgNumber } from "../utils/data/number.js";
 import { compareNumeric, toNumber } from "../utils/data/numeric.js";
 import { t } from "../config/theme/tokens.js";
 import { useLang } from "../config/context.js";
@@ -9,8 +9,8 @@ import { radiusStyles } from "../utils/style/styles.js";
 import { useRecipe } from "../config/styles.js";
 import { Text as Text$1 } from "../base/Text.js";
 import { useFormat } from "../config/lang/format.js";
-import { createVNode, isVNode, mergeProps, unref, useId } from "vue";
-import { _component, readonlyProp, restProps } from "@zerodep-dev/vue-tsx-pro-tsx";
+import { createVNode, isVNode, unref, useId } from "vue";
+import { _component, mergeJsxProps, readonlyProp, restProps } from "@zerodep-dev/vue-tsx-pro-tsx";
 import * as css from "@zerodep-dev/vue-tsx-pro-tsx/styles";
 //#region src/feedback/Progress.tsx
 /** 角色与取值由组件管理 */
@@ -329,26 +329,26 @@ var Progress = /*#__PURE__*/ _component((_props, _ctx) => {
 			const { stroke, radius: r, circumference } = RING;
 			const angle = (targetPercent ?? 0) / 100 * 2 * Math.PI;
 			const tick = (distance) => ({
-				x: 50 + distance * Math.cos(angle),
-				y: 50 + distance * Math.sin(angle)
+				x: svgNumber(50 + distance * Math.cos(angle)),
+				y: svgNumber(50 + distance * Math.sin(angle))
 			});
 			const outer = tick(r + stroke / 2 + 2);
 			const inner = tick(r - stroke / 2 - 2);
-			return createVNode("div", mergeProps(mergeAttrs({
+			return createVNode("div", mergeJsxProps(mergeAttrs({
 				...s.circle,
 				sx: [s.circle.sx, !wrapped && look.size && fontSizeStyles[look.size]],
 				"aria-labelledby": hasContent(label.value) ? labelId : void 0
-			}, rest, progressbar), { "data-state": state }), [createVNode("svg", mergeProps({
+			}, rest, progressbar), { "data-state": state }), [createVNode("svg", mergeJsxProps({
 				"viewBox": "0 0 100 100",
 				"aria-hidden": "true"
 			}, mergeAttrs(s.circleSvg)), [
-				createVNode("circle", mergeProps({
+				createVNode("circle", mergeJsxProps({
 					"cx": "50",
 					"cy": "50",
 					"r": r,
 					"stroke-width": stroke
 				}, mergeAttrs(s.circleTrack)), null),
-				createVNode("circle", mergeProps({
+				createVNode("circle", mergeJsxProps({
 					"cx": "50",
 					"cy": "50",
 					"r": r,
@@ -357,7 +357,7 @@ var Progress = /*#__PURE__*/ _component((_props, _ctx) => {
 					"stroke-dasharray": circumference,
 					"stroke-dashoffset": determinate ? circumference * (1 - percent / 100) : circumference * .75
 				}, mergeAttrs(s.circleIndicator)), null),
-				targetPercent !== void 0 && createVNode("line", mergeProps({
+				targetPercent !== void 0 && createVNode("line", mergeJsxProps({
 					"x1": outer.x,
 					"y1": outer.y,
 					"x2": inner.x,
@@ -369,7 +369,7 @@ var Progress = /*#__PURE__*/ _component((_props, _ctx) => {
 				sx: [s.valueLabel.sx, relativeFontSizeStyles.sm]
 			}, propsValueLabel.value, { "aria-hidden": true }), _isSlot(shownValue) ? shownValue : { default: () => [shownValue] })]);
 		};
-		const bar = () => createVNode("div", mergeProps(mergeAttrs({
+		const bar = () => createVNode("div", mergeJsxProps(mergeAttrs({
 			...s.track,
 			sx: [
 				s.track.sx,
@@ -377,7 +377,7 @@ var Progress = /*#__PURE__*/ _component((_props, _ctx) => {
 				!header && look.size && fontSizeStyles[look.size]
 			],
 			"aria-labelledby": hasContent(label.value) ? labelId : void 0
-		}, rest, progressbar), { "data-state": state }), [createVNode("div", mergeAttrs(s.indicator, propsIndicator.value, { sx: determinate ? css.bind(progressWidthStyles.percent, () => [`${percent}%`]) : void 0 }), null), targetPercent !== void 0 && createVNode("div", mergeProps({ "aria-hidden": "true" }, mergeAttrs({
+		}, rest, progressbar), { "data-state": state }), [createVNode("div", mergeAttrs(s.indicator, propsIndicator.value, { sx: determinate ? css.bind(progressWidthStyles.percent, () => [`${percent}%`]) : void 0 }), null), targetPercent !== void 0 && createVNode("div", mergeJsxProps({ "aria-hidden": "true" }, mergeAttrs({
 			...s.target,
 			sx: [s.target.sx, css.bind(progressTargetPositionStyles.at, () => [`${targetPercent}%`])]
 		})), null)]);
@@ -386,7 +386,7 @@ var Progress = /*#__PURE__*/ _component((_props, _ctx) => {
 			return createVNode("div", mergeAttrs({
 				...s.root,
 				sx: [s.root.sx, look.size && fontSizeStyles[look.size]]
-			}, propsRoot.value), [ring(), createVNode(Text$1, mergeProps(mergePartProps({
+			}, propsRoot.value), [ring(), createVNode(Text$1, mergeJsxProps(mergePartProps({
 				...s.label,
 				tone: "muted",
 				sx: [s.label.sx, relativeFontSizeStyles.sm]
@@ -402,7 +402,7 @@ var Progress = /*#__PURE__*/ _component((_props, _ctx) => {
 		}, propsRoot.value), [createVNode("div", mergeAttrs({
 			...s.header,
 			sx: [s.header.sx, relativeFontSizeStyles.sm]
-		}, propsHeader.value), [hasContent(label.value) && createVNode(Text$1, mergeProps(mergePartProps(s.label, propsLabel.value, { id: labelId }), { "key": "__site1" }), {
+		}, propsHeader.value), [hasContent(label.value) && createVNode(Text$1, mergeJsxProps(mergePartProps(s.label, propsLabel.value, { id: labelId }), { "key": "__site1" }), {
 			default: () => [unref(label)],
 			$stable: true
 		}), determinate && (showValueLabel.value ?? true) && createVNode(Text$1, mergePartProps({

package/dist/feedback/Progress.js.map

@@ -1 +1 @@
-{"version":3,"file":"Progress.js","names":["_isVNode","_vtp_readonlyProp","_vtp_restProps","_createVNode","_mergeProps","Text","_vue_unref"],"sources":["../../src/feedback/Progress.tsx"],"sourcesContent":["/**\n * 进度（role=\"progressbar\"）：条形（默认）或环形。有 value 时显示完成比例；没有 value（null / undefined）时是不确定进度，循环动画。\n * 名称写 label（条形显示在上方、环形显示在下方）或 aria-label / aria-labelledby（读屏要知道是什么的进度）。\n * 条形有 label 时右侧默认显示数值，环形中间显示数值（按语言格式化的百分比，valueLabel 可以换成自己的文字），参考 React Spectrum ProgressBar。\n * target 是目标值：条上画一条竖线、环上画一道刻度，读屏念成“60%，目标 80%”。\n *\n *   <Progress value={uploaded} max={total} label=\"上传\" valueLabel={`${uploaded} / ${total}`} />\n *   <Progress value={60} aria-label=\"上传进度\" />  只有进度条\n *   <Progress aria-label=\"正在加载\" />               不确定进度\n *   <Progress shape=\"circle\" value={72} target={80} label=\"本月销售完成率\" />\n *\n * 部件：有标签行时外层是 Root（propsRoot），里面是 Label、ValueLabel 与进度条；没有时进度条就是根元素。\n * 环形：根元素是 progressbar，里面是 SVG（轨道、进度、目标刻度）与中间的 ValueLabel；有 label 时外层是 Root，标签在下方。\n */\nimport { _component } from '@zerodep-dev/vue-tsx-pro-tsx';\nimport * as css from '@zerodep-dev/vue-tsx-pro-tsx/styles';\nimport { useId, type VNodeChild } from 'vue';\nimport { Text, type TextProps } from '../base/Text';\nimport { useLang } from '../config/context';\nimport { useDefaults } from '../config/defaults';\nimport { useRecipe } from '../config/styles';\nimport { useFormat } from '../config/lang/format';\nimport { hasContent, mergeAttrs, mergePartProps, type PartProps } from '../utils/props';\nimport { clamp } from '../utils/data/number';\nimport { compareNumeric, toNumber, type NumericValue } from '../utils/data/numeric';\nimport type { StatusTone } from '../utils/style/tone-styles';\nimport { fontSizeStyles, relativeFontSizeStyles, type TextSize } from '../utils/style/typography';\nimport { radiusStyles, type Radius } from '../utils/style/styles';\nimport { t } from '../config/theme/tokens';\n\n/** 角色与取值由组件管理 */\nexport type ProgressManaged =\n  'role' | 'aria-valuemin' | 'aria-valuemax' | 'aria-valuenow' | 'aria-valuetext';\n\n/** 进度的形状 */\nexport interface ProgressShapes {\n  /** 条形（默认）：占满一行 */\n  bar: unknown;\n  /** 环形：中间显示数值，适合仪表盘、卡片里的完成率；直径随字号缩放 */\n  circle: unknown;\n}\n\n/** Progress 的外观选项：可以在 ComponentDefaults 里统一设置 */\nexport interface ProgressOptions {\n  /** 色调（与 Badge、Alert 等同一套），默认 accent */\n  tone?: StatusTone;\n  /** 字号档位：进度条的粗细随之缩放；不写时继承上下文字号 */\n  size?: TextSize;\n  /** 圆角，默认 full */\n  radius?: Radius;\n}\n\n/** 未声明的属性落到轨道（role=\"progressbar\" 的主元素）上 */\nexport interface ProgressProps extends PartProps<'div', ProgressManaged>, ProgressOptions {\n  /** 当前值：number、bigint 或 Decimal；不写（或 null）时为不确定进度 */\n  value?: NumericValue | null;\n  /** 最大值，默认 100 */\n  max?: NumericValue;\n  /** 形状，默认 bar */\n  shape?: keyof ProgressShapes;\n  /** 目标值（与 value 同一单位）：条上画竖线、环上画刻度，读屏念在进度后面 */\n  target?: NumericValue;\n  /** 读屏念的取值文字，如 `(value, max) => \\`已上传 ${value} / ${max} 个文件\\``；默认是百分比 */\n  valueText?: (value: NumericValue, max: NumericValue) => string;\n  /** 进度条上方的标签：同时是进度条的名称（aria-labelledby），不用再写 aria-label */\n  label?: VNodeChild;\n  /** 在标签行右侧显示数值；有 label 或 valueLabel 时默认显示，不确定进度时不显示 */\n  showValueLabel?: boolean;\n  /** 数值文字，替换默认的百分比：`'38.6 / 50 GB'`（只是显示，读屏念的是 valueText） */\n  valueLabel?: VNodeChild;\n  /** 条形的进度（着色部分）的部件属性 */\n  propsIndicator?: PartProps<'div'>;\n  /** 外层（标签行与进度条）的部件属性；只在有标签行时渲染 */\n  propsRoot?: PartProps<'div'>;\n  /** 标签行（标签与数值文字）的部件属性 */\n  propsHeader?: PartProps<'div'>;\n  /** 标签的部件属性 */\n  propsLabel?: Partial<TextProps>;\n  /** 数值文字的部件属性 */\n  propsValueLabel?: Partial<TextProps>;\n}\n\nconst slide = css.keyframes({\n  from: { transform: 'translateX(-100%)' },\n  to: { transform: 'translateX(250%)' },\n});\n\n// 从右到左排版：色块在起始边（右边），从右往左扫\nconst slideRtl = css.keyframes({\n  from: { transform: 'translateX(100%)' },\n  to: { transform: 'translateX(-250%)' },\n});\n\nconst spin = css.keyframes({ to: { rotate: '1turn' } });\n\n/**\n * 进度的配方。条形的部件：root（有标签行时的外层）、header（标签行）、label、valueLabel、\n * track（轨道，即 progressbar）、indicator（进度）、target（目标线）；环形的部件：root（有标签时的外层）、\n * circle（progressbar）、circleSvg、circleTrack、circleIndicator、circleTarget、valueLabel（中间的数值）、label。\n * 档位：shape、tone、indeterminate（不确定进度）。字号、圆角用共用的表另外叠加；\n * 条形的进度宽度与目标线的位置是任意值，用下面的动态样式\n */\nexport const progressRecipe = css.recipe({\n  name: 'Progress',\n  parts: [\n    'root',\n    'header',\n    'label',\n    'valueLabel',\n    'track',\n    'indicator',\n    'target',\n    'circle',\n    'circleSvg',\n    'circleTrack',\n    'circleIndicator',\n    'circleTarget',\n  ],\n  base: {\n    header: {\n      display: 'flex',\n      alignItems: 'baseline',\n      justifyContent: 'space-between',\n      gap: '_sm',\n    },\n    track: {\n      position: 'relative',\n      overflow: 'hidden',\n      width: '_full',\n      height: `calc(${t.space.xs} * 1.5)`,\n      backgroundColor: '_fill',\n      // Windows 高对比下系统把背景色改掉：轨道画一圈系统的文字色，进度用系统的高亮色（见档位 tone）\n      outlineStyle: { default: null, _forcedColors: 'solid' },\n      outlineWidth: { default: null, _forcedColors: '_borderWidths.xs' },\n      outlineColor: { default: null, _forcedColors: 'CanvasText' },\n    },\n    indicator: {\n      height: '_full',\n      borderRadius: 'inherit',\n      forcedColorAdjust: { default: null, _forcedColors: 'none' },\n      transition: `width ${t.durations.md} ${t.easings.standard}`,\n    },\n    // 竖线压在轨道上：正文色，与进度、轨道都有对比；位置按书写方向\n    target: {\n      position: 'absolute',\n      insetBlock: 0,\n      width: '_borderWidths.sm',\n      marginInlineStart: `calc(-0.5 * ${t.borderWidths.sm})`,\n      backgroundColor: { default: '_text', _forcedColors: 'CanvasText' },\n    },\n    // 直径随字号缩放：5em 在默认字号下约 70px\n    circle: {\n      position: 'relative',\n      display: 'inline-grid',\n      placeItems: 'center',\n      width: '5em',\n      height: '5em',\n      flexShrink: 0,\n    },\n    circleSvg: { position: 'absolute', inset: 0, width: '100%', height: '100%', rotate: '-90deg' },\n    circleTrack: {\n      fill: 'none',\n      stroke: { default: '_fill', _forcedColors: 'CanvasText' },\n    },\n    circleIndicator: {\n      fill: 'none',\n      forcedColorAdjust: { default: null, _forcedColors: 'none' },\n      transition: `stroke-dashoffset ${t.durations.md} ${t.easings.standard}`,\n    },\n    circleTarget: { stroke: '_text', strokeLinecap: 'round' },\n  },\n  variants: {\n    shape: {\n      bar: {\n        // 有标签行时的外层：标签行在上、进度条在下\n        root: { display: 'grid', gap: '_xs', minWidth: 0 },\n        // 数值宽度不跳：等宽数字，不被标签挤压\n        valueLabel: { flexShrink: 0, fontVariantNumeric: 'tabular-nums' },\n      },\n      circle: {\n        // 有标签时：环在上、标签在下，居中\n        root: { display: 'inline-grid', justifyItems: 'center', gap: '_xs', textAlign: 'center' },\n        // 中间的数值：比上下文字号小一档，等宽数字\n        valueLabel: { fontVariantNumeric: 'tabular-nums', fontWeight: '_semibold', lineHeight: 1 },\n      },\n    },\n    // 和轨道（fill）之间要有 3:1：中性色用次要文字色，accent 以外的状态色用各自的文字色；条形用背景色，环形用 stroke\n    tone: {\n      neutral: {\n        indicator: {\n          backgroundColor: { default: '_textMuted', _forcedColors: 'Highlight' },\n        },\n        circleIndicator: {\n          stroke: { default: '_textMuted', _forcedColors: 'Highlight' },\n        },\n      },\n      accent: {\n        indicator: {\n          backgroundColor: { default: '_accent', _forcedColors: 'Highlight' },\n        },\n        circleIndicator: {\n          stroke: { default: '_accent', _forcedColors: 'Highlight' },\n        },\n      },\n      info: {\n        indicator: {\n          backgroundColor: { default: '_infoText', _forcedColors: 'Highlight' },\n        },\n        circleIndicator: {\n          stroke: { default: '_infoText', _forcedColors: 'Highlight' },\n        },\n      },\n      success: {\n        indicator: {\n          backgroundColor: {\n            default: '_successText',\n            _forcedColors: 'Highlight',\n          },\n        },\n        circleIndicator: {\n          stroke: { default: '_successText', _forcedColors: 'Highlight' },\n        },\n      },\n      warning: {\n        indicator: {\n          backgroundColor: {\n            default: '_warningText',\n            _forcedColors: 'Highlight',\n          },\n        },\n        circleIndicator: {\n          stroke: { default: '_warningText', _forcedColors: 'Highlight' },\n        },\n      },\n      danger: {\n        indicator: {\n          backgroundColor: {\n            default: '_dangerText',\n            _forcedColors: 'Highlight',\n          },\n        },\n        circleIndicator: {\n          stroke: { default: '_dangerText', _forcedColors: 'Highlight' },\n        },\n      },\n    },\n    indeterminate: {\n      true: {\n        // 条形：一段 40% 宽的色块从起始边到结束边循环；它本身就是信息，不随 durations 变为 0，减少动态效果时变慢\n        indicator: {\n          width: '40%',\n          animationName: { default: slide, ':dir(rtl)': slideRtl },\n          animationDuration: { default: '1.4s', _reducedMotion: '3s' },\n          animationTimingFunction: '_easings.standard',\n          animationIterationCount: 'infinite',\n        },\n        // 环形：四分之一圈的弧一直转；减少动态效果时变慢\n        circleIndicator: {\n          transformOrigin: 'center',\n          animationName: spin,\n          animationDuration: { default: '1s', _reducedMotion: '3s' },\n          animationTimingFunction: 'linear',\n          animationIterationCount: 'infinite',\n        },\n      },\n    },\n  },\n});\n\n/** 进度的部件（createUi / Provider 的 styles.Progress 按它定制） */\nexport type ProgressPart = (typeof progressRecipe.parts)[number];\n\n/** 条形进度目标线的位置 */\nexport const progressTargetPositionStyles = css.create({\n  at: (percent: string) => ({ insetInlineStart: percent }),\n});\n\n// 宽度是任意值，用动态样式；单独一个 create，见 COMPONENTS.md §4\n/** Progress 的样式：percent */\nexport const progressWidthStyles = css.create({\n  percent: (percent: string) => ({ width: percent }),\n});\n\n/** 环形的几何：viewBox 100 × 100，线宽 10 */\nconst RING = { stroke: 10, radius: 45, circumference: 2 * Math.PI * 45 };\n\n/** 值在 0–max 的比例（0–100）；超出范围的夹到两端 */\nfunction percentOf(value: NumericValue, max: NumericValue): number {\n  const total = toNumber(max);\n  if (total <= 0) return 0;\n  const clamped = compareNumeric(value, 0) < 0 ? 0 : compareNumeric(value, max) > 0 ? max : value;\n  return clamp((toNumber(clamped) / total) * 100, 0, 100);\n}\n\n/** 进度：有 value 时为完成比例，没有时为不确定进度；条形有 label 时上方是标签与数值，环形中间是数值 */\nexport const Progress = _component(\n  ({\n    value,\n    max = 100,\n    shape = 'bar',\n    target,\n    tone,\n    size,\n    radius,\n    valueText,\n    label,\n    showValueLabel,\n    valueLabel,\n    propsIndicator,\n    propsRoot,\n    propsHeader,\n    propsLabel,\n    propsValueLabel,\n    ...rest\n  }: ProgressProps) => {\n    const labelId = `${useId()}-label`;\n    const format = useFormat();\n    const lang = useLang();\n    const appearance = useDefaults('Progress', () => ({ tone, size, radius }), {\n      tone: 'accent',\n      radius: 'full',\n    });\n    const recipe = useRecipe(progressRecipe);\n    const percentText = (percent: number) =>\n      format.number(percent / 100, { style: 'percent', maximumFractionDigits: 0 });\n\n    return () => {\n      const look = appearance();\n      const determinate = value != null;\n      const s = recipe({ shape, tone: look.tone, indeterminate: !determinate });\n      // 夹在 0–max 之间、按原值比较；比例与读屏的 aria-valuenow 用浮点数就够\n      const clamped: NumericValue = !determinate\n        ? 0\n        : compareNumeric(value, 0) < 0\n          ? 0\n          : compareNumeric(value, max) > 0\n            ? max\n            : value;\n      const percent = percentOf(clamped, max);\n      const targetPercent = target == null ? undefined : percentOf(target, max);\n      const shownValue = valueLabel ?? percentText(percent);\n      const spoken = determinate ? (valueText?.(clamped, max) ?? percentText(percent)) : undefined;\n      const circle = shape === 'circle';\n      const header =\n        !circle && (label != null || (determinate && (showValueLabel ?? valueLabel != null)));\n      const wrapped = header || (circle && hasContent(label));\n\n      const progressbar = {\n        role: 'progressbar',\n        'aria-valuemin': 0,\n        'aria-valuemax': toNumber(max),\n        'aria-valuenow': determinate ? toNumber(clamped) : undefined,\n        'aria-valuetext':\n          spoken && targetPercent !== undefined\n            ? `${spoken}，${lang.progressTarget(percentText(targetPercent))}`\n            : spoken,\n      } as const;\n      const state = !determinate\n        ? 'indeterminate'\n        : compareNumeric(clamped, max) >= 0\n          ? 'complete'\n          : 'loading';\n\n      const ring = () => {\n        const { stroke, radius: r, circumference } = RING;\n        // 目标刻度：从轨道外缘到内缘的一道线，按比例转到对应角度（SVG 整体转了 -90°，0 在正上方）\n        const angle = ((targetPercent ?? 0) / 100) * 2 * Math.PI;\n        const tick = (distance: number) => ({\n          x: 50 + distance * Math.cos(angle),\n          y: 50 + distance * Math.sin(angle),\n        });\n        const outer = tick(r + stroke / 2 + 2);\n        const inner = tick(r - stroke / 2 - 2);\n        return (\n          <div\n            {...mergeAttrs<'div'>(\n              {\n                ...s.circle,\n                sx: [s.circle.sx, !wrapped && look.size && fontSizeStyles[look.size]],\n                'aria-labelledby': hasContent(label) ? labelId : undefined,\n              },\n              rest,\n              progressbar,\n            )}\n            data-state={state}\n          >\n            <svg viewBox=\"0 0 100 100\" aria-hidden=\"true\" {...mergeAttrs<'svg'>(s.circleSvg)}>\n              <circle\n                cx=\"50\"\n                cy=\"50\"\n                r={r}\n                stroke-width={stroke}\n                {...mergeAttrs<'circle'>(s.circleTrack)}\n              />\n              <circle\n                cx=\"50\"\n                cy=\"50\"\n                r={r}\n                stroke-width={stroke}\n                stroke-linecap={look.radius === 'none' ? 'butt' : 'round'}\n                stroke-dasharray={circumference}\n                stroke-dashoffset={\n                  determinate ? circumference * (1 - percent / 100) : circumference * 0.75\n                }\n                {...mergeAttrs<'circle'>(s.circleIndicator)}\n              />\n              {targetPercent !== undefined && (\n                <line\n                  x1={outer.x}\n                  y1={outer.y}\n                  x2={inner.x}\n                  y2={inner.y}\n                  stroke-width={2.5}\n                  {...mergeAttrs<'line'>(s.circleTarget)}\n                />\n              )}\n            </svg>\n            {determinate && (showValueLabel ?? true) && (\n              <Text\n                {...mergePartProps<TextProps>(\n                  { ...s.valueLabel, sx: [s.valueLabel.sx, relativeFontSizeStyles.sm] },\n                  propsValueLabel,\n                  // 读屏从 aria-valuetext 得知数值，这里不重复念\n                  { 'aria-hidden': true },\n                )}\n              >\n                {shownValue}\n              </Text>\n            )}\n          </div>\n        );\n      };\n\n      const bar = () => (\n        <div\n          {...mergeAttrs<'div'>(\n            {\n              ...s.track,\n              sx: [\n                s.track.sx,\n                radiusStyles[look.radius],\n                // 有外层时字号档位放在外层，标签行一起缩放\n                !header && look.size && fontSizeStyles[look.size],\n              ],\n              'aria-labelledby': hasContent(label) ? labelId : undefined,\n            },\n            rest,\n            progressbar,\n          )}\n          data-state={state}\n        >\n          <div\n            {...mergeAttrs<'div'>(s.indicator, propsIndicator, {\n              sx: determinate ? progressWidthStyles.percent(`${percent}%`) : undefined,\n            })}\n          />\n          {targetPercent !== undefined && (\n            <div\n              aria-hidden=\"true\"\n              {...mergeAttrs<'div'>({\n                ...s.target,\n                sx: [s.target.sx, progressTargetPositionStyles.at(`${targetPercent}%`)],\n              })}\n            />\n          )}\n        </div>\n      );\n\n      if (circle) {\n        if (!wrapped) return ring();\n        return (\n          <div\n            {...mergeAttrs<'div'>(\n              { ...s.root, sx: [s.root.sx, look.size && fontSizeStyles[look.size]] },\n              propsRoot,\n            )}\n          >\n            {ring()}\n            <Text\n              {...mergePartProps<TextProps>(\n                { ...s.label, tone: 'muted', sx: [s.label.sx, relativeFontSizeStyles.sm] },\n                propsLabel,\n                { id: labelId },\n              )}\n            >\n              {label}\n            </Text>\n          </div>\n        );\n      }\n      if (!header) return bar();\n      return (\n        <div\n          {...mergeAttrs<'div'>(\n            { ...s.root, sx: [s.root.sx, look.size && fontSizeStyles[look.size]] },\n            propsRoot,\n          )}\n        >\n          <div\n            {...mergeAttrs<'div'>(\n              { ...s.header, sx: [s.header.sx, relativeFontSizeStyles.sm] },\n              propsHeader,\n            )}\n          >\n            {hasContent(label) && (\n              <Text {...mergePartProps<TextProps>(s.label, propsLabel, { id: labelId })}>\n                {label}\n              </Text>\n            )}\n            {determinate && (showValueLabel ?? true) && (\n              <Text\n                {...mergePartProps<TextProps>(\n                  { ...s.valueLabel, tone: 'muted' },\n                  propsValueLabel,\n                  // 读屏从进度条的 aria-valuetext 得知数值，这里不重复念\n                  { 'aria-hidden': true },\n                )}\n              >\n                {shownValue}\n              </Text>\n            )}\n          </div>\n          {bar()}\n        </div>\n      );\n    };\n  },\n);\n"],"mappings":"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"}
+{"version":3,"file":"Progress.js","names":["_isVNode","_vtp_readonlyProp","_vtp_restProps","_createVNode","_mergeProps","Text","_vue_unref"],"sources":["../../src/feedback/Progress.tsx"],"sourcesContent":["/**\n * 进度（role=\"progressbar\"）：条形（默认）或环形。有 value 时显示完成比例；没有 value（null / undefined）时是不确定进度，循环动画。\n * 名称写 label（条形显示在上方、环形显示在下方）或 aria-label / aria-labelledby（读屏要知道是什么的进度）。\n * 条形有 label 时右侧默认显示数值，环形中间显示数值（按语言格式化的百分比，valueLabel 可以换成自己的文字），参考 React Spectrum ProgressBar。\n * target 是目标值：条上画一条竖线、环上画一道刻度，读屏念成“60%，目标 80%”。\n *\n *   <Progress value={uploaded} max={total} label=\"上传\" valueLabel={`${uploaded} / ${total}`} />\n *   <Progress value={60} aria-label=\"上传进度\" />  只有进度条\n *   <Progress aria-label=\"正在加载\" />               不确定进度\n *   <Progress shape=\"circle\" value={72} target={80} label=\"本月销售完成率\" />\n *\n * 部件：有标签行时外层是 Root（propsRoot），里面是 Label、ValueLabel 与进度条；没有时进度条就是根元素。\n * 环形：根元素是 progressbar，里面是 SVG（轨道、进度、目标刻度）与中间的 ValueLabel；有 label 时外层是 Root，标签在下方。\n */\nimport { _component } from '@zerodep-dev/vue-tsx-pro-tsx';\nimport * as css from '@zerodep-dev/vue-tsx-pro-tsx/styles';\nimport { useId, type VNodeChild } from 'vue';\nimport { Text, type TextProps } from '../base/Text';\nimport { useLang } from '../config/context';\nimport { useDefaults } from '../config/defaults';\nimport { useRecipe } from '../config/styles';\nimport { useFormat } from '../config/lang/format';\nimport { hasContent, mergeAttrs, mergePartProps, type PartProps } from '../utils/props';\nimport { clamp, svgNumber } from '../utils/data/number';\nimport { compareNumeric, toNumber, type NumericValue } from '../utils/data/numeric';\nimport type { StatusTone } from '../utils/style/tone-styles';\nimport { fontSizeStyles, relativeFontSizeStyles, type TextSize } from '../utils/style/typography';\nimport { radiusStyles, type Radius } from '../utils/style/styles';\nimport { t } from '../config/theme/tokens';\n\n/** 角色与取值由组件管理 */\nexport type ProgressManaged =\n  'role' | 'aria-valuemin' | 'aria-valuemax' | 'aria-valuenow' | 'aria-valuetext';\n\n/** 进度的形状 */\nexport interface ProgressShapes {\n  /** 条形（默认）：占满一行 */\n  bar: unknown;\n  /** 环形：中间显示数值，适合仪表盘、卡片里的完成率；直径随字号缩放 */\n  circle: unknown;\n}\n\n/** Progress 的外观选项：可以在 ComponentDefaults 里统一设置 */\nexport interface ProgressOptions {\n  /** 色调（与 Badge、Alert 等同一套），默认 accent */\n  tone?: StatusTone;\n  /** 字号档位：进度条的粗细随之缩放；不写时继承上下文字号 */\n  size?: TextSize;\n  /** 圆角，默认 full */\n  radius?: Radius;\n}\n\n/** 未声明的属性落到轨道（role=\"progressbar\" 的主元素）上 */\nexport interface ProgressProps extends PartProps<'div', ProgressManaged>, ProgressOptions {\n  /** 当前值：number、bigint 或 Decimal；不写（或 null）时为不确定进度 */\n  value?: NumericValue | null;\n  /** 最大值，默认 100 */\n  max?: NumericValue;\n  /** 形状，默认 bar */\n  shape?: keyof ProgressShapes;\n  /** 目标值（与 value 同一单位）：条上画竖线、环上画刻度，读屏念在进度后面 */\n  target?: NumericValue;\n  /** 读屏念的取值文字，如 `(value, max) => \\`已上传 ${value} / ${max} 个文件\\``；默认是百分比 */\n  valueText?: (value: NumericValue, max: NumericValue) => string;\n  /** 进度条上方的标签：同时是进度条的名称（aria-labelledby），不用再写 aria-label */\n  label?: VNodeChild;\n  /** 在标签行右侧显示数值；有 label 或 valueLabel 时默认显示，不确定进度时不显示 */\n  showValueLabel?: boolean;\n  /** 数值文字，替换默认的百分比：`'38.6 / 50 GB'`（只是显示，读屏念的是 valueText） */\n  valueLabel?: VNodeChild;\n  /** 条形的进度（着色部分）的部件属性 */\n  propsIndicator?: PartProps<'div'>;\n  /** 外层（标签行与进度条）的部件属性；只在有标签行时渲染 */\n  propsRoot?: PartProps<'div'>;\n  /** 标签行（标签与数值文字）的部件属性 */\n  propsHeader?: PartProps<'div'>;\n  /** 标签的部件属性 */\n  propsLabel?: Partial<TextProps>;\n  /** 数值文字的部件属性 */\n  propsValueLabel?: Partial<TextProps>;\n}\n\nconst slide = css.keyframes({\n  from: { transform: 'translateX(-100%)' },\n  to: { transform: 'translateX(250%)' },\n});\n\n// 从右到左排版：色块在起始边（右边），从右往左扫\nconst slideRtl = css.keyframes({\n  from: { transform: 'translateX(100%)' },\n  to: { transform: 'translateX(-250%)' },\n});\n\nconst spin = css.keyframes({ to: { rotate: '1turn' } });\n\n/**\n * 进度的配方。条形的部件：root（有标签行时的外层）、header（标签行）、label、valueLabel、\n * track（轨道，即 progressbar）、indicator（进度）、target（目标线）；环形的部件：root（有标签时的外层）、\n * circle（progressbar）、circleSvg、circleTrack、circleIndicator、circleTarget、valueLabel（中间的数值）、label。\n * 档位：shape、tone、indeterminate（不确定进度）。字号、圆角用共用的表另外叠加；\n * 条形的进度宽度与目标线的位置是任意值，用下面的动态样式\n */\nexport const progressRecipe = css.recipe({\n  name: 'Progress',\n  parts: [\n    'root',\n    'header',\n    'label',\n    'valueLabel',\n    'track',\n    'indicator',\n    'target',\n    'circle',\n    'circleSvg',\n    'circleTrack',\n    'circleIndicator',\n    'circleTarget',\n  ],\n  base: {\n    header: {\n      display: 'flex',\n      alignItems: 'baseline',\n      justifyContent: 'space-between',\n      gap: '_sm',\n    },\n    track: {\n      position: 'relative',\n      overflow: 'hidden',\n      width: '_full',\n      height: `calc(${t.space.xs} * 1.5)`,\n      backgroundColor: '_fill',\n      // Windows 高对比下系统把背景色改掉：轨道画一圈系统的文字色，进度用系统的高亮色（见档位 tone）\n      outlineStyle: { default: null, _forcedColors: 'solid' },\n      outlineWidth: { default: null, _forcedColors: '_borderWidths.xs' },\n      outlineColor: { default: null, _forcedColors: 'CanvasText' },\n    },\n    indicator: {\n      height: '_full',\n      borderRadius: 'inherit',\n      forcedColorAdjust: { default: null, _forcedColors: 'none' },\n      transition: `width ${t.durations.md} ${t.easings.standard}`,\n    },\n    // 竖线压在轨道上：正文色，与进度、轨道都有对比；位置按书写方向\n    target: {\n      position: 'absolute',\n      insetBlock: 0,\n      width: '_borderWidths.sm',\n      marginInlineStart: `calc(-0.5 * ${t.borderWidths.sm})`,\n      backgroundColor: { default: '_text', _forcedColors: 'CanvasText' },\n    },\n    // 直径随字号缩放：5em 在默认字号下约 70px\n    circle: {\n      position: 'relative',\n      display: 'inline-grid',\n      placeItems: 'center',\n      width: '5em',\n      height: '5em',\n      flexShrink: 0,\n    },\n    circleSvg: { position: 'absolute', inset: 0, width: '100%', height: '100%', rotate: '-90deg' },\n    circleTrack: {\n      fill: 'none',\n      stroke: { default: '_fill', _forcedColors: 'CanvasText' },\n    },\n    circleIndicator: {\n      fill: 'none',\n      forcedColorAdjust: { default: null, _forcedColors: 'none' },\n      transition: `stroke-dashoffset ${t.durations.md} ${t.easings.standard}`,\n    },\n    circleTarget: { stroke: '_text', strokeLinecap: 'round' },\n  },\n  variants: {\n    shape: {\n      bar: {\n        // 有标签行时的外层：标签行在上、进度条在下\n        root: { display: 'grid', gap: '_xs', minWidth: 0 },\n        // 数值宽度不跳：等宽数字，不被标签挤压\n        valueLabel: { flexShrink: 0, fontVariantNumeric: 'tabular-nums' },\n      },\n      circle: {\n        // 有标签时：环在上、标签在下，居中\n        root: { display: 'inline-grid', justifyItems: 'center', gap: '_xs', textAlign: 'center' },\n        // 中间的数值：比上下文字号小一档，等宽数字\n        valueLabel: { fontVariantNumeric: 'tabular-nums', fontWeight: '_semibold', lineHeight: 1 },\n      },\n    },\n    // 和轨道（fill）之间要有 3:1：中性色用次要文字色，accent 以外的状态色用各自的文字色；条形用背景色，环形用 stroke\n    tone: {\n      neutral: {\n        indicator: {\n          backgroundColor: { default: '_textMuted', _forcedColors: 'Highlight' },\n        },\n        circleIndicator: {\n          stroke: { default: '_textMuted', _forcedColors: 'Highlight' },\n        },\n      },\n      accent: {\n        indicator: {\n          backgroundColor: { default: '_accent', _forcedColors: 'Highlight' },\n        },\n        circleIndicator: {\n          stroke: { default: '_accent', _forcedColors: 'Highlight' },\n        },\n      },\n      info: {\n        indicator: {\n          backgroundColor: { default: '_infoText', _forcedColors: 'Highlight' },\n        },\n        circleIndicator: {\n          stroke: { default: '_infoText', _forcedColors: 'Highlight' },\n        },\n      },\n      success: {\n        indicator: {\n          backgroundColor: {\n            default: '_successText',\n            _forcedColors: 'Highlight',\n          },\n        },\n        circleIndicator: {\n          stroke: { default: '_successText', _forcedColors: 'Highlight' },\n        },\n      },\n      warning: {\n        indicator: {\n          backgroundColor: {\n            default: '_warningText',\n            _forcedColors: 'Highlight',\n          },\n        },\n        circleIndicator: {\n          stroke: { default: '_warningText', _forcedColors: 'Highlight' },\n        },\n      },\n      danger: {\n        indicator: {\n          backgroundColor: {\n            default: '_dangerText',\n            _forcedColors: 'Highlight',\n          },\n        },\n        circleIndicator: {\n          stroke: { default: '_dangerText', _forcedColors: 'Highlight' },\n        },\n      },\n    },\n    indeterminate: {\n      true: {\n        // 条形：一段 40% 宽的色块从起始边到结束边循环；它本身就是信息，不随 durations 变为 0，减少动态效果时变慢\n        indicator: {\n          width: '40%',\n          animationName: { default: slide, ':dir(rtl)': slideRtl },\n          animationDuration: { default: '1.4s', _reducedMotion: '3s' },\n          animationTimingFunction: '_easings.standard',\n          animationIterationCount: 'infinite',\n        },\n        // 环形：四分之一圈的弧一直转；减少动态效果时变慢\n        circleIndicator: {\n          transformOrigin: 'center',\n          animationName: spin,\n          animationDuration: { default: '1s', _reducedMotion: '3s' },\n          animationTimingFunction: 'linear',\n          animationIterationCount: 'infinite',\n        },\n      },\n    },\n  },\n});\n\n/** 进度的部件（createUi / Provider 的 styles.Progress 按它定制） */\nexport type ProgressPart = (typeof progressRecipe.parts)[number];\n\n/** 条形进度目标线的位置 */\nexport const progressTargetPositionStyles = css.create({\n  at: (percent: string) => ({ insetInlineStart: percent }),\n});\n\n// 宽度是任意值，用动态样式；单独一个 create，见 COMPONENTS.md §4\n/** Progress 的样式：percent */\nexport const progressWidthStyles = css.create({\n  percent: (percent: string) => ({ width: percent }),\n});\n\n/** 环形的几何：viewBox 100 × 100，线宽 10 */\nconst RING = { stroke: 10, radius: 45, circumference: 2 * Math.PI * 45 };\n\n/** 值在 0–max 的比例（0–100）；超出范围的夹到两端 */\nfunction percentOf(value: NumericValue, max: NumericValue): number {\n  const total = toNumber(max);\n  if (total <= 0) return 0;\n  const clamped = compareNumeric(value, 0) < 0 ? 0 : compareNumeric(value, max) > 0 ? max : value;\n  return clamp((toNumber(clamped) / total) * 100, 0, 100);\n}\n\n/** 进度：有 value 时为完成比例，没有时为不确定进度；条形有 label 时上方是标签与数值，环形中间是数值 */\nexport const Progress = _component(\n  ({\n    value,\n    max = 100,\n    shape = 'bar',\n    target,\n    tone,\n    size,\n    radius,\n    valueText,\n    label,\n    showValueLabel,\n    valueLabel,\n    propsIndicator,\n    propsRoot,\n    propsHeader,\n    propsLabel,\n    propsValueLabel,\n    ...rest\n  }: ProgressProps) => {\n    const labelId = `${useId()}-label`;\n    const format = useFormat();\n    const lang = useLang();\n    const appearance = useDefaults('Progress', () => ({ tone, size, radius }), {\n      tone: 'accent',\n      radius: 'full',\n    });\n    const recipe = useRecipe(progressRecipe);\n    const percentText = (percent: number) =>\n      format.number(percent / 100, { style: 'percent', maximumFractionDigits: 0 });\n\n    return () => {\n      const look = appearance();\n      const determinate = value != null;\n      const s = recipe({ shape, tone: look.tone, indeterminate: !determinate });\n      // 夹在 0–max 之间、按原值比较；比例与读屏的 aria-valuenow 用浮点数就够\n      const clamped: NumericValue = !determinate\n        ? 0\n        : compareNumeric(value, 0) < 0\n          ? 0\n          : compareNumeric(value, max) > 0\n            ? max\n            : value;\n      const percent = percentOf(clamped, max);\n      const targetPercent = target == null ? undefined : percentOf(target, max);\n      const shownValue = valueLabel ?? percentText(percent);\n      const spoken = determinate ? (valueText?.(clamped, max) ?? percentText(percent)) : undefined;\n      const circle = shape === 'circle';\n      const header =\n        !circle && (label != null || (determinate && (showValueLabel ?? valueLabel != null)));\n      const wrapped = header || (circle && hasContent(label));\n\n      const progressbar = {\n        role: 'progressbar',\n        'aria-valuemin': 0,\n        'aria-valuemax': toNumber(max),\n        'aria-valuenow': determinate ? toNumber(clamped) : undefined,\n        'aria-valuetext':\n          spoken && targetPercent !== undefined\n            ? `${spoken}，${lang.progressTarget(percentText(targetPercent))}`\n            : spoken,\n      } as const;\n      const state = !determinate\n        ? 'indeterminate'\n        : compareNumeric(clamped, max) >= 0\n          ? 'complete'\n          : 'loading';\n\n      const ring = () => {\n        const { stroke, radius: r, circumference } = RING;\n        // 目标刻度：从轨道外缘到内缘的一道线，按比例转到对应角度（SVG 整体转了 -90°，0 在正上方）\n        const angle = ((targetPercent ?? 0) / 100) * 2 * Math.PI;\n        const tick = (distance: number) => ({\n          x: svgNumber(50 + distance * Math.cos(angle)),\n          y: svgNumber(50 + distance * Math.sin(angle)),\n        });\n        const outer = tick(r + stroke / 2 + 2);\n        const inner = tick(r - stroke / 2 - 2);\n        return (\n          <div\n            {...mergeAttrs<'div'>(\n              {\n                ...s.circle,\n                sx: [s.circle.sx, !wrapped && look.size && fontSizeStyles[look.size]],\n                'aria-labelledby': hasContent(label) ? labelId : undefined,\n              },\n              rest,\n              progressbar,\n            )}\n            data-state={state}\n          >\n            <svg viewBox=\"0 0 100 100\" aria-hidden=\"true\" {...mergeAttrs<'svg'>(s.circleSvg)}>\n              <circle\n                cx=\"50\"\n                cy=\"50\"\n                r={r}\n                stroke-width={stroke}\n                {...mergeAttrs<'circle'>(s.circleTrack)}\n              />\n              <circle\n                cx=\"50\"\n                cy=\"50\"\n                r={r}\n                stroke-width={stroke}\n                stroke-linecap={look.radius === 'none' ? 'butt' : 'round'}\n                stroke-dasharray={circumference}\n                stroke-dashoffset={\n                  determinate ? circumference * (1 - percent / 100) : circumference * 0.75\n                }\n                {...mergeAttrs<'circle'>(s.circleIndicator)}\n              />\n              {targetPercent !== undefined && (\n                <line\n                  x1={outer.x}\n                  y1={outer.y}\n                  x2={inner.x}\n                  y2={inner.y}\n                  stroke-width={2.5}\n                  {...mergeAttrs<'line'>(s.circleTarget)}\n                />\n              )}\n            </svg>\n            {determinate && (showValueLabel ?? true) && (\n              <Text\n                {...mergePartProps<TextProps>(\n                  { ...s.valueLabel, sx: [s.valueLabel.sx, relativeFontSizeStyles.sm] },\n                  propsValueLabel,\n                  // 读屏从 aria-valuetext 得知数值，这里不重复念\n                  { 'aria-hidden': true },\n                )}\n              >\n                {shownValue}\n              </Text>\n            )}\n          </div>\n        );\n      };\n\n      const bar = () => (\n        <div\n          {...mergeAttrs<'div'>(\n            {\n              ...s.track,\n              sx: [\n                s.track.sx,\n                radiusStyles[look.radius],\n                // 有外层时字号档位放在外层，标签行一起缩放\n                !header && look.size && fontSizeStyles[look.size],\n              ],\n              'aria-labelledby': hasContent(label) ? labelId : undefined,\n            },\n            rest,\n            progressbar,\n          )}\n          data-state={state}\n        >\n          <div\n            {...mergeAttrs<'div'>(s.indicator, propsIndicator, {\n              sx: determinate ? progressWidthStyles.percent(`${percent}%`) : undefined,\n            })}\n          />\n          {targetPercent !== undefined && (\n            <div\n              aria-hidden=\"true\"\n              {...mergeAttrs<'div'>({\n                ...s.target,\n                sx: [s.target.sx, progressTargetPositionStyles.at(`${targetPercent}%`)],\n              })}\n            />\n          )}\n        </div>\n      );\n\n      if (circle) {\n        if (!wrapped) return ring();\n        return (\n          <div\n            {...mergeAttrs<'div'>(\n              { ...s.root, sx: [s.root.sx, look.size && fontSizeStyles[look.size]] },\n              propsRoot,\n            )}\n          >\n            {ring()}\n            <Text\n              {...mergePartProps<TextProps>(\n                { ...s.label, tone: 'muted', sx: [s.label.sx, relativeFontSizeStyles.sm] },\n                propsLabel,\n                { id: labelId },\n              )}\n            >\n              {label}\n            </Text>\n          </div>\n        );\n      }\n      if (!header) return bar();\n      return (\n        <div\n          {...mergeAttrs<'div'>(\n            { ...s.root, sx: [s.root.sx, look.size && fontSizeStyles[look.size]] },\n            propsRoot,\n          )}\n        >\n          <div\n            {...mergeAttrs<'div'>(\n              { ...s.header, sx: [s.header.sx, relativeFontSizeStyles.sm] },\n              propsHeader,\n            )}\n          >\n            {hasContent(label) && (\n              <Text {...mergePartProps<TextProps>(s.label, propsLabel, { id: labelId })}>\n                {label}\n              </Text>\n            )}\n            {determinate && (showValueLabel ?? true) && (\n              <Text\n                {...mergePartProps<TextProps>(\n                  { ...s.valueLabel, tone: 'muted' },\n                  propsValueLabel,\n                  // 读屏从进度条的 aria-valuetext 得知数值，这里不重复念\n                  { 'aria-hidden': true },\n                )}\n              >\n                {shownValue}\n              </Text>\n            )}\n          </div>\n          {bar()}\n        </div>\n      );\n    };\n  },\n);\n"],"mappings":"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"}

package/dist/feedback/Result.js

@@ -6,8 +6,8 @@ import { useRecipe } from "../config/styles.js";
 import { Icon } from "../base/Icon.js";
 import { statusIcons } from "../utils/style/tone-styles.js";
 import { Paragraph, Text as Text$1 } from "../base/Text.js";
-import { createVNode, isVNode, mergeProps, unref } from "vue";
-import { _component, childrenProp, readonlyProp, restProps } from "@zerodep-dev/vue-tsx-pro-tsx";
+import { createVNode, isVNode, unref } from "vue";
+import { _component, childrenProp, mergeJsxProps, readonlyProp, restProps } from "@zerodep-dev/vue-tsx-pro-tsx";
 import * as css from "@zerodep-dev/vue-tsx-pro-tsx/styles";
 import { FileQuestionMark, ServerCrash, ShieldX } from "@lucide/icons";
 //#region src/feedback/Result.tsx
@@ -118,7 +118,7 @@ var Result = /*#__PURE__*/ _component((_props, _ctx) => {
 		const shownTitle = title.value ?? text?.title;
 		const shownDescription = description.value ?? text?.description;
 		const s = recipe({ tone: shownTone });
-		return createVNode("div", mergeProps(mergeAttrs({
+		return createVNode("div", mergeJsxProps(mergeAttrs({
 			...s.root,
 			sx: [s.root.sx, textSize && fontSizeStyles[textSize]]
 		}, rest), { "data-tone": shownTone }), [
@@ -128,7 +128,7 @@ var Result = /*#__PURE__*/ _component((_props, _ctx) => {
 				draw: draw.value,
 				sx: [toneStyles[shownTone], s.icon.sx]
 			}, propsIcon.value), null),
-			status.value && createVNode(Text$1, mergeProps(mergePartProps(s.code, propsCode.value, { "aria-hidden": true }), { "key": "__site0" }), {
+			status.value && createVNode(Text$1, mergeJsxProps(mergePartProps(s.code, propsCode.value, { "aria-hidden": true }), { "key": "__site0" }), {
 				default: () => [unref(status)],
 				$stable: true
 			}),

package/dist/feedback/Result.js.map

@@ -1 +1 @@
-{"version":3,"file":"Result.js","names":["_isVNode","_vtp_readonlyProp","_vtp_childrenProp","_vtp_restProps","_createVNode","_mergeProps","Text","_vue_unref"],"sources":["../../src/feedback/Result.tsx"],"sourcesContent":["/**\n * 结果页：操作完成后的整块反馈（提交成功、支付失败、权限不足）。大图标（挂载时一笔画出）+ 标题 + 说明 + 操作，居中排列。\n *\n *   <Result tone=\"success\" title=\"提交成功\" description=\"审核结果会通过邮件通知你。\" action={<Button>返回列表</Button>} />\n *   <Result tone=\"danger\" title=\"支付失败\" action={<Button onClick={retry}>重试</Button>}>{details}</Result>\n *   <Result status=\"404\" action={<LinkButton href=\"/\">回到首页</LinkButton>} />   常见状态：图标、色调、标题与说明都有默认值\n *\n * 只是展示，不带角色；操作后才出现、需要读屏播报时，由所在区域用 aria-live 或把焦点移到标题上。\n * 部件：Root（div）、Icon、Code（状态码，status 时）、Title（Text）、Description（Paragraph）、Action（div）。\n */\nimport { _component } from '@zerodep-dev/vue-tsx-pro-tsx';\nimport * as css from '@zerodep-dev/vue-tsx-pro-tsx/styles';\nimport { FileQuestionMark, ServerCrash, ShieldX } from '@lucide/icons';\nimport type { VNodeChild } from 'vue';\nimport { Icon, type IconData, type IconProps } from '../base/Icon';\nimport { useLang } from '../config/context';\nimport { Paragraph, Text, type TextProps } from '../base/Text';\nimport { useDefaults } from '../config/defaults';\nimport { useRecipe } from '../config/styles';\nimport { hasContent, mergeAttrs, mergePartProps, type PartProps } from '../utils/props';\nimport { statusIcons } from '../utils/style/tone-styles';\nimport {\n  fontSizeStyles,\n  relativeFontSizeStyles,\n  toneStyles,\n  type TextSize,\n} from '../utils/style/typography';\n\n/** 结果的色调：决定图标与颜色（与 Alert、Toast 的色调同名） */\nexport interface ResultTones {\n  /** 成功（默认）：对勾 */\n  success: unknown;\n  /** 失败：感叹号 */\n  danger: unknown;\n  /** 警告：三角感叹号 */\n  warning: unknown;\n  /** 信息：i */\n  info: unknown;\n}\n\n/** 常见的出错状态：图标、色调、标题与说明都有默认值（标题与说明取语言包） */\nexport interface ResultStatuses {\n  /** 没有权限 */\n  403: unknown;\n  /** 找不到页面 */\n  404: unknown;\n  /** 服务出错 */\n  500: unknown;\n}\n\n/** 各状态的图标与色调 */\nconst STATUS_LOOKS: Record<keyof ResultStatuses, { icon: IconData; tone: keyof ResultTones }> = {\n  403: { icon: ShieldX, tone: 'warning' },\n  404: { icon: FileQuestionMark, tone: 'info' },\n  500: { icon: ServerCrash, tone: 'danger' },\n};\n\n/** Result 的外观选项：可以在 ComponentDefaults 里统一设置 */\nexport interface ResultOptions {\n  /** 字号档位，内部尺寸随之缩放；不写时继承上下文字号 */\n  size?: TextSize;\n}\n\n/** 未声明的属性落到外层 div 上；原生的 title 属性（悬停提示）让给标题 */\nexport interface ResultProps extends PartProps<'div', 'title'>, ResultOptions {\n  /** 常见状态（403、404、500）：给出图标、色调、状态码与默认的标题、说明，显式写的优先 */\n  status?: `${keyof ResultStatuses}`;\n  /** 色调，默认 success（写了 status 时按状态） */\n  tone?: keyof ResultTones;\n  /** 图标；不写时按色调选，false 不显示 */\n  icon?: IconData | false;\n  /** 挂载时描线画出图标，默认 true；减少动态效果时直接画好 */\n  draw?: boolean;\n  /** 标题 */\n  title?: VNodeChild;\n  /** 说明 */\n  description?: VNodeChild;\n  /** 操作（如“返回”“重试”按钮） */\n  action?: VNodeChild;\n  /** 图标的部件属性 */\n  propsIcon?: Partial<IconProps>;\n  /** 状态码的部件属性 */\n  propsCode?: Partial<TextProps>;\n  /** 标题的部件属性 */\n  propsTitle?: Partial<TextProps>;\n  /** 说明的部件属性 */\n  propsDescription?: Partial<TextProps>;\n  /** 操作区的部件属性 */\n  propsAction?: PartProps<'div'>;\n  /** 说明之后的内容（如错误详情） */\n  children?: VNodeChild;\n}\n\n/**\n * 结果页的配方：各部件的布局与颜色。图标的色调用共用的 toneStyles，排在配方之前，\n * createUi / Provider 的 styles.Result 能盖过它；字号档位用共用的 fontSizeStyles 另外叠加\n */\nexport const resultRecipe = css.recipe({\n  name: 'Result',\n  parts: ['root', 'icon', 'code', 'title', 'description', 'action'],\n  base: {\n    root: {\n      display: 'flex',\n      flexDirection: 'column',\n      alignItems: 'center',\n      gap: '_sm',\n      paddingBlock: '_xl',\n      paddingInline: '_lg',\n      textAlign: 'center',\n      color: '_text',\n    },\n    icon: { width: '4em', height: '4em', marginBlockEnd: '_sm', strokeWidth: '_sm' },\n    // 状态码：大号（随字号缩放）、次要颜色、等宽数字，压在标题上方\n    code: {\n      fontSize: '2.5em',\n      fontWeight: '_bold',\n      lineHeight: 1,\n      color: '_textMuted',\n      fontVariantNumeric: 'tabular-nums',\n      letterSpacing: '_tight',\n    },\n    title: { fontWeight: '_semibold', lineHeight: '_tight' },\n    description: { maxWidth: '36em', color: '_textMuted' },\n    action: {\n      display: 'flex',\n      flexWrap: 'wrap',\n      justifyContent: 'center',\n      gap: '_sm',\n      marginBlockStart: '_md',\n    },\n  },\n});\n\n/** 结果页的部件（createUi / Provider 的 styles.Result 按它定制） */\nexport type ResultPart = (typeof resultRecipe.parts)[number];\n\n/** 结果页：状态图标、标题、说明、操作，居中排列 */\nexport const Result = _component(\n  ({\n    status,\n    tone,\n    icon,\n    draw = true,\n    title,\n    description,\n    action,\n    size,\n    propsIcon,\n    propsCode,\n    propsTitle,\n    propsDescription,\n    propsAction,\n    children,\n    ...rest\n  }: ResultProps) => {\n    const lang = useLang();\n    const appearance = useDefaults('Result', () => ({ size }));\n    const recipe = useRecipe(resultRecipe);\n    return () => {\n      const textSize = appearance().size;\n      const preset = status && STATUS_LOOKS[Number(status) as keyof ResultStatuses];\n      const text = status && lang.resultStatus[status];\n      const shownTone = tone ?? preset?.tone ?? 'success';\n      const shownTitle = title ?? text?.title;\n      const shownDescription = description ?? text?.description;\n      const s = recipe({ tone: shownTone });\n      return (\n        <div\n          {...mergeAttrs<'div'>(\n            { ...s.root, sx: [s.root.sx, textSize && fontSizeStyles[textSize]] },\n            rest,\n          )}\n          data-tone={shownTone}\n        >\n          {icon !== false && (\n            <Icon\n              {...mergePartProps<IconProps>(\n                {\n                  ...s.icon,\n                  icon: icon ?? preset?.icon ?? statusIcons[shownTone],\n                  draw,\n                  sx: [toneStyles[shownTone], s.icon.sx],\n                },\n                propsIcon,\n              )}\n            />\n          )}\n          {status && (\n            <Text\n              {...mergePartProps<TextProps>(\n                s.code,\n                propsCode,\n                // 标题已经说明了状态，状态码对读屏是重复的\n                { 'aria-hidden': true },\n              )}\n            >\n              {status}\n            </Text>\n          )}\n          {hasContent(shownTitle) && (\n            <Text\n              {...mergePartProps<TextProps>(\n                { ...s.title, sx: [s.title.sx, relativeFontSizeStyles.xl] },\n                propsTitle,\n              )}\n            >\n              {shownTitle}\n            </Text>\n          )}\n          {hasContent(shownDescription) && (\n            <Paragraph {...mergePartProps<TextProps>(s.description, propsDescription)}>\n              {shownDescription}\n            </Paragraph>\n          )}\n          {children}\n          {hasContent(action) && <div {...mergeAttrs<'div'>(s.action, propsAction)}>{action}</div>}\n        </div>\n      );\n    };\n  },\n);\n"],"mappings":";;;;;;;;;;;;;;;AAwCA,SAAA,QAAA,GAAA;CAAA,OAAA,OAAA,MAAA,cAAA,OAAA,UAAA,SAAA,KAAA,CAAA,MAAA,qBAAA,CAAAA,QAAA,CAAA;AAAA;;AAWA,IAAM,eAA0F;CAC9F,KAAK;EAAE,MAAM;EAAS,MAAM;CAAU;CACtC,KAAK;EAAE,MAAM;EAAkB,MAAM;CAAO;CAC5C,KAAK;EAAE,MAAM;EAAa,MAAM;CAAS;AAC3C;;;;;;;AA0CA,IAAa,eAAe,IAAI,OAAO;CACrC,MAAM;CACN,OAAO;EAAC;EAAQ;EAAQ;EAAQ;EAAS;EAAe;CAAQ;CAChE,MAAM;EACJ,MAAM;GACJ,SAAS;GACT,eAAe;GACf,YAAY;GACZ,KAAK;GACL,cAAc;GACd,eAAe;GACf,WAAW;GACX,OAAO;EACT;EACA,MAAM;GAAE,OAAO;GAAO,QAAQ;GAAO,gBAAgB;GAAO,aAAa;EAAM;EAE/E,MAAM;GACJ,UAAU;GACV,YAAY;GACZ,YAAY;GACZ,OAAO;GACP,oBAAoB;GACpB,eAAe;EACjB;EACA,OAAO;GAAE,YAAY;GAAa,YAAY;EAAS;EACvD,aAAa;GAAE,UAAU;GAAQ,OAAO;EAAa;EACrD,QAAQ;GACN,SAAS;GACT,UAAU;GACV,gBAAgB;GAChB,KAAK;GACL,kBAAkB;EACpB;CACF;AACF,CAAC;;;AAMD,IAAa,SAAS,0BACpB,QAAA,SAgBmB;CAAA,MAAA,SAAAC,aAAA,QAAA,QAAA;CAAA,MAAA,OAAAA,aAAA,QAAA,MAAA;CAAA,MAAA,OAAAA,aAAA,QAAA,MAAA;CAAA,MAAA,OAAAA,aAAA,QAAA,QAZV,IAAI;CAAA,MAAA,QAAAA,aAAA,QAAA,OAAA;CAAA,MAAA,cAAAA,aAAA,QAAA,aAAA;CAAA,MAAA,SAAAA,aAAA,QAAA,QAAA;CAAA,MAAA,OAAAA,aAAA,QAAA,MAAA;CAAA,MAAA,YAAAA,aAAA,QAAA,WAAA;CAAA,MAAA,YAAAA,aAAA,QAAA,WAAA;CAAA,MAAA,aAAAA,aAAA,QAAA,YAAA;CAAA,MAAA,mBAAAA,aAAA,QAAA,kBAAA;CAAA,MAAA,cAAAA,aAAA,QAAA,aAAA;CAAA,MAAA,WAAAC,aAAA,MAAA;CAAA,MAWR,OAAIC,UAAA,QAAA,MAAA,KAAA;CAEP,MAAM,OAAO,QAAQ;CACrB,MAAM,aAAa,YAAY,iBAAiB,EAAE,MAAI,KAAA,MAAC,EAAE;CACzD,MAAM,SAAS,UAAU,YAAY;CACrC,aAAa;EACX,MAAM,WAAW,WAAW,CAAC,CAAC;EAC9B,MAAM,SAAS,OAAA,SAAU,aAAa,OAAM,OAAA,KAAO;EACnD,MAAM,OAAO,OAAA,SAAU,KAAK,aAAY,OAAA;EACxC,MAAM,YAAY,KAAA,SAAQ,QAAQ,QAAQ;EAC1C,MAAM,aAAa,MAAA,SAAS,MAAM;EAClC,MAAM,mBAAmB,YAAA,SAAe,MAAM;EAC9C,MAAM,IAAI,OAAO,EAAE,MAAM,UAAU,CAAC;EACpC,OAAAC,YAAA,OAAAC,WAEQ,WACF;GAAE,GAAG,EAAE;GAAM,IAAI,CAAC,EAAE,KAAK,IAAI,YAAY,eAAe,SAAS;EAAE,GACnE,IACF,GAAC,EAAA,aACU,UAAS,CAAA,GAAA;GAEnB,KAAA,UAAS,SAAKD,YAAA,MAEP,eACF;IACE,GAAG,EAAE;IACL,MAAM,KAAA,SAAQ,QAAQ,QAAQ,YAAY;IAC1C,MAAI,KAAA;IACJ,IAAI,CAAC,WAAW,YAAY,EAAE,KAAK,EAAE;GACvC,GAAC,UAAA,KAEH,GAAC,IAAA;GAGJ,OAAA,SAAAA,YAAAE,QAAAD,WAEO,eACF,EAAE,MAAI,UAAA,OAGN,EAAE,eAAe,KAAK,CACxB,GAAC,EAAA,OAAA,UAAA,CAAA,GAAA;IAAA,eAAA,CAAAE,MAAA,MAAA,CAAA;IAAA,SAAA;GAAA,CAAA;GAKJ,WAAW,UAAU,KAACH,YAAAE,QAEf,eACF;IAAE,GAAG,EAAE;IAAO,IAAI,CAAC,EAAE,MAAM,IAAI,uBAAuB,EAAE;GAAE,GAAC,WAAA,KAE7D,GAAC,QAEA,UAAU,IAAV,aAAU,EAAA,eAAA,CAAV,UAAU,EAAA,CAAA;GAGd,WAAW,gBAAgB,KAACF,YAAA,WACZ,eAA0B,EAAE,aAAW,iBAAA,KAAkB,GAAC,QACtE,gBAAgB,IAAhB,mBAAgB,EAAA,eAAA,CAAhB,gBAAgB,EAAA,CAAA;GAEpB,SAAA;GAEA,WAAU,OAAA,KAAO,KAACA,YAAA,OAAa,WAAkB,EAAE,QAAM,YAAA,KAAa,GAAC,CAAA,OAAA,KAAA,CAAA;EAAgB,CAAA;CAG9F;AACF,GAAC;CAAA,MAAA;CAAA,OAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;CAAA;AAAA,CACH"}
+{"version":3,"file":"Result.js","names":["_isVNode","_vtp_readonlyProp","_vtp_childrenProp","_vtp_restProps","_createVNode","_mergeProps","Text","_vue_unref"],"sources":["../../src/feedback/Result.tsx"],"sourcesContent":["/**\n * 结果页：操作完成后的整块反馈（提交成功、支付失败、权限不足）。大图标（挂载时一笔画出）+ 标题 + 说明 + 操作，居中排列。\n *\n *   <Result tone=\"success\" title=\"提交成功\" description=\"审核结果会通过邮件通知你。\" action={<Button>返回列表</Button>} />\n *   <Result tone=\"danger\" title=\"支付失败\" action={<Button onClick={retry}>重试</Button>}>{details}</Result>\n *   <Result status=\"404\" action={<LinkButton href=\"/\">回到首页</LinkButton>} />   常见状态：图标、色调、标题与说明都有默认值\n *\n * 只是展示，不带角色；操作后才出现、需要读屏播报时，由所在区域用 aria-live 或把焦点移到标题上。\n * 部件：Root（div）、Icon、Code（状态码，status 时）、Title（Text）、Description（Paragraph）、Action（div）。\n */\nimport { _component } from '@zerodep-dev/vue-tsx-pro-tsx';\nimport * as css from '@zerodep-dev/vue-tsx-pro-tsx/styles';\nimport { FileQuestionMark, ServerCrash, ShieldX } from '@lucide/icons';\nimport type { VNodeChild } from 'vue';\nimport { Icon, type IconData, type IconProps } from '../base/Icon';\nimport { useLang } from '../config/context';\nimport { Paragraph, Text, type TextProps } from '../base/Text';\nimport { useDefaults } from '../config/defaults';\nimport { useRecipe } from '../config/styles';\nimport { hasContent, mergeAttrs, mergePartProps, type PartProps } from '../utils/props';\nimport { statusIcons } from '../utils/style/tone-styles';\nimport {\n  fontSizeStyles,\n  relativeFontSizeStyles,\n  toneStyles,\n  type TextSize,\n} from '../utils/style/typography';\n\n/** 结果的色调：决定图标与颜色（与 Alert、Toast 的色调同名） */\nexport interface ResultTones {\n  /** 成功（默认）：对勾 */\n  success: unknown;\n  /** 失败：感叹号 */\n  danger: unknown;\n  /** 警告：三角感叹号 */\n  warning: unknown;\n  /** 信息：i */\n  info: unknown;\n}\n\n/** 常见的出错状态：图标、色调、标题与说明都有默认值（标题与说明取语言包） */\nexport interface ResultStatuses {\n  /** 没有权限 */\n  403: unknown;\n  /** 找不到页面 */\n  404: unknown;\n  /** 服务出错 */\n  500: unknown;\n}\n\n/** 各状态的图标与色调 */\nconst STATUS_LOOKS: Record<keyof ResultStatuses, { icon: IconData; tone: keyof ResultTones }> = {\n  403: { icon: ShieldX, tone: 'warning' },\n  404: { icon: FileQuestionMark, tone: 'info' },\n  500: { icon: ServerCrash, tone: 'danger' },\n};\n\n/** Result 的外观选项：可以在 ComponentDefaults 里统一设置 */\nexport interface ResultOptions {\n  /** 字号档位，内部尺寸随之缩放；不写时继承上下文字号 */\n  size?: TextSize;\n}\n\n/** 未声明的属性落到外层 div 上；原生的 title 属性（悬停提示）让给标题 */\nexport interface ResultProps extends PartProps<'div', 'title'>, ResultOptions {\n  /** 常见状态（403、404、500）：给出图标、色调、状态码与默认的标题、说明，显式写的优先 */\n  status?: `${keyof ResultStatuses}`;\n  /** 色调，默认 success（写了 status 时按状态） */\n  tone?: keyof ResultTones;\n  /** 图标；不写时按色调选，false 不显示 */\n  icon?: IconData | false;\n  /** 挂载时描线画出图标，默认 true；减少动态效果时直接画好 */\n  draw?: boolean;\n  /** 标题 */\n  title?: VNodeChild;\n  /** 说明 */\n  description?: VNodeChild;\n  /** 操作（如“返回”“重试”按钮） */\n  action?: VNodeChild;\n  /** 图标的部件属性 */\n  propsIcon?: Partial<IconProps>;\n  /** 状态码的部件属性 */\n  propsCode?: Partial<TextProps>;\n  /** 标题的部件属性 */\n  propsTitle?: Partial<TextProps>;\n  /** 说明的部件属性 */\n  propsDescription?: Partial<TextProps>;\n  /** 操作区的部件属性 */\n  propsAction?: PartProps<'div'>;\n  /** 说明之后的内容（如错误详情） */\n  children?: VNodeChild;\n}\n\n/**\n * 结果页的配方：各部件的布局与颜色。图标的色调用共用的 toneStyles，排在配方之前，\n * createUi / Provider 的 styles.Result 能盖过它；字号档位用共用的 fontSizeStyles 另外叠加\n */\nexport const resultRecipe = css.recipe({\n  name: 'Result',\n  parts: ['root', 'icon', 'code', 'title', 'description', 'action'],\n  base: {\n    root: {\n      display: 'flex',\n      flexDirection: 'column',\n      alignItems: 'center',\n      gap: '_sm',\n      paddingBlock: '_xl',\n      paddingInline: '_lg',\n      textAlign: 'center',\n      color: '_text',\n    },\n    icon: { width: '4em', height: '4em', marginBlockEnd: '_sm', strokeWidth: '_sm' },\n    // 状态码：大号（随字号缩放）、次要颜色、等宽数字，压在标题上方\n    code: {\n      fontSize: '2.5em',\n      fontWeight: '_bold',\n      lineHeight: 1,\n      color: '_textMuted',\n      fontVariantNumeric: 'tabular-nums',\n      letterSpacing: '_tight',\n    },\n    title: { fontWeight: '_semibold', lineHeight: '_tight' },\n    description: { maxWidth: '36em', color: '_textMuted' },\n    action: {\n      display: 'flex',\n      flexWrap: 'wrap',\n      justifyContent: 'center',\n      gap: '_sm',\n      marginBlockStart: '_md',\n    },\n  },\n});\n\n/** 结果页的部件（createUi / Provider 的 styles.Result 按它定制） */\nexport type ResultPart = (typeof resultRecipe.parts)[number];\n\n/** 结果页：状态图标、标题、说明、操作，居中排列 */\nexport const Result = _component(\n  ({\n    status,\n    tone,\n    icon,\n    draw = true,\n    title,\n    description,\n    action,\n    size,\n    propsIcon,\n    propsCode,\n    propsTitle,\n    propsDescription,\n    propsAction,\n    children,\n    ...rest\n  }: ResultProps) => {\n    const lang = useLang();\n    const appearance = useDefaults('Result', () => ({ size }));\n    const recipe = useRecipe(resultRecipe);\n    return () => {\n      const textSize = appearance().size;\n      const preset = status && STATUS_LOOKS[Number(status) as keyof ResultStatuses];\n      const text = status && lang.resultStatus[status];\n      const shownTone = tone ?? preset?.tone ?? 'success';\n      const shownTitle = title ?? text?.title;\n      const shownDescription = description ?? text?.description;\n      const s = recipe({ tone: shownTone });\n      return (\n        <div\n          {...mergeAttrs<'div'>(\n            { ...s.root, sx: [s.root.sx, textSize && fontSizeStyles[textSize]] },\n            rest,\n          )}\n          data-tone={shownTone}\n        >\n          {icon !== false && (\n            <Icon\n              {...mergePartProps<IconProps>(\n                {\n                  ...s.icon,\n                  icon: icon ?? preset?.icon ?? statusIcons[shownTone],\n                  draw,\n                  sx: [toneStyles[shownTone], s.icon.sx],\n                },\n                propsIcon,\n              )}\n            />\n          )}\n          {status && (\n            <Text\n              {...mergePartProps<TextProps>(\n                s.code,\n                propsCode,\n                // 标题已经说明了状态，状态码对读屏是重复的\n                { 'aria-hidden': true },\n              )}\n            >\n              {status}\n            </Text>\n          )}\n          {hasContent(shownTitle) && (\n            <Text\n              {...mergePartProps<TextProps>(\n                { ...s.title, sx: [s.title.sx, relativeFontSizeStyles.xl] },\n                propsTitle,\n              )}\n            >\n              {shownTitle}\n            </Text>\n          )}\n          {hasContent(shownDescription) && (\n            <Paragraph {...mergePartProps<TextProps>(s.description, propsDescription)}>\n              {shownDescription}\n            </Paragraph>\n          )}\n          {children}\n          {hasContent(action) && <div {...mergeAttrs<'div'>(s.action, propsAction)}>{action}</div>}\n        </div>\n      );\n    };\n  },\n);\n"],"mappings":"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"}

package/dist/feedback/SkeletonText.js

@@ -1,8 +1,8 @@
 import { mergeAttrs, mergePartProps } from "../utils/props.js";
 import "../utils/style/shimmer.js";
 import { Skeleton } from "./Skeleton.js";
-import { createVNode, mergeProps } from "vue";
-import { _component, readonlyProp, restProps } from "@zerodep-dev/vue-tsx-pro-tsx";
+import { createVNode } from "vue";
+import { _component, mergeJsxProps, readonlyProp, restProps } from "@zerodep-dev/vue-tsx-pro-tsx";
 import * as css from "@zerodep-dev/vue-tsx-pro-tsx/styles";
 //#region src/feedback/SkeletonText.tsx
 /** 未声明的属性落到外层 div 上 */
@@ -21,7 +21,7 @@ var SkeletonText = /*#__PURE__*/ _component((_props, _ctx) => {
 	const delay = readonlyProp(_props, "delay", 0);
 	const propsLine = readonlyProp(_props, "propsLine");
 	const rest = restProps(_props, _ctx, true);
-	return () => createVNode("div", mergeAttrs({ sx: skeletonTextStyles.root }, rest, { "aria-hidden": true }), [Array.from({ length: lines.value }, (_, index) => createVNode(Skeleton, mergeProps({ "key": index }, mergePartProps({
+	return () => createVNode("div", mergeAttrs({ sx: skeletonTextStyles.root }, rest, { "aria-hidden": true }), [Array.from({ length: lines.value }, (_, index) => createVNode(Skeleton, mergeJsxProps({ "key": index }, mergePartProps({
 		variant: "text",
 		delay: delay.value + index * 120,
 		sx: lines.value > 1 && index === lines.value - 1 && skeletonTextStyles.last

package/dist/feedback/SkeletonText.js.map

@@ -1 +1 @@
-{"version":3,"file":"SkeletonText.js","names":["_vtp_readonlyProp","_vtp_restProps","_createVNode","_mergeProps"],"sources":["../../src/feedback/SkeletonText.tsx"],"sourcesContent":["/**\n * 多行文字的骨架（div）：一段正文加载时的占位，几行 Skeleton，最后一行短一些（同 Ant Design 的 paragraph、\n * Chakra 的 SkeletonText）。行距与正文相近，换成内容时高度大致不变。各行的扫光依次错开，像一道波从上往下扫过。\n *\n *   <SkeletonText />\n *   <SkeletonText lines={5} />\n *   <SkeletonText delay={240} />      接在前面的骨架（标题、头像）后面扫\n *\n * 整块对读屏隐藏；在外层加 aria-busy。\n */\nimport { _component } from '@zerodep-dev/vue-tsx-pro-tsx';\nimport * as css from '@zerodep-dev/vue-tsx-pro-tsx/styles';\nimport { mergeAttrs, mergePartProps, type PartProps } from '../utils/props';\nimport { SHIMMER_STAGGER } from '../utils/style/shimmer';\nimport { Skeleton, type SkeletonProps, type SkeletonShapeProps } from './Skeleton';\n\n/** 未声明的属性落到外层 div 上 */\nexport interface SkeletonTextProps extends PartProps<'div', 'aria-hidden'> {\n  /**\n   * 行数\n   * @default 3\n   */\n  lines?: number;\n  /**\n   * 第一行扫光的延迟（毫秒），之后每行再晚一点\n   * @default 0\n   */\n  delay?: number;\n  /** 每一行（Skeleton）的部件属性 */\n  propsLine?: SkeletonShapeProps;\n}\n\n/** SkeletonText 的样式：root、last */\nexport const skeletonTextStyles = css.create({\n  // 1em 高的行加 0.5em 间隔，接近正文 1.5 的行高\n  root: { display: 'flex', flexDirection: 'column', gap: '_sm' },\n  last: { width: '60%' },\n});\n\n/** 多行文字的骨架：最后一行短一些 */\nexport const SkeletonText = _component(\n  ({ lines = 3, delay = 0, propsLine, ...rest }: SkeletonTextProps) =>\n    () => (\n      <div {...mergeAttrs<'div'>({ sx: skeletonTextStyles.root }, rest, { 'aria-hidden': true })}>\n        {Array.from({ length: lines }, (_, index) => (\n          <Skeleton\n            key={index}\n            {...mergePartProps<SkeletonProps>(\n              {\n                variant: 'text',\n                delay: delay + index * SHIMMER_STAGGER,\n                sx: lines > 1 && index === lines - 1 && skeletonTextStyles.last,\n              },\n              propsLine,\n            )}\n          />\n        ))}\n      </div>\n    ),\n);\n"],"mappings":";;;;;;;;;AAiCA,IAAa,qBAAqB,IAAI,OAAO;CAE3C,MAAM;EAAE,SAAS;EAAQ,eAAe;EAAU,KAAK;CAAM;CAC7D,MAAM,EAAE,OAAO,MAAM;AACvB,CAAC;;AAGD,IAAa,eAAe,0BAC1B,QAAA,SAAA;CAAA,MAAA,QAAAA,aAAA,QAAA,SAAW,CAAC;CAAA,MAAA,QAAAA,aAAA,QAAA,SAAU,CAAC;CAAA,MAAA,YAAAA,aAAA,QAAA,WAAA;CAAA,MAAgB,OAAIC,UAAA,QAAA,MAAA,IAAA;CAAA,aACzCC,YAAA,OACW,WAAkB,EAAE,IAAI,mBAAmB,KAAK,GAAG,MAAM,EAAE,eAAe,KAAK,CAAC,GAAC,CACvF,MAAM,KAAK,EAAE,QAAM,MAAA,MAAQ,IAAI,GAAG,UAAKA,YAAA,UAAAC,WAAA,EAAA,OAE/B,MAAK,GACN,eACF;EACE,SAAS;EACT,OAAO,MAAA,QAAQ,QAAA;EACf,IAAI,MAAA,QAAQ,KAAK,UAAU,MAAA,QAAQ,KAAK,mBAAmB;CAC7D,GAAC,UAAA,KAEH,CAAC,GAAA,IAAA,CAEJ,CAAC,CAAA;AAEL,GAAA;CAAA,MAAA;CAAA,OAAA;EAAA;EAAA;EAAA;CAAA;AAAA,CACL"}
+{"version":3,"file":"SkeletonText.js","names":["_vtp_readonlyProp","_vtp_restProps","_createVNode","_mergeProps"],"sources":["../../src/feedback/SkeletonText.tsx"],"sourcesContent":["/**\n * 多行文字的骨架（div）：一段正文加载时的占位，几行 Skeleton，最后一行短一些（同 Ant Design 的 paragraph、\n * Chakra 的 SkeletonText）。行距与正文相近，换成内容时高度大致不变。各行的扫光依次错开，像一道波从上往下扫过。\n *\n *   <SkeletonText />\n *   <SkeletonText lines={5} />\n *   <SkeletonText delay={240} />      接在前面的骨架（标题、头像）后面扫\n *\n * 整块对读屏隐藏；在外层加 aria-busy。\n */\nimport { _component } from '@zerodep-dev/vue-tsx-pro-tsx';\nimport * as css from '@zerodep-dev/vue-tsx-pro-tsx/styles';\nimport { mergeAttrs, mergePartProps, type PartProps } from '../utils/props';\nimport { SHIMMER_STAGGER } from '../utils/style/shimmer';\nimport { Skeleton, type SkeletonProps, type SkeletonShapeProps } from './Skeleton';\n\n/** 未声明的属性落到外层 div 上 */\nexport interface SkeletonTextProps extends PartProps<'div', 'aria-hidden'> {\n  /**\n   * 行数\n   * @default 3\n   */\n  lines?: number;\n  /**\n   * 第一行扫光的延迟（毫秒），之后每行再晚一点\n   * @default 0\n   */\n  delay?: number;\n  /** 每一行（Skeleton）的部件属性 */\n  propsLine?: SkeletonShapeProps;\n}\n\n/** SkeletonText 的样式：root、last */\nexport const skeletonTextStyles = css.create({\n  // 1em 高的行加 0.5em 间隔，接近正文 1.5 的行高\n  root: { display: 'flex', flexDirection: 'column', gap: '_sm' },\n  last: { width: '60%' },\n});\n\n/** 多行文字的骨架：最后一行短一些 */\nexport const SkeletonText = _component(\n  ({ lines = 3, delay = 0, propsLine, ...rest }: SkeletonTextProps) =>\n    () => (\n      <div {...mergeAttrs<'div'>({ sx: skeletonTextStyles.root }, rest, { 'aria-hidden': true })}>\n        {Array.from({ length: lines }, (_, index) => (\n          <Skeleton\n            key={index}\n            {...mergePartProps<SkeletonProps>(\n              {\n                variant: 'text',\n                delay: delay + index * SHIMMER_STAGGER,\n                sx: lines > 1 && index === lines - 1 && skeletonTextStyles.last,\n              },\n              propsLine,\n            )}\n          />\n        ))}\n      </div>\n    ),\n);\n"],"mappings":";;;;;;;;;AAiCA,IAAa,qBAAqB,IAAI,OAAO;CAE3C,MAAM;EAAE,SAAS;EAAQ,eAAe;EAAU,KAAK;CAAM;CAC7D,MAAM,EAAE,OAAO,MAAM;AACvB,CAAC;;AAGD,IAAa,eAAe,0BAC1B,QAAA,SAAA;CAAA,MAAA,QAAAA,aAAA,QAAA,SAAW,CAAC;CAAA,MAAA,QAAAA,aAAA,QAAA,SAAU,CAAC;CAAA,MAAA,YAAAA,aAAA,QAAA,WAAA;CAAA,MAAgB,OAAIC,UAAA,QAAA,MAAA,IAAA;CAAA,aACzCC,YAAA,OACW,WAAkB,EAAE,IAAI,mBAAmB,KAAK,GAAG,MAAM,EAAE,eAAe,KAAK,CAAC,GAAC,CACvF,MAAM,KAAK,EAAE,QAAM,MAAA,MAAQ,IAAI,GAAG,UAAKA,YAAA,UAAAC,cAAA,EAAA,OAE/B,MAAK,GACN,eACF;EACE,SAAS;EACT,OAAO,MAAA,QAAQ,QAAA;EACf,IAAI,MAAA,QAAQ,KAAK,UAAU,MAAA,QAAQ,KAAK,mBAAmB;CAC7D,GAAC,UAAA,KAEH,CAAC,GAAA,IAAA,CAEJ,CAAC,CAAA;AAEL,GAAA;CAAA,MAAA;CAAA,OAAA;EAAA;EAAA;EAAA;CAAA;AAAA,CACL"}

package/dist/feedback/Toast.js

@@ -14,8 +14,8 @@ import { useHotkeys } from "../utils/dom/hotkeys.js";
 import { Alert } from "./Alert.js";
 import { ConfigScope } from "../config/Provider.js";
 import { usePageVisible } from "../utils/dom/page-visibility.js";
-import { Teleport, createVNode, isVNode, mergeProps, nextTick, onBeforeUnmount, onMounted, ref, shallowReactive, shallowRef, watch } from "vue";
-import { _component, effect, readonlyProp, restProps } from "@zerodep-dev/vue-tsx-pro-tsx";
+import { Teleport, createVNode, isVNode, nextTick, onBeforeUnmount, onMounted, ref, shallowReactive, shallowRef, watch } from "vue";
+import { _component, effect, mergeJsxProps, readonlyProp, restProps } from "@zerodep-dev/vue-tsx-pro-tsx";
 import * as css from "@zerodep-dev/vue-tsx-pro-tsx/styles";
 import { utils } from "animejs";
 //#region src/feedback/Toast.tsx
@@ -418,7 +418,7 @@ var ToastItem = /*#__PURE__*/ _component((_props, _ctx) => {
 	return () => {
 		const itemProps = typeof propsItem.value === "function" ? propsItem.value(toast.value) : propsItem.value;
 		const toastProps = typeof propsToast.value === "function" ? propsToast.value(toast.value) : propsToast.value;
-		return createVNode("li", mergeProps(mergeAttrs({ sx: [
+		return createVNode("li", mergeJsxProps(mergeAttrs({ sx: [
 			toastStyles.item,
 			fromTop.value ? toastStyles.itemFromTop : toastStyles.itemFromBottom,
 			depth.value != null && stackSx(depth.value, fromTop.value),
@@ -432,7 +432,7 @@ var ToastItem = /*#__PURE__*/ _component((_props, _ctx) => {
 			},
 			onPointerdown,
 			onKeydown
-		}), { "data-state": presence.state }), [createVNode(Collapse, mergeProps(mergePartProps({ propsContent: { sx: toastStyles.gap } }, propsCollapse.value), { "_open": !toast.value.closing }), { default: () => [createVNode(Alert, mergePartProps({
+		}), { "data-state": presence.state }), [createVNode(Collapse, mergeJsxProps(mergePartProps({ propsContent: { sx: toastStyles.gap } }, propsCollapse.value), { "_open": !toast.value.closing }), { default: () => [createVNode(Alert, mergePartProps({
 			variant: "surface",
 			tone: toast.value.tone ?? "neutral",
 			icon: toast.value.icon,
@@ -441,7 +441,7 @@ var ToastItem = /*#__PURE__*/ _component((_props, _ctx) => {
 			description: toast.value.description,
 			action: toast.value.action,
 			sx: toastStyles.toast
-		}, toastProps, { onClose: toast.value.closable === false ? void 0 : close }), null), progress.value && toast.value.countdown && createVNode("span", mergeProps({ "key": toast.value.countdown.id }, mergeAttrs({ sx: toastStyles.countdown }, propsProgress.value, {
+		}, toastProps, { onClose: toast.value.closable === false ? void 0 : close }), null), progress.value && toast.value.countdown && createVNode("span", mergeJsxProps({ "key": toast.value.countdown.id }, mergeAttrs({ sx: toastStyles.countdown }, propsProgress.value, {
 			sx: [css.bind(toastCountdownStyles.duration, () => [`${toast.value.countdown.duration}ms`], true), css.select(() => controller.value.paused && toastStyles.countdownPaused, true)],
 			"aria-hidden": true
 		})), null)] })]);
@@ -520,7 +520,7 @@ var Toaster = /*#__PURE__*/ _component((_props2, _ctx2) => {
 		let depth = visible.filter((toast) => !toast.closing).length;
 		const depths = visible.map((toast) => toast.closing ? depth : --depth);
 		const stacked = stack.value && !expanded.value;
-		return createVNode(Teleport, { "to": topModal() ?? "body" }, { default: () => [createVNode(ConfigScope, null, { default: () => [createVNode("section", mergeProps(mergeAttrs({
+		return createVNode(Teleport, { "to": topModal() ?? "body" }, { default: () => [createVNode(ConfigScope, null, { default: () => [createVNode("section", mergeJsxProps(mergeAttrs({
 			sx: [toastStyles.region, toastPlacementStyles[placement.value]],
 			"aria-label": lang.toasterLabel
 		}, rest, {