Components

Button

Created a custom button using React Native's "TouchableOpacity" with variants like primary, default, outline, etc.


Props

variant
Type: string
Description: Specifies the style variant of the button, such as primary, default, or outline. 
       <Button variant="primary" ... />
flex
Type: number
Description: Controls the flex-grow value of the button, determining how much it should expand or contract relative to its container. 
       <Button flex={1}  ... />
style
Type: Style Object
Description: Custom styles for the button. 
       <Button style={{ backgroundColor: 'blue' }} ... />
title
Type: string
Description: Text to be displayed inside the button. 
       <Button title="Submit" ... />
titleStyle
Type: Style Object
Description: Accepts custom styles for the title text. 
       <Button titleStyle={{ fontSize: 16, color: 'white' }}  ... />
icon
Type: { name: string; type: string; right: boolean; style: any }
Description: Specifies the icon properties, including the icon name, type, optional right alignment, and custom styles. 
       <Button icon={{ name: 'home', type: 'Feather', right: true }}   ... />
iconStyle
Type: Style Object
Description: Accepts custom styles for the icon. 
       <Button iconStyle={{ color: 'red', fontSize: 20 }}  ... />
paddingVertical
Type: number
Description: Specifies custom vertical padding for the button. 
       <Button paddingVertical={15}  ... />
paddingHorizontal
Type: number
Description: Specifies custom horizontal padding for the button. 
       <Button paddingHorizontal={15}  ... />
justifyContent
Type: string
Description: Custom 'justifyContent' style to control the alignment of children along the primary axis of the button's layout. 
       <Button justifyContent="center" ... />
noAction
Type: boolean
Description: A boolean flag to disable any action on the button. When set to true, the button will not be pressable. 
       <Button noAction={true} ... />
onPress
Type: Function Handler
Description: A function to be called when the button is pressed. 
       <Button onPress={handleSubmit} ... />