ds-svelte-community
Nais Docs
Pages
  • Home
  • CSS
  • Icons
Typography
  • BodyLong
  • BodyShort
  • Detail
Components
  • Accordion
  • ActionMenu Beta
  • Alert
  • Button
  • Checkbox
  • Chips
  • ConfirmationPanel
  • CopyButton
  • ErrorSummary
  • ExpansionCard
  • GuidePanel
  • HelpText
  • InternalHeader Beta
  • List
  • Loader
  • Modal
  • Pagination
  • Popover
  • Radio
  • ReadMore
  • Search
  • Select
  • Skeleton
  • Stepper
  • Switch
  • Table
  • Tabs
  • Tag
  • TextField
  • ToggleGroup
  • Tooltip
Primitives
  • Bleed
  • Box

Version: 1.0.0
Try dark darkside
Try light darkside

ToggleGroup

ToggleGroup lets the user make choices that affect the content of the page. The component consists of a group of buttons that are connected and only one button can be selected at a time.

Read more about this component in the Aksel documentation.

    Default With icons Only icons

Properties

ToggleGroup

PropertyDescriptionDefault
Control
Properties
value
required bindable

Controlled selected value.

string
-
label

Label describing ToggleGroup.

string
""
size

Changes padding and font-size.

"medium" "small"
"medium"
variant

Changes design and interaction-visuals.

"action" "neutral"
"action"
Snippets
children

List of ToggleGroupItem.

 -
Events
onchange

Callback when value changes.

 -

Properties included from: Omit<HTMLAttributes<HTMLDivElement>, "onchange">

ToggleGroupItem

PropertyDescriptionDefault
Control
Properties
value
required

Value of this tab.

string
-
Snippets
children

Label of this tab.

 -

Properties included from: HTMLButtonAttributes