TagInput

Free-form tags: Enter, comma or paste; validation and duplicate control.

@ruckc/truss-ui Choice

Import

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

Prop	Type	Default	Description
`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 a tag…'`	Hint shown while the field is empty.
`separators`	`string[]`	`[',', 'Enter']`	Keys (or typed characters) that commit the current text. Pasted text is also split on commas/newlines.
`allowDuplicates`	`boolean`	`false`	Permit the same tag more than once.
`validate`	`(tag: string) => string \| undefined`	—	Return an error string to reject a 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.