import { ComponentPropsWithoutRef, ReactElement, RefObject } from 'react';
import { LayoutUtilProps } from '../../types';
import { ToolbarItemProps, ToolbarOverflowTypes } from './sharedTypes';
/**
 * Context for sharing toolbar state with child components for overflow handling
 */
export type ToolbarOverFlowContextProps = {
    /**
     * Array of toolbar items that should appear in the overflow menu
     */
    overflowItems: ToolbarItemProps[];
    /**
     * Function to add an item to the overflow menu
     */
    addItem: (element: ToolbarItemProps) => void;
    /**
     * Function to remove an item from the overflow menu
     */
    removeItem: (element: ToolbarItemProps) => void;
    /**
     * Reference to the toolbar container element
     */
    toolbarRef: RefObject<HTMLDivElement>;
    /**
     * Array of item IDs in their original order
     */
    orderedIds?: string[];
    /**
     * Overflow behavior type (wrap or collapse)
     */
    overflow: ToolbarOverflowTypes;
};
/**
 * Context for managing toolbar overflow state and operations
 */
export declare const ToolbarOverflowContext: import('react').Context<ToolbarOverFlowContextProps>;
/**
 * Props for the Toolbar component
 * @extends ComponentPropsWithoutRef<"div">
 * @extends LayoutUtilProps
 */
export type ToolbarProps = ComponentPropsWithoutRef<"div"> & LayoutUtilProps & {
    /**
     * Description of the content this toolbar is associated with, used for accessibility
     */
    associatedContent: string;
    /**
     * Orientation of the toolbar
     * @default horizontal
     */
    direction?: "vertical" | "horizontal";
    /**
     * How to handle overflow when items don't fit
     * @default wrap
     */
    overflow?: ToolbarOverflowTypes;
    /**
     * Additional items to display in the overflow menu
     */
    additionalItems?: ReactElement[];
};
/**
 * Toolbar component for grouping related interactive elements.
 *
 * Features:
 * - Horizontal or vertical orientation
 * - Overflow handling with wrap or collapse behavior
 * - Keyboard navigation following ARIA best practices
 * - Screen reader announcements and accessibility
 * - Automatic overflow menu for collapsed items
 * - Support for buttons, toggles, selects, and links
 * - Layout utilities for positioning and spacing
 * - Context-based state management for child components
 *
 * @example
 * <Toolbar associatedContent="document editor" overflow="collapse">
 *   <Toolbar.Button icon={BoldIcon} aria-label="Bold" />
 *   <Toolbar.ButtonToggle icon={ItalicIcon} aria-label="Italic" />
 *   <Toolbar.Select
 *     items={fontOptions}
 *     selected="arial"
 *     accessibleLabel="Font family"
 *   />
 * </Toolbar>
 */
