Outlook_Addin_LLM/node_modules/@fluentui/react-radio
2024-11-29 21:36:41 +01:00
..
dist First version with simple frontend and Compose Email by AI 2024-11-29 21:36:41 +01:00
lib First version with simple frontend and Compose Email by AI 2024-11-29 21:36:41 +01:00
lib-commonjs First version with simple frontend and Compose Email by AI 2024-11-29 21:36:41 +01:00
CHANGELOG.md First version with simple frontend and Compose Email by AI 2024-11-29 21:36:41 +01:00
LICENSE First version with simple frontend and Compose Email by AI 2024-11-29 21:36:41 +01:00
package.json First version with simple frontend and Compose Email by AI 2024-11-29 21:36:41 +01:00
README.md First version with simple frontend and Compose Email by AI 2024-11-29 21:36:41 +01:00

@fluentui/react-radio

React Radio components for Fluent UI React

A Radio allows a user to select a single value from two or more options. All Radios with the same name are considered to be part of the same group. However, a RadioGroup is recommended to add a group label, formatting, and other functionality.

Usage

Import Radio and RadioGroup:

// From @fluentui/react-components
import { Radio, RadioGroup } from '@fluentui/react-components';

// Directly from @fluentui/react-radio
import { Radio, RadioGroup } from '@fluentui/react-radio';

Examples

<RadioGroup defaultValue="B">
  <Radio value="A" label="Option A" />
  <Radio value="B" label="Option B" />
  <Radio value="C" label="Option C" />
  <Radio value="D" label="Option D" />
</RadioGroup>

<RadioGroup value={value} onChange={(_, data) => setValue(data.value)}>
  <Radio value="A" label="Option A" />
  <Radio value="B" label="Option B" />
  <Radio value="C" label="Option C" />
  <Radio value="D" label="Option D" />
</RadioGroup>

See Fluent UI Storybook for more detailed usage examples.

Alternatively, run Storybook locally with:

  1. yarn start
  2. Select react-radio from the list.

Specification

See Spec.md.