@_tc/template-core 0.2.1 → 0.2.2

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

@@ -0,0 +1,243 @@
+import { __exportAll } from "../../../../../../../_virtual/_rolldown/runtime.js";
+import { DataTable } from "../../../DataTable/index.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/DataTableDemo.tsx
+var DataTableDemo_exports = /* @__PURE__ */ __exportAll({
+	default: () => DataTableDemo,
+	demoMeta: () => demoMeta
+});
+var demoMeta = {
+	title: "DataTable",
+	order: 20,
+	contentClassName: "flex flex-wrap gap-3 items-start"
+};
+function DataTableDemo() {
+	const [selectedKeys, setSelectedKeys] = useState([]);
+	return /* @__PURE__ */ jsx(Fragment$1, { children: /* @__PURE__ */ jsxs("div", {
+		className: "w-full",
+		children: [/* @__PURE__ */ jsxs("p", {
+			className: "text-sm mb-2",
+			children: ["已选: ", JSON.stringify(selectedKeys)]
+		}), /* @__PURE__ */ jsx(DataTable, {
+			columns: [
+				{
+					key: "id",
+					title: "ID",
+					width: "60px"
+				},
+				{
+					key: "name",
+					title: "姓名"
+				},
+				{
+					key: "role1",
+					title: "角色1",
+					dataIndex: "role",
+					fixed: "left"
+				},
+				{
+					key: "status1",
+					title: "状态1",
+					dataIndex: "status",
+					fixed: "left"
+				},
+				{
+					key: "role2",
+					title: "角色2",
+					dataIndex: "role"
+				},
+				{
+					key: "status2",
+					title: "状态2",
+					dataIndex: "status"
+				},
+				{
+					key: "role3",
+					title: "角色3",
+					dataIndex: "role"
+				},
+				{
+					key: "status3",
+					title: "状态3",
+					dataIndex: "status"
+				},
+				{
+					key: "role4",
+					title: "角色4",
+					dataIndex: "role"
+				},
+				{
+					key: "status4",
+					title: "状态4",
+					dataIndex: "status"
+				},
+				{
+					key: "role5",
+					title: "角色5",
+					dataIndex: "role"
+				},
+				{
+					key: "status5",
+					title: "状态5",
+					dataIndex: "status"
+				},
+				{
+					key: "role6",
+					title: "角色6",
+					dataIndex: "role"
+				},
+				{
+					key: "status6",
+					title: "状态6",
+					dataIndex: "status"
+				},
+				{
+					key: "role7",
+					title: "角色",
+					dataIndex: "role",
+					fixed: "right"
+				},
+				{
+					key: "status7",
+					title: "状态",
+					dataIndex: "status"
+				},
+				{
+					key: "action",
+					title: "操作",
+					width: "96px",
+					actionOverflow: "dropdown",
+					actions: (_, record) => [
+						{
+							key: "edit",
+							label: "修改",
+							onClick: () => console.log("edit", record.id)
+						},
+						{
+							key: "view",
+							label: "查看",
+							onClick: () => console.log("view", record.id)
+						},
+						{
+							key: "delete",
+							label: "删除",
+							danger: true,
+							onClick: () => console.log("delete", record.id)
+						}
+					]
+				}
+			],
+			data: [
+				{
+					id: 1,
+					name: "张三",
+					role: "管理员",
+					role7: "管理员",
+					role6: "管理员",
+					role5: "管理员",
+					role4: "管理员",
+					role3: "管理员",
+					role2: "管理员",
+					role1: "管理员",
+					status: "正常",
+					status7: "正常",
+					status6: "正常",
+					status5: "正常",
+					status4: "正常",
+					status3: "正常",
+					status2: "正常",
+					status1: "正常"
+				},
+				{
+					id: 2,
+					name: "李四",
+					role: "用户",
+					role7: "用户",
+					role6: "用户",
+					role5: "用户",
+					role4: "用户",
+					role3: "用户",
+					role2: "用户",
+					role1: "用户",
+					status: "禁用",
+					status7: "禁用",
+					status6: "禁用",
+					status5: "禁用",
+					status4: "禁用",
+					status3: "禁用",
+					status2: "禁用",
+					status1: "禁用"
+				},
+				{
+					id: 3,
+					name: "王五",
+					role: "审计员",
+					role7: "审计员",
+					role6: "审计员",
+					role5: "审计员",
+					role4: "审计员",
+					role3: "审计员",
+					role2: "审计员",
+					role1: "审计员",
+					status: "正常",
+					status7: "正常",
+					status6: "正常",
+					status5: "正常",
+					status4: "正常",
+					status3: "正常",
+					status2: "正常",
+					status1: "正常"
+				},
+				{
+					id: 4,
+					name: "赵六",
+					role: "用户",
+					role7: "用户",
+					role6: "用户",
+					role5: "用户",
+					role4: "用户",
+					role3: "用户",
+					role2: "用户",
+					role1: "用户",
+					status: "正常",
+					status7: "正常",
+					status6: "正常",
+					status5: "正常",
+					status4: "正常",
+					status3: "正常",
+					status2: "正常",
+					status1: "正常"
+				},
+				{
+					id: 5,
+					name: "孙七",
+					role: "用户",
+					role7: "用户",
+					role6: "用户",
+					role5: "用户",
+					role4: "用户",
+					role3: "用户",
+					role2: "用户",
+					role1: "用户",
+					status: "正常",
+					status7: "正常",
+					status6: "正常",
+					status5: "正常",
+					status4: "正常",
+					status3: "正常",
+					status2: "正常",
+					status1: "正常"
+				}
+			],
+			rowKey: "id",
+			rowSelection: {
+				selectedRowKeys: selectedKeys,
+				onChange: (keys) => setSelectedKeys(keys)
+			}
+		})]
+	}) });
+}
+//#endregion
+export { DataTableDemo_exports, DataTableDemo as default, demoMeta };

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

