@aithe/aithe-ui 26.2.2

package/docs/api/basic/icon.md

@@ -0,0 +1,245 @@
+# AitheIcon / AitheIcon 图标
+
+> Vector icon entry for the Aithe UI icon system. Renders an SVG glyph from the built-in icon map based on the `name` property. All icons use a 24×24 viewBox, stroke-based rendering with `stroke-width: 1.8`, and inherit color via `currentColor`.
+> 矢量图标组件，用于 Aithe UI 图标系统。根据 `name` 属性从内置图标映射中渲染 SVG 图形。所有图标使用 24×24 视口，基于描边渲染（stroke-width: 1.8），颜色继承 currentColor。
+
+## Slots / 插槽
+
+| Name | Description (EN) | Description (CN) |
+|------|-------------------|-------------------|
+| (default) | Default slot for custom SVG content (overrides built-in glyph). | 默认插槽，用于自定义 SVG 内容（覆盖内置图形）。 |
+
+## Properties / 属性
+
+| Name | Type | Default | Description (EN) | Description (CN) |
+|------|------|---------|-------------------|-------------------|
+| name | `string` | `'sparkles'` | Icon glyph name from the built-in map. If the name is not found, renders an empty SVG. | 内置图标名称。若名称不存在，渲染空 SVG。 |
+| color | `string` | `''` | Custom stroke/fill color. When empty, falls back to `currentColor` (inherits from parent). | 自定义颜色。为空时继承父元素 currentColor。 |
+| size | `string` | `'md'` | Icon size. Accepts preset aliases (`sm` → 14px, `md` → 18px, `lg` → 22px) or any explicit CSS value (e.g. `"32px"`, `"2rem"`). Bare numbers get `px` appended. | 图标尺寸。支持预设别名（sm→14px, md→18px, lg→22px）或显式 CSS 值。纯数字自动追加 px。 |
+
+## Events / 事件
+
+| Name | Detail | Description (EN) | Description (CN) |
+|------|--------|-------------------|-------------------|
+| — | — | No custom events. | 无自定义事件。 |
+
+## CSS Custom Properties / CSS 自定义属性
+
+| Variable | Default | Description (EN) | Description (CN) |
+|----------|---------|-------------------|-------------------|
+| `--aithe-icon-size` | `18px` | Controls the SVG width/height. Set dynamically from the `size` property. | 控制 SVG 宽高。由 `size` 属性动态设置。 |
+| `--aithe-icon-color` | `currentColor` | Controls the host `color` which cascades to `stroke: currentColor`. | 控制宿主 `color`，级联至 `stroke: currentColor`。 |
+
+## Size Presets / 尺寸预设
+
+| Preset | Pixel Value | Description (EN) | Description (CN) |
+|--------|-------------|-------------------|-------------------|
+| `sm` | 14px | Small icon for inline text or tight layouts. | 小图标，用于行内文本或紧凑布局。 |
+| `md` | 18px | Default medium icon. | 默认中等图标。 |
+| `lg` | 22px | Large icon for headings or standalone display. | 大图标，用于标题或独立展示。 |
+
+You can also pass any valid CSS dimension (e.g. `"32px"`, `"2rem"`, `"24"` → `24px`).
+也可以传入任意合法 CSS 尺寸值（如 `"32px"`、`"2rem"`、`"24"` → `24px`）。
+
+## Built-in Icon Catalog / 内置图标目录
+
+### General / 通用
+
+| Name | Description (EN) | Description (CN) |
+|------|-------------------|-------------------|
+| `sparkles` | Decorative sparkle / star burst. | 装饰性闪光 / 星芒。 |
+| `close` | Close / dismiss (× mark). | 关闭 / 取消（× 标记）。 |
+| `check` | Checkmark / success tick. | 对勾 / 成功标记。 |
+| `info` | Information circle with dot. | 信息圆圈（带点）。 |
+| `warning` | Warning triangle with exclamation. | 警告三角（带感叹号）。 |
+| `image` | Image / photo placeholder. | 图片 / 照片占位符。 |
+| `search` | Magnifying glass search icon. | 搜索放大镜图标。 |
+| `plus` | Plus / add sign. | 加号 / 添加。 |
+| `minus` | Minus / subtract sign. | 减号 / 减少。 |
+| `menu` | Horizontal three-line hamburger menu. | 水平三线汉堡菜单。 |
+| `more` | Vertical three-dot overflow menu. | 垂直三点溢出菜单。 |
+| `settings` | Gear / cog settings icon. | 齿轮设置图标。 |
+| `home` | House / home icon. | 房屋 / 首页图标。 |
+| `star` | Five-pointed star. | 五角星。 |
+| `heart` | Heart / favorite icon. | 心形 / 收藏图标。 |
+| `copy` | Copy / duplicate clipboard. | 复制 / 剪贴板。 |
+| `download` | Download arrow into tray. | 下载箭头。 |
+| `upload` | Upload arrow from tray. | 上传箭头。 |
+| `share` | Share / distribute nodes. | 分享 / 分发节点。 |
+| `link` | Chain link / URL icon. | 链接 / URL 图标。 |
+| `external` | External link with arrow. | 外部链接（带箭头）。 |
+| `refresh` | Circular refresh / reload arrows. | 循环刷新 / 重载箭头。 |
+| `edit` | Pencil / edit icon. | 铅笔 / 编辑图标。 |
+| `trash` | Trash / delete bin. | 垃圾桶 / 删除。 |
+| `filter` | Funnel filter icon. | 漏斗筛选图标。 |
+| `sort` | Sort / swap vertical arrows. | 排序 / 上下箭头。 |
+| `lock` | Locked padlock. | 锁定挂锁。 |
+| `unlock` | Unlocked padlock. | 解锁挂锁。 |
+| `eye` | Eye / view / visible. | 眼睛 / 查看 / 可见。 |
+| `eyeOff` | Eye with slash / hidden. | 眼睛带斜线 / 隐藏。 |
+| `clock` | Clock / time icon. | 时钟 / 时间图标。 |
+| `calendar` | Calendar / date icon. | 日历 / 日期图标。 |
+| `pin` | Map pin / location marker. | 地图钉 / 位置标记。 |
+| `flag` | Flag / banner icon. | 旗帜 / 标记图标。 |
+| `bookmark` | Bookmark / save marker. | 书签 / 保存标记。 |
+| `paperclip` | Paperclip / attachment. | 回形针 / 附件。 |
+| `tag` | Tag / label badge. | 标签 / 标记徽章。 |
+| `thumbUp` | Thumbs up / like. | 点赞 / 赞。 |
+| `thumbDown` | Thumbs down / dislike. | 点踩 / 踩。 |
+
+### Arrows / 箭头
+
+| Name | Description (EN) | Description (CN) |
+|------|-------------------|-------------------|
+| `arrowUp` | Arrow pointing up. | 向上箭头。 |
+| `arrowDown` | Arrow pointing down. | 向下箭头。 |
+| `arrowLeft` | Arrow pointing left. | 向左箭头。 |
+| `arrowRight` | Arrow pointing right. | 向右箭头。 |
+| `chevronUp` | Chevron pointing up. | 向上折叠箭头。 |
+| `chevronDown` | Chevron pointing down. | 向下折叠箭头。 |
+| `chevronLeft` | Chevron pointing left. | 向左折叠箭头。 |
+| `chevronRight` | Chevron pointing right. | 向右折叠箭头。 |
+| `expand` | Expand / fullscreen diagonal arrows. | 展开 / 全屏对角箭头。 |
+| `collapse` | Collapse / minimize diagonal arrows. | 收起 / 缩小对角箭头。 |
+
+### Status / 状态
+
+| Name | Description (EN) | Description (CN) |
+|------|-------------------|-------------------|
+| `success` | Success circle with checkmark. | 成功圆圈（带对勾）。 |
+| `error` | Error circle with × mark. | 错误圆圈（带 × 标记）。 |
+| `question` | Question circle with query mark. | 问题圆圈（带问号）。 |
+
+### Media / 媒体
+
+| Name | Description (EN) | Description (CN) |
+|------|-------------------|-------------------|
+| `play` | Play button circle with triangle. | 播放按钮（带三角）。 |
+| `pause` | Pause circle with double bars. | 暂停圆圈（双竖线）。 |
+| `volume` | Speaker with sound waves. | 音量喇叭（带声波）。 |
+| `mute` | Speaker with × (muted). | 静音喇叭（带 ×）。 |
+| `camera` | Camera / photo device. | 相机 / 拍照设备。 |
+| `video` | Video camera icon. | 视频摄像机图标。 |
+| `music` | Music note icon. | 音符图标。 |
+
+### Communication / 交流
+
+| Name | Description (EN) | Description (CN) |
+|------|-------------------|-------------------|
+| `mail` | Envelope / email icon. | 信封 / 邮件图标。 |
+| `bell` | Bell / notification icon. | 铃铛 / 通知图标。 |
+| `chat` | Chat bubble / message icon. | 聊天气泡 / 消息图标。 |
+| `phone` | Telephone icon. | 电话图标。 |
+
+### Data / 数据
+
+| Name | Description (EN) | Description (CN) |
+|------|-------------------|-------------------|
+| `barChart` | Bar chart / vertical bars. | 柱状图 / 垂直条形。 |
+| `pieChart` | Pie chart / circular segments. | 饼图 / 圆形分段。 |
+| `database` | Database / stacked cylinders. | 数据库 / 堆叠圆柱。 |
+| `code` | Code brackets `< >`. | 代码括号 `< >`。 |
+| `terminal` | Terminal / command prompt. | 终端 / 命令提示符。 |
+| `file` | Document / file icon. | 文档 / 文件图标。 |
+| `folder` | Folder / directory icon. | 文件夹 / 目录图标。 |
+
+### Layout / 布局
+
+| Name | Description (EN) | Description (CN) |
+|------|-------------------|-------------------|
+| `grid` | Grid / four-square layout. | 网格 / 四方格布局。 |
+| `list` | List / bullet lines. | 列表 / 带点行。 |
+| `sidebar` | Sidebar / panel with divider. | 侧边栏 / 带分隔面板。 |
+| `maximize` | Maximize / expand corners. | 最大化 / 展开角标。 |
+| `minimize` | Minimize / collapse corners. | 最小化 / 收缩角标。 |
+
+### User / 用户
+
+| Name | Description (EN) | Description (CN) |
+|------|-------------------|-------------------|
+| `user` | Single user / person silhouette. | 单用户 / 人物轮廓。 |
+| `users` | Multiple users / group silhouette. | 多用户 / 群组轮廓。 |
+
+### Weather / 天气
+
+| Name | Description (EN) | Description (CN) |
+|------|-------------------|-------------------|
+| `sun` | Sun / daylight icon. | 太阳 / 日光图标。 |
+| `moon` | Moon / nighttime icon. | 月亮 / 夜间图标。 |
+| `cloud` | Cloud / overcast icon. | 云 / 阴天图标。 |
+
+## Rendering Behavior / 渲染行为
+
+- **ViewBox**: All icons render inside an `<svg viewBox="0 0 24 24">`.
+- **Stroke-based**: `fill: none`, `stroke: currentColor`, `stroke-width: 1.8`, `stroke-linecap: round`, `stroke-linejoin: round`.
+- **Unknown name**: If `name` does not match any entry in the icon map, the SVG renders with no glyph (empty).
+- **Slot override**: Content placed in the default slot replaces the built-in glyph entirely.
+
+所有图标在 `<svg viewBox="0 0 24 24">` 内渲染。基于描边：fill: none, stroke: currentColor, stroke-width: 1.8。未知名称渲染空 SVG。默认插槽内容覆盖内置图形。
+
+## Examples / 示例
+
+### Basic usage / 基本用法
+
+```html
+<aithe-icon name="sparkles" size="lg" color="#4d8dff"></aithe-icon>
+<aithe-icon name="check" size="sm"></aithe-icon>
+<aithe-icon name="heart" color="var(--aithe-danger-6)"></aithe-icon>
+```
+
+### Size presets / 尺寸预设
+
+```html
+<aithe-icon name="search" size="sm"></aithe-icon>
+<aithe-icon name="search" size="md"></aithe-icon>
+<aithe-icon name="search" size="lg"></aithe-icon>
+<aithe-icon name="search" size="32px"></aithe-icon>
+```
+
+### Custom color / 自定义颜色
+
+```html
+<aithe-icon name="warning" color="#f59e0b"></aithe-icon>
+<aithe-icon name="success" color="var(--aithe-success-6)"></aithe-icon>
+<aithe-icon name="error" color="var(--aithe-danger-6)"></aithe-icon>
+```
+
+### Status icons / 状态图标
+
+```html
+<aithe-icon name="success" size="lg" color="var(--aithe-success-6)"></aithe-icon>
+<aithe-icon name="error" size="lg" color="var(--aithe-danger-6)"></aithe-icon>
+<aithe-icon name="warning" size="lg" color="var(--aithe-warning-6)"></aithe-icon>
+<aithe-icon name="info" size="lg" color="var(--aithe-primary-6)"></aithe-icon>
+```
+
+### Arrow icons / 箭头图标
+
+```html
+<aithe-icon name="arrowUp"></aithe-icon>
+<aithe-icon name="arrowDown"></aithe-icon>
+<aithe-icon name="arrowLeft"></aithe-icon>
+<aithe-icon name="arrowRight"></aithe-icon>
+<aithe-icon name="chevronUp"></aithe-icon>
+<aithe-icon name="chevronDown"></aithe-icon>
+```
+
+### Communication icons / 交流图标
+
+```html
+<aithe-icon name="mail" size="md"></aithe-icon>
+<aithe-icon name="bell" size="md"></aithe-icon>
+<aithe-icon name="chat" size="md"></aithe-icon>
+<aithe-icon name="phone" size="md"></aithe-icon>
+```
+
+### Custom SVG via slot / 通过插槽自定义 SVG
+
+```html
+<aithe-icon size="lg" color="#10b981">
+  <svg viewBox="0 0 24 24" style="width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:2;">
+    <circle cx="12" cy="12" r="10"></circle>
+    <path d="M8 12l4 4 4-8"></path>
+  </svg>
+</aithe-icon>
+```

