@workday/canvas-kit-react/dist/commonjs/popup/lib/hooks/usePopupModel.d.ts

The parent module that contains all Workday Canvas Kit React components

import * as React from 'react';
import { Placement } from '../Popper';
export declare const usePopupModel: (<TT_Special_Generic>(config?: (Partial<{
    /**
     * Optional reference to an element that should receive focus when a popup is hidden. If left
     * blank, focus will return to the `targetRef`
     */
    returnFocusRef: React.RefObject<any> | undefined;
    /**
     * Optional reference to an element that should receive focus when a popup is shown. If left blank,
     * focus will be moved to the first focusable element inside the popup.
     */
    initialFocusRef: React.RefObject<any> | undefined;
    id: string;
    initialVisibility: import("@workday/canvas-kit-react/disclosure").Visibility;
}> & {
    onUpdatePlacement?: ((data: {
        placement: Placement;
    }, prevState: {
        /**
         * Reference of the stack item used in the PopupStack. This value will be used in all
         * Popup-related behaviors.
         */
        stackRef: React.RefObject<HTMLDivElement>;
        /**
         * Reference of the target element. This will point to the element that triggered the showing of a
         * Popup and is used in Popup-related behaviors.
         */
        targetRef: React.RefObject<HTMLButtonElement>;
        /**
         * Optional reference to an element that should receive focus when a popup is shown. If left blank,
         * focus will be moved to the first focusable element inside the popup.
         */
        initialFocusRef: React.RefObject<any> | undefined;
        /**
         * Optional reference to an element that should receive focus when a popup is hidden. If left
         * blank, focus will return to the `targetRef`
         */
        returnFocusRef: React.RefObject<any> | undefined;
        /**
         * The placement chosen by the positioning Popper. This should get set prior to showing the popup
         * content.
         * @default 'bottom'
         */
        placement: import("@popperjs/core").Placement;
        id: string;
        visibility: "hidden" | "visible";
    }) => void) | undefined;
    onShow?: ((data: Event | React.SyntheticEvent<Element, Event> | undefined, prevState: {
        /**
         * Reference of the stack item used in the PopupStack. This value will be used in all
         * Popup-related behaviors.
         */
        stackRef: React.RefObject<HTMLDivElement>;
        /**
         * Reference of the target element. This will point to the element that triggered the showing of a
         * Popup and is used in Popup-related behaviors.
         */
        targetRef: React.RefObject<HTMLButtonElement>;
        /**
         * Optional reference to an element that should receive focus when a popup is shown. If left blank,
         * focus will be moved to the first focusable element inside the popup.
         */
        initialFocusRef: React.RefObject<any> | undefined;
        /**
         * Optional reference to an element that should receive focus when a popup is hidden. If left
         * blank, focus will return to the `targetRef`
         */
        returnFocusRef: React.RefObject<any> | undefined;
        /**
         * The placement chosen by the positioning Popper. This should get set prior to showing the popup
         * content.
         * @default 'bottom'
         */
        placement: import("@popperjs/core").Placement;
        id: string;
        visibility: "hidden" | "visible";
    }) => void) | undefined;
    onHide?: ((data: Event | React.SyntheticEvent<Element, Event> | undefined, prevState: {
        /**
         * Reference of the stack item used in the PopupStack. This value will be used in all
         * Popup-related behaviors.
         */
        stackRef: React.RefObject<HTMLDivElement>;
        /**
         * Reference of the target element. This will point to the element that triggered the showing of a
         * Popup and is used in Popup-related behaviors.
         */
        targetRef: React.RefObject<HTMLButtonElement>;
        /**
         * Optional reference to an element that should receive focus when a popup is shown. If left blank,
         * focus will be moved to the first focusable element inside the popup.
         */
        initialFocusRef: React.RefObject<any> | undefined;
        /**
         * Optional reference to an element that should receive focus when a popup is hidden. If left
         * blank, focus will return to the `targetRef`
         */
        returnFocusRef: React.RefObject<any> | undefined;
        /**
         * The placement chosen by the positioning Popper. This should get set prior to showing the popup
         * content.
         * @default 'bottom'
         */
        placement: import("@popperjs/core").Placement;
        id: string;
        visibility: "hidden" | "visible";
    }) => void) | undefined;
} & {
    shouldUpdatePlacement?: ((data: {
        placement: Placement;
    }, state: {
        /**
         * Reference of the stack item used in the PopupStack. This value will be used in all
         * Popup-related behaviors.
         */
        stackRef: React.RefObject<HTMLDivElement>;
        /**
         * Reference of the target element. This will point to the element that triggered the showing of a
         * Popup and is used in Popup-related behaviors.
         */
        targetRef: React.RefObject<HTMLButtonElement>;
        /**
         * Optional reference to an element that should receive focus when a popup is shown. If left blank,
         * focus will be moved to the first focusable element inside the popup.
         */
        initialFocusRef: React.RefObject<any> | undefined;
        /**
         * Optional reference to an element that should receive focus when a popup is hidden. If left
         * blank, focus will return to the `targetRef`
         */
        returnFocusRef: React.RefObject<any> | undefined;
        /**
         * The placement chosen by the positioning Popper. This should get set prior to showing the popup
         * content.
         * @default 'bottom'
         */
        placement: import("@popperjs/core").Placement;
        id: string;
        visibility: "hidden" | "visible";
    }) => boolean) | undefined;
    shouldShow?: ((data: Event | React.SyntheticEvent<Element, Event> | undefined, state: {
        /**
         * Reference of the stack item used in the PopupStack. This value will be used in all
         * Popup-related behaviors.
         */
        stackRef: React.RefObject<HTMLDivElement>;
        /**
         * Reference of the target element. This will point to the element that triggered the showing of a
         * Popup and is used in Popup-related behaviors.
         */
        targetRef: React.RefObject<HTMLButtonElement>;
        /**
         * Optional reference to an element that should receive focus when a popup is shown. If left blank,
         * focus will be moved to the first focusable element inside the popup.
         */
        initialFocusRef: React.RefObject<any> | undefined;
        /**
         * Optional reference to an element that should receive focus when a popup is hidden. If left
         * blank, focus will return to the `targetRef`
         */
        returnFocusRef: React.RefObject<any> | undefined;
        /**
         * The placement chosen by the positioning Popper. This should get set prior to showing the popup
         * content.
         * @default 'bottom'
         */
        placement: import("@popperjs/core").Placement;
        id: string;
        visibility: "hidden" | "visible";
    }) => boolean) | undefined;
    shouldHide?: ((data: Event | React.SyntheticEvent<Element, Event> | undefined, state: {
        /**
         * Reference of the stack item used in the PopupStack. This value will be used in all
         * Popup-related behaviors.
         */
        stackRef: React.RefObject<HTMLDivElement>;
        /**
         * Reference of the target element. This will point to the element that triggered the showing of a
         * Popup and is used in Popup-related behaviors.
         */
        targetRef: React.RefObject<HTMLButtonElement>;
        /**
         * Optional reference to an element that should receive focus when a popup is shown. If left blank,
         * focus will be moved to the first focusable element inside the popup.
         */
        initialFocusRef: React.RefObject<any> | undefined;
        /**
         * Optional reference to an element that should receive focus when a popup is hidden. If left
         * blank, focus will return to the `targetRef`
         */
        returnFocusRef: React.RefObject<any> | undefined;
        /**
         * The placement chosen by the positioning Popper. This should get set prior to showing the popup
         * content.
         * @default 'bottom'
         */
        placement: import("@popperjs/core").Placement;
        id: string;
        visibility: "hidden" | "visible";
    }) => boolean) | undefined;
}) | undefined) => {
    state: {
        /**
         * Reference of the stack item used in the PopupStack. This value will be used in all
         * Popup-related behaviors.
         */
        stackRef: React.RefObject<HTMLDivElement>;
        /**
         * Reference of the target element. This will point to the element that triggered the showing of a
         * Popup and is used in Popup-related behaviors.
         */
        targetRef: React.RefObject<HTMLButtonElement>;
        /**
         * Optional reference to an element that should receive focus when a popup is shown. If left blank,
         * focus will be moved to the first focusable element inside the popup.
         */
        initialFocusRef: React.RefObject<any> | undefined;
        /**
         * Optional reference to an element that should receive focus when a popup is hidden. If left
         * blank, focus will return to the `targetRef`
         */
        returnFocusRef: React.RefObject<any> | undefined;
        /**
         * The placement chosen by the positioning Popper. This should get set prior to showing the popup
         * content.
         * @default 'bottom'
         */
        placement: import("@popperjs/core").Placement;
        id: string;
        visibility: "hidden" | "visible";
    };
    events: {
        /**
         * Called whenever a popup placement changes around a target. This is useful for animations that
         * depend on the placement chosen.
         */
        updatePlacement(data: {
            placement: Placement;
        }): void;
        show(event?: Event | React.SyntheticEvent<Element, Event> | undefined): void;
        hide(event?: Event | React.SyntheticEvent<Element, Event> | undefined): void;
    };
}) & import("@workday/canvas-kit-react/common").ModelExtras<{
    /**
     * Optional reference to an element that should receive focus when a popup is hidden. If left
     * blank, focus will return to the `targetRef`
     */
    returnFocusRef: React.RefObject<any> | undefined;
    /**
     * Optional reference to an element that should receive focus when a popup is shown. If left blank,
     * focus will be moved to the first focusable element inside the popup.
     */
    initialFocusRef: React.RefObject<any> | undefined;
    id: string;
    initialVisibility: import("@workday/canvas-kit-react/disclosure").Visibility;
}, {}, {
    /**
     * Reference of the stack item used in the PopupStack. This value will be used in all
     * Popup-related behaviors.
     */
    stackRef: React.RefObject<HTMLDivElement>;
    /**
     * Reference of the target element. This will point to the element that triggered the showing of a
     * Popup and is used in Popup-related behaviors.
     */
    targetRef: React.RefObject<HTMLButtonElement>;
    /**
     * Optional reference to an element that should receive focus when a popup is shown. If left blank,
     * focus will be moved to the first focusable element inside the popup.
     */
    initialFocusRef: React.RefObject<any> | undefined;
    /**
     * Optional reference to an element that should receive focus when a popup is hidden. If left
     * blank, focus will return to the `targetRef`
     */
    returnFocusRef: React.RefObject<any> | undefined;
    /**
     * The placement chosen by the positioning Popper. This should get set prior to showing the popup
     * content.
     * @default 'bottom'
     */
    placement: import("@popperjs/core").Placement;
    id: string;
    visibility: "hidden" | "visible";
}, {
    /**
     * Called whenever a popup placement changes around a target. This is useful for animations that
     * depend on the placement chosen.
     */
    updatePlacement(data: {
        placement: Placement;
    }): void;
    show(event?: Event | React.SyntheticEvent<Element, Event> | undefined): void;
    hide(event?: Event | React.SyntheticEvent<Element, Event> | undefined): void;
}, {
    state: {
        /**
         * Reference of the stack item used in the PopupStack. This value will be used in all
         * Popup-related behaviors.
         */
        stackRef: React.RefObject<HTMLDivElement>;
        /**
         * Reference of the target element. This will point to the element that triggered the showing of a
         * Popup and is used in Popup-related behaviors.
         */
        targetRef: React.RefObject<HTMLButtonElement>;
        /**
         * Optional reference to an element that should receive focus when a popup is shown. If left blank,
         * focus will be moved to the first focusable element inside the popup.
         */
        initialFocusRef: React.RefObject<any> | undefined;
        /**
         * Optional reference to an element that should receive focus when a popup is hidden. If left
         * blank, focus will return to the `targetRef`
         */
        returnFocusRef: React.RefObject<any> | undefined;
        /**
         * The placement chosen by the positioning Popper. This should get set prior to showing the popup
         * content.
         * @default 'bottom'
         */
        placement: import("@popperjs/core").Placement;
        id: string;
        visibility: "hidden" | "visible";
    };
    events: {
        /**
         * Called whenever a popup placement changes around a target. This is useful for animations that
         * depend on the placement chosen.
         */
        updatePlacement(data: {
            placement: Placement;
        }): void;
        show(event?: Event | React.SyntheticEvent<Element, Event> | undefined): void;
        hide(event?: Event | React.SyntheticEvent<Element, Event> | undefined): void;
    };
}>;
export declare const PopupModelContext: React.Context<{
    state: {
        /**
         * Reference of the stack item used in the PopupStack. This value will be used in all
         * Popup-related behaviors.
         */
        stackRef: React.RefObject<HTMLDivElement>;
        /**
         * Reference of the target element. This will point to the element that triggered the showing of a
         * Popup and is used in Popup-related behaviors.
         */
        targetRef: React.RefObject<HTMLButtonElement>;
        /**
         * Optional reference to an element that should receive focus when a popup is shown. If left blank,
         * focus will be moved to the first focusable element inside the popup.
         */
        initialFocusRef: React.RefObject<any> | undefined;
        /**
         * Optional reference to an element that should receive focus when a popup is hidden. If left
         * blank, focus will return to the `targetRef`
         */
        returnFocusRef: React.RefObject<any> | undefined;
        /**
         * The placement chosen by the positioning Popper. This should get set prior to showing the popup
         * content.
         * @default 'bottom'
         */
        placement: import("@popperjs/core").Placement;
        id: string;
        visibility: "hidden" | "visible";
    };
    events: {
        /**
         * Called whenever a popup placement changes around a target. This is useful for animations that
         * depend on the placement chosen.
         */
        updatePlacement(data: {
            placement: Placement;
        }): void;
        show(event?: Event | React.SyntheticEvent<Element, Event> | undefined): void;
        hide(event?: Event | React.SyntheticEvent<Element, Event> | undefined): void;
    };
}>;
//# sourceMappingURL=usePopupModel.d.ts.map