Props

Prop:

label

Type:

string

Beskrivelse:

Ledetekst for gruppen. Blir til legend i fieldset

Prop:

helptext?

Type:

string

Beskrivelse:

Hjelpetekst over alternativene

Prop:

helptextDropdown?

Type:

string

Beskrivelse:

Hjelpetekst som vises når brukeren åpner «Les mer»

Prop:

helptextDropdownButton?

Status:

DeprecatedBruk strings={{ forms: { readMore: '…' } }} eller setPktStrings().

Type:

string

Beskrivelse:

Tekst på «Les mer»-knappen

Prop:

id?

Type:

string

Beskrivelse:

ID for gruppen. Brukes også som navn på alternativene når name mangler

Prop:

name?

Type:

string

Beskrivelse:

Gis til alternativer som ikke har eget name. Uten name brukes id, og uten den et generert navn

Prop:

value?

Type:

string

Beskrivelse:

Verdien til valgt alternativ, som RadioNodeList.value. Tom streng når ingen er valgt, on for et alternativ uten value. Å sette verdien fra kode fyrer ingen events. Gruppeelementet er skjemafeltet, så value, name og focus() finnes også på elementet (Elements) og på ref (React)

Prop:

defaultValue?

Type:

string

Beskrivelse:

Verdien som er valgt fra start i en ukontrollert gruppe. Skjema-reset går tilbake hit

Prop:

layout?

Type:

"vertical" | "horizontal"

Standardverdi:

"vertical"

Beskrivelse:

Retning for alternativene. Avstanden mellom dem følger størrelsen (16, 12 og 8px)

Prop:

inputSize?

input-size?

Type:

"xsmall" | "small" | "medium"

Standardverdi:

"medium"

Beskrivelse:

Størrelse på gruppen. Alternativene arver den, med mindre de har egen størrelse

Prop:

hasTile?

Type:

boolean

Standardverdi:

false

Beskrivelse:

Viser alle alternativene som tile. Et alternativ kan slå på tile selv, men ikke slå det av når gruppen har slått det på

Prop:

required?

Type:

boolean

Standardverdi:

false

Beskrivelse:

Gjør hele gruppen påkrevd, som required på én radio i HTML. Kravet er oppfylt når ett alternativ er valgt

Prop:

disabled?

Type:

boolean

Standardverdi:

false

Beskrivelse:

Deaktiverer alle alternativene, som <fieldset disabled>. Kan ikke overstyres på et enkelt alternativ

Prop:

hasError?

Type:

boolean

Standardverdi:

false

Beskrivelse:

Viser feiltilstand på gruppen og alle alternativene

Prop:

errorMessage?

Type:

string

Beskrivelse:

Vises under alternativene når hasError er satt

Prop:

useWrapper?

Type:

boolean

Standardverdi:

true

Beskrivelse:

Skjuler ledetekst og hjelpetekst visuelt når den er av. Gruppen beholder navnet sitt for skjermlesere

Prop:

requiredTag?

Type:

boolean

Standardverdi:

false

Beskrivelse:

Viser en merking som indikerer at gruppen er påkrevd

Prop:

requiredText?

Status:

DeprecatedBruk strings={{ forms: { required: '…' } }} eller setPktStrings().

Type:

string

Beskrivelse:

Tekst som vises i påkrevd-merkingen

Prop:

optionalTag?

Type:

boolean

Standardverdi:

false

Beskrivelse:

Viser en merking som indikerer at gruppen er valgfri

Prop:

optionalText?

Status:

DeprecatedBruk strings={{ forms: { optional: '…' } }} eller setPktStrings().

Type:

string

Beskrivelse:

Tekst som vises i valgfritt-merkingen

Prop:

tagText?

Type:

string

Beskrivelse:

Tekst som vises i en tag ved siden av ledeteksten

Slots

Slot:

default

Beskrivelse:

PktRadioButton / pkt-radiobutton

Slot:

helptext

Beskrivelse:

Hjelpetekst med markup (Elements)

Events

Event:

change

Type:

Event

Beskrivelse:

