Radio

Radio buttons allow one selection from a group of options

import * as React from "react";
import { Radio } from "@nulogy/components";

export default () => {
  return (
    <Radio
      labelText="option A"
      onChange={e => console.log("onChange", e)}
    />
  );
}

import * as React from "react";
import { Radio } from "@nulogy/components";

export default () => {
  return (
    <Radio
      labelText="option A"
      onChange={e => console.log("onChange", e)}
    />
  );
}

Props

Name	Type	Default	Description
checked	boolean		Whether or not this radio button is the currently selected item in the group
name	string		Identified that groups inputs together
defaultChecked	boolean	false	Makes the field checked by default
disabled	boolean	false	Marks the field as disabled and disallows user input
error	boolean	false	Marks the field as invalid and turns red
labelText	string	Required	Label for the input
onChange	function		onChange handler
required	boolean	false	Makes the field require input before the form will submit
id	string		A unique ID for this input
className	string		className passed to the wrapper

Guidelines

Whenever possible use radio buttons for short lists (~ 5-7)
Add labels, errors and default selections with Radio Group
Consider using a Select for long lists

Radio

Props

Guidelines

Related Components