@arolariu/components/dist/components/ui/menubar.d.ts

🎨 70+ beautiful, accessible React components built on Base UI. TypeScript-first, CSS Modules styling, tree-shakeable, SSR-ready. Perfect for modern web apps, design systems & rapid prototyping. Zero config, maximum flexibility! ⚡

import { Menu as BaseMenu } from "@base-ui/react/menu";
import { Menubar as BaseMenubar } from "@base-ui/react/menubar";
import { useRender } from "@base-ui/react/use-render";
import * as React from "react";
interface MenubarSubTriggerProps extends Omit<React.ComponentPropsWithRef<typeof BaseMenu.SubmenuTrigger>, "className"> {
    /**
     * Applies additional CSS classes to the component root element.
     * @default undefined
     */
    className?: string;
    /**
     * Applies inset spacing to align nested content.
     * @default false
     */
    inset?: boolean;
}
interface MenubarContentProps extends Omit<React.ComponentPropsWithRef<typeof BaseMenu.Positioner>, "className"> {
    /**
     * Applies additional CSS classes to the component root element.
     * @default undefined
     */
    className?: string;
}
interface MenubarItemProps extends Omit<React.ComponentPropsWithRef<typeof BaseMenu.Item>, "className"> {
    /**
     * Applies additional CSS classes to the component root element.
     * @default undefined
     */
    className?: string;
    /**
     * Applies inset spacing to align nested content.
     * @default false
     */
    inset?: boolean;
}
interface MenubarCheckboxItemProps extends Omit<React.ComponentPropsWithRef<typeof BaseMenu.CheckboxItem>, "className"> {
    /**
     * Applies additional CSS classes to the component root element.
     * @default undefined
     */
    className?: string;
}
interface MenubarRadioItemProps extends Omit<React.ComponentPropsWithRef<typeof BaseMenu.RadioItem>, "className"> {
    /**
     * Applies additional CSS classes to the component root element.
     * @default undefined
     */
    className?: string;
}
interface MenubarLabelProps extends Omit<React.ComponentPropsWithRef<typeof BaseMenu.GroupLabel>, "className"> {
    /**
     * Applies additional CSS classes to the component root element.
     * @default undefined
     */
    className?: string;
    /**
     * Applies inset spacing to align nested content.
     * @default false
     */
    inset?: boolean;
}
interface MenubarSeparatorProps extends Omit<React.ComponentPropsWithRef<typeof BaseMenu.Separator>, "className"> {
    /**
     * Applies additional CSS classes to the component root element.
     * @default undefined
     */
    className?: string;
}
interface MenubarShortcutProps extends React.ComponentPropsWithRef<"span"> {
    /**
     * Applies additional CSS classes to the component root element.
     * @default undefined
     */
    className?: string;
    /**
     * Overrides the default rendered element while preserving component behavior.
     * @default undefined
     */
    render?: useRender.RenderProp<Record<string, never>>;
    /**
     * Enables child element composition instead of rendering the default wrapper.
     * @default false
     * @deprecated Prefer Base UI's `render` prop.
     */
    asChild?: boolean;
}
/**
 * Renders the menubar menu.
 *
 * @remarks
 * - Delegates structure and state to the underlying Base UI primitive
 * - Built on {@link https://base-ui.com/react/components/menubar | Base UI Menubar}
 * - Preserves the underlying primitive API for advanced composition
 *
 * @example
 * ```tsx
 * <MenubarMenu>Content</MenubarMenu>
 * ```
 *
 * @see {@link https://base-ui.com/react/components/menubar | Base UI Documentation}
 */
declare const MenubarMenu: typeof BaseMenu.Root & {
    displayName?: string;
};
/**
 * Renders the menubar group.
 *
 * @remarks
 * - Delegates structure and state to the underlying Base UI primitive
 * - Built on {@link https://base-ui.com/react/components/menubar | Base UI Menubar}
 * - Preserves the underlying primitive API for advanced composition
 *
 * @example
 * ```tsx
 * <MenubarGroup>Content</MenubarGroup>
 * ```
 *
 * @see {@link https://base-ui.com/react/components/menubar | Base UI Documentation}
 */
declare const MenubarGroup: React.ForwardRefExoticComponent<Omit<import("@base-ui/react").ContextMenuGroupProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
/**
 * Provides the menubar portal container.
 *
 * @remarks
 * - Delegates structure and state to the underlying Base UI primitive
 * - Built on {@link https://base-ui.com/react/components/menubar | Base UI Menubar}
 * - Preserves the underlying primitive API for advanced composition
 *
 * @example
 * ```tsx
 * <MenubarPortal>Content</MenubarPortal>
 * ```
 *
 * @see {@link https://base-ui.com/react/components/menubar | Base UI Documentation}
 */
