@octohirono/stitch-design-system 0.1.0

package/dist/components/Image/Image.js

@@ -0,0 +1,95 @@
+import { Icon as e } from "../Icon/Icon.js";
+import t from "./image.module.js";
+import { useCallback as n, useEffect as r, useRef as i, useState as a } from "react";
+import o from "clsx";
+import { Fragment as s, jsx as c, jsxs as l } from "react/jsx-runtime";
+import { createPortal as u } from "react-dom";
+//#region packages/react/src/components/Image/Image.tsx
+var d = (e) => e === "default" ? "" : t[`image-${e}`], f = ({ src: f, alt: p = "", width: m, height: h, color: g = "default", lazy: _ = !1, preview: v = !0, className: y, style: b, onLoad: x, onError: S, ...C }) => {
+	let [w, T] = a(!1), [E, D] = a(!1), [O, k] = a(!1), A = i(null), j = i(null), [M, N] = a(f);
+	f !== M && (N(f), T(!1), D(!1));
+	let P = n((e) => {
+		D(!0), x?.(e);
+	}, [x]), F = n((e) => {
+		T(!0), D(!0), S?.(e);
+	}, [S]);
+	r(() => {
+		if (!O) return;
+		A.current?.focus();
+		let e = (e) => {
+			e.key === "Escape" ? k(!1) : e.key === "Tab" && (e.preventDefault(), A.current?.focus());
+		};
+		return document.addEventListener("keydown", e), () => document.removeEventListener("keydown", e);
+	}, [O]), r(() => {
+		O || (j.current?.focus(), j.current = null);
+	}, [O]);
+	let I = () => {
+		j.current = document.activeElement, k(!0);
+	};
+	if (w) return /* @__PURE__ */ l("span", {
+		className: o(t.image, d(g), t.error, y),
+		style: {
+			width: m,
+			height: h,
+			...b
+		},
+		role: "img",
+		"aria-label": p || "图片加载失败",
+		children: [/* @__PURE__ */ c(e, {
+			name: "error",
+			size: 32
+		}), /* @__PURE__ */ c("span", { children: "图片加载失败" })]
+	});
+	let L = o(t.image, d(g), E && t.loaded, v && t.preview, y), R = {
+		width: m,
+		height: h,
+		...b
+	}, z = /* @__PURE__ */ c("img", {
+		src: f,
+		alt: p,
+		loading: _ ? "lazy" : void 0,
+		className: t.img,
+		onLoad: P,
+		onError: F,
+		...C
+	});
+	return v ? /* @__PURE__ */ l(s, { children: [/* @__PURE__ */ c("button", {
+		type: "button",
+		className: L,
+		style: R,
+		onClick: I,
+		children: z
+	}), u(O ? /* @__PURE__ */ c("div", {
+		className: t.mask,
+		onClick: () => k(!1),
+		children: /* @__PURE__ */ l("div", {
+			className: t.dialog,
+			role: "dialog",
+			"aria-modal": "true",
+			"aria-label": p ? `查看图片：${p}` : "图片预览",
+			onClick: (e) => e.stopPropagation(),
+			children: [/* @__PURE__ */ c("button", {
+				type: "button",
+				ref: A,
+				className: t.closeBtn,
+				"aria-label": "关闭预览",
+				onClick: () => k(!1),
+				children: /* @__PURE__ */ c(e, {
+					name: "close",
+					size: 16
+				})
+			}), /* @__PURE__ */ c("img", {
+				src: f,
+				alt: p,
+				className: t.previewImg
+			})]
+		})
+	}) : null, document.body)] }) : /* @__PURE__ */ c("span", {
+		className: L,
+		style: R,
+		children: z
+	});
+};
+f.displayName = "Image";
+//#endregion
+export { f as Image };

package/dist/components/Image/image.module.js

