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

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

@@ -0,0 +1,73 @@
+import { __exportAll } from "../../../../../../../_virtual/_rolldown/runtime.js";
+import { Select } from "../../../Select/Select.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/SelectDemo.tsx
+var SelectDemo_exports = /* @__PURE__ */ __exportAll({
+	default: () => SelectDemo,
+	demoMeta: () => demoMeta
+});
+var demoMeta = {
+	title: "Select",
+	order: 6,
+	contentClassName: "flex flex-wrap gap-3 items-start"
+};
+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(Fragment$1, { 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"
+			})]
+		})
+	] });
+}
+//#endregion
+export { SelectDemo_exports, SelectDemo as default, demoMeta };

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

@@ -0,0 +1,4 @@
+//#region packages/react/ui/components/testPage/demos/core/SelectDemo.tsx?raw
+var SelectDemo_default = "import { Select } from '@tc/ui-react/components'\nimport { useState } from 'react'\nimport type { DemoMeta } from '../../types'\n\nexport const demoMeta = {\n    title: 'Select',\n    order: 6,\n    contentClassName: 'flex flex-wrap gap-3 items-start',\n} satisfies DemoMeta\n\n// ─── Select ──────────────────────────────────────────────────────────────────\n\nexport default function SelectDemo() {\n    const [val, setVal] = useState<string | number | undefined>(undefined)\n    const options = [\n        { label: '选项 A', value: 'a' },\n        { label: '选项 B', value: 'b' },\n        { label: '选项 C', value: 'c' },\n    ]\n    return (\n        <>\n            <Select options={options} value={val} onChange={setVal} placeholder=\"请选择\" className=\"w-40\" />\n            <Select options={options} placeholder=\"不可搜索\" searchable={false} className=\"w-40\" />\n            <Select options={options} placeholder=\"不可清除\" clearable={false} className=\"w-40\" />\n            <Select options={options} disabled placeholder=\"禁用\" className=\"w-40\" />\n            <div className=\"relative w-64 rounded-lg border border-border bg-muted/30 p-4\">\n                <div className=\"mb-2 text-sm text-muted-foreground\">parent popup container</div>\n                <Select options={options} placeholder=\"挂载到父元素\" getPopupContainer=\"parent\" className=\"w-full\" />\n            </div>\n        </>\n    )\n}\n";
+//#endregion
+export { SelectDemo_default as default };

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

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

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

@@ -0,0 +1,46 @@
+import { __exportAll } from "../../../../../../../_virtual/_rolldown/runtime.js";
+import { Skeleton } from "../../../Skeleton/Skeleton.js";
+import "../../../index.js";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+//#region packages/react/ui/components/testPage/demos/core/SkeletonDemo.tsx
+var SkeletonDemo_exports = /* @__PURE__ */ __exportAll({
+	default: () => SkeletonDemo,
+	demoMeta: () => demoMeta
+});
+var demoMeta = {
+	title: "Skeleton",
+	order: 30,
+	contentClassName: "flex flex-wrap gap-3 items-start"
+};
+function SkeletonDemo() {
+	return /* @__PURE__ */ jsx(Fragment, { 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
+			})] })
+		]
+	}) });
+}
+//#endregion
+export { SkeletonDemo_exports, SkeletonDemo as default, demoMeta };

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

@@ -0,0 +1,4 @@
+//#region packages/react/ui/components/testPage/demos/core/SkeletonDemo.tsx?raw
+var SkeletonDemo_default = "import { Skeleton } from '@tc/ui-react/components'\nimport type { DemoMeta } from '../../types'\n\nexport const demoMeta = {\n    title: 'Skeleton',\n    order: 30,\n    contentClassName: 'flex flex-wrap gap-3 items-start',\n} satisfies DemoMeta\n\n// ─── Skeleton ─────────────────────────────────────────────────────────────────\n\nexport default function SkeletonDemo() {\n    return (\n        <>\n            <div className=\"w-full space-y-4\">\n                <div>\n                    <p className=\"text-xs text-gray-500 mb-1\">pageloading</p>\n                    <Skeleton mode=\"pageloading\" rows={3} showTitle showActions />\n                </div>\n                <div>\n                    <p className=\"text-xs text-gray-500 mb-1\">tableloading</p>\n                    <Skeleton mode=\"tableloading\" rows={4} />\n                </div>\n                <div>\n                    <p className=\"text-xs text-gray-500 mb-1\">componentsloading</p>\n                    <Skeleton mode=\"componentsloading\" rows={2} />\n                </div>\n            </div>\n        </>\n    )\n}\n";
+//#endregion
+export { SkeletonDemo_default as default };

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

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

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

