Hopp til innhold
Aksel
  • God praksis
  • Grunnleggende
  • Ikoner
  • Komponenter
  • Bloggen

Meny

  • God praksis
  • Grunnleggende
  • Ikoner
  • Komponenter
  • Blogg
    • Box
    • HGrid
    • Hide
    • HStack
    • Show
    • VStack
    • Accordion
    • Alert
    • Button
    • Chat
    • Checkbox
    • Chips
    • Combobox
    • ConfirmationPanel
    • CopyButton
    • DatePicker
    • Dropdown
    • ErrorSummary
    • ExpansionCard
    • GuidePanel
    • HelpText
    • InternalHeader
    • Link
    • LinkPanel
    • List
    • Loader
    • Modal
    • MonthPicker
    • Pagination
    • Panel
    • Popover
    • Provider
    • Radio
    • ReadMore
    • Search
    • Select
    • Skeleton
    • Stepper
    • Switch
    • Table
    • Tabs
    • Tag
    • Textarea
    • TextField
    • Timeline
    • ToggleGroup
    • Tooltip
    • Typography
    • StepIndicator
    • CopyToClipboard
Komponenter / Core

ConfirmationPanel

Oppdatert 4. august 2023Stabil
GithubYarn FigmaEndringslogg

    Intro

    Brukes til å gi aktivt samtykke enten i begynnelsen eller slutten av en flyt.

    Egnet til:

    • La brukeren gi aktivt samtykke

    Har du innspill til komponenten?

    Send forslag

    Eksempler

    Åpne eksempel i nytt vindu

    Tilgjengelighet

    Tastaturinteraksjon

    KommandoInteraksjon
    TabFlytter fokus til den valgte checkboxen
    Shift+TabFlytter fokus til element før checkboxen i tabindex
    SpaceHake av/fjerne avhakning

    Props

    ConfirmationPanel

    children? ReactNode
    Additional information on panel
    label ReactNode
    Checkbox label
    error? ReactNode
    Error message for element
    errorId? string
    Override internal errorId
    className? string
    size? "medium" | "small"
    Changes font-size, padding and gaps
    value? any
    The value of the HTML element.
    disabled? boolean
    Disables element @note Avoid using if possible for accessibility purposes
    id? string
    Override internal id
    description? string
    Adds a description to extend labling of Checkbox
    ref? Ref<HTMLInputElement>
    Allows getting a ref to the component instance. Once the component unmounts, React will set `ref.current` to `null` (or call the ref with `null` if you passed a callback ref). @see https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom
    ConfirmationPanel extends HTMLInputElement

    Tokens

    TokenFallback
    --ac-confirmation-panel-border--a-border-warning
    --ac-confirmation-panel-bg--a-surface-warning-subtle
    --ac-confirmation-panel-checked-border--a-border-success
    --ac-confirmation-panel-checked-bg--a-surface-success-subtle
    --ac-confirmation-panel-error-border--a-border-danger
    --ac-confirmation-panel-error-bg--a-surface-danger-subtle
    Hva er dette?

    Komponent-tokens gir deg muligheten til å sette opp theming eller justere styling uten å måtte overskrive css-klasser. Les gjennom guiden vår eller utforsk alle design tokens.

    © 2023 NAV

    Arbeids- og velferdsetaten

    Snarveier

    • Skriv for Aksel
    • Prinsipper for brukeropplevelse
    • Security Playbook
    • Etterlevelse

    Om nettstedet

    • Hva er Aksel?
    • Personvernerklæring
    • Tilgjengelighetserklæring

    Finn oss

    • Figma
    • Github
    • Slack