⚠️ V5 RELEASE NOTES

PLEASE NOTE: This is the initial release for React Native Elements v5. The beta release has been live for 1.5 months and we have addressed several items. Thank you to everyone who participated in the testing. Your feedback was very helpful for the team. The primary change between the beta release and this v5 version is the migration to Pressable for Button component. Please see beta release notes for more details for the changes leading up to that pre-release version.

Please note that this is the first release in quite some time for React Native Elements. The reason for this was a change in maintainership and the core contributors team. We are a new, small team working to learn RNE and get the project back in a working state, but there will be bugs. When you find a bug, please document it and open an Issue. Please feel free to reach out via GitHub or our community Discord channel for any questions, and we appreciate everyone's patience as we work to address any open issues. We also welcome any contributions from the community as well as any project sponsorships - both help to drive the project forward.

What's Changed

💥 Breaking Change

• chore: migrate to monorepo by @arpitBhalla in #3272
• feat(ThemeProvider)!: update withTheme and ThemeProvider by @arpitBhalla in #3324
• feat(ThemeProvider)!: restructure default component theme by @arpitBhalla in #3582
• fix(Avatar): improve component by @khushal87 in #3760
• fix:react-native-ratings integration in react-native-elements by @codewithshinde in #3983
• Upgrade React native Vector Icons library by @deepktp in #3994
• Migrate Button component to use Pressable by @codewithshinde in #4011

🚀 New Feature

• feat(BottomSheet): add onBackdropPress handler by @kedar09 in #3074
• feat(Tab): add horizontally scrollable Tab.Items by @entrymaster in #3336
• feat(ListItem): add onSwipeBegin and onSwipeEnd handlers & resetCallback by @arpitBhalla in #3180
• feat(Skeleton): new component by @arpitBhalla in #3357
• chore: migrate typealias to interface by @arpitBhalla in #3374
• feat(CheckBox): add disabled, disabledTitleStyle, disabledStyle props by @kedar09 in #3430
• website: add playground by @arpitBhalla in #3502
• feat(Tooltip): add animationType prop by @arpitBhalla in #3487
• feat(base): add makeStyles by @arpitBhalla in #3510
• feat(theming): add spacing to theme by @arpitBhalla in #3495
• feat(Button): add title as children & new size, color, radius prop by @arpitBhalla in #3494
• feat: add ComponentFunctionProps to theme by @arpitBhalla in #3645
• feat(SeachBar): add onKeyboardHide for android by @arpitBhalla in #3657
• feat: update Tab component by @arpitBhalla in #3658
• feat(Swipeable): add minSlideWidth prop by @arpitBhalla in #3688
• feat(Header): add edges support for SafeAreaView by @thekevshow in #3741
• feat(Input): Ability to specify an Input ErrorComponent by @markrickert in #3759

🐛 Bug Fix

• fix(Slider): Fix issues with scrub and allowTouchTrack by @CodeToTee in #3203
• #3213 Remove deprecated Keyboard.removeListener by @roffelund in #3215
• fix(themeColors): add support for dark mode by @arpitBhalla in #3078
• fix(FAB): add small size style by @sumj25 in #3322
• fix(AirbnbRating): add props to parent component by @knmn2000 in #3335
• fix(ListItem): remove Accordion height animation by @arpitBhalla in #3352
• fix(TabView): swipe issue by @arpitBhalla in #3380
• fix(Tab, TabView): conditional rendering by @WVAviator in #3397
• fix(theme): replace Partial to Colors by @arpitBhalla in #3418
• fix: change InputProps shake props optional. by @monk-lee in #3426
• fix(SpeedDial): add themed FAB by @arpitBhalla in #3436
• fix(Chip): border radius on tap by @kedar09 in #3442
• fix(Tooltip): removeEventListener deprecated warning by @monk-lee in #3440
• fix(SearchBar): typescript errors by @arpitBhalla in #3437
• fix(Theming): extend default theme by @arpitBhalla in #3450
• fix(ListItem): isExpanded set default false for Accordion by @kedar09 in #3475
• fix(Overlay): custom backgroundColor override by @kedar09 in #3471
• fix(SpeedDial): Left placement for Actions by @arpitBhalla in #3479
• fix(ListItem): Swipeable panresponders by @arpitBhalla in #3449
• fix(SpeedDial.Action): wrap with pressable by @arpitBhalla in #3480
• build: change build target by @arpitBhalla in #3493
• fix(ListItem): custom Icon for Accordion by @arpitBhalla in #3504
• fix(Tab): indicator on first render by @arpitBhalla in #3505
• fix(Icon): raised ios shadow issue by @kedar09 in #3491
• fix(ButtonGroup): render correctly in vertical mode by @kedar09 in #3432
• fix(ListItem): Accordion children areas were not hidden by @monk-lee in #3517
• fix(Dialog): Action button on web by @kedar09 in #3514
• fix(withTheme): add spacing to non-ThemeProvider components by @arpitBhalla in #3525
• fix(makeStyles): add Theme in makeStyle interface by @arpitBhalla in #3526
• fix(ListItem): left & right content width onRelease in Swipeable by @louislatreille in #3534
• fix(Tab): inputRange using Array.from by @arpitBhalla in #3538
• fix(ButtonGroup): add and improve types and add tests by @grgr-dkrk in #3220
• fix: fix peerDependency compatibility by @navarroaxel in #3545
• fix(Tooltip): add default value in measure component by @Duell10111 in #3550
• fix(Button): theme spacing xs error by @arpitBhalla in #3563
• fix(Tab): indicator with initial index by @arpitBhalla in #3564
• fix: typo when exporting colors types by @rafae2k in #3580
• fix: add children as prop by @arpitBhalla in #3583
• fix(Switch): Android throws an error when setting it to false by @arpitBhall...