@@ -0,0 +1,36 @@
+import { __exportAll } from "../../../../../../../_virtual/_rolldown/runtime.js";
+import { Switch } from "../../../Switch/Switch.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/SwitchDemo.tsx
+var SwitchDemo_exports = /* @__PURE__ */ __exportAll({
+	default: () => SwitchDemo,
+	demoMeta: () => demoMeta
+});
+var demoMeta = {
+	title: "Switch",
+	order: 9,
+	contentClassName: "flex flex-wrap gap-3 items-start"
+};
+function SwitchDemo() {
+	const [on, setOn] = useState(false);
+	return /* @__PURE__ */ jsxs(Fragment$1, { 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
+		})
+	] });
+}
+//#endregion
+export { SwitchDemo_exports, SwitchDemo as default, demoMeta };

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

@@ -0,0 +1,4 @@
+//#region packages/react/ui/components/testPage/demos/core/SwitchDemo.tsx?raw
+var SwitchDemo_default = "import { Switch } from '@tc/ui-react/components'\nimport { useState } from 'react'\nimport type { DemoMeta } from '../../types'\n\nexport const demoMeta = {\n    title: 'Switch',\n    order: 9,\n    contentClassName: 'flex flex-wrap gap-3 items-start',\n} satisfies DemoMeta\n\n// ─── Switch ──────────────────────────────────────────────────────────────────\n\nexport default function SwitchDemo() {\n    const [on, setOn] = useState(false)\n    return (\n        <>\n            <Switch checked={on} onChange={setOn} />\n            <span className=\"self-center text-sm\">{on ? 'ON' : 'OFF'}</span>\n            <Switch defaultChecked />\n            <Switch disabled />\n            <Switch disabled checked />\n        </>\n    )\n}\n";
+//#endregion
+export { SwitchDemo_default as default };

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

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

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

@@ -0,0 +1,64 @@
+import { __exportAll } from "../../../../../../../_virtual/_rolldown/runtime.js";
+import { Button } from "../../../Button/Button.js";
+import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "../../../table/table.js";
+import "../../../index.js";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+//#region packages/react/ui/components/testPage/demos/core/TableDemo.tsx
+var TableDemo_exports = /* @__PURE__ */ __exportAll({
+	default: () => TableDemo,
+	demoMeta: () => demoMeta
+});
+var demoMeta = {
+	title: "Table (低层)",
+	order: 19,
+	contentClassName: "flex flex-wrap gap-3 items-start"
+};
+function TableDemo() {
+	return /* @__PURE__ */ jsx(Fragment, { 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)) })] })
+	}) });
+}
+//#endregion
+export { TableDemo_exports, TableDemo as default, demoMeta };

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

@@ -0,0 +1,4 @@
+//#region packages/react/ui/components/testPage/demos/core/TableDemo.tsx?raw
+var TableDemo_default = "import {\n    Button,\n    Table,\n    TableBody,\n    TableCell,\n    TableHead,\n    TableHeader,\n    TableRow\n} from '@tc/ui-react/components'\nimport type { DemoMeta } from '../../types'\n\nexport const demoMeta = {\n    title: 'Table (低层)',\n    order: 19,\n    contentClassName: 'flex flex-wrap gap-3 items-start',\n} satisfies DemoMeta\n\n// ─── Table (低层组件) ─────────────────────────────────────────────────────────\n\nexport default function TableDemo() {\n    const rows = [\n        { id: 1, name: '张三', role: '管理员', status: '正常' },\n        { id: 2, name: '李四', role: '用户', status: '禁用' },\n        { id: 3, name: '王五', role: '审计员', status: '正常' },\n    ]\n    return (\n        <>\n            <div className=\"w-full\">\n                <Table>\n                    <TableHeader>\n                        <tr>\n                            <TableHead>ID</TableHead>\n                            <TableHead>姓名</TableHead>\n                            <TableHead>角色</TableHead>\n                            <TableHead>状态</TableHead>\n                            <TableHead isAction>操作</TableHead>\n                        </tr>\n                    </TableHeader>\n                    <TableBody>\n                        {rows.map((row) => (\n                            <TableRow key={row.id}>\n                                <TableCell>{row.id}</TableCell>\n                                <TableCell>{row.name}</TableCell>\n                                <TableCell>{row.role}</TableCell>\n                                <TableCell>{row.status}</TableCell>\n                                <TableCell isAction>\n                                    <Button variant=\"link\" size=\"sm\">\n                                        编辑\n                                    </Button>\n                                </TableCell>\n                            </TableRow>\n                        ))}\n                    </TableBody>\n                </Table>\n            </div>\n        </>\n    )\n}\n";
+//#endregion
+export { TableDemo_default as default };

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

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

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