package/docs/api/basic/input.md

@@ -0,0 +1,43 @@
+# AitheInput / AitheInput 输入框
+
+> Single-line text input field with prefix/suffix slots, status states, and clearable support.
+> 单行文本输入框，支持前缀/后缀插槽、状态标记和可清除功能。
+
+## Slots / 插槽
+
+| Name | Description (EN) | Description (CN) |
+|------|-------------------|-------------------|
+| (default) | Default slot (unused). | 默认插槽（未使用）。 |
+| prefix | Content before the input (icon, label, etc.). | 输入框前的内容（图标、标签等）。 |
+| suffix | Content after the input (icon, unit, etc.). | 输入框后的内容（图标、单位等）。 |
+
+## Properties / 属性
+
+| Name | Type | Default | Description (EN) | Description (CN) |
+|------|------|---------|-------------------|-------------------|
+| type | `'text' \| 'password' \| 'number' \| 'tel' \| 'email'` | `'text'` | HTML input type attribute. | HTML input 类型属性。 |
+| size | `'sm' \| 'md' \| 'lg'` | `'md'` | Size scale of the input. | 输入框的尺寸规格。 |
+| status | `'normal' \| 'error' \| 'success'` | `'normal'` | Validation status indicator. | 验证状态指示器。 |
+| value | `string` | `''` | Current value of the input. | 输入框的当前值。 |
+| placeholder | `string` | `''` | Placeholder text. | 占位符文本。 |
+| disabled | `boolean` | `false` | Whether the input is disabled. | 输入框是否禁用。 |
+| readonly | `boolean` | `false` | Whether the input is read-only. | 输入框是否只读。 |
+| clearable | `boolean` | `false` | Whether to show a clear button when the input has a value. | 输入框有值时是否显示清除按钮。 |
+| name | `string` | `''` | HTML `name` attribute. | HTML `name` 属性。 |
+| autocomplete | `string` | `'off'` | HTML `autocomplete` attribute. | HTML `autocomplete` 属性。 |
+| label | `string` | `''` | Accessible label (used as `aria-label` when no visible label exists). | 无障碍标签（当无可见标签时用作 `aria-label`）。 |
+
+## Events / 事件
+
+| Name | Detail | Description (EN) | Description (CN) |
+|------|--------|-------------------|-------------------|
+| aithe-input | `{ value }` | Emitted on every keystroke with `{ value }`. | 每次按键时发出 `{ value }`。 |
+| aithe-change | `{ value }` | Emitted when the value is committed with `{ value }`. | 值提交时发出 `{ value }`。 |
+| aithe-clear | — | Emitted when the clear button is clicked. | 清除按钮被点击时发出。 |
+
+## Examples / 示例
+
+```html
+<aithe-input placeholder="Search..." clearable></aithe-input>
+<aithe-input status="error" label="Email">invalid@</aithe-input>
+```

