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

package/fe/packages/react/ui/components/testPage/demos/menu/MenuAccordionDemo2.js

@@ -0,0 +1,4 @@
+//#region packages/react/ui/components/testPage/demos/menu/MenuAccordionDemo.tsx?raw
+var MenuAccordionDemo_default = "import { useState } from 'react'\nimport { LayoutDashboard, Package, Settings } from 'lucide-react'\nimport { Menu, type MenuItemData } from '@tc/ui-react/components'\nimport type { DemoMeta } from '../../types'\n\n\nexport const demoMeta = {\n  title: '2. 手风琴展开 (accordion)',\n  description: '同一层级同时只能展开一个子菜单',\n  order: 2,\n  contentClassName: 'space-y-3',\n} satisfies DemoMeta\n\n// ─── 示例数据 ────────────────────────────────────────────────────────────────\n\nconst menuItems: MenuItemData[] = [\n  {\n    key: 'dashboard',\n    label: 'Dashboard',\n    icon: <LayoutDashboard className=\"h-4 w-4\" />,\n  },\n  {\n    key: 'products',\n    label: 'Products',\n    icon: <Package className=\"h-4 w-4\" />,\n    children: [\n      { key: 'products-list', label: 'All Products' },\n      { key: 'products-create', label: 'Create New' },\n      {\n        key: 'products-categories',\n        label: 'Categories',\n        children: [\n          { key: 'cat-electronics', label: 'Electronics' },\n          { key: 'cat-clothing', label: 'Clothing' },\n        ],\n      },\n    ],\n  },\n  {\n    key: 'settings',\n    label: 'Settings',\n    icon: <Settings className=\"h-4 w-4\" />,\n    children: [\n      { key: 'settings-profile', label: 'Profile' },\n      { key: 'settings-billing', label: 'Billing', danger: true },\n    ],\n  },\n]\n\nexport default function MenuAccordionDemo() {\n  const [accordionKey, setAccordionKey] = useState('dashboard')\n  return (\n    <>\n      <div className=\"w-56 border rounded-lg overflow-hidden\">\n                <Menu mode=\"left\" expandMode=\"accordion\" selectedKey={accordionKey} onSelect={setAccordionKey} items={menuItems} />\n              </div>\n    </>\n  )\n}\n";
+//#endregion
+export { MenuAccordionDemo_default as default };

package/fe/packages/react/ui/components/testPage/demos/menu/MenuClickTriggerDemo.d.ts

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

package/fe/packages/react/ui/components/testPage/demos/menu/MenuClickTriggerDemo.js

@@ -0,0 +1,79 @@
+import { __exportAll } from "../../../../../../../_virtual/_rolldown/runtime.js";
+import { Menu } from "../../../Menu/Menu.js";
+import "../../../index.js";
+import { useState } from "react";
+import { Fragment as Fragment$1, jsx } from "react/jsx-runtime";
+import { LayoutDashboard, Package, Settings } from "lucide-react";
+//#region packages/react/ui/components/testPage/demos/menu/MenuClickTriggerDemo.tsx
+var MenuClickTriggerDemo_exports = /* @__PURE__ */ __exportAll({
+	default: () => MenuClickTriggerDemo,
+	demoMeta: () => demoMeta
+});
+var demoMeta = {
+	title: "7. Click 触发",
+	description: "点击展开子菜单，而非 hover",
+	order: 7,
+	contentClassName: "space-y-3"
+};
+var menuItems = [
+	{
+		key: "dashboard",
+		label: "Dashboard",
+		icon: /* @__PURE__ */ jsx(LayoutDashboard, { className: "h-4 w-4" })
+	},
+	{
+		key: "products",
+		label: "Products",
+		icon: /* @__PURE__ */ jsx(Package, { className: "h-4 w-4" }),
+		children: [
+			{
+				key: "products-list",
+				label: "All Products"
+			},
+			{
+				key: "products-create",
+				label: "Create New"
+			},
+			{
+				key: "products-categories",
+				label: "Categories",
+				children: [{
+					key: "cat-electronics",
+					label: "Electronics"
+				}, {
+					key: "cat-clothing",
+					label: "Clothing"
+				}]
+			}
+		]
+	},
+	{
+		key: "settings",
+		label: "Settings",
+		icon: /* @__PURE__ */ jsx(Settings, { className: "h-4 w-4" }),
+		children: [{
+			key: "settings-profile",
+			label: "Profile"
+		}, {
+			key: "settings-billing",
+			label: "Billing",
+			danger: true
+		}]
+	}
+];
+function MenuClickTriggerDemo() {
+	const [selectedKey, setSelectedKey] = useState("dashboard");
+	return /* @__PURE__ */ jsx(Fragment$1, { children: /* @__PURE__ */ jsx("div", {
+		className: "w-56 border rounded-lg overflow-hidden",
+		children: /* @__PURE__ */ jsx(Menu, {
+			mode: "left",
+			expandTrigger: "click",
+			expandMode: "multiple",
+			selectedKey,
+			onSelect: setSelectedKey,
+			items: menuItems
+		})
+	}) });
+}
+//#endregion
+export { MenuClickTriggerDemo_exports, MenuClickTriggerDemo as default, demoMeta };