@@ -0,0 +1,4 @@
+//#region packages/react/ui/components/testPage/demos/core/DataTableDemo.tsx?raw
+var DataTableDemo_default = "import {\n    DataTable,\n    type TableColumnDef\n} from '@tc/ui-react/components'\nimport { useState } from 'react'\nimport type { DemoMeta } from '../../types'\n\nexport const demoMeta = {\n    title: 'DataTable',\n    order: 20,\n    contentClassName: 'flex flex-wrap gap-3 items-start',\n} satisfies DemoMeta\n\n// ─── DataTable ───────────────────────────────────────────────────────────────\n\ntype User = {\n    id: number\n    name: string\n    role: string\n    role1: string\n    role2: string\n    role3: string\n    role4: string\n    role5: string\n    role6: string\n    role7: string\n    status: string\n    status1: string\n    status2: string\n    status3: string\n    status4: string\n    status5: string\n    status6: string\n    status7: string\n}\n\nexport default function DataTableDemo() {\n    const [selectedKeys, setSelectedKeys] = useState<(string | number)[]>([])\n\n    const columns: TableColumnDef<User>[] = [\n        { key: 'id', title: 'ID', width: '60px' },\n        { key: 'name', title: '姓名' },\n        { key: 'role1', title: '角色1', dataIndex: 'role', fixed: 'left' },\n        { key: 'status1', title: '状态1', dataIndex: 'status', fixed: 'left' },\n        { key: 'role2', title: '角色2', dataIndex: 'role' },\n        { key: 'status2', title: '状态2', dataIndex: 'status' },\n        { key: 'role3', title: '角色3', dataIndex: 'role' },\n        { key: 'status3', title: '状态3', dataIndex: 'status' },\n        { key: 'role4', title: '角色4', dataIndex: 'role' },\n        { key: 'status4', title: '状态4', dataIndex: 'status' },\n        { key: 'role5', title: '角色5', dataIndex: 'role' },\n        { key: 'status5', title: '状态5', dataIndex: 'status' },\n        { key: 'role6', title: '角色6', dataIndex: 'role' },\n        { key: 'status6', title: '状态6', dataIndex: 'status' },\n        { key: 'role7', title: '角色', dataIndex: 'role', fixed: 'right' },\n        { key: 'status7', title: '状态', dataIndex: 'status' },\n        {\n            key: 'action',\n            title: '操作',\n            width: '96px',\n            actionOverflow: 'dropdown',\n            actions: (_, record) => [\n                { key: 'edit', label: '修改', onClick: () => console.log('edit', record.id) },\n                { key: 'view', label: '查看', onClick: () => console.log('view', record.id) },\n                { key: 'delete', label: '删除', danger: true, onClick: () => console.log('delete', record.id) },\n            ],\n        },\n    ]\n\n    const data: User[] = [\n        {\n            id: 1,\n            name: '张三',\n            role: '管理员',\n            role7: '管理员',\n            role6: '管理员',\n            role5: '管理员',\n            role4: '管理员',\n            role3: '管理员',\n            role2: '管理员',\n            role1: '管理员',\n            status: '正常',\n            status7: '正常',\n            status6: '正常',\n            status5: '正常',\n            status4: '正常',\n            status3: '正常',\n            status2: '正常',\n            status1: '正常',\n        },\n        {\n            id: 2,\n            name: '李四',\n            role: '用户',\n            role7: '用户',\n            role6: '用户',\n            role5: '用户',\n            role4: '用户',\n            role3: '用户',\n            role2: '用户',\n            role1: '用户',\n            status: '禁用',\n            status7: '禁用',\n            status6: '禁用',\n            status5: '禁用',\n            status4: '禁用',\n            status3: '禁用',\n            status2: '禁用',\n            status1: '禁用',\n        },\n        {\n            id: 3,\n            name: '王五',\n            role: '审计员',\n            role7: '审计员',\n            role6: '审计员',\n            role5: '审计员',\n            role4: '审计员',\n            role3: '审计员',\n            role2: '审计员',\n            role1: '审计员',\n            status: '正常',\n            status7: '正常',\n            status6: '正常',\n            status5: '正常',\n            status4: '正常',\n            status3: '正常',\n            status2: '正常',\n            status1: '正常',\n        },\n        {\n            id: 4,\n            name: '赵六',\n            role: '用户',\n            role7: '用户',\n            role6: '用户',\n            role5: '用户',\n            role4: '用户',\n            role3: '用户',\n            role2: '用户',\n            role1: '用户',\n            status: '正常',\n            status7: '正常',\n            status6: '正常',\n            status5: '正常',\n            status4: '正常',\n            status3: '正常',\n            status2: '正常',\n            status1: '正常',\n        },\n        {\n            id: 5,\n            name: '孙七',\n            role: '用户',\n            role7: '用户',\n            role6: '用户',\n            role5: '用户',\n            role4: '用户',\n            role3: '用户',\n            role2: '用户',\n            role1: '用户',\n            status: '正常',\n            status7: '正常',\n            status6: '正常',\n            status5: '正常',\n            status4: '正常',\n            status3: '正常',\n            status2: '正常',\n            status1: '正常',\n        },\n    ]\n\n    return (\n        <>\n            <div className=\"w-full\">\n                <p className=\"text-sm mb-2\">已选: {JSON.stringify(selectedKeys)}</p>\n                <DataTable\n                    columns={columns}\n                    data={data}\n                    rowKey=\"id\"\n                    rowSelection={{\n                        selectedRowKeys: selectedKeys,\n                        onChange: (keys) => setSelectedKeys(keys),\n                    }}\n                />\n            </div>\n        </>\n    )\n}\n";
+//#endregion
+export { DataTableDemo_default as default };

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

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

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

