/**
 * @file Toolbar.tsx
 * @input Uses Section, SizeContext, useListFocus, useKeyboardHint, StyleX, spacingVars, sizeVars
 * @output Exports Toolbar component and ToolbarProps
 * @position Core implementation; consumed by index.ts
 *
 * SYNC: When modified, update these files to stay in sync:
 * - /packages/core/src/Toolbar/Toolbar.doc.mjs
 * - /packages/core/src/Toolbar/Toolbar.test.tsx
 * - /packages/core/src/Toolbar/index.ts
 * - /apps/storybook/stories/Toolbar.stories.tsx
 * - /packages/cli/assets/templates/blocks/components/Toolbar/ (showcase blocks)
 */
import { type ReactNode } from 'react';
import type { BaseProps } from '../BaseProps';
import type { SectionVariant } from '../Section/Section';
import type { SpacingStep } from '../utils/types';
import type { ElementSize } from '../SizeContext/SizeContext';
export type ToolbarSize = ElementSize;
export interface ToolbarProps extends BaseProps<HTMLDivElement> {
    /** Ref forwarded to the root Section element */
    ref?: React.Ref<HTMLDivElement>;
    /**
     * Content aligned to the start (left in LTR).
     */
    startContent?: ReactNode;
    /**
     * Content centered between start and end.
     * When provided, switches layout to CSS grid (1fr auto 1fr).
     */
    centerContent?: ReactNode;
    /**
     * Content aligned to the end (right in LTR).
     */
    endContent?: ReactNode;
    /**
     * Accessible label for the toolbar.
     * Applied as aria-label on the inner toolbar element.
     */
    label: string;
    /**
     * Size of the toolbar. Coordinates with Button, TextInput, TabList, and Selector —
     * children inherit this size as their default via SizeContext.
     *
     * - `'sm'`: Compact — fits sm buttons/inputs (28px elements)
     * - `'md'`: Standard — fits md buttons/inputs (32px elements)
     * - `'lg'`: Spacious — fits lg buttons/inputs (36px elements)
     * @default 'md'
     */
    size?: ToolbarSize;
    /**
     * Gap between items within each slot, using the spacing scale.
     * @default 1
     */
    gap?: SpacingStep;
    /**
     * Orientation of the toolbar for keyboard navigation.
     * Controls which arrow keys navigate between items.
     * @default 'horizontal'
     */
    orientation?: 'horizontal' | 'vertical';
    /**
     * Visual variant passed through to Section.
     * @default 'transparent'
     */
    variant?: SectionVariant;
    /**
     * Which sides should have divider borders.
     * Passed through to Section.
     * @example
     * ```
     * dividers={['bottom']}
     * ```
     */
    dividers?: ('top' | 'bottom' | 'start' | 'end')[];
}
/**
 * General-purpose toolbar with start, center, and end content slots.
 *
 * Built on Section, provides flex/grid layout with roving tabindex
 * keyboard navigation via useListFocus. Cascades `size` to child components
 * (Button, TextInput, TabList, Selector) via SizeContext, and applies
 * edge compensation so ghost buttons align flush at container edges.
 *
 * @example
 * ```
 * <Toolbar label="Actions" size="sm"
 *   startContent={<Button label="Cut" variant="ghost" />}
 *   endContent={<Button label="Settings" variant="ghost" />}
 * />
 * ```
 */
export declare function Toolbar({ startContent, centerContent, endContent, label, size, gap, orientation, variant, dividers, xstyle, className, style, ref, onKeyDown: onKeyDownProp, onFocus: onFocusProp, onBlur: onBlurProp, role: _role, 'aria-label': _ariaLabel, 'aria-orientation': _ariaOrientation, ...props }: ToolbarProps): import("react").JSX.Element;
export declare namespace Toolbar {
    var displayName: string;
}
//# sourceMappingURL=Toolbar.d.ts.map