co-tags-field

Campo de etiquetas de texto libre: escribe un valor y pulsa Enter, Tab o coma para añadirlo como chip. Backspace borra el último chip y el doble clic edita uno en línea. Es el renderer de campos de esquema con tipo array de primitivos. El value es un array JSON de strings.

Demo

Ver código

<co-tags-field label="Etiquetas" placeholder="Escribe y pulsa Enter" value='["alpha","beta"]' clearable></co-tags-field>

API

Props

Prop	Atributo	Tipo	Default	Descripción
`allowDuplicates`	`allow-duplicates`	`boolean`	`false`	Allow the same value to be added more than once.
`clearable`	`clearable`	`boolean`	`true`
`disabled`	`disabled`	`boolean`	`false`
`errorMessage`	`error-message`	`string \| undefined`	`—`	Message shown when invalid.
`helperText`	`helper-text`	`string \| undefined`	`—`	Helper text shown when valid.
`invalid`	`invalid`	`boolean`	`false`	External invalid flag (e.g. from a form controller).
`label`	`label`	`string \| undefined`	`—`
`layout`	`layout`	`"horizontal" \| "vertical"`	`'vertical'`	Label layout: vertical (label above) or horizontal (label beside)
`maxTags`	`max-tags`	`number \| undefined`	`—`	Maximum number of tags allowed (no cap when undefined).
`name`	`name`	`string \| undefined`	`—`
`placeholder`	`placeholder`	`string`	`''`
`readonly`	`readonly`	`boolean`	`false`
`required`	`required`	`boolean`	`false`
`size`	`size`	`"lg" \| "md" \| "s" \| "sm"`	`'md'`	Field size (mirrors co-input): s 28 / sm 32 / md 40 / lg 48.
`value`	`value`	`string \| string[]`	`'[]'`	Committed value as a JSON array of strings (or an actual `string[]`).

Eventos

Evento	Detail	Bubbles	Cancelable	Descripción
`coBlur`	`void`	✓	✓
`coChange`	`string[]`	✓	✓	Emitted with the full array on every add/edit/remove/clear.
`coClear`	`void`	✓	✓	Emitted when the clear-all button is clicked.
`coFocus`	`void`	✓	✓
`coInput`	`string`	✓	✓	Emitted on every keystroke of the inline input with the raw text.

Slots

Este componente no expone slots.

CSS Parts

Part	Descripción
`::part(clear)`	The clear-all button
`::part(field)`	The bordered chip+input row
`::part(helper)`	The helper/error text row
`::part(input)`	The native text input
`::part(label)`	The field label
`::part(wrapper)`	Root container

CSS Custom Properties

Este componente no expone CSS custom properties.