@@ -0,0 +1,27 @@
+//#region packages/react/src/components/Image/image.module.less
+var e = "_image_15m2u_1", t = "_img_15m2u_19", n = "_loaded_15m2u_26", r = "_error_15m2u_29", i = "_preview_15m2u_71", a = "_mask_15m2u_82", o = "_dialog_15m2u_92", s = "_previewImg_15m2u_97", c = "_closeBtn_15m2u_105", l = {
+	image: e,
+	img: t,
+	loaded: n,
+	error: r,
+	"image-accent": "_image-accent_15m2u_38",
+	"image-danger": "_image-danger_15m2u_41",
+	"image-success": "_image-success_15m2u_44",
+	"image-warning": "_image-warning_15m2u_47",
+	"image-info": "_image-info_15m2u_50",
+	"image-cat-1": "_image-cat-1_15m2u_53",
+	"image-cat-2": "_image-cat-2_15m2u_56",
+	"image-cat-3": "_image-cat-3_15m2u_59",
+	"image-cat-4": "_image-cat-4_15m2u_62",
+	"image-cat-5": "_image-cat-5_15m2u_65",
+	"image-cat-6": "_image-cat-6_15m2u_68",
+	preview: i,
+	mask: a,
+	"stitch-image-fade-in": "_stitch-image-fade-in_15m2u_1",
+	dialog: o,
+	previewImg: s,
+	"stitch-image-zoom-in": "_stitch-image-zoom-in_15m2u_1",
+	closeBtn: c
+};
+//#endregion
+export { c as closeBtn, l as default, o as dialog, r as error, e as image, t as img, n as loaded, a as mask, i as preview, s as previewImg };

package/dist/components/Image/index.d.ts

@@ -0,0 +1,2 @@
+export { Image } from './Image';
+export type { ImageProps, ImageColor } from './Image';

package/dist/components/Input/Input.d.ts

@@ -0,0 +1,41 @@
+import React from 'react';
+export type InputSize = 'small' | 'middle' | 'large';
+/**
+ * 文本输入框：结构靠 1px 边框（`--stitch-border`）而非 3D 影；圆角由 `--stitch-radius-input`
+ * 决定（随主题变）。只做插槽包裹，不发明取值逻辑。
+ *
+ * 跨-prop 注意事项：
+ * - **受控/非受控双模式**：给 `value` 由父管，只给 `defaultValue` 组件自管；`allowClear` 的
+ *   清除经 native setter + `dispatchEvent` 派发真实 `change`（`onChange` 收到的是完整
+ *   SyntheticEvent，与用户键入一致）。
+ * - **`prefix` / `suffix` 传你自己的 `<Icon>` 或文本**——**Do NOT** 传 emoji / Unicode 符号 /
+ *   裸 `<svg>`。`allowClear` 的清除按钮内部走 `<Icon name="close">`（非 Unicode `×`），是原生
+ *   `<button>`：可 Tab 聚焦、Enter/Space 触发，`clearAriaLabel` 定其可访问名。
+ * - **`status="error"` 同时置 `aria-invalid="true"`**；聚焦环走 `:focus-within` +
+ *   `--stitch-focus-ring`（含 prefix/suffix 整框）。
+ */
+export interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size' | 'prefix'> {
+    /** 输入框尺寸 */
+    size?: InputSize;
+    /** 前缀节点（传你自己的 `<Icon>` 或文本） */
+    prefix?: React.ReactNode;
+    /** 后缀节点（传你自己的 `<Icon>` 或文本） */
+    suffix?: React.ReactNode;
+    /**
+     * 允许一键清除（有值且非禁用时显示清除按钮）
+     * @default false
+     */
+    allowClear?: boolean;
+    /** 校验态（error 同时置 `aria-invalid`） */
+    status?: 'error' | 'warning';
+    /** 值变化回调 */
+    onChange?: React.ChangeEventHandler<HTMLInputElement>;
+    /** 清除回调 */
+    onClear?: () => void;
+    /**
+     * 清除按钮的无障碍标签
+     * @default '清除'
+     */
+    clearAriaLabel?: string;
+}
+export declare const Input: React.FC<InputProps>;

