UI SDK 模块总览
完整查看 @downcity/ui 的导出模块、组件分组和可用变体
UI SDK 模块总览
本页用于完整列出 @downcity/ui 的公开模块，方便在开发时快速确认可复用能力，而不必去翻源码。
工具与类型
cn
- 用途：合并 Tailwind 类名，并自动处理冲突类
- 适合场景：在组件封装或条件样式分支中安全组合
className
DowncityButtonVariant
- 可选值：
default、outline、secondary、ghost、destructive、link
DowncityButtonSize
- 可选值：
default、xs、sm、lg、icon、icon-xs、icon-sm、icon-lg
DowncityCardSize
- 可选值：
default、sm
DowncityDropdownMenuItemVariant
- 可选值：
default、destructive
DowncityToasterTheme
- 可选值：
light、dark、system
样式模块
@downcity/ui/source.css
- 作用：声明 Tailwind 扫描来源
- 特点：不注入主题样式
@downcity/ui/styles.css
- 作用：注入 Downcity UI 设计令牌与基础层
- 特点：不负责源码扫描声明
动作与状态模块
Button
- 导出：
Button、buttonVariants - 用途：主操作、次操作、图标按钮
Badge
- 导出：
Badge、badgeVariants - 用途：状态标签、分类标签、轻量统计
Toggle
- 导出：
Toggle、toggleVariants - 用途：单个状态开关
ToggleGroup
- 导出：
ToggleGroup、ToggleGroupItem - 用途：按钮组切换
表单模块
Input
- 导出：
Input - 用途：单行输入、搜索框、短配置
Textarea
- 导出：
Textarea - 导出类型：
TextareaProps - 用途：Prompt、长说明、多行配置
Checkbox
- 导出：
Checkbox - 用途：多选配置、权限勾选
Label
- 导出：
Label - 用途：字段标题、表单命名
容器与展示模块
Card
- 导出：
CardCardHeaderCardTitleCardDescriptionCardActionCardContentCardFooter
Separator
- 导出：
Separator - 支持方向：
horizontal、vertical
Skeleton
- 导出：
Skeleton - 用途：加载占位
Tabs
- 导出：
TabsTabsListTabsTriggerTabsContenttabsListVariants
Workboard
- 导出：
Workboard - 导出类型：
DowncityWorkboardPropsDowncityWorkboardBoardSnapshotDowncityWorkboardAgentItemDowncityWorkboardActivityItem
- 用途：展示多个 agents 的像素化 game world，支持固定 40 x 24 tile 大地图画布、普通视图完整比例、全屏 cover 铺满、Smallville 风格小镇 atlas、开放式状态建筑、平铺式室内子地图、portal rail、键盘地图控制、sprite 巡游、quest path、墙面公告板、蓝图桌、codex log 和聚焦查看
buildWorkboardGameMapConfig
- 导出：
buildWorkboardGameMapConfig - 导出类型：
DowncityWorkboardGameMapConfigDowncityWorkboardGameZoneDowncityWorkboardGameActorDowncityWorkboardGameRouteDowncityWorkboardGamePointOfInterestDowncityWorkboardGameAreaLabelDowncityWorkboardGameAtlasPropsDowncityWorkboardGameRoomPropsDowncityWorkboardGameInspectorPropsDowncityWorkboardGameHudProps
- 用途：把
workboard的公开快照映射成完整的游戏地图配置，方便在自定义 host 中复用 zones、actors、routes、city、station、道具和标签
浮层与反馈模块
Dialog
- 导出：
DialogDialogTriggerDialogPortalDialogCloseDialogOverlayDialogContentDialogHeaderDialogFooterDialogTitleDialogDescription
Sheet
- 导出：
SheetSheetTriggerSheetCloseSheetPortalSheetOverlaySheetContentSheetHeaderSheetFooterSheetTitleSheetDescription
DropdownMenu
- 导出：
DropdownMenuDropdownMenuTriggerDropdownMenuPortalDropdownMenuContentDropdownMenuGroupDropdownMenuLabelDropdownMenuItemDropdownMenuCheckboxItemDropdownMenuRadioGroupDropdownMenuRadioItemDropdownMenuSeparatorDropdownMenuShortcutDropdownMenuSubDropdownMenuSubTriggerDropdownMenuSubContent
Popover
- 导出：
PopoverPopoverTriggerPopoverContent
Tooltip
- 导出：
TooltipTooltipTriggerTooltipContentTooltipProvider
Toaster
- 导出：
Toaster - 基于：
sonner