@@ -0,0 +1,105 @@
+import { __exportAll } from "../../../../../../../_virtual/_rolldown/runtime.js";
+import { Button } from "../../../Button/Button.js";
+import { Input } from "../../../Input/Input.js";
+import { Select } from "../../../Select/Select.js";
+import { Drawer } from "../../../Drawer/Drawer.js";
+import { Label } from "../../../Label/Label.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/DrawerDemo.tsx
+var DrawerDemo_exports = /* @__PURE__ */ __exportAll({
+	default: () => DrawerDemo,
+	demoMeta: () => demoMeta
+});
+var demoMeta = {
+	title: "Drawer",
+	order: 16,
+	contentClassName: "flex flex-wrap gap-3 items-start"
+};
+function DrawerDemo() {
+	const [placement, setPlacement] = useState("right");
+	const [open, setOpen] = useState(false);
+	const openDrawer = (nextPlacement) => {
+		setPlacement(nextPlacement);
+		setOpen(true);
+	};
+	return /* @__PURE__ */ jsxs(Fragment$1, { children: [
+		/* @__PURE__ */ jsx(Button, {
+			onClick: () => openDrawer("left"),
+			children: "left"
+		}),
+		/* @__PURE__ */ jsx(Button, {
+			onClick: () => openDrawer("right"),
+			children: "right"
+		}),
+		/* @__PURE__ */ jsx(Button, {
+			onClick: () => openDrawer("top"),
+			children: "top"
+		}),
+		/* @__PURE__ */ jsx(Button, {
+			onClick: () => openDrawer("bottom"),
+			children: "bottom"
+		}),
+		/* @__PURE__ */ jsx(Button, {
+			onClick: () => openDrawer("right"),
+			variant: "primary",
+			children: "打开详情"
+		}),
+		/* @__PURE__ */ jsx(Drawer, {
+			open,
+			onClose: () => setOpen(false),
+			title: `Drawer ${placement}`,
+			placement,
+			width: 420,
+			height: 320,
+			footer: /* @__PURE__ */ jsxs("div", {
+				className: "flex justify-end gap-2",
+				children: [/* @__PURE__ */ jsx(Button, {
+					onClick: () => setOpen(false),
+					children: "取消"
+				}), /* @__PURE__ */ jsx(Button, {
+					variant: "primary",
+					onClick: () => {
+						message.success("已保存");
+						setOpen(false);
+					},
+					children: "保存"
+				})]
+			}),
+			children: /* @__PURE__ */ jsxs("div", {
+				className: "space-y-4",
+				children: [/* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("div", {
+					className: "mb-1 text-sm font-medium text-foreground",
+					children: "外部 children"
+				}), /* @__PURE__ */ jsx("p", {
+					className: "text-sm leading-6 text-muted-foreground",
+					children: "这里的内容完全由调用方定义，可以放表单、列表、详情或任意 JSX。"
+				})] }), /* @__PURE__ */ jsxs("div", {
+					className: "grid gap-3",
+					children: [/* @__PURE__ */ jsx(Label, {
+						label: "名称",
+						layout: "vertical",
+						children: /* @__PURE__ */ jsx(Input, { placeholder: "请输入名称" })
+					}), /* @__PURE__ */ jsx(Label, {
+						label: "状态",
+						layout: "vertical",
+						children: /* @__PURE__ */ jsx(Select, {
+							placeholder: "请选择状态",
+							options: [{
+								label: "启用",
+								value: "enabled"
+							}, {
+								label: "停用",
+								value: "disabled"
+							}]
+						})
+					})]
+				})]
+			})
+		})
+	] });
+}
+//#endregion
+export { DrawerDemo_exports, DrawerDemo as default, demoMeta };

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

