@farmart/farmart-components-library
v1.0.33
Published
UI components
Downloads
48
Readme
Farmart-Components-Library
This npm package was built to create a pool of common Reusable components for our React-Native Projects.We have Integrated our design systema and you can integrate yours too by providing your theme.This is the first version and we are still optimizing it.
Installation
Install @farmart/farmart-components-library with npm
npm install @farmart/farmart-components-library
cd my-project
Install @farmart/farmart-components-library with yarn
yarn add @farmart/farmart-components-library
cd my-project
Usage/Examples
import React from 'react'
import {Toggle,ThemeProvider,theme, SearchBar,BulletPoint,Label, CheckBox, DropDown,StepperComponent} from '@farmart/farmart-components-library'
import { GestureHandlerRootView } from 'react-native-gesture-handler'
import { Button, ScrollView, View } from 'react-native'
function App() {
<GestureHandlerRootView>
<ThemeProvider value={theme}>
<SearchBar placeHolder={'Select State'} onChangeText={()=>{}} onClear={()=>{}} />
<DropDown
title='Select'
isModalOpen={false}
toggleModal={()=>{}}
disabled={false}
data={[]}
heading='your_heading'
onClickItem={()=>{}}
selectedItem={null}
isMultipleSelectionAllowed={false}
/>
<Toggle variant='small' />
<Toggle variant='large'/>
<SearchBar placeHolder={'Select State'} onChangeText={()=>{}} onClear={()=>{}} />
<BulletPoint variant="small" isActive={true}/>
<BulletPoint variant="large" isActive={false}/>
<CheckBox variant={'small'} active={true}/>
<CheckBox variant={'large'} active={false}/>
<Label varient='infoLow' text='Label'/>
<Label varient='infoHigh' text='Label'/>
<Label varient='successLow' text='Label'/>
<StepperComponent
orientation='vertical'
steps={['Step 1','Step 2','step 3']}
activeStep={3}
>
// {your child component}
</StepperComponent>
</ThemeProvider>
</GestureHandlerRootView>
}
export default App
Authors
License
Feedback
If you have any feedback, please reach out to us at [email protected]