Dropdown

Interactive dropdown components with customizable options, animations, and keyboard navigation support.

or get this with bundle

Installation

Quick guide to setup the component

1. Copy and paste this into the terminal to install the required dependencies.

Terminal

Copied!

npm i clsx tailwind-merge react-icons

npm i clsx tailwind-merge react-icons

2. Create /lib folder, then create the file utils.ts. Copy and paste this inside of it.

lib/utils.ts

Copied!

1import { ClassValue, clsx } from "clsx";
2import { twMerge } from "tailwind-merge";
3 
4export function cn(...inputs: ClassValue[]) {
5  return twMerge(clsx(inputs));
6}

1import { ClassValue, clsx } from "clsx";
2import { twMerge } from "tailwind-merge";
3 
4export function cn(...inputs: ClassValue[]) {
5  return twMerge(clsx(inputs));
6}