⚠️ BETA RELEASE NOTICE

This is a beta release for React Native Elements v5. There are known issues with Button components on Android (React Native 0.80+) that will be addressed in the stable v5.0.0 release. The goal of this beta release to find and fix bugs as well as gather feedback from the community. I have opened a Discussion related to this release so please feel free to post there or reach out via Discord.

Known Issues:

• Button disabled state styling not updating properly on Android (#3985)
• Related to upstream React Native TouchableNativeFeedback bug (#53849)
• Affects: Button, FAB, Chip, Dialog.Button, Tab.Item, PricingButton

Workaround: See suggestions in thread here: (#3985)

Timeline: Full fix planned for stable v5.0.0 release.

What's Changed

💥 Breaking Change

• fix:react-native-ratings integration in react-native-elements by @codewithshinde in #3983
• Upgrade React native Vector Icons library by @deepktp in #3994

🐛 Bug Fix

• fix: multiple components render issue in Avatar by @khushal87 in #3831
• fix(Rating): Missing component props by @flysteur-dev in #3838
• fix(Slider): center thumb on pressed location of the track by @krosenberg in #3821
• fix(Text): add forwardRef by @Mickeygogo in #3815
• fix(AirbnbRating): Custom images not rendering, memory leak, and animation bugs by @theianmay in #3992

📝 Documentation

• Update theme_object.mdx by @HadiaRafiq in #3986

Other Changes

• docs: fix radio checkbox sample code properties by @onys-programmer in #3826
• fix(SocialIcon): Add missing apple social icon by @JaweedVenturedive in #3866
• fix: remove deprecated style type by @rustam-mukhametshin in #3851
• fix(SearchBar): fixed iOS search bar icons issue by @JaweedVenturedive in #3865
• fix: absolute path issue in link for consistent URLs by @abdulbasithqb in #3856
• fix: update themed package version to latest by @khushal87 in #3871
• fix(base,example): Dialog.title not honoring theme in dark mode. by @amutsch in #3878
• fix: SpeedDial component cant work in web platform by @alwaysloseall in #3880
• fix(SocialIcon): handle button prop correctly by @darkbasic in #3860
• fix(makeStyles): Fix object literal outside useMemo causing styles to change on every render by @duncannz in #3844
• Merge changes from vikalp elements by @deepktp in #3984
• refactor: extract Tooltip components to resolve ES Lint warnings by @theianmay in #3988
• Upgraded library's react native version to 0.81 and expo to 54 by @deepktp in #3993
• fix(example app): resolve deprecation warnings and TypeScript errors by @theianmay in #3995
• chore: update dependencies to resolve Dependabot alerts by @theianmay in #3996
• fix: Example App Icons Updates by @theianmay in #3999
• chore: update dependency resolutions by @theianmay in #4000
• chore: update website resolutions by @theianmay in #4001
• fix: replace magic number with spacing token in Button component by @karanmonu in #3978
• fix: build process excluding image assets in published package by @theianmay in #4004
• fix: slider track alignment issue fix for new rn versions by @deepktp in #4003
• chore(release): bump version to 5.0.0-beta.1 by @theianmay in #4005
• chore: update @rneui/base dependency to 5.0.0-beta.1 by @theianmay in #4006

New Contributors

• @flysteur-dev made their first contribution in #3838
• @krosenberg made their first contribution in #3821
• @onys-programmer made their first contribution in #3826
• @Mickeygogo made their first contribution in #3815
• @JaweedVenturedive made their first contribution in #3866
• @rustam-mukhametshin made their first contribution in #3851
• @abdulbasithqb made their first contribution in #3856
• @amutsch made their first contribution in #3878
• @alwaysloseall made their first contribution in #3880
• @darkbasic made their first contribution in #3860
• @duncannz made their first contribution in #3844
• @deepktp made their first contribution in #3984
• @codewithshinde made their first contribution in #3983
• @theianmay made their first contribution in #3992
• @HadiaRafiq made their first contribution in #3986
• @karanmonu made their first contribution in #3978

Full Changelog: v4.0.0-rc.8...v5.0.0-beta.1

What's Changed

💥 Breaking Change

• fix(Avatar): improve component by @khushal87 in #3760

🚀 New Feature

• feat(Swipeable): add minSlideWidth prop by @arpitBhalla in #3688
• feat(Header): add edges support for SafeAreaView by @thekevshow in #3741
• feat(Input): Ability to specify an Input ErrorComponent by @markrickert in #3759

🐛 Bug Fix

• feat(Overlay): add KeyboardAvoidingView by @kedar09 in #3453
• fix(theme): add ListItemSwipable to ComponentTheme interface by @muffix in #3691
• fix(withTheme): refs on functional components wrapped by @marcshilling in #3708
• fix(Icon): add testID prop by @KrisLau in #3787
• fix(ThemeProvider): update theme with prop change by @arpitBhalla in #3732
• fix(CheckBox): reduce needless re-rendering of Icon by @fivecar in #3773
• fix(Divider): borderBottomWidth error when the width is a percentage by @phankietit in #3804

📝 Documentation

• docs: change expo init to create-expo-app by @ankit-tailor in #3682

Other Changes

• website: fix crawler multiple urls by @arpitBhalla in #3672
• chore: add docgen-ignore by @arpitBhalla in #3675
• chore: add discord community link by @arpitBhalla in #3679
• ci: expo upgrade gh action by @arpitBhalla in #3702
• ci: add docs bump gh action workflow by @arpitBhalla in #3704
• website: update landing page by @arpitBhalla in #3706
• tooling: auto build usages from *.usage.tsx files by @arpitBhalla in #3707
• example: upgrade expo SDK to latest by @github-actions in #3705
• tooling: add support for jsx functions for usage generate by @arpitBhalla in #3711
• tests: breaking change for @testing-library/react-native by @arpitBhalla in #3714
• website: create migration guide for v4 by @arpitBhalla in #3717
• fix: package dependencies by @arpitBhalla in #3713
• docs: add more usage examples & update theme guides by @arpitBhalla in #3723
• website: add expo go client & update config by @arpitBhalla in #3725
• docs: add examples for ThemeProvider by @arpitBhalla in #3729
• docs: add usage examples for listitem & card by @arpitBhalla in #3733
• website: docusaurus upgrade by @dongCode in #3745
• fix(website): add Rating to sidebar by @khushal87 in #3753
• feat(website): adds playground link to the website hero by @pranshuchittora in #3765
• docs(Dialog): update broken link by @jsiot76 in #3780
• feat(Header): add hideStatusBar prop in header (#3755) by @ramizqazi in #3801
• docs: add avatar component changes in the migration guide by @khushal87 in #3805
• fix(ci): build errors by @arpitBhalla in #3806
• fix(Skeleton): height/width prop incorrect typing by @deepak-rawat78 in #3802
• chore: bump 4.0.0-rc.8 by @arpitBhalla in #3819

New Contributors

• @ankit-tailor made their first contribution in #3682
• @muffix made their first contribution in #3691
• @github-actions made their first contribution in #3705
• @thekevshow made their first contribution in #3741
• @dongCode made their first contribution in #3745
• @marcshilling made their first contribution in #3708
• @jsiot76 made their first contribution in #3780
• @ramizqazi made their first contribution in #3801
• @KrisLau made their first contribution in #3787
• @fivecar made their first contribution in #3773
• @phankietit made their first contribution in #3804
• @markrickert made their first contribution in #3759
• @deepak-rawat78 made their first contribution in #3802

Full Changelog: v4.0.0-rc.7...v4.0.0-rc.8

• fix react-native-safe-area-context peer-dependency version

What's Changed

🚀 New Feature

• feat: add theme to ComponentFunctionProps by @arpitBhalla in #3645
• feat(SeachBar): add onKeyboardHide for android by @arpitBhalla in #3657
• feat: update Tab component by @arpitBhalla in #3658

🐛 Bug Fix

• fix(TabView): iOS TabView issue by @abhinav-official in #3635
• fix(useTheme): undefined components error by @arpitBhalla in #3643
• fix: property 'children' does not exist in React 18 by @arpitBhalla in #3663
• fix: rename white theme color to background by @arpitBhalla in #3664

📝 Documentation

• docs: customisation page snippet by @rvenky125 in #3614
• docs: nextjs typo by @akinfelami in #3613
• docs(Avatar): remove activeOpacity prop by @dakshbhardwaj in #3618
• website: footer broken links by @OlivierJM in #3622
• website: fix broken link by @jckmrrssy in #3639
• docs: add themeKey to component docs by @arpitBhalla in #3641
• docs: update extending docs by @arpitBhalla in #3642
• docs(Tooltip): add controlled component to expo demo by @arpitBhalla in #3644
• docs: homepage sponsor url by @haruelrovix in #3652
• website: add missing dependencies by @MaximFedarau in #3653
• chore: upgrade docusaurus to latest by @arpitBhalla in #3659
• docs(Button): fix typos by @MaximFedarau in #3661
• docs: add usage Live example by @arpitBhalla in #3669

Other Changes

• chore: bump v4.0.0-rc.6 by @arpitBhalla in #3606
• ci: fix docs build by @arpitBhalla in #3670

New Contributors

• @rvenky125 made their first contribution in #3614
• @akinfelami made their first contribution in #3613
• @abhinav-official made their first contribution in #3635
• @dakshbhardwaj made their first contribution in #3618
• @OlivierJM made their first contribution in #3622
• @jckmrrssy made their first contribution in #3639
• @MaximFedarau made their first contribution in #3653

Full Changelog: v4.0.0-rc.6...v4.0.0-rc.7

What's Changed

💥 Breaking Change

• feat(ThemeProvider)!: restructure default component theme by @arpitBhalla in #3582

import { createTheme } from '@rneui/themed';

const myTheme = createTheme({
+  components: {
    Button:{
      titleStyle: {
        color: 'red'
      },
    },
+  },
});

🐛 Bug Fix

• fix: typo when exporting colors types by @rafae2k in #3580
• fix: add children as prop by @arpitBhalla in #3583
• fix(Switch): Android throws an error when setting it to false by @arpitBhalla in #3601
• fix: dist output target by @arpitBhalla in #3603

📝 Documentation

• Updated Skeleton.md file by @I-am-abdulazeez in #3570
• docs: rename colors to lightColors by @arpitBhalla in #3584
• docs: usage example for Tab Items by @srj101 in #3576
• docs: BottomSheet playground by @arpitBhalla in #3602

Other Changes

• chore: bump v4.0.0-rc.5 by @arpitBhalla in #3567

New Contributors

• @I-am-abdulazeez made their first contribution in #3570
• @rafae2k made their first contribution in #3580
• @srj101 made their first contribution in #3576

Full Changelog: v4.0.0-rc.5...v4.0.0-rc.6

What's Changed

🐛 Bug Fix

• fix: fix peerDependency compatibility by @navarroaxel in #3545
• fix(Tooltip): add default value in measure component by @Duell10111 in #3550
• fix(Button): theme spacing xs error by @arpitBhalla in #3563
• fix(Tab): indicator with initial index by @arpitBhalla in #3564

📝 Documentation

• docs: update Tootlip usage snippet by @TUZI2018QH in #3560
• docs: corrected the description for the h4Style by @Louxsdon in #3551

Other Changes

• ci: add PR build preview action by @arpitBhalla in #3565

New Contributors

• @Duell10111 made their first contribution in #3550
• @TUZI2018QH made their first contribution in #3560
• @Louxsdon made their first contribution in #3551

Full Changelog: v4.0.0-rc.4...v4.0.0-rc.5

What's Changed

🐛 Bug Fix

• fix(ListItem): Accordion children areas were not hidden by @monk-lee in #3517
• fix(Dialog): Action button on web by @kedar09 in #3514
• fix(withTheme): add spacing to non-ThemeProvider components by @arpitBhalla in #3525
• fix(makeStyles): add Theme in makeStyle interface by @arpitBhalla in #3526
• fix(ListItem): left & right content width onRelease in Swipeable by @louislatreille in #3534
• fix(Tab): inputRange using Array.from by @arpitBhalla in #3538
• fix(ButtonGroup): add and improve types and add tests by @grgr-dkrk & @arpitBhalla in #3220

📝 Documentation

• docs: ThemeProvider code snippet by @piyush97 in #3536
• docs: add tsdoc for Input & SearchBar by @arpitBhalla in #3541

Other Changes

• website: add new appId & apiKey by @arpitBhalla in #3522
• website: support icons by @arpitBhalla in #3524
• chore: update twitter url by @arpitBhalla in #3527
• example: add missing props by @Ming1996 in #3532
• website: update webpack config by @arpitBhalla in #3537
• ci: website frozen lockfile by @arpitBhalla in #3539
• website: page title SEO by @arpitBhalla in #3540
• chore: bump v4.0.0-rc.4 by @arpitBhalla in #3542

New Contributors

• @Ming1996 made their first contribution in #3532
• @louislatreille made their first contribution in #3534
• @piyush97 made their first contribution in #3536
• @grgr-dkrk made their first contribution in #3220

Full Changelog: v4.0.0-rc.3...v4.0.0-rc.4

What's Changed

🚀 New Feature

• website: add playground by @arpitBhalla in #3502
• feat(Tooltip): add animationType prop by @arpitBhalla in #3487
• feat(base): add makeStyles by @arpitBhalla in #3510
• feat(theming): add spacing to theme by @arpitBhalla in #3495
• feat(Button): add title as children & new size, color, radius prop by @arpitBhalla in #3494

🐛 Bug Fix

• build: change build target by @arpitBhalla in #3493
• fix(ListItem): custom Icon for Accordion by @arpitBhalla in #3504
• fix(Tab): indicator on first render by @arpitBhalla in #3505
• fix(Icon): raised ios shadow issue by @kedar09 in #3491
• fix(ButtonGroup): render correctly in vertical mode by @kedar09 in #3432

📝 Documentation

• docs: update extending theme by @lucksp in #3482
• docs: update extend theme docs by @arpitBhalla in #3497
• docs: add fontWeight for Text on android by @arpitBhalla in #3506

Other Changes

• chore: remove circular-slider pkg by @arpitBhalla in #3483
• example: add webpack config by @arpitBhalla in #3492
• website: improve footer & sidebar styling by @arpitBhalla in #3498
• website: add Live Preview by @arpitBhalla in #3500
• chore: website version label edge by @arpitBhalla in #3508
• website: add SEO img & tags by @arpitBhalla in #3509
• website: update v4 blog by @arpitBhalla in #3511
• chore: bump v4.0.0-rc.3 by @arpitBhalla in #3512

New Contributors

• @lucksp made their first contribution in #3482

Full Changelog: v4.0.0-rc.2...v4.0.0-rc.3

What's Changed

🚀 New Feature

• feat(CheckBox): add disabled, disabledTitleStyle, disabledStyle props by @kedar09 in #3430

🐛 Bug Fix

• fix: change InputProps shake props optional. by @monk-lee in #3426
• fix(SpeedDial): add themed FAB by @arpitBhalla in #3436
• fix(Chip): border radius on tap by @kedar09 in #3442
• fix(Tooltip): removeEventListener deprecated warning by @monk-lee in #3440
• fix(SearchBar): typescript errors by @arpitBhalla in #3437
• fix(Theming): extend default theme by @arpitBhalla in #3450
• fix(ListItem): isExpanded set default false for Accordion by @kedar09 in #3475
• fix(Overlay): custom backgroundColor override by @kedar09 in #3471
• fix(SpeedDial): Left placement for Actions by @arpitBhalla in #3479
• fix(ListItem): Swipeable panresponders by @arpitBhalla in #3449
• fix(SpeedDial.Action): wrap with pressable by @arpitBhalla in #3480

Other Changes

• chore: update readme pkg name by @arpitBhalla in #3435
• chore: fix readme & website by @arpitBhalla in #3448
• website: remove git.io link from blog by @renbaoshuo in #3474
• fix(ThemeProvider): add children prop explicitly by @arpitBhalla in #3477
• fix(Skeleton): remove type from import by @arpitBhalla in #3476
• chore: update example dependency by @arpitBhalla in #3478

Full Changelog: 4.0.0-rc.1...v4.0.0-rc.2