@_tc/template-core 0.2.1-bate.1 → 0.2.2

package/fe/packages/react/ui/components/testPage/demos/core/MessageDemo.js

@@ -0,0 +1,44 @@
+import { __exportAll } from "../../../../../../../_virtual/_rolldown/runtime.js";
+import { Button } from "../../../Button/Button.js";
+import { message } from "../../../Message/MessageManager.js";
+import "../../../index.js";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+//#region packages/react/ui/components/testPage/demos/core/MessageDemo.tsx
+var MessageDemo_exports = /* @__PURE__ */ __exportAll({
+	default: () => MessageDemo,
+	demoMeta: () => demoMeta
+});
+var demoMeta = {
+	title: "Message (imperative)",
+	order: 12,
+	contentClassName: "flex flex-wrap gap-3 items-start"
+};
+function MessageDemo() {
+	return /* @__PURE__ */ jsxs(Fragment, { children: [
+		/* @__PURE__ */ jsx(Button, {
+			onClick: () => message.success("操作成功"),
+			children: "success"
+		}),
+		/* @__PURE__ */ jsx(Button, {
+			onClick: () => message.error("操作失败"),
+			children: "error"
+		}),
+		/* @__PURE__ */ jsx(Button, {
+			onClick: () => message.warning("警告信息"),
+			children: "warning"
+		}),
+		/* @__PURE__ */ jsx(Button, {
+			onClick: () => message.info("提示信息"),
+			children: "info"
+		}),
+		/* @__PURE__ */ jsx(Button, {
+			onClick: () => {
+				const id = message.success("5秒后关闭", { duration: 5e3 });
+				setTimeout(() => message.close(id), 2e3);
+			},
+			children: "提前关闭"
+		})
+	] });
+}
+//#endregion
+export { MessageDemo_exports, MessageDemo as default, demoMeta };

package/fe/packages/react/ui/components/testPage/demos/core/MessageDemo2.js

@@ -0,0 +1,4 @@
+//#region packages/react/ui/components/testPage/demos/core/MessageDemo.tsx?raw
+var MessageDemo_default = "import {\n    message,\n    Button\n} from '@tc/ui-react/components'\nimport type { DemoMeta } from '../../types'\n\nexport const demoMeta = {\n    title: 'Message (imperative)',\n    order: 12,\n    contentClassName: 'flex flex-wrap gap-3 items-start',\n} satisfies DemoMeta\n\n// ─── Message ─────────────────────────────────────────────────────────────────\n\nexport default function MessageDemo() {\n    return (\n        <>\n            <Button onClick={() => message.success('操作成功')}>success</Button>\n            <Button onClick={() => message.error('操作失败')}>error</Button>\n            <Button onClick={() => message.warning('警告信息')}>warning</Button>\n            <Button onClick={() => message.info('提示信息')}>info</Button>\n            <Button\n                onClick={() => {\n                    const id = message.success('5秒后关闭', { duration: 5000 })\n                    setTimeout(() => message.close(id), 2000)\n                }}\n            >\n                提前关闭\n            </Button>\n        </>\n    )\n}\n";
+//#endregion
+export { MessageDemo_default as default };

package/fe/packages/react/ui/components/testPage/demos/core/ModalDemo.d.ts

@@ -0,0 +1,6 @@
+export declare const demoMeta: {
+    title: string;
+    order: number;
+    contentClassName: string;
+};
+export default function ModalDemo(): import("react/jsx-runtime").JSX.Element;

package/fe/packages/react/ui/components/testPage/demos/core/ModalDemo.js