package/dist/components/Input/Input.js

@@ -0,0 +1,62 @@
+import { Icon as e } from "../Icon/Icon.js";
+import t from "./input.module.js";
+import { useCallback as n, useRef as r, useState as i } from "react";
+import a from "clsx";
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
+//#region packages/react/src/components/Input/Input.tsx
+var c = ({ size: c = "middle", prefix: l, suffix: u, allowClear: d = !1, status: f, disabled: p = !1, className: m, value: h, defaultValue: g, onChange: _, onClear: v, clearAriaLabel: y = "清除", ...b }) => {
+	let [x, S] = i(g ?? ""), C = h !== void 0, w = C ? h : x, T = r(null), E = n((e) => {
+		C || S(e.target.value), _?.(e);
+	}, [C, _]), D = n((e) => {
+		if (e.animationName !== "stitch-onautofillstart") return;
+		let t = e.currentTarget;
+		t.value !== w && E({
+			target: t,
+			currentTarget: t
+		});
+	}, [w, E]), O = n(() => {
+		C || S(""), v?.();
+		let e = T.current;
+		if (e) {
+			(Object.getOwnPropertyDescriptor(window.HTMLInputElement.prototype, "value")?.set)?.call(e, "");
+			let t = new Event("input", { bubbles: !0 });
+			e.dispatchEvent(t);
+		}
+	}, [C, v]), k = a(t.wrapper, t[`wrapper-${c}`], f && t[`wrapper-${f}`], p && t["wrapper-disabled"], m);
+	return /* @__PURE__ */ s("span", {
+		className: k,
+		children: [
+			l && /* @__PURE__ */ o("span", {
+				className: t.prefix,
+				children: l
+			}),
+			/* @__PURE__ */ o("input", {
+				ref: T,
+				className: t.input,
+				disabled: p,
+				value: w,
+				onChange: E,
+				onAnimationStart: D,
+				"aria-invalid": f === "error" ? "true" : void 0,
+				...b
+			}),
+			d && w && !p && /* @__PURE__ */ o("button", {
+				type: "button",
+				className: t.clear,
+				onClick: O,
+				"aria-label": y,
+				children: /* @__PURE__ */ o(e, {
+					name: "close",
+					size: 14
+				})
+			}),
+			u && /* @__PURE__ */ o("span", {
+				className: t.suffix,
+				children: u
+			})
+		]
+	});
+};
+c.displayName = "Input";
+//#endregion
+export { c as Input };

package/dist/components/Input/index.d.ts

@@ -0,0 +1,2 @@
+export { Input } from './Input';
+export type { InputProps, InputSize } from './Input';

package/dist/components/Input/input.module.js

@@ -0,0 +1,17 @@
+//#region packages/react/src/components/Input/input.module.less
+var e = "_wrapper_srps2_1", t = "_input_srps2_51", n = "_prefix_srps2_90", r = "_suffix_srps2_91", i = "_clear_srps2_104", a = {
+	wrapper: e,
+	"wrapper-disabled": "_wrapper-disabled_srps2_10",
+	"wrapper-error": "_wrapper-error_srps2_10",
+	"wrapper-warning": "_wrapper-warning_srps2_10",
+	"wrapper-small": "_wrapper-small_srps2_17",
+	"wrapper-middle": "_wrapper-middle_srps2_22",
+	"wrapper-large": "_wrapper-large_srps2_27",
+	input: t,
+	"stitch-onautofillstart": "_stitch-onautofillstart_srps2_1",
+	prefix: n,
+	suffix: r,
+	clear: i
+};
+//#endregion
+export { i as clear, a as default, t as input, n as prefix, r as suffix, e as wrapper };

package/dist/components/Label/Label.d.ts