@@ -0,0 +1,4 @@
+//#region packages/react/ui/components/testPage/demos/core/DrawerDemo.tsx?raw
+var DrawerDemo_default = "import {\n    message,\n    Button,\n    Drawer,\n    Input,\n    Label,\n    Select\n} from '@tc/ui-react/components'\nimport { useState } from 'react'\nimport type { DemoMeta } from '../../types'\n\nexport const demoMeta = {\n    title: 'Drawer',\n    order: 16,\n    contentClassName: 'flex flex-wrap gap-3 items-start',\n} satisfies DemoMeta\n\n// ─── Drawer ──────────────────────────────────────────────────────────────────\n\nexport default function DrawerDemo() {\n    const [placement, setPlacement] = useState<'top' | 'right' | 'bottom' | 'left'>('right')\n    const [open, setOpen] = useState(false)\n\n    const openDrawer = (nextPlacement: typeof placement) => {\n        setPlacement(nextPlacement)\n        setOpen(true)\n    }\n\n    return (\n        <>\n            <Button onClick={() => openDrawer('left')}>left</Button>\n            <Button onClick={() => openDrawer('right')}>right</Button>\n            <Button onClick={() => openDrawer('top')}>top</Button>\n            <Button onClick={() => openDrawer('bottom')}>bottom</Button>\n            <Button onClick={() => openDrawer('right')} variant=\"primary\">\n                打开详情\n            </Button>\n\n            <Drawer\n                open={open}\n                onClose={() => setOpen(false)}\n                title={`Drawer ${placement}`}\n                placement={placement}\n                width={420}\n                height={320}\n                footer={\n                    <div className=\"flex justify-end gap-2\">\n                        <Button onClick={() => setOpen(false)}>取消</Button>\n                        <Button\n                            variant=\"primary\"\n                            onClick={() => {\n                                message.success('已保存')\n                                setOpen(false)\n                            }}\n                        >\n                            保存\n                        </Button>\n                    </div>\n                }\n            >\n                <div className=\"space-y-4\">\n                    <div>\n                        <div className=\"mb-1 text-sm font-medium text-foreground\">外部 children</div>\n                        <p className=\"text-sm leading-6 text-muted-foreground\">\n                            这里的内容完全由调用方定义，可以放表单、列表、详情或任意 JSX。\n                        </p>\n                    </div>\n\n                    <div className=\"grid gap-3\">\n                        <Label label=\"名称\" layout=\"vertical\">\n                            <Input placeholder=\"请输入名称\" />\n                        </Label>\n                        <Label label=\"状态\" layout=\"vertical\">\n                            <Select\n                                placeholder=\"请选择状态\"\n                                options={[\n                                    { label: '启用', value: 'enabled' },\n                                    { label: '停用', value: 'disabled' },\n                                ]}\n                            />\n                        </Label>\n                    </div>\n                </div>\n            </Drawer>\n        </>\n    )\n}\n";
+//#endregion
+export { DrawerDemo_default as default };

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

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

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

