react-native-elements/react-native-elements v5.0.0

on GitHub

⚠️ 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 @arpitBhalla in #3601
• fix: dist output target by @arpitBhalla in #3603
• 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
• ci: fix docs build by @arpitBhalla in #3670
• 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
• 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

• docs: updated Input.md link for Text props by @JDMathew in #3313
• docs(Icon): fix broken link by @ws333 in #3354
• chore: update autodoc by @arpitBhalla in #3364
• docs: add styled-components troubleshooting by @gluons in #3408
• docs: Include swipeable resetCallback example by @jorgegvallejo in #3411
• docs: fix "colors" typo by @shadowfish07 in #3416
• 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
• docs: ThemeProvider code snippet by @piyush97 in #3536
• docs: add tsdoc for Input & SearchBar by @arpitBhalla in #3541
• docs: update Tootlip usage snippet by @TUZI2018QH in #3560
• docs: corrected the description for the h4Style by @Louxsdon in #3551
• 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
• 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
• docs: change expo init to create-expo-app by @ankit-tailor in #3682
• Update theme_object.mdx by @HadiaRafiq in #3986
• docs: update Icon documentation to reflect modular icon packages by @deepktp in #4009

Other Changes

• 3.1.0 Release by @flyingcircle in #2735
• Release 3.2.0 by @flyingcircle in #2770
• update version to 3.2.0 (part 2) by @flyingcircle in #2771
• 3.3.0 Release by @flyingcircle in #2796
• Release 3.3.1 by @flyingcircle in #2829
• Release 3.3.2 by @flyingcircle in #2861
• Release 3.4.0 by @flyingcircle in #2980
• Release 3.4.1 by @flyingcircle in #2994
• Release 3.4.2 by @flyingcircle in #3072
• [Fix, Improve] Dialog component by @khushal87 in #3056
• Fix typo by @fvdbeek in #3086
• [docs] Tab demo code by @arpitBhalla in #3084
• [ListItem] Swipable add onLeftSwipe & onRightSwipe props by @arpitBhalla in #3077
• [Refactor] Directory structure of components by @khushal87 in #3081
• [Refactor] docs directory structure by @khushal87 in #3071
• [docs] Build Documentation by @arpitBhalla in #3098
• [docs] Added CNAME by @arpitBhalla in #3100
• [website] Redesigned by @arpitBhalla in #3108
• [BottomSheet] Add scrollViewProps to BottomSheet Component by @AllInOneYT in #3111
• [build] CI runs specific to changes by @arpitBhalla in #3101
• [SearchBar] Fixes broken types #3089 by @arpitBhalla in #3099
• [Add] Microsoft social icon by @khushal87 in #3094
• [website] Missing Packages by @arpitBhalla in #3114
• [Add] props description, descriptions to the component. by @khushal87 in #3112
• [Docs] Added demos and snack for the documentation by @khushal87 in #3126
• fix typo by @nathan-contino-mongo in #3124
• [tests] 🔨 Migrate to React Native Testing Library by @arpitBhalla in #3046
• Fix typos/grammar mistakes in Features.tsx by @marcmaceira in #3132
• [Add] Docgen auto generation of docs scripts by @khushal87 in #3136
• [Chip] Fix onPress by @AllInOneYT in #3129
• Pass-through isSelected indicator to ButtonGroup by @richardwu in #3133
• [Fix] Latest merge issues by @khushal87 in #3143
• [Docs] Added generate-markdown scripts by @khushal87 in #3142
• [ListItem] Add Ref Forward in Input by @arpitBhalla in #3122
• [Fix] Compilation issues by @khushal87 in #3144
• Migrate Tests to React Native Testing library by @arpitBhalla in #3150
• [LinearProgress] Prop for animations by @arpitBhalla in #3157
• Fix: Issue #3066 SocialIcon: Overall icon size doesn't change when prop raised={true} by @souviknsl07 in #3168
• [Add] Reddit social icon by @sanand34 in #3146
• Migrate Tests to React Native Testing library by @arpitBhalla in #3169
• Migrate Image Class Component to Functional Component and hooks by @arpitBhalla in #3151
• MIgrate Tooltip Class Component to Functional Component and Hooks by @arpitBhalla in #3155
• Migrate Tests to React Native Testing library by @arpitBhalla in #3170
• [Fix, Improve] Doc-gen issues and automation by @khushal87 in #3145
• Migrate to Pressable. by @arpitBhalla in #3148
• Revert "Migrate to Pressable." by @pranshuchittora in #3186
• Migrate to Pressable by @arpitBhalla in #3187
• [docs] GSoC'21 Blog for arpitBhalla by @arpitBhalla in #3181
• Add noopener and noreferrer to links opening a new tab by @Goff-Davis in #3250
• Add expo CI by @arpitBhalla in #3246
• Fix LinearProgress Clamp by @arpitBhalla in #3265
• Fix issues in docs autogen by @khushal87 in #3266
• Fix cache in docs CI by @arpitBhalla in #3269
• Release 4.0.0-beta.0 by @flyingcircle in #3263
• Update autoDocgen Default Value by @arpitBhalla in #3271
• Fix Rotate Bug Tabview by @oguzydz in #3262
• Add expo publish preview workflow by @arpitBhalla in #3253
• Playground with Live Code by @arpitBhalla in #3273
• Update Docs Live Editor playground by @arpitBhalla in #3276
• Add actions for deploy bleeding edge version by @arpitBhalla in #3282
• Add @react-native-elements/universe package by @arpitBhalla in #3278
• Fix the link of TabView component by @hasanfd in #3286
• Refactor base and themed package by @arpitBhalla in #3279
• Updates broken link to React Native TextInput docs by @MelissaPastoreClair in #3285
• fix: change TextProps from type to interface to enable declaration me… by @wkoutre in #3198
• feat: Add style props to TabView component by @hoshomoh in #3191
• (docs): Update migration guide & README by @arpitBhalla in #3288
• (website): Update script for InlinePressableProps by @khushal87 in #3193
• refactor: packages by @arpitBhalla in #3291
• refactor: unit tests by @arpitBhalla in #3294
• chore: update changelog & yarn v3 by @arpitBhalla in #3312
• fix(example): update broken views by @Biki-das in #3317
• ci: reuse install steps by @arpitBhalla in #3325
• chore: separate universe components by @arpitBhalla in #3323
• website: update docs and styles by @arpitBhalla in #3337
• test(ListItem): add testID in Accordion by @knmn2000 in #3329
• docs: update installation page by @derobpe in #3334
• chore: docs formatting and update sidebar by @arpitBhalla in #3342
• docs: Update Seachbar Snack Codes by @geniusmonir in #3345
• example: add Theme View by @arpitBhalla in #3347
• chore: docs usage snippets by @arpitBhalla in #3350
• chore(website): update layout by @arpitBhalla in #3359
• example: update ListItem.Swipeable view by @arpitBhalla in #3365
• website: update homepage layout by @arpitBhalla in #3366
• chore: refactor Skeleton & dependencies by @arpitBhalla in #3367
• website: update homepage layout by @arpitBhalla in #3373
• fix(Icon): preserve custom testID property by @dougkeen in #3376
• chore(autodoc): move to handlebar template by @arpitBhalla in #3385
• chore: add release script by @arpitBhalla in #3386
• fix(Dialog): remove container view by @hitesh-coder in #3384
• chore: bump v4.0.0-rc.0 by @arpitBhalla in #3395
• docs: update installation guide by @arpitBhalla in #3400
• chore: update expo preview url by @arpitBhalla in #3401
• fix: pkg entry point for react-native cli by @arpitBhalla in #3403
• chore: arrange props and exports by @arpitBhalla in #3381
• chore: update deps versions by @arpitBhalla in #3404
• chore: fix broken CI by @arpitBhalla in #3405
• example: fix typescript errors by @arpitBhalla in #3419
• website: upgrade to docusaurus@2.0.0-beta.18 by @arpitBhalla in #3422
• chore: move pkg to @rneui scope by @arpitBhalla in #3420
• chore: bump version 4.0.0-rc.1 by @arpitBhalla in #3423
• 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
• 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
• 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
• ci: add PR build preview action by @arpitBhalla in #3565
• chore: bump v4.0.0-rc.5 by @arpitBhalla in #3567
• chore: bump v4.0.0-rc.6 by @arpitBhalla in #3606
• chore: bump v4.0.0-rc.7 by @arpitBhalla in #3671
• 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[bot] 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
• 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
• Fix: fractions Runtime Validation in SwipeRating by @codewithshinde in #3990
• chore(release): bump version to 5.0.0 by @theianmay in #4015
• docs(release): add versioned website documentation for v5.0.0 by @theianmay in #4016