package/fe/packages/react/ui/components/testPage/demos/menu/MenuClickTriggerDemo2.js

@@ -0,0 +1,4 @@
+//#region packages/react/ui/components/testPage/demos/menu/MenuClickTriggerDemo.tsx?raw
+var MenuClickTriggerDemo_default = "import { useState } from 'react'\nimport { LayoutDashboard, Package, Settings } from 'lucide-react'\nimport { Menu, type MenuItemData } from '@tc/ui-react/components'\nimport type { DemoMeta } from '../../types'\n\n\nexport const demoMeta = {\n  title: '7. Click 触发',\n  description: '点击展开子菜单，而非 hover',\n  order: 7,\n  contentClassName: 'space-y-3',\n} satisfies DemoMeta\n\n// ─── 示例数据 ────────────────────────────────────────────────────────────────\n\nconst menuItems: MenuItemData[] = [\n  {\n    key: 'dashboard',\n    label: 'Dashboard',\n    icon: <LayoutDashboard className=\"h-4 w-4\" />,\n  },\n  {\n    key: 'products',\n    label: 'Products',\n    icon: <Package className=\"h-4 w-4\" />,\n    children: [\n      { key: 'products-list', label: 'All Products' },\n      { key: 'products-create', label: 'Create New' },\n      {\n        key: 'products-categories',\n        label: 'Categories',\n        children: [\n          { key: 'cat-electronics', label: 'Electronics' },\n          { key: 'cat-clothing', label: 'Clothing' },\n        ],\n      },\n    ],\n  },\n  {\n    key: 'settings',\n    label: 'Settings',\n    icon: <Settings className=\"h-4 w-4\" />,\n    children: [\n      { key: 'settings-profile', label: 'Profile' },\n      { key: 'settings-billing', label: 'Billing', danger: true },\n    ],\n  },\n]\n\nexport default function MenuClickTriggerDemo() {\n  const [selectedKey, setSelectedKey] = useState('dashboard')\n  return (\n    <>\n      <div className=\"w-56 border rounded-lg overflow-hidden\">\n                <Menu\n                  mode=\"left\"\n                  expandTrigger=\"click\"\n                  expandMode=\"multiple\"\n                  selectedKey={selectedKey}\n                  onSelect={setSelectedKey}\n                  items={menuItems}\n                />\n              </div>\n    </>\n  )\n}\n";
+//#endregion
+export { MenuClickTriggerDemo_default as default };

package/fe/packages/react/ui/components/testPage/demos/menu/MenuCollapsedDemo.d.ts

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

package/fe/packages/react/ui/components/testPage/demos/menu/MenuCollapsedDemo.js