@@ -0,0 +1,48 @@
+import { __exportAll } from "../../../../../../../_virtual/_rolldown/runtime.js";
+import { Button } from "../../../Button/Button.js";
+import { Dropdown } from "../../../Dropdown/Dropdown.js";
+import "../../../index.js";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+//#region packages/react/ui/components/testPage/demos/core/DropdownDemo.tsx
+var DropdownDemo_exports = /* @__PURE__ */ __exportAll({
+	default: () => DropdownDemo,
+	demoMeta: () => demoMeta
+});
+var demoMeta = {
+	title: "Dropdown",
+	order: 11,
+	contentClassName: "flex flex-wrap gap-3 items-start"
+};
+function DropdownDemo() {
+	const items = [
+		{
+			key: "edit",
+			label: "编辑",
+			onClick: () => console.log("edit")
+		},
+		{
+			key: "copy",
+			label: "复制",
+			onClick: () => console.log("copy")
+		},
+		{
+			key: "delete",
+			label: "删除",
+			danger: true,
+			onClick: () => console.log("delete")
+		}
+	];
+	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Dropdown, {
+		items,
+		children: /* @__PURE__ */ jsx(Button, { children: "操作 ▾" })
+	}), /* @__PURE__ */ jsx(Dropdown, {
+		items,
+		placement: "bottom-start",
+		children: /* @__PURE__ */ jsx(Button, {
+			variant: "text",
+			children: "bottom-start ▾"
+		})
+	})] });
+}
+//#endregion
+export { DropdownDemo_exports, DropdownDemo as default, demoMeta };

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

@@ -0,0 +1,4 @@
+//#region packages/react/ui/components/testPage/demos/core/DropdownDemo.tsx?raw
+var DropdownDemo_default = "import {\n    Button,\n    Dropdown\n} from '@tc/ui-react/components'\nimport type { DemoMeta } from '../../types'\n\nexport const demoMeta = {\n    title: 'Dropdown',\n    order: 11,\n    contentClassName: 'flex flex-wrap gap-3 items-start',\n} satisfies DemoMeta\n\n// ─── Dropdown ────────────────────────────────────────────────────────────────\n\nexport default function DropdownDemo() {\n    const items = [\n        { key: 'edit', label: '编辑', onClick: () => console.log('edit') },\n        { key: 'copy', label: '复制', onClick: () => console.log('copy') },\n        { key: 'delete', label: '删除', danger: true, onClick: () => console.log('delete') },\n    ]\n    return (\n        <>\n            <Dropdown items={items}>\n                <Button>操作 ▾</Button>\n            </Dropdown>\n            <Dropdown items={items} placement=\"bottom-start\">\n                <Button variant=\"text\">bottom-start ▾</Button>\n            </Dropdown>\n        </>\n    )\n}\n";
+//#endregion
+export { DropdownDemo_default as default };

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

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

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

