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

package/dist/patterns/AuthLayout.d.ts

@@ -0,0 +1,28 @@
+import * as css from '@zerodep-dev/vue-tsx-pro-tsx/styles';
+import type { VNodeChild } from 'vue';
+import { type PartProps } from '../utils/props';
+/** 未声明的属性落到外层 div 上 */
+export interface AuthLayoutProps extends PartProps<'div'> {
+    /** 品牌区：宽屏在左半边，窄屏在顶部；不写时不分栏 */
+    hero?: VNodeChild;
+    /** 表单这一半结束边上角的工具（主题切换、语言切换） */
+    tools?: VNodeChild;
+    /** 品牌区（div）的部件属性 */
+    propsHero?: PartProps<'div'>;
+    /** 表单区（main）的部件属性 */
+    propsMain?: PartProps<'main'>;
+    /** 工具区（div）的部件属性 */
+    propsTools?: PartProps<'div'>;
+    /** 表单 */
+    children?: VNodeChild;
+}
+/** AuthLayout 的样式：root、split、hero、main、tools */
+export declare const authLayoutStyles: Readonly<{
+    hero: css.CompiledStyles;
+    main: css.CompiledStyles;
+    root: css.CompiledStyles;
+    split: css.CompiledStyles;
+    tools: css.CompiledStyles;
+}>;
+/** 认证页的整页版式：左边品牌区、右边表单；窄屏品牌区收成顶部一块 */
+export declare const AuthLayout: import("@zerodep-dev/vue-tsx-pro-tsx").TsxComponent<AuthLayoutProps>;

package/dist/patterns/AuthLayout.js

@@ -0,0 +1,77 @@
+import { breakpoints } from "../config/theme/tokens.js";
+import { hasContent, mergeAttrs } from "../utils/props.js";
+import { createVNode } from "vue";
+import { _component, childrenProp, readonlyProp, restProps } from "@zerodep-dev/vue-tsx-pro-tsx";
+import * as css from "@zerodep-dev/vue-tsx-pro-tsx/styles";
+//#region src/patterns/AuthLayout.tsx
+/** 未声明的属性落到外层 div 上 */
+/** AuthLayout 的样式：root、split、hero、main、tools */
+var authLayoutStyles = css.create({
+	root: {
+		display: "grid",
+		gridTemplateColumns: "minmax(0, 1fr)",
+		gridTemplateRows: "minmax(0, 1fr)",
+		minHeight: "100dvh",
+		backgroundColor: "_background",
+		color: "_text"
+	},
+	split: {
+		gridTemplateColumns: {
+			default: "minmax(0, 1fr)",
+			[breakpoints.lg]: "minmax(0, 1.15fr) minmax(0, 1fr)"
+		},
+		gridTemplateRows: {
+			default: "auto minmax(0, 1fr)",
+			[breakpoints.lg]: "minmax(0, 1fr)"
+		}
+	},
+	hero: { minHeight: {
+		default: "auto",
+		[breakpoints.lg]: "100dvh"
+	} },
+	main: {
+		position: "relative",
+		display: "flex",
+		alignItems: {
+			default: "flex-start",
+			[breakpoints.lg]: "center"
+		},
+		justifyContent: "center",
+		boxSizing: "border-box",
+		padding: "_lg",
+		paddingTop: {
+			default: "_xl",
+			[breakpoints.lg]: "_lg"
+		}
+	},
+	tools: {
+		position: "absolute",
+		top: "_md",
+		insetInlineEnd: "_md",
+		zIndex: 1
+	}
+});
+/** 认证页的整页版式：左边品牌区、右边表单；窄屏品牌区收成顶部一块 */
+var AuthLayout = /*#__PURE__*/ _component((_props, _ctx) => {
+	const hero = readonlyProp(_props, "hero");
+	const tools = readonlyProp(_props, "tools");
+	const propsHero = readonlyProp(_props, "propsHero");
+	const propsMain = readonlyProp(_props, "propsMain");
+	const propsTools = readonlyProp(_props, "propsTools");
+	const children = childrenProp(_props);
+	const rest = restProps(_props, _ctx, false);
+	return () => createVNode("div", mergeAttrs({ sx: [authLayoutStyles.root, hasContent(hero.value) && authLayoutStyles.split] }, rest), [hasContent(hero.value) && createVNode("div", mergeAttrs({ sx: authLayoutStyles.hero }, propsHero.value), [hero.value]), createVNode("main", mergeAttrs({ sx: authLayoutStyles.main }, propsMain.value), [hasContent(tools.value) && createVNode("div", mergeAttrs({ sx: authLayoutStyles.tools }, propsTools.value), [tools.value]), children.value])]);
+}, {
+	name: "AuthLayout",
+	props: [
+		"hero",
+		"tools",
+		"propsHero",
+		"propsMain",
+		"propsTools"
+	]
+});
+//#endregion
+export { AuthLayout, authLayoutStyles };
+
+//# sourceMappingURL=AuthLayout.js.map