@@ -0,0 +1,28 @@
+import React from 'react';
+/**
+ * 表单标签：为一个表单控件（Input / Switch / Checkbox…）提供文字标签，点标签即
+ * 聚焦 / 激活该控件。基于原生 `<label>`，通过 `htmlFor` 关联控件 id。组合 Radix
+ * `Label.Root`（单 part）。
+ *
+ * 跨-prop 注意事项：
+ * - **vs Form（表单容器）**：Form 会为它的每个 field **自动渲染** label（含必填星号 /
+ *   冒号 / 对齐），无需手挂本组件；独立 `Label` 用于 **Form 之外**的零散控件关联——
+ *   如手搭一个 `Input` 配文字标签时，用 `htmlFor` 指向控件 id。**不是**替代 Form 的
+ *   label 体系。
+ * - **`htmlFor` = 关联控件 id**：透传成原生 `<label for>`，浏览器据此把标签绑到同 id 的
+ *   控件；点标签聚焦 / 激活控件由原生保证（无需自写点击逻辑）。控件用 `id`、标签用同值
+ *   `htmlFor`。
+ * - **极简无状态**：文字走 `--stitch-text-primary` + `--stitch-font-body`，无
+ *   hover / disabled 等状态色（禁用语义由被关联的控件承载，非标签）。
+ */
+export interface LabelProps {
+    /** 关联控件的 id：透传成原生 `<label for>`，点标签即聚焦 / 激活该控件 */
+    htmlFor?: string;
+    /** 标签文字内容 */
+    children?: React.ReactNode;
+    /** 自定义类名（挂到 `<label>` 上） */
+    className?: string;
+    /** 行内样式（挂到 `<label>` 上） */
+    style?: React.CSSProperties;
+}
+export declare const Label: React.FC<LabelProps>;

package/dist/components/Label/Label.js

@@ -0,0 +1,15 @@
+import e from "./label.module.js";
+import "react";
+import t from "clsx";
+import { jsx as n } from "react/jsx-runtime";
+import { Label as r } from "radix-ui";
+//#region packages/react/src/components/Label/Label.tsx
+var i = ({ htmlFor: i, children: a, className: o, style: s }) => /* @__PURE__ */ n(r.Root, {
+	htmlFor: i,
+	className: t(e.root, o),
+	style: s,
+	children: a
+});
+i.displayName = "Label";
+//#endregion
+export { i as Label };

package/dist/components/Label/index.d.ts

@@ -0,0 +1,2 @@
+export { Label } from './Label';
+export type { LabelProps } from './Label';

package/dist/components/Label/label.module.js

@@ -0,0 +1,4 @@
+//#region packages/react/src/components/Label/label.module.less
+var e = "_root_1kq6y_1", t = { root: e };
+//#endregion
+export { t as default, e as root };

package/dist/components/Loading/Loading.d.ts

@@ -0,0 +1,22 @@
+import React from 'react';
+export type LoadingSize = 'small' | 'middle' | 'large';
+export interface LoadingProps {
+    /**
+     * 是否处于加载中：`true` 显示遮罩 + 转圈，`false` 淡出后隐藏
+     * （对齐 Ant v5 `Spin.spinning`）
+     * @default true
+     */
+    spinning?: boolean;
+    /**
+     * 转圈尺寸
+     * @default 'middle'
+     */
+    size?: LoadingSize;
+    /** 转圈下方的提示文案；字符串时兼作无障碍名 */
+    tip?: React.ReactNode;
+    /** 透传到遮罩根元素 */
+    className?: string;
+    /** 透传到遮罩根元素 */
+    style?: React.CSSProperties;
+}
+export declare const Loading: React.FC<LoadingProps>;

package/dist/components/Loading/Loading.js

