Have something to say?
Web support
HeroUI Native can now run on the web, but it throws many strange errors, and some components even fail to render correctly. I find this odd because HeroUI is a web component library; why can't it be directly fallback to HeroUI on the web?
Native Expo-UI bottom sheet for react native
Instead of using gorhom/bottom-sheet and other libraries with big bundle sizes, please use the native Expo-UI bottom sheet for react native
RTL Support
First, Congrats on the v1.0 stable release! We've tested it and the experience is phenomenal.We can't wait to make the transition. However, we have a large RTL user base (Arabic, Hebrew) and this is currently blocking our adoption. We need proper RTL support like directional-aware components, animations and everything to work in RTL (We tried to force it but the outcome was horrible haha) and ideally a simple global dir configuration. Happy to help test or contribute if needed. Is RTL on the roadmap? Any estimated timeline? Thanks for the great work!
react-strict-dom - heroui web & native integration
Proposal: future exploration of react-strict-dom Background context React team announced react-strict-dom (youtube-video). This allows devs to write html-like markup in react-native: ``` import { html } from 'react-strict-dom'; function Page() { return ( Name ); } ``` Its worth exploring creating the native components in a similar markup style as the web version using react-strict-dom. This would allow: - devs to move between platforms with much more ease - (instead of context switching between the platform differences (ex: ) - help mcp/AI agents recreate a user’s app experience in react-native much more easily. Example use case: - Imagine having a component in web codebase styled with tailwind and copy-pasting it into your native app that’s using react-strict-dom and nativewind
Improve tablet support for Toast
Similar to the Toast component in HeroUI Web, provide for “[top/bottom] start”, “[top/bottom]”, “[top/bottom] end”, etc for regular width devices. “[top/bottom] start” and “[top/bottom] end” could collapse to just “[top/bottom]” for compact width devices
Starting with heroui mobile, Can we have the figma file
Hi Team, We are planning to migrate our designs with hero ui for our mobile app which is in React native. I'm unable to find the figma file for mobile (for hero-ui native) the web one not compatible with mobile designs. Can you help us with this one?
Segmented Button
Component Name: SegmentedButton (or SegmentedControl) Description: I would like to request the addition of a Segmented Button component. It's a common UI pattern for presenting 2-5 mutually exclusive options, allowing users to switch between views, filter content, or select an item from a small set (e.g., Day/Week/Month view, List/Grid display). Why this is valuable: This component is a staple in modern design systems (like Material Design 3) and native frameworks (SwiftUI, Jetpack Compose). Adding it would: 1. Fill a gap in an otherwise excellent component library. 2. Save developers time from having to build and maintain this pattern manually with individual buttons. 3. Ensure consistency in look, feel, and accessibility across apps using HeroUI Native.
Segmented Button Component
Component Name: SegmentedButton (or SegmentedControl) Description: I would like to request the addition of a Segmented Button component. It's a common UI pattern for presenting 2-5 mutually exclusive options, allowing users to switch between views, filter content, or select an item from a small set (e.g., Day/Week/Month view, List/Grid display). Why this is valuable: This component is a staple in modern design systems (like Material Design 3) and native frameworks (SwiftUI, Jetpack Compose). Adding it would: 1. Fill a gap in an otherwise excellent component library. 2. Save developers time from having to build and maintain this pattern manually with individual buttons. 3. Ensure consistency in look, feel, and accessibility across apps using HeroUI Native. Ideal API / Props (Inspiration): Ideally, it would support both single and multi-select, integrate with HeroUI's existing theme (size, color variants), and accept icons and/or text for each segment. Example desired usage: selectedValue={view} onValueChange={setView} Day Week Month
Will the New Menu Component Support Submenus?
The new Menu component is fantastic—great job! May I ask if submenu support is planned? It would make the component even more powerful.
Rate
Is it possible to add a rating component? It can be implemented as shown in the link. https://tdesign.tencent.com/mobile-react/components/rate-en
Two- or three-level cascade selector
It is recommended to develop a cascading selector that allows simultaneous selection of first, second, and third levels of countries, cities, and regions.
Accessability
Hey folks 👋 Just wanted to drop a quick note about accessibility on Android (Didn’t get to test on iOS yet) First, the library looks insanely good. Seriously. The components feel super polished, and I’m planning to move a production app over from React Native Paper to HeroUI Native once you’re at a stable release. While playing with the demo app in Expo Go, I started messing around with Android accessibility settings (especially bigger text / font scaling), because a lot of real users run their phones like that. And I noticed a bunch of cases where things don’t hold up when text gets big: text spills out of components / gets clipped layouts don’t wrap nicely, spacing gets weird at larger sizes some components basically become unusable (overlapping, buttons/rows collapsing, etc.) It’s totally understandable at this stage lol! but I figured it’s worth flagging as an “accessibility” feature request, because it’s one of those things that can block using it in production for broader audiences. Thanks again. really excited about this library 🙏
AvatarGroup
https://www.figma.com/design/H0xHxBB8qOKjHHAUCsvgHc/HeroUI-Figma-Kit-V3?node-id=5375-71386&p=f&m=dev
TagGroup
https://www.figma.com/design/H0xHxBB8qOKjHHAUCsvgHc/HeroUI-Figma-Kit-V3?node-id=14288-4550&p=f&m=dev
SearchField
https://www.figma.com/design/H0xHxBB8qOKjHHAUCsvgHc/HeroUI-Figma-Kit-V3?node-id=17293-34733&p=f&m=dev