@@ -0,0 +1,61 @@
+import { __exportAll } from "../../../../../../../_virtual/_rolldown/runtime.js";
+import { Button } from "../../../Button/Button.js";
+import { Modal } from "../../../Modal/Modal.js";
+import { modal } from "../../../Modal/ModalManager.js";
+import { message } from "../../../Message/MessageManager.js";
+import "../../../index.js";
+import { useState } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+//#region packages/react/ui/components/testPage/demos/core/ModalDemo.tsx
+var ModalDemo_exports = /* @__PURE__ */ __exportAll({
+	default: () => ModalDemo,
+	demoMeta: () => demoMeta
+});
+var demoMeta = {
+	title: "Modal",
+	order: 15,
+	contentClassName: "flex flex-wrap gap-3 items-start"
+};
+function ModalDemo() {
+	const [open, setOpen] = useState(false);
+	return /* @__PURE__ */ jsxs(Fragment$1, { children: [
+		/* @__PURE__ */ jsx(Button, {
+			onClick: () => setOpen(true),
+			children: "JSX Modal"
+		}),
+		/* @__PURE__ */ jsx(Button, {
+			onClick: () => modal.open({
+				title: "命令式弹窗",
+				content: /* @__PURE__ */ jsx("p", { children: "这是命令式打开的弹窗内容。" })
+			}),
+			children: "modal.open"
+		}),
+		/* @__PURE__ */ jsx(Button, {
+			onClick: () => modal.confirm({
+				title: "确认操作",
+				content: "确定要执行此操作吗？",
+				onOk: () => {
+					message.success("已确认");
+				},
+				onCancel: () => {
+					message.info("已取消");
+				}
+			}),
+			children: "modal.confirm"
+		}),
+		/* @__PURE__ */ jsxs(Modal, {
+			open,
+			onClose: () => setOpen(false),
+			title: "JSX 弹窗",
+			children: [/* @__PURE__ */ jsx("p", { children: "这是一个使用 JSX 控制的弹窗。" }), /* @__PURE__ */ jsx("div", {
+				className: "mt-4 flex justify-end gap-2",
+				children: /* @__PURE__ */ jsx(Button, {
+					onClick: () => setOpen(false),
+					children: "关闭"
+				})
+			})]
+		})
+	] });
+}
+//#endregion
+export { ModalDemo_exports, ModalDemo as default, demoMeta };

package/fe/packages/react/ui/components/testPage/demos/core/ModalDemo2.js

@@ -0,0 +1,4 @@
+//#region packages/react/ui/components/testPage/demos/core/ModalDemo.tsx?raw
+var ModalDemo_default = "import {\n    message,\n    Button,\n    Modal,\n    modal\n} from '@tc/ui-react/components'\nimport { useState } from 'react'\nimport type { DemoMeta } from '../../types'\n\nexport const demoMeta = {\n    title: 'Modal',\n    order: 15,\n    contentClassName: 'flex flex-wrap gap-3 items-start',\n} satisfies DemoMeta\n\n// ─── Modal ───────────────────────────────────────────────────────────────────\n\nexport default function ModalDemo() {\n    const [open, setOpen] = useState(false)\n    return (\n        <>\n            <Button onClick={() => setOpen(true)}>JSX Modal</Button>\n            <Button\n                onClick={() =>\n                    modal.open({\n                        title: '命令式弹窗',\n                        content: <p>这是命令式打开的弹窗内容。</p>,\n                    })\n                }\n            >\n                modal.open\n            </Button>\n            <Button\n                onClick={() =>\n                    modal.confirm({\n                        title: '确认操作',\n                        content: '确定要执行此操作吗？',\n                        onOk: () => {\n                            message.success('已确认')\n                        },\n                        onCancel: () => {\n                            message.info('已取消')\n                        },\n                    })\n                }\n            >\n                modal.confirm\n            </Button>\n\n            <Modal open={open} onClose={() => setOpen(false)} title=\"JSX 弹窗\">\n                <p>这是一个使用 JSX 控制的弹窗。</p>\n                <div className=\"mt-4 flex justify-end gap-2\">\n                    <Button onClick={() => setOpen(false)}>关闭</Button>\n                </div>\n            </Modal>\n        </>\n    )\n}\n";
+//#endregion
+export { ModalDemo_default as default };

package/fe/packages/react/ui/components/testPage/demos/core/NotificationDemo.d.ts

@@ -0,0 +1,6 @@
+export declare const demoMeta: {
+    title: string;
+    order: number;
+    contentClassName: string;
+};
+export default function NotificationDemo(): import("react/jsx-runtime").JSX.Element;

package/fe/packages/react/ui/components/testPage/demos/core/NotificationDemo.js

