#组件总览

Tactile UI 提供了 30+ 精心设计的 React 组件，涵盖表单、展示、布局、覆盖层等多种使用场景。每个组件都采用拟物化设计风格，提供丰富的交互效果。

#基础组件

表单和输入相关的基础组件。

组件	说明
Button 按钮	触发操作的按钮
Input 输入框	文本输入组件
Checkbox 复选框	多选控件
Radio 单选框	单选控件
Switch 开关	切换状态控件
Slider 滑块	滑动选择数值
Select 选择器	下拉选择组件
DatePicker 日期选择	日期选择组件

#展示组件

用于展示信息和状态的组件。

组件	说明
Card 卡片	通用容器组件
Avatar 头像	用户头像展示
Badge 徽标	状态标记和计数
Tag 标签	标签和分类展示
Alert 警告	警告和提示信息
Progress 进度条	进度展示
Skeleton 骨架屏	加载占位组件
Spinner 加载	加载状态指示
Separator 分割线	内容分割

#布局组件

用于页面布局和内容组织的组件。

组件	说明
AspectRatio 比例容器	固定宽高比容器
ScrollArea 滚动区域	自定义滚动条区域
Collapsible 折叠面板	可折叠内容容器
Accordion 手风琴	手风琴式折叠组件
Tabs 选项卡	选项卡切换组件

#覆盖层组件

弹出层和浮动元素组件。

组件	说明
Dialog 对话框	模态对话框
Drawer 抽屉	侧边抽屉组件
Dropdown 下拉菜单	下拉菜单组件
ContextMenu 右键菜单	右键上下文菜单
HoverCard 悬浮卡片	悬浮展示卡片
Tooltip 提示气泡	文字提示气泡
Toast 提示	轻量级消息提示

#导航组件

导航和页面控制组件。

组件	说明
Pagination 分页	分页导航组件
Toggle 切换按钮	可切换状态按钮

#业务组件

常用业务场景组件。

组件	说明
ArticleCard 文章卡片	文章列表卡片