import { ForwardedRef, ReactElement } from 'react';
import { ToggleButtonGroupMultipleProps, ToggleButtonGroupSingleProps } from './toggle-button-group.types';
/**
 * The current component is used as an argument for the `forwardRef` function to forward ref.
 * However, to keep the generic interface of the `ToggleButtonGroup` component we have to cast type
 * after wrapping this component with the `forwardRef` function.
 */
declare function ToggleButtonGroupInner<T extends number | string = string>(props: ToggleButtonGroupMultipleProps<T> | ToggleButtonGroupSingleProps<T>, forwardedRef: ForwardedRef<HTMLDivElement>): ReactElement;
/**
 * The `ToggleButtonGroup` controls the selected state of its child buttons when given its own `value` prop.
 * To emphasize groups of related toggle buttons, a group should share a common container.
 *
 * ## Usage
 *
 * ### Basic
 *  ```tsx
 *  import { ToggleButton, ToggleButtonGroup } from '@bloomreach/react-banana-ui`;
 *
 *  export default BasicToggleGroup() {
 *    const [value, setValue] = useState('mobile');
 *
 *    return (
 *      <ToggleButtonGroup
 *        value={value}
 *        onChange={(event, value) => { setValue(value); }}
 *      >
 *        <ToggleButton value="web">Web</ToggleButton>
 *        <ToggleButton value="mobile">Mobile</ToggleButton>
 *        <ToggleButton value="desktop">Desktop</ToggleButton>
 *      </ToggleButtonGroup>
 *    );
 *  };
 *  ```
 * The toggle group might be used as a radio button when selecting one option deselects any other
 * it is the default behavior also as multiple selections by passing the `multiple` prop
 * it allows to have multiple options selected.
 *
 * The toggle button group `value` is the currently selected value within the group or
 * an array of selected values when `multiple` is `true`.
 * The value must have reference equality with the option in order to be selected.
 *
 * The `onChange` callback is fired on the value change and has a different signature for the `value` argument.
 * When `multiple` is `true` this is an array of selected values; when `false` is a single value.
 * If no value is selected and  `multiple` is `true` the value is an empty array.
 * In case when `multiple` is `false` then `onChange` the callback doesn't fire
 * if the user clicks on the already selected value.
 *
 * The `ToggleButtonGroup` is generic component and determinate value type
 * based on `value` or it might be explicitly defined like
 *
 * ### Defined value type
 * ```tsx
 * type MyValue = 'one' | 'two' | 'three';
 * <ToggleButtonGroup<MyValue>>...</ToggleButtonGroup>
 * ```
 * by default `value` has a `string` type and `string[]` for `multiple` mode.
 */
declare const _default: <T extends number | string = string>(props: (ToggleButtonGroupMultipleProps<T> & {
    ref?: ForwardedRef<HTMLDivElement>;
}) | ToggleButtonGroupSingleProps<T>) => ReturnType<typeof ToggleButtonGroupInner<T>>;
export default _default;