@@ -0,0 +1,50 @@
+import { __exportAll } from "../../../../../../../_virtual/_rolldown/runtime.js";
+import { Notification } from "../../../Notification/Notification.js";
+import "../../../index.js";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+//#region packages/react/ui/components/testPage/demos/core/NotificationDemo.tsx
+var NotificationDemo_exports = /* @__PURE__ */ __exportAll({
+	default: () => NotificationDemo,
+	demoMeta: () => demoMeta
+});
+var demoMeta = {
+	title: "Notification",
+	order: 13,
+	contentClassName: "flex flex-wrap gap-3 items-start"
+};
+function NotificationDemo() {
+	return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs("div", {
+		className: "w-full space-y-3",
+		children: [
+			/* @__PURE__ */ jsx(Notification, {
+				type: "info",
+				title: "信息提示",
+				message: "这是一条普通信息通知。"
+			}),
+			/* @__PURE__ */ jsx(Notification, {
+				type: "success",
+				title: "操作成功",
+				message: "数据已成功保存。"
+			}),
+			/* @__PURE__ */ jsx(Notification, {
+				type: "warning",
+				title: "警告",
+				message: "请注意检查配置项是否正确。"
+			}),
+			/* @__PURE__ */ jsx(Notification, {
+				type: "error",
+				title: "错误",
+				message: "请求失败，请稍后重试。",
+				closable: false
+			}),
+			/* @__PURE__ */ jsx(Notification, {
+				type: "info",
+				title: "不自动关闭",
+				message: "此通知需要手动关闭。",
+				duration: 0
+			})
+		]
+	}) });
+}
+//#endregion
+export { NotificationDemo_exports, NotificationDemo as default, demoMeta };

package/fe/packages/react/ui/components/testPage/demos/core/NotificationDemo2.js

@@ -0,0 +1,4 @@
+//#region packages/react/ui/components/testPage/demos/core/NotificationDemo.tsx?raw
+var NotificationDemo_default = "import { Notification } from '@tc/ui-react/components'\nimport type { DemoMeta } from '../../types'\n\nexport const demoMeta = {\n    title: 'Notification',\n    order: 13,\n    contentClassName: 'flex flex-wrap gap-3 items-start',\n} satisfies DemoMeta\n\n// ─── Notification ────────────────────────────────────────────────────────────\n\nexport default function NotificationDemo() {\n    return (\n        <>\n            <div className=\"w-full space-y-3\">\n                <Notification type=\"info\" title=\"信息提示\" message=\"这是一条普通信息通知。\" />\n                <Notification type=\"success\" title=\"操作成功\" message=\"数据已成功保存。\" />\n                <Notification type=\"warning\" title=\"警告\" message=\"请注意检查配置项是否正确。\" />\n                <Notification type=\"error\" title=\"错误\" message=\"请求失败，请稍后重试。\" closable={false} />\n                <Notification type=\"info\" title=\"不自动关闭\" message=\"此通知需要手动关闭。\" duration={0} />\n            </div>\n        </>\n    )\n}\n";
+//#endregion
+export { NotificationDemo_default as default };

package/fe/packages/react/ui/components/testPage/demos/core/PaginationDemo.d.ts

@@ -0,0 +1,6 @@
+export declare const demoMeta: {
+    title: string;
+    order: number;
+    contentClassName: string;
+};
+export default function PaginationDemo(): import("react/jsx-runtime").JSX.Element;

package/fe/packages/react/ui/components/testPage/demos/core/PaginationDemo.js

@@ -0,0 +1,39 @@
+import { __exportAll } from "../../../../../../../_virtual/_rolldown/runtime.js";
+import { Pagination } from "../../../Pagination/Pagination.js";
+import "../../../index.js";
+import { useState } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+//#region packages/react/ui/components/testPage/demos/core/PaginationDemo.tsx
+var PaginationDemo_exports = /* @__PURE__ */ __exportAll({
+	default: () => PaginationDemo,
+	demoMeta: () => demoMeta
+});
+var demoMeta = {
+	title: "Pagination",
+	order: 18,
+	contentClassName: "flex flex-wrap gap-3 items-start"
+};
+function PaginationDemo() {
+	const [page, setPage] = useState(1);
+	const [pageSize, setPageSize] = useState(10);
+	return /* @__PURE__ */ jsx(Fragment$1, { children: /* @__PURE__ */ jsxs("div", {
+		className: "w-full",
+		children: [/* @__PURE__ */ jsxs("p", {
+			className: "text-sm mb-2",
+			children: [
+				"当前页: ",
+				page,
+				" / 每页: ",
+				pageSize
+			]
+		}), /* @__PURE__ */ jsx(Pagination, {
+			current: page,
+			pageSize,
+			total: 238,
+			onChange: setPage,
+			onPageSizeChange: setPageSize
+		})]
+	}) });
+}
+//#endregion
+export { PaginationDemo_exports, PaginationDemo as default, demoMeta };