declare const MenubarPortal: React.ForwardRefExoticComponent<Omit<import("@base-ui/react").ContextMenuPortalProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
/**
 * Coordinates the menubar radio group.
 *
 * @remarks
 * - Delegates structure and state to the underlying Base UI primitive
 * - Built on {@link https://base-ui.com/react/components/menubar | Base UI Menubar}
 * - Preserves the underlying primitive API for advanced composition
 *
 * @example
 * ```tsx
 * <MenubarRadioGroup>Content</MenubarRadioGroup>
 * ```
 *
 * @see {@link https://base-ui.com/react/components/menubar | Base UI Documentation}
 */
declare const MenubarRadioGroup: React.NamedExoticComponent<Omit<import("@base-ui/react").ContextMenuRadioGroupProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
/**
 * Coordinates the menubar sub.
 *
 * @remarks
 * - Delegates structure and state to the underlying Base UI primitive
 * - Built on {@link https://base-ui.com/react/components/menubar | Base UI Menubar}
 * - Preserves the underlying primitive API for advanced composition
 *
 * @example
 * ```tsx
 * <MenubarSub>Content</MenubarSub>
 * ```
 *
 * @see {@link https://base-ui.com/react/components/menubar | Base UI Documentation}
 */
declare const MenubarSub: typeof BaseMenu.SubmenuRoot & {
    displayName?: string;
};
/**
 * Coordinates menubar state and accessibility behavior.
 *
 * @remarks
 * - Renders a `<div>` element by default
 * - Built on {@link https://base-ui.com/react/components/menubar | Base UI Menubar}
 * - Supports the `render` prop for element composition
 *
 * @example
 * ```tsx
 * <Menubar>Content</Menubar>
 * ```
 *
 * @see {@link https://base-ui.com/react/components/menubar | Base UI Documentation}
 */
declare function Menubar(props: Readonly<Menubar.Props>): React.ReactElement;
declare namespace Menubar {
    var displayName: string;
}
/**
 * Renders the menubar trigger.
 *
 * @remarks
 * - Renders a `<button>` element by default
 * - Built on {@link https://base-ui.com/react/components/menubar | Base UI Menubar}
 * - Supports the `render` prop for element composition
 *
 * @example
 * ```tsx
 * <MenubarTrigger>Content</MenubarTrigger>
 * ```
 *
 * @see {@link https://base-ui.com/react/components/menubar | Base UI Documentation}
 */
declare const MenubarTrigger: React.ForwardRefExoticComponent<Omit<MenubarTrigger.Props, "ref"> & React.RefAttributes<HTMLButtonElement>>;
/**
 * Renders the menubar sub trigger.
 *
 * @remarks
 * - Renders a `<div>` element by default
 * - Built on {@link https://base-ui.com/react/components/menubar | Base UI Menubar}
 * - Supports the `render` prop for element composition
 *
 * @example
 * ```tsx
 * <MenubarSubTrigger>Content</MenubarSubTrigger>
 * ```
 *
 * @see {@link https://base-ui.com/react/components/menubar | Base UI Documentation}
 */
declare function MenubarSubTrigger(props: Readonly<MenubarSubTrigger.Props>): React.ReactElement;
declare namespace MenubarSubTrigger {
    var displayName: string;
}
/**
 * Renders the menubar sub content.
 *
 * @remarks
 * - Renders a `<div>` element by default
 * - Built on {@link https://base-ui.com/react/components/menubar | Base UI Menubar}
 * - Supports the `render` prop for element composition
 *
 * @example
 * ```tsx
 * <MenubarSubContent>Content</MenubarSubContent>
 * ```
 *
 * @see {@link https://base-ui.com/react/components/menubar | Base UI Documentation}
 */
declare function MenubarSubContent(props: Readonly<MenubarContent.Props>): React.ReactElement;
declare namespace MenubarSubContent {
    var displayName: string;
}
/**
 * Renders the menubar content.
 *
 * @remarks
 * - Renders a `<div>` element by default
 * - Built on {@link https://base-ui.com/react/components/menubar | Base UI Menubar}
 * - Supports the `render` prop for element composition
 *
 * @example
 * ```tsx
 * <MenubarContent>Content</MenubarContent>
 * ```
 *
 * @see {@link https://base-ui.com/react/components/menubar | Base UI Documentation}
 */
declare const MenubarContent: React.ForwardRefExoticComponent<Omit<MenubarContentProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
/**
 * Renders the menubar item.
 *
 * @remarks
 * - Renders a `<div>` element by default
 * - Built on {@link https://base-ui.com/react/components/menubar | Base UI Menubar}
 * - Supports the `render` prop for element composition
 *
 * @example
 * ```tsx
 * <MenubarItem>Content</MenubarItem>
 * ```
 *
 * @see {@link https://base-ui.com/react/components/menubar | Base UI Documentation}
 */
declare function MenubarItem(props: Readonly<MenubarItem.Props>): React.ReactElement;
declare namespace MenubarItem {
    var displayName: string;
}
/**
 * Renders the menubar checkbox item.
 *
 * @remarks
 * - Renders a `<div>` element by default
 * - Built on {@link https://base-ui.com/react/components/menubar | Base UI Menubar}
 * - Supports the `render` prop for element composition
 *
 * @example
 * ```tsx
 * <MenubarCheckboxItem>Content</MenubarCheckboxItem>
 * ```
 *
 * @see {@link https://base-ui.com/react/components/menubar | Base UI Documentation}
 */
