@zerodep-dev/vue-tsx-pro-mobile 0.0.0-stage → 0.4.1

package/dist/feedback/Dialog.js

@@ -0,0 +1,186 @@
+import { useConfig } from "../config/context.js";
+import { hasContent, mergeAttrs, mergePartProps, mergeProps } from "../utils/props.js";
+import { Button } from "../base/Button.js";
+import { Popup } from "../overlay/Popup.js";
+import { css } from "@zerodep-dev/vue-tsx-pro-tsx/styles";
+import { _component, bindable, childrenProp, mergeJsxProps, readonlyProp, restProps } from "@zerodep-dev/vue-tsx-pro-tsx";
+import { createVNode, ref, shallowReactive } from "vue";
+//#region src/feedback/Dialog.tsx
+/** 关闭的原因 */
+/** 对话框的选项（组件的 props 与 showDialog 的参数共用） */
+/** 未声明的属性落到对话框的面板上 */
+/** Dialog 的样式：panel、header、title、message、footer、action */
+var dialogStyles = css.create({
+	panel: {
+		width: "20em",
+		maxWidth: "85vw",
+		overflow: "hidden"
+	},
+	header: {
+		paddingBlockStart: "1.6em",
+		paddingInline: "1.5em",
+		textAlign: "center"
+	},
+	title: {
+		fontSize: "_lg",
+		fontWeight: "_semibold",
+		lineHeight: "_tight",
+		color: "_text"
+	},
+	message: {
+		paddingInline: "1.5em",
+		paddingBlock: "0.75em 1.6em",
+		fontSize: "_md",
+		lineHeight: "1.6",
+		color: "_textMuted",
+		textAlign: "center",
+		whiteSpace: "pre-wrap",
+		overflowWrap: "anywhere"
+	},
+	titleOnly: { paddingBlockEnd: "1.6em" },
+	footer: {
+		display: "flex",
+		borderBlockStartWidth: "_hairline",
+		borderBlockStartStyle: "solid",
+		borderBlockStartColor: "_border"
+	},
+	action: {
+		flex: "1 1 0",
+		minHeight: "3.2em",
+		borderRadius: "_none",
+		borderInlineStartWidth: {
+			default: "_hairline",
+			":first-child": 0
+		},
+		borderInlineStartColor: "_border",
+		fontSize: "_lg"
+	}
+});
+/** 对话框（弹出层 > 标题 + 说明 + 按钮） */
+var Dialog = /*#__PURE__*/ _component((_props, _ctx) => {
+	const open = bindable(_props, "_open", () => false, _ctx.emit);
+	const title = readonlyProp(_props, "title");
+	const message = readonlyProp(_props, "message");
+	const confirmText = readonlyProp(_props, "confirmText");
+	const cancelText = readonlyProp(_props, "cancelText");
+	const showCancel = readonlyProp(_props, "showCancel", false);
+	const confirmTone = readonlyProp(_props, "confirmTone", "accent");
+	const closeOnOverlay = readonlyProp(_props, "closeOnOverlay", false);
+	const onConfirm = readonlyProp(_props, "onConfirm");
+	const onCancel = readonlyProp(_props, "onCancel");
+	const onOpenChange = readonlyProp(_props, "onOpenChange");
+	const children = childrenProp(_props);
+	const footer = readonlyProp(_props, "footer");
+	const propsPopup = readonlyProp(_props, "propsPopup");
+	const propsConfirm = readonlyProp(_props, "propsConfirm");
+	const propsCancel = readonlyProp(_props, "propsCancel");
+	const rest = restProps(_props, _ctx, false);
+	const config = useConfig();
+	let confirming = ref(false);
+	const close = (reason) => {
+		open.value = false;
+		onOpenChange.value?.(false, { reason });
+	};
+	const confirm = async () => {
+		const pending = onConfirm.value?.();
+		if (!(pending instanceof Promise)) return close("confirm");
+		confirming.value = true;
+		try {
+			await pending;
+			close("confirm");
+		} finally {
+			confirming.value = false;
+		}
+	};
+	const cancel = (reason) => {
+		onCancel.value?.();
+		close(reason);
+	};
+	return () => {
+		const body = hasContent(message.value) ? message.value : children.value;
+		return createVNode(Popup, mergePartProps({
+			_open: open.value,
+			position: "center",
+			round: true,
+			closeOnOverlay: closeOnOverlay.value,
+			sx: dialogStyles.panel,
+			onOpenChange: (next, { reason }) => !next && reason === "overlay" && cancel("overlay")
+		}, mergeProps(rest, propsPopup.value)), { default: () => [
+			hasContent(title.value) && createVNode("div", mergeAttrs({ sx: [dialogStyles.header, !hasContent(body) && dialogStyles.titleOnly] }), [createVNode("div", mergeAttrs({ sx: dialogStyles.title }), [title.value])]),
+			hasContent(body) && createVNode("div", mergeAttrs({ sx: dialogStyles.message }), [body]),
+			hasContent(footer.value) ? footer.value : createVNode("div", mergeAttrs({ sx: dialogStyles.footer }), [showCancel.value && createVNode(Button, mergeJsxProps(mergePartProps({
+				variant: "ghost",
+				tone: "neutral",
+				sx: dialogStyles.action,
+				onClick: () => cancel("cancel")
+			}, propsCancel.value), { "key": "__site0" }), {
+				default: () => [cancelText.value ?? config.lang.cancel],
+				$stable: true
+			}), createVNode(Button, mergeJsxProps(mergePartProps({
+				variant: "ghost",
+				tone: confirmTone.value,
+				loading: confirming.value,
+				sx: dialogStyles.action,
+				onClick: () => void confirm()
+			}, propsConfirm.value), { "key": "__site1" }), {
+				default: () => [confirmText.value ?? config.lang.confirm],
+				$stable: true
+			})])
+		] });
+	};
+}, {
+	name: "Dialog",
+	props: [
+		"_open",
+		"onUpdate:_open",
+		"title",
+		"message",
+		"confirmText",
+		"cancelText",
+		"showCancel",
+		"confirmTone",
+		"closeOnOverlay",
+		"onConfirm",
+		"onCancel",
+		"onOpenChange",
+		"footer",
+		"propsPopup",
+		"propsConfirm",
+		"propsCancel"
+	]
+});
+/** 命令式对话框：排队显示，前一个关了才显示下一个 */
+/** 命令式对话框的状态：ConfigProvider 里的出口按它渲染 */
+var dialogState = shallowReactive({
+	open: false,
+	queue: []
+});
+/** 显示一个对话框；确认时结果为 true，取消（或点遮罩关闭）时为 false */
+function showDialog(options) {
+	return new Promise((resolve) => {
+		dialogState.queue = [...dialogState.queue, {
+			options,
+			resolve
+		}];
+		dialogState.open = true;
+	});
+}
+/** 带取消按钮的确认对话框 */
+var showConfirmDialog = (options) => showDialog({
+	showCancel: true,
+	...options
+});
+/** 当前的命令式对话框关闭后：交出结果，过了离场动画再显示下一个 */
+function settleDialog(confirmed) {
+	const [current, ...rest] = dialogState.queue;
+	current?.resolve(confirmed);
+	dialogState.open = false;
+	setTimeout(() => {
+		dialogState.queue = rest;
+		if (rest.length) dialogState.open = true;
+	}, 300);
+}
+//#endregion
+export { Dialog, dialogState, dialogStyles, settleDialog, showConfirmDialog, showDialog };
+
+//# sourceMappingURL=Dialog.js.map