package/docs/api/basic/tag.md

@@ -0,0 +1,34 @@
+# AitheTag / AitheTag 标签
+
+> Colored tag / label with optional close and select behavior.
+> 彩色标签，支持关闭和选中交互。
+
+## Slots / 插槽
+
+| Name | Description (EN) | Description (CN) |
+|------|-------------------|-------------------|
+| (default) | Default slot for tag label text. | 标签文本内容。 |
+
+## Properties / 属性
+
+| Name | Type | Default | Description (EN) | Description (CN) |
+|------|------|---------|-------------------|-------------------|
+| type | `'primary' \| 'success' \| 'warning' \| 'danger' \| 'default'` | `'default'` | Tag color variant. | 标签颜色类型。 |
+| closable | `boolean` | `false` | Whether the tag shows a close button. Clicking it animates and removes the tag from DOM. | 是否显示关闭按钮。点击后动画移除标签。 |
+| selectable | `boolean` | `false` | Whether the tag can be toggled (selected/unselected). | 是否可选中切换。 |
+| selected | `boolean` | `false` | Whether the tag is currently selected. | 当前是否选中。 |
+| rounded | `'sm' \| 'md' \| 'lg' \| 'full'` | `'full'` | Border-radius preset. | 圆角预设。 |
+| disabled | `boolean` | `false` | Whether the tag is disabled. | 是否禁用。 |
+
+## Events / 事件
+
+| Name | Detail | Description (EN) | Description (CN) |
+|------|--------|-------------------|-------------------|
+| aithe-change | `{ selected }` | Emitted when selectable tag is toggled. | 选中状态变更时触发。 |
+| aithe-close | — | Emitted when the close button is clicked, before the tag is removed from DOM. | 关闭按钮点击时触发，在标签从 DOM 移除之前。 |
+
+## Examples / 示例
+
+```html
+<aithe-tag type="primary" closable>Selectable Tag</aithe-tag>
+```

