@trendmicro/react-radio-button

2.0.0 • Public • Published

react-radio-button build status Coverage Status

NPM

React Radio Button

Demo: https://trendmicro-frontend.github.io/react-radio-button

Installation

  1. Install the latest version of react and react-radio-button:
npm install --save react @trendmicro/react-radio-button
  1. At this point you can import @trendmicro/react-radio-button and its styles in your application as follows:
import RadioButton from '@trendmicro/react-radio-button';

// Be sure to include styles at some point, probably during your bootstraping
import '@trendmicro/react-radio-button/dist/react-radio-button.css';

Usage

<RadioButton label="RadioButton label" />

The label prop is optional, you can use children to pass through the component.

<RadioButton label="RadioButton label">
    <p style={{ marginLeft: 24 }}>
        Lorem ipsum dolor sit amet...
    </p>
</RadioButton>

<RadioButton>
    <span style={{ verticalAlign: 'middle', marginLeft: 8 }}>
        Lorem ipsum dolor sit amet...
    </span>
</RadioButton>

Uncontrolled RadioButton

// Default checked
<RadioButton defaultChecked />

Controlled RadioButton

// Checked
<RadioButton checked />

API

Properties

Name Type Default Description
children any Children to pass through the component.
className Object Customized class name for the component.
style Object Customized style for the component.
label Node or String Text label to attach next to the radio button.
inputClassName Object Customized class name for the radio button.
inputStyle Object Customized style for the radio button.
disabled Boolean false If true, the radio button shown as disabled and cannot be modified.
checked Boolean The checked state of the radio button.
defaultChecked Boolean The default checked state of the radio button.

Class Properties

Use the ref property to get a reference to the component:

<RadioButton
    ref={node => {
        if (node) {
            this.radioButton = node;
            console.log(this.radioButton.checked);
        }
    }}
/>
Name Type Description
checked Boolean Get the checked state.

License

MIT

Package Sidebar

Install

npm i @trendmicro/react-radio-button

Weekly Downloads

2

Version

2.0.0

License

MIT

Last publish

Collaborators

  • trendmicro-frontend
  • cheton
  • rothpeng
  • smalltase