Cross platform react native components https://zealous-snyder-a3ec60.netlify.app/

Getting Started

Prerequisites

NodeJS >= v12.11.1 react-native-cli >= 2.0.1 react-native >= 0.61 npm >= 5.6.0

Table of Contents

• Install
• Components
• License

Install

This package uses react-native-vector-icons, you can follow this installation instructions

npm:

npm install react-native-ui-modules

yarn:

yarn add react-native-ui-modules

Components

• Input
• Icon
• Snackbar
• Spinner
• Button
• Card
• Accordion
• Picker
• Dialog

Input

This component inherits all native TextInput props along with the following:-

| Property | Type | | ----------------- | ------------------------------------- | | variant | String(enum - "outlined", "standard") | | multiline | Boolean | | inputWidth | String | | height | Number | | borderRadius | Number | | borderColor | String | | borderBottomColor | String | | startIcon | Boolean | | icon | Object | | endIcon | Object | | type | String (enum - "passwod") | | passwordHidden | Boolean | | togglePassword | Function |

Icon

This component inherits react-native-vector-icons property:

| Property | Type | | -------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | name | String | | size | Number | | type | String(enum - "materialIcon", "antDesign", "materialCommunityIcon", "entypo", "zocial", "feather", "ionIcons", "octIcons", "evilIcons", "foundation", "fontAwesome", "fontAwesome5", "simpleLineIcons"), | | color | String |

Spinner

| Property | Type | | --------------- | ------------------------------- | | visible | Boolean | | size | String(enum - "small", "large") | | backgroundColor | String (android only) | | onClose | Function | | color | String |

Snackbar

| Property | Type | | ---------------- | ------------------------------ | | visible | Boolean | | position | String(enum - "top", "bottom") | | message | String | | messageTextColor | String | | actionText | String | | actionTextColor | String | | backgroundColor | String | | handleAction | Function |

Button

| Property | Type | | ----------- | ------------------------------------------------ | | title | String | | color | String(enum - "primary", "secondary", "default") | | buttonWidth | String | | variant | String(enum - "contained", "outlined") | | endIcon | Object | | titleColor | String | | titleStyle | Object | | buttonColor | String | | buttonStyle | Object | | onPress | Function |

Card

| Property | Type | | --------------- | -------- | | cardBorder | Number | | cardWidth | String | | cardTitle | String | | cardColor | String | | headerTextStyle | Object | | headerStyle | Object | | onPress | Function |

Accordion

| Property | Type | | ---------------- | -------- | | bgColor | Number | | width | String | | heading | String | | secondaryHeading | String | | expanded | Boolean | | secondaryStyle | Object | | headingStyle | Object | | onChange | Function |

Picker

| Property | Type | | --------------- | -------- | | bgColor | Number | | width | String | | pickerItems | Array | | selectedItem | String | | onValueChange | Function | | pickerItemStyle | Object | | pickerTextStyle | Object |

Dialog

| Property | Type | | ---------------- | -------------------------------------- | | type | String(enum - "bottomSheet", "dialog") | | visible | Boolean | | cancelable | Function | | onClose | Function | | dialogContainer | Object | | buttonTitleStyle | Object |

License

MIT © Ajay