@engie-group/fluid-design-system-react/lib/components/toggle/NJToggle.d.ts

Fluid Design System React

import React from 'react';
export declare const NJToggle: React.ForwardRefExoticComponent<IToggleProps & React.RefAttributes<HTMLInputElement>>;
export interface IToggleProps {
    /**
     *  on or off value returned with onChange function
     *  */
    values: {
        off: string | number | boolean;
        on: string | number | boolean;
    };
    /**
     * Input size
     */
    size?: 'md' | 'lg';
    /**
     * Whether the toggle is checked or not
     */
    isChecked?: boolean;
    /**
     * Whether the toggle is disabled or not
     */
    isDisabled?: boolean;
    /**
     * Text alternative for assistive technologies
     * @see https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-label
     */
    ariaLabel?: string;
    /**
     * Text alternative for assistive technologies based on visible text
     * @see https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-labelledby
     */
    ariaLabelledBy?: string;
    /**
     * Input id
     */
    id: string;
    /**
     * Input name
     */
    name?: string;
    /**
     * Optional additional className
     */
    className?: string;
    /**
     * Text label
     */
    label: string;
    /**
     * Whether the toggle color is inherited from parent
     */
    isColorInherited?: boolean;
    /**
     * Children can only be an icon, with `data-child-name="njToggleIcon"` attribute
     */
    children?: React.ReactNode[];
    /**
     *  use onChange function to get checked status and value from parent component
     *  */
    onChange?: (event: React.ChangeEvent<HTMLInputElement>, checked: boolean, value: string | number | boolean) => void;
}