MultiSelect

Tags with autocomplete, async options and on-the-fly creation.

@ruckc/truss-ui Choice

Import

import { MultiSelect } from '@ruckc/truss-ui';

Prop	Type	Default	Description
`options`	`Option[]`	`[]`	The choices to offer.
`loadOptions`	`(query: string, signal: AbortSignal) => Promise<Option[]>`	—	Async source of options: receives the query and an `AbortSignal`, returns the matching options.
`value` bindable	`string[]`	`[]`	The current value. Bind it with `bind:value`.
`label`	`string`	—	Visible label shown above the control.
`ariaLabel`	`string`	—	Accessible name when no visible `label` is shown.
`placeholder`	`string`	`'Add…'`	Hint shown while the field is empty.
`allowCreate`	`boolean`	`false`	Offer `Create "text"`; Enter or comma commits free text as a new tag.
`disabled`	`boolean`	`false`	Disables the control: it cannot be focused, changed or activated.
`error`	`string`	—	Error message. Marks the control invalid, replaces the hint, and is announced to assistive technology.
`debounce`	`number`	`200`	Milliseconds to wait after typing before querying `loadOptions`.