@@ -0,0 +1,82 @@
+import { __exportAll } from "../../../../../../../_virtual/_rolldown/runtime.js";
+import { Menu } from "../../../Menu/Menu.js";
+import "../../../index.js";
+import { useState } from "react";
+import { Fragment as Fragment$1, jsx } from "react/jsx-runtime";
+import { BarChart3, Bell, FileText, HelpCircle, LayoutDashboard, ShoppingCart, Users } from "lucide-react";
+//#region packages/react/ui/components/testPage/demos/menu/MenuCollapsedDemo.tsx
+var MenuCollapsedDemo_exports = /* @__PURE__ */ __exportAll({
+	default: () => MenuCollapsedDemo,
+	demoMeta: () => demoMeta
+});
+var demoMeta = {
+	title: "3. 折叠模式 (collapsed)",
+	description: "收起后仅展示图标，hover 弹出子菜单",
+	order: 3,
+	contentClassName: "space-y-3"
+};
+var iconMenuItems = [
+	{
+		key: "dashboard",
+		label: "Dashboard",
+		icon: /* @__PURE__ */ jsx(LayoutDashboard, { className: "h-4 w-4" })
+	},
+	{
+		key: "users",
+		label: "Users",
+		icon: /* @__PURE__ */ jsx(Users, { className: "h-4 w-4" }),
+		children: [{
+			key: "users-list",
+			label: "All Users",
+			icon: /* @__PURE__ */ jsx(Users, { className: "h-4 w-4" })
+		}, {
+			key: "users-roles",
+			label: "Roles",
+			icon: /* @__PURE__ */ jsx(FileText, { className: "h-4 w-4" })
+		}]
+	},
+	{
+		key: "analytics",
+		label: "Analytics",
+		icon: /* @__PURE__ */ jsx(BarChart3, { className: "h-4 w-4" }),
+		children: [{
+			key: "analytics-overview",
+			label: "Overview"
+		}, {
+			key: "analytics-reports",
+			label: "Reports"
+		}]
+	},
+	{
+		key: "orders",
+		label: "Orders",
+		icon: /* @__PURE__ */ jsx(ShoppingCart, { className: "h-4 w-4" })
+	},
+	{
+		key: "notifications",
+		label: "Notifications",
+		icon: /* @__PURE__ */ jsx(Bell, { className: "h-4 w-4" })
+	},
+	{
+		key: "help",
+		label: "Help",
+		icon: /* @__PURE__ */ jsx(HelpCircle, { className: "h-4 w-4" })
+	}
+];
+function MenuCollapsedDemo() {
+	const [collapsed, setCollapsed] = useState(false);
+	const [collapsedKey, setCollapsedKey] = useState("dashboard");
+	return /* @__PURE__ */ jsx(Fragment$1, { children: /* @__PURE__ */ jsx("div", {
+		className: "border rounded-lg overflow-hidden inline-flex",
+		children: /* @__PURE__ */ jsx(Menu, {
+			mode: "left",
+			selectedKey: collapsedKey,
+			onSelect: setCollapsedKey,
+			collapsed,
+			onCollapse: setCollapsed,
+			items: iconMenuItems
+		})
+	}) });
+}
+//#endregion
+export { MenuCollapsedDemo_exports, MenuCollapsedDemo as default, demoMeta };

package/fe/packages/react/ui/components/testPage/demos/menu/MenuCollapsedDemo2.js

@@ -0,0 +1,4 @@
+//#region packages/react/ui/components/testPage/demos/menu/MenuCollapsedDemo.tsx?raw
+var MenuCollapsedDemo_default = "import { useState } from 'react'\nimport { LayoutDashboard, Users, FileText, BarChart3, ShoppingCart, Bell, HelpCircle } from 'lucide-react'\nimport { Menu, type MenuItemData } from '@tc/ui-react/components'\nimport type { DemoMeta } from '../../types'\n\n\nexport const demoMeta = {\n  title: '3. 折叠模式 (collapsed)',\n  description: '收起后仅展示图标，hover 弹出子菜单',\n  order: 3,\n  contentClassName: 'space-y-3',\n} satisfies DemoMeta\n\n// ─── 示例数据 ────────────────────────────────────────────────────────────────\n\nconst iconMenuItems: MenuItemData[] = [\n  { key: 'dashboard', label: 'Dashboard', icon: <LayoutDashboard className=\"h-4 w-4\" /> },\n  {\n    key: 'users',\n    label: 'Users',\n    icon: <Users className=\"h-4 w-4\" />,\n    children: [\n      { key: 'users-list', label: 'All Users', icon: <Users className=\"h-4 w-4\" /> },\n      { key: 'users-roles', label: 'Roles', icon: <FileText className=\"h-4 w-4\" /> },\n    ],\n  },\n  {\n    key: 'analytics',\n    label: 'Analytics',\n    icon: <BarChart3 className=\"h-4 w-4\" />,\n    children: [\n      { key: 'analytics-overview', label: 'Overview' },\n      { key: 'analytics-reports', label: 'Reports' },\n    ],\n  },\n  { key: 'orders', label: 'Orders', icon: <ShoppingCart className=\"h-4 w-4\" /> },\n  { key: 'notifications', label: 'Notifications', icon: <Bell className=\"h-4 w-4\" /> },\n  { key: 'help', label: 'Help', icon: <HelpCircle className=\"h-4 w-4\" /> },\n]\n\nexport default function MenuCollapsedDemo() {\n  const [collapsed, setCollapsed] = useState(false)\n  const [collapsedKey, setCollapsedKey] = useState('dashboard')\n  return (\n    <>\n      <div className=\"border rounded-lg overflow-hidden inline-flex\">\n                <Menu\n                  mode=\"left\"\n                  selectedKey={collapsedKey}\n                  onSelect={setCollapsedKey}\n                  collapsed={collapsed}\n                  onCollapse={setCollapsed}\n                  items={iconMenuItems}\n                />\n              </div>\n    </>\n  )\n}\n";
+//#endregion
+export { MenuCollapsedDemo_default as default };

package/fe/packages/react/ui/components/testPage/demos/menu/MenuCollapsedNoIconDemo.d.ts

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

