跳到主要内容 / Skip to content
QQuartz UI正在打磨
  • 组件
  • 页面模式
  • 安装
  • 设计基础
中文English planned
显示设置 / Display preferences
65 + 8

文档目录

操作

  • Button 按钮
  • Icon Button 图标按钮
  • Button Group 按钮组
  • Toggle 切换按钮
  • Toggle Group 切换组

表单

  • Input 输入框
  • Textarea 文本域
  • Label 标签
  • Field 表单字段
  • Checkbox 复选框
  • Radio Group 单选组
  • Switch 开关
  • Slider 滑块
  • Select 选择器
  • Form 表单
  • Combobox 组合框
  • MultiSelect 多选器
  • TagsInput 标签输入
  • NumberInput 数字输入框
  • PasswordInput 密码输入框
  • OTPInput 验证码输入
  • Calendar 日历
  • DatePicker 日期选择器
  • DateRangePicker 日期范围选择器
  • TimePicker 时间选择器
  • FileUpload 文件上传
  • TreeSelect 树选择器
  • Cascader 级联选择

展示

  • Card 卡片
  • Separator 分隔线
  • Badge 徽标
  • Avatar 头像
  • Timeline 时间线
  • Carousel 轮播

反馈

  • Skeleton 骨架屏
  • Spinner 加载转轮
  • Progress 进度条
  • Alert 提示
  • Empty State 空状态
  • Toast 轻提示
  • NotificationCenter 通知中心

浮层

  • Tooltip 工具提示
  • Popover 弹出层
  • Dropdown Menu 下拉菜单
  • Context Menu 上下文菜单
  • Hover Card 悬停卡片
  • Dialog 对话框
  • Alert Dialog 警告对话框
  • Drawer 抽屉
  • Sheet 侧边面板

展开与折叠

  • Accordion 手风琴
  • Collapsible 折叠区

导航

  • Tabs 标签页
  • Breadcrumb 面包屑
  • Pagination 分页
  • CommandPalette 命令面板
  • Stepper 步骤条
  • NavigationMenu 导航菜单
  • Menubar 菜单栏

数据

  • Table 表格
  • TreeView 树视图
  • Transfer 穿梭框
  • DataTable 数据表格
  • FilterBar 筛选栏
  • ResizablePanels 可调面板

页面模式

  • App Shell + Sidebar
  • Auth Entry
  • Operations Dashboard
  • DataTable Page
  • Resource Detail
  • Create / Edit Form
  • Settings
  • Command Center

8 / 8 · Public composition

页面模式

用 65 个公开组件构成真实产品页面骨架,不引入私有实现、网络请求或业务副作用。

01App Shell + Sidebar组织品牌、身份、侧栏导航、当前上下文和主要工作区的响应式应用骨架。02Auth Entry统一登录、注册和账户恢复流程中的字段关系、反馈与入口切换。03Operations Dashboard组合运营状态、关键指标、近期工作与由调用方拥有的图表适配槽位。04DataTable Page提供稳定行标识、受控选择和可序列化本地筛选状态的数据工作面。05Resource Detail组织资源身份、状态、元数据、操作、活动记录与关联详情。06Create / Edit Form使用分组字段、就近说明和明确提交操作组织创建与编辑流程。07Settings以清晰标签分组账户、通知、外观和工作区偏好。08Command Center组合键盘优先的命令搜索、上下文状态与通知反馈。