package/fe/packages/react/ui/components/testPage/demos/core/PaginationDemo2.js

@@ -0,0 +1,4 @@
+//#region packages/react/ui/components/testPage/demos/core/PaginationDemo.tsx?raw
+var PaginationDemo_default = "import { Pagination } from '@tc/ui-react/components'\nimport { useState } from 'react'\nimport type { DemoMeta } from '../../types'\n\nexport const demoMeta = {\n    title: 'Pagination',\n    order: 18,\n    contentClassName: 'flex flex-wrap gap-3 items-start',\n} satisfies DemoMeta\n\n// ─── Pagination ───────────────────────────────────────────────────────────────\n\nexport default function PaginationDemo() {\n    const [page, setPage] = useState(1)\n    const [pageSize, setPageSize] = useState(10)\n    return (\n        <>\n            <div className=\"w-full\">\n                <p className=\"text-sm mb-2\">\n                    当前页: {page} / 每页: {pageSize}\n                </p>\n                <Pagination\n                    current={page}\n                    pageSize={pageSize}\n                    total={238}\n                    onChange={setPage}\n                    onPageSizeChange={setPageSize}\n                />\n            </div>\n        </>\n    )\n}\n";
+//#endregion
+export { PaginationDemo_default as default };

package/fe/packages/react/ui/components/testPage/demos/core/PreviewImageDemo.d.ts

@@ -0,0 +1,6 @@
+export declare const demoMeta: {
+    title: string;
+    order: number;
+    contentClassName: string;
+};
+export default function PreviewImageDemo(): import("react/jsx-runtime").JSX.Element;

package/fe/packages/react/ui/components/testPage/demos/core/PreviewImageDemo.js

@@ -0,0 +1,22 @@
+import { __exportAll } from "../../../../../../../_virtual/_rolldown/runtime.js";
+import { PreviewImage } from "../../../ImagePreview/PreviewImage.js";
+import "../../../index.js";
+import { Fragment, jsx } from "react/jsx-runtime";
+//#region packages/react/ui/components/testPage/demos/core/PreviewImageDemo.tsx
+var PreviewImageDemo_exports = /* @__PURE__ */ __exportAll({
+	default: () => PreviewImageDemo,
+	demoMeta: () => demoMeta
+});
+var demoMeta = {
+	title: "PreviewImage",
+	order: 32,
+	contentClassName: "flex flex-wrap gap-3 items-start"
+};
+function PreviewImageDemo() {
+	return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(PreviewImage, {
+		images: ["https://images.unsplash.com/photo-1778512828600-4a6540a1a115?w=900&auto=format&fit=crop&q=60&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxmZWF0dXJlZC1waG90b3MtZmVlZHw0fHx8ZW58MHx8fHx8", "https://images.unsplash.com/photo-1778392120781-a6b2b55dc12a?w=900&auto=format&fit=crop&q=60&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxmZWF0dXJlZC1waG90b3MtZmVlZHwyNnx8fGVufDB8fHx8fA%3D%3D"],
+		initialIndex: 0
+	}) });
+}
+//#endregion
+export { PreviewImageDemo_exports, PreviewImageDemo as default, demoMeta };

package/fe/packages/react/ui/components/testPage/demos/core/PreviewImageDemo2.js