package/fe/packages/react/ui/components/testPage/demos/menu/MenuCollapsedNoIconDemo.js

@@ -0,0 +1,44 @@
+import { __exportAll } from "../../../../../../../_virtual/_rolldown/runtime.js";
+import { Menu } from "../../../Menu/Menu.js";
+import "../../../index.js";
+import { Fragment, jsx } from "react/jsx-runtime";
+import { LayoutDashboard, Settings } from "lucide-react";
+//#region packages/react/ui/components/testPage/demos/menu/MenuCollapsedNoIconDemo.tsx
+var MenuCollapsedNoIconDemo_exports = /* @__PURE__ */ __exportAll({
+	default: () => MenuCollapsedNoIconDemo,
+	demoMeta: () => demoMeta
+});
+var demoMeta = {
+	title: "9. 无 icon 折叠",
+	description: "收起时无 icon 的菜单项留白占位",
+	order: 9,
+	contentClassName: "space-y-3"
+};
+function MenuCollapsedNoIconDemo() {
+	return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx("div", {
+		className: "border rounded-lg overflow-hidden inline-flex",
+		children: /* @__PURE__ */ jsx(Menu, {
+			mode: "left",
+			defaultCollapsed: true,
+			expandMode: "multiple",
+			items: [
+				{
+					key: "a",
+					label: "Home",
+					icon: /* @__PURE__ */ jsx(LayoutDashboard, { className: "h-4 w-4" })
+				},
+				{
+					key: "b",
+					label: "Reports"
+				},
+				{
+					key: "c",
+					label: "Settings",
+					icon: /* @__PURE__ */ jsx(Settings, { className: "h-4 w-4" })
+				}
+			]
+		})
+	}) });
+}
+//#endregion
+export { MenuCollapsedNoIconDemo_exports, MenuCollapsedNoIconDemo as default, demoMeta };

package/fe/packages/react/ui/components/testPage/demos/menu/MenuCollapsedNoIconDemo2.js

@@ -0,0 +1,4 @@
+//#region packages/react/ui/components/testPage/demos/menu/MenuCollapsedNoIconDemo.tsx?raw
+var MenuCollapsedNoIconDemo_default = "import { LayoutDashboard, Settings } from 'lucide-react'\nimport { Menu } from '@tc/ui-react/components'\nimport type { DemoMeta } from '../../types'\n\n\nexport const demoMeta = {\n  title: '9. 无 icon 折叠',\n  description: '收起时无 icon 的菜单项留白占位',\n  order: 9,\n  contentClassName: 'space-y-3',\n} satisfies DemoMeta\n\n// ─── 示例数据 ────────────────────────────────────────────────────────────────\n\nexport default function MenuCollapsedNoIconDemo() {\n  return (\n    <>\n      <div className=\"border rounded-lg overflow-hidden inline-flex\">\n                <Menu\n                  mode=\"left\"\n                  defaultCollapsed={true}\n                  expandMode=\"multiple\"\n                  items={[\n                    { key: 'a', label: 'Home', icon: <LayoutDashboard className=\"h-4 w-4\" /> },\n                    { key: 'b', label: 'Reports' },\n                    { key: 'c', label: 'Settings', icon: <Settings className=\"h-4 w-4\" /> },\n                  ]}\n                />\n              </div>\n    </>\n  )\n}\n";
+//#endregion
+export { MenuCollapsedNoIconDemo_default as default };

package/fe/packages/react/ui/components/testPage/demos/menu/MenuJsxDemo.d.ts

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

package/fe/packages/react/ui/components/testPage/demos/menu/MenuJsxDemo.js

