跳转到正文

这是一套无头、无样式的 React 组件库,可全面掌控标记和 CSS,同时默认提供良好的无障碍支持,并符合 ARIA 规范。

组件采用可组合的基础构件设计,并提供基于插槽的 API;支持 Tree Shaking,可用于 TypeScript,并兼容各种样式方案,包括 Tailwind、CSS Modules、CSS-in-JS 或纯 CSS。

涵盖多种 UI 模式和基础组件,例如 Accordion、Alert Dialog、Avatar、Checkbox 和 Checkbox Group、Collapsible、Context Menu、Dialog、Field 和 Fieldset、Form、Input、Menu 和 Menubar、Meter、Navigation Menu、Number Field、Popover、Progress、Radio、Scroll Area、Select、Separator、Slider、Switch、Tabs、Toast、Toggle 和 Toggle Group、Toolbar、Tooltip,以及 Direction Provider 和 useRender 等实用工具。

弹出组件使用 React Portals,并建议创建隔离的层叠上下文以避免 z-index 冲突,确保覆盖层始终显示在页面内容上方。文档提供了组装组件、组合各部分以及与不同样式系统集成的示例。

本项目采用 MIT 许可证开源,持续发布更新并提供路线图和无障碍访问指南。文档页面可查看为 Markdown,还提供便于 LLM 使用的资源,方便探索代码和进行集成。

功能

  • 无头、无样式的 React 组件
  • 默认支持无障碍访问并符合 ARIA 规范
  • 可组合的插槽式 API
  • 支持 Tree Shaking 的 ESM 构建版本
  • TypeScript 类型定义
  • 兼容 Tailwind、CSS Modules、CSS-in-JS 或纯 CSS
  • 使用 React Portals 实现弹出窗口和覆盖层
  • 提供隔离层叠上下文的指南,避免 z-index 问题
  • 支持受控和非受控用法
  • 组件覆盖广泛(菜单、对话框、弹出层、标签页、选择器、滑块等)
  • 适用于 SSR,且与框架无关
  • 采用 MIT 许可证开源
  • 提供 Markdown 格式文档和 LLM 辅助资源

相关项目

ArkUI

这款开源 UI 解决方案提供可自定义的组件,可适配不同的视觉风格和无障碍标准,助你构建精致的设计系统。

MaterialUI

这款产品提供一套功能强大的工具,帮助你在 React 中构建用户界面,兼顾灵活性与设计规范。

Radix Vue

一个非官方的 Vue 移植版本,提供可自定义且易于访问的 UI 组件,助力构建设计系统。

PrimeVue

丰富的开源 UI 组件集,专为无缝高效地构建 Vue.js 应用而打造。

Radix Primitives

无样式、无障碍、开源的 React 基础组件,适用于高质量 Web 应用和设计系统。

Vaul

这是一款无样式抽屉组件,专为在 React 应用中无缝集成而设计,可提升移动设备上的交互体验。

ChakraUI

借助一套强大、易用且高度可定制的基础组件,快速高效地创建无障碍 Web 应用。

cmdk

这个组件为 React 提供了全面的命令菜单解决方案,兼顾用户体验和开发灵活性。