@@ -0,0 +1,74 @@
+import { __exportAll } from "../../../../../../../_virtual/_rolldown/runtime.js";
+import TableSearch from "../../../TableSearch/TableSearch.js";
+import "../../../index.js";
+import { Fragment, jsx } from "react/jsx-runtime";
+//#region packages/react/ui/components/testPage/demos/core/TableSearchDemo.tsx
+var TableSearchDemo_exports = /* @__PURE__ */ __exportAll({
+	default: () => TableSearchDemo,
+	demoMeta: () => demoMeta
+});
+var demoMeta = {
+	title: "TableSearch",
+	order: 29,
+	contentClassName: "flex flex-wrap gap-3 items-start"
+};
+function TableSearchDemo() {
+	return /* @__PURE__ */ jsx(Fragment, { 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: {}
+			}
+		]
+	}) });
+}
+//#endregion
+export { TableSearchDemo_exports, TableSearchDemo as default, demoMeta };

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

@@ -0,0 +1,4 @@
+//#region packages/react/ui/components/testPage/demos/core/TableSearchDemo.tsx?raw
+var TableSearchDemo_default = "import { TableSearch } from '@tc/ui-react/components'\nimport type { DemoMeta } from '../../types'\n\nexport const demoMeta = {\n    title: 'TableSearch',\n    order: 29,\n    contentClassName: 'flex flex-wrap gap-3 items-start',\n} satisfies DemoMeta\n\n// ─── TableSearch ─────────────────────────────────────────────────────────────\n\nexport default function TableSearchDemo() {\n    type TableSearchForm = {\n        q1: string\n        q2: string\n        q3: boolean\n        q4: string\n        q5: string\n        q6: string\n        q7: string\n        q8: string\n    }\n    return (\n        <>\n            <TableSearch<TableSearchForm>\n                onSearch={(v) => console.log(v)}\n                schemas={[\n                    { type: 'input', key: 'q1', label: '字段1', fieldProps: {} },\n                    { type: 'select', key: 'q2', label: '状态', fieldProps: { options: [{ value: 'a', label: 'A' }] } },\n                    { type: 'switch', key: 'q3', label: '开关', fieldProps: {} },\n                    { type: 'date', key: 'q4', label: '日期', fieldProps: {} },\n                    { type: 'date', key: 'q5', label: '范围', fieldProps: { mode: 'range' } },\n                    { type: 'textarea', key: 'q6', label: '文本', fieldProps: {} },\n                    { type: 'input', key: 'q7', label: '字段7', fieldProps: {} },\n                    { type: 'input', key: 'q8', label: '字段8', fieldProps: {} },\n                ]}\n            />\n        </>\n    )\n}\n";
+//#endregion
+export { TableSearchDemo_default as default };

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

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

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

@@ -0,0 +1,56 @@
+import { __exportAll } from "../../../../../../../_virtual/_rolldown/runtime.js";
+import { Tabs } from "../../../Tabs/Tabs.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/TabsDemo.tsx
+var TabsDemo_exports = /* @__PURE__ */ __exportAll({
+	default: () => TabsDemo,
+	demoMeta: () => demoMeta
+});
+var demoMeta = {
+	title: "Tabs",
+	order: 26,
+	contentClassName: "flex flex-wrap gap-3 items-start"
+};
+function TabsDemo() {
+	const [activeTab, setActiveTab] = useState("tab1");
+	return /* @__PURE__ */ jsx(Fragment$1, { 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]
+			})
+		})]
+	}) });
+}
+//#endregion
+export { TabsDemo_exports, TabsDemo as default, demoMeta };

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