export declare const Toolbar: import('react').ForwardRefExoticComponent<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & LayoutUtilProps & {
    /**
     * Description of the content this toolbar is associated with, used for accessibility
     */
    associatedContent: string;
    /**
     * Orientation of the toolbar
     * @default horizontal
     */
    direction?: "vertical" | "horizontal";
    /**
     * How to handle overflow when items don't fit
     * @default wrap
     */
    overflow?: ToolbarOverflowTypes;
    /**
     * Additional items to display in the overflow menu
     */
    additionalItems?: ReactElement[];
} & import('react').RefAttributes<HTMLDivElement>> & {
    /**
     * ToolbarButton component for standard clickable actions within a toolbar.
     *
     * Features:
     * - Designed specifically for toolbar integration
     * - Consistent styling with other toolbar items
     * - Automatic tooltip for icon-only buttons
     * - Overflow menu support
     * - Accessibility enforcement for aria-labels
     * - Small size optimized for toolbar layout
     * - Ghost and primary appearance options
     *
     * @example
     * <Toolbar.Button icon={BoldIcon} aria-label="Bold text" />
     *
     * @example
     * <Toolbar.Button appearance="primary">
     *   Save
     * </Toolbar.Button>
     */
    Button: import('react').ForwardRefExoticComponent<import('.').ToolbarButtonProps & import('react').RefAttributes<HTMLButtonElement>>;
    /**
     * ToolbarButtonToggle component for toggleable actions within a toolbar.
     *
     * Features:
     * - Toggle state management (on/off)
     * - Designed specifically for toolbar integration
     * - Consistent styling with other toolbar items
     * - Automatic tooltip for icon-only toggles
     * - Overflow menu support
     * - Accessibility enforcement for aria-labels
     * - Small size optimized for toolbar layout
     * - Visual feedback for toggle state
     * - Proper ARIA attributes for toggle semantics
     *
     * @example
     * <Toolbar.ButtonToggle icon={BoldIcon} aria-label="Bold" checked={isBold} />
     *
     * @example
     * <Toolbar.ButtonToggle checked={isItalic}>
     *   Italic
     * </Toolbar.ButtonToggle>
     */
    ButtonToggle: import('react').ForwardRefExoticComponent<import('.').ToolbarButtonToggleProps & import('react').RefAttributes<HTMLButtonElement>>;
    /**
     * ToolbarButtonLink component for link actions within a toolbar.
     *
     * Features:
     * - Link functionality with href support
     * - Designed specifically for toolbar integration
     * - Consistent styling with other toolbar items
     * - Automatic tooltip for icon-only links
     * - Overflow menu support
     * - Accessibility enforcement for aria-labels
     * - Small size optimized for toolbar layout
     * - Ghost and primary appearance options
     * - Proper anchor element semantics
     *
     * @example
     * <Toolbar.ButtonLink href="/help">
     *   Help
     * </Toolbar.ButtonLink>
     *
     * @example
     * <Toolbar.ButtonLink icon={ExternalLinkIcon} href="/docs" aria-label="Documentation" />
     */
    ButtonLink: import('react').ForwardRefExoticComponent<import('.').ToolbarButtonLinkProps & import('react').RefAttributes<HTMLAnchorElement>>;
    /**
     * ToolbarSelect component provides a dropdown selector within a toolbar.
     *
     * Features:
     * - Dropdown menu with selectable options
     * - Controlled and uncontrolled usage patterns
     * - Automatic overflow menu integration
     * - Accessibility support with proper ARIA labels
     * - Small size optimized for toolbar layout
     * - Ghost and primary appearance options
     * - Dropdown arrow icon indicator
     * - Listbox integration for keyboard navigation
     *
     * @example
     * <Toolbar.Select
     *   items={fontOptions}
     *   selected="arial"
     *   accessibleLabel="Font family"
     *   onChange={(id) => setFont(id)}
     * />
     *
     * @example
     * <Toolbar.Select
     *   appearance="primary"
     *   items={colorOptions}
     *   accessibleLabel="Text color"
     * />
     */
    Select: import('react').ForwardRefExoticComponent<Omit<Omit<Omit<Omit<import('react').DetailedHTMLProps<import('react').ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref">, "children"> & LayoutUtilProps & {
        appearance?: import('../..').ButtonAppearance;
        size?: Extract<import('../..').Size, "small" | "medium" | "large">;
        loading?: boolean;
    } & {
        children?: ComponentPropsWithoutRef<"button">["children"];
        icon?: import('..').IconProps["svg"] | {
            after: import('..').IconProps["svg"];
        } | {
            before: import('..').IconProps["svg"];
        };
    } & import('react').RefAttributes<HTMLButtonElement>, "ref"> | Omit<Omit<Omit<import('react').DetailedHTMLProps<import('react').ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref">, "children"> & LayoutUtilProps & {
        appearance?: import('../..').ButtonAppearance;
        size?: Extract<import('../..').Size, "small" | "medium" | "large">;
        loading?: boolean;
    } & {
        children?: never;
        icon?: import('..').IconProps["svg"];
    } & import('react').RefAttributes<HTMLButtonElement>, "ref">, "onChange" | "appearance"> & {
        appearance?: import('./sharedTypes').ToolbarItemAppearance;
        onChange?: (optionId: string) => void;
        selected?: string;
        items: (Record<string, unknown> & {
            id: string;
        } & {
            label: string;
            disabled?: boolean;
        })[];
        accessibleLabel: string;
    } & import('react').RefAttributes<HTMLButtonElement>>;
};