/// <reference types="react" />
import * as React from 'react';
import { IComponent, IComponentStyles, IHTMLElementSlot, IHTMLSlot, IStyleableComponentProps } from '../../Foundation';
import { IKeytipProps } from 'office-ui-fabric-react/lib/Keytip';
import { IBaseProps, IComponentAs } from '../../Utilities';
import { IRawStyleBase } from '@uifabric/merge-styles/lib/IRawStyleBase';
import { ILabelSlot } from '../../utilities/factoryComponents.types';
export declare type IToggleComponent = IComponent<IToggleProps, IToggleTokens, IToggleStyles, IToggleViewProps>;
export declare type IToggleTokenReturnType = ReturnType<Extract<IToggleComponent['tokens'], Function>>;
export declare type IToggleStylesReturnType = ReturnType<Extract<IToggleComponent['styles'], Function>>;
export interface IToggleSlots {
    /**
     * Defines root slot.
     */
    root?: IHTMLSlot;
    /**
     * Defines label slot displayed above pill.
     */
    label?: ILabelSlot;
    /**
     * Defines container slot for the toggle pill and the text next to it.
     */
    container?: IHTMLSlot;
    /**
     * Defines pill slot, rendered as a button by default.
     */
    pill?: IHTMLElementSlot<'button'>;
    /**
     * Defines thumb slot inside of the pill.
     */
    thumb?: IHTMLSlot;
    /**
     * Defines text slot displayed alongside pill. Overrides onText and offText.
     */
    text?: ILabelSlot;
}
export interface IToggle {
    focus: () => void;
}
export interface IToggleProps extends IToggleSlots, IStyleableComponentProps<IToggleViewProps, IToggleTokens, IToggleStyles>, IBaseProps<IToggle> {
    /**
     * Render the root element as another type.
     */
    as?: IComponentAs<React.HTMLAttributes<HTMLElement>>;
    /**
     * Text for screen-reader to announce as the name of the toggle.
     */
    ariaLabel?: string;
    /**
     * Initial state of the toggle. If you want the toggle to maintain its own state, use this. Otherwise refer to `checked`.
     * @default false
     */
    defaultChecked?: boolean;
    /**
     * Checked state of the toggle. If you are maintaining state yourself, use this property. Otherwise refer to `defaultChecked`.
     * @default defaultChecked
     */
    checked?: boolean;
    /**
     * Optional disabled flag.
     * @default false
     */
    disabled?: boolean;
    /**
     * Callback issued when the value changes.
     */
    onChange?: (event: React.MouseEvent<HTMLElement>, checked?: boolean) => void;
    /**
     * Optional keytip for this toggle
     */
    keytipProps?: IKeytipProps;
    /**
     * Text to display when toggle is ON.
     */
    onText?: string;
    /**
     * Text to display when toggle is OFF.
     */
    offText?: string;
}
export interface IToggleViewProps extends IToggleProps {
    /**
     * Toggle input callback triggered by mouse and keyboard input.
     */
    onClick?: (ev: React.MouseEvent<Element>) => void;
    /**
     * Reference to the toggle button.
     */
    toggleButtonRef?: React.RefObject<HTMLButtonElement>;
}
export interface IToggleTokens {
    pillBackground?: string;
    pillHoveredBackground?: string;
    pillBorderColor?: string;
    pillHoveredBorderColor?: string;
    pillJustifyContent?: IRawStyleBase['justifyContent'];
    pillHighContrastBackground?: string;
    pillHighContrastHoveredBackground?: string;
    pillHighContrastBorderColor?: string;
    pillHighContrastHoveredBorderColor?: string;
    thumbBackground?: string;
    thumbHighContrastBackground?: string;
    thumbHighContrastBorderColor?: string;
    textColor?: string;
    textHighContrastColor?: string;
}
export declare type IToggleStyles = IComponentStyles<IToggleSlots>;