import { JSX, ReactNode } from 'react';
export type ButtonGroupProps = {
    /**
     * The child components to render inside the ButtonGroup.
     * Typically, these should be `<Button>` components.
     */
    children: ReactNode;
    /**
     * The layout direction of the ButtonGroup.
     * @default horizontal
     */
    direction?: 'horizontal' | 'vertical';
    /**
     * Callback function triggered when the selected button changes.
     * Receives the `id` of the selected button as an argument.
     */
    onSelectionChange?: (id: string) => void;
    /**
     * Whether all buttons in the group should have equal width and stretched inside their parent element.
     * If `true`, all buttons will take up equal space.
     * If `false`, the button widths will be determined by their content.
     * @default true
     */
    stretch?: boolean;
    /**
     * A label for the button group, used for accessibility.
     * Required if the group does not have a visible label.
     */
    ariaLabel?: string;
    /**
     * Additional custom CSS classes to apply to the ButtonGroup container
     */
    className?: string;
    /**
     * Content to display before the buttons (prefix)
     */
    prefix?: string;
    /**
     * Content to display after the buttons (suffix)
     */
    suffix?: string;
    /**
     * CSS class for the prefix element
     */
    prefixClassName?: string;
    /**
     * CSS class for the suffix element
     */
    suffixClassName?: string;
};
export declare const ButtonGroup: (props: ButtonGroupProps) => JSX.Element;
export default ButtonGroup;