# Beta 10 **Category**: native **URL**: https://www.heroui.com/docs/native/releases/beta-10 **Source**: https://raw.githubusercontent.com/heroui-inc/heroui/refs/heads/v3/apps/docs/content/docs/native/releases/beta-10.mdx > Bottom Sheet component, PressableFeedback refactor, Animation API State Prop extension, use-theme-color multiple colors selection, and bug fixes. ***
December 30, 2025
This release introduces the new [Bottom Sheet](/docs/native/components/bottom-sheet) component, refactors [PressableFeedback](/docs/native/components/pressable-feedback) with improved API, extends the Animation API with State Prop support, enhances the `use-theme-color` hook to handle multiple colors selection, and includes various bug fixes and documentation improvements. ## Installation Update to the latest version: ```bash npm i heroui-native@beta ``` ```bash pnpm add heroui-native@beta ``` ```bash yarn add heroui-native@beta ``` ```bash bun add heroui-native@beta ``` **Using AI assistants?** Simply prompt "Hey Cursor, update HeroUI Native to the latest version" and your AI assistant will automatically compare versions and apply the necessary changes. Learn more about the [HeroUI Native MCP Server](/docs/native/getting-started/mcp-server). ## What's New ### New Components #### Bottom Sheet This release introduces the **Bottom Sheet** component, a versatile overlay component that slides up from the bottom of the screen with animated transitions and swipe-to-dismiss gestures. **Features:** - Smooth animated transitions with gesture support - Multiple snap points for flexible sizing - Detached mode for custom positioning - Customizable overlay with blur effects - Full accessibility support - Built on [@gorhom/bottom-sheet](https://gorhom.dev/react-native-bottom-sheet) **Usage:** ```tsx import { BottomSheet, Button } from 'heroui-native'; Title Description ``` For complete documentation and examples, see the [Bottom Sheet component page](/docs/native/components/bottom-sheet). **Related PR:** [#174](https://github.com/heroui-inc/heroui-native/pull/174) ## Component Improvements ### PressableFeedback Refactor The [PressableFeedback](/docs/native/components/pressable-feedback) component has been refactored with an improved API and better animation control. **Improvements:** - Enhanced animation configuration API - Better support for custom animation states - Improved performance and smoother animations - More flexible feedback positioning options The component maintains backward compatibility while providing more control over press feedback animations. **Related PR:** [#182](https://github.com/heroui-inc/heroui-native/pull/182) ## API Enhancements ### Animation API State Prop Extension The Animation API has been extended with a new `state` prop that allows you to disable animations while customizing properties. This provides more granular control over animation behavior. **New Capability:** ```tsx ``` The `state` prop can be: - `'disabled'`: Disable animations while still allowing property customization - `'disable-all'`: Disable all animations including children - `boolean`: Simple enable/disable control This enhancement makes it easier to customize animation properties without enabling animations, useful for fine-tuning component behavior. **Related PR:** [#176](https://github.com/heroui-inc/heroui-native/pull/176) ### use-theme-color Multiple Colors Selection The `use-theme-color` hook has been refactored to handle multiple colors selection, making it more flexible and powerful for theme customization. **Enhancement:** - Support for selecting multiple colors at once - Improved color selection logic - Better performance when working with multiple color values This improvement makes it easier to work with complex theming scenarios where multiple colors need to be selected and applied together. **Related PR:** [#170](https://github.com/heroui-inc/heroui-native/pull/170) ## Documentation ### Animated Styles Guide Comments Added comprehensive comments and documentation to the Animated Styles Guide, making it easier for developers to understand and use animation features effectively. **Improvements:** - Enhanced code examples with detailed comments - Better explanation of animation patterns - Clearer guidance on when to use different animation approaches **Related PR:** [#179](https://github.com/heroui-inc/heroui-native/pull/179) ## Bug Fixes This release includes fixes for the following issues: - **[Issue #173](https://github.com/heroui-inc/heroui-native/issues/173)**: Fixed issue where `classNames={{container:"bg-x"}}` was not working for styling the backgroundColor of TextField.Input container - **[Issue #177](https://github.com/heroui-inc/heroui-native/issues/177)**: Fixed button scale animation issue where the scale would sometimes stay at 0.9x and not bounce back after being pressed - **[Issue #178](https://github.com/heroui-inc/heroui-native/issues/178)**: Fixed bug affecting component functionality ## Updated Documentation The following documentation pages have been updated to reflect the changes in this release: - [Animation Guide](/docs/native/getting-started/animation) - Updated with Animation API State Prop documentation - [Colors Guide](/docs/native/getting-started/colors) - Updated with use-theme-color multiple colors selection information - [PressableFeedback Component](/docs/native/components/pressable-feedback) - Updated with refactored API documentation ## Links - [Component Documentation](../components) - [GitHub Repository](https://github.com/heroui-inc/heroui-native) ## Contributors Thanks to everyone who contributed to this release!