@octohirono/stitch-design-system 0.1.0

package/dist/components/Skeleton/Skeleton.d.ts

@@ -0,0 +1,71 @@
+import React from 'react';
+export type SkeletonVariant = 'text' | 'circle' | 'rect' | 'paragraph';
+export interface SkeletonProps {
+    /**
+     * 是否显示骨架占位：`true` 渲染骨架，`false` 直接渲染 `children`
+     * @default true
+     */
+    loading?: boolean;
+    /**
+     * 骨架变体
+     * @default 'text'
+     */
+    variant?: SkeletonVariant;
+    /**
+     * 是否启用扫光动画（对齐 Ant v5 `Skeleton.active`）
+     * @default true
+     */
+    active?: boolean;
+    /** 行数（`paragraph` 变体有效） */
+    rows?: number;
+    /** 每行宽度（`paragraph` 变体有效，可传数组对不同行指定不同宽度） */
+    rowWidths?: (number | string)[];
+    /** 宽度（text/circle/rect 变体有效） */
+    width?: number | string;
+    /** 高度（circle/rect 变体有效） */
+    height?: number | string;
+    /** 透传到根元素 */
+    className?: string;
+    /** 透传到根元素 */
+    style?: React.CSSProperties;
+    /** 无障碍名（默认「加载中」） */
+    'aria-label'?: string;
+    /** 子元素（`loading=false` 时渲染） */
+    children?: React.ReactNode;
+}
+interface SkeletonComponent extends React.FC<SkeletonProps> {
+    Button: React.FC<SkeletonButtonProps>;
+    Input: React.FC<SkeletonInputProps>;
+    Avatar: React.FC<SkeletonAvatarProps>;
+}
+export interface SkeletonButtonProps {
+    /** @default 'middle' */
+    size?: 'small' | 'middle' | 'large';
+    /** @default true */
+    active?: boolean;
+    className?: string;
+    style?: React.CSSProperties;
+    'aria-label'?: string;
+}
+export interface SkeletonInputProps {
+    /** @default 'middle' */
+    size?: 'small' | 'middle' | 'large';
+    /** @default true */
+    active?: boolean;
+    className?: string;
+    style?: React.CSSProperties;
+    'aria-label'?: string;
+}
+export interface SkeletonAvatarProps {
+    /** @default 'middle' */
+    size?: 'small' | 'middle' | 'large';
+    /** @default 'circle' */
+    shape?: 'circle' | 'square';
+    /** @default true */
+    active?: boolean;
+    className?: string;
+    style?: React.CSSProperties;
+    'aria-label'?: string;
+}
+export declare const Skeleton: SkeletonComponent;
+export {};

package/dist/components/Skeleton/Skeleton.js

