import { Toolbar } from '@base-ui/react/toolbar';
import * as React from 'react';
import { type ButtonProps } from '../../atoms/button';
/**
 * A related set of buttons, sharing one tab stop.
 *
 * Ported from the Figma atom `.button-group` (`scripts/figma/bindings/button-group.json`), which is
 * a layout and nothing else: two or three `.button-main`s at a 12px gap, arranged horizontally or
 * vertically. It has no colour, no shape and no state of its own.
 *
 * WHY THIS IS A COMPONENT AND NOT A `<div className="flex gap-gap-250">`. On the atom's evidence
 * alone it would not be — the first read of it here concluded exactly that. Base UI's `Toolbar`
 * changes the arithmetic: it implements the WAI toolbar pattern, which is a real behaviour a flex
 * wrapper cannot give you. Verified against Base UI 1.6.0 rather than assumed, because this project
 * has been caught before believing a Base UI primitive did something it did not:
 *
 *   - the root is `<div role="toolbar" aria-orientation="…">`
 *   - a roving tabindex, `0` on the first item and `-1` on the rest
 *   - `ArrowRight`/`ArrowLeft` move between items, and the movement **loops**
 *   - `Home` returns to the first item
 *   - `Tab` leaves the group rather than walking into the second button
 *
 * That last point is the whole value: a row of six actions is one stop on the way through a form,
 * not six.
 *
 * A toolbar needs an accessible name, so `aria-label` or `aria-labelledby` is required rather than
 * optional — an unnamed `role="toolbar"` announces as an unlabelled group.
 */
declare const buttonGroupStyles: (props?: ({
    orientation?: "horizontal" | "vertical" | null | undefined;
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
export interface ButtonGroupProps extends Omit<React.ComponentPropsWithoutRef<'div'>, 'children'> {
    children: React.ReactNode;
    /**
     * Layout direction, which also sets `aria-orientation` and decides which arrow keys move between
     * items.
     * @default 'horizontal'
     */
    orientation?: 'horizontal' | 'vertical';
    /** Whether the whole group is inert. Individual buttons can still be disabled on their own. */
    disabled?: boolean;
}
/**
 * A group of related buttons that shares a single tab stop, with arrow keys moving between them.
 *
 * Children must be {@link ButtonGroupItem}, not bare `Button`s: the roving tabindex is applied by
 * the item, so a plain `Button` would render correctly and quietly keep its own tab stop.
 *
 * @example
 * <ButtonGroup aria-label="Call actions">
 *   <ButtonGroupItem variant="primary">Start</ButtonGroupItem>
 *   <ButtonGroupItem variant="secondary">Cancel</ButtonGroupItem>
 * </ButtonGroup>
 */
export declare const ButtonGroup: React.ForwardRefExoticComponent<ButtonGroupProps & React.RefAttributes<HTMLDivElement>>;
export type ButtonGroupRowProps = React.ComponentPropsWithoutRef<typeof Toolbar.Group>;
/**
 * A row of items inside a group, for a toolbar that wraps onto more than one line.
 *
 * FIGMA'S `Horizontal-3buttons` IS WHY THIS EXISTS. That style is not three items in a line and not
 * three stacked: it is a **column of two rows** — a primary and a secondary pill side by side at a
 * 12px gap, with the link button on its own row beneath. Rendering it as a flat vertical group put
 * the two pills on separate lines, which is a different drawing.
 *
 * `Toolbar.Group` rather than a nested `ButtonGroup` or a bare `<div>`. A nested toolbar would give
 * the row its **own** tab stop, which defeats the one thing this component is for; a bare `<div>`
 * would work visually and drop out of the composition that assistive technology reports. Base UI
 * ships the part — verified in 1.6.0 rather than assumed, since this project has been caught
 * believing a Base UI primitive did something it did not.
 *
 * Not part of shadcn's set (`ButtonGroup`, `ButtonGroupSeparator`, `ButtonGroupText`), so it is a
 * Figma-driven addition rather than a conformance fix.
 */
export declare const ButtonGroupRow: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").ToolbarGroupProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
export interface ButtonGroupItemProps extends ButtonProps {
}
/**
 * One button inside a {@link ButtonGroup}.
 *
 * `Toolbar.Button` carries the composite-item behaviour — the roving tabindex and the arrow-key
 * registration — and renders Strix's `Button` through Base UI's `render` seam, so every variant,
 * size, loading state and focus ring comes from `Button` unchanged.
 *
 * DISABLED IS `aria-disabled`, NOT THE NATIVE ATTRIBUTE, and that is Base UI's choice rather than a
 * shortcut here. It is the WAI toolbar behaviour: a disabled item stays reachable so a keyboard user
 * can discover that it exists and is unavailable. Verified: activation is blocked, `tabindex` goes
 * to -1, and the native attribute is never set even when `disabled` is passed straight to the
 * rendered `Button` or with `focusableWhenDisabled={false}`.
 *
 * This used to mean a disabled item did not *look* disabled, because `Button` stated each variant's
 * disabled ground and ink through `disabled:` variants that a missing native attribute never fires.
 * That was a defect in `Button` rather than in this wrapper — it had the same gap through its own
 * `render` seam, where a disabled `Button`-as-link looked enabled and stayed clickable — and it is
 * fixed there: every disabled treatment is now emitted for both `disabled:` and `aria-disabled:`,
 * and activation is blocked on the aria path.
 */
export declare const ButtonGroupItem: React.ForwardRefExoticComponent<ButtonGroupItemProps & React.RefAttributes<HTMLButtonElement>>;
export type ButtonGroupSeparatorProps = React.ComponentPropsWithoutRef<typeof Toolbar.Separator>;
/**
 * A divider between groups of items inside one toolbar.
 *
 * `Toolbar.Separator` rather than a bare `<div>`, so the roving tabindex skips it and assistive
 * technology announces the grouping instead of an unnamed element.
 */
export declare const ButtonGroupSeparator: React.ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").ToolbarSeparatorProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
export type ButtonGroupTextProps = React.HTMLAttributes<HTMLSpanElement>;
/**
 * Static text inside a group — a unit, a prefix, a count.
 *
 * Not focusable and not a toolbar item: it is label text that happens to sit in the row, so it
 * stays out of the roving tabindex.
 */
export declare const ButtonGroupText: React.ForwardRefExoticComponent<ButtonGroupTextProps & React.RefAttributes<HTMLSpanElement>>;
export { buttonGroupStyles };
//# sourceMappingURL=button-group.d.ts.map