@@ -0,0 +1,56 @@
+import { __exportAll } from "../../../../../../../_virtual/_rolldown/runtime.js";
+import { Button } from "../../../Button/Button.js";
+import { Input } from "../../../Input/Input.js";
+import { Form } from "../../../Form/Form.js";
+import { FormItem } from "../../../Form/FormItem.js";
+import { useForm } from "../../../Form/useForm.js";
+import "../../../index.js";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+//#region packages/react/ui/components/testPage/demos/core/FormDemo.tsx
+var FormDemo_exports = /* @__PURE__ */ __exportAll({
+	default: () => FormDemo,
+	demoMeta: () => demoMeta
+});
+var demoMeta = {
+	title: "Form",
+	order: 27,
+	contentClassName: "flex flex-wrap gap-3 items-start"
+};
+function FormDemo() {
+	const [form] = useForm();
+	return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs(Form, {
+		form,
+		onFinish: (v) => console.log("表单值:", v),
+		children: [
+			/* @__PURE__ */ jsx(FormItem, {
+				name: "username",
+				label: "用户名",
+				required: true,
+				rules: [{
+					required: true,
+					message: "请输入用户名"
+				}],
+				children: /* @__PURE__ */ jsx(Input, { placeholder: "请输入用户名" })
+			}),
+			/* @__PURE__ */ jsx(FormItem, {
+				name: "password",
+				label: "密码",
+				required: true,
+				rules: [{
+					required: true,
+					message: "请输入密码"
+				}],
+				children: /* @__PURE__ */ jsx(Input, {
+					type: "password",
+					placeholder: "请输入密码"
+				})
+			}),
+			/* @__PURE__ */ jsx(Button, {
+				type: "submit",
+				children: "提交"
+			})
+		]
+	}) });
+}
+//#endregion
+export { FormDemo_exports, FormDemo as default, demoMeta };

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

@@ -0,0 +1,4 @@
+//#region packages/react/ui/components/testPage/demos/core/FormDemo.tsx?raw
+var FormDemo_default = "import {\n    Button,\n    Form,\n    FormItem,\n    Input,\n    useForm\n} from '@tc/ui-react/components'\nimport type { DemoMeta } from '../../types'\n\nexport const demoMeta = {\n    title: 'Form',\n    order: 27,\n    contentClassName: 'flex flex-wrap gap-3 items-start',\n} satisfies DemoMeta\n\n// ─── Form ─────────────────────────────────────────────────────────────────────\n\nexport default function FormDemo() {\n    const [form] = useForm()\n    return (\n        <>\n            <Form form={form} onFinish={(v) => console.log('表单值:', v)}>\n                <FormItem name=\"username\" label=\"用户名\" required rules={[{ required: true, message: '请输入用户名' }]}>\n                    <Input placeholder=\"请输入用户名\" />\n                </FormItem>\n                <FormItem name=\"password\" label=\"密码\" required rules={[{ required: true, message: '请输入密码' }]}>\n                    <Input type=\"password\" placeholder=\"请输入密码\" />\n                </FormItem>\n                <Button type=\"submit\">提交</Button>\n            </Form>\n        </>\n    )\n}\n";
+//#endregion
+export { FormDemo_default as default };

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

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

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

@@ -0,0 +1,26 @@
+import { __exportAll } from "../../../../../../../_virtual/_rolldown/runtime.js";
+import { ImageUpload } from "../../../Upload/ImageUpload.js";
+import "../../../index.js";
+import { Fragment, jsx } from "react/jsx-runtime";
+//#region packages/react/ui/components/testPage/demos/core/ImageUploadDemo.tsx
+var ImageUploadDemo_exports = /* @__PURE__ */ __exportAll({
+	default: () => ImageUploadDemo,
+	demoMeta: () => demoMeta
+});
+var demoMeta = {
+	title: "ImageUpload",
+	order: 33,
+	contentClassName: "flex flex-wrap gap-3 items-start"
+};
+function ImageUploadDemo() {
+	return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(ImageUpload, {
+		accept: ".jpg,.png",
+		maxCount: 4,
+		beforeChange: (f) => {
+			console.log(f);
+			return parseInt(Math.random() * 10 + "") % 2 === 0;
+		}
+	}) });
+}
+//#endregion
+export { ImageUploadDemo_exports, ImageUploadDemo as default, demoMeta };

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

