0.7.0 • Published 4 years ago

@dooboo-ui/native-radio-button v0.7.0

Weekly downloads
-
License
MIT
Repository
github
Last release
4 years ago

Radio Button

Simple radio button for react-native.
Refer : https://material-ui.com/components/radio-buttons

Installation

yarn add @dooboo-ui/native

or

yarn add @dooboo-ui/radio-button

Props

interface IRadioButtonProps {
  onPress: (value: string) => void;
  value: string;
  selectedValue: string;
  color?: string;
  disabled?: boolean;
  selected?: boolean;
  size?: number;
  label?: string;
  labelPlacement?: string;
}

API

PropertyRequiredTypeDefault
onPress:white_check_mark:func
value:white_check_mark:string
selectedValue:white_check_mark:string
colorstring'rgba(0, 0, 0, 0.54)'
disabledboolean
selectedboolean
sizenumber23
labelstring
labelPlacement'end'|'start'|'top'|'bottom''end'

Getting started

Import

import { RadioButton } from '@dooboo-ui/native';
// or
import RadioButton from '@dooboo-ui/radio-button';

Usage

const RadioButtonWithState = () => {
  const [selectedGender, setSelectedGender] = React.useState('female');

  return (
    <>
      <Title>Gender</Title>
      <View>
        <RadioButton
          value={'female'}
          label={'Female'}
          color={'orange'}
          selectedValue={selectedGender}
          onPress={(value: string): void => setSelectedGender(value)}
        />
        <RadioButton
          value={'male'}
          label={'Male'}
          color={'orange'}
          selectedValue={selectedGender}
          onPress={(value: string): void => setSelectedGender(value)}
        />
        <RadioButton
          value={'other'}
          label={'Other'}
          color={'orange'}
          selectedValue={selectedGender}
          onPress={(value: string): void => setSelectedGender(value)}
        />
      </View>
    </>
  );
};