package/docs/api/basic/textarea.md

@@ -0,0 +1,34 @@
+# AitheTextarea / AitheTextarea 多行文本框
+
+> Multi-line text input component with auto-grow support.
+> 多行文本输入组件，支持自动增长。
+
+## Slots / 插槽
+
+| Name | Description (EN) | Description (CN) |
+|------|-------------------|-------------------|
+| (default) | Default slot (unused; content controlled by value property). | 默认插槽（未使用，内容由 value 属性控制）。 |
+
+## Properties / 属性
+
+| Name | Type | Default | Description (EN) | Description (CN) |
+|------|------|---------|-------------------|-------------------|
+| rows | `number` | `4` | Number of visible text rows. | 可见文本行数。 |
+| placeholder | `string` | `''` | Placeholder text shown when empty. | 空内容时的占位文本。 |
+| resize | `'none' \| 'both' \| 'horizontal' \| 'vertical'` | `'vertical'` | Resize direction allowed for the textarea. | 允许的调整大小方向。 |
+| value | `string` | `''` | Current textarea value. | 当前文本值。 |
+| maxlength | `number` | `-1` | Maximum character length (-1 means unlimited). | 最大字符长度（-1 表示不限）。 |
+| disabled | `boolean` | `false` | Whether the textarea is disabled. | 是否禁用。 |
+
+## Events / 事件
+
+| Name | Detail | Description (EN) | Description (CN) |
+|------|--------|-------------------|-------------------|
+| aithe-input | `{ value }` | Emitted on each keystroke with current value. | 每次输入时触发。 |
+| aithe-change | `{ value }` | Emitted when the value is committed. | 值提交时触发。 |
+
+## Examples / 示例
+
+```html
+<aithe-textarea rows="4" placeholder="Enter text..." maxlength="200"></aithe-textarea>
+```

