DocsIntroduction
Introduction
A highly customizable, accessible, and fully-featured tag input component built with shadcn/ui.
Run the CLI
Run the shadcn-ui init command and setup your project with Shadcn:
npx shadcn-ui@latest init
Installation
To install Tagmento, run the command:
npm install tagmento
Usage
To use Tagmento in your project, import the components you need and start using them in your application.
import { TagInput } from 'tagmento';
const [tags, setTags] = React.useState<Tag[]>([]);
const [activeTagIndex, setActiveTagIndex] = React.useState<number | null>(null);
<TagInput
{...field}
placeholder="Enter a topic"
tags={tags}
setTags={(newTags) => {
setTags(newTags);
setValue('topics', newTags as [Tag, ...Tag[]]);
}}
activeTagIndex={activeTagIndex}
setActiveTagIndex={setActiveTagIndex}
/>;
Thats it!
You have successfully integrated Tagmento into your project. 🎉