Dropdown Menu

"use client";

import React from "react";
import { DropdownMenu } from "@/subframe/components/DropdownMenu";
import * as SubframeCore from "@subframe/core";
import { Button } from "@/subframe/components/Button";

function DropdownMenuExample() {
  return (
    <SubframeCore.DropdownMenu.Root>
      <SubframeCore.DropdownMenu.Trigger asChild={true}>
        <Button onClick={(event: React.MouseEvent<HTMLButtonElement>) => {}}>
          Dropdown Menu Button
        </Button>
      </SubframeCore.DropdownMenu.Trigger>
      <SubframeCore.DropdownMenu.Portal>
        <SubframeCore.DropdownMenu.Content
          side="bottom"
          align="start"
          sideOffset={4}
          asChild={true}
        >
          <DropdownMenu>
            <DropdownMenu.DropdownItem icon="FeatherStar">
              Favorite
            </DropdownMenu.DropdownItem>
            <DropdownMenu.DropdownItem icon="FeatherPlus">
              Add
            </DropdownMenu.DropdownItem>
            <DropdownMenu.DropdownItem icon="FeatherEdit2">
              Edit
            </DropdownMenu.DropdownItem>
            <DropdownMenu.DropdownItem icon="FeatherTrash">
              Delete
            </DropdownMenu.DropdownItem>
          </DropdownMenu>
        </SubframeCore.DropdownMenu.Content>
      </SubframeCore.DropdownMenu.Portal>
    </SubframeCore.DropdownMenu.Root>
  );
}

export default DropdownMenuExample;