@carbon/react/es/components/Toggle/Toggle.d.ts

React components for the Carbon Design System

/**
 * Copyright IBM Corp. 2021, 2023
 *
 * This source code is licensed under the Apache-2.0 license found in the
 * LICENSE file in the root directory of this source tree.
 */
import React, { type KeyboardEventHandler, type MouseEventHandler } from 'react';
import PropTypes from 'prop-types';
type ExcludedAttributes = 'aria-labelledby' | 'aria-checked' | 'type' | 'role' | 'id' | 'size' | 'onClick' | 'onToggle';
export interface ToggleProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, ExcludedAttributes> {
    /**
     * Specify another element's id to be used as the label for this toggle
     */
    'aria-labelledby'?: string;
    /**
     * Provide an id that unique represents the underlying `<button>`
     */
    id: string;
    /**
     * Specify the label for the "off" position
     */
    labelA?: string;
    /**
     * Specify the label for the "on" position
     */
    labelB?: string;
    /**
     * Provide the text that will be read by a screen reader when visiting this
     * control. This should be provided unless 'aria-labelledby' is set instead
     * or you use an external <label> element with its "for" attribute set to the
     * toggle's id.
     */
    labelText?: string;
    /**
     * If true, the side labels (props.labelA and props.labelB) will be replaced by
     * props.labelText (if passed), so that the toggle doesn't render a top label.
     */
    hideLabel?: boolean;
    /**
     * Provide an event listener that is called when the control is toggled
     */
    onClick?: MouseEventHandler<HTMLDivElement> | KeyboardEventHandler<HTMLDivElement>;
    /**
     * Provide an event listener that is called when the control is toggled
     */
    onToggle?(checked: boolean): void;
    /**
     * Specify the size of the Toggle. Currently only supports 'sm' or 'md' (default)
     */
    size?: 'sm' | 'md';
    /**
     * Whether the toggle should be read-only
     */
    readOnly?: boolean;
    /**
     * Specify whether the toggle should be on by default
     */
    defaultToggled?: boolean;
    /**
     * Specify whether the control is toggled
     */
    toggled?: boolean;
}
export declare function Toggle({ 'aria-labelledby': ariaLabelledby, className, defaultToggled, disabled, hideLabel, id, labelA, labelB, labelText, onClick, onToggle, readOnly, size, toggled, ...other }: ToggleProps): import("react/jsx-runtime").JSX.Element;
export declare namespace Toggle {
    var propTypes: {
        /**
         * Specify another element's id to be used as the label for this toggle
         */
        'aria-labelledby': PropTypes.Requireable<string>;
        /**
         * Specify a custom className to apply to the form-item node
         */
        className: PropTypes.Requireable<string>;
        /**
         * Specify whether the toggle should be on by default
         */
        defaultToggled: PropTypes.Requireable<boolean>;
        /**
         * Whether this control should be disabled
         */
        disabled: PropTypes.Requireable<boolean>;
        /**
         * If true, the side labels (props.labelA and props.labelB) will be replaced by
         * props.labelText (if passed), so that the toggle doesn't render a top label.
         */
        hideLabel: PropTypes.Requireable<boolean>;
        /**
         * Provide an id that unique represents the underlying `<button>`
         */
        id: PropTypes.Validator<string>;
        /**
         * Specify the label for the "off" position
         */
        labelA: PropTypes.Requireable<PropTypes.ReactNodeLike>;
        /**
         * Specify the label for the "on" position
         */
        labelB: PropTypes.Requireable<PropTypes.ReactNodeLike>;
        /**
         * Provide the text that will be read by a screen reader when visiting this
         * control. This should be provided unless 'aria-labelledby' is set instead
         * or you use an external <label> element with its "for" attribute set to the
         * toggle's id.
         */
        labelText: PropTypes.Requireable<string>;
        /**
         * Provide an event listener that is called when the control is clicked
         */
        onClick: PropTypes.Requireable<(...args: any[]) => any>;
        /**
         * Provide an event listener that is called when the control is toggled
         */
        onToggle: PropTypes.Requireable<(...args: any[]) => any>;
        /**
         * Whether the toggle should be read-only
         */
        readOnly: PropTypes.Requireable<boolean>;
        /**
         * Specify the size of the Toggle. Currently only supports 'sm' or 'md' (default)
         */
        size: PropTypes.Requireable<string>;
        /**
         * Specify whether the control is toggled
         */
        toggled: PropTypes.Requireable<boolean>;
    };
}
export default Toggle;