组件清单

这是一份 DirectSurface UI 组件快速清单。做功能前先用它确认组件是否存在、公共 API 叫什么、使用文档在哪里；需要确认行为边界时，再进入对应组件文档。

公开示例应从包入口导入：

import { RenderButton, RenderTextBox, RenderDataGrid } from 'ds-ui'

如何使用

所有业务导入都从 ds-ui 包入口开始。
第三列链接到组件用法、参数、交互和边界说明；业务项目不需要也不应访问框架源码路径。

基础组件

Component	Public API	Official doc
Text / Paragraph	`RenderText`, `RenderParagraph`	Text
Button	`RenderButton`	Button
IconButton	`RenderIconButton`	IconButton
Icon	`RenderIcon`	IconButton
ProgressBar	`RenderProgressBar`	ProgressBar
Badge	`RenderBadge`	Badge / Chip / Divider
Chip	`RenderChip`	Badge / Chip / Divider
Divider	`RenderDivider`	Badge / Chip / Divider
Card	`RenderCard`	Card / Section / PageHeader
Section	`RenderSection`	Card / Section / PageHeader
PageHeader	`RenderPageHeader`	Card / Section / PageHeader
Page	`RenderPage`	Card / Section / PageHeader
CollapsiblePanelGroup	`RenderCollapsiblePanelGroup`	CollapsiblePanelGroup
ReviewSidebar	`RenderReviewSidebar`	ReviewSidebar
Border	`RenderBorder`	Border
Empty	`RenderEmpty`	Card / Section / PageHeader
GroupBox	`RenderGroupBox`	Card / Section / PageHeader

输入组件

Component	Public API	Official doc
TextField	`RenderTextBox`	TextField
PasswordField	`RenderPasswordField`	TextField
TextArea	`RenderTextArea`	TextArea
NumberInput	`RenderNumberInput`	NumberInput
DatePicker	`RenderDatePicker`, `DatePickerPopup`	DatePicker
Checkbox	`RenderCheckbox`	Checkbox / Switch / Radio
Switch	`RenderSwitch`	Checkbox / Switch / Radio
RadioGroup	`RenderRadioGroup`	Checkbox / Switch / Radio
SegmentedControl	`RenderSegmentedControl`	SegmentedControl
Slider	`RenderSlider`	Slider
ColorPicker	`RenderColorPicker`, `ColorPickerPopup`	ColorPicker
SearchBox	`RenderSearchBox`	TextField
FieldPresenter	`RenderFieldPresenter`	TextField

选择器组件

Component	Public API	Official doc
Dropdown / ComboBox	`RenderComboBox`, `DropdownPopup`	Dropdown
MultiSelectDropdown	`RenderMultiSelectDropdown`, `MultiSelectDropdownPopup`	MultiSelectDropdown
LookupEdit	`RenderLookupEdit`	LookupEdit
DropTreeEdit	`RenderDropTreeEdit`	DropTreeEdit
DropTreeGridEdit	`RenderDropTreeGridEdit`	DropTreeGridEdit
DropCheckTreeEdit	`RenderDropCheckTreeEdit`	DropCheckTreeEdit

数据组件

Component	Public API	Official doc
DataGrid / GridView	`RenderDataGrid`	GridView
TreeView	`RenderTreeView`	TreeView
TreeGrid	`RenderTreeGrid`	TreeGrid
Table	`RenderTable`	Table
ReportView	`RenderReportView`	ReportView
ReportWorkspace	`RenderReportV3Workspace`, `RenderReportV3RuntimeSurface`	ReportView
ListView	`RenderListView`	ListView
ItemsControl	`RenderItemsControl`	ItemsControl
EntryGrid	`RenderEntryGrid`	EntryGrid
FormPanel	`RenderFormPanel`	EntryGrid / FormPanel
PropertyGrid	`RenderPropertyGrid`	PropertyGrid

导航和工作区组件

Component	Public API	Official doc
MenuBar	`RenderMenuBar`	MenuBar
NavigationMenu	`RenderNavigationMenu`	NavigationMenu
Breadcrumb	`RenderBreadcrumb`	Breadcrumb
Tabs	`RenderTabs`	Tabs
TabView	`RenderTabControl`, `RenderTabItem`	TabView
TabbedWorkspace	`RenderTabbedWorkspace`, `TabbedDocumentManager`	TabbedWorkspace
DockWorkspace	`RenderDockWorkspace`, `DockWindowManager`	DockWorkspace
DockWorkbench	`RenderDockWorkbench`, `DockWorkbenchManager`	DockWorkbench
Pagination	`RenderPagination`	Pagination
StatusBar	`RenderStatusBar`	StatusBar
Window	`RenderWindow`	Floating Window