@@ -0,0 +1,64 @@
+import { __exportAll } from "../../../../../../../_virtual/_rolldown/runtime.js";
+import { Menu } from "../../../Menu/Menu.js";
+import "../../../index.js";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { HelpCircle, LayoutDashboard, Package, Settings } from "lucide-react";
+//#region packages/react/ui/components/testPage/demos/menu/MenuJsxDemo.tsx
+var MenuJsxDemo_exports = /* @__PURE__ */ __exportAll({
+	default: () => MenuJsxDemo,
+	demoMeta: () => demoMeta
+});
+var demoMeta = {
+	title: "4. JSX 组合式",
+	description: "不使用 data config，直接组合 Menu.Item / Menu.SubMenu",
+	order: 4,
+	contentClassName: "space-y-3"
+};
+function MenuJsxDemo() {
+	return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx("div", {
+		className: "w-56 border rounded-lg overflow-hidden",
+		children: /* @__PURE__ */ jsxs(Menu, {
+			mode: "left",
+			defaultSelectedKey: "overview",
+			children: [
+				/* @__PURE__ */ jsx(Menu.Item, {
+					eventKey: "overview",
+					icon: /* @__PURE__ */ jsx(LayoutDashboard, { className: "h-4 w-4" }),
+					children: "Overview"
+				}),
+				/* @__PURE__ */ jsxs(Menu.SubMenu, {
+					eventKey: "manage",
+					label: "Manage",
+					icon: /* @__PURE__ */ jsx(Package, { className: "h-4 w-4" }),
+					children: [/* @__PURE__ */ jsx(Menu.Item, {
+						eventKey: "manage-list",
+						children: "List"
+					}), /* @__PURE__ */ jsx(Menu.Item, {
+						eventKey: "manage-edit",
+						children: "Edit"
+					})]
+				}),
+				/* @__PURE__ */ jsxs(Menu.SubMenu, {
+					eventKey: "settings",
+					label: "Settings",
+					icon: /* @__PURE__ */ jsx(Settings, { className: "h-4 w-4" }),
+					children: [/* @__PURE__ */ jsx(Menu.Item, {
+						eventKey: "jsx-profile",
+						children: "Profile"
+					}), /* @__PURE__ */ jsx(Menu.Item, {
+						eventKey: "jsx-billing",
+						danger: true,
+						children: "Billing"
+					})]
+				}),
+				/* @__PURE__ */ jsx(Menu.Item, {
+					eventKey: "help",
+					icon: /* @__PURE__ */ jsx(HelpCircle, { className: "h-4 w-4" }),
+					children: "Help"
+				})
+			]
+		})
+	}) });
+}
+//#endregion
+export { MenuJsxDemo_exports, MenuJsxDemo as default, demoMeta };

package/fe/packages/react/ui/components/testPage/demos/menu/MenuJsxDemo2.js

@@ -0,0 +1,4 @@
+//#region packages/react/ui/components/testPage/demos/menu/MenuJsxDemo.tsx?raw
+var MenuJsxDemo_default = "import { LayoutDashboard, Package, Settings, HelpCircle } from 'lucide-react'\nimport { Menu } from '@tc/ui-react/components'\nimport type { DemoMeta } from '../../types'\n\n\nexport const demoMeta = {\n  title: '4. JSX 组合式',\n  description: '不使用 data config，直接组合 Menu.Item / Menu.SubMenu',\n  order: 4,\n  contentClassName: 'space-y-3',\n} satisfies DemoMeta\n\n// ─── 示例数据 ────────────────────────────────────────────────────────────────\n\nexport default function MenuJsxDemo() {\n  return (\n    <>\n      <div className=\"w-56 border rounded-lg overflow-hidden\">\n                <Menu mode=\"left\" defaultSelectedKey=\"overview\">\n                  <Menu.Item eventKey=\"overview\" icon={<LayoutDashboard className=\"h-4 w-4\" />}>\n                    Overview\n                  </Menu.Item>\n                  <Menu.SubMenu eventKey=\"manage\" label=\"Manage\" icon={<Package className=\"h-4 w-4\" />}>\n                    <Menu.Item eventKey=\"manage-list\">List</Menu.Item>\n                    <Menu.Item eventKey=\"manage-edit\">Edit</Menu.Item>\n                  </Menu.SubMenu>\n                  <Menu.SubMenu eventKey=\"settings\" label=\"Settings\" icon={<Settings className=\"h-4 w-4\" />}>\n                    <Menu.Item eventKey=\"jsx-profile\">Profile</Menu.Item>\n                    <Menu.Item eventKey=\"jsx-billing\" danger>\n                      Billing\n                    </Menu.Item>\n                  </Menu.SubMenu>\n                  <Menu.Item eventKey=\"help\" icon={<HelpCircle className=\"h-4 w-4\" />}>\n                    Help\n                  </Menu.Item>\n                </Menu>\n              </div>\n    </>\n  )\n}\n";
+//#endregion
+export { MenuJsxDemo_default as default };

package/fe/packages/react/ui/components/testPage/demos/menu/MenuLeftMultipleDemo.d.ts

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

package/fe/packages/react/ui/components/testPage/demos/menu/MenuLeftMultipleDemo.js

