Norsk Tipping Design System

RadioList

Install

yarn add @ntds/radio

Import

import { RadioList } from '@ntds/radio';

Props

PropTypeDefaultDescription
namestringThe name for the list of radios. This prop will be propagated to each radio element
valuestringThe value of the checked radio
horizontal?booleanIf the RadioList should be displayed horizontally
labelPosition?"right" | "bottom"rightPosition of label
errorMessagestring | ((id: string) => ReactNode)Mark the input as invalid both visually and semantically Given as a `string`: Will render the message inside a Message component under the RadioList Will not use aria-live Given as a `ReactNode`: Will render the content with margin dictated by the RadioList Use the `Message` component from @ntds /message
hasError?booleanToggle an errormessage below the RadioList
onChange(value: string) => voidA callback that gets triggered when a radio is clicked
childrenReactNodeUsually simple text, but can be anything

On this page