import { FunctionComponent, ReactNode } from 'react';
/** Defines a single item in a responsive command bar. */
export interface CommandBarItem {
    /** Unique identifier for the item. */
    readonly id: string;
    /** Display label used for tooltip (desktop) and menu text (mobile). */
    readonly label: string;
    /** Icon element. */
    readonly icon?: ReactNode;
    /** Click handler for simple items. */
    readonly onClick?: () => void;
    /** If true, always visible as an icon button. If false (default), goes to overflow menu on mobile. */
    readonly pinned?: boolean;
    /** Sub-items rendered as a dropdown (desktop) or nested submenu (mobile). */
    readonly children?: readonly CommandBarItem[];
    /** Additional content rendered alongside the command bar (e.g., dialogs triggered by children). */
    readonly content?: ReactNode;
    /** Custom toolbar element for desktop rendering. Overrides default and children-based rendering. */
    readonly toolbarItem?: ReactNode;
    /** Custom menu element for mobile overflow menu. Overrides default and children-based rendering. */
    readonly menuItem?: ReactNode;
    /** Alignment group on the desktop toolbar. Defaults to "left". */
    readonly align?: "left" | "right";
}
export interface ResponsiveCommandBarProps {
    /** The items to render in the command bar. */
    readonly items: readonly CommandBarItem[];
    /** Whether to render in mobile (compact) mode. */
    readonly isMobile: boolean;
}
/**
 * A generic responsive command bar that renders items as a toolbar on desktop
 * and collapses non-pinned items into a hamburger overflow menu on mobile.
 */
export declare const ResponsiveCommandBar: FunctionComponent<ResponsiveCommandBarProps>;
//# sourceMappingURL=responsive-command-bar.d.ts.map