@@ -0,0 +1,32 @@
+import e from "./loading.module.js";
+import { useEffect as t, useState as n } from "react";
+import r from "clsx";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
+//#region packages/react/src/components/Loading/Loading.tsx
+var o = 350, s = ({ spinning: s = !0, size: c = "middle", tip: l, className: u, style: d }) => {
+	let [f, p] = n(!s), [m, h] = n(s);
+	s !== m && (h(s), s && p(!1)), t(() => {
+		if (s) return;
+		let e = setTimeout(() => p(!0), o);
+		return () => clearTimeout(e);
+	}, [s]);
+	let g = typeof l == "string" && l ? l : l ? void 0 : "加载中";
+	return /* @__PURE__ */ a("div", {
+		className: r(e.overlay, !s && e.closing, f && e.hidden, u),
+		style: d,
+		role: "status",
+		"aria-live": "polite",
+		"aria-busy": s || void 0,
+		"aria-label": g,
+		children: [/* @__PURE__ */ i("span", {
+			className: r(e.spinner, e[`spinner-${c}`]),
+			"aria-hidden": "true"
+		}), l ? /* @__PURE__ */ i("span", {
+			className: e.tip,
+			children: l
+		}) : null]
+	});
+};
+s.displayName = "Loading";
+//#endregion
+export { s as Loading };

package/dist/components/Loading/index.d.ts

@@ -0,0 +1,2 @@
+export { Loading } from './Loading';
+export type { LoadingProps, LoadingSize } from './Loading';

package/dist/components/Loading/loading.module.js

@@ -0,0 +1,14 @@
+//#region packages/react/src/components/Loading/loading.module.less
+var e = "_overlay_jixc4_1", t = "_closing_jixc4_14", n = "_hidden_jixc4_17", r = "_spinner_jixc4_20", i = "_tip_jixc4_46", a = {
+	overlay: e,
+	closing: t,
+	hidden: n,
+	spinner: r,
+	"stitch-loading-spin": "_stitch-loading-spin_jixc4_1",
+	"spinner-small": "_spinner-small_jixc4_31",
+	"spinner-middle": "_spinner-middle_jixc4_36",
+	"spinner-large": "_spinner-large_jixc4_41",
+	tip: i
+};
+//#endregion
+export { t as closing, a as default, n as hidden, e as overlay, r as spinner, i as tip };

package/dist/components/Menubar/Menubar.d.ts