@@ -0,0 +1,147 @@
+import e from "./skeleton.module.js";
+import "react";
+import t from "clsx";
+import { Fragment as n, jsx as r } from "react/jsx-runtime";
+//#region packages/react/src/components/Skeleton/Skeleton.tsx
+var i = {
+	text: e["vt-text"],
+	circle: e["vt-circle"],
+	rect: e["vt-rect"],
+	paragraph: e["vt-paragraph"]
+}, a = [
+	"100%",
+	"92%",
+	"84%",
+	"76%",
+	"60%"
+], o = ({ loading: o = !0, variant: s = "text", active: c = !0, rows: l = 3, rowWidths: u, width: d, height: f, className: p, style: m, "aria-label": h = "加载中", children: g }) => {
+	if (!o && g) return /* @__PURE__ */ r(n, { children: g });
+	let _ = t(e.skeleton, c && e.active, i[s], p), v = {
+		role: "status",
+		"aria-busy": !0,
+		"aria-label": h
+	};
+	if (s === "paragraph") {
+		let n = Array.isArray(u) ? u : a, i = Math.max(1, l);
+		return /* @__PURE__ */ r("div", {
+			className: _,
+			style: m,
+			...v,
+			children: Array.from({ length: i }, (i, a) => {
+				let o = n[a] ?? n[n.length - 1] ?? "100%";
+				return /* @__PURE__ */ r("div", {
+					className: t(e.line, c && e.active),
+					style: { width: o },
+					"aria-hidden": !0
+				}, a);
+			})
+		});
+	}
+	if (s === "circle") {
+		let e = d ?? f ?? 44;
+		return /* @__PURE__ */ r("div", {
+			className: _,
+			style: {
+				width: e,
+				height: e,
+				...m
+			},
+			...v
+		});
+	}
+	return s === "rect" ? /* @__PURE__ */ r("div", {
+		className: _,
+		style: {
+			width: d ?? "100%",
+			height: f ?? 120,
+			...m
+		},
+		...v
+	}) : /* @__PURE__ */ r("div", {
+		className: _,
+		style: {
+			width: d ?? "100%",
+			height: f ?? 16,
+			...m
+		},
+		...v
+	});
+}, s = {
+	small: {
+		width: 80,
+		height: 32
+	},
+	middle: {
+		width: 100,
+		height: 40
+	},
+	large: {
+		width: 130,
+		height: 48
+	}
+}, c = ({ size: n = "middle", active: i = !0, className: a, style: o, "aria-label": c = "加载中" }) => {
+	let l = s[n];
+	return /* @__PURE__ */ r("div", {
+		className: t(e.skeleton, e["skeleton-btn"], i && e.active, a),
+		style: {
+			width: l.width,
+			height: l.height,
+			...o
+		},
+		role: "status",
+		"aria-busy": !0,
+		"aria-label": c
+	});
+};
+c.displayName = "Skeleton.Button";
+var l = {
+	small: {
+		width: 160,
+		height: 32
+	},
+	middle: {
+		width: 200,
+		height: 40
+	},
+	large: {
+		width: 240,
+		height: 48
+	}
+}, u = ({ size: n = "middle", active: i = !0, className: a, style: o, "aria-label": s = "加载中" }) => {
+	let c = l[n];
+	return /* @__PURE__ */ r("div", {
+		className: t(e.skeleton, e["skeleton-input"], i && e.active, a),
+		style: {
+			width: c.width,
+			height: c.height,
+			...o
+		},
+		role: "status",
+		"aria-busy": !0,
+		"aria-label": s
+	});
+};
+u.displayName = "Skeleton.Input";
+var d = {
+	small: 32,
+	middle: 44,
+	large: 56
+}, f = ({ size: n = "middle", shape: i = "circle", active: a = !0, className: o, style: s, "aria-label": c = "加载中" }) => {
+	let l = d[n];
+	return /* @__PURE__ */ r("div", {
+		className: t(e.skeleton, i === "circle" ? e["vt-circle"] : e["skeleton-avatar-square"], a && e.active, o),
+		style: {
+			width: l,
+			height: l,
+			...s
+		},
+		role: "status",
+		"aria-busy": !0,
+		"aria-label": c
+	});
+};
+f.displayName = "Skeleton.Avatar";
+var p = o;
+p.Button = c, p.Input = u, p.Avatar = f, p.displayName = "Skeleton";
+//#endregion
+export { p as Skeleton };

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

@@ -0,0 +1,2 @@
+export { Skeleton } from './Skeleton';
+export type { SkeletonProps, SkeletonVariant, SkeletonButtonProps, SkeletonInputProps, SkeletonAvatarProps, } from './Skeleton';

package/dist/components/Skeleton/skeleton.module.js

@@ -0,0 +1,16 @@
+//#region packages/react/src/components/Skeleton/skeleton.module.less
+var e = "_skeleton_p760x_1", t = "_active_p760x_11", n = "_line_p760x_44", r = {
+	skeleton: e,
+	active: t,
+	"stitch-skeleton-shimmer": "_stitch-skeleton-shimmer_p760x_1",
+	"vt-text": "_vt-text_p760x_26",
+	"vt-circle": "_vt-circle_p760x_31",
+	"vt-rect": "_vt-rect_p760x_34",
+	"vt-paragraph": "_vt-paragraph_p760x_37",
+	line: n,
+	"skeleton-btn": "_skeleton-btn_p760x_49",
+	"skeleton-input": "_skeleton-input_p760x_52",
+	"skeleton-avatar-square": "_skeleton-avatar-square_p760x_55"
+};
+//#endregion
+export { t as active, r as default, n as line, e as skeleton };

package/dist/components/Slider/Slider.d.ts