package/docs/api/container/callout.md

@@ -0,0 +1,30 @@
+# AitheCallout / Aithe提示块
+
+> Highlighted callout block with colored left border and optional title.
+> 高亮提示块，带彩色左边框和可选标题。
+
+## Slots / 插槽
+
+| Name | Description (EN) | Description (CN) |
+|------|-------------------|-------------------|
+| (default) | Default slot for callout body content. | 提示块正文内容的默认插槽。 |
+
+## Properties / 属性
+
+| Name | Type | Default | Description (EN) | Description (CN) |
+|------|------|---------|-------------------|-------------------|
+| type | `'default' | 'success' | 'warning' | 'danger'` | `'default'` | Color variant of the callout. | 提示块的颜色类型。 |
+| title | `string` | `''` | Optional title displayed above the body. | 正文上方显示的可选标题。 |
+| icon | `string` | `''` | Icon name to display before the title. Uses built-in `aithe-icon` names. | 在标题前显示的图标名称，使用 aithe-icon 内置图标名。 |
+
+## Events / 事件
+
+| Name | Detail | Description (EN) | Description (CN) |
+|------|--------|-------------------|-------------------|
+| — | — | No custom events. | 无自定义事件。 |
+
+## Examples / 示例
+
+```html
+<aithe-callout type="warning" title="Caution" icon="warning">Check before proceeding.</aithe-callout>
+```

