TagInput

Molecule

Enter veya virgülle tag ekleme, çift tıkla düzenleme, Backspace ile silme. Duplicate eklenmez. Controlled string[] modeli.

Default

Preview
next.jsreact

Press Enter or comma to add. Double-click to edit.

Code
const [tags, setTags] = useState(['next.js', 'react']);
<TagInput id="tags" label="Tags" value={tags} onChange={setTags} hint="Press Enter or comma to add." />

Empty / Error

Preview
Code
<TagInput id="tags" label="Required tags" value={[]} onChange={setTags} error="At least one tag is required." />
Sourcemodules/ui/TagInput.tsx