@@ -0,0 +1,81 @@
+import { __exportAll } from "../../../../../../../_virtual/_rolldown/runtime.js";
+import { Menu } from "../../../Menu/Menu.js";
+import "../../../index.js";
+import { useState } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+import { LayoutDashboard, Package, Settings } from "lucide-react";
+//#region packages/react/ui/components/testPage/demos/menu/MenuLeftMultipleDemo.tsx
+var MenuLeftMultipleDemo_exports = /* @__PURE__ */ __exportAll({
+	default: () => MenuLeftMultipleDemo,
+	demoMeta: () => demoMeta
+});
+var demoMeta = {
+	title: "1. 基础 Left 模式 (data config)",
+	description: "最常用的侧边菜单，支持多级展开 (expandMode=multiple)",
+	order: 1,
+	contentClassName: "space-y-3"
+};
+var menuItems = [
+	{
+		key: "dashboard",
+		label: "Dashboard",
+		icon: /* @__PURE__ */ jsx(LayoutDashboard, { className: "h-4 w-4" })
+	},
+	{
+		key: "products",
+		label: "Products",
+		icon: /* @__PURE__ */ jsx(Package, { className: "h-4 w-4" }),
+		children: [
+			{
+				key: "products-list",
+				label: "All Products"
+			},
+			{
+				key: "products-create",
+				label: "Create New"
+			},
+			{
+				key: "products-categories",
+				label: "Categories",
+				children: [{
+					key: "cat-electronics",
+					label: "Electronics"
+				}, {
+					key: "cat-clothing",
+					label: "Clothing"
+				}]
+			}
+		]
+	},
+	{
+		key: "settings",
+		label: "Settings",
+		icon: /* @__PURE__ */ jsx(Settings, { className: "h-4 w-4" }),
+		children: [{
+			key: "settings-profile",
+			label: "Profile"
+		}, {
+			key: "settings-billing",
+			label: "Billing",
+			danger: true
+		}]
+	}
+];
+function MenuLeftMultipleDemo() {
+	const [selectedKey, setSelectedKey] = useState("dashboard");
+	return /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx("div", {
+		className: "w-56 border rounded-lg overflow-hidden",
+		children: /* @__PURE__ */ jsx(Menu, {
+			mode: "left",
+			expandMode: "multiple",
+			selectedKey,
+			onSelect: setSelectedKey,
+			items: menuItems
+		})
+	}), /* @__PURE__ */ jsxs("p", {
+		className: "text-sm text-muted-foreground",
+		children: ["当前选中: ", selectedKey]
+	})] });
+}
+//#endregion
+export { MenuLeftMultipleDemo_exports, MenuLeftMultipleDemo as default, demoMeta };

package/fe/packages/react/ui/components/testPage/demos/menu/MenuLeftMultipleDemo2.js

@@ -0,0 +1,4 @@
+//#region packages/react/ui/components/testPage/demos/menu/MenuLeftMultipleDemo.tsx?raw
+var MenuLeftMultipleDemo_default = "import { useState } from 'react'\nimport { LayoutDashboard, Package, Settings } from 'lucide-react'\nimport { Menu, type MenuItemData } from '@tc/ui-react/components'\nimport type { DemoMeta } from '../../types'\n\n\nexport const demoMeta = {\n  title: '1. 基础 Left 模式 (data config)',\n  description: '最常用的侧边菜单，支持多级展开 (expandMode=multiple)',\n  order: 1,\n  contentClassName: 'space-y-3',\n} satisfies DemoMeta\n\n// ─── 示例数据 ────────────────────────────────────────────────────────────────\n\nconst menuItems: MenuItemData[] = [\n  {\n    key: 'dashboard',\n    label: 'Dashboard',\n    icon: <LayoutDashboard className=\"h-4 w-4\" />,\n  },\n  {\n    key: 'products',\n    label: 'Products',\n    icon: <Package className=\"h-4 w-4\" />,\n    children: [\n      { key: 'products-list', label: 'All Products' },\n      { key: 'products-create', label: 'Create New' },\n      {\n        key: 'products-categories',\n        label: 'Categories',\n        children: [\n          { key: 'cat-electronics', label: 'Electronics' },\n          { key: 'cat-clothing', label: 'Clothing' },\n        ],\n      },\n    ],\n  },\n  {\n    key: 'settings',\n    label: 'Settings',\n    icon: <Settings className=\"h-4 w-4\" />,\n    children: [\n      { key: 'settings-profile', label: 'Profile' },\n      { key: 'settings-billing', label: 'Billing', danger: true },\n    ],\n  },\n]\n\nexport default function MenuLeftMultipleDemo() {\n  const [selectedKey, setSelectedKey] = useState('dashboard')\n  return (\n    <>\n      <div className=\"w-56 border rounded-lg overflow-hidden\">\n                <Menu mode=\"left\" expandMode=\"multiple\" selectedKey={selectedKey} onSelect={setSelectedKey} items={menuItems} />\n              </div>\n              <p className=\"text-sm text-muted-foreground\">当前选中: {selectedKey}</p>\n    </>\n  )\n}\n";
+//#endregion
+export { MenuLeftMultipleDemo_default as default };

package/fe/packages/react/ui/components/testPage/demos/menu/MenuPopupDemo.d.ts

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