@@ -0,0 +1,58 @@
+import React from 'react';
+export type SliderOrientation = 'horizontal' | 'vertical';
+/**
+ * 拖动条（Ant `Slider` 语义）：拖 thumb 在 `min`–`max` 间按 `step` 取连续/离散值。
+ * 单值给标量（一个 thumb）、区间给数组（两个 thumb）；`value`/`defaultValue`/`onChange`
+ * + `min`/`max`/`step` + `disabled` + `orientation`。
+ *
+ * 跨-prop 注意事项：
+ * - **标量↔数组归一**：底层 `value` 恒为数组（支持多 thumb）；对外单值时接受标量、内部包成
+ *   `[v]`，`onValueChange(arr)` → 单值取 `arr[0]`、区间原样传数组。是否区间由 `value ??
+ *   defaultValue` 是否为数组判定（数组 = 区间，渲两个 thumb）。
+ * - **vs Progress**：Progress 只读展示进度、无 thumb 不可拖；Slider **可拖取值**。
+ *   vs Switch：Switch 是布尔两态，Slider 是连续/离散取值。
+ * - **受控/非受控双模式**：给 `value` 由父管（配 `onChange`），只给 `defaultValue` 组件自管；
+ *   两者内部包成数组后透传底层。
+ * - **Less 皮**：`track` 走 `--stitch-border` 底槽、`range` 走 `--stitch-accent`、`thumb`
+ *   圆点 + focus 环 `--stitch-focus-ring`；禁用态由底层挂的 `data-disabled` 描，组件不自持 state。
+ * - **键盘 / 焦点 / ARIA**（←→ 调值、Home/End、`aria-valuenow`）由底层保证，组件不重复实现；
+ *   thumb 是 `role="slider"`，**须有可及名**——用 `aria-label` 或 `aria-labelledby` 指定
+ *   （内容相关，由使用者给）。
+ */
+export interface SliderProps {
+    /** 受控值：标量 = 单值（一个 thumb），数组 = 区间（多个 thumb） */
+    value?: number | number[];
+    /** 非受控初始值：标量 = 单值，数组 = 区间 */
+    defaultValue?: number | number[];
+    /** 值变化回调；单值回标量、区间回数组（与传入形状一致） */
+    onChange?: (value: number | number[]) => void;
+    /**
+     * 最小值
+     * @default 0
+     */
+    min?: number;
+    /**
+     * 最大值
+     * @default 100
+     */
+    max?: number;
+    /**
+     * 步长
+     * @default 1
+     */
+    step?: number;
+    /** 禁用 */
+    disabled?: boolean;
+    /**
+     * 朝向
+     * @default 'horizontal'
+     */
+    orientation?: SliderOrientation;
+    /** 自定义类名（挂到根轨道容器） */
+    className?: string;
+    /** 无障碍标签（无可见 label 时给 thumb 一个可及名） */
+    'aria-label'?: string;
+    /** 关联外部可见 label 的 id */
+    'aria-labelledby'?: string;
+}
+export declare const Slider: React.FC<SliderProps>;

package/dist/components/Slider/Slider.js

@@ -0,0 +1,33 @@
+import e from "./slider.module.js";
+import "react";
+import t from "clsx";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+import { Slider as i } from "radix-ui";
+//#region packages/react/src/components/Slider/Slider.tsx
+var a = (e) => Array.isArray(e) ? e : [e], o = ({ value: o, defaultValue: s, onChange: c, min: l = 0, max: u = 100, step: d = 1, disabled: f = !1, orientation: p = "horizontal", className: m, "aria-label": h, "aria-labelledby": g }) => {
+	let _ = Array.isArray(o ?? s), v = o === void 0 ? void 0 : a(o), y = s === void 0 ? void 0 : a(s), b = (v ?? y)?.length ?? 1;
+	return /* @__PURE__ */ r(i.Root, {
+		className: t(e.root, m),
+		value: v,
+		defaultValue: y,
+		onValueChange: c ? (e) => {
+			c?.(_ ? e : e[0]);
+		} : void 0,
+		min: l,
+		max: u,
+		step: d,
+		disabled: f,
+		orientation: p,
+		children: [/* @__PURE__ */ n(i.Track, {
+			className: e.track,
+			children: /* @__PURE__ */ n(i.Range, { className: e.range })
+		}), Array.from({ length: b }, (t, r) => /* @__PURE__ */ n(i.Thumb, {
+			className: e.thumb,
+			"aria-label": h,
+			"aria-labelledby": g
+		}, r))]
+	});
+};
+o.displayName = "Slider";
+//#endregion
+export { o as Slider };

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

@@ -0,0 +1,2 @@
+export { Slider } from './Slider';
+export type { SliderProps, SliderOrientation } from './Slider';