@@ -0,0 +1,4 @@
+//#region packages/react/ui/components/testPage/demos/core/TabsDemo.tsx?raw
+var TabsDemo_default = "import { Tabs } from '@tc/ui-react/components'\nimport { useState } from 'react'\nimport type { DemoMeta } from '../../types'\n\nexport const demoMeta = {\n    title: 'Tabs',\n    order: 26,\n    contentClassName: 'flex flex-wrap gap-3 items-start',\n} satisfies DemoMeta\n\n// ─── Tabs ────────────────────────────────────────────────────────────────────\n\nexport default function TabsDemo() {\n    const [activeTab, setActiveTab] = useState('tab1')\n    const items = [\n        { key: 'tab1', label: '标签页 1' },\n        { key: 'tab2', label: '标签页 2' },\n        { key: 'tab3', label: '标签页 3' },\n        { key: 'tab4', label: '禁用标签', disabled: true },\n    ]\n    const tabContents: Record<string, string> = {\n        tab1: '这是标签页 1 的内容区域。',\n        tab2: '这是标签页 2 的内容区域。',\n        tab3: '这是标签页 3 的内容区域。',\n    }\n    return (\n        <>\n            <div className=\"w-full\">\n                <Tabs items={items} activeKey={activeTab} onChange={setActiveTab} />\n                <div className=\"p-4 border border-t-0 rounded-b-lg bg-background\">\n                    <p className=\"text-sm text-muted-foreground\">{tabContents[activeTab]}</p>\n                </div>\n            </div>\n        </>\n    )\n}\n";
+//#endregion
+export { TabsDemo_default as default };

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

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

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

@@ -0,0 +1,30 @@
+import { __exportAll } from "../../../../../../../_virtual/_rolldown/runtime.js";
+import { Textarea } from "../../../Textarea/Textarea.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/TextareaDemo.tsx
+var TextareaDemo_exports = /* @__PURE__ */ __exportAll({
+	default: () => TextareaDemo,
+	demoMeta: () => demoMeta
+});
+var demoMeta = {
+	title: "Textarea",
+	order: 5,
+	contentClassName: "flex flex-wrap gap-3 items-start"
+};
+function TextareaDemo() {
+	const [val, setVal] = useState("");
+	return /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(Textarea, {
+		placeholder: "请输入内容（最多 500 字）",
+		value: val,
+		onChange: (v) => setVal(v),
+		className: "w-80"
+	}), /* @__PURE__ */ jsx(Textarea, {
+		placeholder: "不显示计数",
+		showCount: false,
+		className: "w-80"
+	})] });
+}
+//#endregion
+export { TextareaDemo_exports, TextareaDemo as default, demoMeta };

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

@@ -0,0 +1,4 @@
+//#region packages/react/ui/components/testPage/demos/core/TextareaDemo.tsx?raw
+var TextareaDemo_default = "import { Textarea } from '@tc/ui-react/components'\nimport { useState } from 'react'\nimport type { DemoMeta } from '../../types'\n\nexport const demoMeta = {\n    title: 'Textarea',\n    order: 5,\n    contentClassName: 'flex flex-wrap gap-3 items-start',\n} satisfies DemoMeta\n\n// ─── Textarea ────────────────────────────────────────────────────────────────\n\nexport default function TextareaDemo() {\n    const [val, setVal] = useState('')\n    return (\n        <>\n            <Textarea\n                placeholder=\"请输入内容（最多 500 字）\"\n                value={val}\n                onChange={(v) => setVal(v)}\n                className=\"w-80\"\n            />\n            <Textarea placeholder=\"不显示计数\" showCount={false} className=\"w-80\" />\n        </>\n    )\n}\n";
+//#endregion
+export { TextareaDemo_default as default };

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

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

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

@@ -0,0 +1,96 @@
+import { __exportAll } from "../../../../../../../_virtual/_rolldown/runtime.js";
+import { Button } from "../../../Button/Button.js";
+import "../../../index.js";
+import { useEffect, useState } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+//#region packages/react/ui/components/testPage/demos/core/ThemeSwitcher.tsx
+var ThemeSwitcher_exports = /* @__PURE__ */ __exportAll({
+	default: () => ThemeSwitcher,
+	demoMeta: () => demoMeta
+});
+var demoMeta = {
+	title: "Theme",
+	order: 1,
+	contentClassName: "flex flex-wrap gap-3 items-start"
+};
+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(Fragment$1, { 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
+				]
+			})
+		]
+	}) });
+}
+//#endregion
+export { ThemeSwitcher_exports, ThemeSwitcher as default, demoMeta };

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