@@ -0,0 +1,64 @@
+import React from 'react';
+import { type IconName } from '../Icon';
+/**
+ * 菜单栏某个菜单里的一项。结构与 `DropdownMenuItem` / `ContextMenuItem` 完全一致
+ * （同族，同一心智）。
+ */
+export interface MenubarMenuItem {
+    /** 菜单项文字 */
+    label: React.ReactNode;
+    /** 选中该项时触发（底层 `onSelect` → 我们的 `onClick`）；有 `children` 的父项忽略此项 */
+    onClick?: () => void;
+    /** 危险操作（如删除）：文字走 `--stitch-danger`、高亮态软底 `--stitch-danger-bg` */
+    danger?: boolean;
+    /** 禁用该项（不可选、灰显；键盘导航跳过——由底层保证） */
+    disabled?: boolean;
+    /** 项前图标（必须是 `<Icon>` 支持的名，图标经 `<Icon>` 渲染、不接受裸 svg） */
+    icon?: IconName;
+    /** 子菜单项：非空 → 该项渲染为可展开的子菜单入口（底层 `Sub/SubTrigger/SubContent`） */
+    children?: MenubarMenuItem[];
+}
+/**
+ * 菜单栏里的一个顶层菜单：`label` 是栏上的按钮文字，`items` 是点开后的一列动作项。
+ */
+export interface MenubarMenu {
+    /** 顶层菜单按钮文字（如「文件」「编辑」「视图」） */
+    label: React.ReactNode;
+    /** 该菜单点开后的动作项数组（与 DropdownMenu 同结构） */
+    items: MenubarMenuItem[];
+}
+/**
+ * 菜单栏（桌面应用式命令栏）：横排**一组**互相协调的顶层菜单（文件 / 编辑 / 视图…），
+ * 打开一个后横向方向键即切到相邻菜单；每个菜单点开是一列动作项，点项**触发动作、无选中态**。
+ * 对外 **两层 `items` 数组**（`MenubarMenu[]`，每个 menu 再含一层 `MenubarMenuItem[]`）。
+ *
+ * 跨-prop 注意事项：
+ * - **vs NavigationMenu**：那是**站点导航**（链接为主、`role="navigation"`、跳页面）；Menubar 是
+ *   **应用命令栏**（一排动作菜单、`role="menubar"`、触发命令）。
+ * - **vs DropdownMenu**：那是**单个**触发按钮弹出的一列动作；Menubar 是**一排互相协调**的菜单——
+ *   横向键在菜单间移动、打开态跟随鼠标切换相邻菜单（命令栏心智），并非多个独立 DropdownMenu 并排。
+ * - **两层 items API**：外层 `MenubarMenu = { label, items }`（栏上一个菜单）；内层 `MenubarMenuItem`
+ *   与 DropdownMenu / ContextMenu 项**同结构**（`{ label, onClick?, danger?, disabled?, icon?, children? }`）。
+ *   底层 `onSelect` 归一成 `onClick`；`icon` 走 `<Icon>`（禁裸 svg）；某项 `children` 非空即渲染成可展开子菜单。
+ * - **面 = 浮起层**（复用 DropdownMenu 族皮）：菜单面走 `--stitch-bg-elevated` + `--stitch-text-primary`，
+ *   边 `--stitch-border`、圆角 `--stitch-radius-card`、阴影 `--stitch-shadow-base`；顶层 Trigger 是菜单栏按钮样式。
+ *   开合态 / 高亮态 / 禁用态由底层挂的 `data-state` / `data-highlighted` / `data-disabled` 描，组件不自持显隐 state。
+ * - **键盘 / 焦点 / ARIA**（横向键切菜单、纵向键走项、Enter 选中、Esc 关、焦点归还、`role="menubar"`）
+ *   由底层保证，组件不重复实现。
+ * - **悬停打开（hover 即开）**：鼠标停在某个顶层菜单约 `openDelay` 毫秒即自动展开（含首个、无需点击）；
+ *   一旦有菜单开着，移到相邻菜单即切换。Radix 默认要先 click/键盘开首个（之后才 hover 切换），本组件只补
+ *   「首个」这一环：保持 Radix **非受控**（切换/关闭全走 Radix 原生，无双主竞态），静息悬停满 `openDelay`
+ *   且此刻无菜单开着时，程序化在该 Trigger 派发 `pointerdown` 把首个开出来，之后交给 Radix。短延时防止鼠标
+ *   只是扫过工具栏就误弹。点击仍即时打开（延时只作用于悬停）。
+ */
+export interface MenubarProps {
+    /** 两层菜单数据：栏上一排菜单，每个菜单再含一列动作项 */
+    items: MenubarMenu[];
+    /** 悬停多久（ms）自动展开首个菜单（防误触的意图延时；菜单已开时切换相邻不受此限、即时切换） @default 150 */
+    openDelay?: number;
+    /** 自定义类名（挂到菜单栏根容器上） */
+    className?: string;
+    /** 给菜单栏（`role="menubar"`）的无障碍标签 */
+    'aria-label'?: string;
+}
+export declare const Menubar: React.FC<MenubarProps>;

package/dist/components/Menubar/Menubar.js