package/dist/components/Slider/slider.module.js

@@ -0,0 +1,9 @@
+//#region packages/react/src/components/Slider/slider.module.less
+var e = "_root_1i2nk_1", t = "_track_1i2nk_23", n = "_range_1i2nk_36", r = "_thumb_1i2nk_47", i = {
+	root: e,
+	track: t,
+	range: n,
+	thumb: r
+};
+//#endregion
+export { i as default, n as range, e as root, r as thumb, t as track };

package/dist/components/Switch/Switch.d.ts

@@ -0,0 +1,50 @@
+import React from 'react';
+export type SwitchSize = 'small' | 'middle' | 'large';
+/**
+ * 开关（Ant `Switch` 语义）：`checked` / `defaultChecked` / `onChange(boolean)`，
+ * `<button role="switch" aria-checked>` + Space/Enter 键切换。结构 = 轨（button 本体）+
+ * `.handle`（滑块）+ `.inner`（轨内小文案，滑块对侧显示 `checkedChildren`/`unCheckedChildren`）。
+ *
+ * 跨-prop 注意事项：
+ * - **受控/非受控双模式**：给 `checked` 由父管，只给 `defaultChecked` 组件自管；原生 button
+ *   焦点 + 手动键处理，`aria-label` / `aria-labelledby` 透传。
+ * - **形状走 `--stitch-radius-button`（轨 + 滑块同用），非 `--stitch-radius-input`**：开关是
+ *   「按钮型动作」而非「取值盒」，取按钮圆角档以保住滑动隐喻（与 Checkbox/Radio 的取值盒不同源）。
+ *   ON 态填 `--stitch-accent` + 边 `--stitch-accent-active`（与 Checkbox/Radio 选中同源）；
+ *   OFF 轨走中性 `--stitch-border-strong`，滑块填 `--stitch-bg-elevated` + 1px `--stitch-border`。
+ * - **轨内文案竖向居中的实现 gotcha**：文案套一层 inline-block `.innerText` 承载
+ *   `text-box: trim-both cap alphabetic`（渐进增强）——**`text-box` 只对直接生成行盒的块/行内块
+ *   生效，放在 flex 的 `.inner` 上会被静默忽略**（computed 报 trim 但盒高不变、不居中）。裁到真实
+ *   cap/基线后按墨迹居中，解决 Latin 全大写（ON/OFF）无降部显偏低、与 CJK 墨位不一致的问题；
+ *   fallback（不支持的浏览器）走 `line-height:normal`。带降部的文案（小写 g/y）降部挂在裁剪盒外
+ *   略偏高，轨内标签惯常无降部、可接受。
+ * - **尺寸 `small`/`middle`/`large`**（默认 `middle`）：控件几何（轨高/宽、滑块直径）为物理像素、
+ *   非主题值；圆角/颜色/字体全走 token。`loading` 为**非交互 + `aria-busy` + 变暗**，无内建动画。
+ */
+export interface SwitchProps {
+    /** 是否选中（受控） */
+    checked?: boolean;
+    /** 默认是否选中（非受控） */
+    defaultChecked?: boolean;
+    /** 尺寸 */
+    size?: SwitchSize;
+    /** 禁用 */
+    disabled?: boolean;
+    /** 加载状态：非交互 + `aria-busy`（无内建 spinner 动画，见 notes） */
+    loading?: boolean;
+    /** 选中时轨内文案 */
+    checkedChildren?: React.ReactNode;
+    /** 未选中时轨内文案 */
+    unCheckedChildren?: React.ReactNode;
+    /** 变化回调 */
+    onChange?: (checked: boolean) => void;
+    /** 自定义类名 */
+    className?: string;
+    /** 自定义样式 */
+    style?: React.CSSProperties;
+    /** 无障碍标签（无可见 label 时使用） */
+    'aria-label'?: string;
+    /** 关联外部可见 label 的 id */
+    'aria-labelledby'?: string;
+}
+export declare const Switch: React.FC<SwitchProps>;

package/dist/components/Switch/Switch.js

