Storybook

Action List

Action list is a vertical list of interactive actions or options. It's composed of items presented in a consistent. single-column format, with room for icons, descriptions, side information, and other rich visuals.

Form: single select

Interactive
Selected: -

Form: multiple select

Interactive
Selected: -

Basic action list

  • Item
  • Item
  • Item

With separators

  • Item
  • Item
  • Item

Common attributes

  • Descructive item
  • Disabled item
  • A very long text abbreviated by ellipsis

Heights

  • Regular
  • Medium
  • Large

Links

Leading visual

  • Item
  • Item
  • Item

Trailing visual

  • Item 12

Leading and trailing visual

  • Item 12

Selected states

Description

  • Item Description
  • Item Description

Description inline

  • Item Description
  • Item Description

Section divider

  • Item
  • Item

Section divider, filled

  • Item
  • Item

Section divider with title

  • Item
  • Title

  • Item

Section divider with title, filled

  • Item
  • Title

  • Item

Section divider with title and description

  • Item
  • Title

    A descriptive text
  • Item

Single select

  • Option
  • Option
  • Option

Single select with custom leading visual

  • Option
  • Option
  • Option

Single select with selected link marker

  • Option
  • Option
  • Option

Multiple select

  • Option
  • Option
  • Option

Multiple select with custom leading visual

Uses leading_visual slot.
  • Option
  • Option
  • Option

Multiple select with checkmark icons

Uses attribute is_checkmark_icon.
  • Option
  • Option
  • Option

Multiple select with link marker

Uses attribute is_selected_link_marker.
  • Option
  • Option
  • Option

Sub group

  • Section title

    • Sub item
    • Sub item
  • Section title

    • Sub item
    • Sub item
  • Section title

    • Sub item
    • Sub item