@@ -0,0 +1,70 @@
+import { Icon as e } from "../Icon/Icon.js";
+import t from "./menubar.module.js";
+import n from "react";
+import r from "clsx";
+import { Fragment as i, jsx as a, jsxs as o } from "react/jsx-runtime";
+import { Menubar as s } from "radix-ui";
+//#region packages/react/src/components/Menubar/Menubar.tsx
+function c(n, l = "") {
+	return n.map((n, u) => {
+		let d = `${l}${u}`, f = /* @__PURE__ */ o(i, { children: [n.icon && /* @__PURE__ */ a(e, {
+			name: n.icon,
+			size: "1em",
+			className: t.itemIcon
+		}), /* @__PURE__ */ a("span", {
+			className: t.itemLabel,
+			children: n.label
+		})] });
+		return n.children && n.children.length > 0 ? /* @__PURE__ */ o(s.Sub, { children: [/* @__PURE__ */ o(s.SubTrigger, {
+			className: r(t.item, n.danger && t.danger),
+			disabled: n.disabled,
+			children: [f, /* @__PURE__ */ a(e, {
+				name: "chevron-right",
+				size: "1em",
+				className: t.subArrow
+			})]
+		}), /* @__PURE__ */ a(s.Portal, { children: /* @__PURE__ */ a(s.SubContent, {
+			className: t.content,
+			sideOffset: 8,
+			children: c(n.children, `${d}-`)
+		}) })] }, d) : /* @__PURE__ */ a(s.Item, {
+			className: r(t.item, n.danger && t.danger),
+			disabled: n.disabled,
+			onSelect: n.onClick,
+			children: f
+		}, d);
+	});
+}
+var l = ({ items: e, openDelay: i = 150, className: l, "aria-label": u }) => {
+	let d = n.useRef(null), f = n.useRef(void 0), p = () => {
+		f.current !== void 0 && (clearTimeout(f.current), f.current = void 0);
+	};
+	n.useEffect(() => p, []);
+	let m = (e) => {
+		p(), f.current = setTimeout(() => {
+			d.current?.querySelector("[data-state=\"open\"]") || e.dispatchEvent(new MouseEvent("pointerdown", {
+				bubbles: !0,
+				button: 0
+			}));
+		}, i);
+	};
+	return /* @__PURE__ */ a(s.Root, {
+		ref: d,
+		className: r(t.root, l),
+		"aria-label": u,
+		onPointerLeave: p,
+		children: e.map((e, n) => /* @__PURE__ */ o(s.Menu, { children: [/* @__PURE__ */ a(s.Trigger, {
+			className: t.trigger,
+			onPointerEnter: (e) => m(e.currentTarget),
+			children: e.label
+		}), /* @__PURE__ */ a(s.Portal, { children: /* @__PURE__ */ a(s.Content, {
+			className: t.content,
+			align: "start",
+			sideOffset: 4,
+			children: c(e.items)
+		}) })] }, n))
+	});
+};
+l.displayName = "Menubar";
+//#endregion
+export { l as Menubar };

package/dist/components/Menubar/index.d.ts

@@ -0,0 +1,2 @@
+export { Menubar } from './Menubar';
+export type { MenubarProps, MenubarMenu, MenubarMenuItem } from './Menubar';

package/dist/components/Menubar/menubar.module.js

@@ -0,0 +1,15 @@
+//#region packages/react/src/components/Menubar/menubar.module.less
+var e = "_root_907u3_1", t = "_trigger_907u3_8", n = "_content_907u3_40", r = "_item_907u3_60", i = "_danger_907u3_80", a = "_itemIcon_907u3_87", o = "_itemLabel_907u3_91", s = "_subArrow_907u3_94", c = {
+	root: e,
+	trigger: t,
+	content: n,
+	"stitch-menubar-in": "_stitch-menubar-in_907u3_1",
+	"stitch-menubar-out": "_stitch-menubar-out_907u3_1",
+	item: r,
+	danger: i,
+	itemIcon: a,
+	itemLabel: o,
+	subArrow: s
+};
+//#endregion
+export { n as content, i as danger, c as default, r as item, a as itemIcon, o as itemLabel, e as root, s as subArrow, t as trigger };

package/dist/components/Modal/Modal.d.ts