@@ -0,0 +1,43 @@
+import e from "./switch.module.js";
+import { useCallback 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/Switch/Switch.tsx
+var o = ({ checked: o, defaultChecked: s = !1, size: c = "middle", disabled: l = !1, loading: u = !1, checkedChildren: d, unCheckedChildren: f, onChange: p, className: m, style: h, "aria-label": g, "aria-labelledby": _ }) => {
+	let [v, y] = n(s), b = o !== void 0, x = b ? o : v, S = t(() => {
+		if (l || u) return;
+		let e = !x;
+		b || y(e), p?.(e);
+	}, [
+		l,
+		u,
+		x,
+		b,
+		p
+	]), C = t((e) => {
+		(e.key === " " || e.key === "Enter") && (e.preventDefault(), S());
+	}, [S]);
+	return /* @__PURE__ */ a("button", {
+		type: "button",
+		role: "switch",
+		"aria-checked": x,
+		"aria-label": g,
+		"aria-labelledby": _,
+		"aria-busy": u || void 0,
+		className: r(e.switch, e[c], x && e.checked, l && e.disabled, u && e.loading, m),
+		style: h,
+		onClick: S,
+		onKeyDown: C,
+		disabled: l,
+		children: [/* @__PURE__ */ i("span", { className: e.handle }), /* @__PURE__ */ i("span", {
+			className: e.inner,
+			children: /* @__PURE__ */ i("span", {
+				className: e.innerText,
+				children: x ? d : f
+			})
+		})]
+	});
+};
+o.displayName = "Switch";
+//#endregion
+export { o as Switch };

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

@@ -0,0 +1,2 @@
+export { Switch } from './Switch';
+export type { SwitchProps, SwitchSize } from './Switch';

package/dist/components/Switch/switch.module.js

@@ -0,0 +1,15 @@
+//#region packages/react/src/components/Switch/switch.module.less
+var e = "_disabled_19mtb_18", t = "_checked_19mtb_18", n = "_handle_19mtb_37", r = "_inner_19mtb_54", i = "_innerText_19mtb_71", a = "_loading_19mtb_81", o = "_small_19mtb_85", s = "_middle_19mtb_92", c = "_large_19mtb_99", l = {
+	switch: "_switch_19mtb_1",
+	disabled: e,
+	checked: t,
+	handle: n,
+	inner: r,
+	innerText: i,
+	loading: a,
+	small: o,
+	middle: s,
+	large: c
+};
+//#endregion
+export { t as checked, l as default, e as disabled, n as handle, r as inner, i as innerText, c as large, a as loading, s as middle, o as small };

package/dist/components/Table/Table.d.ts

@@ -0,0 +1,65 @@
+import React, { HTMLAttributes } from 'react';
+export interface TableColumn<T = Record<string, unknown>> {
+    /** 列头（表头单元格内容，也是该列的可访问名来源） */
+    title: React.ReactNode;
+    /** 取值字段名；缺省时靠 `render` 自定义单元格 */
+    dataIndex?: keyof T;
+    /** 自定义单元格渲染，优先于 `dataIndex` 取值 */
+    render?: (value: unknown, record: T, index: number) => React.ReactNode;
+    /** 列宽（数字按 px，字符串原样） */
+    width?: string | number;
+    /** 单元格水平对齐 */
+    align?: 'left' | 'center' | 'right';
+    /** 额外内联样式，合并到该列每个单元格 */
+    style?: React.CSSProperties;
+}
+/**
+ * 数据表（Ant v5 `Table` 语义）：`columns` + `dataSource` + `rowKey`（字段名或函数）+
+ * `striped` / `showHeader` / `rowClassName` / `onRow` / `loading` / `emptyText` / `scroll`。
+ *
+ * 跨-prop 注意事项：
+ * - **纯展示件，无内部 state，未提供排序 / 选择**：源为纯展示语义，源码为权威、不臆造 API。
+ *   `extends HTMLAttributes<HTMLDivElement>`（`Omit<'onChange'>`），`...rest` 透传到卡面容器
+ *   （`className` / `style` / `data-*` / `aria-*`）。
+ * - **键盘维度**：表格本体无交互键盘行为；`scroll` 给定时容器成**可聚焦滚动区**（`tabIndex=0`，
+ *   WCAG 2.1.1 可滚动内容须键盘可达），有 `aria-label` 时才挂 `role="region"`（无名 region 是
+ *   a11y 噪声）。
+ * - **图标走 `<Icon>` 非裸 `<svg>`**：空态 `<Icon name="info">`（装饰 `aria-hidden`）；加载态为纯
+ *   CSS 环（中性描边 + `--stitch-accent` 高亮弧），loading overlay 挂 `role="status"` +
+ *   `aria-label`。
+ */
+export interface TableProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange'> {
+    /** 列定义（Ant v5 `columns` 语义） */
+    columns?: TableColumn[];
+    /** 数据源（Ant v5 `dataSource` 语义） */
+    dataSource?: Record<string, unknown>[];
+    /** 行 key：字段名或从记录派生的函数（缺省取 `key` 字段，再退化为下标） */
+    rowKey?: string | ((record: Record<string, unknown>) => string);
+    /**
+     * 斑马纹（偶数行加浅底）
+     * @default true
+     */
+    striped?: boolean;
+    /**
+     * 是否显示表头
+     * @default true
+     */
+    showHeader?: boolean;
+    /** 自定义行类名：静态字符串或从记录派生的函数 */
+    rowClassName?: string | ((record: Record<string, unknown>, index: number) => string);
+    /** 逐行透传原生属性（如 onClick），Ant v5 `onRow` 语义 */
+    onRow?: (record: Record<string, unknown>, index: number) => HTMLAttributes<HTMLTableRowElement>;
+    /**
+     * 加载态（叠加半透明遮罩 + spinner，屏蔽指针）
+     * @default false
+     */
+    loading?: boolean;
+    /** 空数据提示 */
+    emptyText?: React.ReactNode;
+    /** 溢出滚动（给定即让容器成为可键盘聚焦的滚动区，Ant v5 `scroll` 语义） */
+    scroll?: {
+        x?: number | string;
+        y?: number | string;
+    };
+}
+export declare const Table: React.FC<TableProps>;