@@ -0,0 +1,4 @@
+//#region packages/react/ui/components/testPage/demos/core/ImageUploadDemo.tsx?raw
+var ImageUploadDemo_default = "import { ImageUpload } from '@tc/ui-react/components'\nimport type { DemoMeta } from '../../types'\n\nexport const demoMeta = {\n    title: 'ImageUpload',\n    order: 33,\n    contentClassName: 'flex flex-wrap gap-3 items-start',\n} satisfies DemoMeta\n\n// ─── ImageUpload ─────────────────────────────────────────────────────────────\n\nexport default function ImageUploadDemo() {\n    return (\n        <>\n            <ImageUpload\n                accept=\".jpg,.png\"\n                maxCount={4}\n                beforeChange={(f) => {\n                    console.log(f)\n                    return parseInt(Math.random() * 10 + '') % 2 === 0\n                }}\n            />\n        </>\n    )\n}\n";
+//#endregion
+export { ImageUploadDemo_default as default };

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

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

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

@@ -0,0 +1,55 @@
+import { __exportAll } from "../../../../../../../_virtual/_rolldown/runtime.js";
+import { Input } from "../../../Input/Input.js";
+import "../../../index.js";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+//#region packages/react/ui/components/testPage/demos/core/InputDemo.tsx
+var InputDemo_exports = /* @__PURE__ */ __exportAll({
+	default: () => InputDemo,
+	demoMeta: () => demoMeta
+});
+var demoMeta = {
+	title: "Input",
+	order: 3,
+	contentClassName: "flex flex-wrap gap-3 items-start"
+};
+function InputDemo() {
+	return /* @__PURE__ */ jsxs(Fragment, { children: [
+		/* @__PURE__ */ jsx(Input, {
+			placeholder: "普通输入框",
+			className: "w-48"
+		}),
+		/* @__PURE__ */ jsx(Input, {
+			allowClear: true,
+			defaultValue: "可清空内容",
+			placeholder: "清空按钮",
+			className: "w-48"
+		}),
+		/* @__PURE__ */ jsx(Input, {
+			type: "password",
+			placeholder: "密码输入框",
+			className: "w-48"
+		}),
+		/* @__PURE__ */ jsx(Input, {
+			type: "password",
+			defaultValue: "template-core",
+			placeholder: "密码默认值",
+			className: "w-48"
+		}),
+		/* @__PURE__ */ jsx(Input, {
+			type: "password",
+			placeholder: "密码 + addon",
+			addonAfter: /* @__PURE__ */ jsx("span", {
+				className: "text-xs text-muted-foreground",
+				children: "PWD"
+			}),
+			className: "w-56"
+		}),
+		/* @__PURE__ */ jsx(Input, {
+			disabled: true,
+			placeholder: "禁用状态",
+			className: "w-48"
+		})
+	] });
+}
+//#endregion
+export { InputDemo_exports, InputDemo as default, demoMeta };

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

@@ -0,0 +1,4 @@
+//#region packages/react/ui/components/testPage/demos/core/InputDemo.tsx?raw
+var InputDemo_default = "import { Input } from '@tc/ui-react/components'\nimport type { DemoMeta } from '../../types'\n\nexport const demoMeta = {\n    title: 'Input',\n    order: 3,\n    contentClassName: 'flex flex-wrap gap-3 items-start',\n} satisfies DemoMeta\n\n// ─── Input ───────────────────────────────────────────────────────────────────\n\nexport default function InputDemo() {\n    return (\n        <>\n            <Input placeholder=\"普通输入框\" className=\"w-48\" />\n            <Input allowClear defaultValue=\"可清空内容\" placeholder=\"清空按钮\" className=\"w-48\" />\n            <Input type=\"password\" placeholder=\"密码输入框\" className=\"w-48\" />\n            <Input type=\"password\" defaultValue=\"template-core\" placeholder=\"密码默认值\" className=\"w-48\" />\n            <Input\n                type=\"password\"\n                placeholder=\"密码 + addon\"\n                addonAfter={<span className=\"text-xs text-muted-foreground\">PWD</span>}\n                className=\"w-56\"\n            />\n            <Input disabled placeholder=\"禁用状态\" className=\"w-48\" />\n        </>\n    )\n}\n";
+//#endregion
+export { InputDemo_default as default };

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

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