package/docs/api/container/details.md

@@ -0,0 +1,31 @@
+# AitheDetails / Aithe折叠详情
+
+> Themed details disclosure with expand/collapse toggle.
+> 带展开/收起切换的主题化详情折叠组件。
+
+## Slots / 插槽
+
+| Name | Description (EN) | Description (CN) |
+|------|-------------------|-------------------|
+| (default) | Default slot for the disclosure body content. | 折叠正文内容的默认插槽。 |
+
+## Properties / 属性
+
+| Name | Type | Default | Description (EN) | Description (CN) |
+|------|------|---------|-------------------|-------------------|
+| open | `boolean` | `false` | Whether the disclosure is initially open. | 折叠是否初始展开。 |
+| summary | `string` | `'Details'` | Summary text shown as the toggle label. | 作为切换标签显示的摘要文本。 |
+| title | `string` | `''` | Display title (shown as tooltip). | 显示标题（作为工具提示）。 |
+| icon | `string` | `''` | Icon name to display before the summary text. | 在摘要文本前显示的图标名称。 |
+
+## Events / 事件
+
+| Name | Detail | Description (EN) | Description (CN) |
+|------|--------|-------------------|-------------------|
+| aithe-toggle | `{ open }` | Emitted when the disclosure is toggled. | 折叠切换时发出。 |
+
+## Examples / 示例
+
+```html
+<aithe-details open summary="More info" title="Additional information" icon="info">Hidden content here.</aithe-details>
+```

package/docs/api/container/scroller.md

@@ -0,0 +1,33 @@
+# AitheScroller / Aithe滚动容器
+
+> Themed scroll container with optional shadow edges and scrollbar control.
+> 主题化滚动容器，支持可选阴影边缘和滚动条控制。
+
+## Slots / 插槽
+
+| Name | Description (EN) | Description (CN) |
+|------|-------------------|-------------------|
+| (default) | Default slot for scrollable content. | 可滚动内容的默认插槽。 |
+
+## Properties / 属性
+
+| Name | Type | Default | Description (EN) | Description (CN) |
+|------|------|---------|-------------------|-------------------|
+| height | `string` | `''` | Fixed height of the scroll area (CSS value). | 滚动区域的固定高度（CSS 值）。 |
+| max-height | `string` | `''` | Maximum height of the scroll area (CSS value). | 滚动区域的最大高度（CSS 值）。 |
+| shadow | `boolean` | `false` | Whether to show gradient shadows at scroll edges. | 是否在滚动边缘显示渐变阴影。 |
+| scrollbar | `boolean` | `true` | Whether to show the native scrollbar. | 是否显示原生滚动条。 |
+
+## Events / 事件
+
+| Name | Detail | Description (EN) | Description (CN) |
+|------|--------|-------------------|-------------------|
+| aithe-scroll | `{ top, left }` | Emitted on scroll. | 滚动时发出。 |
+
+## Examples / 示例
+
+```html
+<aithe-scroller height="300px" shadow scrollbar>
+  <p>Long content here...</p>
+</aithe-scroller>
+```

package/docs/api/container/split-panel.md