浮层和反馈组件

Component	Public API	Official doc
Popup	`PopupManager`	Popup
Popover	`RenderPopover`, `PopoverPopup`	Popover
Modal	`RenderModal`, `AppOverlayService.showModalWindow`	Modal
Drawer	`RenderDrawer`	Drawer
ContextMenu	`ContextMenuManager`	ContextMenu
Notification	`NotificationManager`	Notification
Loading	`RenderLoadingHost`, `RenderLoadingModal`	Loading
Prompt	`RenderPromptModal`	Prompt
Tooltip	`TooltipManager`, `TooltipService`, `TooltipTarget`	Popover

命令组件

Component	Public API	Official doc
Toolbar	`RenderToolbar`	Toolbar
CommandButton	`RenderCommandButton`	CommandButton
CommandToolbar	`RenderCommandToolbar`	CommandToolbar
CommandMenu	`createCommandContextMenu`, `createCommandMenuBarItems`	CommandToolbar

可视化和文档组件

Component	Public API	Official doc
Charts	`RenderLineChart`, `RenderBarChart`, `RenderDonutChart`, `RenderSparkline`	Charts
ChartRangeSlider	`RenderChartRangeSlider`	ChartRangeSlider
PerformanceTimeline	`paintFramePerformanceTimelineChart`	PerformanceTimeline
Barcode / QRCode	`RenderBarcode`	Barcode / QRCode
Printing Components	`RenderPrintWorkspace`, `RenderPrintDesigner`, `RenderPrintPagesView`, `preparePrint`	Printing Components
ImagePreview	`RenderImagePreview`	ImagePreview
MarkdownViewer	`RenderMarkdownViewer`	MarkdownViewer
PlainTextEditor	`RenderPlainTextEditor`, `PlainTextEditorController`	PlainTextEditor
CodeEditor	`RenderCodeEditor`	CodeEditor
MedicalRecordEditor	`RenderMedicalRecordEditor`	Medical Editor Integration
ClinicalFlowSheet	`RenderClinicalFlowSheet`, `ClinicalFlowSheetController`	ClinicalFlowSheet

布局原语

业务开发优先从“常用布局入口”选择组件。所有继承 RenderBox 的可布局组件统一拥有尺寸、margin 和 alignment；继承 RenderPanel 的容器原生拥有 padding。Popup、Manager 和底层绘制函数不属于这一范围。构造参数与实例赋值的差异见组件通用布局属性。

常用布局入口

Component	Public API	Official doc
StackPanel	`RenderStackPanel`, `RenderSpacer`	StackPanel
DockPanel	`RenderDockPanel`	DockPanel
GridPanel	`RenderGridPanel`	GridPanel
Flex	`RenderStackPanel`	Flex
UniformGrid	`RenderUniformGrid`	Layout Overview
WrapPanel	`RenderWrapPanel`	WrapPanel
MasonryPanel	`RenderMasonryPanel`	Masonry
AdaptiveGridPanel	`RenderAdaptiveGridPanel`	AdaptiveGrid
Splitter	`RenderSplitter`	Splitter
ScrollViewer	`RenderScrollViewer`, `ScrollController`	ScrollViewer
OverlayHost	`RenderOverlayHost`	OverlayHost
Anchor / Canvas	`RenderAnchor`, `RenderCanvas`	Layout Overview

多工具窗、中心文档区、左/右/底可停靠区域这类工作台骨架，优先查看 DockWorkbench。它归在导航/工作台组件里，但在页面布局选择上通常比手写 DockPanel + Splitter + TabView 更合适。

通用盒模型与行为组件

Component	Public API	Official doc
Box / Panel	`RenderBox`, `RenderPanel`	Layout Overview
Visibility / Clip	`RenderVisibility`, `RenderClip`	Layout Overview

业务开发查找顺序

实现功能并复用现有组件时，按这个顺序阅读：

这份组件清单。
清单链接到的官方组件文档。
文档中的可运行示例和 TypeScript 源码。
对应的业务场景指南与性能说明。