package/dist/components/Table/Table.js

@@ -0,0 +1,75 @@
+import { Icon as e } from "../Icon/Icon.js";
+import t from "./table.module.js";
+import "react";
+import n from "clsx";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
+//#region packages/react/src/components/Table/Table.tsx
+var a = ({ columns: a = [], dataSource: o = [], rowKey: s = "key", striped: c = !0, showHeader: l = !0, rowClassName: u, onRow: d, loading: f = !1, emptyText: p = "暂无数据", scroll: m, className: h, style: g, "aria-label": _, ...v }) => {
+	let y = (e, t) => typeof s == "function" ? s(e) : e[s] || String(t), b = (e, r) => {
+		let i = typeof u == "function" ? u(e, r) : u;
+		return n(t.row, c && r % 2 == 1 && t.striped, i);
+	}, x = (e, t, n) => {
+		let r = e.dataIndex ? t[e.dataIndex] : void 0;
+		return e.render ? e.render(r, t, n) : r;
+	}, S = m != null, C = S && _ != null ? "region" : void 0;
+	return /* @__PURE__ */ i("div", {
+		className: n(t.wrapper, S && t.scrollable, h),
+		style: g,
+		tabIndex: S ? 0 : void 0,
+		role: C,
+		"aria-label": _,
+		...v,
+		children: [/* @__PURE__ */ i("table", {
+			className: n(t.table, f && t.loading),
+			children: [l && /* @__PURE__ */ r("thead", {
+				className: t.thead,
+				children: /* @__PURE__ */ r("tr", {
+					className: t.headerRow,
+					children: a.map((e, n) => /* @__PURE__ */ r("th", {
+						scope: "col",
+						className: t.headerCell,
+						style: {
+							width: e.width,
+							textAlign: e.align || "left",
+							...e.style
+						},
+						children: e.title
+					}, n))
+				})
+			}), /* @__PURE__ */ r("tbody", {
+				className: t.tbody,
+				children: o.length === 0 ? /* @__PURE__ */ r("tr", { children: /* @__PURE__ */ r("td", {
+					colSpan: a.length || 1,
+					className: t.emptyCell,
+					children: /* @__PURE__ */ i("div", {
+						className: t.emptyContent,
+						children: [/* @__PURE__ */ r(e, {
+							name: "info",
+							size: 40,
+							className: t.emptyIcon
+						}), /* @__PURE__ */ r("span", { children: p })]
+					})
+				}) }) : o.map((e, n) => /* @__PURE__ */ r("tr", {
+					className: b(e, n),
+					...d?.(e, n),
+					children: a.map((i, a) => /* @__PURE__ */ r("td", {
+						className: t.cell,
+						style: {
+							textAlign: i.align || "left",
+							...i.style
+						},
+						children: x(i, e, n)
+					}, a))
+				}, y(e, n)))
+			})]
+		}), f && /* @__PURE__ */ r("div", {
+			className: t.loadingOverlay,
+			role: "status",
+			"aria-label": "加载中",
+			children: /* @__PURE__ */ r("span", { className: t.loadingSpinner })
+		})]
+	});
+};
+a.displayName = "Table";
+//#endregion
+export { a as Table };

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