@@ -0,0 +1,35 @@
+# AitheSplitPanel / Aithe分割面板
+
+> Resizable two-panel layout with a draggable divider.
+> 可调整大小的双面板布局，带可拖动分隔条。
+
+## Slots / 插槽
+
+| Name | Description (EN) | Description (CN) |
+|------|-------------------|-------------------|
+| start | Content for the first (start) pane. | 第一个（起始）面板的内容。 |
+| end | Content for the second (end) pane. | 第二个（末尾）面板的内容。 |
+
+## Properties / 属性
+
+| Name | Type | Default | Description (EN) | Description (CN) |
+|------|------|---------|-------------------|-------------------|
+| direction | `'horizontal' | 'vertical'` | `'horizontal'` | Layout direction of the split. | 分割布局的方向。 |
+| min-size | `number` | `20` | Minimum size of the start pane as a percentage. | 起始面板的最小百分比尺寸。 |
+| max-size | `number` | `80` | Maximum size of the start pane as a percentage. | 起始面板的最大百分比尺寸。 |
+| value | `number` | `50` | Current split position as a percentage (0–100). | 当前分割位置百分比（0–100）。 |
+
+## Events / 事件
+
+| Name | Detail | Description (EN) | Description (CN) |
+|------|--------|-------------------|-------------------|
+| aithe-resize | `{ value }` | Emitted when the divider is dragged. | 分隔条被拖动时发出。 |
+
+## Examples / 示例
+
+```html
+<aithe-split-panel direction="horizontal" value="40" min-size="20" max-size="80">
+  <div slot="start">Left pane</div>
+  <div slot="end">Right pane</div>
+</aithe-split-panel>
+```

package/docs/api/data/pagination.md

@@ -0,0 +1,31 @@
+# AithePagination / AithePagination 分页
+
+> Pagination controller for navigating through paged data.
+> 分页控制器，用于浏览分页数据。
+
+## Slots / 插槽
+
+| Name | Description (EN) | Description (CN) |
+|------|-------------------|-------------------|
+| — | — | No slots (pagination is self-contained). | 无插槽（分页为自包含组件）。 |
+
+## Properties / 属性
+
+| Name | Type | Default | Description (EN) | Description (CN) |
+|------|------|---------|-------------------|-------------------|
+| total | Number | 0 | Total number of data items. | 数据项总数。 |
+| pageSize | Number | 10 | Number of items per page. | 每页的数据项数。 |
+| currentPage | Number | 1 | Currently active page number. | 当前活动页码。 |
+| size | 'sm' \| 'md' \| 'lg' | 'md' | Size scale of the pagination buttons. | 分页按钮的尺寸规格。 |
+
+## Events / 事件
+
+| Name | Detail | Description (EN) | Description (CN) |
+|------|--------|-------------------|-------------------|
+| aithe-page-change | { currentPage, pageSize } | Emitted when the current page changes. | 当前页变更时触发。 |
+
+## Examples / 示例
+
+```html
+<aithe-pagination total="100" page-size="10" current-page="1"></aithe-pagination>
+```

package/docs/api/data/tab-pane.md

@@ -0,0 +1,36 @@
+# AitheTabPane / AitheTabPane 标签面板
+
+> Single tab pane used inside `aithe-tabs`.
+> 单个标签面板，用于 `aithe-tabs` 内部。
+
+## Slots / 插槽
+
+| Name | Description (EN) | Description (CN) |
+|------|-------------------|-------------------|
+| (default) | Default slot for tab pane content. | 默认插槽，用于标签面板内容。 |
+
+## Properties / 属性
+
+| Name | Type | Default | Description (EN) | Description (CN) |
+|------|------|---------|-------------------|-------------------|
+| tabId | String | '' | Unique key identifying this pane within the tabs. | 标签页内标识此面板的唯一键。 |
+| label | String | '' | Display label shown on the tab button. | 标签按钮上显示的文本。 |
+| title | `string` | `''` | Display title (shown as tooltip). | 显示标题（作为工具提示）。 |
+| icon | `string` | `''` | Icon name to display before the tab label. | 在标签文本前显示的图标名称。 |
+| disabled | Boolean | false | Whether this tab pane is disabled (cannot be activated). | 此标签面板是否禁用（无法激活）。 |
+| closable | Boolean | false | Whether this tab pane shows a close button. | 此标签面板是否显示关闭按钮。 |
+| active | Boolean | false | Whether this tab pane is currently active (managed by parent `aithe-tabs`). | 此标签面板是否当前活动（由父级 `aithe-tabs` 管理）。 |
+
+## Events / 事件
+
+| Name | Detail | Description (EN) | Description (CN) |
+|------|--------|-------------------|-------------------|
+| — | — | No custom events emitted. | 无自定义事件。 |
+
+## Examples / 示例
+
+```html
+<aithe-tab-pane tab-id="settings" label="Settings" title="Settings" icon="settings" closable>
+  Settings content here
+</aithe-tab-pane>
+```

