来源：https://ui.docs.xihanfun.com/components/

# 组件总览

浏览 XiHan.UI 提供的组件。

## 通用

- [Button 按钮](/components/button)
- [ButtonGroup 按钮组](/components/button-group)
- [Clipboard 剪贴板](/components/clipboard)
- [DownloadTrigger 下载触发器](/components/download-trigger)
- [Truncate 文本截断](/components/truncate)
- [FloatButton 浮动按钮](/components/float-button)
- [GradientText 渐变文字](/components/gradient-text)
- [Kbd 键盘按键](/components/kbd)
- [Icon 图标](/components/icon)
- [IconWrapper 图标块](/components/icon-wrapper)
- [Scrollbar 滚动条](/components/scrollbar)
- [Toggle 切换按钮](/components/toggle)
- [ToggleGroup 切换按钮组](/components/toggle-group)
- [Typography 排印](/components/typography)
- [Watermark 水印](/components/watermark)

## 布局

- [Flex 弹性布局](/components/flex)
- [Grid 栅格](/components/grid)
- [Layout 布局](/components/layout)
- [Masonry 瀑布流](/components/masonry)
- [ScrollArea 滚动区域](/components/scroll-area)
- [Separator 分隔线](/components/separator)
- [Sortable 排序](/components/sortable)
- [Resizable 可调容器](/components/resizable)
- [Splitter 分栏](/components/splitter)

## 导航

- [Affix 固钉](/components/affix)
- [Anchor 锚点](/components/anchor)
- [BackTop 回到顶部](/components/back-top)
- [Breadcrumb 面包屑](/components/breadcrumb)
- [ContextMenu 右键菜单](/components/context-menu)
- [Menu 菜单](/components/menu)
- [Menubar 菜单栏](/components/menubar)
- [NavigationMenu 导航菜单](/components/navigation-menu)
- [PageHeader 页头](/components/page-header)
- [Pagination 分页](/components/pagination)
- [Segmented 分段控制器](/components/segmented)
- [SideNav 侧栏导航](/components/side-nav)
- [Steps 步骤条](/components/steps)
- [Tabs 标签页](/components/tabs)
- [Toolbar 工具栏](/components/toolbar)
- [Tour 引导](/components/tour)

## 数据录入

- [CalendarPicker 日历选择器](/components/calendar-picker)
- [CalendarRangePicker 日历范围选择器](/components/calendar-range-picker)
- [Cascader 级联选择](/components/cascader)
- [Checkbox 复选框](/components/checkbox)
- [CheckboxGroup 复选框组](/components/checkbox-group)
- [ColorField 颜色字段](/components/color-field)
- [ColorPicker 颜色选择器](/components/color-picker)
- [ColorSlider 颜色滑块](/components/color-slider)
- [ColorSwatchPicker 颜色色块选择器](/components/color-swatch-picker)
- [Combobox 组合框](/components/combobox)
- [DateField 日期字段](/components/date-field)
- [DatePicker 日期选择器](/components/date-picker)
- [DateRangePicker 日期范围选择器](/components/date-range-picker)
- [Editable 就地编辑](/components/editable)
- [Field 表单字段](/components/field)
- [FieldArray 字段数组](/components/field-array)
- [Fieldset 字段集](/components/fieldset)
- [FileUpload 文件上传](/components/file-upload)
- [Form 表单](/components/form)
- [ImageCropper 图片裁切](/components/image-cropper)
- [InputGroup 输入组](/components/input-group)
- [Listbox 列表框](/components/listbox)
- [Mention 提及](/components/mention)
- [NumberField 数字字段](/components/number-field)
- [PasswordInput 密码输入](/components/password-input)
- [PinInput 分格输入](/components/pin-input)
- [RadioGroup 单选组](/components/radio-group)
- [Rating 评分](/components/rating)
- [Select 选择器](/components/select)
- [SignaturePad 签名板](/components/signature-pad)
- [Slider 滑块](/components/slider)
- [Switch 开关](/components/switch)
- [TagGroup 标签组](/components/tag-group)
- [TagsInput 标签输入](/components/tags-input)
- [TextField 文本字段](/components/text-field)
- [TimeField 时间字段](/components/time-field)
- [TimePicker 时间选择器](/components/time-picker)
<XhComponentCard src="time-range-picker" name="TimeRangePicker" label="时间范围选择器" href="/components/time-range-picker" status="new" />
- [Transfer 穿梭框](/components/transfer)
- [TreeSelect 树选择](/components/tree-select)

