Mentions Input

Текст с @упоминаниями и #тегами, асинхронные подсказки. Pro · Формы и ввод › Текст

Установка

npx valyro-cli@latest login
npx valyro-cli@latest add mentions-input

npm install valyro-ui-pro

import 'valyro-ui-pro/styles.css';
import { MentionsInput } from 'valyro-ui-pro';

Prop	Type	Default
`value`	`string`		Markup: plain text with mentions written as `@[Display name](id)`.
`defaultValue`	`string`	`''`	Initial `value` when uncontrolled.
`onValueChange`	`(value: string, details: MentionsInputDetails) => void`		Called with the new `value` when it changes.
`triggers`	`string[]`	`['@', '#']`	Characters that start a mention (default `@` and `#`).
`onSearch` *	`(query: string, trigger: string) => MentionOption[] \| Promise<MentionOption[]>`		Suggestions for the text typed after a trigger; may be async.
`minRows`	`number`	`3`	Rows shown before the field grows (default 3).
`maxRows`	`number`	`8`	Rows the field grows to before it scrolls (default 8).
`invalid`	`boolean`	`false`	Error border and aria-invalid on the textarea (an explicit `aria-invalid` wins).
`labels`	`Partial<MentionsInputLabels>`		Overrides for the built-in English text; keys left out keep their defaults.