package/fe/packages/react/ui/components/testPage/demos/menu/MenuPopupDemo.js

@@ -0,0 +1,56 @@
+import { __exportAll } from "../../../../../../../_virtual/_rolldown/runtime.js";
+import { Menu } from "../../../Menu/Menu.js";
+import "../../../index.js";
+import { useState } from "react";
+import { Fragment as Fragment$1, jsx } from "react/jsx-runtime";
+import { HelpCircle, LayoutDashboard, Package } from "lucide-react";
+//#region packages/react/ui/components/testPage/demos/menu/MenuPopupDemo.tsx
+var MenuPopupDemo_exports = /* @__PURE__ */ __exportAll({
+	default: () => MenuPopupDemo,
+	demoMeta: () => demoMeta
+});
+var demoMeta = {
+	title: "5. 子菜单弹出模式 (popup)",
+	description: "展开状态下也能让子菜单以弹出方式展示",
+	order: 5,
+	contentClassName: "space-y-3"
+};
+function MenuPopupDemo() {
+	const [selectedKey, setSelectedKey] = useState("dashboard");
+	return /* @__PURE__ */ jsx(Fragment$1, { children: /* @__PURE__ */ jsx("div", {
+		className: "w-56 border rounded-lg overflow-hidden",
+		children: /* @__PURE__ */ jsx(Menu, {
+			mode: "left",
+			expandMode: "multiple",
+			selectedKey,
+			onSelect: setSelectedKey,
+			items: [
+				{
+					key: "d1",
+					label: "Dashboard",
+					icon: /* @__PURE__ */ jsx(LayoutDashboard, { className: "h-4 w-4" })
+				},
+				{
+					key: "p1",
+					label: "Products",
+					icon: /* @__PURE__ */ jsx(Package, { className: "h-4 w-4" }),
+					popup: true,
+					children: [{
+						key: "p1-list",
+						label: "All Products"
+					}, {
+						key: "p1-create",
+						label: "Create New"
+					}]
+				},
+				{
+					key: "d3",
+					label: "Help",
+					icon: /* @__PURE__ */ jsx(HelpCircle, { className: "h-4 w-4" })
+				}
+			]
+		})
+	}) });
+}
+//#endregion
+export { MenuPopupDemo_exports, MenuPopupDemo as default, demoMeta };

package/fe/packages/react/ui/components/testPage/demos/menu/MenuPopupDemo2.js

@@ -0,0 +1,4 @@
+//#region packages/react/ui/components/testPage/demos/menu/MenuPopupDemo.tsx?raw
+var MenuPopupDemo_default = "import { useState } from 'react'\nimport { LayoutDashboard, Package, HelpCircle } from 'lucide-react'\nimport { Menu } from '@tc/ui-react/components'\nimport type { DemoMeta } from '../../types'\n\n\nexport const demoMeta = {\n  title: '5. 子菜单弹出模式 (popup)',\n  description: '展开状态下也能让子菜单以弹出方式展示',\n  order: 5,\n  contentClassName: 'space-y-3',\n} satisfies DemoMeta\n\n// ─── 示例数据 ────────────────────────────────────────────────────────────────\n\nexport default function MenuPopupDemo() {\n  const [selectedKey, setSelectedKey] = useState('dashboard')\n  return (\n    <>\n      <div className=\"w-56 border rounded-lg overflow-hidden\">\n                <Menu\n                  mode=\"left\"\n                  expandMode=\"multiple\"\n                  selectedKey={selectedKey}\n                  onSelect={setSelectedKey}\n                  items={[\n                    { key: 'd1', label: 'Dashboard', icon: <LayoutDashboard className=\"h-4 w-4\" /> },\n                    {\n                      key: 'p1',\n                      label: 'Products',\n                      icon: <Package className=\"h-4 w-4\" />,\n                      popup: true,\n                      children: [\n                        { key: 'p1-list', label: 'All Products' },\n                        { key: 'p1-create', label: 'Create New' },\n                      ],\n                    },\n                    { key: 'd3', label: 'Help', icon: <HelpCircle className=\"h-4 w-4\" /> },\n                  ]}\n                />\n              </div>\n    </>\n  )\n}\n";
+//#endregion
+export { MenuPopupDemo_default as default };

package/fe/packages/react/ui/components/testPage/demos/menu/MenuStateDemo.d.ts

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

package/fe/packages/react/ui/components/testPage/demos/menu/MenuStateDemo.js