package/dist/patterns/AuthLayout.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AuthLayout.js","names":["_vtp_readonlyProp","_vtp_childrenProp","_vtp_restProps","_createVNode"],"sources":["../../src/patterns/AuthLayout.tsx"],"sourcesContent":["/**\n * 登录、注册、找回密码这类认证页的整页版式：宽屏时左边是品牌区（hero）、右边是表单，窄屏时品牌区收成顶部一块、表单紧跟其后。\n *\n *   <AuthLayout hero={<LoginHero />} tools={<ThemeSwitcher preference={preference} />}>\n *     <Card>…登录表单…</Card>\n *   </AuthLayout>\n *\n * hero 是品牌区的内容（标志、口号、背景动画），铺满它那一半；不写 hero 时表单居中，不分栏。tools 放在表单这一半的结束边上角\n * （主题切换、语言切换）。表单区把 children 垂直居中（宽屏）或贴近顶部（窄屏，登录卡片不被品牌区挤到第二屏）。\n * 分栏的断点是 sizes.lg（64rem），与 AppShell 一致。\n *\n * 部件：Root（div）、Hero（div）、Main（main）、Tools（div）。\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 { breakpoints } from '../config/theme/tokens';\nimport { hasContent, mergeAttrs, type PartProps } from '../utils/props';\n\n/** 未声明的属性落到外层 div 上 */\nexport interface AuthLayoutProps extends PartProps<'div'> {\n  /** 品牌区：宽屏在左半边，窄屏在顶部；不写时不分栏 */\n  hero?: VNodeChild;\n  /** 表单这一半结束边上角的工具（主题切换、语言切换） */\n  tools?: VNodeChild;\n  /** 品牌区（div）的部件属性 */\n  propsHero?: PartProps<'div'>;\n  /** 表单区（main）的部件属性 */\n  propsMain?: PartProps<'main'>;\n  /** 工具区（div）的部件属性 */\n  propsTools?: PartProps<'div'>;\n  /** 表单 */\n  children?: VNodeChild;\n}\n\n/** AuthLayout 的样式：root、split、hero、main、tools */\nexport const authLayoutStyles = css.create({\n  root: {\n    display: 'grid',\n    gridTemplateColumns: 'minmax(0, 1fr)',\n    gridTemplateRows: 'minmax(0, 1fr)',\n    minHeight: '100dvh',\n    backgroundColor: '_background',\n    color: '_text',\n  },\n  // 有品牌区：窄屏上下两行（品牌区按内容高、表单占剩下的），宽屏左右两栏\n  split: {\n    gridTemplateColumns: {\n      default: 'minmax(0, 1fr)',\n      [breakpoints.lg]: 'minmax(0, 1.15fr) minmax(0, 1fr)',\n    },\n    gridTemplateRows: { default: 'auto minmax(0, 1fr)', [breakpoints.lg]: 'minmax(0, 1fr)' },\n  },\n  hero: { minHeight: { default: 'auto', [breakpoints.lg]: '100dvh' } },\n  main: {\n    position: 'relative',\n    display: 'flex',\n    alignItems: { default: 'flex-start', [breakpoints.lg]: 'center' },\n    justifyContent: 'center',\n    boxSizing: 'border-box',\n    padding: '_lg',\n    paddingTop: { default: '_xl', [breakpoints.lg]: '_lg' },\n  },\n  tools: { position: 'absolute', top: '_md', insetInlineEnd: '_md', zIndex: 1 },\n});\n\n/** 认证页的整页版式：左边品牌区、右边表单；窄屏品牌区收成顶部一块 */\nexport const AuthLayout = _component(\n  ({ hero, tools, propsHero, propsMain, propsTools, children, ...rest }: AuthLayoutProps) =>\n    () => (\n      <div\n        {...mergeAttrs<'div'>(\n          { sx: [authLayoutStyles.root, hasContent(hero) && authLayoutStyles.split] },\n          rest,\n        )}\n      >\n        {hasContent(hero) && (\n          <div {...mergeAttrs<'div'>({ sx: authLayoutStyles.hero }, propsHero)}>{hero}</div>\n        )}\n        <main {...mergeAttrs<'main'>({ sx: authLayoutStyles.main }, propsMain)}>\n          {hasContent(tools) && (\n            <div {...mergeAttrs<'div'>({ sx: authLayoutStyles.tools }, propsTools)}>{tools}</div>\n          )}\n          {children}\n        </main>\n      </div>\n    ),\n);\n"],"mappings":";;;;;;;;AAoCA,IAAa,mBAAmB,IAAI,OAAO;CACzC,MAAM;EACJ,SAAS;EACT,qBAAqB;EACrB,kBAAkB;EAClB,WAAW;EACX,iBAAiB;EACjB,OAAO;CACT;CAEA,OAAO;EACL,qBAAqB;GACnB,SAAS;IACR,YAAY,KAAK;EACpB;EACA,kBAAkB;GAAE,SAAS;IAAwB,YAAY,KAAK;EAAiB;CACzF;CACA,MAAM,EAAE,WAAW;EAAE,SAAS;GAAS,YAAY,KAAK;CAAS,EAAE;CACnE,MAAM;EACJ,UAAU;EACV,SAAS;EACT,YAAY;GAAE,SAAS;IAAe,YAAY,KAAK;EAAS;EAChE,gBAAgB;EAChB,WAAW;EACX,SAAS;EACT,YAAY;GAAE,SAAS;IAAQ,YAAY,KAAK;EAAM;CACxD;CACA,OAAO;EAAE,UAAU;EAAY,KAAK;EAAO,gBAAgB;EAAO,QAAQ;CAAE;AAC9E,CAAC;;AAGD,IAAa,aAAa,0BACxB,QAAA,SAAA;CAAA,MAAA,OAAAA,aAAA,QAAA,MAAA;CAAA,MAAA,QAAAA,aAAA,QAAA,OAAA;CAAA,MAAA,YAAAA,aAAA,QAAA,WAAA;CAAA,MAAA,YAAAA,aAAA,QAAA,WAAA;CAAA,MAAA,aAAAA,aAAA,QAAA,YAAA;CAAA,MAAA,WAAAC,aAAA,MAAA;CAAA,MAA+D,OAAIC,UAAA,QAAA,MAAA,KAAA;CAAA,aACjEC,YAAA,OAEQ,WACF,EAAE,IAAI,CAAC,iBAAiB,MAAM,WAAU,KAAA,KAAK,KAAK,iBAAiB,KAAK,EAAE,GAC1E,IACF,GAAC,CAEA,WAAU,KAAA,KAAK,KAACA,YAAA,OACN,WAAkB,EAAE,IAAI,iBAAiB,KAAK,GAAC,UAAA,KAAW,GAAC,CAAA,KAAA,KAAA,CAAA,GACrEA,YAAA,QACS,WAAmB,EAAE,IAAI,iBAAiB,KAAK,GAAC,UAAA,KAAW,GAAC,CACnE,WAAU,MAAA,KAAM,KAACA,YAAA,OACP,WAAkB,EAAE,IAAI,iBAAiB,MAAM,GAAC,WAAA,KAAY,GAAC,CAAA,MAAA,KAAA,CAAA,GACvE,SAAA,KAAA,CAAA,CAAA,CAAA;AAIN,GAAA;CAAA,MAAA;CAAA,OAAA;EAAA;EAAA;EAAA;EAAA;EAAA;CAAA;AAAA,CACL"}

package/dist/patterns/CommentThread.js

@@ -9,8 +9,8 @@ import { MentionText, Mentions } from "../input/Mentions.js";
 import { Upload as Upload$1 } from "../input/Upload.js";
 import { useMessages } from "../config/lang/messages.js";
 import { patternsMessages } from "./messages.js";
-import { Fragment, createVNode, mergeProps, onMounted, ref, shallowRef } from "vue";
-import { _component, readonlyProp, restProps, untrack } from "@zerodep-dev/vue-tsx-pro-tsx";
+import { Fragment, createVNode, onMounted, ref, shallowRef } from "vue";
+import { _component, mergeJsxProps, readonlyProp, restProps, untrack } from "@zerodep-dev/vue-tsx-pro-tsx";
 import * as css from "@zerodep-dev/vue-tsx-pro-tsx/styles";
 import { Paperclip } from "@lucide/icons";
 //#region src/patterns/CommentThread.tsx
@@ -204,7 +204,7 @@ var CommentComposer = /*#__PURE__*/ _component((_props, _ctx) => {
 		} else if (event.key === "Escape" && onCancel.value && !event.defaultPrevented) onCancel.value();
 	}
 	return () => createVNode("div", mergeAttrs({ sx: [commentStyles.composer, !author.value && commentStyles.composerNoAvatar] }, rest, { ref: root }), [author.value && authorAvatar(author.value.name, author.value.avatar), createVNode("div", css.attrs(commentStyles.composerMain), [
-		createVNode(Mentions, mergeProps(mergePartProps({
+		createVNode(Mentions, mergeJsxProps(mergePartProps({
 			rows: 2,
 			maxRows: 10,
 			placeholder: placeholder.value ?? messages.commentPlaceholder,
@@ -224,7 +224,7 @@ var CommentComposer = /*#__PURE__*/ _component((_props, _ctx) => {
 			"upload": upload.value,
 			"multiple": true
 		}, null),
-		failed.value && createVNode("div", mergeProps({ "role": "alert" }, css.attrs(commentStyles.error)), [messages.commentSendFailed]),
+		failed.value && createVNode("div", mergeJsxProps({ "role": "alert" }, css.attrs(commentStyles.error)), [messages.commentSendFailed]),
 		createVNode("div", css.attrs(commentStyles.composerFooter), [createVNode("div", css.attrs(commentStyles.composerTools), [upload.value && createVNode(Button, {
 			"variant": "ghost",
 			"tone": "neutral",
@@ -291,11 +291,11 @@ var CommentThread = /*#__PURE__*/ _component((_props2, _ctx2) => {
 	const item = (comment, thread) => {
 		const own = typeof propsItem.value === "function" ? propsItem.value(comment) : propsItem.value;
 		const top = comment === thread;
-		return createVNode("li", mergeProps({ "key": comment.id }, mergeAttrs({ sx: commentStyles.item }, own)), [authorAvatar(comment.author, comment.avatar), createVNode("article", mergeProps(css.attrs(commentStyles.body), { "aria-label": comment.author }), [
+		return createVNode("li", mergeJsxProps({ "key": comment.id }, mergeAttrs({ sx: commentStyles.item }, own)), [authorAvatar(comment.author, comment.avatar), createVNode("article", mergeJsxProps(css.attrs(commentStyles.body), { "aria-label": comment.author }), [
 			createVNode("div", css.attrs(commentStyles.header), [
 				createVNode("span", css.attrs(commentStyles.author), [comment.author]),
 				comment.role,
-				createVNode("time", mergeProps({
+				createVNode("time", mergeJsxProps({
 					"datetime": comment.time,
 					"title": format.date(comment.time, {
 						dateStyle: "medium",
@@ -309,7 +309,7 @@ var CommentThread = /*#__PURE__*/ _component((_props2, _ctx2) => {
 				"options": people.value,
 				"sx": commentStyles.content
 			}, null),
-			comment.attachments && comment.attachments.length > 0 && createVNode("ul", mergeProps(css.attrs(commentStyles.attachments), { "aria-label": messages.commentAttachments }), [comment.attachments.map((file) => createVNode("li", mergeProps({ "key": file.name }, css.attrs(commentStyles.attachment)), [
+			comment.attachments && comment.attachments.length > 0 && createVNode("ul", mergeJsxProps(css.attrs(commentStyles.attachments), { "aria-label": messages.commentAttachments }), [comment.attachments.map((file) => createVNode("li", mergeJsxProps({ "key": file.name }, css.attrs(commentStyles.attachment)), [
 				createVNode(Icon, { "icon": Paperclip }, null),
 				file.url ? createVNode(Link, { "href": file.url }, { default: () => [file.name] }) : file.name,
 				file.size != null && createVNode("span", css.attrs(commentStyles.meta), [format.fileSize(file.size)])
@@ -335,7 +335,7 @@ var CommentThread = /*#__PURE__*/ _component((_props2, _ctx2) => {
 		const list = thread.replies ?? [];
 		const open = replying.value?.thread === thread.id;
 		if (list.length === 0 && !open) return null;
-		return createVNode(Fragment, null, [list.length > 0 && createVNode("ul", mergeProps(css.attrs(commentStyles.replies), { "aria-label": messages.commentReplies(list.length) }), [list.map((reply) => item(reply, thread))]), open && onSend.value && createVNode(CommentComposer, mergeProps(mergePartProps({
+		return createVNode(Fragment, null, [list.length > 0 && createVNode("ul", mergeJsxProps(css.attrs(commentStyles.replies), { "aria-label": messages.commentReplies(list.length) }), [list.map((reply) => item(reply, thread))]), open && onSend.value && createVNode(CommentComposer, mergeJsxProps(mergePartProps({
 			people: people.value,
 			upload: upload.value,
 			author: currentUser.value
@@ -359,7 +359,7 @@ var CommentThread = /*#__PURE__*/ _component((_props2, _ctx2) => {
 	return () => createVNode("div", mergeAttrs({ sx: commentStyles.root }, rest), [comments.value.length === 0 ? hasContent(empty.value) ? empty.value : createVNode(Empty, {
 		"size": "sm",
 		"title": messages.commentsEmpty
-	}, null) : createVNode("ul", mergeProps(mergeAttrs({ sx: commentStyles.list }, propsList.value), { "aria-label": messages.comments }), [comments.value.map((comment) => item(comment, comment))]), onSend.value && createVNode(CommentComposer, mergeProps(mergePartProps({
+	}, null) : createVNode("ul", mergeJsxProps(mergeAttrs({ sx: commentStyles.list }, propsList.value), { "aria-label": messages.comments }), [comments.value.map((comment) => item(comment, comment))]), onSend.value && createVNode(CommentComposer, mergeJsxProps(mergePartProps({
 		people: people.value,
 		upload: upload.value,
 		author: currentUser.value

package/dist/patterns/CommentThread.js.map

@@ -1 +1 @@
-{"version":3,"file":"CommentThread.js","names":["_createVNode","_vtp_readonlyProp","_vtp_restProps","_vue_ref","_vtp_untrack","_vue_shallowRef","_mergeProps","Upload","_Fragment"],"sources":["../../src/patterns/CommentThread.tsx"],"sourcesContent":["/**\n * 留言：一串留言与回复（沟通记录、协商的逐条回应、审批时的讨论），下面是写留言的输入框。\n * 留言里可以 @ 人（Mentions）、带附件（Upload），回复只分一层：回复一条回复时仍挂在那串下面，开头写上“@作者 ”。\n *\n *   <CommentThread\n *     comments={comments}                                  // { id, author, avatar?, role?, content, time, attachments?, replies? }\n *     people={people}                                      // 可以 @ 的人（ListboxOption），留言里“@名字”按它高亮\n *     upload={(file, context) => api.upload(file, context)} // 不给时不能带附件\n *     onSend={async (draft) => await api.comment(draft)} // { content, mentions, attachments, replyTo? }；不给时只读\n *   />\n *\n * 发送：按钮或 Ctrl + Enter；onSend 返回 Promise 时按钮转圈，成功后清空，失败时保留内容并提示。\n * 留言存在哪、发出去以后怎样出现在 comments 里由应用决定（乐观更新或重新取）。\n * 时间写成相对现在（3 分钟前），悬停看完整时间。actions 给每条留言加操作（编辑、删除、标为已解决）。\n *\n * 单独的输入框用 CommentComposer（协商回复、审批意见）。\n * 部件：Root（div）、List（ul）、Item（li，可以按条计算）、Composer（CommentComposer）。\n */\nimport { Paperclip } from '@lucide/icons';\nimport { _component } from '@zerodep-dev/vue-tsx-pro-tsx';\nimport * as css from '@zerodep-dev/vue-tsx-pro-tsx/styles';\nimport { onMounted, type VNodeChild } from 'vue';\nimport { Button } from '../base/Button';\nimport { Icon } from '../base/Icon';\nimport { Link } from '../base/Link';\nimport { useFormat } from '../config/lang/format';\nimport { useMessages } from '../config/lang/messages';\nimport { Avatar, initials } from '../display/Avatar';\nimport { Empty } from '../feedback/Empty';\nimport { Mentions, MentionText, type MentionsProps } from '../input/Mentions';\nimport type { ListboxOption } from '../input/list-state';\nimport { Upload, type UploadFile, type UploadHandler } from '../input/Upload';\nimport { hasContent, mergeAttrs, mergePartProps, type PartProps } from '../utils/props';\nimport { patternsMessages } from './messages';\n\n/** 留言的一个附件 */\nexport interface CommentAttachment {\n  /** 文件名 */\n  name: string;\n  /** 地址：文件名链到它（预览、下载） */\n  url?: string;\n  /** 大小（字节） */\n  size?: number;\n}\n\n/** 一条留言 */\nexport interface CommentItem {\n  /** 标识 */\n  id: string;\n  /** 作者 */\n  author: string;\n  /** 作者的头像地址；没有时显示首字母 */\n  avatar?: string;\n  /** 作者的身份（岗位、“供应商”标记），在名字后面 */\n  role?: VNodeChild;\n  /** 内容：文字，“@名字”按 people 高亮 */\n  content: string;\n  /** 发表的时间（ISO） */\n  time: string;\n  /** 改过 */\n  edited?: boolean;\n  /** 附件 */\n  attachments?: readonly CommentAttachment[];\n  /** 内容下面的补充（逐条回应的“采纳 / 不采纳”、引用的字段对比） */\n  extra?: VNodeChild;\n  /** 回复（只分一层，回复里的 replies 不显示） */\n  replies?: readonly CommentItem[];\n}\n\n/** 写好的一条留言：onSend 收到它 */\nexport interface CommentDraft {\n  /** 内容（去掉首尾空白） */\n  content: string;\n  /** 内容里 @ 到的人（people 的 value） */\n  mentions: string[];\n  /** 上传完成的附件 */\n  attachments: UploadFile[];\n  /** 回复哪一串（那一串第一条留言的 id）；新的一串没有 */\n  replyTo?: string;\n}\n\n/** 写留言的人：输入框前面的头像 */\nexport interface CommentAuthor {\n  /** 名字 */\n  name: string;\n  /** 头像地址 */\n  avatar?: string;\n}\n\n/** 未声明的属性落到外层 div 上 */\nexport interface CommentComposerProps extends PartProps<'div'> {\n  /** 发送：返回 Promise 时等它完成，成功后清空；失败（reject）时保留内容并提示 */\n  onSend: (draft: Omit<CommentDraft, 'replyTo'>) => unknown;\n  /** 取消（回复时）：有它时显示取消按钮，按 Esc 也是取消 */\n  onCancel?: () => void;\n  /** 可以 @ 的人 */\n  people?: readonly ListboxOption[];\n  /** 上传附件；不给时不能带附件 */\n  upload?: UploadHandler;\n  /** 写留言的人：输入框前面的头像 */\n  author?: CommentAuthor;\n  /** 一开始的内容（回复时的“@作者 ”） */\n  initialText?: string;\n  /** 挂载后聚焦输入框（点了回复） */\n  autofocus?: boolean;\n  /** 输入框的提示，默认取文案 */\n  placeholder?: string;\n  /** 输入框（Mentions）的部件属性；它的 aria-label 是输入框的名称 */\n  propsMentions?: Partial<MentionsProps>;\n}\n\n/** CommentThread、CommentComposer 的样式 */\nexport const commentStyles = css.create({\n  root: { display: 'grid', gap: '_lg' },\n  list: { display: 'grid', gap: '_lg', margin: 0, padding: 0, listStyle: 'none' },\n  // 头像一列、内容一列\n  item: { display: 'grid', gridTemplateColumns: 'auto 1fr', columnGap: '_sm', alignItems: 'start' },\n  body: { display: 'grid', gap: '_xs', minWidth: 0 },\n  header: {\n    display: 'flex',\n    flexWrap: 'wrap',\n    alignItems: 'center',\n    columnGap: '_sm',\n    rowGap: '_xs',\n  },\n  author: { fontWeight: '_semibold', color: '_text' },\n  meta: { fontSize: '_sm', color: '_textMuted' },\n  content: { color: '_text' },\n  attachments: {\n    display: 'flex',\n    flexWrap: 'wrap',\n    columnGap: '_md',\n    rowGap: '_xs',\n    margin: 0,\n    padding: 0,\n    listStyle: 'none',\n    fontSize: '_sm',\n  },\n  attachment: { display: 'inline-flex', alignItems: 'center', gap: '0.25em' },\n  actions: { display: 'flex', flexWrap: 'wrap', alignItems: 'center', gap: '_sm', fontSize: '_sm' },\n  // 回复：缩进在内容列里，左边一条竖线\n  replies: {\n    display: 'grid',\n    gap: '_md',\n    margin: 0,\n    marginBlockStart: '_xs',\n    paddingInlineStart: '_md',\n    listStyle: 'none',\n    borderInlineStartWidth: '_sm',\n    borderInlineStartStyle: 'solid',\n    borderInlineStartColor: '_borderMuted',\n  },\n  composer: {\n    display: 'grid',\n    gridTemplateColumns: 'auto 1fr',\n    columnGap: '_sm',\n    alignItems: 'start',\n  },\n  composerNoAvatar: { gridTemplateColumns: '1fr' },\n  composerMain: { display: 'grid', gap: '_xs', minWidth: 0 },\n  composerFooter: {\n    display: 'flex',\n    flexWrap: 'wrap',\n    alignItems: 'center',\n    justifyContent: 'space-between',\n    gap: '_xs',\n  },\n  composerTools: { display: 'flex', alignItems: 'center', gap: '_sm' },\n  hint: { fontSize: '_xs', color: '_textMuted' },\n  error: { fontSize: '_sm', color: '_dangerText' },\n});\n\n/** 头像：有图片用图片，没有时是名字的首字母（名字就在旁边，头像只是装饰） */\nconst authorAvatar = (name: string, avatar: string | undefined) => (\n  <Avatar src={avatar} fallback={initials(name)} size=\"sm\" />\n);\n\n/** 写留言的输入框：提及、附件、发送 */\nexport const CommentComposer = _component(\n  ({\n    onSend,\n    onCancel,\n    people = [],\n    upload,\n    author,\n    initialText = '',\n    autofocus = false,\n    placeholder,\n    propsMentions,\n    ...rest\n  }: CommentComposerProps) => {\n    const messages = useMessages('patterns', patternsMessages);\n    // 只取一开始的值：回复时的“@作者 ”，之后由用户编辑\n    let text = _state(_untrack(initialText));\n    let mentions = _state<string[]>([]);\n    let files = _state<UploadFile[]>([]);\n    let attaching = _state(false);\n    let sending = _state(false);\n    let failed = _state(false);\n    let root = _state.raw<HTMLElement | null>(null);\n\n    onMounted(() => {\n      if (!autofocus) return;\n      const input = root?.querySelector('textarea');\n      input?.focus();\n      input?.setSelectionRange(input.value.length, input.value.length);\n    });\n\n    // 还在上传的附件：等它完成才能发送\n    const uploading = () =>\n      files.some((file) => file.status === 'uploading' || file.status === 'selected');\n    const sendable = () => text.trim() !== '' && !uploading() && !sending;\n\n    async function send() {\n      if (!sendable()) return;\n      sending = true;\n      failed = false;\n      try {\n        await onSend({\n          content: text.trim(),\n          mentions,\n          attachments: files.filter((file) => file.status === 'done'),\n        });\n        text = '';\n        files = [];\n        attaching = false;\n      } catch {\n        failed = true;\n      } finally {\n        sending = false;\n      }\n    }\n\n    function onKeydown(event: KeyboardEvent) {\n      if (event.key === 'Enter' && (event.ctrlKey || event.metaKey)) {\n        event.preventDefault();\n        void send();\n      } else if (event.key === 'Escape' && onCancel && !event.defaultPrevented) {\n        // 提及列表打开时 Esc 先关列表（它会 preventDefault）\n        onCancel();\n      }\n    }\n\n    return () => (\n      <div\n        {...mergeAttrs<'div'>(\n          { sx: [commentStyles.composer, !author && commentStyles.composerNoAvatar] },\n          rest,\n          { ref: _toRef(root) },\n        )}\n      >\n        {author && authorAvatar(author.name, author.avatar)}\n        <div {...css.attrs(commentStyles.composerMain)}>\n          <Mentions\n            {...mergePartProps<MentionsProps>(\n              {\n                rows: 2,\n                maxRows: 10,\n                placeholder: placeholder ?? messages.commentPlaceholder,\n                'aria-label': messages.comments,\n              },\n              propsMentions,\n              { items: people, onKeydown },\n            )}\n            _value={text}\n            _mentions={mentions}\n          />\n          {upload && attaching && <Upload _value={files} upload={upload} multiple />}\n          {failed && (\n            <div role=\"alert\" {...css.attrs(commentStyles.error)}>\n              {messages.commentSendFailed}\n            </div>\n          )}\n          <div {...css.attrs(commentStyles.composerFooter)}>\n            <div {...css.attrs(commentStyles.composerTools)}>\n              {upload && (\n                <Button\n                  variant=\"ghost\"\n                  tone=\"neutral\"\n                  size=\"sm\"\n                  icon={Paperclip}\n                  aria-pressed={attaching}\n                  onClick={() => (attaching = !attaching)}\n                >\n                  {files.length > 0\n                    ? `${messages.commentAttach} ${files.length}`\n                    : messages.commentAttach}\n                </Button>\n              )}\n              <span {...css.attrs(commentStyles.hint)}>{messages.commentSendHint}</span>\n            </div>\n            <div {...css.attrs(commentStyles.composerTools)}>\n              {onCancel && (\n                <Button variant=\"ghost\" tone=\"neutral\" size=\"sm\" onClick={onCancel}>\n                  {messages.commentCancel}\n                </Button>\n              )}\n              <Button\n                size=\"sm\"\n                loading={sending}\n                disabled={!sendable()}\n                onClick={() => void send()}\n              >\n                {messages.commentSend}\n              </Button>\n            </div>\n          </div>\n        </div>\n      </div>\n    );\n  },\n);\n\n/** 未声明的属性落到外层 div 上 */\nexport interface CommentThreadProps extends PartProps<'div'> {\n  /** 留言，旧的在前；回复在各自的 replies 里 */\n  comments: readonly CommentItem[];\n  /** 可以 @ 的人：输入框的候选，也是留言里“@名字”高亮的依据 */\n  people?: readonly ListboxOption[];\n  /** 发送一条留言或回复；不给时只读（没有输入框与回复按钮） */\n  onSend?: (draft: CommentDraft) => unknown;\n  /** 上传附件；不给时不能带附件 */\n  upload?: UploadHandler;\n  /** 当前用户：输入框前面的头像 */\n  currentUser?: CommentAuthor;\n  /** 每条留言的操作（编辑、删除、标为已解决），在回复按钮后面 */\n  actions?: (comment: CommentItem) => VNodeChild;\n  /** 没有留言时显示的内容，默认取文案 */\n  empty?: VNodeChild;\n  /** “现在”的时间戳：相对时间按它算，默认是当前时间（文档与测试里固定它） */\n  now?: number;\n  /** 列表（ul）的部件属性 */\n  propsList?: PartProps<'ul'>;\n  /** 每条留言（li）的部件属性，可以按条计算 */\n  propsItem?: PartProps<'li'> | ((comment: CommentItem) => PartProps<'li'>);\n  /** 输入框（CommentComposer）的部件属性 */\n  propsComposer?: Partial<Omit<CommentComposerProps, 'onSend'>>;\n}\n\n/** 一串留言与回复，下面是输入框 */\nexport const CommentThread = _component(\n  ({\n    comments,\n    people = [],\n    onSend,\n    upload,\n    currentUser,\n    actions,\n    empty,\n    now,\n    propsList,\n    propsItem,\n    propsComposer,\n    ...rest\n  }: CommentThreadProps) => {\n    const messages = useMessages('patterns', patternsMessages);\n    const format = useFormat();\n    // 正在回复：哪一串（第一条的 id）与回复谁\n    let replying = _state<{ thread: string; to: string } | null>(null);\n\n    const item = (comment: CommentItem, thread: CommentItem): VNodeChild => {\n      const own = typeof propsItem === 'function' ? propsItem(comment) : propsItem;\n      const top = comment === thread;\n      return (\n        <li key={comment.id} {...mergeAttrs<'li'>({ sx: commentStyles.item }, own)}>\n          {authorAvatar(comment.author, comment.avatar)}\n          <article {...css.attrs(commentStyles.body)} aria-label={comment.author}>\n            <div {...css.attrs(commentStyles.header)}>\n              <span {...css.attrs(commentStyles.author)}>{comment.author}</span>\n              {comment.role}\n              <time\n                datetime={comment.time}\n                title={format.date(comment.time, { dateStyle: 'medium', timeStyle: 'short' })}\n                {...css.attrs(commentStyles.meta)}\n              >\n                {format.relative(comment.time, { now })}\n              </time>\n              {comment.edited && (\n                <span {...css.attrs(commentStyles.meta)}>{messages.commentEdited}</span>\n              )}\n            </div>\n            <MentionText text={comment.content} options={people} sx={commentStyles.content} />\n            {comment.attachments && comment.attachments.length > 0 && (\n              <ul\n                {...css.attrs(commentStyles.attachments)}\n                aria-label={messages.commentAttachments}\n              >\n                {comment.attachments.map((file) => (\n                  <li key={file.name} {...css.attrs(commentStyles.attachment)}>\n                    <Icon icon={Paperclip} />\n                    {file.url ? <Link href={file.url}>{file.name}</Link> : file.name}\n                    {file.size != null && (\n                      <span {...css.attrs(commentStyles.meta)}>{format.fileSize(file.size)}</span>\n                    )}\n                  </li>\n                ))}\n              </ul>\n            )}\n            {comment.extra}\n            {(onSend || actions) && (\n              <div {...css.attrs(commentStyles.actions)}>\n                {onSend && (\n                  <Button\n                    variant=\"link\"\n                    tone=\"neutral\"\n                    size=\"sm\"\n                    onClick={() => (replying = { thread: thread.id, to: comment.author })}\n                  >\n                    {messages.commentReply}\n                  </Button>\n                )}\n                {actions?.(comment)}\n              </div>\n            )}\n            {top && replies(thread)}\n          </article>\n        </li>\n      );\n    };\n\n    /** 一串的回复与回复的输入框 */\n    const replies = (thread: CommentItem) => {\n      const list = thread.replies ?? [];\n      const open = replying?.thread === thread.id;\n      if (list.length === 0 && !open) return null;\n      return (\n        <>\n          {list.length > 0 && (\n            <ul\n              {...css.attrs(commentStyles.replies)}\n              aria-label={messages.commentReplies(list.length)}\n            >\n              {list.map((reply) => item(reply, thread))}\n            </ul>\n          )}\n          {open && onSend && (\n            <CommentComposer\n              {...mergePartProps<Partial<CommentComposerProps>>(\n                { people, upload, author: currentUser },\n                propsComposer,\n                {\n                  key: `${thread.id}:${replying!.to}`,\n                  initialText: `@${replying!.to} `,\n                  autofocus: true,\n                  propsMentions: {\n                    ...propsComposer?.propsMentions,\n                    'aria-label': messages.commentReplyTo(replying!.to),\n                  },\n                  onCancel: () => (replying = null),\n                },\n              )}\n              // onSend 有返回值（Promise），不经 mergePartProps：它会把 on 开头的属性当事件串起来\n              onSend={async (draft) => {\n                await onSend({ ...draft, replyTo: thread.id });\n                replying = null;\n              }}\n            />\n          )}\n        </>\n      );\n    };\n\n    return () => (\n      <div {...mergeAttrs<'div'>({ sx: commentStyles.root }, rest)}>\n        {comments.length === 0 ? (\n          hasContent(empty) ? (\n            empty\n          ) : (\n            <Empty size=\"sm\" title={messages.commentsEmpty} />\n          )\n        ) : (\n          <ul\n            {...mergeAttrs<'ul'>({ sx: commentStyles.list }, propsList)}\n            aria-label={messages.comments}\n          >\n            {comments.map((comment) => item(comment, comment))}\n          </ul>\n        )}\n        {onSend && (\n          <CommentComposer\n            {...mergePartProps<Partial<CommentComposerProps>>(\n              { people, upload, author: currentUser },\n              propsComposer,\n            )}\n            onSend={onSend}\n          />\n        )}\n      </div>\n    );\n  },\n);\n"],"mappings":"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"}
+{"version":3,"file":"CommentThread.js","names":["_createVNode","_vtp_readonlyProp","_vtp_restProps","_vue_ref","_vtp_untrack","_vue_shallowRef","_mergeProps","Upload","_Fragment"],"sources":["../../src/patterns/CommentThread.tsx"],"sourcesContent":["/**\n * 留言：一串留言与回复（沟通记录、协商的逐条回应、审批时的讨论），下面是写留言的输入框。\n * 留言里可以 @ 人（Mentions）、带附件（Upload），回复只分一层：回复一条回复时仍挂在那串下面，开头写上“@作者 ”。\n *\n *   <CommentThread\n *     comments={comments}                                  // { id, author, avatar?, role?, content, time, attachments?, replies? }\n *     people={people}                                      // 可以 @ 的人（ListboxOption），留言里“@名字”按它高亮\n *     upload={(file, context) => api.upload(file, context)} // 不给时不能带附件\n *     onSend={async (draft) => await api.comment(draft)} // { content, mentions, attachments, replyTo? }；不给时只读\n *   />\n *\n * 发送：按钮或 Ctrl + Enter；onSend 返回 Promise 时按钮转圈，成功后清空，失败时保留内容并提示。\n * 留言存在哪、发出去以后怎样出现在 comments 里由应用决定（乐观更新或重新取）。\n * 时间写成相对现在（3 分钟前），悬停看完整时间。actions 给每条留言加操作（编辑、删除、标为已解决）。\n *\n * 单独的输入框用 CommentComposer（协商回复、审批意见）。\n * 部件：Root（div）、List（ul）、Item（li，可以按条计算）、Composer（CommentComposer）。\n */\nimport { Paperclip } from '@lucide/icons';\nimport { _component } from '@zerodep-dev/vue-tsx-pro-tsx';\nimport * as css from '@zerodep-dev/vue-tsx-pro-tsx/styles';\nimport { onMounted, type VNodeChild } from 'vue';\nimport { Button } from '../base/Button';\nimport { Icon } from '../base/Icon';\nimport { Link } from '../base/Link';\nimport { useFormat } from '../config/lang/format';\nimport { useMessages } from '../config/lang/messages';\nimport { Avatar, initials } from '../display/Avatar';\nimport { Empty } from '../feedback/Empty';\nimport { Mentions, MentionText, type MentionsProps } from '../input/Mentions';\nimport type { ListboxOption } from '../input/list-state';\nimport { Upload, type UploadFile, type UploadHandler } from '../input/Upload';\nimport { hasContent, mergeAttrs, mergePartProps, type PartProps } from '../utils/props';\nimport { patternsMessages } from './messages';\n\n/** 留言的一个附件 */\nexport interface CommentAttachment {\n  /** 文件名 */\n  name: string;\n  /** 地址：文件名链到它（预览、下载） */\n  url?: string;\n  /** 大小（字节） */\n  size?: number;\n}\n\n/** 一条留言 */\nexport interface CommentItem {\n  /** 标识 */\n  id: string;\n  /** 作者 */\n  author: string;\n  /** 作者的头像地址；没有时显示首字母 */\n  avatar?: string;\n  /** 作者的身份（岗位、“供应商”标记），在名字后面 */\n  role?: VNodeChild;\n  /** 内容：文字，“@名字”按 people 高亮 */\n  content: string;\n  /** 发表的时间（ISO） */\n  time: string;\n  /** 改过 */\n  edited?: boolean;\n  /** 附件 */\n  attachments?: readonly CommentAttachment[];\n  /** 内容下面的补充（逐条回应的“采纳 / 不采纳”、引用的字段对比） */\n  extra?: VNodeChild;\n  /** 回复（只分一层，回复里的 replies 不显示） */\n  replies?: readonly CommentItem[];\n}\n\n/** 写好的一条留言：onSend 收到它 */\nexport interface CommentDraft {\n  /** 内容（去掉首尾空白） */\n  content: string;\n  /** 内容里 @ 到的人（people 的 value） */\n  mentions: string[];\n  /** 上传完成的附件 */\n  attachments: UploadFile[];\n  /** 回复哪一串（那一串第一条留言的 id）；新的一串没有 */\n  replyTo?: string;\n}\n\n/** 写留言的人：输入框前面的头像 */\nexport interface CommentAuthor {\n  /** 名字 */\n  name: string;\n  /** 头像地址 */\n  avatar?: string;\n}\n\n/** 未声明的属性落到外层 div 上 */\nexport interface CommentComposerProps extends PartProps<'div'> {\n  /** 发送：返回 Promise 时等它完成，成功后清空；失败（reject）时保留内容并提示 */\n  onSend: (draft: Omit<CommentDraft, 'replyTo'>) => unknown;\n  /** 取消（回复时）：有它时显示取消按钮，按 Esc 也是取消 */\n  onCancel?: () => void;\n  /** 可以 @ 的人 */\n  people?: readonly ListboxOption[];\n  /** 上传附件；不给时不能带附件 */\n  upload?: UploadHandler;\n  /** 写留言的人：输入框前面的头像 */\n  author?: CommentAuthor;\n  /** 一开始的内容（回复时的“@作者 ”） */\n  initialText?: string;\n  /** 挂载后聚焦输入框（点了回复） */\n  autofocus?: boolean;\n  /** 输入框的提示，默认取文案 */\n  placeholder?: string;\n  /** 输入框（Mentions）的部件属性；它的 aria-label 是输入框的名称 */\n  propsMentions?: Partial<MentionsProps>;\n}\n\n/** CommentThread、CommentComposer 的样式 */\nexport const commentStyles = css.create({\n  root: { display: 'grid', gap: '_lg' },\n  list: { display: 'grid', gap: '_lg', margin: 0, padding: 0, listStyle: 'none' },\n  // 头像一列、内容一列\n  item: { display: 'grid', gridTemplateColumns: 'auto 1fr', columnGap: '_sm', alignItems: 'start' },\n  body: { display: 'grid', gap: '_xs', minWidth: 0 },\n  header: {\n    display: 'flex',\n    flexWrap: 'wrap',\n    alignItems: 'center',\n    columnGap: '_sm',\n    rowGap: '_xs',\n  },\n  author: { fontWeight: '_semibold', color: '_text' },\n  meta: { fontSize: '_sm', color: '_textMuted' },\n  content: { color: '_text' },\n  attachments: {\n    display: 'flex',\n    flexWrap: 'wrap',\n    columnGap: '_md',\n    rowGap: '_xs',\n    margin: 0,\n    padding: 0,\n    listStyle: 'none',\n    fontSize: '_sm',\n  },\n  attachment: { display: 'inline-flex', alignItems: 'center', gap: '0.25em' },\n  actions: { display: 'flex', flexWrap: 'wrap', alignItems: 'center', gap: '_sm', fontSize: '_sm' },\n  // 回复：缩进在内容列里，左边一条竖线\n  replies: {\n    display: 'grid',\n    gap: '_md',\n    margin: 0,\n    marginBlockStart: '_xs',\n    paddingInlineStart: '_md',\n    listStyle: 'none',\n    borderInlineStartWidth: '_sm',\n    borderInlineStartStyle: 'solid',\n    borderInlineStartColor: '_borderMuted',\n  },\n  composer: {\n    display: 'grid',\n    gridTemplateColumns: 'auto 1fr',\n    columnGap: '_sm',\n    alignItems: 'start',\n  },\n  composerNoAvatar: { gridTemplateColumns: '1fr' },\n  composerMain: { display: 'grid', gap: '_xs', minWidth: 0 },\n  composerFooter: {\n    display: 'flex',\n    flexWrap: 'wrap',\n    alignItems: 'center',\n    justifyContent: 'space-between',\n    gap: '_xs',\n  },\n  composerTools: { display: 'flex', alignItems: 'center', gap: '_sm' },\n  hint: { fontSize: '_xs', color: '_textMuted' },\n  error: { fontSize: '_sm', color: '_dangerText' },\n});\n\n/** 头像：有图片用图片，没有时是名字的首字母（名字就在旁边，头像只是装饰） */\nconst authorAvatar = (name: string, avatar: string | undefined) => (\n  <Avatar src={avatar} fallback={initials(name)} size=\"sm\" />\n);\n\n/** 写留言的输入框：提及、附件、发送 */\nexport const CommentComposer = _component(\n  ({\n    onSend,\n    onCancel,\n    people = [],\n    upload,\n    author,\n    initialText = '',\n    autofocus = false,\n    placeholder,\n    propsMentions,\n    ...rest\n  }: CommentComposerProps) => {\n    const messages = useMessages('patterns', patternsMessages);\n    // 只取一开始的值：回复时的“@作者 ”，之后由用户编辑\n    let text = _state(_untrack(initialText));\n    let mentions = _state<string[]>([]);\n    let files = _state<UploadFile[]>([]);\n    let attaching = _state(false);\n    let sending = _state(false);\n    let failed = _state(false);\n    let root = _state.raw<HTMLElement | null>(null);\n\n    onMounted(() => {\n      if (!autofocus) return;\n      const input = root?.querySelector('textarea');\n      input?.focus();\n      input?.setSelectionRange(input.value.length, input.value.length);\n    });\n\n    // 还在上传的附件：等它完成才能发送\n    const uploading = () =>\n      files.some((file) => file.status === 'uploading' || file.status === 'selected');\n    const sendable = () => text.trim() !== '' && !uploading() && !sending;\n\n    async function send() {\n      if (!sendable()) return;\n      sending = true;\n      failed = false;\n      try {\n        await onSend({\n          content: text.trim(),\n          mentions,\n          attachments: files.filter((file) => file.status === 'done'),\n        });\n        text = '';\n        files = [];\n        attaching = false;\n      } catch {\n        failed = true;\n      } finally {\n        sending = false;\n      }\n    }\n\n    function onKeydown(event: KeyboardEvent) {\n      if (event.key === 'Enter' && (event.ctrlKey || event.metaKey)) {\n        event.preventDefault();\n        void send();\n      } else if (event.key === 'Escape' && onCancel && !event.defaultPrevented) {\n        // 提及列表打开时 Esc 先关列表（它会 preventDefault）\n        onCancel();\n      }\n    }\n\n    return () => (\n      <div\n        {...mergeAttrs<'div'>(\n          { sx: [commentStyles.composer, !author && commentStyles.composerNoAvatar] },\n          rest,\n          { ref: _toRef(root) },\n        )}\n      >\n        {author && authorAvatar(author.name, author.avatar)}\n        <div {...css.attrs(commentStyles.composerMain)}>\n          <Mentions\n            {...mergePartProps<MentionsProps>(\n              {\n                rows: 2,\n                maxRows: 10,\n                placeholder: placeholder ?? messages.commentPlaceholder,\n                'aria-label': messages.comments,\n              },\n              propsMentions,\n              { items: people, onKeydown },\n            )}\n            _value={text}\n            _mentions={mentions}\n          />\n          {upload && attaching && <Upload _value={files} upload={upload} multiple />}\n          {failed && (\n            <div role=\"alert\" {...css.attrs(commentStyles.error)}>\n              {messages.commentSendFailed}\n            </div>\n          )}\n          <div {...css.attrs(commentStyles.composerFooter)}>\n            <div {...css.attrs(commentStyles.composerTools)}>\n              {upload && (\n                <Button\n                  variant=\"ghost\"\n                  tone=\"neutral\"\n                  size=\"sm\"\n                  icon={Paperclip}\n                  aria-pressed={attaching}\n                  onClick={() => (attaching = !attaching)}\n                >\n                  {files.length > 0\n                    ? `${messages.commentAttach} ${files.length}`\n                    : messages.commentAttach}\n                </Button>\n              )}\n              <span {...css.attrs(commentStyles.hint)}>{messages.commentSendHint}</span>\n            </div>\n            <div {...css.attrs(commentStyles.composerTools)}>\n              {onCancel && (\n                <Button variant=\"ghost\" tone=\"neutral\" size=\"sm\" onClick={onCancel}>\n                  {messages.commentCancel}\n                </Button>\n              )}\n              <Button\n                size=\"sm\"\n                loading={sending}\n                disabled={!sendable()}\n                onClick={() => void send()}\n              >\n                {messages.commentSend}\n              </Button>\n            </div>\n          </div>\n        </div>\n      </div>\n    );\n  },\n);\n\n/** 未声明的属性落到外层 div 上 */\nexport interface CommentThreadProps extends PartProps<'div'> {\n  /** 留言，旧的在前；回复在各自的 replies 里 */\n  comments: readonly CommentItem[];\n  /** 可以 @ 的人：输入框的候选，也是留言里“@名字”高亮的依据 */\n  people?: readonly ListboxOption[];\n  /** 发送一条留言或回复；不给时只读（没有输入框与回复按钮） */\n  onSend?: (draft: CommentDraft) => unknown;\n  /** 上传附件；不给时不能带附件 */\n  upload?: UploadHandler;\n  /** 当前用户：输入框前面的头像 */\n  currentUser?: CommentAuthor;\n  /** 每条留言的操作（编辑、删除、标为已解决），在回复按钮后面 */\n  actions?: (comment: CommentItem) => VNodeChild;\n  /** 没有留言时显示的内容，默认取文案 */\n  empty?: VNodeChild;\n  /** “现在”的时间戳：相对时间按它算，默认是当前时间（文档与测试里固定它） */\n  now?: number;\n  /** 列表（ul）的部件属性 */\n  propsList?: PartProps<'ul'>;\n  /** 每条留言（li）的部件属性，可以按条计算 */\n  propsItem?: PartProps<'li'> | ((comment: CommentItem) => PartProps<'li'>);\n  /** 输入框（CommentComposer）的部件属性 */\n  propsComposer?: Partial<Omit<CommentComposerProps, 'onSend'>>;\n}\n\n/** 一串留言与回复，下面是输入框 */\nexport const CommentThread = _component(\n  ({\n    comments,\n    people = [],\n    onSend,\n    upload,\n    currentUser,\n    actions,\n    empty,\n    now,\n    propsList,\n    propsItem,\n    propsComposer,\n    ...rest\n  }: CommentThreadProps) => {\n    const messages = useMessages('patterns', patternsMessages);\n    const format = useFormat();\n    // 正在回复：哪一串（第一条的 id）与回复谁\n    let replying = _state<{ thread: string; to: string } | null>(null);\n\n    const item = (comment: CommentItem, thread: CommentItem): VNodeChild => {\n      const own = typeof propsItem === 'function' ? propsItem(comment) : propsItem;\n      const top = comment === thread;\n      return (\n        <li key={comment.id} {...mergeAttrs<'li'>({ sx: commentStyles.item }, own)}>\n          {authorAvatar(comment.author, comment.avatar)}\n          <article {...css.attrs(commentStyles.body)} aria-label={comment.author}>\n            <div {...css.attrs(commentStyles.header)}>\n              <span {...css.attrs(commentStyles.author)}>{comment.author}</span>\n              {comment.role}\n              <time\n                datetime={comment.time}\n                title={format.date(comment.time, { dateStyle: 'medium', timeStyle: 'short' })}\n                {...css.attrs(commentStyles.meta)}\n              >\n                {format.relative(comment.time, { now })}\n              </time>\n              {comment.edited && (\n                <span {...css.attrs(commentStyles.meta)}>{messages.commentEdited}</span>\n              )}\n            </div>\n            <MentionText text={comment.content} options={people} sx={commentStyles.content} />\n            {comment.attachments && comment.attachments.length > 0 && (\n              <ul\n                {...css.attrs(commentStyles.attachments)}\n                aria-label={messages.commentAttachments}\n              >\n                {comment.attachments.map((file) => (\n                  <li key={file.name} {...css.attrs(commentStyles.attachment)}>\n                    <Icon icon={Paperclip} />\n                    {file.url ? <Link href={file.url}>{file.name}</Link> : file.name}\n                    {file.size != null && (\n                      <span {...css.attrs(commentStyles.meta)}>{format.fileSize(file.size)}</span>\n                    )}\n                  </li>\n                ))}\n              </ul>\n            )}\n            {comment.extra}\n            {(onSend || actions) && (\n              <div {...css.attrs(commentStyles.actions)}>\n                {onSend && (\n                  <Button\n                    variant=\"link\"\n                    tone=\"neutral\"\n                    size=\"sm\"\n                    onClick={() => (replying = { thread: thread.id, to: comment.author })}\n                  >\n                    {messages.commentReply}\n                  </Button>\n                )}\n                {actions?.(comment)}\n              </div>\n            )}\n            {top && replies(thread)}\n          </article>\n        </li>\n      );\n    };\n\n    /** 一串的回复与回复的输入框 */\n    const replies = (thread: CommentItem) => {\n      const list = thread.replies ?? [];\n      const open = replying?.thread === thread.id;\n      if (list.length === 0 && !open) return null;\n      return (\n        <>\n          {list.length > 0 && (\n            <ul\n              {...css.attrs(commentStyles.replies)}\n              aria-label={messages.commentReplies(list.length)}\n            >\n              {list.map((reply) => item(reply, thread))}\n            </ul>\n          )}\n          {open && onSend && (\n            <CommentComposer\n              {...mergePartProps<Partial<CommentComposerProps>>(\n                { people, upload, author: currentUser },\n                propsComposer,\n                {\n                  key: `${thread.id}:${replying!.to}`,\n                  initialText: `@${replying!.to} `,\n                  autofocus: true,\n                  propsMentions: {\n                    ...propsComposer?.propsMentions,\n                    'aria-label': messages.commentReplyTo(replying!.to),\n                  },\n                  onCancel: () => (replying = null),\n                },\n              )}\n              // onSend 有返回值（Promise），不经 mergePartProps：它会把 on 开头的属性当事件串起来\n              onSend={async (draft) => {\n                await onSend({ ...draft, replyTo: thread.id });\n                replying = null;\n              }}\n            />\n          )}\n        </>\n      );\n    };\n\n    return () => (\n      <div {...mergeAttrs<'div'>({ sx: commentStyles.root }, rest)}>\n        {comments.length === 0 ? (\n          hasContent(empty) ? (\n            empty\n          ) : (\n            <Empty size=\"sm\" title={messages.commentsEmpty} />\n          )\n        ) : (\n          <ul\n            {...mergeAttrs<'ul'>({ sx: commentStyles.list }, propsList)}\n            aria-label={messages.comments}\n          >\n            {comments.map((comment) => item(comment, comment))}\n          </ul>\n        )}\n        {onSend && (\n          <CommentComposer\n            {...mergePartProps<Partial<CommentComposerProps>>(\n              { people, upload, author: currentUser },\n              propsComposer,\n            )}\n            onSend={onSend}\n          />\n        )}\n      </div>\n    );\n  },\n);\n"],"mappings":"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"}

package/dist/patterns/DataImport.js

@@ -15,8 +15,8 @@ import { DataTable } from "../table/DataTable.js";
 import { readCsvFile } from "../table/sheet.js";
 import { useMessages } from "../config/lang/messages.js";
 import { patternsMessages } from "./messages.js";
-import { createVNode, isVNode, mergeProps, ref, shallowRef, unref } from "vue";
-import { _component, readonlyProp, restProps } from "@zerodep-dev/vue-tsx-pro-tsx";
+import { createVNode, isVNode, ref, shallowRef, unref } 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";
 import { CircleAlert, CircleCheck, Download } from "@lucide/icons";
 import { safeParse } from "zod/v4/core";
@@ -393,7 +393,7 @@ var DataImport = /*#__PURE__*/ _component((_props, _ctx) => {
 				default: () => [messages.dataImportOnlyErrors],
 				$stable: true
 			})] }),
-			createVNode(DataTable, mergeProps(mergePartProps({
+			createVNode(DataTable, mergeJsxProps(mergePartProps({
 				"aria-label": messages.dataImportPreview,
 				propsRoot: { sx: dataImportStyles.previewTable },
 				density: "compact"
@@ -415,7 +415,7 @@ var DataImport = /*#__PURE__*/ _component((_props, _ctx) => {
 		let _slot4;
 		const { valid } = counts();
 		return createVNode("div", mergeAttrs({ sx: dataImportStyles.root }, rest), [
-			createVNode(Steps, mergeProps(mergePartProps({ items: messages.dataImportSteps.map((title) => ({ title })) }, propsSteps.value, { items: messages.dataImportSteps.map((title) => ({ title })) }), {
+			createVNode(Steps, mergeJsxProps(mergePartProps({ items: messages.dataImportSteps.map((title) => ({ title })) }, propsSteps.value, { items: messages.dataImportSteps.map((title) => ({ title })) }), {
 				"_current": step.value,
 				"onUpdate:_current": _cache[5] || (_cache[5] = ($event) => step.value = $event)
 			}), null),

package/dist/patterns/DataImport.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataImport.js","names":["_isVNode","_vtp_readonlyProp","_vtp_restProps","_vue_ref","_vue_shallowRef","_createVNode","_vue_unref","_mergeProps"],"sources":["../../src/patterns/DataImport.tsx"],"sourcesContent":["/**\n * 数据导入：上传文件 → 对应列 → 逐行校验与预览（有错的格子就地改）→ 确认导入。批量导入零件、报价、人员这类数据用它。\n *\n *   <DataImport\n *     fields={[{ key: 'part', label: '零件号', required: true, aliases: ['料号'] }, { key: 'quantity', label: '数量', type: 'number' }]}\n *     schema={z.object({ part: z.string().min(1), quantity: z.number().int().positive() })}\n *     parse={readXlsx}                 // 读 Excel：@zerodep-dev/vue-tsx-pro-ui/xlsx；不写时读 CSV\n *     accept=\".xlsx,.csv\"\n *     onImport={(rows) => api.importParts(rows)}\n *   />\n *\n * - 上传：选文件或拖进来，parse 读成表（SheetTable）；几张工作表时先选一张。\n * - 对应列：按字段的 label 与 aliases 自动对上文件里的列，可以改；必填的字段没对上时不能往下走。\n * - 校验：空的格子（空字符串、只有空白）是 null，同 useForm 的约定（选填的字段在 schema 里写 .nullable()）。\n *   有 schema（zod 对象）时逐行解析，错误标在对应的格子上；没有时按 required、type（数字列要是数字）检查，\n *   也可以写 validate。有错的格子可以直接改（表格就地编辑），改完重新校验；“只看有错的行”筛出要处理的。\n * - 导入：onImport 拿到通过校验的行（schema 解析后的值）；返回 Promise 时按钮加载中，完成后显示结果。\n *\n * 部件：Root（div）、Steps、Drop（FileDrop）、Mapping（ColumnTable）、Preview（DataTable）、Actions（Flex）。\n */\nimport { CircleAlert, CircleCheck, Download } from '@lucide/icons';\nimport { _component } from '@zerodep-dev/vue-tsx-pro-tsx';\nimport * as css from '@zerodep-dev/vue-tsx-pro-tsx/styles';\nimport { shallowRef, type VNodeChild } from 'vue';\nimport type { $ZodType } from 'zod/v4/core';\nimport { safeParse } from 'zod/v4/core';\nimport { Badge } from '../base/Badge';\nimport { Button, type ButtonProps } from '../base/Button';\nimport { Icon } from '../base/Icon';\nimport { Small } from '../base/Text';\nimport { useLang } from '../config/context';\nimport { useMessages } from '../config/lang/messages';\nimport { Alert } from '../feedback/Alert';\nimport { FileDrop, type FileDropProps } from '../input/FileDrop';\nimport { Select } from '../input/Select';\nimport { Switch } from '../input/Switch';\nimport { Flex, type FlexProps } from '../layout/Flex';\nimport { Steps, type StepsProps } from '../navigation/Steps';\nimport type { DataTableColumn } from '../table/columns';\nimport { ColumnTable } from '../table/ColumnTable';\nimport { DataTable, type DataTableProps } from '../table/DataTable';\nimport { readCsvFile, type SheetTable, type SheetValue } from '../table/sheet';\nimport { mergeAttrs, mergePartProps, type PartProps } from '../utils/props';\nimport { patternsMessages } from './messages';\n\n/** 要导入的一个字段 */\nexport interface ImportField {\n  /** 字段名：导入的行里的键 */\n  key: string;\n  /** 名称：对应列时显示，也用来自动对上文件里的同名列 */\n  label: string;\n  /** 必填：没对应上不能往下走；没有 schema 时空值算错 */\n  required?: boolean;\n  /** 文件里这一列可能的其他叫法（“料号”“Part No.”）：自动对应时也认 */\n  aliases?: readonly string[];\n  /** 值的类型（没有 schema 时）：number 把文字转成数字，转不了算错；默认 text */\n  type?: 'text' | 'number';\n  /** 预览表里这一列的宽度（px） */\n  width?: number;\n}\n\n/** 预览里的一行 */\ninterface ImportRow {\n  /** 第几行数据（从 1 起） */\n  line: number;\n  /** 对应后的原值（字段名 → 值），就地改的是它 */\n  raw: Record<string, unknown>;\n  /** 校验通过后的值 */\n  value?: unknown;\n  /** 字段名 → 原因 */\n  errors: Record<string, string>;\n}\n\n/** 未声明的属性落到外层 div 上 */\nexport interface DataImportProps<Row> extends PartProps<'div'> {\n  /** 要导入的字段，按显示的顺序 */\n  fields: readonly ImportField[];\n  /** 一行的 zod 对象 schema：逐行解析，错误标在格子上，onImport 拿到解析后的值 */\n  schema?: $ZodType<Row>;\n  /** 没有 schema 时的逐行校验：返回字段名 → 原因（在 required、type 的检查之后） */\n  validate?: (row: Record<string, unknown>) => Record<string, string> | null | undefined;\n  /** 读文件：返回各工作表；默认读 CSV（readCsvFile），读 Excel 传 @zerodep-dev/vue-tsx-pro-ui/xlsx 的 readXlsx */\n  parse?: (file: File) => Promise<SheetTable[]>;\n  /** 能选的文件类型，默认 .csv */\n  accept?: string;\n  /** 导入通过校验的行：返回 Promise 时按钮加载中，失败时留在预览（由调用方提示原因） */\n  onImport: (rows: Row[]) => unknown;\n  /** 下载模板：写了就在上传区旁边放“下载模板” */\n  onTemplate?: () => void;\n  /** 步骤条的部件属性 */\n  propsSteps?: Partial<StepsProps>;\n  /** 选文件区域的部件属性 */\n  propsDrop?: Partial<FileDropProps>;\n  /** 预览表（DataTable）的部件属性 */\n  propsPreview?: Partial<DataTableProps<ImportRow>>;\n  /** 按钮行的部件属性 */\n  propsActions?: Partial<FlexProps>;\n  /** 导入按钮的部件属性 */\n  propsSubmit?: Partial<ButtonProps>;\n}\n\n/** DataImport 的样式：root、previewTable、validIcon、invalidIcon */\nexport const dataImportStyles = css.create({\n  root: { display: 'flex', flexDirection: 'column', gap: '_lg', minWidth: 0 },\n  previewTable: { maxHeight: '24rem' },\n  validIcon: { color: '_successText' },\n  invalidIcon: { color: '_dangerText' },\n});\n\n/** 文字规范化后比较：去掉空白、括号与大小写（“零件号 (必填)”也认作“零件号”） */\nconst normalize = (text: string) =>\n  text\n    .toLowerCase()\n    .replace(/[（(][^）)]*[）)]/g, '')\n    .replace(/[\\s_*]/g, '');\n\n/** 按名称与别名对上文件里的列 */\nfunction autoMap(\n  fields: readonly ImportField[],\n  headers: readonly string[],\n): Record<string, string | null> {\n  const taken = new Set<string>();\n  return Object.fromEntries(\n    fields.map((field) => {\n      const names = [field.label, field.key, ...(field.aliases ?? [])].map(normalize);\n      const header = headers.find((item) => !taken.has(item) && names.includes(normalize(item)));\n      if (header) taken.add(header);\n      return [field.key, header ?? null];\n    }),\n  );\n}\n\n/** 空值：null、空字符串 */\nconst isEmpty = (value: unknown) =>\n  value == null || (typeof value === 'string' && value.trim() === '');\n\n/** 数据导入：上传 → 对应列 → 校验与预览 → 导入 */\nexport const DataImport = _component(\n  <Row,>({\n    fields,\n    schema,\n    validate,\n    parse = readCsvFile,\n    accept = '.csv',\n    onImport,\n    onTemplate,\n    propsSteps,\n    propsDrop,\n    propsPreview,\n    propsActions,\n    propsSubmit,\n    ...rest\n  }: DataImportProps<Row>) => {\n    const messages = useMessages('patterns', patternsMessages);\n    const lang = useLang();\n    let step = _state(0);\n    let sheets = _state.raw<SheetTable[]>([]);\n    let sheetName = _state<string | null>(null);\n    let mapping = _state<Record<string, string | null>>({});\n    let parseError = _state('');\n    let onlyErrors = _state(false);\n    let importing = _state(false);\n    let imported = _state(0);\n    // 预览的行：就地改时整个换掉\n    const rows = shallowRef<ImportRow[]>([]);\n\n    const sheet = () => sheets.find((item) => item.name === sheetName);\n    const unmapped = () =>\n      fields.filter((field) => field.required && !mapping[field.key]).map((field) => field.label);\n\n    async function onFiles(files: File[]) {\n      const file = files[0];\n      if (!file) return;\n      parseError = '';\n      try {\n        const read = (await parse(file)).filter((item) => item.rows.length > 0);\n        if (read.length === 0) {\n          parseError = messages.dataImportEmpty;\n          return;\n        }\n        sheets = read;\n        sheetName = read[0]!.name;\n        mapping = autoMap(fields, read[0]!.headers);\n        step = 1;\n      } catch (error) {\n        parseError = messages.dataImportParseFailed(\n          error instanceof Error ? error.message : String(error),\n        );\n      }\n    }\n\n    function changeSheet(name: string | null) {\n      sheetName = name;\n      const current = sheet();\n      if (current) mapping = autoMap(fields, current.headers);\n    }\n\n    /** 校验一行：schema 优先；否则 required、type 与 validate */\n    function check(raw: Record<string, unknown>): Pick<ImportRow, 'value' | 'errors'> {\n      if (schema) {\n        const result = safeParse(schema, raw);\n        if (result.success) return { value: result.data, errors: {} };\n        const errors: Record<string, string> = {};\n        for (const issue of result.error.issues) {\n          const key = String(issue.path[0] ?? fields[0]?.key ?? '');\n          errors[key] ??= issue.message;\n        }\n        return { errors };\n      }\n      const errors: Record<string, string> = {};\n      const value: Record<string, unknown> = {};\n      for (const field of fields) {\n        const cell = raw[field.key];\n        if (isEmpty(cell)) {\n          if (field.required) errors[field.key] = lang.formRequired;\n          value[field.key] = null;\n        } else if (field.type === 'number') {\n          const number = typeof cell === 'number' ? cell : Number(String(cell).replace(/,/g, ''));\n          if (Number.isNaN(number)) errors[field.key] = messages.dataImportNotNumber;\n          value[field.key] = number;\n        } else value[field.key] = typeof cell === 'string' ? cell.trim() : cell;\n      }\n      Object.assign(errors, { ...validate?.(value), ...errors });\n      return Object.keys(errors).length ? { errors } : { value, errors };\n    }\n\n    /** 对应完：按对应关系取出各行并校验，进入预览 */\n    function preview() {\n      const current = sheet();\n      if (!current) return;\n      rows.value = current.rows.map((row, index) => {\n        const raw = Object.fromEntries(\n          fields.map((field) => {\n            const header = mapping[field.key];\n            const value = header ? (row[header] ?? null) : null;\n            return [field.key, isEmpty(value) ? null : value] as [string, SheetValue];\n          }),\n        );\n        return { line: index + 1, raw, ...check(raw) };\n      });\n      onlyErrors = false;\n      step = 2;\n    }\n\n    /** 就地改了一格：改原值、重新校验这一行 */\n    function onCellChange(row: ImportRow, key: string, value: unknown) {\n      rows.value = rows.value.map((item) => {\n        if (item !== row) return item;\n        const raw = { ...item.raw, [key]: isEmpty(value) ? null : value };\n        return { ...item, raw, ...check(raw) };\n      });\n    }\n\n    async function submit() {\n      const valid = rows.value.filter((row) => Object.keys(row.errors).length === 0);\n      importing = true;\n      try {\n        await onImport(valid.map((row) => row.value as Row));\n        imported = valid.length;\n        step = 3;\n      } catch (error) {\n        console.error('DataImport 的 onImport 失败，留在预览', error);\n      } finally {\n        importing = false;\n      }\n    }\n\n    function restart() {\n      sheets = [];\n      sheetName = null;\n      rows.value = [];\n      step = 0;\n    }\n\n    const counts = () => {\n      const invalid = rows.value.filter((row) => Object.keys(row.errors).length > 0).length;\n      return { total: rows.value.length, invalid, valid: rows.value.length - invalid };\n    };\n\n    const previewColumns = (): DataTableColumn<ImportRow>[] => [\n      { key: 'line', header: messages.dataImportRow, width: 72, value: (row) => row.line },\n      {\n        key: 'status',\n        header: messages.dataImportStatus,\n        width: 200,\n        cell: (row) => {\n          const first = Object.values(row.errors)[0];\n          return first ? (\n            <Flex align=\"center\" gap=\"xs\">\n              <Icon icon={CircleAlert} sx={dataImportStyles.invalidIcon} />\n              <Small tone=\"danger\">{first}</Small>\n            </Flex>\n          ) : (\n            <Flex align=\"center\" gap=\"xs\">\n              <Icon icon={CircleCheck} sx={dataImportStyles.validIcon} />\n              <Small tone=\"muted\">{messages.dataImportValid}</Small>\n            </Flex>\n          );\n        },\n      },\n      ...fields.map((field): DataTableColumn<ImportRow> => ({\n        key: field.key,\n        header: field.label,\n        width: field.width,\n        minWidth: 120,\n        type: field.type === 'number' ? 'number' : 'text',\n        value: (row) => row.raw[field.key] as SheetValue,\n        editable: true,\n      })),\n    ];\n\n    function renderUpload(): VNodeChild {\n      return (\n        <Flex direction=\"column\" gap=\"sm\">\n          <FileDrop\n            {...mergePartProps<FileDropProps>(\n              { accept, description: messages.dataImportAccept(accept.split(',').join(', ')) },\n              propsDrop,\n              { onFiles: (files: File[]) => void onFiles(files) },\n            )}\n          />\n          {parseError && <Alert tone=\"danger\">{parseError}</Alert>}\n          {onTemplate && (\n            <Flex justify=\"end\">\n              <Button size=\"sm\" variant=\"ghost\" icon={Download} onClick={onTemplate}>\n                {messages.dataImportTemplate}\n              </Button>\n            </Flex>\n          )}\n        </Flex>\n      );\n    }\n\n    function renderMapping(): VNodeChild {\n      const current = sheet();\n      const headers = current?.headers ?? [];\n      const missing = unmapped();\n      const sampleOf = (header: string | null) =>\n        header\n          ? (current?.rows ?? [])\n              .slice(0, 2)\n              .map((row) => row[header])\n              .filter((value) => !isEmpty(value))\n              .map(String)\n              .join('、')\n          : '';\n      return (\n        <Flex direction=\"column\" gap=\"md\">\n          {sheets.length > 1 && (\n            <Flex align=\"center\" gap=\"sm\">\n              <Small tone=\"muted\">{messages.dataImportSheet}</Small>\n              <Select\n                items={sheets.map((item) => item.name)}\n                _value={sheetName}\n                onUpdate:_value={changeSheet}\n                aria-label={messages.dataImportSheet}\n                size=\"sm\"\n              />\n            </Flex>\n          )}\n          <ColumnTable\n            rows={fields}\n            getKey={(field) => field.key}\n            aria-label={messages.dataImportSteps[1]}\n            columns={[\n              {\n                key: 'label',\n                header: messages.dataImportField,\n                cell: (field) => (\n                  <Flex align=\"center\" gap=\"xs\">\n                    {field.label}\n                    {field.required && <Badge tone=\"danger\">*</Badge>}\n                  </Flex>\n                ),\n              },\n              {\n                key: 'column',\n                header: messages.dataImportColumn,\n                width: 240,\n                cell: (field) => (\n                  <Select\n                    items={headers}\n                    _value={mapping[field.key] ?? null}\n                    onUpdate:_value={(header: string | null) =>\n                      (mapping = { ...mapping, [field.key]: header })\n                    }\n                    placeholder={messages.dataImportSkip}\n                    clearable\n                    size=\"sm\"\n                    aria-label={`${field.label}：${messages.dataImportColumn}`}\n                  />\n                ),\n              },\n              {\n                key: 'sample',\n                header: messages.dataImportSample,\n                cell: (field) => <Small tone=\"muted\">{sampleOf(mapping[field.key] ?? null)}</Small>,\n              },\n            ]}\n          />\n          {missing.length > 0 && (\n            <Alert tone=\"warning\">{messages.dataImportUnmapped(missing)}</Alert>\n          )}\n        </Flex>\n      );\n    }\n\n    function renderPreview(): VNodeChild {\n      const { total, valid, invalid } = counts();\n      const shown = onlyErrors\n        ? rows.value.filter((row) => Object.keys(row.errors).length > 0)\n        : rows.value;\n      return (\n        <Flex direction=\"column\" gap=\"sm\">\n          <Flex align=\"center\" justify=\"between\" gap=\"md\" wrap>\n            <Small>{messages.dataImportSummary(total, valid, invalid)}</Small>\n            {invalid > 0 && (\n              <Switch\n                _checked={onlyErrors}\n                onUpdate:_checked={(value: boolean) => (onlyErrors = value)}\n              >\n                {messages.dataImportOnlyErrors}\n              </Switch>\n            )}\n          </Flex>\n          <DataTable\n            {...mergePartProps<Partial<DataTableProps<ImportRow>>>(\n              {\n                'aria-label': messages.dataImportPreview,\n                propsRoot: { sx: dataImportStyles.previewTable },\n                density: 'compact',\n              },\n              propsPreview,\n            )}\n            rows={shown}\n            columns={previewColumns()}\n            getKey={(row) => String(row.line)}\n            rowTone={(row) => (Object.keys(row.errors).length ? 'danger' : undefined)}\n            validateRow={(row) => row.errors}\n            onCellChange={onCellChange}\n          />\n          {invalid > 0 && <Small tone=\"muted\">{messages.dataImportEditHint}</Small>}\n        </Flex>\n      );\n    }\n\n    return () => {\n      const { valid } = counts();\n      return (\n        <div {...mergeAttrs<'div'>({ sx: dataImportStyles.root }, rest)}>\n          <Steps\n            {...mergePartProps<StepsProps>(\n              { items: messages.dataImportSteps.map((title) => ({ title })) },\n              propsSteps,\n              { items: messages.dataImportSteps.map((title) => ({ title })) },\n            )}\n            _current={step}\n          />\n          {step === 0 && renderUpload()}\n          {step === 1 && renderMapping()}\n          {step === 2 && renderPreview()}\n          {step === 3 && (\n            <Alert tone=\"success\" title={messages.dataImportDone(imported)}>\n              <Button size=\"sm\" variant=\"soft\" onClick={restart}>\n                {messages.dataImportAgain}\n              </Button>\n            </Alert>\n          )}\n          {(step === 1 || step === 2) && (\n            <Flex {...mergePartProps<FlexProps>({ justify: 'end', gap: 'sm' }, propsActions)}>\n              <Button\n                variant=\"ghost\"\n                tone=\"neutral\"\n                onClick={() => (step === 1 ? restart() : (step = 1))}\n              >\n                {messages.stepsFormPrevious}\n              </Button>\n              {step === 1 ? (\n                <Button disabled={unmapped().length > 0} onClick={preview}>\n                  {messages.stepsFormNext}\n                </Button>\n              ) : (\n                <Button\n                  {...mergePartProps<ButtonProps>({}, propsSubmit, {\n                    disabled: valid === 0,\n                    loading: importing,\n                    onClick: () => void submit(),\n                  })}\n                >\n                  {messages.dataImportSubmit(valid)}\n                </Button>\n              )}\n            </Flex>\n          )}\n        </div>\n      );\n    };\n  },\n);\n"],"mappings":"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"}
+{"version":3,"file":"DataImport.js","names":["_isVNode","_vtp_readonlyProp","_vtp_restProps","_vue_ref","_vue_shallowRef","_createVNode","_vue_unref","_mergeProps"],"sources":["../../src/patterns/DataImport.tsx"],"sourcesContent":["/**\n * 数据导入：上传文件 → 对应列 → 逐行校验与预览（有错的格子就地改）→ 确认导入。批量导入零件、报价、人员这类数据用它。\n *\n *   <DataImport\n *     fields={[{ key: 'part', label: '零件号', required: true, aliases: ['料号'] }, { key: 'quantity', label: '数量', type: 'number' }]}\n *     schema={z.object({ part: z.string().min(1), quantity: z.number().int().positive() })}\n *     parse={readXlsx}                 // 读 Excel：@zerodep-dev/vue-tsx-pro-ui/xlsx；不写时读 CSV\n *     accept=\".xlsx,.csv\"\n *     onImport={(rows) => api.importParts(rows)}\n *   />\n *\n * - 上传：选文件或拖进来，parse 读成表（SheetTable）；几张工作表时先选一张。\n * - 对应列：按字段的 label 与 aliases 自动对上文件里的列，可以改；必填的字段没对上时不能往下走。\n * - 校验：空的格子（空字符串、只有空白）是 null，同 useForm 的约定（选填的字段在 schema 里写 .nullable()）。\n *   有 schema（zod 对象）时逐行解析，错误标在对应的格子上；没有时按 required、type（数字列要是数字）检查，\n *   也可以写 validate。有错的格子可以直接改（表格就地编辑），改完重新校验；“只看有错的行”筛出要处理的。\n * - 导入：onImport 拿到通过校验的行（schema 解析后的值）；返回 Promise 时按钮加载中，完成后显示结果。\n *\n * 部件：Root（div）、Steps、Drop（FileDrop）、Mapping（ColumnTable）、Preview（DataTable）、Actions（Flex）。\n */\nimport { CircleAlert, CircleCheck, Download } from '@lucide/icons';\nimport { _component } from '@zerodep-dev/vue-tsx-pro-tsx';\nimport * as css from '@zerodep-dev/vue-tsx-pro-tsx/styles';\nimport { shallowRef, type VNodeChild } from 'vue';\nimport type { $ZodType } from 'zod/v4/core';\nimport { safeParse } from 'zod/v4/core';\nimport { Badge } from '../base/Badge';\nimport { Button, type ButtonProps } from '../base/Button';\nimport { Icon } from '../base/Icon';\nimport { Small } from '../base/Text';\nimport { useLang } from '../config/context';\nimport { useMessages } from '../config/lang/messages';\nimport { Alert } from '../feedback/Alert';\nimport { FileDrop, type FileDropProps } from '../input/FileDrop';\nimport { Select } from '../input/Select';\nimport { Switch } from '../input/Switch';\nimport { Flex, type FlexProps } from '../layout/Flex';\nimport { Steps, type StepsProps } from '../navigation/Steps';\nimport type { DataTableColumn } from '../table/columns';\nimport { ColumnTable } from '../table/ColumnTable';\nimport { DataTable, type DataTableProps } from '../table/DataTable';\nimport { readCsvFile, type SheetTable, type SheetValue } from '../table/sheet';\nimport { mergeAttrs, mergePartProps, type PartProps } from '../utils/props';\nimport { patternsMessages } from './messages';\n\n/** 要导入的一个字段 */\nexport interface ImportField {\n  /** 字段名：导入的行里的键 */\n  key: string;\n  /** 名称：对应列时显示，也用来自动对上文件里的同名列 */\n  label: string;\n  /** 必填：没对应上不能往下走；没有 schema 时空值算错 */\n  required?: boolean;\n  /** 文件里这一列可能的其他叫法（“料号”“Part No.”）：自动对应时也认 */\n  aliases?: readonly string[];\n  /** 值的类型（没有 schema 时）：number 把文字转成数字，转不了算错；默认 text */\n  type?: 'text' | 'number';\n  /** 预览表里这一列的宽度（px） */\n  width?: number;\n}\n\n/** 预览里的一行 */\ninterface ImportRow {\n  /** 第几行数据（从 1 起） */\n  line: number;\n  /** 对应后的原值（字段名 → 值），就地改的是它 */\n  raw: Record<string, unknown>;\n  /** 校验通过后的值 */\n  value?: unknown;\n  /** 字段名 → 原因 */\n  errors: Record<string, string>;\n}\n\n/** 未声明的属性落到外层 div 上 */\nexport interface DataImportProps<Row> extends PartProps<'div'> {\n  /** 要导入的字段，按显示的顺序 */\n  fields: readonly ImportField[];\n  /** 一行的 zod 对象 schema：逐行解析，错误标在格子上，onImport 拿到解析后的值 */\n  schema?: $ZodType<Row>;\n  /** 没有 schema 时的逐行校验：返回字段名 → 原因（在 required、type 的检查之后） */\n  validate?: (row: Record<string, unknown>) => Record<string, string> | null | undefined;\n  /** 读文件：返回各工作表；默认读 CSV（readCsvFile），读 Excel 传 @zerodep-dev/vue-tsx-pro-ui/xlsx 的 readXlsx */\n  parse?: (file: File) => Promise<SheetTable[]>;\n  /** 能选的文件类型，默认 .csv */\n  accept?: string;\n  /** 导入通过校验的行：返回 Promise 时按钮加载中，失败时留在预览（由调用方提示原因） */\n  onImport: (rows: Row[]) => unknown;\n  /** 下载模板：写了就在上传区旁边放“下载模板” */\n  onTemplate?: () => void;\n  /** 步骤条的部件属性 */\n  propsSteps?: Partial<StepsProps>;\n  /** 选文件区域的部件属性 */\n  propsDrop?: Partial<FileDropProps>;\n  /** 预览表（DataTable）的部件属性 */\n  propsPreview?: Partial<DataTableProps<ImportRow>>;\n  /** 按钮行的部件属性 */\n  propsActions?: Partial<FlexProps>;\n  /** 导入按钮的部件属性 */\n  propsSubmit?: Partial<ButtonProps>;\n}\n\n/** DataImport 的样式：root、previewTable、validIcon、invalidIcon */\nexport const dataImportStyles = css.create({\n  root: { display: 'flex', flexDirection: 'column', gap: '_lg', minWidth: 0 },\n  previewTable: { maxHeight: '24rem' },\n  validIcon: { color: '_successText' },\n  invalidIcon: { color: '_dangerText' },\n});\n\n/** 文字规范化后比较：去掉空白、括号与大小写（“零件号 (必填)”也认作“零件号”） */\nconst normalize = (text: string) =>\n  text\n    .toLowerCase()\n    .replace(/[（(][^）)]*[）)]/g, '')\n    .replace(/[\\s_*]/g, '');\n\n/** 按名称与别名对上文件里的列 */\nfunction autoMap(\n  fields: readonly ImportField[],\n  headers: readonly string[],\n): Record<string, string | null> {\n  const taken = new Set<string>();\n  return Object.fromEntries(\n    fields.map((field) => {\n      const names = [field.label, field.key, ...(field.aliases ?? [])].map(normalize);\n      const header = headers.find((item) => !taken.has(item) && names.includes(normalize(item)));\n      if (header) taken.add(header);\n      return [field.key, header ?? null];\n    }),\n  );\n}\n\n/** 空值：null、空字符串 */\nconst isEmpty = (value: unknown) =>\n  value == null || (typeof value === 'string' && value.trim() === '');\n\n/** 数据导入：上传 → 对应列 → 校验与预览 → 导入 */\nexport const DataImport = _component(\n  <Row,>({\n    fields,\n    schema,\n    validate,\n    parse = readCsvFile,\n    accept = '.csv',\n    onImport,\n    onTemplate,\n    propsSteps,\n    propsDrop,\n    propsPreview,\n    propsActions,\n    propsSubmit,\n    ...rest\n  }: DataImportProps<Row>) => {\n    const messages = useMessages('patterns', patternsMessages);\n    const lang = useLang();\n    let step = _state(0);\n    let sheets = _state.raw<SheetTable[]>([]);\n    let sheetName = _state<string | null>(null);\n    let mapping = _state<Record<string, string | null>>({});\n    let parseError = _state('');\n    let onlyErrors = _state(false);\n    let importing = _state(false);\n    let imported = _state(0);\n    // 预览的行：就地改时整个换掉\n    const rows = shallowRef<ImportRow[]>([]);\n\n    const sheet = () => sheets.find((item) => item.name === sheetName);\n    const unmapped = () =>\n      fields.filter((field) => field.required && !mapping[field.key]).map((field) => field.label);\n\n    async function onFiles(files: File[]) {\n      const file = files[0];\n      if (!file) return;\n      parseError = '';\n      try {\n        const read = (await parse(file)).filter((item) => item.rows.length > 0);\n        if (read.length === 0) {\n          parseError = messages.dataImportEmpty;\n          return;\n        }\n        sheets = read;\n        sheetName = read[0]!.name;\n        mapping = autoMap(fields, read[0]!.headers);\n        step = 1;\n      } catch (error) {\n        parseError = messages.dataImportParseFailed(\n          error instanceof Error ? error.message : String(error),\n        );\n      }\n    }\n\n    function changeSheet(name: string | null) {\n      sheetName = name;\n      const current = sheet();\n      if (current) mapping = autoMap(fields, current.headers);\n    }\n\n    /** 校验一行：schema 优先；否则 required、type 与 validate */\n    function check(raw: Record<string, unknown>): Pick<ImportRow, 'value' | 'errors'> {\n      if (schema) {\n        const result = safeParse(schema, raw);\n        if (result.success) return { value: result.data, errors: {} };\n        const errors: Record<string, string> = {};\n        for (const issue of result.error.issues) {\n          const key = String(issue.path[0] ?? fields[0]?.key ?? '');\n          errors[key] ??= issue.message;\n        }\n        return { errors };\n      }\n      const errors: Record<string, string> = {};\n      const value: Record<string, unknown> = {};\n      for (const field of fields) {\n        const cell = raw[field.key];\n        if (isEmpty(cell)) {\n          if (field.required) errors[field.key] = lang.formRequired;\n          value[field.key] = null;\n        } else if (field.type === 'number') {\n          const number = typeof cell === 'number' ? cell : Number(String(cell).replace(/,/g, ''));\n          if (Number.isNaN(number)) errors[field.key] = messages.dataImportNotNumber;\n          value[field.key] = number;\n        } else value[field.key] = typeof cell === 'string' ? cell.trim() : cell;\n      }\n      Object.assign(errors, { ...validate?.(value), ...errors });\n      return Object.keys(errors).length ? { errors } : { value, errors };\n    }\n\n    /** 对应完：按对应关系取出各行并校验，进入预览 */\n    function preview() {\n      const current = sheet();\n      if (!current) return;\n      rows.value = current.rows.map((row, index) => {\n        const raw = Object.fromEntries(\n          fields.map((field) => {\n            const header = mapping[field.key];\n            const value = header ? (row[header] ?? null) : null;\n            return [field.key, isEmpty(value) ? null : value] as [string, SheetValue];\n          }),\n        );\n        return { line: index + 1, raw, ...check(raw) };\n      });\n      onlyErrors = false;\n      step = 2;\n    }\n\n    /** 就地改了一格：改原值、重新校验这一行 */\n    function onCellChange(row: ImportRow, key: string, value: unknown) {\n      rows.value = rows.value.map((item) => {\n        if (item !== row) return item;\n        const raw = { ...item.raw, [key]: isEmpty(value) ? null : value };\n        return { ...item, raw, ...check(raw) };\n      });\n    }\n\n    async function submit() {\n      const valid = rows.value.filter((row) => Object.keys(row.errors).length === 0);\n      importing = true;\n      try {\n        await onImport(valid.map((row) => row.value as Row));\n        imported = valid.length;\n        step = 3;\n      } catch (error) {\n        console.error('DataImport 的 onImport 失败，留在预览', error);\n      } finally {\n        importing = false;\n      }\n    }\n\n    function restart() {\n      sheets = [];\n      sheetName = null;\n      rows.value = [];\n      step = 0;\n    }\n\n    const counts = () => {\n      const invalid = rows.value.filter((row) => Object.keys(row.errors).length > 0).length;\n      return { total: rows.value.length, invalid, valid: rows.value.length - invalid };\n    };\n\n    const previewColumns = (): DataTableColumn<ImportRow>[] => [\n      { key: 'line', header: messages.dataImportRow, width: 72, value: (row) => row.line },\n      {\n        key: 'status',\n        header: messages.dataImportStatus,\n        width: 200,\n        cell: (row) => {\n          const first = Object.values(row.errors)[0];\n          return first ? (\n            <Flex align=\"center\" gap=\"xs\">\n              <Icon icon={CircleAlert} sx={dataImportStyles.invalidIcon} />\n              <Small tone=\"danger\">{first}</Small>\n            </Flex>\n          ) : (\n            <Flex align=\"center\" gap=\"xs\">\n              <Icon icon={CircleCheck} sx={dataImportStyles.validIcon} />\n              <Small tone=\"muted\">{messages.dataImportValid}</Small>\n            </Flex>\n          );\n        },\n      },\n      ...fields.map((field): DataTableColumn<ImportRow> => ({\n        key: field.key,\n        header: field.label,\n        width: field.width,\n        minWidth: 120,\n        type: field.type === 'number' ? 'number' : 'text',\n        value: (row) => row.raw[field.key] as SheetValue,\n        editable: true,\n      })),\n    ];\n\n    function renderUpload(): VNodeChild {\n      return (\n        <Flex direction=\"column\" gap=\"sm\">\n          <FileDrop\n            {...mergePartProps<FileDropProps>(\n              { accept, description: messages.dataImportAccept(accept.split(',').join(', ')) },\n              propsDrop,\n              { onFiles: (files: File[]) => void onFiles(files) },\n            )}\n          />\n          {parseError && <Alert tone=\"danger\">{parseError}</Alert>}\n          {onTemplate && (\n            <Flex justify=\"end\">\n              <Button size=\"sm\" variant=\"ghost\" icon={Download} onClick={onTemplate}>\n                {messages.dataImportTemplate}\n              </Button>\n            </Flex>\n          )}\n        </Flex>\n      );\n    }\n\n    function renderMapping(): VNodeChild {\n      const current = sheet();\n      const headers = current?.headers ?? [];\n      const missing = unmapped();\n      const sampleOf = (header: string | null) =>\n        header\n          ? (current?.rows ?? [])\n              .slice(0, 2)\n              .map((row) => row[header])\n              .filter((value) => !isEmpty(value))\n              .map(String)\n              .join('、')\n          : '';\n      return (\n        <Flex direction=\"column\" gap=\"md\">\n          {sheets.length > 1 && (\n            <Flex align=\"center\" gap=\"sm\">\n              <Small tone=\"muted\">{messages.dataImportSheet}</Small>\n              <Select\n                items={sheets.map((item) => item.name)}\n                _value={sheetName}\n                onUpdate:_value={changeSheet}\n                aria-label={messages.dataImportSheet}\n                size=\"sm\"\n              />\n            </Flex>\n          )}\n          <ColumnTable\n            rows={fields}\n            getKey={(field) => field.key}\n            aria-label={messages.dataImportSteps[1]}\n            columns={[\n              {\n                key: 'label',\n                header: messages.dataImportField,\n                cell: (field) => (\n                  <Flex align=\"center\" gap=\"xs\">\n                    {field.label}\n                    {field.required && <Badge tone=\"danger\">*</Badge>}\n                  </Flex>\n                ),\n              },\n              {\n                key: 'column',\n                header: messages.dataImportColumn,\n                width: 240,\n                cell: (field) => (\n                  <Select\n                    items={headers}\n                    _value={mapping[field.key] ?? null}\n                    onUpdate:_value={(header: string | null) =>\n                      (mapping = { ...mapping, [field.key]: header })\n                    }\n                    placeholder={messages.dataImportSkip}\n                    clearable\n                    size=\"sm\"\n                    aria-label={`${field.label}：${messages.dataImportColumn}`}\n                  />\n                ),\n              },\n              {\n                key: 'sample',\n                header: messages.dataImportSample,\n                cell: (field) => <Small tone=\"muted\">{sampleOf(mapping[field.key] ?? null)}</Small>,\n              },\n            ]}\n          />\n          {missing.length > 0 && (\n            <Alert tone=\"warning\">{messages.dataImportUnmapped(missing)}</Alert>\n          )}\n        </Flex>\n      );\n    }\n\n    function renderPreview(): VNodeChild {\n      const { total, valid, invalid } = counts();\n      const shown = onlyErrors\n        ? rows.value.filter((row) => Object.keys(row.errors).length > 0)\n        : rows.value;\n      return (\n        <Flex direction=\"column\" gap=\"sm\">\n          <Flex align=\"center\" justify=\"between\" gap=\"md\" wrap>\n            <Small>{messages.dataImportSummary(total, valid, invalid)}</Small>\n            {invalid > 0 && (\n              <Switch\n                _checked={onlyErrors}\n                onUpdate:_checked={(value: boolean) => (onlyErrors = value)}\n              >\n                {messages.dataImportOnlyErrors}\n              </Switch>\n            )}\n          </Flex>\n          <DataTable\n            {...mergePartProps<Partial<DataTableProps<ImportRow>>>(\n              {\n                'aria-label': messages.dataImportPreview,\n                propsRoot: { sx: dataImportStyles.previewTable },\n                density: 'compact',\n              },\n              propsPreview,\n            )}\n            rows={shown}\n            columns={previewColumns()}\n            getKey={(row) => String(row.line)}\n            rowTone={(row) => (Object.keys(row.errors).length ? 'danger' : undefined)}\n            validateRow={(row) => row.errors}\n            onCellChange={onCellChange}\n          />\n          {invalid > 0 && <Small tone=\"muted\">{messages.dataImportEditHint}</Small>}\n        </Flex>\n      );\n    }\n\n    return () => {\n      const { valid } = counts();\n      return (\n        <div {...mergeAttrs<'div'>({ sx: dataImportStyles.root }, rest)}>\n          <Steps\n            {...mergePartProps<StepsProps>(\n              { items: messages.dataImportSteps.map((title) => ({ title })) },\n              propsSteps,\n              { items: messages.dataImportSteps.map((title) => ({ title })) },\n            )}\n            _current={step}\n          />\n          {step === 0 && renderUpload()}\n          {step === 1 && renderMapping()}\n          {step === 2 && renderPreview()}\n          {step === 3 && (\n            <Alert tone=\"success\" title={messages.dataImportDone(imported)}>\n              <Button size=\"sm\" variant=\"soft\" onClick={restart}>\n                {messages.dataImportAgain}\n              </Button>\n            </Alert>\n          )}\n          {(step === 1 || step === 2) && (\n            <Flex {...mergePartProps<FlexProps>({ justify: 'end', gap: 'sm' }, propsActions)}>\n              <Button\n                variant=\"ghost\"\n                tone=\"neutral\"\n                onClick={() => (step === 1 ? restart() : (step = 1))}\n              >\n                {messages.stepsFormPrevious}\n              </Button>\n              {step === 1 ? (\n                <Button disabled={unmapped().length > 0} onClick={preview}>\n                  {messages.stepsFormNext}\n                </Button>\n              ) : (\n                <Button\n                  {...mergePartProps<ButtonProps>({}, propsSubmit, {\n                    disabled: valid === 0,\n                    loading: importing,\n                    onClick: () => void submit(),\n                  })}\n                >\n                  {messages.dataImportSubmit(valid)}\n                </Button>\n              )}\n            </Flex>\n          )}\n        </div>\n      );\n    };\n  },\n);\n"],"mappings":"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"}

package/dist/patterns/DeadlineBadge.js

@@ -3,8 +3,8 @@ import { VisuallyHidden } from "../base/VisuallyHidden.js";
 import { useMessages } from "../config/lang/messages.js";
 import { deadlineOf, useWorkCalendar } from "../utils/data/workdays.js";
 import { patternsMessages } from "./messages.js";
-import { createTextVNode, createVNode, mergeProps } from "vue";
-import { _component, readonlyProp, restProps } from "@zerodep-dev/vue-tsx-pro-tsx";
+import { createTextVNode, createVNode } from "vue";
+import { _component, mergeJsxProps, readonlyProp, restProps } from "@zerodep-dev/vue-tsx-pro-tsx";
 //#region src/patterns/DeadlineBadge.tsx
 /** 未声明的属性落到 Badge 上 */
 var TONES = {
@@ -53,7 +53,7 @@ var DeadlineBadge = /*#__PURE__*/ _component((_props, _ctx) => {
 		const current = deadline();
 		if (!current) return null;
 		const late = current.state === "done" && current.remaining < 0;
-		return createVNode(Badge, mergeProps(rest, {
+		return createVNode(Badge, mergeJsxProps(rest, {
 			"tone": late ? "danger" : TONES[current.state],
 			"title": messages.deadlineOn(current.due),
 			"data-state": current.state

package/dist/patterns/DeadlineBadge.js.map

@@ -1 +1 @@
-{"version":3,"file":"DeadlineBadge.js","names":["_vtp_readonlyProp","_vtp_restProps","_createVNode","_mergeProps","_createTextVNode"],"sources":["../../src/patterns/DeadlineBadge.tsx"],"sourcesContent":["/**\n * 时限标记：按工作日算还剩几天、今天到期、超时几天，颜色随状态（超时 danger、今天到期与快到期 warning、\n * 还早 neutral、完成 success 或超时完成 danger）。用在收件箱、待办、各种有时限的列表里。\n *\n *   <DeadlineBadge due=\"2026-10-23\" />                           截止日直接给\n *   <DeadlineBadge start={verifiedOn} workdays={10} />           开始日加几个工作日（验收完成后 10 个工作日内付款）\n *   <DeadlineBadge due={item.dueOn} done={item.completedOn} />   完成了按完成那天算\n *\n * 工作日按 createUi / Provider 的 workCalendar（法定节假日与调休），没给时只按周末。今天默认按浏览器，\n * 业务以服务器的日期为准时传 today。悬停与读屏有完整说明（截止日）。算法见 utils/data/workdays 的 deadlineOf。\n */\nimport { _component } from '@zerodep-dev/vue-tsx-pro-tsx';\nimport { Badge, type BadgeProps } from '../base/Badge';\nimport { useMessages } from '../config/lang/messages';\nimport { patternsMessages } from './messages';\nimport { VisuallyHidden } from '../base/VisuallyHidden';\nimport {\n  deadlineOf,\n  useWorkCalendar,\n  type Deadline,\n  type DeadlineStates,\n} from '../utils/data/workdays';\nimport type { StatusTone } from '../utils/style/tone-styles';\n\n/** 未声明的属性落到 Badge 上 */\nexport interface DeadlineBadgeProps extends Omit<BadgeProps, 'tone' | 'children' | 'title'> {\n  /** 截止日（ISO 日期）；与 start + workdays 二选一 */\n  due?: string | null;\n  /** 开始日（ISO 日期）：截止日是它加 workdays 个工作日 */\n  start?: string;\n  /** 开始日之后几个工作日截止 */\n  workdays?: number;\n  /** 完成的日期：完成了按完成那天算，显示按时或超时完成 */\n  done?: string | null;\n  /** 今天（ISO 日期），默认按浏览器的今天 */\n  today?: string;\n  /**\n   * 剩下几个工作日以内算快到期（warning）\n   * @default 2\n   */\n  soon?: number;\n}\n\nconst TONES: Record<keyof DeadlineStates, StatusTone> = {\n  pending: 'neutral',\n  soon: 'warning',\n  due: 'warning',\n  overdue: 'danger',\n  done: 'success',\n};\n\n/** 时限标记 */\nexport const DeadlineBadge = _component(\n  ({ due, start, workdays, done, today, soon, ...rest }: DeadlineBadgeProps) => {\n    const messages = useMessages('patterns', patternsMessages);\n    const calendar = useWorkCalendar();\n    const deadline = (): Deadline | null => {\n      if (due) return deadlineOf({ due, done, today, soon }, calendar);\n      if (start && workdays != null)\n        return deadlineOf({ start, workdays, done, today, soon }, calendar);\n      return null;\n    };\n    const text = ({ state, remaining }: Deadline) => {\n      switch (state) {\n        case 'overdue':\n          return messages.deadlineOverdue(-remaining);\n        case 'due':\n          return messages.deadlineDue;\n        case 'done':\n          return remaining < 0 ? messages.deadlineDoneLate(-remaining) : messages.deadlineDone;\n        default:\n          return messages.deadlineRemaining(remaining);\n      }\n    };\n    return () => {\n      const current = deadline();\n      if (!current) return null;\n      const late = current.state === 'done' && current.remaining < 0;\n      return (\n        <Badge\n          {...rest}\n          tone={late ? 'danger' : TONES[current.state]}\n          title={messages.deadlineOn(current.due)}\n          data-state={current.state}\n        >\n          {text(current)}\n          {/* title 读屏不一定念：截止日另写一份给读屏 */}\n          <VisuallyHidden> {messages.deadlineOn(current.due)}</VisuallyHidden>\n        </Badge>\n      );\n    };\n  },\n);\n"],"mappings":";;;;;;;;;AA2CA,IAAM,QAAkD;CACtD,SAAS;CACT,MAAM;CACN,KAAK;CACL,SAAS;CACT,MAAM;AACR;;AAGA,IAAa,gBAAgB,0BAC3B,QAAA,SAA8E;CAAA,MAAA,MAAAA,aAAA,QAAA,KAAA;CAAA,MAAA,QAAAA,aAAA,QAAA,OAAA;CAAA,MAAA,WAAAA,aAAA,QAAA,UAAA;CAAA,MAAA,OAAAA,aAAA,QAAA,MAAA;CAAA,MAAA,QAAAA,aAAA,QAAA,OAAA;CAAA,MAAA,OAAAA,aAAA,QAAA,MAAA;CAAA,MAA/B,OAAIC,UAAA,QAAA,MAAA,IAAA;CACjD,MAAM,WAAW,YAAY,YAAY,gBAAgB;CACzD,MAAM,WAAW,gBAAgB;CACjC,MAAM,iBAAkC;EACtC,IAAA,IAAA,OAAS,OAAO,WAAW;GAAE,KAAG,IAAA;GAAE,MAAI,KAAA;GAAE,OAAK,MAAA;GAAE,MAAI,KAAA;EAAC,GAAG,QAAQ;EAC/D,IAAI,MAAA,SAAS,SAAA,SAAY,MACvB,OAAO,WAAW;GAAE,OAAK,MAAA;GAAE,UAAQ,SAAA;GAAE,MAAI,KAAA;GAAE,OAAK,MAAA;GAAE,MAAI,KAAA;EAAC,GAAG,QAAQ;EACpE,OAAO;CACT;CACA,MAAM,QAAQ,EAAE,OAAO,gBAA0B;EAC/C,QAAQ,OAAR;GACE,KAAK,WACH,OAAO,SAAS,gBAAgB,CAAC,SAAS;GAC5C,KAAK,OACH,OAAO,SAAS;GAClB,KAAK,QACH,OAAO,YAAY,IAAI,SAAS,iBAAiB,CAAC,SAAS,IAAI,SAAS;GAC1E,SACE,OAAO,SAAS,kBAAkB,SAAS;EAC/C;CACF;CACA,aAAa;EACX,MAAM,UAAU,SAAS;EACzB,IAAI,CAAC,SAAS,OAAO;EACrB,MAAM,OAAO,QAAQ,UAAU,UAAU,QAAQ,YAAY;EAC7D,OAAAC,YAAA,OAAAC,WAEQ,MAAI;GAAA,QACF,OAAO,WAAW,MAAM,QAAQ;GAAM,SACrC,SAAS,WAAW,QAAQ,GAAG;GAAC,cAC3B,QAAQ;EAAK,CAAA,GAAA,EAAA,eAAA,CAExB,KAAK,OAAO,GAACD,YAAA,gBAAA,MAAA,EAAA,eAAA,CAAAE,gBAAA,GAAA,GAEI,SAAS,WAAW,QAAQ,GAAG,CAAC,EAAA,CAAA,CAAA,EAAA,CAAA;CAGxD;AACF,GAAC;CAAA,MAAA;CAAA,OAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;CAAA;AAAA,CACH"}
+{"version":3,"file":"DeadlineBadge.js","names":["_vtp_readonlyProp","_vtp_restProps","_createVNode","_mergeProps","_createTextVNode"],"sources":["../../src/patterns/DeadlineBadge.tsx"],"sourcesContent":["/**\n * 时限标记：按工作日算还剩几天、今天到期、超时几天，颜色随状态（超时 danger、今天到期与快到期 warning、\n * 还早 neutral、完成 success 或超时完成 danger）。用在收件箱、待办、各种有时限的列表里。\n *\n *   <DeadlineBadge due=\"2026-10-23\" />                           截止日直接给\n *   <DeadlineBadge start={verifiedOn} workdays={10} />           开始日加几个工作日（验收完成后 10 个工作日内付款）\n *   <DeadlineBadge due={item.dueOn} done={item.completedOn} />   完成了按完成那天算\n *\n * 工作日按 createUi / Provider 的 workCalendar（法定节假日与调休），没给时只按周末。今天默认按浏览器，\n * 业务以服务器的日期为准时传 today。悬停与读屏有完整说明（截止日）。算法见 utils/data/workdays 的 deadlineOf。\n */\nimport { _component } from '@zerodep-dev/vue-tsx-pro-tsx';\nimport { Badge, type BadgeProps } from '../base/Badge';\nimport { useMessages } from '../config/lang/messages';\nimport { patternsMessages } from './messages';\nimport { VisuallyHidden } from '../base/VisuallyHidden';\nimport {\n  deadlineOf,\n  useWorkCalendar,\n  type Deadline,\n  type DeadlineStates,\n} from '../utils/data/workdays';\nimport type { StatusTone } from '../utils/style/tone-styles';\n\n/** 未声明的属性落到 Badge 上 */\nexport interface DeadlineBadgeProps extends Omit<BadgeProps, 'tone' | 'children' | 'title'> {\n  /** 截止日（ISO 日期）；与 start + workdays 二选一 */\n  due?: string | null;\n  /** 开始日（ISO 日期）：截止日是它加 workdays 个工作日 */\n  start?: string;\n  /** 开始日之后几个工作日截止 */\n  workdays?: number;\n  /** 完成的日期：完成了按完成那天算，显示按时或超时完成 */\n  done?: string | null;\n  /** 今天（ISO 日期），默认按浏览器的今天 */\n  today?: string;\n  /**\n   * 剩下几个工作日以内算快到期（warning）\n   * @default 2\n   */\n  soon?: number;\n}\n\nconst TONES: Record<keyof DeadlineStates, StatusTone> = {\n  pending: 'neutral',\n  soon: 'warning',\n  due: 'warning',\n  overdue: 'danger',\n  done: 'success',\n};\n\n/** 时限标记 */\nexport const DeadlineBadge = _component(\n  ({ due, start, workdays, done, today, soon, ...rest }: DeadlineBadgeProps) => {\n    const messages = useMessages('patterns', patternsMessages);\n    const calendar = useWorkCalendar();\n    const deadline = (): Deadline | null => {\n      if (due) return deadlineOf({ due, done, today, soon }, calendar);\n      if (start && workdays != null)\n        return deadlineOf({ start, workdays, done, today, soon }, calendar);\n      return null;\n    };\n    const text = ({ state, remaining }: Deadline) => {\n      switch (state) {\n        case 'overdue':\n          return messages.deadlineOverdue(-remaining);\n        case 'due':\n          return messages.deadlineDue;\n        case 'done':\n          return remaining < 0 ? messages.deadlineDoneLate(-remaining) : messages.deadlineDone;\n        default:\n          return messages.deadlineRemaining(remaining);\n      }\n    };\n    return () => {\n      const current = deadline();\n      if (!current) return null;\n      const late = current.state === 'done' && current.remaining < 0;\n      return (\n        <Badge\n          {...rest}\n          tone={late ? 'danger' : TONES[current.state]}\n          title={messages.deadlineOn(current.due)}\n          data-state={current.state}\n        >\n          {text(current)}\n          {/* title 读屏不一定念：截止日另写一份给读屏 */}\n          <VisuallyHidden> {messages.deadlineOn(current.due)}</VisuallyHidden>\n        </Badge>\n      );\n    };\n  },\n);\n"],"mappings":";;;;;;;;;AA2CA,IAAM,QAAkD;CACtD,SAAS;CACT,MAAM;CACN,KAAK;CACL,SAAS;CACT,MAAM;AACR;;AAGA,IAAa,gBAAgB,0BAC3B,QAAA,SAA8E;CAAA,MAAA,MAAAA,aAAA,QAAA,KAAA;CAAA,MAAA,QAAAA,aAAA,QAAA,OAAA;CAAA,MAAA,WAAAA,aAAA,QAAA,UAAA;CAAA,MAAA,OAAAA,aAAA,QAAA,MAAA;CAAA,MAAA,QAAAA,aAAA,QAAA,OAAA;CAAA,MAAA,OAAAA,aAAA,QAAA,MAAA;CAAA,MAA/B,OAAIC,UAAA,QAAA,MAAA,IAAA;CACjD,MAAM,WAAW,YAAY,YAAY,gBAAgB;CACzD,MAAM,WAAW,gBAAgB;CACjC,MAAM,iBAAkC;EACtC,IAAA,IAAA,OAAS,OAAO,WAAW;GAAE,KAAG,IAAA;GAAE,MAAI,KAAA;GAAE,OAAK,MAAA;GAAE,MAAI,KAAA;EAAC,GAAG,QAAQ;EAC/D,IAAI,MAAA,SAAS,SAAA,SAAY,MACvB,OAAO,WAAW;GAAE,OAAK,MAAA;GAAE,UAAQ,SAAA;GAAE,MAAI,KAAA;GAAE,OAAK,MAAA;GAAE,MAAI,KAAA;EAAC,GAAG,QAAQ;EACpE,OAAO;CACT;CACA,MAAM,QAAQ,EAAE,OAAO,gBAA0B;EAC/C,QAAQ,OAAR;GACE,KAAK,WACH,OAAO,SAAS,gBAAgB,CAAC,SAAS;GAC5C,KAAK,OACH,OAAO,SAAS;GAClB,KAAK,QACH,OAAO,YAAY,IAAI,SAAS,iBAAiB,CAAC,SAAS,IAAI,SAAS;GAC1E,SACE,OAAO,SAAS,kBAAkB,SAAS;EAC/C;CACF;CACA,aAAa;EACX,MAAM,UAAU,SAAS;EACzB,IAAI,CAAC,SAAS,OAAO;EACrB,MAAM,OAAO,QAAQ,UAAU,UAAU,QAAQ,YAAY;EAC7D,OAAAC,YAAA,OAAAC,cAEQ,MAAI;GAAA,QACF,OAAO,WAAW,MAAM,QAAQ;GAAM,SACrC,SAAS,WAAW,QAAQ,GAAG;GAAC,cAC3B,QAAQ;EAAK,CAAA,GAAA,EAAA,eAAA,CAExB,KAAK,OAAO,GAACD,YAAA,gBAAA,MAAA,EAAA,eAAA,CAAAE,gBAAA,GAAA,GAEI,SAAS,WAAW,QAAQ,GAAG,CAAC,EAAA,CAAA,CAAA,EAAA,CAAA;CAGxD;AACF,GAAC;CAAA,MAAA;CAAA,OAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;CAAA;AAAA,CACH"}

package/dist/patterns/FilterBar.d.ts

@@ -23,8 +23,16 @@ export interface FilterBarProps extends PartProps<'form', FilterBarManaged>, Pic
     moreActive?: number;
     /** 每个条件的最小宽度（CSS 长度），默认 `'16em'` */
     minFieldWidth?: string;
+    /** 整行起始边的内容：在条件前面（QueryTable 的标题）；对齐第一行 */
+    start?: VNodeChild;
+    /** 整行结束边的内容：在查询、重置后面（QueryTable 的工具栏按钮）；对齐第一行，展开更多条件时也不往下掉 */
+    end?: VNodeChild;
     /** 结束边额外的按钮：放在“重置”前面（如“导出筛选结果”） */
     actions?: VNodeChild;
+    /** start 外层的部件属性 */
+    propsStart?: PartProps<'div'>;
+    /** end 外层的部件属性 */
+    propsEnd?: PartProps<'div'>;
     /** 条件栅格的部件属性 */
     propsFields?: PartProps<'div'>;
     /** 按钮区的部件属性 */
@@ -48,13 +56,15 @@ export interface FilterBarProps extends PartProps<'form', FilterBarManaged>, Pic
     /** 常用的条件：Field */
     children?: VNodeChild;
 }
-/** FilterBar 的样式：root、fields、more、actions、toggleIconOpen */
+/** FilterBar 的样式：root、start、end、fields、more、actions、toggleIconOpen */
 export declare const filterBarStyles: Readonly<{
     actions: css.CompiledStyles;
     advanced: css.CompiledStyles;
+    end: css.CompiledStyles;
     fields: css.CompiledStyles;
     more: css.CompiledStyles;
     root: css.CompiledStyles;
+    start: css.CompiledStyles;
     summary: css.CompiledStyles;
     toggleIconOpen: css.CompiledStyles;
 }>;