Tags Input

1import { TagsInputContext, TagsInput, TagsInputControl, TagsInputItem } from "@/components/ui/tags-input";
2
3<TagsInputContext />

1"use client";
2
3import {
4  TagsInput as ArkTagsInput,
5  useTagsInput as useArkTagsInput,
6  useTagsInputContext as useArkTagsInputContext,
7} from "@ark-ui/react/tags-input";
8import { XIcon } from "lucide-react";
9import type React from "react";
10import { cn } from "@/lib/utils";
11import {
12  InputGroup,
13  InputGroupButton,
14  InputGroupInput,
15  type InputGroupProps,
16} from "@/registry/react/components/input-group";
17
18export const useTagsInput = useArkTagsInput;
19export const useTagsInputContext = useArkTagsInputContext;
20export const TagsInputContext = ArkTagsInput.Context;
21
22interface TagsInputProps
23  extends React.ComponentProps<typeof ArkTagsInput.Root>,
24    Pick<InputGroupProps, "size"> {
25  /**
26   * Whether to show the clear button.
27   *
28   * @default true