⚠️ 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

4.0.0-rc.1 (2022-03-28)

To use this version

yarn add @rneui/base @rneui/themed

npm install @rneui/base @rneui/themed

💥 Breaking Change

• themed
  • #3324 feat(ThemeProvider)!: update withTheme and ThemeProvider (@arpitBhalla)
    Replace colors with lightColors in createTheme

🐛 Bug Fix

• base, themed
  • #3418 fix(theme): remove Partial in Colors (@arpitBhalla)
• base
  • #3397 fix(Tab, TabView): conditional rendering (@WVAviator)
  • #3380 fix(TabView): swipe issue (@arpitBhalla)

📝 Documentation

• #3416 docs: fix "colors" typo (@shadowfish07)
• #3411 docs: Include swipeable resetCallback example (@jorgegvallejo)
• #3408 docs: add styled-components troubleshooting (@gluons)

Committers: 6

• Alexander Durham @WVAviator
• Arpit Bhalla @arpitBhalla
• Jeremy Hamilton @flyingcircle
• Jorge G Vallejo @jorgegvallejo
• Saran Tanpituckpong ✔️ @gluons
• @shadowfish07