MarovStudio
Back to marketplace

Dropdown Menu

Menu that closes on outside click and Escape

Overlaysdropdownmenuselectlistboxoutside-click
Code locked
"use client";

import { Check, ChevronDown } from "lucide-react";
import { useEffect, useRef, useState } from "react";

export function DropdownMenu() {
  const [open, setOpen] = useState(false);
  const [choice, setChoice] = useState("Newest first");

Sign in to see the code

Create a free account to copy the full source, usage snippet and AI prompt of every component.

Free — no card required.

Related components

Trigger a toast above.

Toast Stack

Overlays · Toast notifications in three tones

Delete this project?

This cannot be undone. Everything inside it goes with it.

Modal Dialog

Overlays · Modal built on the browser native dialog element

Keyboard focus shows it tooKeyboard focus shows it too

Tooltip

Overlays · Tooltip on hover and on keyboard focus