Radio

A radio button group for single-select in Ink 5.

Install

npm install @matthesketh/ink-radio

Usage

import React, { useState } from 'react';
import { render } from 'ink';
import { RadioGroup } from '@matthesketh/ink-radio';

const options = [
  { label: 'Small', value: 'sm' },
  { label: 'Medium', value: 'md' },
  { label: 'Large', value: 'lg' },
];

function App() {
  const [value, setValue] = useState('md');
  return <RadioGroup options={options} value={value} onChange={setValue} />;
}

render(<App />);

Props

Prop	Type	Default	Description
options	RadioOption[]	required	List of options to display
value	string	undefined	Currently selected value
onChange	(value: string) => void	undefined	Called when selection changes
direction	'vertical' | 'horizontal'	'vertical'	Layout direction
color	string	'cyan'	Colour of the selected option

RadioOption

interface RadioOption {
  label: string;
  value: string;
  disabled?: boolean;
}

Appearance

Selected options render in bold with the configured colour. Disabled options render dim.

License

MIT