Back to Components

macOS

SourceList

Finder-style sidebar list with icons / labels / counts and grouped headings. The classic macOS sidebar pattern.

Examples

Library + Smart lists

<SourceList items={[
  {type: 'heading', label: 'Library'},
  {value: 'library', label: 'All Books', count: 1204},
  ...
]} bind:value />

Props

PropTypeDefaultDescription
itemsSourceItem[]Headings or selectable rows.
valueTBindable selected value.
onSelect(v: T) => voidFires when a row is picked.

Install

CLI

npx @a3tai/mittsu add source-list