@_tc/template-core 0.1.16 → 0.2.0-bate.1

package/fe/packages/react/ui/components/testPage/index.js

@@ -0,0 +1,1638 @@
+import { Loading } from "../Loading/Loading.js";
+import { Button } from "../Button/Button.js";
+import { Breadcrumb, BreadcrumbItem, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator } from "../breadcrumb/breadcrumb.js";
+import { Card } from "../Card/Card.js";
+import { Checkbox } from "../Checkbox/Checkbox.js";
+import { Modal } from "../Modal/Modal.js";
+import { modal } from "../Modal/ModalManager.js";
+import { ConfirmDialog } from "../ConfirmDialog/ConfirmDialog.js";
+import { Input } from "../Input/Input.js";
+import { Select } from "../Select/Select.js";
+import { Pagination } from "../Pagination/Pagination.js";
+import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "../table/table.js";
+import { Skeleton } from "../Skeleton/Skeleton.js";
+import { Dropdown } from "../Dropdown/Dropdown.js";
+import { DataTable } from "../DataTable/index.js";
+import { Drawer } from "../Drawer/Drawer.js";
+import { Form } from "../Form/Form.js";
+import { Label } from "../Label/Label.js";
+import { FormItem } from "../Form/FormItem.js";
+import { useForm } from "../Form/useForm.js";
+import { SchemaForm } from "../Form/SchemaForm/index.js";
+import { PreviewImage } from "../ImagePreview/PreviewImage.js";
+import { InputNumber } from "../InputNumber/InputNumber.js";
+import { Layout } from "../Layout/Layout.js";
+import { message } from "../Message/MessageManager.js";
+import { Notification } from "../Notification/Notification.js";
+import { RadioGroup } from "../Radio/RadioGroup.js";
+import { Radio } from "../Radio/Radio.js";
+import Search from "../Search/Search.js";
+import { Switch } from "../Switch/Switch.js";
+import TableSearch from "../TableSearch/TableSearch.js";
+import { Tabs } from "../Tabs/Tabs.js";
+import { Textarea } from "../Textarea/Textarea.js";
+import { Tooltip } from "../Tooltip/Tooltip.js";
+import { TreeSelect } from "../TreeSelect/TreeSelect.js";
+import { ImageUpload } from "../Upload/ImageUpload.js";
+import "../index.js";
+import DateTestPage from "../Date/DateTestPage.js";
+import MenuTestPage from "./MenuTestPage.js";
+import React, { useEffect, useRef, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region packages/react/ui/components/testPage/index.tsx
+function ThemeSwitcher() {
+	const [mode, setMode] = useState("dark");
+	const [theme, setTheme] = useState("default");
+	useEffect(() => {
+		const root = document.documentElement;
+		const previousTheme = root.getAttribute("data-theme");
+		const previousDark = root.classList.contains("dark");
+		root.classList.toggle("dark", mode === "dark");
+		if (theme === "default") root.removeAttribute("data-theme");
+		else root.setAttribute("data-theme", theme);
+		return () => {
+			root.classList.toggle("dark", previousDark);
+			if (previousTheme) root.setAttribute("data-theme", previousTheme);
+			else root.removeAttribute("data-theme");
+		};
+	}, [mode, theme]);
+	return /* @__PURE__ */ jsx(Section, {
+		title: "Theme",
+		children: /* @__PURE__ */ jsxs("div", {
+			className: "flex w-full flex-wrap items-center gap-6 rounded-xl border border-border bg-background p-4",
+			children: [
+				/* @__PURE__ */ jsxs("div", {
+					className: "flex items-center gap-2",
+					children: [
+						/* @__PURE__ */ jsx("span", {
+							className: "text-sm text-muted-foreground",
+							children: "模式"
+						}),
+						/* @__PURE__ */ jsx(Button, {
+							variant: mode === "light" ? "primary" : "default",
+							size: "sm",
+							onClick: () => setMode("light"),
+							children: "Light"
+						}),
+						/* @__PURE__ */ jsx(Button, {
+							variant: mode === "dark" ? "primary" : "default",
+							size: "sm",
+							onClick: () => setMode("dark"),
+							children: "Dark"
+						})
+					]
+				}),
+				/* @__PURE__ */ jsxs("div", {
+					className: "flex items-center gap-2",
+					children: [
+						/* @__PURE__ */ jsx("span", {
+							className: "text-sm text-muted-foreground",
+							children: "主题"
+						}),
+						/* @__PURE__ */ jsx(Button, {
+							variant: theme === "default" ? "primary" : "default",
+							size: "sm",
+							onClick: () => setTheme("default"),
+							children: "Default"
+						}),
+						/* @__PURE__ */ jsx(Button, {
+							variant: theme === "green" ? "primary" : "default",
+							size: "sm",
+							onClick: () => setTheme("green"),
+							children: "Green"
+						}),
+						/* @__PURE__ */ jsx(Button, {
+							variant: theme === "gray" ? "primary" : "default",
+							size: "sm",
+							onClick: () => setTheme("gray"),
+							children: "Gray"
+						})
+					]
+				}),
+				/* @__PURE__ */ jsxs("div", {
+					className: "text-sm text-muted-foreground",
+					children: [
+						"当前: ",
+						mode,
+						" / ",
+						theme
+					]
+				})
+			]
+		})
+	});
+}
+function Section({ title, children }) {
+	return /* @__PURE__ */ jsxs("div", {
+		className: "mb-8",
+		children: [/* @__PURE__ */ jsx("h2", {
+			className: "text-lg font-semibold mb-3 border-b pb-1",
+			children: title
+		}), /* @__PURE__ */ jsx("div", {
+			className: "flex flex-wrap gap-3 items-start",
+			children
+		})]
+	});
+}
+function ButtonDemo() {
+	const [loading, setLoading] = useState(false);
+	return /* @__PURE__ */ jsxs(Section, {
+		title: "Button",
+		children: [
+			/* @__PURE__ */ jsx(Button, { children: "default" }),
+			/* @__PURE__ */ jsx(Button, {
+				variant: "primary",
+				children: "primary"
+			}),
+			/* @__PURE__ */ jsx(Button, {
+				variant: "dashed",
+				children: "dashed"
+			}),
+			/* @__PURE__ */ jsx(Button, {
+				variant: "text",
+				children: "text"
+			}),
+			/* @__PURE__ */ jsx(Button, {
+				variant: "link",
+				href: "#button",
+				children: "link"
+			}),
+			/* @__PURE__ */ jsx(Button, {
+				state: "danger",
+				children: "danger"
+			}),
+			/* @__PURE__ */ jsx(Button, {
+				variant: "primary",
+				state: "danger",
+				children: "primary danger"
+			}),
+			/* @__PURE__ */ jsx("div", {
+				className: " bg-red-300 p-1.5",
+				children: /* @__PURE__ */ jsx(Button, {
+					state: "ghost",
+					children: "ghost"
+				})
+			}),
+			/* @__PURE__ */ jsx(Button, {
+				variant: "primary",
+				state: "ghost",
+				children: "primary ghost"
+			}),
+			/* @__PURE__ */ jsx(Button, {
+				disabled: true,
+				children: "disabled"
+			}),
+			/* @__PURE__ */ jsx(Button, {
+				loading,
+				onClick: () => {
+					setLoading(true);
+					setTimeout(() => setLoading(false), 2e3);
+				},
+				children: "loading (click)"
+			}),
+			/* @__PURE__ */ jsx(Button, {
+				size: "sm",
+				children: "sm"
+			}),
+			/* @__PURE__ */ jsx(Button, {
+				size: "md",
+				children: "md"
+			}),
+			/* @__PURE__ */ jsx(Button, {
+				size: "lg",
+				children: "lg"
+			})
+		]
+	});
+}
+function InputDemo() {
+	return /* @__PURE__ */ jsxs(Section, {
+		title: "Input",
+		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"
+			})
+		]
+	});
+}
+function InputNumberDemo() {
+	const [price, setPrice] = useState(12.5);
+	const [ratio, setRatio] = useState(.25);
+	return /* @__PURE__ */ jsxs(Section, {
+		title: "InputNumber",
+		children: [
+			/* @__PURE__ */ jsx(InputNumber, {
+				placeholder: "基础数字输入",
+				className: "w-48"
+			}),
+			/* @__PURE__ */ jsx(InputNumber, {
+				value: price,
+				onChange: setPrice,
+				precision: 2,
+				min: 0,
+				max: 9999,
+				placeholder: "价格",
+				addonAfter: /* @__PURE__ */ jsx("span", {
+					className: "text-xs text-muted-foreground",
+					children: "CNY"
+				}),
+				className: "w-56"
+			}),
+			/* @__PURE__ */ jsx(InputNumber, {
+				value: ratio,
+				onChange: setRatio,
+				precision: 2,
+				step: .05,
+				min: 0,
+				max: 1,
+				allowStep: true,
+				placeholder: "比例",
+				className: "w-48"
+			}),
+			/* @__PURE__ */ jsx(InputNumber, {
+				defaultValue: 10,
+				step: .5,
+				precision: 1,
+				allowStep: true,
+				allowClear: true,
+				className: "w-48"
+			}),
+			/* @__PURE__ */ jsx(InputNumber, {
+				disabled: true,
+				defaultValue: 88.8,
+				precision: 1,
+				className: "w-48"
+			})
+		]
+	});
+}
+function TextareaDemo() {
+	const [val, setVal] = useState("");
+	return /* @__PURE__ */ jsxs(Section, {
+		title: "Textarea",
+		children: [/* @__PURE__ */ jsx(Textarea, {
+			placeholder: "请输入内容（最多 500 字）",
+			value: val,
+			onChange: (v) => setVal(v),
+			className: "w-80"
+		}), /* @__PURE__ */ jsx(Textarea, {
+			placeholder: "不显示计数",
+			showCount: false,
+			className: "w-80"
+		})]
+	});
+}
+function SelectDemo() {
+	const [val, setVal] = useState(void 0);
+	const options = [
+		{
+			label: "选项 A",
+			value: "a"
+		},
+		{
+			label: "选项 B",
+			value: "b"
+		},
+		{
+			label: "选项 C",
+			value: "c"
+		}
+	];
+	return /* @__PURE__ */ jsxs(Section, {
+		title: "Select",
+		children: [
+			/* @__PURE__ */ jsx(Select, {
+				options,
+				value: val,
+				onChange: setVal,
+				placeholder: "请选择",
+				className: "w-40"
+			}),
+			/* @__PURE__ */ jsx(Select, {
+				options,
+				placeholder: "不可搜索",
+				searchable: false,
+				className: "w-40"
+			}),
+			/* @__PURE__ */ jsx(Select, {
+				options,
+				placeholder: "不可清除",
+				clearable: false,
+				className: "w-40"
+			}),
+			/* @__PURE__ */ jsx(Select, {
+				options,
+				disabled: true,
+				placeholder: "禁用",
+				className: "w-40"
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				className: "relative w-64 rounded-lg border border-border bg-muted/30 p-4",
+				children: [/* @__PURE__ */ jsx("div", {
+					className: "mb-2 text-sm text-muted-foreground",
+					children: "parent popup container"
+				}), /* @__PURE__ */ jsx(Select, {
+					options,
+					placeholder: "挂载到父元素",
+					getPopupContainer: "parent",
+					className: "w-full"
+				})]
+			})
+		]
+	});
+}
+function CheckboxDemo() {
+	const [checked, setChecked] = useState(false);
+	return /* @__PURE__ */ jsxs(Section, {
+		title: "Checkbox",
+		children: [
+			/* @__PURE__ */ jsxs("label", {
+				className: "flex items-center gap-2 cursor-pointer",
+				children: [/* @__PURE__ */ jsx(Checkbox, {
+					checked,
+					onChange: (c) => setChecked(c)
+				}), /* @__PURE__ */ jsxs("span", { children: ["受控: ", checked ? "选中" : "未选中"] })]
+			}),
+			/* @__PURE__ */ jsxs("label", {
+				className: "flex items-center gap-2 cursor-pointer",
+				children: [/* @__PURE__ */ jsx(Checkbox, { defaultChecked: true }), /* @__PURE__ */ jsx("span", { children: "非受控默认选中" })]
+			}),
+			/* @__PURE__ */ jsxs("label", {
+				className: "flex items-center gap-2 cursor-pointer",
+				children: [/* @__PURE__ */ jsx(Checkbox, { indeterminate: true }), /* @__PURE__ */ jsx("span", { children: "半选状态" })]
+			}),
+			/* @__PURE__ */ jsxs("label", {
+				className: "flex items-center gap-2 cursor-pointer",
+				children: [/* @__PURE__ */ jsx(Checkbox, { disabled: true }), /* @__PURE__ */ jsx("span", { children: "禁用" })]
+			})
+		]
+	});
+}
+function SwitchDemo() {
+	const [on, setOn] = useState(false);
+	return /* @__PURE__ */ jsxs(Section, {
+		title: "Switch",
+		children: [
+			/* @__PURE__ */ jsx(Switch, {
+				checked: on,
+				onChange: setOn
+			}),
+			/* @__PURE__ */ jsx("span", {
+				className: "self-center text-sm",
+				children: on ? "ON" : "OFF"
+			}),
+			/* @__PURE__ */ jsx(Switch, { defaultChecked: true }),
+			/* @__PURE__ */ jsx(Switch, { disabled: true }),
+			/* @__PURE__ */ jsx(Switch, {
+				disabled: true,
+				checked: true
+			})
+		]
+	});
+}
+function TooltipDemo() {
+	return /* @__PURE__ */ jsx(Section, {
+		title: "Tooltip",
+		children: [
+			"top",
+			"bottom",
+			"left",
+			"right"
+		].map((p) => /* @__PURE__ */ jsx(Tooltip, {
+			content: `placement: ${p}`,
+			placement: p,
+			children: /* @__PURE__ */ jsx(Button, { children: p })
+		}, p))
+	});
+}
+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(Section, {
+		title: "Dropdown",
+		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 ▾"
+			})
+		})]
+	});
+}
+function MessageDemo() {
+	return /* @__PURE__ */ jsxs(Section, {
+		title: "Message (imperative)",
+		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: "提前关闭"
+			})
+		]
+	});
+}
+function ModalDemo() {
+	const [open, setOpen] = useState(false);
+	return /* @__PURE__ */ jsxs(Section, {
+		title: "Modal",
+		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: "关闭"
+					})
+				})]
+			})
+		]
+	});
+}
+function DrawerDemo() {
+	const [placement, setPlacement] = useState("right");
+	const [open, setOpen] = useState(false);
+	const openDrawer = (nextPlacement) => {
+		setPlacement(nextPlacement);
+		setOpen(true);
+	};
+	return /* @__PURE__ */ jsxs(Section, {
+		title: "Drawer",
+		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"
+								}]
+							})
+						})]
+					})]
+				})
+			})
+		]
+	});
+}
+function ConfirmDialogDemo() {
+	const [open, setOpen] = useState(false);
+	return /* @__PURE__ */ jsxs(Section, {
+		title: "ConfirmDialog",
+		children: [/* @__PURE__ */ jsx(Button, {
+			onClick: () => setOpen(true),
+			children: "打开确认框"
+		}), /* @__PURE__ */ jsx(ConfirmDialog, {
+			open,
+			title: "删除确认",
+			content: "确定要删除此条数据吗？此操作不可撤销。",
+			onOk: () => {
+				message.success("已删除");
+				setOpen(false);
+			},
+			onCancel: () => setOpen(false)
+		})]
+	});
+}
+function PaginationDemo() {
+	const [page, setPage] = useState(1);
+	const [pageSize, setPageSize] = useState(10);
+	return /* @__PURE__ */ jsx(Section, {
+		title: "Pagination",
+		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
+			})]
+		})
+	});
+}
+function TableDemo() {
+	return /* @__PURE__ */ jsx(Section, {
+		title: "Table (低层)",
+		children: /* @__PURE__ */ jsx("div", {
+			className: "w-full",
+			children: /* @__PURE__ */ jsxs(Table, { children: [/* @__PURE__ */ jsx(TableHeader, { children: /* @__PURE__ */ jsxs("tr", { children: [
+				/* @__PURE__ */ jsx(TableHead, { children: "ID" }),
+				/* @__PURE__ */ jsx(TableHead, { children: "姓名" }),
+				/* @__PURE__ */ jsx(TableHead, { children: "角色" }),
+				/* @__PURE__ */ jsx(TableHead, { children: "状态" }),
+				/* @__PURE__ */ jsx(TableHead, {
+					isAction: true,
+					children: "操作"
+				})
+			] }) }), /* @__PURE__ */ jsx(TableBody, { children: [
+				{
+					id: 1,
+					name: "张三",
+					role: "管理员",
+					status: "正常"
+				},
+				{
+					id: 2,
+					name: "李四",
+					role: "用户",
+					status: "禁用"
+				},
+				{
+					id: 3,
+					name: "王五",
+					role: "审计员",
+					status: "正常"
+				}
+			].map((row) => /* @__PURE__ */ jsxs(TableRow, { children: [
+				/* @__PURE__ */ jsx(TableCell, { children: row.id }),
+				/* @__PURE__ */ jsx(TableCell, { children: row.name }),
+				/* @__PURE__ */ jsx(TableCell, { children: row.role }),
+				/* @__PURE__ */ jsx(TableCell, { children: row.status }),
+				/* @__PURE__ */ jsx(TableCell, {
+					isAction: true,
+					children: /* @__PURE__ */ jsx(Button, {
+						variant: "link",
+						size: "sm",
+						children: "编辑"
+					})
+				})
+			] }, row.id)) })] })
+		})
+	});
+}
+function DataTableDemo() {
+	const [selectedKeys, setSelectedKeys] = useState([]);
+	return /* @__PURE__ */ jsx(Section, {
+		title: "DataTable",
+		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)
+				}
+			})]
+		})
+	});
+}
+function SearchDemo() {
+	return /* @__PURE__ */ jsx(Section, {
+		title: "Search",
+		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: "重置"
+				})]
+			})
+		})
+	});
+}
+function BreadcrumbDemo() {
+	const [items, setItems] = useState([
+		{
+			id: "home",
+			label: "首页"
+		},
+		{
+			id: "list",
+			label: "用户列表"
+		},
+		{
+			id: "detail",
+			label: "用户详情",
+			active: true
+		}
+	]);
+	return /* @__PURE__ */ jsx(Section, {
+		title: "Breadcrumb",
+		children: /* @__PURE__ */ jsx(Breadcrumb, { children: /* @__PURE__ */ jsx(BreadcrumbList, { children: items.map((item, idx) => /* @__PURE__ */ jsxs(React.Fragment, { children: [/* @__PURE__ */ jsx(BreadcrumbItem, { children: /* @__PURE__ */ jsx(BreadcrumbPage, {
+			active: item.active,
+			onClose: () => setItems((prev) => prev.filter((i) => i.id !== item.id)),
+			onClick: () => setItems((prev) => prev.map((i) => ({
+				...i,
+				active: i.id === item.id
+			}))),
+			className: "cursor-pointer",
+			children: item.label
+		}) }), idx < items.length - 1 && /* @__PURE__ */ jsx(BreadcrumbSeparator, {})] }, item.id)) }) })
+	});
+}
+function LabelDemo() {
+	return /* @__PURE__ */ jsxs(Section, {
+		title: "Label",
+		children: [/* @__PURE__ */ jsx(Label, {
+			label: "水平布局",
+			layout: "horizontal",
+			children: /* @__PURE__ */ jsx("span", {
+				className: "text-sm",
+				children: "内容区域"
+			})
+		}), /* @__PURE__ */ jsx(Label, {
+			label: "垂直布局",
+			layout: "vertical",
+			children: /* @__PURE__ */ jsx("span", {
+				className: "text-sm",
+				children: "内容区域"
+			})
+		})]
+	});
+}
+function FormDemo() {
+	const [form] = useForm();
+	return /* @__PURE__ */ jsx(Section, {
+		title: "Form",
+		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: "提交"
+				})
+			]
+		})
+	});
+}
+function SchemaFormDemo() {
+	const form = useRef(void 0);
+	return /* @__PURE__ */ jsx(Section, {
+		title: "SchemaForm",
+		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)
+		})
+	});
+}
+function TableSearchDemo() {
+	return /* @__PURE__ */ jsx(Section, {
+		title: "TableSearch",
+		children: /* @__PURE__ */ jsx(TableSearch, {
+			onSearch: (v) => console.log(v),
+			schemas: [
+				{
+					type: "input",
+					key: "q1",
+					label: "字段1",
+					fieldProps: {}
+				},
+				{
+					type: "select",
+					key: "q2",
+					label: "状态",
+					fieldProps: { options: [{
+						value: "a",
+						label: "A"
+					}] }
+				},
+				{
+					type: "switch",
+					key: "q3",
+					label: "开关",
+					fieldProps: {}
+				},
+				{
+					type: "date",
+					key: "q4",
+					label: "日期",
+					fieldProps: {}
+				},
+				{
+					type: "date",
+					key: "q5",
+					label: "范围",
+					fieldProps: { mode: "range" }
+				},
+				{
+					type: "textarea",
+					key: "q6",
+					label: "文本",
+					fieldProps: {}
+				},
+				{
+					type: "input",
+					key: "q7",
+					label: "字段7",
+					fieldProps: {}
+				},
+				{
+					type: "input",
+					key: "q8",
+					label: "字段8",
+					fieldProps: {}
+				}
+			]
+		})
+	});
+}
+function SkeletonDemo() {
+	return /* @__PURE__ */ jsx(Section, {
+		title: "Skeleton",
+		children: /* @__PURE__ */ jsxs("div", {
+			className: "w-full space-y-4",
+			children: [
+				/* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("p", {
+					className: "text-xs text-gray-500 mb-1",
+					children: "pageloading"
+				}), /* @__PURE__ */ jsx(Skeleton, {
+					mode: "pageloading",
+					rows: 3,
+					showTitle: true,
+					showActions: true
+				})] }),
+				/* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("p", {
+					className: "text-xs text-gray-500 mb-1",
+					children: "tableloading"
+				}), /* @__PURE__ */ jsx(Skeleton, {
+					mode: "tableloading",
+					rows: 4
+				})] }),
+				/* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("p", {
+					className: "text-xs text-gray-500 mb-1",
+					children: "componentsloading"
+				}), /* @__PURE__ */ jsx(Skeleton, {
+					mode: "componentsloading",
+					rows: 2
+				})] })
+			]
+		})
+	});
+}
+function TreeSelectDemo() {
+	const [value, setValue] = useState(["1.1.1", "1.1.2"]);
+	const [indeterminate, setIndeterminate] = useState([]);
+	return /* @__PURE__ */ jsx(Section, {
+		title: "TreeSelect",
+		children: /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsxs("div", {
+			className: "text-sm mb-2",
+			children: [/* @__PURE__ */ jsxs("span", { children: ["选中: ", JSON.stringify(value)] }), /* @__PURE__ */ jsxs("span", {
+				className: "ml-4",
+				children: ["半选: ", JSON.stringify(indeterminate)]
+			})]
+		}), /* @__PURE__ */ jsx(TreeSelect, {
+			data: [{
+				id: "1",
+				name: "节点 1",
+				children: [{
+					id: "1.1",
+					name: "节点 1.1",
+					children: [{
+						id: "1.1.1",
+						name: "节点 1.1.1",
+						children: [{
+							id: "1.1.1.1",
+							name: "1.1.1.1"
+						}, {
+							id: "1.1.1.2",
+							name: "1.1.1.2"
+						}]
+					}, {
+						id: "1.1.2",
+						name: "节点 1.1.2"
+					}]
+				}, {
+					id: "1.2",
+					name: "节点 1.2",
+					children: [{
+						id: "1.2.1",
+						name: "1.2.1"
+					}, {
+						id: "1.2.2",
+						name: "1.2.2"
+					}]
+				}]
+			}],
+			value,
+			onChange: ({ checked, indeterminate }) => {
+				setValue(checked);
+				setIndeterminate(indeterminate);
+			}
+		})] })
+	});
+}
+function PreviewImageDemo() {
+	return /* @__PURE__ */ jsx(Section, {
+		title: "PreviewImage",
+		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
+		})
+	});
+}
+function ImageUploadDemo() {
+	return /* @__PURE__ */ jsx(Section, {
+		title: "ImageUpload",
+		children: /* @__PURE__ */ jsx(ImageUpload, {
+			accept: ".jpg,.png",
+			maxCount: 4,
+			beforeChange: (f) => {
+				console.log(f);
+				return parseInt(Math.random() * 10 + "") % 2 === 0;
+			}
+		})
+	});
+}
+function RadioDemo() {
+	const [selected, setSelected] = useState("a");
+	const [groupValue, setGroupValue] = useState("green");
+	return /* @__PURE__ */ jsxs(Section, {
+		title: "Radio",
+		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
+						})
+					]
+				})]
+			})
+		]
+	});
+}
+function NotificationDemo() {
+	return /* @__PURE__ */ jsx(Section, {
+		title: "Notification",
+		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
+				})
+			]
+		})
+	});
+}
+function LoadingDemo() {
+	return /* @__PURE__ */ jsx(Section, {
+		title: "Loading",
+		children: /* @__PURE__ */ jsxs("div", {
+			className: "flex items-end gap-8",
+			children: [
+				/* @__PURE__ */ jsx(Loading, {
+					size: "sm",
+					text: "加载中..."
+				}),
+				/* @__PURE__ */ jsx(Loading, {
+					size: "md",
+					text: "加载中..."
+				}),
+				/* @__PURE__ */ jsx(Loading, { size: "lg" })
+			]
+		})
+	});
+}
+function LayoutDemo() {
+	return /* @__PURE__ */ jsx(Section, {
+		title: "Layout",
+		children: /* @__PURE__ */ jsx("div", {
+			className: "w-full h-80 border rounded-lg overflow-hidden",
+			children: /* @__PURE__ */ jsx(Layout, {
+				header: /* @__PURE__ */ jsx("div", {
+					className: "flex items-center h-12 px-4 text-sm font-medium",
+					children: "Header"
+				}),
+				sidebar: /* @__PURE__ */ jsxs("div", {
+					className: "p-4",
+					children: [/* @__PURE__ */ jsx("p", {
+						className: "text-sm font-medium mb-2",
+						children: "Sidebar"
+					}), /* @__PURE__ */ jsxs("div", {
+						className: "space-y-1",
+						children: [
+							/* @__PURE__ */ jsx("div", {
+								className: "text-sm text-muted-foreground p-1 rounded hover:bg-muted cursor-pointer",
+								children: "菜单项 1"
+							}),
+							/* @__PURE__ */ jsx("div", {
+								className: "text-sm text-muted-foreground p-1 rounded hover:bg-muted cursor-pointer",
+								children: "菜单项 2"
+							}),
+							/* @__PURE__ */ jsx("div", {
+								className: "text-sm text-muted-foreground p-1 rounded hover:bg-muted cursor-pointer",
+								children: "菜单项 3"
+							})
+						]
+					})]
+				}),
+				footer: /* @__PURE__ */ jsx("div", {
+					className: "flex items-center h-10 px-4 text-xs text-muted-foreground",
+					children: "Footer"
+				}),
+				children: /* @__PURE__ */ jsxs("div", {
+					className: "p-4",
+					children: [/* @__PURE__ */ jsx("p", {
+						className: "text-sm font-medium mb-1",
+						children: "Content"
+					}), /* @__PURE__ */ jsx("p", {
+						className: "text-xs text-muted-foreground",
+						children: "这是主要内容区域。"
+					})]
+				})
+			})
+		})
+	});
+}
+function CardDemo() {
+	return /* @__PURE__ */ jsxs(Section, {
+		title: "Card",
+		children: [/* @__PURE__ */ jsx("div", {
+			className: "w-72",
+			children: /* @__PURE__ */ jsx(Card, {
+				header: /* @__PURE__ */ jsx("span", {
+					className: "text-sm font-medium",
+					children: "卡片标题"
+				}),
+				footer: /* @__PURE__ */ jsxs("div", {
+					className: "flex justify-end gap-2",
+					children: [/* @__PURE__ */ jsx(Button, {
+						size: "sm",
+						children: "取消"
+					}), /* @__PURE__ */ jsx(Button, {
+						variant: "primary",
+						size: "sm",
+						children: "确认"
+					})]
+				}),
+				children: /* @__PURE__ */ jsx("p", {
+					className: "text-sm text-muted-foreground",
+					children: "这是一张基础卡片，包含 header、body 和 footer 三个区域。"
+				})
+			})
+		}), /* @__PURE__ */ jsx("div", {
+			className: "w-72",
+			children: /* @__PURE__ */ jsx(Card, {
+				className: "border-theme",
+				children: /* @__PURE__ */ jsx("p", {
+					className: "text-sm text-muted-foreground",
+					children: "无 header/footer 的简洁卡片。"
+				})
+			})
+		})]
+	});
+}
+function TabsDemo() {
+	const [activeTab, setActiveTab] = useState("tab1");
+	return /* @__PURE__ */ jsx(Section, {
+		title: "Tabs",
+		children: /* @__PURE__ */ jsxs("div", {
+			className: "w-full",
+			children: [/* @__PURE__ */ jsx(Tabs, {
+				items: [
+					{
+						key: "tab1",
+						label: "标签页 1"
+					},
+					{
+						key: "tab2",
+						label: "标签页 2"
+					},
+					{
+						key: "tab3",
+						label: "标签页 3"
+					},
+					{
+						key: "tab4",
+						label: "禁用标签",
+						disabled: true
+					}
+				],
+				activeKey: activeTab,
+				onChange: setActiveTab
+			}), /* @__PURE__ */ jsx("div", {
+				className: "p-4 border border-t-0 rounded-b-lg bg-background",
+				children: /* @__PURE__ */ jsx("p", {
+					className: "text-sm text-muted-foreground",
+					children: {
+						tab1: "这是标签页 1 的内容区域。",
+						tab2: "这是标签页 2 的内容区域。",
+						tab3: "这是标签页 3 的内容区域。"
+					}[activeTab]
+				})
+			})]
+		})
+	});
+}
+var TestPage = () => {
+	return /* @__PURE__ */ jsxs("div", {
+		className: "p-6 max-w-5xl mx-auto",
+		children: [
+			/* @__PURE__ */ jsx("h1", {
+				className: "text-2xl font-bold mb-6",
+				children: "组件展示"
+			}),
+			/* @__PURE__ */ jsx(ThemeSwitcher, {}),
+			/* @__PURE__ */ jsx(ButtonDemo, {}),
+			/* @__PURE__ */ jsx(InputDemo, {}),
+			/* @__PURE__ */ jsx(InputNumberDemo, {}),
+			/* @__PURE__ */ jsx(TextareaDemo, {}),
+			/* @__PURE__ */ jsx(SelectDemo, {}),
+			/* @__PURE__ */ jsx(CheckboxDemo, {}),
+			/* @__PURE__ */ jsx(RadioDemo, {}),
+			/* @__PURE__ */ jsx(SwitchDemo, {}),
+			/* @__PURE__ */ jsx(TooltipDemo, {}),
+			/* @__PURE__ */ jsx(DropdownDemo, {}),
+			/* @__PURE__ */ jsx(MessageDemo, {}),
+			/* @__PURE__ */ jsx(NotificationDemo, {}),
+			/* @__PURE__ */ jsx(LoadingDemo, {}),
+			/* @__PURE__ */ jsx(ModalDemo, {}),
+			/* @__PURE__ */ jsx(DrawerDemo, {}),
+			/* @__PURE__ */ jsx(ConfirmDialogDemo, {}),
+			/* @__PURE__ */ jsx(PaginationDemo, {}),
+			/* @__PURE__ */ jsx(TableDemo, {}),
+			/* @__PURE__ */ jsx(DataTableDemo, {}),
+			/* @__PURE__ */ jsx(SearchDemo, {}),
+			/* @__PURE__ */ jsx(BreadcrumbDemo, {}),
+			/* @__PURE__ */ jsx(LabelDemo, {}),
+			/* @__PURE__ */ jsx(LayoutDemo, {}),
+			/* @__PURE__ */ jsx(CardDemo, {}),
+			/* @__PURE__ */ jsx(TabsDemo, {}),
+			/* @__PURE__ */ jsx(FormDemo, {}),
+			/* @__PURE__ */ jsx(SchemaFormDemo, {}),
+			/* @__PURE__ */ jsx(TableSearchDemo, {}),
+			/* @__PURE__ */ jsx(SkeletonDemo, {}),
+			/* @__PURE__ */ jsx(TreeSelectDemo, {}),
+			/* @__PURE__ */ jsx(DateTestPage, {}),
+			/* @__PURE__ */ jsx(PreviewImageDemo, {}),
+			/* @__PURE__ */ jsx(ImageUploadDemo, {}),
+			/* @__PURE__ */ jsx(MenuTestPage, {})
+		]
+	});
+};
+//#endregion
+export { TestPage as default };