@mantine/core/lib/components/Menubar/Menubar.d.ts

React components library focused on usability, accessibility and developer experience

import { BoxProps, ElementProps, Factory, StylesApiProps } from '../../core';
import { FloatingPosition } from '../../utils/Floating';
import { MenubarDropdown, type MenubarDropdownProps } from './MenubarDropdown/MenubarDropdown';
import { MenubarMenu, type MenubarMenuProps } from './MenubarMenu/MenubarMenu';
import { MenubarTarget, type MenubarTargetProps } from './MenubarTarget/MenubarTarget';
export type MenubarStylesNames = 'root' | 'target';
export type MenubarFactory = Factory<{
    props: MenubarProps;
    ref: HTMLDivElement;
    stylesNames: MenubarStylesNames;
    staticComponents: {
        Menu: typeof MenubarMenu;
        Target: typeof MenubarTarget;
        Dropdown: typeof MenubarDropdown;
    };
}>;
export interface MenubarProps extends BoxProps, StylesApiProps<MenubarFactory>, ElementProps<'div'> {
    /** `Menubar.Menu` components */
    children?: React.ReactNode;
    /** Index of the controlled opened menu, `null` closes all menus */
    openIndex?: number | null;
    /** Index of the opened menu for uncontrolled component @default `null` */
    defaultOpenIndex?: number | null;
    /** Called when the opened menu changes with its index or `null` when all menus are closed */
    onOpenChange?: (index: number | null) => void;
    /** Event that opens a menu when none of the menus is opened. `'click'` opens a menu on target click and then switches menus on hover (desktop application pattern), `'hover'` opens a menu when the target is hovered @default `'click'` */
    trigger?: 'click' | 'hover';
    /** If set, arrow key navigation wraps from last to first menu and vice versa @default `true` */
    loop?: boolean;
    /** Dropdown position relative to the target element @default `'bottom-start'` */
    position?: FloatingPosition;
}
export declare const Menubar: import("../..").MantineComponent<{
    props: MenubarProps;
    ref: HTMLDivElement;
    stylesNames: MenubarStylesNames;
    staticComponents: {
        Menu: typeof MenubarMenu;
        Target: typeof MenubarTarget;
        Dropdown: typeof MenubarDropdown;
    };
}>;
export declare namespace Menubar {
    type Props = MenubarProps;
    type StylesNames = MenubarStylesNames;
    type Factory = MenubarFactory;
    namespace Menu {
        type Props = MenubarMenuProps;
    }
    namespace Target {
        type Props = MenubarTargetProps;
    }
    namespace Dropdown {
        type Props = MenubarDropdownProps;
    }
}