@@ -0,0 +1,4 @@
+//#region packages/react/ui/components/testPage/demos/core/PreviewImageDemo.tsx?raw
+var PreviewImageDemo_default = "import { PreviewImage } from '@tc/ui-react/components'\nimport type { DemoMeta } from '../../types'\n\nexport const demoMeta = {\n    title: 'PreviewImage',\n    order: 32,\n    contentClassName: 'flex flex-wrap gap-3 items-start',\n} satisfies DemoMeta\n\n// ─── PreviewImage ─────────────────────────────────────────────────────────────\n\nexport default function PreviewImageDemo() {\n    const images = [\n        'https://images.unsplash.com/photo-1778512828600-4a6540a1a115?w=900&auto=format&fit=crop&q=60&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxmZWF0dXJlZC1waG90b3MtZmVlZHw0fHx8ZW58MHx8fHx8',\n        'https://images.unsplash.com/photo-1778392120781-a6b2b55dc12a?w=900&auto=format&fit=crop&q=60&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxmZWF0dXJlZC1waG90b3MtZmVlZHwyNnx8fGVufDB8fHx8fA%3D%3D',\n    ]\n    return (\n        <>\n            <PreviewImage images={images} initialIndex={0} />\n        </>\n    )\n}\n";
+//#endregion
+export { PreviewImageDemo_default as default };

package/fe/packages/react/ui/components/testPage/demos/core/RadioDemo.d.ts

@@ -0,0 +1,6 @@
+export declare const demoMeta: {
+    title: string;
+    order: number;
+    contentClassName: string;
+};
+export default function RadioDemo(): import("react/jsx-runtime").JSX.Element;

package/fe/packages/react/ui/components/testPage/demos/core/RadioDemo.js

@@ -0,0 +1,129 @@
+import { __exportAll } from "../../../../../../../_virtual/_rolldown/runtime.js";
+import { RadioGroup } from "../../../Radio/RadioGroup.js";
+import { Radio } from "../../../Radio/Radio.js";
+import "../../../index.js";
+import { useState } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+//#region packages/react/ui/components/testPage/demos/core/RadioDemo.tsx
+var RadioDemo_exports = /* @__PURE__ */ __exportAll({
+	default: () => RadioDemo,
+	demoMeta: () => demoMeta
+});
+var demoMeta = {
+	title: "Radio",
+	order: 8,
+	contentClassName: "flex flex-wrap gap-3 items-start"
+};
+function RadioDemo() {
+	const [selected, setSelected] = useState("a");
+	const [groupValue, setGroupValue] = useState("green");
+	return /* @__PURE__ */ jsxs(Fragment$1, { children: [
+		/* @__PURE__ */ jsxs("div", {
+			className: "space-y-2",
+			children: [/* @__PURE__ */ jsxs("p", {
+				className: "text-sm text-muted-foreground",
+				children: ["受控: ", selected]
+			}), [
+				{
+					label: "选项 A",
+					value: "a"
+				},
+				{
+					label: "选项 B",
+					value: "b"
+				},
+				{
+					label: "选项 C",
+					value: "c"
+				}
+			].map((opt) => /* @__PURE__ */ jsx(Radio, {
+				name: "demo-radio",
+				label: opt.label,
+				checked: selected === opt.value,
+				onChange: () => setSelected(opt.value)
+			}, opt.value))]
+		}),
+		/* @__PURE__ */ jsxs("div", {
+			className: "space-y-2 ml-8",
+			children: [
+				/* @__PURE__ */ jsx("p", {
+					className: "text-sm text-muted-foreground",
+					children: "非受控默认选中"
+				}),
+				/* @__PURE__ */ jsx(Radio, {
+					name: "demo-radio-2",
+					label: "默认选中",
+					defaultChecked: true
+				}),
+				/* @__PURE__ */ jsx(Radio, {
+					name: "demo-radio-2",
+					label: "禁用状态",
+					disabled: true
+				}),
+				/* @__PURE__ */ jsx(Radio, {
+					name: "demo-radio-2",
+					label: "禁用且选中",
+					disabled: true,
+					defaultChecked: true
+				})
+			]
+		}),
+		/* @__PURE__ */ jsxs("div", {
+			className: "w-full ml-8 space-y-2",
+			children: [/* @__PURE__ */ jsxs("p", {
+				className: "text-sm text-muted-foreground",
+				children: ["RadioGroup 垂直布局: ", groupValue]
+			}), /* @__PURE__ */ jsxs(RadioGroup, {
+				name: "demo-group",
+				value: groupValue,
+				onChange: setGroupValue,
+				children: [
+					/* @__PURE__ */ jsx(Radio, {
+						value: "default",
+						label: "默认主题"
+					}),
+					/* @__PURE__ */ jsx(Radio, {
+						value: "green",
+						label: "绿色主题"
+					}),
+					/* @__PURE__ */ jsx(Radio, {
+						value: "gray",
+						label: "灰色主题"
+					})
+				]
+			})]
+		}),
+		/* @__PURE__ */ jsxs("div", {
+			className: "w-full ml-8 space-y-2",
+			children: [/* @__PURE__ */ jsx("p", {
+				className: "text-sm text-muted-foreground",
+				children: "RadioGroup 水平布局 (非受控)"
+			}), /* @__PURE__ */ jsxs(RadioGroup, {
+				name: "demo-group-2",
+				defaultValue: "b",
+				direction: "horizontal",
+				children: [
+					/* @__PURE__ */ jsx(Radio, {
+						value: "a",
+						label: "选项 A"
+					}),
+					/* @__PURE__ */ jsx(Radio, {
+						value: "b",
+						label: "选项 B"
+					}),
+					/* @__PURE__ */ jsx(Radio, {
+						value: "c",
+						label: "选项 C"
+					}),
+					/* @__PURE__ */ jsx(Radio, {
+						value: "d",
+						label: "禁用选项",
+						disabled: true
+					})
+				]
+			})]
+		})
+	] });
+}
+//#endregion
+export { RadioDemo_exports, RadioDemo as default, demoMeta };

