@mantine/core/lib/components/Switch/SwitchGroup/SwitchGroup.d.ts

React components library focused on usability, accessibility and developer experience

import { DataAttributes, Factory, MantineSize } from '../../../core';
import { InputWrapperProps, InputWrapperStylesNames } from '../../Input';
export interface SwitchGroupContextValue<Value extends string = string> {
    value: Value[];
    onChange: (event: React.ChangeEvent<HTMLInputElement>) => void;
    size: MantineSize | (string & {}) | undefined;
    isDisabled?: (value: Value) => boolean;
}
export declare const SwitchGroupContext: import("react").Context<SwitchGroupContextValue<string> | null>;
export type SwitchGroupStylesNames = InputWrapperStylesNames;
export interface SwitchGroupProps<Value extends string = string> extends Omit<InputWrapperProps, 'onChange'> {
    /** `Switch` components */
    children: React.ReactNode;
    /** Controlled component value */
    value?: Value[];
    /** Default value for uncontrolled component */
    defaultValue?: Value[];
    /** Called when value changes */
    onChange?: (value: Value[]) => void;
    /** Props passed down to the `Input.Wrapper` */
    wrapperProps?: React.ComponentProps<'div'> & DataAttributes;
    /** Controls size of the `Input.Wrapper` @default 'sm' */
    size?: MantineSize | (string & {});
    /** If set, value cannot be changed */
    readOnly?: boolean;
    /** `name` attribute of the hidden input for uncontrolled forms */
    name?: string;
    /** Props passed down to the hidden input for uncontrolled forms */
    hiddenInputProps?: React.ComponentProps<'input'> & DataAttributes;
    /** Separator for values in the hidden input for uncontrolled forms @default ',' */
    hiddenInputValuesSeparator?: string;
    /** Maximum number of switches that can be selected. When the limit is reached, unselected switches will be disabled */
    maxSelectedValues?: number;
    /** Sets `disabled` attribute, prevents interactions */
    disabled?: boolean;
}
export type SwitchGroupFactory = Factory<{
    props: SwitchGroupProps;
    ref: HTMLDivElement;
    stylesNames: SwitchGroupStylesNames;
    signature: <Value extends string = string>(props: SwitchGroupProps<Value>) => React.JSX.Element;
}>;
export declare const SwitchGroup: (<Value extends string = string>(props: SwitchGroupProps<Value>) => React.JSX.Element) & import("../../..").ThemeExtend<{
    props: SwitchGroupProps;
    ref: HTMLDivElement;
    stylesNames: SwitchGroupStylesNames;
    signature: <Value extends string = string>(props: SwitchGroupProps<Value>) => React.JSX.Element;
}> & import("../../..").ComponentClasses<{
    props: SwitchGroupProps;
    ref: HTMLDivElement;
    stylesNames: SwitchGroupStylesNames;
    signature: <Value extends string = string>(props: SwitchGroupProps<Value>) => React.JSX.Element;
}> & Record<string, never> & import("../../..").FactoryComponentWithProps<{
    props: SwitchGroupProps;
    ref: HTMLDivElement;
    stylesNames: SwitchGroupStylesNames;
    signature: <Value extends string = string>(props: SwitchGroupProps<Value>) => React.JSX.Element;
}> & {
    displayName?: string;
};