import * as CSS from 'csstype';
import { type FormEvent, type PropsWithChildren } from 'react';
import type { BehaviorTrackingProps } from '../../core/types/behavior-tracking-props.js';
import { DataTestId } from '../../core/types/data-props.js';
import { DOMProps } from '../../core/types/dom.js';
import type { FormControlProps } from '../../core/types/form-control-props.js';
import { MaskingProps } from '../../core/types/masking-props.js';
import { StylingProps } from '../../core/types/styling-props.js';
import type { FormControlRef } from '../shared-types.js';
/**
 * Accepted properties for ToggleButtonGroup
 * @public
 */
export type ToggleButtonGroupProps = FormControlProps<string, (value: string, event?: FormEvent<HTMLElement | SVGElement>) => void | never> & PropsWithChildren & DOMProps & StylingProps & DataTestId & MaskingProps & BehaviorTrackingProps & {
    /**
     * The width of the ToggleButtonGroup.
     * @defaultValue 'content'
     */
    width?: 'content' | 'full' | CSS.Property.Width<string & {}>;
};
/**
 * `ToggleButtonGroup` lets users toggle between a set of related options, typically with one preselected. It's best for switching between views or a compact group of options with immediate effect.
 * @public
 */
export declare const ToggleButtonGroup: ((props: ToggleButtonGroupProps & import("react").RefAttributes<HTMLDivElement | FormControlRef<HTMLDivElement> | null>) => import("react").ReactElement | null) & {
    Item: (props: import("./Item.js").ToggleButtonGroupItemProps & import("react").RefAttributes<FormControlRef<HTMLElement>>) => import("react").ReactElement | null;
    Suffix: (props: import("./Suffix.js").ToggleButtonGroupSuffixProps & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactElement | null;
    Prefix: (props: import("./Prefix.js").ToggleButtonGroupPrefixProps & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactElement | null;
};