package/fe/packages/react/ui/components/testPage/demos/core/RadioDemo2.js

@@ -0,0 +1,4 @@
+//#region packages/react/ui/components/testPage/demos/core/RadioDemo.tsx?raw
+var RadioDemo_default = "import {\n    Radio,\n    RadioGroup\n} from '@tc/ui-react/components'\nimport { useState } from 'react'\nimport type { DemoMeta } from '../../types'\n\nexport const demoMeta = {\n    title: 'Radio',\n    order: 8,\n    contentClassName: 'flex flex-wrap gap-3 items-start',\n} satisfies DemoMeta\n\n// ─── Radio ───────────────────────────────────────────────────────────────────\n\nexport default function RadioDemo() {\n    const [selected, setSelected] = useState('a')\n    const [groupValue, setGroupValue] = useState('green')\n    const options = [\n        { label: '选项 A', value: 'a' },\n        { label: '选项 B', value: 'b' },\n        { label: '选项 C', value: 'c' },\n    ]\n    return (\n        <>\n            <div className=\"space-y-2\">\n                <p className=\"text-sm text-muted-foreground\">受控: {selected}</p>\n                {options.map((opt) => (\n                    <Radio\n                        key={opt.value}\n                        name=\"demo-radio\"\n                        label={opt.label}\n                        checked={selected === opt.value}\n                        onChange={() => setSelected(opt.value)}\n                    />\n                ))}\n            </div>\n            <div className=\"space-y-2 ml-8\">\n                <p className=\"text-sm text-muted-foreground\">非受控默认选中</p>\n                <Radio name=\"demo-radio-2\" label=\"默认选中\" defaultChecked />\n                <Radio name=\"demo-radio-2\" label=\"禁用状态\" disabled />\n                <Radio name=\"demo-radio-2\" label=\"禁用且选中\" disabled defaultChecked />\n            </div>\n            <div className=\"w-full ml-8 space-y-2\">\n                <p className=\"text-sm text-muted-foreground\">RadioGroup 垂直布局: {groupValue}</p>\n                <RadioGroup name=\"demo-group\" value={groupValue} onChange={setGroupValue}>\n                    <Radio value=\"default\" label=\"默认主题\" />\n                    <Radio value=\"green\" label=\"绿色主题\" />\n                    <Radio value=\"gray\" label=\"灰色主题\" />\n                </RadioGroup>\n            </div>\n            <div className=\"w-full ml-8 space-y-2\">\n                <p className=\"text-sm text-muted-foreground\">RadioGroup 水平布局 (非受控)</p>\n                <RadioGroup name=\"demo-group-2\" defaultValue=\"b\" direction=\"horizontal\">\n                    <Radio value=\"a\" label=\"选项 A\" />\n                    <Radio value=\"b\" label=\"选项 B\" />\n                    <Radio value=\"c\" label=\"选项 C\" />\n                    <Radio value=\"d\" label=\"禁用选项\" disabled />\n                </RadioGroup>\n            </div>\n        </>\n    )\n}\n";
+//#endregion
+export { RadioDemo_default as default };