@@ -0,0 +1,4 @@
+//#region packages/react/ui/components/testPage/demos/core/ThemeSwitcher.tsx?raw
+var ThemeSwitcher_default = "import { Button } from '@tc/ui-react/components'\nimport { useEffect, useState } from 'react'\nimport type { DemoMeta } from '../../types'\n\nexport const demoMeta = {\n    title: 'Theme',\n    order: 1,\n    contentClassName: 'flex flex-wrap gap-3 items-start',\n} satisfies DemoMeta\n\ntype ColorTheme = 'default' | 'green' | 'gray'\n\nexport default function ThemeSwitcher() {\n    const [mode, setMode] = useState<'light' | 'dark'>('dark')\n    const [theme, setTheme] = useState<ColorTheme>('default')\n\n    useEffect(() => {\n        const root = document.documentElement\n        const previousTheme = root.getAttribute('data-theme')\n        const previousDark = root.classList.contains('dark')\n\n        root.classList.toggle('dark', mode === 'dark')\n        if (theme === 'default') {\n            root.removeAttribute('data-theme')\n        } else {\n            root.setAttribute('data-theme', theme)\n        }\n\n        return () => {\n            root.classList.toggle('dark', previousDark)\n            if (previousTheme) {\n                root.setAttribute('data-theme', previousTheme)\n            } else {\n                root.removeAttribute('data-theme')\n            }\n        }\n    }, [mode, theme])\n\n    return (\n        <>\n            <div className=\"flex w-full flex-wrap items-center gap-6 rounded-xl border border-border bg-background p-4\">\n                <div className=\"flex items-center gap-2\">\n                    <span className=\"text-sm text-muted-foreground\">模式</span>\n                    <Button\n                        variant={mode === 'light' ? 'primary' : 'default'}\n                        size=\"sm\"\n                        onClick={() => setMode('light')}\n                    >\n                        Light\n                    </Button>\n                    <Button variant={mode === 'dark' ? 'primary' : 'default'} size=\"sm\" onClick={() => setMode('dark')}>\n                        Dark\n                    </Button>\n                </div>\n\n                <div className=\"flex items-center gap-2\">\n                    <span className=\"text-sm text-muted-foreground\">主题</span>\n                    <Button\n                        variant={theme === 'default' ? 'primary' : 'default'}\n                        size=\"sm\"\n                        onClick={() => setTheme('default')}\n                    >\n                        Default\n                    </Button>\n                    <Button\n                        variant={theme === 'green' ? 'primary' : 'default'}\n                        size=\"sm\"\n                        onClick={() => setTheme('green')}\n                    >\n                        Green\n                    </Button>\n                    <Button\n                        variant={theme === 'gray' ? 'primary' : 'default'}\n                        size=\"sm\"\n                        onClick={() => setTheme('gray')}\n                    >\n                        Gray\n                    </Button>\n                </div>\n\n                <div className=\"text-sm text-muted-foreground\">\n                    当前: {mode} / {theme}\n                </div>\n            </div>\n        </>\n    )\n}\n";
+//#endregion
+export { ThemeSwitcher_default as default };

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

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

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

@@ -0,0 +1,29 @@
+import { __exportAll } from "../../../../../../../_virtual/_rolldown/runtime.js";
+import { Button } from "../../../Button/Button.js";
+import { Tooltip } from "../../../Tooltip/Tooltip.js";
+import "../../../index.js";
+import { Fragment, jsx } from "react/jsx-runtime";
+//#region packages/react/ui/components/testPage/demos/core/TooltipDemo.tsx
+var TooltipDemo_exports = /* @__PURE__ */ __exportAll({
+	default: () => TooltipDemo,
+	demoMeta: () => demoMeta
+});
+var demoMeta = {
+	title: "Tooltip",
+	order: 10,
+	contentClassName: "flex flex-wrap gap-3 items-start"
+};
+function TooltipDemo() {
+	return /* @__PURE__ */ jsx(Fragment, { children: [
+		"top",
+		"bottom",
+		"left",
+		"right"
+	].map((p) => /* @__PURE__ */ jsx(Tooltip, {
+		content: `placement: ${p}`,
+		placement: p,
+		children: /* @__PURE__ */ jsx(Button, { children: p })
+	}, p)) });
+}
+//#endregion
+export { TooltipDemo_exports, TooltipDemo as default, demoMeta };