import React from "react"; import { type DialogOffset, type DialogPosition, type DialogSize, type DialogStartingEdge, type DialogTriggerEvent } from "@vibe/dialog"; import { type TooltipProps } from "@vibe/tooltip"; import { type ElementContent, type VibeComponentProps } from "../../types"; import { type MenuButtonComponentPosition, type MenuButtonSize } from "./MenuButton.types"; import { type TooltipPositions } from "@vibe/tooltip"; export interface MenuButtonProps extends VibeComponentProps { /** * If true, the button is in an active state. */ active?: boolean; /** * Class name applied to the button when the dialog is open. */ openDialogComponentClassName?: string; /** * The component used as the button icon. */ component?: (() => JSX.Element) | React.ElementType; /** * The size of the button. */ size?: MenuButtonSize; /** * If true, the menu is open. */ open?: boolean; /** * Callback fired when the button is clicked. */ onClick?: (event: React.MouseEvent) => void; /** * The z-index of the menu. */ zIndex?: number; /** * The label of the button for accessibility. */ "aria-label"?: string; /** * Class name applied to the menu dialog wrapper. */ dialogClassName?: string; /** * The offset of the menu relative to the button. */ dialogOffset?: DialogOffset; /** * The padding size inside the menu dialog. */ dialogPaddingSize?: DialogSize; /** * The position of the menu dialog relative to the button. */ dialogPosition?: DialogPosition; /** * Classes that prevent showing the dialog when present. */ dialogShowTriggerIgnoreClass?: string | Array; /** * Classes that prevent hiding the dialog when present. */ dialogHideTriggerIgnoreClass?: string | Array; /** * The container selector in which to append the dialog. */ dialogContainerSelector?: string; /** * The starting edge alignment of the menu. */ startingEdge?: DialogStartingEdge; /** * Callback fired when the menu is shown. */ onMenuShow?: () => void; /** * Callback fired when the menu is hidden. */ onMenuHide?: () => void; /** * The text displayed inside the button. */ text?: string; /** * If true, the button is disabled. */ disabled?: boolean; /** * The tooltip content displayed when hovering over the button. */ tooltipContent?: string; /** * If true, removes the tab key from the hide trigger. */ removeTabCloseTrigger?: boolean; /** * The triggers that cause the tooltip to show or hide. */ tooltipTriggers?: DialogTriggerEvent | DialogTriggerEvent[]; /** * The position of the tooltip. */ tooltipPosition?: TooltipPositions; /** * Class name applied to the tooltip reference wrapper. */ tooltipReferenceClassName?: string; /** * Additional props for customizing the tooltip. */ tooltipProps?: Partial; /** * If true, hides the menu and tooltip when the button is not visible. */ hideWhenReferenceHidden?: boolean; /** * The content inside the menu button. */ children?: ElementContent; /** * The position of the component relative to the text. */ componentPosition?: MenuButtonComponentPosition; /** * The element used as the trigger for the menu. */ triggerElement?: React.ElementType; /** * If true, closes the menu when a menu item is clicked. */ closeMenuOnItemClick?: boolean; /** * If true, the tooltip appears only when hovering over the trigger element, not the menu dialog. */ showTooltipOnlyOnTriggerElement?: boolean; /** * If true, closes the menu when clicking inside the dialog. */ closeDialogOnContentClick?: boolean; /** * The ARIA control of the menu button for accessibility. */ "aria-controls"?: string; } declare const MenuButton: React.ForwardRefExoticComponent>; export default MenuButton;