UI 组件

Button、Alert、Dialog 等基础组件,持续补充中。

表单11 个组件

Button新

按钮:四种视觉样式、三档尺寸,内置加载态与焦点环,其余属性透传给原生 button。

ButtonGroup新

按钮组:把相邻按钮拼成一体,仅保留外侧圆角并自动补上淡分隔线,支持横向 / 纵向与拼接 / 分离。

Checkbox新

复选框:视觉隐藏的原生 input 承载键盘与表单行为,自绘勾选与半选图形。

Field新

表单域:统一 label / 控件 / 描述 / 错误信息的排版与 aria 关联,校验逻辑完全由外部驱动。

Input新

输入框:三档尺寸,支持校验失败态,其余属性透传给原生 input。

NumberInput新

数字输入:内置加减步进按钮,支持 min / max / step 与小数精度处理,键盘上下键步进,可直接参与原生表单提交。

Radio新

单选组:同名原生 radio 承载箭头键循环切换,RadioGroup 管理取值,Radio 声明选项。

Select新

下拉选择:listbox 语义浮层,方向键 / Home / End / typeahead 导航,Esc 关闭;multiple 切换为多选 Tag 形态。

Slider新

滑块:单值或双值区间,支持指针拖拽与方向键 / Home / End / PageUp / PageDown 键盘操作,可限定 min / max / step。

Switch新

开关:受控 / 非受控双支持,role="switch" 语义,空格与回车键切换。

Textarea新

多行输入:与 Input 同款尺寸与失败态,autosize 时高度跟随内容。

数据展示7 个组件

Avatar新

头像:图片加载失败自动回退首字母,可选形状、五档尺寸与在线状态,并含重叠的 AvatarGroup。

Card新

卡片:容器与媒体 / 头部 / 标题 / 描述 / 内容 / 底栏,支持多种样式、尺寸与可交互态,可组合使用也可单独取用子组件。

DataTable新

数据表格:列定义驱动,内置排序、全局搜索、分页与行选择,并支持加载骨架与空状态;排序、分页、选择均可受控或非受控。

Divider新

分割线:横 / 纵两个方向、solid / dashed / dotted / gradient 四种线型,横向可带居中文字并控制对齐与留白。

Empty新

空状态:内置三款随主题变色的插画,可带标题、描述与操作,也可替换为自定义图像。

Item新

列表项:前置媒体 + 内容 + 尾部操作三段式,可分组堆叠成列表,也可直接嵌入卡片组合出信息丰富的场景。

Tag新

标签:五种语义配色、两档尺寸,用于状态、分类与计数。

导航4 个组件

Accordion新

手风琴:支持单项 / 多项展开,标题可带图标,受控 / 非受控双支持,grid 高度动画,符合 WAI-ARIA 手风琴模式。

Pagination新

分页:受控 / 非受控双支持,页码区间自动折叠,可选每页条数选择器与跳转输入框,描边 / 填充两种外观。

Sidebar新

侧边栏:可折叠为图标栏的应用导航,支持分组、二级嵌套、激活态与徽标。折叠时标签在视觉上隐藏但仍留在 DOM,读屏器可读;含 WAI-ARIA 的 aria-current / aria-expanded 语义。

Tabs新

标签页:受控 / 非受控双支持,方向键与 Home / End 导航,符合 WAI-ARIA 标签页模式。

反馈4 个组件

Alert新

提示条:四种语义配色,可带标题、图标与关闭按钮,危险态自动用 alert 语义播报。

Progress新

进度条:确定与不确定两种形态,四档语义配色,可显示百分比,暴露标准 progressbar 语义。

Skeleton新

骨架屏:内容加载前的占位,文本 / 矩形 / 圆形三种形状,流光与呼吸两种动画,自动适配深浅色主题。

Toast新

轻提示:用 ToastProvider 承载 useToast,浮层堆叠、自动关闭、悬停暂停,兼容受控与非受控。

浮层5 个组件

ContextMenu新

右键菜单:在指针位置弹出,与 DropdownMenu 共用同一套菜单逻辑与部件,同样支持勾选 / 单选 / 分组 / 子菜单与键盘导航。

Dialog新

对话框:模态浮层,弹簧动画进出场,自动圈定焦点、锁定滚动,点击遮罩或按 Escape 关闭并把焦点还给触发元素。

DropdownMenu新

下拉菜单:menu / menuitem 语义,方向键与 Home / End 导航、typeahead 跳转,开合时管理焦点。支持普通 / 勾选 / 单选 / 分组 / 子菜单,以及图标与快捷键提示。

Popover新

弹出层:点击触发,内容可交互,自动定位并支持翻转,外部点击或 Escape 关闭后把焦点还给触发元素。

Tooltip新

工具提示:悬停或聚焦触发,自动测量定位并在空间不足时翻转,只承载不可交互的短文案。