Fyres av gruppen når brukeren velger et alternativ. Skjemafeltet er gruppen: event.target er gruppen, med name og value (gruppens verdi, verdien til valgt radio (streng)). Alternativenes egne events stopper ved gruppen

Event:

input

Type:

InputEvent

Beskrivelse:

Fyres av gruppen rett før change, med verdien allerede oppdatert

Event:

value-change

Type:

CustomEvent

Beskrivelse:

Gruppens nye verdi i detail

Event:

focus

Type:

FocusEvent

Beskrivelse:

Når fokus kommer inn i gruppen. Fyres ikke når fokus flytter seg mellom alternativene

Event:

blur

Type:

FocusEvent

Beskrivelse:

Når fokus forlater gruppen. Fyres ikke når fokus flytter seg mellom alternativene

Event:

onChange

Type:

Event

Beskrivelse:

Kalles når brukeren velger et alternativ. Skjemafeltet er gruppen: event.target er gruppen, med name og value (gruppens verdi, verdien til valgt radio (streng)). Fungerer med register og Controller i React Hook Form

Event:

onValueChange

Type:

string

Beskrivelse:

Kalles med gruppens nye verdi når brukeren velger et alternativ

Event:

onFocus

Type:

FocusEvent

Beskrivelse:

Når fokus kommer inn i gruppen, ikke mellom alternativene

Event:

onBlur

Type:

FocusEvent

Beskrivelse:

Når fokus forlater gruppen, ikke mellom alternativene

Props

Prop:

id

Type:

string

Beskrivelse:

Unik ID for radiobutton

Prop:

name?

Type:

string

Beskrivelse:

Navn for radiobutton. Hvis inni en PktRadioGroup, og name ikke er satt, så vil name arves fra PktRadioGroup. Radioer med samme navn hører sammen

Prop:

form?

Type:

string

Beskrivelse:

ID-en til skjemaet feltet hører til, når feltet ligger utenfor skjemaet

Prop:

label

Type:

string

Beskrivelse:

Tekst i label for radiobutton

Prop:

checked?

Type:

boolean

Standardverdi:

false

Beskrivelse:

Er radiobutton valgt?

Prop:

defaultChecked?

Type:

boolean

Standardverdi:

false

Beskrivelse:

Skal radiobutton være valgt som standard?

Prop:

hasTile?

Type:

boolean

Standardverdi:

false

Beskrivelse:

Boks (tile)

Prop:

inputSize?

input-size?

Type:

"xsmall" | "small" | "medium"

Beskrivelse:

Størrelse på tekst, hjelpetekst og tile. Uten verdi arves størrelsen fra input-wrapperen rundt

Prop:

disabled?

Type:

boolean

Standardverdi:

false

Beskrivelse:

Er radiobutton deaktivert?

Prop:

checkHelptext?

Type:

string

Beskrivelse:

Hjelpetekst som vises under radiobutton

Prop:

value?

Type:

string

Beskrivelse:

Verdien som sendes når radiobutton er valgt

Prop:

hasError?

Type:

boolean

Standardverdi:

false

Beskrivelse:

Indikerer om radiobutton har en feil

Prop:

requiredTag?

Type:

boolean

Standardverdi:

false

Beskrivelse:

Viser en merking som indikerer at feltet er påkrevd

Prop:

requiredText?

Status:

DeprecatedBruk strings={{ forms: { required: '…' } }} eller setPktStrings().

Type:

string

Beskrivelse:

Tekst som vises i påkrevd-merkingen

Prop:

optionalTag?

Type:

boolean

Standardverdi:

false

Beskrivelse:

Viser en merking som indikerer at feltet er valgfritt

Prop:

optionalText?

Status:

DeprecatedBruk strings={{ forms: { optional: '…' } }} eller setPktStrings().

Type:

string

Beskrivelse:

Tekst som vises i valgfritt-merkingen

Prop:

tagText?

Type:

string

Beskrivelse:

Tekst som vises i en tag ved siden av label

Events

Event:

change

Type:

—

Beskrivelse:

Hendelse som utløses når radiobutton endres