## 数据展示

- [Accordion 手风琴](/components/accordion)
- [Avatar 头像](/components/avatar)
- [AvatarGroup 头像组](/components/avatar-group)
<XhComponentCard src="bar-code" name="BarCode" label="条形码" href="/components/bar-code" status="alpha" />
- [Card 卡片](/components/card)
- [Carousel 走马灯](/components/carousel)
- [Collapsible 折叠区域](/components/collapsible)
- [ColorSwatch 颜色色块](/components/color-swatch)
- [Descriptions 描述列表](/components/descriptions)
- [EmptyState 空状态](/components/empty-state)
- [Heatmap 热力图](/components/heatmap)
- [Highlight 文本高亮](/components/highlight)
- [Image 图片](/components/image)
- [ImageViewer 图片预览](/components/image-viewer)
- [InfiniteScroll 无限滚动](/components/infinite-scroll)
- [JsonViewer JSON 视图](/components/json-viewer)
- [List 列表](/components/list)
- [Marquee 跑马灯](/components/marquee)
- [MatrixCode 二维码](/components/matrix-code)
- [NumberAnimation 数值动画](/components/number-animation)
- [Statistic 统计数值](/components/statistic)
- [Table 表格](/components/table)
- [Tag 标签](/components/tag)
- [Timeline 时间线](/components/timeline)
- [Timer 计时器](/components/timer)
- [Timestamp 时间戳](/components/timestamp)
- [Tree 树](/components/tree)
- [Virtualizer 虚拟滚动](/components/virtualizer)

## 图表

- [CartesianChart 直角坐标图](/components/cartesian-chart)
- [PieChart 饼图](/components/pie-chart)

## 反馈

- [Alert 警告提示](/components/alert)
- [Badge 徽标](/components/badge)
- [LoadingBar 加载条](/components/loading-bar)
- [Progress 进度条](/components/progress)
- [Skeleton 骨架屏](/components/skeleton)
- [Spinner 加载指示器](/components/spinner)
- [Notification 通知](/components/notification)
- [Toast 轻提示](/components/toast)

## 浮层

- [Command 命令面板](/components/command)
- [Dialog 对话框](/components/dialog)
- [Drawer 抽屉](/components/drawer)
- [FloatingPanel 浮动面板](/components/floating-panel)
- [HoverCard 悬浮卡片](/components/hover-card)
- [Popconfirm 弹出确认](/components/popconfirm)
- [Popover 气泡卡片](/components/popover)
- [Tooltip 文字提示](/components/tooltip)

## AI 对话

<XhComponentCard src="approval" name="Approval" label="审批" href="/components/approval" status="alpha" />
- [CodeView 代码视图](/components/code-view)
- [DiffView 差异视图](/components/diff-view)
- [Log 日志](/components/log)
<XhComponentCard src="markdown-stream" name="MarkdownStream" label="流式正文" href="/components/markdown-stream" status="alpha" />
<XhComponentCard src="message-feed" name="MessageFeed" label="消息流" href="/components/message-feed" status="alpha" />
<XhComponentCard src="prompt-input" name="PromptInput" label="提示输入框" href="/components/prompt-input" status="alpha" />
<XhComponentCard src="question-flow" name="QuestionFlow" label="澄清问卷" href="/components/question-flow" status="alpha" />
<XhComponentCard src="reasoning" name="Reasoning" label="思考过程" href="/components/reasoning" status="alpha" />
<XhComponentCard src="tool-call" name="ToolCall" label="工具调用" href="/components/tool-call" status="alpha" />