npm i @velkin/react
import { VuList } from "@velkin/react/list";Tables match the member selected under Import.
| Prop | Type | Default | Description |
|---|---|---|---|
| selection | VuListSelectionMode | "none" | Selection mode for child rows. Default: `"none"`. |
| selectedValues | string[] | — | Controlled selection tokens; omit for uncontrolled mode. |
| defaultSelectedValues | string[] | [] | Initial selection when uncontrolled. Default: `[]`. |
| size | VuListSize | "md" | Default row density. Default: `"md"`. |
| tone | VuListTone | "normal" | Neutral surface weight for the list shell. Default: `"normal"`. |
| dense | boolean | false | Compact rows on the list and items. Default: `false`. |
| autofocus | boolean | false | Focuses the first row after first render. Default: `false`. |
| ariaLabel | string | "" | Accessible name when there is no visible list label. Default: `""`. |
| Event | Detail | Description |
|---|---|---|
| vu-change | VuListChangeDetail | When selection changes (`detail.selectedValues`). |
| Slot | Description |
|---|---|
| — | - Default slot for `<vu-listitem>` children. |
| Part | Description |
|---|---|
| base | Bordered list surface wrapping the default slot. |
| Method | Description |
|---|---|
| focusListItem | - Focuses a focusable item by index among non-subheader rows. |
| getItems | - Returns slotted `<vu-listitem>` instances in document order. |
| handleRowKeydown | - Keyboard handler invoked by each row (internal). |
| Name | Definition |
|---|---|
| VuListChangeDetail | |
| VuListSelectionMode | |
| VuListSize | |
| VuListTone | |