Components

TagInput

Multi-value input: chips instead of a string, with clipboard paste parsing.

Multi-value input: chips instead of a comma-separated string. Labels, addresses, identifiers. Enter and comma add a value; Backspace in an empty field removes the last chip.

Example

bugui

Вставьте a, b; c из буфера — разложится на отдельные метки, повторы отсеются.

Props

Prop	Type	Default	Description
`value / onChange`*	`string[] / (tags) => void`	—	The list of values.
`max`	`number`	—	The maximum count.
`caseInsensitive`	`boolean`	`true`	«Bug» and «bug» are the same value.
`validate`	`(value) => boolean`	—	A check: false rejects the value.
`separators`	`string[]`	—	Separators used when parsing a paste. Comma, semicolon and newline by default.
`onReject`	`(value, reason) => void`	—	A rejected value: duplicate \| invalid \| limit.
`name`	`string`	—	A hidden field — to submit the tags with an ordinary form.

value / onChange*string[] / (tags) => void

The list of values.

maxnumber

The maximum count.

caseInsensitiveboolean

defaults to: true

«Bug» and «bug» are the same value.

validate(value) => boolean

A check: false rejects the value.

separatorsstring[]

Separators used when parsing a paste. Comma, semicolon and newline by default.

onReject(value, reason) => void

A rejected value: duplicate | invalid | limit.

namestring

A hidden field — to submit the tags with an ordinary form.

The parsing, separately

tsx

import {
  addTags,       // add, filtering duplicates, blanks and anything over the limit
  splitTags,     // split a pasted string by the separators
  normalizeTag,  // trim whitespace and surrounding quotes
} from "@toimetdev/pathlogs-core";