@@ -0,0 +1,67 @@
+import { __exportAll } from "../../../../../../../_virtual/_rolldown/runtime.js";
+import { Menu } from "../../../Menu/Menu.js";
+import "../../../index.js";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { FileText, Settings } from "lucide-react";
+//#region packages/react/ui/components/testPage/demos/menu/MenuStateDemo.tsx
+var MenuStateDemo_exports = /* @__PURE__ */ __exportAll({
+	default: () => MenuStateDemo,
+	demoMeta: () => demoMeta
+});
+var demoMeta = {
+	title: "8. 状态展示",
+	description: "disabled / danger 样式演示",
+	order: 8,
+	contentClassName: "space-y-3"
+};
+function MenuStateDemo() {
+	return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx("div", {
+		className: "w-56 border rounded-lg overflow-hidden",
+		children: /* @__PURE__ */ jsxs(Menu, {
+			mode: "left",
+			defaultSelectedKey: "normal",
+			children: [
+				/* @__PURE__ */ jsx(Menu.Item, {
+					eventKey: "normal",
+					icon: /* @__PURE__ */ jsx(FileText, { className: "h-4 w-4" }),
+					children: "正常菜单项"
+				}),
+				/* @__PURE__ */ jsx(Menu.Item, {
+					eventKey: "disabled-item",
+					disabled: true,
+					icon: /* @__PURE__ */ jsx(FileText, { className: "h-4 w-4" }),
+					children: "禁用菜单项"
+				}),
+				/* @__PURE__ */ jsx(Menu.Item, {
+					eventKey: "danger-item",
+					danger: true,
+					icon: /* @__PURE__ */ jsx(FileText, { className: "h-4 w-4" }),
+					children: "危险菜单项"
+				}),
+				/* @__PURE__ */ jsxs(Menu.SubMenu, {
+					eventKey: "sub-disabled",
+					label: "含禁用子项",
+					icon: /* @__PURE__ */ jsx(Settings, { className: "h-4 w-4" }),
+					children: [
+						/* @__PURE__ */ jsx(Menu.Item, {
+							eventKey: "sub-normal",
+							children: "正常子项"
+						}),
+						/* @__PURE__ */ jsx(Menu.Item, {
+							eventKey: "sub-danger",
+							danger: true,
+							children: "危险子项"
+						}),
+						/* @__PURE__ */ jsx(Menu.Item, {
+							eventKey: "sub-disabled-item",
+							disabled: true,
+							children: "禁用子项"
+						})
+					]
+				})
+			]
+		})
+	}) });
+}
+//#endregion
+export { MenuStateDemo_exports, MenuStateDemo as default, demoMeta };

package/fe/packages/react/ui/components/testPage/demos/menu/MenuStateDemo2.js

@@ -0,0 +1,4 @@
+//#region packages/react/ui/components/testPage/demos/menu/MenuStateDemo.tsx?raw
+var MenuStateDemo_default = "import { Settings, FileText } from 'lucide-react'\nimport { Menu } from '@tc/ui-react/components'\nimport type { DemoMeta } from '../../types'\n\n\nexport const demoMeta = {\n  title: '8. 状态展示',\n  description: 'disabled / danger 样式演示',\n  order: 8,\n  contentClassName: 'space-y-3',\n} satisfies DemoMeta\n\n// ─── 示例数据 ────────────────────────────────────────────────────────────────\n\nexport default function MenuStateDemo() {\n  return (\n    <>\n      <div className=\"w-56 border rounded-lg overflow-hidden\">\n                <Menu mode=\"left\" defaultSelectedKey=\"normal\">\n                  <Menu.Item eventKey=\"normal\" icon={<FileText className=\"h-4 w-4\" />}>\n                    正常菜单项\n                  </Menu.Item>\n                  <Menu.Item eventKey=\"disabled-item\" disabled icon={<FileText className=\"h-4 w-4\" />}>\n                    禁用菜单项\n                  </Menu.Item>\n                  <Menu.Item eventKey=\"danger-item\" danger icon={<FileText className=\"h-4 w-4\" />}>\n                    危险菜单项\n                  </Menu.Item>\n                  <Menu.SubMenu eventKey=\"sub-disabled\" label=\"含禁用子项\" icon={<Settings className=\"h-4 w-4\" />}>\n                    <Menu.Item eventKey=\"sub-normal\">正常子项</Menu.Item>\n                    <Menu.Item eventKey=\"sub-danger\" danger>\n                      危险子项\n                    </Menu.Item>\n                    <Menu.Item eventKey=\"sub-disabled-item\" disabled>\n                      禁用子项\n                    </Menu.Item>\n                  </Menu.SubMenu>\n                </Menu>\n              </div>\n    </>\n  )\n}\n";
+//#endregion
+export { MenuStateDemo_default as default };

package/fe/packages/react/ui/components/testPage/demos/menu/MenuTopDemo.d.ts

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