package/dist/feedback/Dialog.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dialog.js","names":["_vtp_bindable","_vtp_readonlyProp","_vtp_childrenProp","_vtp_restProps","_vue_ref","_createVNode","_mergeProps"],"sources":["../../src/feedback/Dialog.tsx"],"sourcesContent":["/**\n * 对话框：屏幕中间的卡片，标题、说明、底部一排按钮（确认、取消）。用来确认操作、提示重要信息。\n *\n *   await showDialog({ title: '提示', message: '提交成功' });\n *   if (await showConfirmDialog({ title: '删除地址', message: '删除后不能恢复', confirmTone: 'danger' })) remove();\n *   <Dialog _open={show} title=\"退出登录\" showCancel onConfirm={logout} />\n *\n * onConfirm 返回 Promise 时确认按钮转圈，完成后才关闭（抛错时不关闭）。命令式的写法渲染在 ConfigProvider 里。\n */\nimport { _component } from '@zerodep-dev/vue-tsx-pro-tsx';\nimport { css } from '@zerodep-dev/vue-tsx-pro-tsx/styles';\nimport { shallowReactive, type VNodeChild } from 'vue';\nimport { Button, type ButtonProps } from '../base/Button';\nimport { useConfig } from '../config/context';\nimport { Popup, type PopupProps } from '../overlay/Popup';\nimport { hasContent, mergeAttrs, mergePartProps, mergeProps, type PartProps } from '../utils/props';\n\n/** 关闭的原因 */\nexport type DialogCloseReason = 'confirm' | 'cancel' | 'overlay';\n\n/** 对话框的选项（组件的 props 与 showDialog 的参数共用） */\nexport interface DialogOptions {\n  /** 标题 */\n  title?: VNodeChild;\n  /** 说明 */\n  message?: VNodeChild;\n  /** 确认按钮的文字；不给时用语言包的\"确认\" */\n  confirmText?: VNodeChild;\n  /** 取消按钮的文字；不给时用语言包的\"取消\" */\n  cancelText?: VNodeChild;\n  /** 显示取消按钮 */\n  showCancel?: boolean;\n  /**\n   * 确认按钮的色调：删除这类操作用 danger\n   * @default 'accent'\n   */\n  confirmTone?: 'accent' | 'danger';\n  /** 点遮罩关闭（等于取消） */\n  closeOnOverlay?: boolean;\n  /** 点了确认；返回 Promise 时按钮转圈，完成后才关闭 */\n  onConfirm?: () => void | Promise<unknown>;\n  /** 点了取消（或点遮罩关闭） */\n  onCancel?: () => void;\n}\n\n/** 未声明的属性落到对话框的面板上 */\nexport interface DialogProps extends DialogOptions, Omit<PartProps<'div', 'role'>, 'title'> {\n  /** 是否打开；双向绑定写 `_open={x}` */\n  _open?: boolean;\n  /** 关闭时带原因 */\n  onOpenChange?: (open: boolean, details: { reason: DialogCloseReason }) => void;\n  /** 说明（与 message 二选一），可以放任意内容 */\n  children?: VNodeChild;\n  /** 自定义底部（代替确认、取消按钮） */\n  footer?: VNodeChild;\n  /** 弹出层的部件属性 */\n  propsPopup?: Partial<PopupProps>;\n  /** 确认按钮的部件属性 */\n  propsConfirm?: Partial<ButtonProps>;\n  /** 取消按钮的部件属性 */\n  propsCancel?: Partial<ButtonProps>;\n}\n\n/** Dialog 的样式：panel、header、title、message、footer、action */\nexport const dialogStyles = css.create({\n  panel: { width: '20em', maxWidth: '85vw', overflow: 'hidden' },\n  header: { paddingBlockStart: '1.6em', paddingInline: '1.5em', textAlign: 'center' },\n  title: { fontSize: '_lg', fontWeight: '_semibold', lineHeight: '_tight', color: '_text' },\n  message: {\n    paddingInline: '1.5em',\n    paddingBlock: '0.75em 1.6em',\n    fontSize: '_md',\n    lineHeight: '1.6',\n    color: '_textMuted',\n    textAlign: 'center',\n    whiteSpace: 'pre-wrap',\n    overflowWrap: 'anywhere',\n  },\n  // 只有标题时，标题下面也留出同样的空\n  titleOnly: { paddingBlockEnd: '1.6em' },\n  footer: {\n    display: 'flex',\n    borderBlockStartWidth: '_hairline',\n    borderBlockStartStyle: 'solid',\n    borderBlockStartColor: '_border',\n  },\n  action: {\n    flex: '1 1 0',\n    minHeight: '3.2em',\n    borderRadius: '_none',\n    borderInlineStartWidth: { default: '_hairline', ':first-child': 0 },\n    borderInlineStartColor: '_border',\n    fontSize: '_lg',\n  },\n});\n\n/** 对话框（弹出层 > 标题 + 说明 + 按钮） */\nexport const Dialog = _component(\n  ({\n    _open: open = _bindable(false),\n    title,\n    message,\n    confirmText,\n    cancelText,\n    showCancel = false,\n    confirmTone = 'accent',\n    closeOnOverlay = false,\n    onConfirm,\n    onCancel,\n    onOpenChange,\n    children,\n    footer,\n    propsPopup,\n    propsConfirm,\n    propsCancel,\n    ...rest\n  }: DialogProps) => {\n    const config = useConfig();\n    let confirming = _state(false);\n    const close = (reason: DialogCloseReason) => {\n      open = false;\n      onOpenChange?.(false, { reason });\n    };\n    const confirm = async () => {\n      const pending = onConfirm?.();\n      if (!(pending instanceof Promise)) return close('confirm');\n      confirming = true;\n      try {\n        await pending;\n        close('confirm');\n      } finally {\n        confirming = false;\n      }\n    };\n    const cancel = (reason: 'cancel' | 'overlay') => {\n      onCancel?.();\n      close(reason);\n    };\n    return () => {\n      const body = hasContent(message) ? message : children;\n      return (\n        <Popup\n          {...mergePartProps<PopupProps>(\n            {\n              _open: open,\n              position: 'center',\n              round: true,\n              closeOnOverlay,\n              sx: dialogStyles.panel,\n              onOpenChange: (next, { reason }) =>\n                !next && reason === 'overlay' && cancel('overlay'),\n            },\n            // 对话框上未声明的属性与弹出层的部件属性都落到面板上\n            mergeProps<PopupProps>(rest as Partial<PopupProps>, propsPopup) as Partial<PopupProps>,\n          )}\n        >\n          {hasContent(title) && (\n            <div\n              {...mergeAttrs<'div'>({\n                sx: [dialogStyles.header, !hasContent(body) && dialogStyles.titleOnly],\n              })}\n            >\n              <div {...mergeAttrs<'div'>({ sx: dialogStyles.title })}>{title}</div>\n            </div>\n          )}\n          {hasContent(body) && (\n            <div {...mergeAttrs<'div'>({ sx: dialogStyles.message })}>{body}</div>\n          )}\n          {hasContent(footer) ? (\n            footer\n          ) : (\n            <div {...mergeAttrs<'div'>({ sx: dialogStyles.footer })}>\n              {showCancel && (\n                <Button\n                  {...mergePartProps<ButtonProps>(\n                    {\n                      variant: 'ghost',\n                      tone: 'neutral',\n                      sx: dialogStyles.action,\n                      onClick: () => cancel('cancel'),\n                    },\n                    propsCancel,\n                  )}\n                >\n                  {cancelText ?? config.lang.cancel}\n                </Button>\n              )}\n              <Button\n                {...mergePartProps<ButtonProps>(\n                  {\n                    variant: 'ghost',\n                    tone: confirmTone,\n                    loading: confirming,\n                    sx: dialogStyles.action,\n                    onClick: () => void confirm(),\n                  },\n                  propsConfirm,\n                )}\n              >\n                {confirmText ?? config.lang.confirm}\n              </Button>\n            </div>\n          )}\n        </Popup>\n      );\n    };\n  },\n);\n\n/** 命令式对话框：排队显示，前一个关了才显示下一个 */\ninterface DialogRequest {\n  options: DialogOptions;\n  resolve: (confirmed: boolean) => void;\n}\n\n/** 命令式对话框的状态：ConfigProvider 里的出口按它渲染 */\nexport const dialogState = shallowReactive<{ open: boolean; queue: DialogRequest[] }>({\n  open: false,\n  queue: [],\n});\n\n/** 显示一个对话框；确认时结果为 true，取消（或点遮罩关闭）时为 false */\nexport function showDialog(options: DialogOptions): Promise<boolean> {\n  return new Promise((resolve) => {\n    dialogState.queue = [...dialogState.queue, { options, resolve }];\n    dialogState.open = true;\n  });\n}\n\n/** 带取消按钮的确认对话框 */\nexport const showConfirmDialog = (options: DialogOptions) =>\n  showDialog({ showCancel: true, ...options });\n\n/** 当前的命令式对话框关闭后：交出结果，过了离场动画再显示下一个 */\nexport function settleDialog(confirmed: boolean) {\n  const [current, ...rest] = dialogState.queue;\n  current?.resolve(confirmed);\n  dialogState.open = false;\n  setTimeout(() => {\n    dialogState.queue = rest;\n    if (rest.length) dialogState.open = true;\n  }, 300);\n}\n"],"mappings":"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"}

package/dist/feedback/FeedbackOutlet.d.ts

@@ -0,0 +1,2 @@
+/** 命令式反馈的出口：轻提示、对话框、顶部通知、隐私协议 */
+export declare const FeedbackOutlet: import("@zerodep-dev/vue-tsx-pro-tsx").TsxComponent<{}>;

package/dist/feedback/FeedbackOutlet.js

@@ -0,0 +1,31 @@
+import { PrivacyPrompt } from "../capability/PrivacyPrompt.js";
+import { Dialog, dialogState, settleDialog } from "./Dialog.js";
+import { Notify, notifyState } from "./Notify.js";
+import { Toast, toastState } from "./Toast.js";
+import { _component, mergeJsxProps } from "@zerodep-dev/vue-tsx-pro-tsx";
+import { createVNode } from "vue";
+//#region src/feedback/FeedbackOutlet.tsx
+/** 命令式反馈的出口：轻提示、对话框、顶部通知、隐私协议 */
+var FeedbackOutlet = /*#__PURE__*/ _component(() => () => {
+	const dialog = dialogState.queue[0];
+	return [
+		createVNode(Toast, mergeJsxProps(toastState.options, {
+			"_open": toastState.open,
+			"onUpdate:_open": ($event) => toastState.open = $event
+		}), null),
+		createVNode(Notify, mergeJsxProps(notifyState.options, {
+			"_open": notifyState.open,
+			"onUpdate:_open": ($event) => notifyState.open = $event
+		}), null),
+		dialog && createVNode(Dialog, mergeJsxProps(dialog.options, {
+			"_open": dialogState.open,
+			"onUpdate:_open": ($event) => dialogState.open = $event,
+			"onOpenChange": (_open, { reason }) => settleDialog(reason === "confirm")
+		}), null),
+		createVNode(PrivacyPrompt, null, null)
+	];
+}, { name: "FeedbackOutlet" });
+//#endregion
+export { FeedbackOutlet };
+
+//# sourceMappingURL=FeedbackOutlet.js.map

package/dist/feedback/FeedbackOutlet.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FeedbackOutlet.js","names":["_createVNode","_mergeProps"],"sources":["../../src/feedback/FeedbackOutlet.tsx"],"sourcesContent":["/**\n * 命令式反馈的出口：showToast、showDialog、showNotify 改的是模块里的状态，这里把它们渲染出来；\n * 平台要求同意隐私协议时的弹窗（PrivacyPrompt）也在这里。\n * ConfigProvider 自动渲染一个；小程序里每个页面都有自己的一个（页面栈里看不见的页面渲染了也看不到）。\n */\nimport { _component } from '@zerodep-dev/vue-tsx-pro-tsx';\nimport { PrivacyPrompt } from '../capability/PrivacyPrompt';\nimport { Dialog, dialogState, settleDialog } from './Dialog';\nimport { Notify, notifyState } from './Notify';\nimport { Toast, toastState } from './Toast';\n\n/** 命令式反馈的出口：轻提示、对话框、顶部通知、隐私协议 */\nexport const FeedbackOutlet = _component(() => () => {\n  const dialog = dialogState.queue[0];\n  return [\n    // 对象属性的 _open 双向绑定：到时间自动关闭时写回状态\n    <Toast {...toastState.options} _open={toastState.open} />,\n    <Notify {...notifyState.options} _open={notifyState.open} />,\n    dialog && (\n      <Dialog\n        {...dialog.options}\n        _open={dialogState.open}\n        onOpenChange={(_open, { reason }) => settleDialog(reason === 'confirm')}\n      />\n    ),\n    <PrivacyPrompt />,\n  ];\n});\n"],"mappings":";;;;;;;;AAYA,IAAa,iBAAiB,qCAAuB;CACnD,MAAM,SAAS,YAAY,MAAM;CACjC,OAAO;EACLA,YAAA,OAAAC,cACW,WAAW,SAAO;GAAA,SAAS,WAAW;GAAI,mBAAA,WAAf,WAAW,OAAI;EAAA,CAAA,GAAA,IAAA;EAAAD,YAAA,QAAAC,cACzC,YAAY,SAAO;GAAA,SAAS,YAAY;GAAI,mBAAA,WAAhB,YAAY,OAAI;EAAA,CAAA,GAAA,IAAA;EACxD,UAAMD,YAAA,QAAAC,cAEE,OAAO,SAAO;GAAA,SACX,YAAY;GAAI,mBAAA,WAAhB,YAAY,OAAI;GAAA,iBACR,OAAO,EAAE,aAAa,aAAa,WAAW,SAAS;EAAC,CAAA,GAAA,IAAA;EAE1ED,YAAA,eAAA,MAAA,IAAA;CAAA;AAGL,GAAC,EAAA,MAAA,iBAAA,CAAA"}

package/dist/feedback/Loading.d.ts

@@ -0,0 +1,26 @@
+import { css } from '@zerodep-dev/vue-tsx-pro-tsx/styles';
+import type { VNodeChild } from 'vue';
+import { type IconProps } from '../base/Icon';
+import { type PartProps } from '../utils/props';
+/** 未声明的属性落到外层的 span 上 */
+export interface LoadingProps extends PartProps<'span', 'role'> {
+    /** 图标大小（px）；不写时为 1em */
+    size?: number;
+    /** 文字放在图标下面（整块的加载状态） */
+    vertical?: boolean;
+    /** 说明文字；有文字时 role="status" */
+    children?: VNodeChild;
+    /** 旋转图标的部件属性 */
+    propsIcon?: Partial<IconProps>;
+    /** 文字的部件属性 */
+    propsText?: PartProps<'span'>;
+}
+/** Loading 的样式：root、vertical、icon、text */
+export declare const loadingStyles: Readonly<{
+    icon: css.CompiledStyles;
+    root: css.CompiledStyles;
+    text: css.CompiledStyles;
+    vertical: css.CompiledStyles;
+}>;
+/** 加载指示（span > 图标 + 文字） */
+export declare const Loading: import("@zerodep-dev/vue-tsx-pro-tsx").TsxComponent<LoadingProps>;

package/dist/feedback/Loading.js

@@ -0,0 +1,68 @@
+import { hasContent, mergeAttrs, mergePartProps } from "../utils/props.js";
+import { Icon } from "../base/Icon.js";
+import { css } from "@zerodep-dev/vue-tsx-pro-tsx/styles";
+import { _component, childrenProp, readonlyProp, restProps } from "@zerodep-dev/vue-tsx-pro-tsx";
+import { createVNode } from "vue";
+import { LoaderCircle } from "@lucide/icons";
+//#region src/feedback/Loading.tsx
+/**
+* 加载指示：旋转的圆弧，可带文字。大小随所在文字（1em），颜色随文字；表示"一个操作正在进行"。
+*
+*   <Loading />                         装饰性：旁边已经有说明
+*   <Loading>加载中…</Loading>          带文字：role="status"，读屏会念出
+*   <Loading vertical size={24}>…</Loading>
+*/
+/** 未声明的属性落到外层的 span 上 */
+var spin = css.keyframes({ to: { transform: "rotate(360deg)" } });
+/** Loading 的样式：root、vertical、icon、text */
+var loadingStyles = css.create({
+	root: {
+		display: "inline-flex",
+		alignItems: "center",
+		gap: "_sm",
+		verticalAlign: "middle"
+	},
+	vertical: {
+		flexDirection: "column",
+		gap: "_sm"
+	},
+	icon: {
+		animationName: spin,
+		animationDuration: {
+			default: "0.8s",
+			_reducedMotion: "1.6s"
+		},
+		animationTimingFunction: "linear",
+		animationIterationCount: "infinite"
+	},
+	text: { fontSize: "_sm" }
+});
+/** 加载指示（span > 图标 + 文字） */
+var Loading = /*#__PURE__*/ _component((_props, _ctx) => {
+	const size = readonlyProp(_props, "size");
+	const vertical = readonlyProp(_props, "vertical", false);
+	const children = childrenProp(_props);
+	const propsIcon = readonlyProp(_props, "propsIcon");
+	const propsText = readonlyProp(_props, "propsText");
+	const rest = restProps(_props, _ctx, false);
+	return () => {
+		const labelled = hasContent(children.value);
+		return createVNode("span", mergeAttrs({ sx: [loadingStyles.root, vertical.value && loadingStyles.vertical] }, rest, { role: labelled ? "status" : void 0 }), [createVNode(Icon, mergePartProps({
+			icon: LoaderCircle,
+			size: size.value,
+			sx: loadingStyles.icon
+		}, propsIcon.value), null), labelled && createVNode("span", mergeAttrs({ sx: loadingStyles.text }, propsText.value), [children.value])]);
+	};
+}, {
+	name: "Loading",
+	props: [
+		"size",
+		"vertical",
+		"propsIcon",
+		"propsText"
+	]
+});
+//#endregion
+export { Loading, loadingStyles };
+
+//# sourceMappingURL=Loading.js.map

package/dist/feedback/Loading.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Loading.js","names":["_vtp_readonlyProp","_vtp_childrenProp","_vtp_restProps","_createVNode"],"sources":["../../src/feedback/Loading.tsx"],"sourcesContent":["/**\n * 加载指示：旋转的圆弧，可带文字。大小随所在文字（1em），颜色随文字；表示\"一个操作正在进行\"。\n *\n *   <Loading />                         装饰性：旁边已经有说明\n *   <Loading>加载中…</Loading>          带文字：role=\"status\"，读屏会念出\n *   <Loading vertical size={24}>…</Loading>\n */\nimport { LoaderCircle } from '@lucide/icons';\nimport { _component } from '@zerodep-dev/vue-tsx-pro-tsx';\nimport { css } from '@zerodep-dev/vue-tsx-pro-tsx/styles';\nimport type { VNodeChild } from 'vue';\nimport { Icon, type IconProps } from '../base/Icon';\nimport { hasContent, mergeAttrs, mergePartProps, type PartProps } from '../utils/props';\n\n/** 未声明的属性落到外层的 span 上 */\nexport interface LoadingProps extends PartProps<'span', 'role'> {\n  /** 图标大小（px）；不写时为 1em */\n  size?: number;\n  /** 文字放在图标下面（整块的加载状态） */\n  vertical?: boolean;\n  /** 说明文字；有文字时 role=\"status\" */\n  children?: VNodeChild;\n  /** 旋转图标的部件属性 */\n  propsIcon?: Partial<IconProps>;\n  /** 文字的部件属性 */\n  propsText?: PartProps<'span'>;\n}\n\nconst spin = css.keyframes({ to: { transform: 'rotate(360deg)' } });\n\n/** Loading 的样式：root、vertical、icon、text */\nexport const loadingStyles = css.create({\n  root: {\n    display: 'inline-flex',\n    alignItems: 'center',\n    gap: '_sm',\n    // 颜色跟随所在文字：按钮里是按钮的字色，页面里由使用方的 sx 定\n    verticalAlign: 'middle',\n  },\n  vertical: { flexDirection: 'column', gap: '_sm' },\n  icon: {\n    animationName: spin,\n    // 旋转本身就是\"还在加载\"的信息，减少动态效果时转慢一些而不停\n    animationDuration: { default: '0.8s', _reducedMotion: '1.6s' },\n    animationTimingFunction: 'linear',\n    animationIterationCount: 'infinite',\n  },\n  text: { fontSize: '_sm' },\n});\n\n/** 加载指示（span > 图标 + 文字） */\nexport const Loading = _component(\n  ({ size, vertical = false, children, propsIcon, propsText, ...rest }: LoadingProps) =>\n    () => {\n      const labelled = hasContent(children);\n      return (\n        <span\n          {...mergeAttrs<'span'>(\n            { sx: [loadingStyles.root, vertical && loadingStyles.vertical] },\n            rest,\n            { role: labelled ? 'status' : undefined },\n          )}\n        >\n          <Icon\n            {...mergePartProps<IconProps>(\n              { icon: LoaderCircle, size, sx: loadingStyles.icon },\n              propsIcon,\n            )}\n          />\n          {labelled && (\n            <span {...mergeAttrs<'span'>({ sx: loadingStyles.text }, propsText)}>{children}</span>\n          )}\n        </span>\n      );\n    },\n);\n"],"mappings":";;;;;;;;;;;;;;;AA4BA,IAAM,OAAO,IAAI,UAAU,EAAE,IAAI,EAAE,WAAW,iBAAiB,EAAE,CAAC;;AAGlE,IAAa,gBAAgB,IAAI,OAAO;CACtC,MAAM;EACJ,SAAS;EACT,YAAY;EACZ,KAAK;EAEL,eAAe;CACjB;CACA,UAAU;EAAE,eAAe;EAAU,KAAK;CAAM;CAChD,MAAM;EACJ,eAAe;EAEf,mBAAmB;GAAE,SAAS;GAAQ,gBAAgB;EAAO;EAC7D,yBAAyB;EACzB,yBAAyB;CAC3B;CACA,MAAM,EAAE,UAAU,MAAM;AAC1B,CAAC;;AAGD,IAAa,UAAU,0BACrB,QAAA,SAAA;CAAA,MAAA,OAAAA,aAAA,QAAA,MAAA;CAAA,MAAA,WAAAA,aAAA,QAAA,YAAoB,KAAK;CAAA,MAAA,WAAAC,aAAA,MAAA;CAAA,MAAA,YAAAD,aAAA,QAAA,WAAA;CAAA,MAAA,YAAAA,aAAA,QAAA,WAAA;CAAA,MAAqC,OAAIE,UAAA,QAAA,MAAA,KAAA;CAAA,aAC1D;EACJ,MAAM,WAAW,WAAU,SAAA,KAAS;EACpC,OAAAC,YAAA,QAEQ,WACF,EAAE,IAAI,CAAC,cAAc,MAAM,SAAA,SAAY,cAAc,QAAQ,EAAE,GAC/D,MACA,EAAE,MAAM,WAAW,WAAW,KAAA,EAAU,CAC1C,GAAC,CAAAA,YAAA,MAGK,eACF;GAAE,MAAM;GAAc,MAAI,KAAA;GAAE,IAAI,cAAc;EAAK,GAAC,UAAA,KAEtD,GAAC,IAAA,GAEF,YAAQA,YAAA,QACG,WAAmB,EAAE,IAAI,cAAc,KAAK,GAAC,UAAA,KAAW,GAAC,CAAA,SAAA,KAAA,CAAA,CACpE,CAAA;CAGP;AAAC,GAAA;CAAA,MAAA;CAAA,OAAA;EAAA;EAAA;EAAA;EAAA;CAAA;AAAA,CACL"}

package/dist/feedback/Notify.d.ts

@@ -0,0 +1,48 @@
+import { css } from '@zerodep-dev/vue-tsx-pro-tsx/styles';
+import { type VNodeChild } from 'vue';
+import { type PartProps } from '../utils/props';
+/** 通知的选项（组件的 props 与 showNotify 的参数共用） */
+export interface NotifyOptions {
+    /** 文字 */
+    message?: VNodeChild;
+    /**
+     * 色调
+     * @default 'danger'
+     */
+    tone?: 'danger' | 'success' | 'warning' | 'accent';
+    /**
+     * 显示多久（ms）；0 表示不自动收起
+     * @default 3000
+     */
+    duration?: number;
+    /** 点了通知 */
+    onClick?: (event: Event) => void;
+    /** 收起之后 */
+    onClose?: () => void;
+}
+/** 未声明的属性落到通知栏（div）上 */
+export interface NotifyProps extends NotifyOptions, Omit<PartProps<'div', 'role'>, 'onClick'> {
+    /** 是否显示；双向绑定写 `_open={x}` */
+    _open?: boolean;
+    /** 文字（与 message 二选一） */
+    children?: VNodeChild;
+}
+/** Notify 的样式：root、各色调 */
+export declare const notifyStyles: Readonly<{
+    accent: css.CompiledStyles;
+    danger: css.CompiledStyles;
+    root: css.CompiledStyles;
+    success: css.CompiledStyles;
+    warning: css.CompiledStyles;
+}>;
+/** 顶部通知（div[role=alert]，渲染到浮层根） */
+export declare const Notify: import("@zerodep-dev/vue-tsx-pro-tsx").TsxComponent<NotifyProps>;
+/** 命令式通知的状态：ConfigProvider 里的出口按它渲染 */
+export declare const notifyState: import("vue").ShallowReactive<{
+    open: boolean;
+    options: NotifyOptions;
+}>;
+/** 显示一条顶部通知；同一时间只有一条 */
+export declare function showNotify(options: NotifyOptions | string): void;
+/** 收起当前的顶部通知 */
+export declare function closeNotify(): void;

package/dist/feedback/Notify.js

@@ -0,0 +1,116 @@
+import { useConfig } from "../config/context.js";
+import { dataAttrs, mergeAttrs } from "../utils/props.js";
+import { useHost } from "../utils/host.js";
+import { usePresence } from "../utils/presence.js";
+import { css } from "@zerodep-dev/vue-tsx-pro-tsx/styles";
+import { _component, bindable, childrenProp, readonlyProp, restProps } from "@zerodep-dev/vue-tsx-pro-tsx";
+import { Teleport, createVNode, onBeforeUnmount, shallowReactive, watch } from "vue";
+//#region src/feedback/Notify.tsx
+/** 通知的选项（组件的 props 与 showNotify 的参数共用） */
+/** 未声明的属性落到通知栏（div）上 */
+/** Notify 的样式：root、各色调 */
+var notifyStyles = css.create({
+	root: {
+		boxSizing: "border-box",
+		position: "fixed",
+		insetBlockStart: 0,
+		insetInline: 0,
+		zIndex: 3e3,
+		paddingBlock: "0.6em",
+		paddingInline: "_lg",
+		paddingBlockStart: `max(0.6em, env(safe-area-inset-top))`,
+		fontSize: "_md",
+		lineHeight: "1.5",
+		textAlign: "center",
+		overflowWrap: "anywhere",
+		transform: {
+			default: "translateY(-100%)",
+			"[data-state=\"open\"]": "none"
+		},
+		transitionProperty: "transform",
+		transitionDuration: "_md",
+		transitionTimingFunction: "_standard"
+	},
+	danger: {
+		color: "_dangerContrast",
+		backgroundColor: "_danger"
+	},
+	success: {
+		color: "_successContrast",
+		backgroundColor: "_success"
+	},
+	warning: {
+		color: "_warningContrast",
+		backgroundColor: "_warning"
+	},
+	accent: {
+		color: "_accentContrast",
+		backgroundColor: "_accent"
+	}
+});
+/** 顶部通知（div[role=alert]，渲染到浮层根） */
+var Notify = /*#__PURE__*/ _component((_props, _ctx) => {
+	const open = bindable(_props, "_open", () => false, _ctx.emit);
+	const message = readonlyProp(_props, "message");
+	const tone = readonlyProp(_props, "tone", "danger");
+	const duration = readonlyProp(_props, "duration", 3e3);
+	const onClick = readonlyProp(_props, "onClick");
+	const onClose = readonlyProp(_props, "onClose");
+	const children = childrenProp(_props);
+	const rest = restProps(_props, _ctx, false);
+	const host = useHost();
+	const config = useConfig();
+	const presence = usePresence(() => open.value, 240);
+	let timer;
+	watch(() => [
+		open.value,
+		message.value,
+		tone.value,
+		duration.value
+	], () => {
+		clearTimeout(timer);
+		if (open.value && duration.value > 0) timer = setTimeout(() => {
+			open.value = false;
+			onClose.value?.();
+		}, duration.value);
+	}, { immediate: true });
+	onBeforeUnmount(() => clearTimeout(timer));
+	return () => presence.mounted && createVNode(Teleport, { "to": host.overlayRoot() }, { default: () => [createVNode("div", mergeAttrs({ sx: [
+		config.rootSx,
+		notifyStyles.root,
+		notifyStyles[tone.value]
+	] }, rest, {
+		role: "alert",
+		onClick: onClick.value,
+		...dataAttrs({ "data-state": presence.visible ? "open" : "closed" })
+	}), [message.value ?? children.value])] });
+}, {
+	name: "Notify",
+	props: [
+		"_open",
+		"onUpdate:_open",
+		"message",
+		"tone",
+		"duration",
+		"onClick",
+		"onClose"
+	]
+});
+/** 命令式通知的状态：ConfigProvider 里的出口按它渲染 */
+var notifyState = shallowReactive({
+	open: false,
+	options: {}
+});
+/** 显示一条顶部通知；同一时间只有一条 */
+function showNotify(options) {
+	notifyState.options = typeof options === "string" ? { message: options } : options;
+	notifyState.open = true;
+}
+/** 收起当前的顶部通知 */
+function closeNotify() {
+	notifyState.open = false;
+}
+//#endregion
+export { Notify, closeNotify, notifyState, notifyStyles, showNotify };
+
+//# sourceMappingURL=Notify.js.map

package/dist/feedback/Notify.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Notify.js","names":["_vtp_bindable","_vtp_readonlyProp","_vtp_childrenProp","_vtp_restProps","_createVNode"],"sources":["../../src/feedback/Notify.tsx"],"sourcesContent":["/**\n * 顶部通知：从页面顶部滑下的一条通知栏，过一会儿自己收起。用来提示操作结果、网络状态这类不打断操作的消息。\n *\n *   showNotify('网络连接已断开');\n *   showNotify({ message: '已保存', tone: 'success' });\n *   <Notify _open={show} tone=\"warning\">余额不足</Notify>\n */\nimport { _component } from '@zerodep-dev/vue-tsx-pro-tsx';\nimport { css } from '@zerodep-dev/vue-tsx-pro-tsx/styles';\nimport { Teleport, onBeforeUnmount, shallowReactive, watch, type VNodeChild } from 'vue';\nimport { useConfig } from '../config/context';\nimport { useHost } from '../utils/host';\nimport { usePresence } from '../utils/presence';\nimport { dataAttrs, mergeAttrs, type PartProps } from '../utils/props';\n\n/** 通知的选项（组件的 props 与 showNotify 的参数共用） */\nexport interface NotifyOptions {\n  /** 文字 */\n  message?: VNodeChild;\n  /**\n   * 色调\n   * @default 'danger'\n   */\n  tone?: 'danger' | 'success' | 'warning' | 'accent';\n  /**\n   * 显示多久（ms）；0 表示不自动收起\n   * @default 3000\n   */\n  duration?: number;\n  /** 点了通知 */\n  onClick?: (event: Event) => void;\n  /** 收起之后 */\n  onClose?: () => void;\n}\n\n/** 未声明的属性落到通知栏（div）上 */\nexport interface NotifyProps extends NotifyOptions, Omit<PartProps<'div', 'role'>, 'onClick'> {\n  /** 是否显示；双向绑定写 `_open={x}` */\n  _open?: boolean;\n  /** 文字（与 message 二选一） */\n  children?: VNodeChild;\n}\n\n/** Notify 的样式：root、各色调 */\nexport const notifyStyles = css.create({\n  root: {\n    boxSizing: 'border-box',\n    position: 'fixed',\n    insetBlockStart: 0,\n    insetInline: 0,\n    zIndex: 3000,\n    paddingBlock: '0.6em',\n    paddingInline: '_lg',\n    // 刘海屏顶部的安全区\n    paddingBlockStart: `max(0.6em, env(safe-area-inset-top))`,\n    fontSize: '_md',\n    lineHeight: '1.5',\n    textAlign: 'center',\n    overflowWrap: 'anywhere',\n    transform: { default: 'translateY(-100%)', '[data-state=\"open\"]': 'none' },\n    transitionProperty: 'transform',\n    transitionDuration: '_md',\n    transitionTimingFunction: '_standard',\n  },\n  danger: { color: '_dangerContrast', backgroundColor: '_danger' },\n  success: { color: '_successContrast', backgroundColor: '_success' },\n  warning: { color: '_warningContrast', backgroundColor: '_warning' },\n  accent: { color: '_accentContrast', backgroundColor: '_accent' },\n});\n\n/** 顶部通知（div[role=alert]，渲染到浮层根） */\nexport const Notify = _component(\n  ({\n    _open: open = _bindable(false),\n    message,\n    tone = 'danger',\n    duration = 3000,\n    onClick,\n    onClose,\n    children,\n    ...rest\n  }: NotifyProps) => {\n    const host = useHost();\n    const config = useConfig();\n    const presence = usePresence(() => open, 240);\n    let timer: ReturnType<typeof setTimeout> | undefined;\n    watch(\n      () => [open, message, tone, duration],\n      () => {\n        clearTimeout(timer);\n        if (open && duration > 0)\n          timer = setTimeout(() => {\n            open = false;\n            onClose?.();\n          }, duration);\n      },\n      { immediate: true },\n    );\n    onBeforeUnmount(() => clearTimeout(timer));\n    return () =>\n      presence.mounted && (\n        <Teleport to={host.overlayRoot() as never}>\n          <div\n            {...mergeAttrs<'div'>(\n              { sx: [config.rootSx, notifyStyles.root, notifyStyles[tone]] },\n              rest,\n              {\n                role: 'alert',\n                onClick,\n                ...dataAttrs({ 'data-state': presence.visible ? 'open' : 'closed' }),\n              },\n            )}\n          >\n            {message ?? children}\n          </div>\n        </Teleport>\n      );\n  },\n);\n\n/** 命令式通知的状态：ConfigProvider 里的出口按它渲染 */\nexport const notifyState = shallowReactive<{ open: boolean; options: NotifyOptions }>({\n  open: false,\n  options: {},\n});\n\n/** 显示一条顶部通知；同一时间只有一条 */\nexport function showNotify(options: NotifyOptions | string) {\n  notifyState.options = typeof options === 'string' ? { message: options } : options;\n  notifyState.open = true;\n}\n\n/** 收起当前的顶部通知 */\nexport function closeNotify() {\n  notifyState.open = false;\n}\n"],"mappings":";;;;;;;;;;;AA4CA,IAAa,eAAe,IAAI,OAAO;CACrC,MAAM;EACJ,WAAW;EACX,UAAU;EACV,iBAAiB;EACjB,aAAa;EACb,QAAQ;EACR,cAAc;EACd,eAAe;EAEf,mBAAmB;EACnB,UAAU;EACV,YAAY;EACZ,WAAW;EACX,cAAc;EACd,WAAW;GAAE,SAAS;GAAqB,yBAAuB;EAAO;EACzE,oBAAoB;EACpB,oBAAoB;EACpB,0BAA0B;CAC5B;CACA,QAAQ;EAAE,OAAO;EAAmB,iBAAiB;CAAU;CAC/D,SAAS;EAAE,OAAO;EAAoB,iBAAiB;CAAW;CAClE,SAAS;EAAE,OAAO;EAAoB,iBAAiB;CAAW;CAClE,QAAQ;EAAE,OAAO;EAAmB,iBAAiB;CAAU;AACjE,CAAC;;AAGD,IAAa,SAAS,0BACpB,QAAA,SASmB;CAAA,MAAA,OAAAA,SAAA,QAAA,eARO,OAAK,KAAA,IAAA;CAAA,MAAA,UAAAC,aAAA,QAAA,SAAA;CAAA,MAAA,OAAAA,aAAA,QAAA,QAEtB,QAAQ;CAAA,MAAA,WAAAA,aAAA,QAAA,YACJ,GAAI;CAAA,MAAA,UAAAA,aAAA,QAAA,SAAA;CAAA,MAAA,UAAAA,aAAA,QAAA,SAAA;CAAA,MAAA,WAAAC,aAAA,MAAA;CAAA,MAIZ,OAAIC,UAAA,QAAA,MAAA,KAAA;CAEP,MAAM,OAAO,QAAQ;CACrB,MAAM,SAAS,UAAU;CACzB,MAAM,WAAW,kBAAY,KAAA,OAAY,GAAG;CAC5C,IAAI;CACJ,YACQ;EAAA,KAAA;EAAA,QAAA;EAAA,KAAA;EAAA,SAAA;CAAA,SACA;EACJ,aAAa,KAAK;EAClB,IAAI,KAAA,SAAQ,SAAA,QAAW,GACrB,QAAQ,iBAAiB;GACvB,KAAA,QAAO;GACP,QAAA,QAAU;EACZ,GAAC,SAAA,KAAU;CACf,GACA,EAAE,WAAW,KAAK,CACpB;CACA,sBAAsB,aAAa,KAAK,CAAC;CACzC,aACE,SAAS,WAAOC,YAAA,UAAA,EAAA,MACA,KAAK,YAAY,EAAC,GAAA,EAAA,eAAA,CAAAA,YAAA,OAExB,WACF,EAAE,IAAI;EAAC,OAAO;EAAQ,aAAa;EAAM,aAAY,KAAA;CAAM,EAAE,GAC7D,MACA;EACE,MAAM;EACN,SAAO,QAAA;EACP,GAAG,UAAU,EAAE,cAAc,SAAS,UAAU,SAAS,SAAS,CAAC;CACrE,CACF,GAAC,CAEA,QAAA,SAAA,SAAA,KAAmB,CAAA,CAAA,EAAA,CAAA;AAI9B,GAAC;CAAA,MAAA;CAAA,OAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;CAAA;AAAA,CACH;;AAGA,IAAa,cAAc,gBAA2D;CACpF,MAAM;CACN,SAAS,CAAC;AACZ,CAAC;;AAGD,SAAgB,WAAW,SAAiC;CAC1D,YAAY,UAAU,OAAO,YAAY,WAAW,EAAE,SAAS,QAAQ,IAAI;CAC3E,YAAY,OAAO;AACrB;;AAGA,SAAgB,cAAc;CAC5B,YAAY,OAAO;AACrB"}

package/dist/feedback/PullRefresh.d.ts

@@ -0,0 +1,58 @@
+import { css } from '@zerodep-dev/vue-tsx-pro-tsx/styles';
+import { type VNodeChild } from 'vue';
+import { type PartProps } from '../utils/props';
+/** 下拉的阶段 */
+export interface PullRefreshStatuses {
+    /** 没在拉 */
+    normal: unknown;
+    /** 拉了但还不够，松手会弹回 */
+    pulling: unknown;
+    /** 拉够了，松手就刷新 */
+    loosing: unknown;
+    /** 刷新中 */
+    loading: unknown;
+    /** 刷新完了，显示一会儿成功的提示 */
+    success: unknown;
+}
+/** 下拉的阶段 */
+export type PullRefreshStatus = keyof PullRefreshStatuses;
+/** 未声明的属性落到根元素（div）上 */
+export interface PullRefreshProps extends PartProps<'div'> {
+    /** 是否在刷新；双向绑定写 `_refreshing={x}` */
+    _refreshing?: boolean;
+    /** 松手刷新；返回 Promise 时完成后自动收起 */
+    onRefresh?: () => void | Promise<unknown>;
+    /** 不能下拉 */
+    disabled?: boolean;
+    /**
+     * 顶部提示区的高度（px），也是拉到多少算"拉够了"
+     * @default 50
+     */
+    headHeight?: number;
+    /** 各阶段的提示文字；不给时用语言包 */
+    pullingText?: VNodeChild;
+    loosingText?: VNodeChild;
+    loadingText?: VNodeChild;
+    /** 刷新完显示的文字；不给时直接收起 */
+    successText?: VNodeChild;
+    /**
+     * 成功提示显示多久（ms）
+     * @default 500
+     */
+    successDuration?: number;
+    /** 自定义提示区的内容（代替各阶段的文字） */
+    head?: (status: PullRefreshStatus, distance: number) => VNodeChild;
+    /** 内容 */
+    children?: VNodeChild;
+    /** 提示区的部件属性 */
+    propsHead?: PartProps<'div'>;
+}
+/** PullRefresh 的样式：root、track、dragging、head */
+export declare const pullRefreshStyles: Readonly<{
+    dragging: css.CompiledStyles;
+    head: css.CompiledStyles;
+    root: css.CompiledStyles;
+    track: css.CompiledStyles;
+}>;
+/** 下拉刷新（div > 滑动层：提示区 + 内容） */
+export declare const PullRefresh: import("@zerodep-dev/vue-tsx-pro-tsx").TsxComponent<PullRefreshProps>;