@@ -0,0 +1,2 @@
+export { Table } from './Table';
+export type { TableProps, TableColumn } from './Table';

package/dist/components/Table/table.module.js

@@ -0,0 +1,21 @@
+//#region packages/react/src/components/Table/table.module.less
+var e = "_wrapper_gfk3g_1", t = "_scrollable_gfk3g_11", n = "_table_gfk3g_18", r = "_thead_gfk3g_23", i = "_headerCell_gfk3g_26", a = "_tbody_gfk3g_36", o = "_row_gfk3g_39", s = "_striped_gfk3g_45", c = "_cell_gfk3g_51", l = "_emptyCell_gfk3g_63", u = "_emptyContent_gfk3g_67", d = "_emptyIcon_gfk3g_75", f = "_loading_gfk3g_79", p = "_loadingOverlay_gfk3g_83", m = "_loadingSpinner_gfk3g_93", h = "_spin_gfk3g_1", g = {
+	wrapper: e,
+	scrollable: t,
+	table: n,
+	thead: r,
+	headerCell: i,
+	tbody: a,
+	row: o,
+	striped: s,
+	cell: c,
+	emptyCell: l,
+	emptyContent: u,
+	emptyIcon: d,
+	loading: f,
+	loadingOverlay: p,
+	loadingSpinner: m,
+	spin: h
+};
+//#endregion
+export { c as cell, g as default, l as emptyCell, u as emptyContent, d as emptyIcon, i as headerCell, f as loading, p as loadingOverlay, m as loadingSpinner, o as row, t as scrollable, h as spin, s as striped, n as table, a as tbody, r as thead, e as wrapper };

package/dist/components/Tabs/Tabs.d.ts

@@ -0,0 +1,37 @@
+import React from 'react';
+export interface TabItem {
+    /** 唯一标识，切换 / 受控回写都用它 */
+    key: string;
+    /** 标签文本（tab 的可访问名来源） */
+    label: React.ReactNode;
+    /** 该 tab 激活时显示的面板内容 */
+    children: React.ReactNode;
+}
+/**
+ * 药丸标签组（Ant v5 `Tabs` `items` 语义）：`items` 面板列表 + 受控 `activeKey` /
+ * 非受控 `defaultActiveKey` + `onChange`。
+ *
+ * 跨-prop 注意事项：
+ * - **受控/非受控双模式**：给 `activeKey` 即受控（配 `onChange` 用），只给
+ *   `defaultActiveKey` 组件自管（缺省取首项）。`extends HTMLAttributes<HTMLDivElement>`
+ *   但 `Omit<'onChange'>`——原生 form 的 `onChange` 与本组件 `(key)=>void` 签名冲突；
+ *   `...rest` 透传到根 `<div>`（`className` / `style` / `data-*`）。
+ * - **`aria-label` 路由到 tablist**：显式解构后挂到 `role="tablist"` 而非根 `...rest`——
+ *   tablist 才是需要可访问名的元素。每个 tab 与其面板经 `aria-controls` / `aria-labelledby`
+ *   双向关联。
+ * - **激活指示双通道**：激活 tab 由「反色暗面填充（`--stitch-bg-inverted` +
+ *   `--stitch-text-on-dark`）+ `aria-selected`」两通道同时表达，无需额外状态图标；未激活为
+ *   透明底 + `--stitch-text-primary` + `--stitch-border` 发丝药丸边。切换时面板内容随
+ *   `activeKey` 重挂载令淡入每次都重放（`--stitch-motion-*`），而非仅首次挂载放一次。
+ */
+export interface TabsProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange'> {
+    /** 标签项列表（Ant v5 `items` 语义） */
+    items: TabItem[];
+    /** 非受控初始激活项 key（缺省取首项） */
+    defaultActiveKey?: string;
+    /** 受控激活项 key（给了即受控；配 `onChange` 用） */
+    activeKey?: string;
+    /** 激活项变化回调（受控/非受控都会触发） */
+    onChange?: (key: string) => void;
+}
+export declare const Tabs: React.FC<TabsProps>;