New Contributors

• @fvdbeek made their first contribution in #3086
• @AllInOneYT made their first contribution in #3111
• @nathan-contino-mongo made their first contribution in #3124
• @marcmaceira made their first contribution in #3132
• @richardwu made their first contribution in #3133
• @souviknsl07 made their first contribution in #3168
• @sanand34 made their first contribution in #3146
• @Goff-Davis made their first contribution in #3250
• @oguzydz made their first contribution in #3262
• @hasanfd made their first contribution in #3286
• @MelissaPastoreClair made their first contribution in #3285
• @CodeToTee made their first contribution in #3203
• @wkoutre made their first contribution in #3198
• @hoshomoh made their first contribution in #3191
• @roffelund made their first contribution in #3215
• @JDMathew made their first contribution in #3313
• @knmn2000 made their first contribution in #3329
• @derobpe made their first contribution in #3334
• @kedar09 made their first contribution in #3074
• @geniusmonir made their first contribution in #3345
• @entrymaster made their first contribution in #3336
• @ws333 made their first contribution in #3354
• @dougkeen made their first contribution in #3376
• @hitesh-coder made their first contribution in #3384
• @WVAviator made their first contribution in #3397
• @gluons made their first contribution in #3408
• @jorgegvallejo made their first contribution in #3411
• @shadowfish07 made their first contribution in #3416
• @monk-lee made their first contribution in #3426
• @renbaoshuo made their first contribution in #3474
• @lucksp made their first contribution in #3482
• @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
• @Duell10111 made their first contribution in #3550
• @TUZI2018QH made their first contribution in #3560
• @Louxsdon made their first contribution in #3551
• @I-am-abdulazeez made their first contribution in #3570
• @rafae2k made their first contribution in #3580
• @srj101 made their first contribution in #3576
• @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
• @ankit-tailor made their first contribution in #3682
• @muffix made their first contribution in #3691
• @github-actions[bot] 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
• @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: v3.4.2...v5.0.0