package/fe/packages/react/ui/components/testPage/demos/core/SchemaFormDemo.d.ts

@@ -0,0 +1,6 @@
+export declare const demoMeta: {
+    title: string;
+    order: number;
+    contentClassName: string;
+};
+export default function SchemaFormDemo(): import("react/jsx-runtime").JSX.Element;

package/fe/packages/react/ui/components/testPage/demos/core/SchemaFormDemo.js

@@ -0,0 +1,52 @@
+import { __exportAll } from "../../../../../../../_virtual/_rolldown/runtime.js";
+import { SchemaForm } from "../../../Form/SchemaForm/index.js";
+import "../../../index.js";
+import { useRef } from "react";
+import { Fragment as Fragment$1, jsx } from "react/jsx-runtime";
+//#region packages/react/ui/components/testPage/demos/core/SchemaFormDemo.tsx
+var SchemaFormDemo_exports = /* @__PURE__ */ __exportAll({
+	default: () => SchemaFormDemo,
+	demoMeta: () => demoMeta
+});
+var demoMeta = {
+	title: "SchemaForm",
+	order: 28,
+	contentClassName: "flex flex-wrap gap-3 items-start"
+};
+function SchemaFormDemo() {
+	const form = useRef(void 0);
+	return /* @__PURE__ */ jsx(Fragment$1, { children: /* @__PURE__ */ jsx(SchemaForm, {
+		layout: "horizontal",
+		getForm: (f) => {
+			form.current = f;
+		},
+		schemas: [{
+			key: "username",
+			label: "用户名",
+			type: "input",
+			required: true,
+			rules: [{
+				required: true,
+				message: "请输入用户名"
+			}],
+			fieldProps: { placeholder: "请输入用户名" }
+		}, {
+			key: "role",
+			label: "角色",
+			type: "select",
+			fieldProps: {
+				placeholder: "请选择",
+				options: [{
+					label: "管理员",
+					value: "admin"
+				}, {
+					label: "用户",
+					value: "user"
+				}]
+			}
+		}],
+		onFinish: (values) => console.log(values)
+	}) });
+}
+//#endregion
+export { SchemaFormDemo_exports, SchemaFormDemo as default, demoMeta };

package/fe/packages/react/ui/components/testPage/demos/core/SchemaFormDemo2.js

@@ -0,0 +1,4 @@
+//#region packages/react/ui/components/testPage/demos/core/SchemaFormDemo.tsx?raw
+var SchemaFormDemo_default = "import {\n\n    SchemaForm,\n    type FormInstance\n} from '@tc/ui-react/components'\nimport { useRef } from 'react'\nimport type { DemoMeta } from '../../types'\n\nexport const demoMeta = {\n    title: 'SchemaForm',\n    order: 28,\n    contentClassName: 'flex flex-wrap gap-3 items-start',\n} satisfies DemoMeta\n\n// ─── SchemaForm ───────────────────────────────────────────────────────────────\n\nexport default function SchemaFormDemo() {\n    const form = useRef<FormInstance | undefined>(undefined)\n    return (\n        <>\n            <SchemaForm\n                layout=\"horizontal\"\n                getForm={(f) => {\n                    form.current = f\n                }}\n                schemas={[\n                    {\n                        key: 'username',\n                        label: '用户名',\n                        type: 'input',\n                        required: true,\n                        rules: [{ required: true, message: '请输入用户名' }],\n                        fieldProps: { placeholder: '请输入用户名' },\n                    },\n                    {\n                        key: 'role',\n                        label: '角色',\n                        type: 'select',\n                        fieldProps: {\n                            placeholder: '请选择',\n                            options: [\n                                { label: '管理员', value: 'admin' },\n                                { label: '用户', value: 'user' },\n                            ],\n                        },\n                    },\n                ]}\n                onFinish={(values) => console.log(values)}\n            />\n        </>\n    )\n}\n";
+//#endregion
+export { SchemaFormDemo_default as default };

