用途:HeroUI Native 是构建在 Uniwind(React Native 的 Tailwind CSS)与 React Native 之上的组件库,用于开发 iOS 和 Android 移动应用界面,提供可访问、可定制的 UI 组件。
主要能力:提供 Button、Card、Dialog、TextField 等组件,采用复合组件结构(如 Card.Header、Card.Body、Card.Footer),支持语义化变体(primary、secondary、tertiary、danger、danger-soft、ghost、outline),并通过 CSS 变量与 HSL 颜色格式进行主题定制,支持明暗主题切换。
使用方式:安装命令为 curl -fsSL https://heroui.com/install | bash -s heroui-native,或使用 npm i heroui-native react-native-reanimated react-native-gesture-handler react-native-safe-area-context @gorhom/bottom-sheet react-native-svg react-native-worklets tailwind-merge tailwind-variants。需在 global.css 中引入 tailwindcss、uniwind 与 heroui-native/styles,并用 HeroUINativeProvider 与 GestureHandlerRootView 包裹应用。事件使用 onPress 而非 onClick。可通过 node scripts/list_components.mjs、node scripts/get_component_docs.mjs Button、node scripts/get_theme.mjs 等脚本获取组件与主题信息,或直接访问 https://heroui.com/docs/native/components/button.mdx 等 MDX 文档。
适用场景:使用 React Native 或 Expo 构建移动端 UI 时使用。
限制:仅适用于原生移动端,不可套用 HeroUI React(Web)模式;包名、样式引擎与颜色格式均不同(Web 用 @heroui/react、Tailwind CSS v4、oklch,原生用 heroui-native、Uniwind、HSL)。实现前应先获取对应组件文档。其他收费、价格与平台细节暂未提供。