declare function MenubarCheckboxItem(props: Readonly<MenubarCheckboxItem.Props>): React.ReactElement;
declare namespace MenubarCheckboxItem {
    var displayName: string;
}
/**
 * Renders the menubar radio item.
 *
 * @remarks
 * - Renders a `<div>` element by default
 * - Built on {@link https://base-ui.com/react/components/menubar | Base UI Menubar}
 * - Supports the `render` prop for element composition
 *
 * @example
 * ```tsx
 * <MenubarRadioItem>Content</MenubarRadioItem>
 * ```
 *
 * @see {@link https://base-ui.com/react/components/menubar | Base UI Documentation}
 */
declare function MenubarRadioItem(props: Readonly<MenubarRadioItem.Props>): React.ReactElement;
declare namespace MenubarRadioItem {
    var displayName: string;
}
/**
 * Renders the menubar label.
 *
 * @remarks
 * - Renders a `<div>` element by default
 * - Built on {@link https://base-ui.com/react/components/menubar | Base UI Menubar}
 * - Supports the `render` prop for element composition
 *
 * @example
 * ```tsx
 * <MenubarLabel>Content</MenubarLabel>
 * ```
 *
 * @see {@link https://base-ui.com/react/components/menubar | Base UI Documentation}
 */
declare function MenubarLabel(props: Readonly<MenubarLabel.Props>): React.ReactElement;
declare namespace MenubarLabel {
    var displayName: string;
}
/**
 * Renders the menubar separator.
 *
 * @remarks
 * - Renders a `<div>` element by default
 * - Built on {@link https://base-ui.com/react/components/menubar | Base UI Menubar}
 * - Supports the `render` prop for element composition
 *
 * @example
 * ```tsx
 * <MenubarSeparator>Content</MenubarSeparator>
 * ```
 *
 * @see {@link https://base-ui.com/react/components/menubar | Base UI Documentation}
 */
declare function MenubarSeparator(props: Readonly<MenubarSeparator.Props>): React.ReactElement;
declare namespace MenubarSeparator {
    var displayName: string;
}
/**
 * Renders the menubar shortcut.
 *
 * @remarks
 * - Renders a `<span>` element by default
 * - Built on {@link https://base-ui.com/react/components/menubar | Base UI Menubar}
 * - Supports the `render` prop for element composition
 *
 * @example
 * ```tsx
 * <MenubarShortcut>Content</MenubarShortcut>
 * ```
 *
 * @see {@link https://base-ui.com/react/components/menubar | Base UI Documentation}
 */
declare function MenubarShortcut(props: Readonly<MenubarShortcut.Props>): React.ReactElement;
declare namespace MenubarShortcut {
    var displayName: string;
}
declare namespace Menubar {
    type Props = Omit<React.ComponentPropsWithRef<typeof BaseMenubar>, "className"> & {
        className?: string;
    };
    type State = BaseMenubar.State;
}
declare namespace MenubarTrigger {
    type Props = Omit<React.ComponentPropsWithRef<typeof BaseMenu.Trigger>, "className"> & {
        /**
         * Applies additional CSS classes to the component root element.
         * @default undefined
         */
        className?: string;
    };
    type State = BaseMenu.Trigger.State;
}
declare namespace MenubarSubTrigger {
    type Props = MenubarSubTriggerProps;
    type State = BaseMenu.SubmenuTrigger.State;
}
declare namespace MenubarContent {
    type Props = MenubarContentProps;
    type State = BaseMenu.Popup.State;
}
declare namespace MenubarSubContent {
    type Props = MenubarContentProps;
    type State = BaseMenu.Popup.State;
}
declare namespace MenubarItem {
    type Props = MenubarItemProps;
    type State = BaseMenu.Item.State;
}
declare namespace MenubarCheckboxItem {
    type Props = MenubarCheckboxItemProps;
    type State = BaseMenu.CheckboxItem.State;
}
declare namespace MenubarRadioItem {
    type Props = MenubarRadioItemProps;
    type State = BaseMenu.RadioItem.State;
}
declare namespace MenubarLabel {
    type Props = MenubarLabelProps;
    type State = BaseMenu.GroupLabel.State;
}
declare namespace MenubarSeparator {
    type Props = MenubarSeparatorProps;
    type State = BaseMenu.Separator.State;
}
declare namespace MenubarShortcut {
    type Props = MenubarShortcutProps;
    type State = Record<string, never>;
}
export { Menubar, MenubarCheckboxItem, MenubarContent, MenubarGroup, MenubarItem, MenubarLabel, MenubarMenu, MenubarPortal, MenubarRadioGroup, MenubarRadioItem, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger, };
//# sourceMappingURL=menubar.d.ts.map