Split button

1"use client";2 3import { useEffect, useId, useRef, useState } from "react";4import { createPortal } from "react-dom";5import { ChevronDown } from "lucide-react";6 7export type SplitButtonItem = {8  id: string;9  label: string;10  shortcut?: string;11  disabled?: boolean;12  danger?: boolean;13};14 15export type SplitButtonProps = {16  label: string;17  onPrimary: () => void;18  items: SplitButtonItem[];19  menuLabel?: string;20  disabled?: boolean;21  align?: "start" | "end";22  onSelect?: (id: string) => void;23  className?: string;24};25 26/**27 * A primary action with a separate menu trigger. The menu is a floating28 * surface and keeps the same keyboard expectations as a menubutton.