@@ -0,0 +1,38 @@
+import React from 'react';
+export interface ModalProps {
+    /** 是否可见 */
+    open: boolean;
+    /** 标题 */
+    title?: React.ReactNode;
+    /** 宽度 @default 520 */
+    width?: number | string;
+    /**
+     * 点击遮罩是否关闭
+     * @default true
+     */
+    maskClosable?: boolean;
+    /** 底部按钮区域；`null` 隐藏页脚，`undefined` 用默认「取消/确定」 */
+    footer?: React.ReactNode | null;
+    /** 确认回调（默认页脚「确定」按钮） */
+    onOk?: () => void;
+    /** 关闭回调（遮罩 / Esc / 默认页脚「取消」触发；Ant v5 Modal 约定名 `onCancel`） */
+    onCancel?: () => void;
+    /** 对话框内容 */
+    children?: React.ReactNode;
+    /** 自定义类名 */
+    className?: string;
+    /** 遮罩层自定义样式 */
+    maskStyle?: React.CSSProperties;
+    /**
+     * 对话框语义角色：普通对话框用 `dialog`；必须做决策的确认框用 `alertdialog`
+     * （由 `AlertDialog` 复用本件时传入，读屏据此提示不可忽略）
+     * @default 'dialog'
+     */
+    role?: 'dialog' | 'alertdialog';
+}
+/**
+ * 对话框浮层：Portal 挂到 body，遮罩 + 居中面板。
+ * 打开时把焦点送进对话框并做 Tab 焦点陷阱，Esc / 点遮罩关闭，关闭时焦点归还触发元素（共享自 `useOverlay`）。
+ * `role`（默认 `dialog`，确认框变体传 `alertdialog`）+ `aria-modal` + `aria-labelledby`/`aria-describedby` 关联标题与正文。
+ */
+export declare const Modal: React.FC<ModalProps>;

package/dist/components/Modal/Modal.js

@@ -0,0 +1,68 @@
+import { Button as e } from "../Button/Button.js";
+import { useOverlay as t } from "../_internal/useOverlay.js";
+import n from "./modal.module.js";
+import { useCallback as r, useId as i, useRef as a } from "react";
+import { Fragment as o, jsx as s, jsxs as c } from "react/jsx-runtime";
+import { createPortal as l } from "react-dom";
+//#region packages/react/src/components/Modal/Modal.tsx
+var u = ({ open: u, title: d, width: f = 520, maskClosable: p = !0, footer: m, onOk: h, onCancel: g, children: _, className: v, maskStyle: y, role: b = "dialog" }) => {
+	let x = a(null);
+	t({
+		open: u,
+		containerRef: x,
+		onEscape: g
+	});
+	let S = r(() => {
+		p && g?.();
+	}, [p, g]), C = r((e) => {
+		e.stopPropagation();
+	}, []), w = `stitch-modal-${i().replace(/:/g, "")}`, T = `${w}-title`, E = `${w}-body`;
+	if (!u) return null;
+	let D = /* @__PURE__ */ c(o, { children: [/* @__PURE__ */ s(e, {
+		type: "default",
+		onClick: g,
+		children: "取消"
+	}), /* @__PURE__ */ s(e, {
+		type: "primary",
+		onClick: h,
+		children: "确定"
+	})] }), O = /* @__PURE__ */ s("div", {
+		className: n.mask,
+		style: y,
+		onClick: S,
+		children: /* @__PURE__ */ c("div", {
+			ref: x,
+			className: [n.modal, v].filter(Boolean).join(" "),
+			style: { width: f },
+			onClick: C,
+			role: b,
+			"aria-modal": "true",
+			"aria-labelledby": d ? T : void 0,
+			"aria-describedby": E,
+			tabIndex: -1,
+			children: [
+				d && /* @__PURE__ */ s("div", {
+					className: n.header,
+					children: /* @__PURE__ */ s("div", {
+						className: n.title,
+						id: T,
+						children: d
+					})
+				}),
+				/* @__PURE__ */ s("div", {
+					className: n.body,
+					id: E,
+					children: _
+				}),
+				m !== null && /* @__PURE__ */ s("div", {
+					className: n.footer,
+					children: m === void 0 ? D : m
+				})
+			]
+		})
+	});
+	return l(O, document.body);
+};
+u.displayName = "Modal";
+//#endregion
+export { u as Modal };

package/dist/components/Modal/index.d.ts

@@ -0,0 +1,2 @@
+export { Modal } from './Modal';
+export type { ModalProps } from './Modal';