@workday/canvas-kit-react/dist/es6/side-panel/lib/SidePanelToggleButton.d.ts

The parent module that contains all Workday Canvas Kit React components

import * as React from 'react';
import { TertiaryButton } from '@workday/canvas-kit-react/button';
import { ExtractProps } from '@workday/canvas-kit-react/common';
import { TooltipProps } from '@workday/canvas-kit-react/tooltip';
export interface SidePanelToggleButtonProps extends ExtractProps<typeof TertiaryButton> {
    /**
     * The tooltip text to expand the side panel
     * @deprecated Use
     */
    tooltipTextExpand?: string;
    /**
     * Provides an accessible label to the button. This text **should not** convey visual state but rather what it does like "control data panel."
     */
    tooltipText?: string;
    /**
     * The tooltip text to collapse the side panel. Optional text for when the side panel is in a collapsed state.
     */
    tooltipTextCollapse?: string;
    tooltipProps?: Omit<TooltipProps, 'children'>;
}
export declare const sidePanelToggleButtonStencil: import("@workday/canvas-kit-styling").Stencil<{
    state: {
        collapsing: {
            margin: number;
        };
        collapsed: {
            margin: string;
        };
        expanded: {
            margin: number;
        };
        expanding: {
            margin: number;
        };
    };
    origin: {
        start: {
            insetInlineEnd: "var(--cnvs-base-size-150, 0.75rem)";
        };
        end: {
            insetInlineStart: "var(--cnvs-base-size-150, 0.75rem)";
        };
    };
}, {}, {}, never, never>;
/**
 * Adds the necessary ARIA attributes to the SidePanel's toggle button.
 * This includes `aria-controls` pointing at the panel, `aria-pressed` to convey the collapsed
 * state, and `aria-describedby` pointing at the panel's heading.
 */
export declare const useSidePanelToggleButton: import("@workday/canvas-kit-react/common").BehaviorHook<{
    state: {
        panelId: string;
        labelId: string;
        transitionState: import("./useSidePanelModel").SidePanelTransitionStates;
        initialTransitionState: import("./useSidePanelModel").SidePanelTransitionStates;
        origin: "end" | "start";
        onStateTransition(state: import("./useSidePanelModel").SidePanelTransitionStates): void;
    };
    events: {
        expand(): void;
        collapse(): void;
        handleAnimationEnd(event: React.TransitionEvent<HTMLDivElement>): React.TransitionEvent<HTMLDivElement>;
        handleAnimationStart(): undefined;
    };
}, {
    readonly 'aria-controls': string;
    readonly 'aria-pressed': boolean;
    readonly 'aria-describedby': string;
}>;
export declare const SidePanelToggleButton: import("@workday/canvas-kit-react/common").ElementComponentM<"button", SidePanelToggleButtonProps, {
    state: {
        panelId: string;
        labelId: string;
        transitionState: import("./useSidePanelModel").SidePanelTransitionStates;
        initialTransitionState: import("./useSidePanelModel").SidePanelTransitionStates;
        origin: "end" | "start";
        onStateTransition(state: import("./useSidePanelModel").SidePanelTransitionStates): void;
    };
    events: {
        expand(): void;
        collapse(): void;
        handleAnimationEnd(event: React.TransitionEvent<HTMLDivElement>): React.TransitionEvent<HTMLDivElement>;
        handleAnimationStart(): undefined;
    };
}>;
//# sourceMappingURL=SidePanelToggleButton.d.ts.map