package/fe/packages/react/ui/components/testPage/demos/core/SearchDemo.d.ts

@@ -0,0 +1,6 @@
+export declare const demoMeta: {
+    title: string;
+    order: number;
+    contentClassName: string;
+};
+export default function SearchDemo(): import("react/jsx-runtime").JSX.Element;

package/fe/packages/react/ui/components/testPage/demos/core/SearchDemo.js

@@ -0,0 +1,52 @@
+import { __exportAll } from "../../../../../../../_virtual/_rolldown/runtime.js";
+import { Button } from "../../../Button/Button.js";
+import Search from "../../../Search/Search.js";
+import "../../../index.js";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+//#region packages/react/ui/components/testPage/demos/core/SearchDemo.tsx
+var SearchDemo_exports = /* @__PURE__ */ __exportAll({
+	default: () => SearchDemo,
+	demoMeta: () => demoMeta
+});
+var demoMeta = {
+	title: "Search",
+	order: 21,
+	contentClassName: "flex flex-wrap gap-3 items-start"
+};
+function SearchDemo() {
+	return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx("div", {
+		className: "w-full",
+		children: /* @__PURE__ */ jsxs(Search, {
+			schemas: [{
+				type: "input",
+				key: "keyword",
+				label: "关键字",
+				fieldProps: { placeholder: "请输入" }
+			}, {
+				type: "select",
+				key: "status",
+				label: "状态",
+				fieldProps: {
+					options: [{
+						label: "正常",
+						value: "active"
+					}, {
+						label: "禁用",
+						value: "disabled"
+					}],
+					placeholder: "请选择"
+				}
+			}],
+			children: [/* @__PURE__ */ jsx(Button, {
+				type: "submit",
+				variant: "primary",
+				children: "搜索"
+			}), /* @__PURE__ */ jsx(Button, {
+				type: "reset",
+				children: "重置"
+			})]
+		})
+	}) });
+}
+//#endregion
+export { SearchDemo_exports, SearchDemo as default, demoMeta };

package/fe/packages/react/ui/components/testPage/demos/core/SearchDemo2.js

@@ -0,0 +1,4 @@
+//#region packages/react/ui/components/testPage/demos/core/SearchDemo.tsx?raw
+var SearchDemo_default = "import {\n    Button,\n    Search\n} from '@tc/ui-react/components'\nimport type { DemoMeta } from '../../types'\n\nexport const demoMeta = {\n    title: 'Search',\n    order: 21,\n    contentClassName: 'flex flex-wrap gap-3 items-start',\n} satisfies DemoMeta\n\n// ─── Search ───────────────────────────────────────────────────────────────────\n\nexport default function SearchDemo() {\n    type SearchForm = { keyword: string; status: string }\n    return (\n        <>\n            <div className=\"w-full\">\n                <Search<SearchForm>\n                    schemas={[\n                        { type: 'input', key: 'keyword', label: '关键字', fieldProps: { placeholder: '请输入' } },\n                        {\n                            type: 'select',\n                            key: 'status',\n                            label: '状态',\n                            fieldProps: {\n                                options: [\n                                    { label: '正常', value: 'active' },\n                                    { label: '禁用', value: 'disabled' },\n                                ],\n                                placeholder: '请选择',\n                            },\n                        },\n                    ]}\n                >\n                    <Button type=\"submit\" variant=\"primary\">\n                        搜索\n                    </Button>\n                    <Button type=\"reset\">重置</Button>\n                </Search>\n            </div>\n        </>\n    )\n}\n";
+//#endregion
+export { SearchDemo_default as default };

package/fe/packages/react/ui/components/testPage/demos/core/SelectDemo.d.ts

@@ -0,0 +1,6 @@
+export declare const demoMeta: {
+    title: string;
+    order: number;
+    contentClassName: string;
+};
+export default function SelectDemo(): import("react/jsx-runtime").JSX.Element;