package/docs/api/data/table-column.md

@@ -0,0 +1,58 @@
+# AitheTableColumn / AitheTableColumnMeta 列定义
+
+> Column definition element for `aithe-table` (DOM-defined mode).
+> `aithe-table` 的列定义元素（DOM 定义模式）。
+
+Place `<aithe-table-column>` elements as children of `<aithe-table>` to define columns declaratively. This mode supports `.cellRenderer` for custom cell rendering, which is not available in the data-driven mode.
+
+将 `<aithe-table-column>` 元素作为 `<aithe-table>` 的子元素放置，以声明式定义列。此模式支持 `.cellRenderer` 自定义单元格渲染，数据驱动模式不支持此功能。
+
+## Properties / 属性
+
+| Name | Type | Default | Attribute | Description (EN) | Description (CN) |
+|------|------|---------|-----------|-------------------|-------------------|
+| id | `string` | '' | `id` | Unique column key. | 唯一列键。 |
+| title | `string` | '' | `title` | Header title. | 表头标题。 |
+| dataIndex | `string` | '' | `data-index` | Property path on the data record. Defaults to `id` if empty. | 数据记录上的属性路径。为空时默认使用 `id`。 |
+| width | `string` | '' | `width` | Fixed column width. | 固定列宽。 |
+| align | 'left' \| 'center' \| 'right' | 'left' | `align` | Text alignment. | 文本对齐方式。 |
+| sortable | `boolean` | false | `sortable` | Enable client-side sorting. | 启用客户端排序。 |
+| icon | `string` | '' | `icon` | Icon name rendered in the header via aithe-icon. | 通过 aithe-icon 在表头渲染的图标名称。 |
+| intent | AitheIntent | 'default' | `intent` | Visual intent / semantic color for the column cells. | 列单元格的视觉意图/语义色。 |
+| cellRenderer | Function | undefined | — | Custom cell renderer: `(value, record, rowIndex) => unknown`. Only settable via JS property (not an HTML attribute). | 自定义单元格渲染器：`(value, record, rowIndex) => unknown`。仅可通过 JS 属性设置（非 HTML 属性）。 |
+
+## cellRenderer Signature / cellRenderer 签名
+
+```typescript
+(value: unknown, record: Record<string, unknown>, rowIndex: number) => unknown
+```
+
+| Parameter | Type | Description (EN) | Description (CN) |
+|-----------|------|-------------------|-------------------|
+| value | `unknown` | Cell value resolved from `dataIndex` or `id`. | 从 `dataIndex` 或 `id` 解析的单元格值。 |
+| record | `Record<string, unknown>` | The full data record for the current row. | 当前行完整的数据记录。 |
+| rowIndex | `number` | Zero-based row index. | 从零开始的行索引。 |
+| (return) | `unknown` | Rendered content (string, number, HTMLElement, TemplateResult, etc.). | 渲染内容（字符串、数字、HTMLElement、TemplateResult 等）。 |
+
+## Examples / 示例
+
+### Basic columns / 基础列
+
+```html
+<aithe-table .data=${records} striped>
+  <aithe-table-column id="name" title="Name" sortable></aithe-table-column>
+  <aithe-table-column id="owner" title="Owner"></aithe-table-column>
+</aithe-table>
+```
+
+### Custom cell renderer / 自定义单元格渲染
+
+```html
+<aithe-table .data=${records} striped>
+  <aithe-table-column id="name" title="Name" sortable></aithe-table-column>
+  <aithe-table-column id="status" title="Status" intent="success"></aithe-table-column>
+  <aithe-table-column id="action" title="Action" align="center"
+    .cellRenderer=${(value, record, rowIndex) => html`<aithe-button type="primary" size="sm">Edit</aithe-button>`}
+  ></aithe-table-column>
+</aithe-table>
+```