Dropdown (Radix UI)

"use client";

import * as React from "react";
import {
  Dropdown,
  DropdownContent,
  DropdownItem,
  DropdownTrigger,
  DropdownValue,
} from "@/components/ui/r-dropdown";

export default function DropdownDemo() {
  return (
    <div className="flex min-h-[220px] w-full items-center justify-center p-10">
      <div className="w-64">
        <Dropdown defaultValue="next">
          <DropdownTrigger>
            <DropdownValue placeholder="Select a framework" />
          </DropdownTrigger>
          <DropdownContent className="w-full">
            <DropdownItem value="next">Next.js</DropdownItem>
            <DropdownItem value="remix">Remix</DropdownItem>
            <DropdownItem value="astro">Astro</DropdownItem>
            <DropdownItem value="nuxt">Nuxt</DropdownItem>
          </DropdownContent>
        </Dropdown>
      </div>
    </div>
  );
}