Norsk Tipping Design System

RadioList

Install

yarn add @ntds/checkbox

Import

import { CheckboxList } from '@ntds/checkbox';

Props

PropTypeDefaultDescription
name?stringThe name of the Checkbox.
valuestring[]The current state of the checkboxesc
setValue(value: string[]) => voidPass your setter from useState() directly here.
horizontal?booleanIf the CheckboxList should be displayed horizontally
errorMessage?string | ((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 CheckboxList Will not use aria-live Given as a `ReactNode`: Will render the content with margin dictated by the CheckboxList Use the `Message` component from @ntds /message
hasError?booleanToggle an errormessage below the CheckboxList
onChange?(event: ChangeEvent<HTMLInputElement, Element>) => voidA callback that gets triggered when a checkbox is clicked
childrenReactNodeUsually simple text, but can be anything

On this page