DateTime Picker

Link: https://www.figma.com/design/ZmGWr2Jqedlfik5kZPLCAs/HeroUI-Figma-Kit-V3--Community-?node-id=5375-72314&t=HvoI4m3D2BjB9sZo-0 believe this is needed too

App-Bar

I have been Native apps for a bit and of the biggest pain points is a app-bar. With custom back buttons, titles, and custom right actions

Expo-UI/Liquid Glass

Hello, I’ve been using HeroUI Native and so far it’s amazing. One thing I’m wondering is with greater adoption of iOS 26 and Liquid Glass, how is the team thinking about this integration? Will this be something abstracted/handled by the library? Or is it not considered for now, and we should manually handle this instead, maybe like: isLiquidGlassSupported() ? {liquid glass stuff} : … Thank you!

Table

im surprised no one mentioned it yet but table as display data is kinda useful no?

Carousel

ListBox

Variations of a list with list items. Users with avatars, subtitles, accessory items, etc…

Combobox

As in https://ui.shadcn.com/docs/components/combobox

Number Stepper / Number Field

A number stepper would be another good component to add. Example: https://github.com/jadghadry/react-native-custom-stepper

Form component that connect using RHF and zod validation

Floating Action Button and App Bar code

I have messing around with Hero UI Native for a bit and was able to come up with a couple of components that you guys don’t have yet, But I am not sure to how contributions work or anything. But i have included the components code below hopefully this helps: FAB: import { Button, type ButtonRootProps } from 'heroui-native'; import React, { type ReactNode } from 'react'; import { ViewStyle } from 'react-native'; import Animated, { FadeInDown, FadeOutDown, LinearTransition, type BaseAnimationBuilder, type EntryExitAnimationFunction, } from 'react-native-reanimated'; import { useSafeAreaInsets } from 'react-native-safe-area-context'; interface UniversalFABProps { /** Function called when the FAB is pressed */ onPress: () => void; /** Icon component to render */ icon: ReactNode; /** Optional text label for Extended FAB pattern */ label?: string; /** HeroUI variant */ variant?: ButtonRootProps['variant']; /** HeroUI size */ size?: ButtonRootProps['size']; /** Additional styling for the button itself */ className?: string; /** Base Tailwind classes for positioning (excluding bottom offset) */ containerClassName?: string; /** * Extra vertical offset. * Useful if you have a TabBar height to account for. * Default is 16. */ bottomOffset?: number; entering?: BaseAnimationBuilder | EntryExitAnimationFunction; exiting?: BaseAnimationBuilder | EntryExitAnimationFunction; } /** * FloatingActionButton - Adapts dynamically to Safe Areas and Tab Bars. */ export const FloatingActionButton = ({ onPress, icon, label, variant = 'secondary', size = 'lg', className = 'rounded-xl shadow-lg', containerClassName = 'absolute right-5', // Removed bottom-8 bottomOffset = 16, entering = FadeInDown.delay(200).springify(), exiting = FadeOutDown.duration(200), }: UniversalFABProps) => { const insets = useSafeAreaInsets(); /** * The 'bottom' value is the safe area inset (which includes TabBar height * if wrapped in a safe provider) plus our custom padding. */ const animatedContainerStyle: ViewStyle = { bottom: Math.max(insets.bottom, 16) + bottomOffset, }; return ( entering={entering} exiting={exiting} layout={LinearTransition.springify()} className={containerClassName} style={animatedContainerStyle} className={className} variant={variant} size={size} onPress={onPress} isIconOnly={!label} pressableFeedbackVariant="ripple" {icon} {label && ( {label} &nbs

AvatarGroup

https://www.figma.com/design/H0xHxBB8qOKjHHAUCsvgHc/HeroUI-Figma-Kit-V3?node-id=5375-71386&p=f&m=dev

Pro components and blocks

Bottom sheet

Bottom sheets are used everywhere on mobile apps (slack, google maps, spotify, discord etc). Having something like it in heroui-native or at least a demo of using heroui-native component with react-native-bottom-sheet would make for a killer demo / tweet 😄 References react-native-bottom-sheet the mostly widely used bottom/action sheet https://herouiv3.featurebase.app/p/drawer-sheet

Menu

Menus display a list of choices on temporary elevated surfaces. Their placement varies based on the element that opens them. Figma link: https://www.figma.com/community/file/1546526812159103429 Please follow the contribution guide to get more details about component composition: https://github.com/heroui-inc/heroui-native/blob/alpha/CONTRIBUTING.md

OTP Input

The OTP Input component enables users to enter one-time passwords (OTP). Figma link: https://www.figma.com/community/file/1546526812159103429 Please follow the contribution guide to get more details about component composition: https://github.com/heroui-inc/heroui-native/blob/alpha/CONTRIBUTING.md

Slider

A slider allows a user to select one or more values within a range. Figma link: https://www.figma.com/community/file/1546526812159103429 Please follow the contribution guide to get more details about component composition: https://github.com/heroui-inc/heroui-native/blob/alpha/CONTRIBUTING.md

Toast

Toasts are temporary notifications that provide concise feedback about an action or event. Figma link: https://www.figma.com/community/file/1546526812159103429 Please follow the contribution guide to get more details about component composition: https://github.com/heroui-inc/heroui-native/blob/alpha/CONTRIBUTING.md

Select

A select displays a collapsible list of options and allows a user to select one or more of them. Figma link: https://www.figma.com/community/file/1546526812159103429 Please follow the contribution guide to get more details about component composition: https://github.com/heroui-inc/heroui-native/blob/alpha/CONTRIBUTING.md

Tabs

Tabs organise content into multiple sections and allow users to navigate between them. Figma link: https://www.figma.com/community/file/1546526812159103429 Please follow the contribution guide to get more details about component composition: https://github.com/heroui-inc/heroui-native/blob/alpha/CONTRIBUTING.md

TextArea

Can we have a text area component 🙏

PressableFeedback

The generic pressable with two feedback variant: highlight (iOS default) ripple (Android default)

Skeleton

Skeleton is a placeholder to show a loading state and the expected shape of a component. Figma link: https://www.figma.com/community/file/1546526812159103429 Please follow the contribution guide to get more details about component composition: https://github.com/heroui-inc/heroui-native/blob/alpha/CONTRIBUTING.md