@workday/canvas-kit-react 6.8.8 → 6.9.0-next.4

package/dist/es6/popup/lib/hooks/usePopupModel.d.ts

@@ -1,8 +1,263 @@
 import * as React from 'react';
-import { Model, ToModelConfig } from '@workday/canvas-kit-react/common';
-import { DisclosureEvents, DisclosureState, BaseDisclosureModelConfig } from '@workday/canvas-kit-react/disclosure';
-import type { Placement } from '@workday/canvas-kit-react/popup';
-export declare type PopupState = DisclosureState & {
+import { Placement } from '@workday/canvas-kit-react/popup';
+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("../../../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: import("../../../disclosure").Visibility;
+    }) => 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: import("../../../disclosure").Visibility;
+    }) => 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: import("../../../disclosure").Visibility;
+    }) => 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: import("../../../disclosure").Visibility;
+    }) => 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: import("../../../disclosure").Visibility;
+    }) => 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: import("../../../disclosure").Visibility;
+    }) => 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: import("../../../disclosure").Visibility;
+    };
+    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; /**
+         * 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.
+         */
+    };
+}) & import("../../../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("../../../disclosure").Visibility;
+}, {}, {
     /**
      * Reference of the stack item used in the PopupStack. This value will be used in all
      * Popup-related behaviors.
@@ -17,20 +272,21 @@ export declare type PopupState = DisclosureState & {
      * 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>;
+    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>;
+    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: Placement;
-};
-export declare type PopupEvents = DisclosureEvents & {
+    placement: import("@popperjs/core").Placement;
+    id: string;
+    visibility: import("../../../disclosure").Visibility;
+}, {
     /**
      * Called whenever a popup placement changes around a target. This is useful for animations that
      * depend on the placement chosen.
@@ -38,44 +294,101 @@ export declare type PopupEvents = DisclosureEvents & {
     updatePlacement(data: {
         placement: Placement;
     }): void;
-};
-export declare type PopupModel = Model<PopupState, PopupEvents>;
-export declare const popupEventMap: {
-    guards: {
+    show(event?: Event | React.SyntheticEvent<Element, Event> | undefined): void;
+    hide(event?: Event | React.SyntheticEvent<Element, Event> | undefined): void; /**
+     * 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.
+     */
+}, {
+    state: {
         /**
-         * Determines if the `placement` state should be updated. This might be useful to keep the
-         * animation going a certain direction regardless of placement chosen by PopperJS.
+         * Reference of the stack item used in the PopupStack. This value will be used in all
+         * Popup-related behaviors.
          */
-        shouldUpdatePlacement: "updatePlacement";
-        shouldShow: "show";
-        shouldHide: "hide";
+        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: import("../../../disclosure").Visibility;
     };
-    callbacks: {
+    events: {
         /**
-         * Called whenever the placement changes. This callback only fires when placement changes. For
-         * example, if the preferred placement of a Popper is 'bottom' and there's enough room to place
-         * a Popup on the bottom, the Popup will render below a target element without firing this
-         * callback. If there is not enough room and PopperJS chooses to update, this callback will be
-         * called to inform of the change in placement.
+         * 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; /**
+         * 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.
          */
-        onUpdatePlacement: "updatePlacement";
-        onShow: "show";
-        onHide: "hide";
     };
-};
-export declare type BasePopupModelConfig = BaseDisclosureModelConfig & {
-    /**
-     * 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>;
-    /**
-     * 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>;
-};
-export declare type PopupModelConfig = BasePopupModelConfig & Partial<ToModelConfig<PopupState, PopupEvents, typeof popupEventMap>>;
-export declare const usePopupModel: (config?: PopupModelConfig) => Model<PopupState, PopupEvents>;
-export declare const PopupModelContext: React.Context<Model<PopupState, PopupEvents>>;
+}>;
+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: import("../../../disclosure").Visibility;
+    };
+    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; /**
+         * 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.
+         */
+    };
+}>;
 //# sourceMappingURL=usePopupModel.d.ts.map

package/dist/es6/popup/lib/hooks/usePopupModel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"usePopupModel.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/usePopupModel.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAiB,KAAK,EAAE,aAAa,EAAc,MAAM,kCAAkC,CAAC;AAEnG,OAAO,EACL,gBAAgB,EAChB,eAAe,EAGf,yBAAyB,EAE1B,MAAM,sCAAsC,CAAC;AAC9C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,iCAAiC,CAAC;AAE/D,oBAAY,UAAU,GAAG,eAAe,GAAG;IACzC;;;OAGG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;IAC1C;;;OAGG;IACH,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,iBAAiB,CAAC,CAAC;IAC9C;;;OAGG;IACH,eAAe,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC;IACvC;;;OAGG;IACH,cAAc,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC;IACtC;;;;OAIG;IACH,SAAS,EAAE,SAAS,CAAC;CACtB,CAAC;AAEF,oBAAY,WAAW,GAAG,gBAAgB,GAAG;IAC3C;;;OAGG;IACH,eAAe,CAAC,IAAI,EAAE;QAAC,SAAS,EAAE,SAAS,CAAA;KAAC,GAAG,IAAI,CAAC;CACrD,CAAC;AAEF,oBAAY,UAAU,GAAG,KAAK,CAAC,UAAU,EAAE,WAAW,CAAC,CAAC;AAExD,eAAO,MAAM,aAAa;;QAGtB;;;WAGG;;;;;;QAKH;;;;;;WAMG;;;;;CAGL,CAAC;AAEH,oBAAY,oBAAoB,GAAG,yBAAyB,GAAG;IAC7D;;;OAGG;IACH,cAAc,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC;IACtC;;;OAGG;IACF,eAAe,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC;CACzC,CAAC;AAEF,oBAAY,gBAAgB,GAAG,oBAAoB,GACjD,OAAO,CAAC,aAAa,CAAC,UAAU,EAAE,WAAW,EAAE,OAAO,aAAa,CAAC,CAAC,CAAC;AAExE,eAAO,MAAM,aAAa,+DA0BzB,CAAC;AAMF,eAAO,MAAM,iBAAiB,+CAGrB,CAAC"}
+{"version":3,"file":"usePopupModel.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/usePopupModel.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAC,SAAS,EAAC,MAAM,iCAAiC,CAAC;AAK1D,eAAO,MAAM,aAAa;IAKtB;;;OAGG;;IAEH;;;OAGG;;;;;;mBA8C+B,SAAS;;QAlC3C;;;WAGG;;QAEH;;;WAGG;;QAEH;;;WAGG;;QAEH;;;WAGG;;QAEH;;;;WAIG;;;;;;QAxBH;;;WAGG;;QAEH;;;WAGG;;QAEH;;;WAGG;;QAEH;;;WAGG;;QAEH;;;;WAIG;;;;;;QAxBH;;;WAGG;;QAEH;;;WAGG;;QAEH;;;WAGG;;QAEH;;;WAGG;;QAEH;;;;WAIG;;;;;;;mBAU+B,SAAS;;QAlC3C;;;WAGG;;QAEH;;;WAGG;;QAEH;;;WAGG;;QAEH;;;WAGG;;QAEH;;;;WAIG;;;;;;QAxBH;;;WAGG;;QAEH;;;WAGG;;QAEH;;;WAGG;;QAEH;;;WAGG;;QAEH;;;;WAIG;;;;;;QAxBH;;;WAGG;;QAEH;;;WAGG;;QAEH;;;WAGG;;QAEH;;;WAGG;;QAEH;;;;WAIG;;;;;;;QAxBH;;;WAGG;;QAEH;;;WAGG;;QAEH;;;WAGG;;QAEH;;;WAGG;;QAEH;;;;WAIG;;;;;;QAMH;;;WAGG;;uBAC+B,SAAS;;;sFA7B3C;;;WAGG;;;IA5BH;;;OAGG;;IAEH;;;OAGG;;;;;IAYH;;;OAGG;;IAEH;;;OAGG;;IAEH;;;OAGG;;IAEH;;;OAGG;;IAEH;;;;OAIG;;;;;IAMH;;;OAGG;;mBAC+B,SAAS;;;kFA7B3C;;;OAGG;;;QARH;;;WAGG;;QAEH;;;WAGG;;QAEH;;;WAGG;;QAEH;;;WAGG;;QAEH;;;;WAIG;;;;;;QAMH;;;WAGG;;uBAC+B,SAAS;;;sFA7B3C;;;WAGG;;EAmCL,CAAC;AAGH,eAAO,MAAM,iBAAiB;;QA9C1B;;;WAGG;;QAEH;;;WAGG;;QAEH;;;WAGG;;QAEH;;;WAGG;;QAEH;;;;WAIG;;;;;;QAMH;;;WAGG;;uBAC+B,SAAS;;;sFA7B3C;;;WAGG;;EAsC+C,CAAC"}

package/dist/es6/popup/lib/hooks/usePopupModel.js

@@ -10,46 +10,69 @@ var __assign = (this && this.__assign) || function () {
     return __assign.apply(this, arguments);
 };
 import * as React from 'react';
-import { createEventMap, useEventMap } from '@workday/canvas-kit-react/common';
-import { useDisclosureModel, disclosureEventMap, } from '@workday/canvas-kit-react/disclosure';
-export var popupEventMap = createEventMap()({
-    guards: __assign(__assign({}, disclosureEventMap.guards), { 
+import { createModelHook } from '@workday/canvas-kit-react/common';
+import { useDisclosureModel } from '@workday/canvas-kit-react/disclosure';
+// eslint-disable-next-line no-empty-function
+var noop = function () { };
+export var usePopupModel = createModelHook({
+    // create enough of a model to use `Popup.Card` without a `Popup` container component.
+    defaultContext: { state: {}, events: { show: noop, hide: noop } },
+    defaultConfig: __assign(__assign({}, useDisclosureModel.defaultConfig), { 
         /**
-         * Determines if the `placement` state should be updated. This might be useful to keep the
-         * animation going a certain direction regardless of placement chosen by PopperJS.
+         * Optional reference to an element that should receive focus when a popup is hidden. If left
+         * blank, focus will return to the `targetRef`
          */
-        shouldUpdatePlacement: 'updatePlacement' }),
-    callbacks: __assign(__assign({}, disclosureEventMap.callbacks), { 
+        returnFocusRef: undefined, 
         /**
-         * Called whenever the placement changes. This callback only fires when placement changes. For
-         * example, if the preferred placement of a Popper is 'bottom' and there's enough room to place
-         * a Popup on the bottom, the Popup will render below a target element without firing this
-         * callback. If there is not enough room and PopperJS chooses to update, this callback will be
-         * called to inform of the change in placement.
+         * 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.
          */
-        onUpdatePlacement: 'updatePlacement' }),
-});
-export var usePopupModel = function (config) {
-    if (config === void 0) { config = {}; }
+        initialFocusRef: undefined }),
+    requiredConfig: useDisclosureModel.requiredConfig,
+})(function (config) {
     var stackRef = React.useRef(null);
     var targetRef = React.useRef(null);
     var _a = React.useState('bottom'), placement = _a[0], setPlacement = _a[1];
     var disclosure = useDisclosureModel(config);
-    var state = __assign(__assign({}, disclosure.state), { stackRef: stackRef,
-        targetRef: targetRef, initialFocusRef: config.initialFocusRef, returnFocusRef: config.returnFocusRef, placement: placement });
-    var events = useEventMap(popupEventMap, state, config, __assign(__assign({}, disclosure.events), { updatePlacement: function (_a) {
-            var placement = _a.placement;
-            setPlacement(placement);
-        } }));
+    var state = __assign(__assign({}, disclosure.state), { 
+        /**
+         * Reference of the stack item used in the PopupStack. This value will be used in all
+         * Popup-related behaviors.
+         */
+        stackRef: stackRef,
+        /**
+         * 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: targetRef, 
+        /**
+         * 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: config.initialFocusRef, 
+        /**
+         * Optional reference to an element that should receive focus when a popup is hidden. If left
+         * blank, focus will return to the `targetRef`
+         */
+        returnFocusRef: config.returnFocusRef, 
+        /**
+         * The placement chosen by the positioning Popper. This should get set prior to showing the popup
+         * content.
+         * @default 'bottom'
+         */
+        placement: placement });
+    var events = __assign(__assign({}, disclosure.events), { 
+        /**
+         * Called whenever a popup placement changes around a target. This is useful for animations that
+         * depend on the placement chosen.
+         */
+        updatePlacement: function (data) {
+            setPlacement(data.placement);
+        } });
     return {
         state: state,
         events: events,
     };
-};
-// eslint-disable-next-line no-empty-function
-var noop = function () { };
-// create enough of a model to use `Popup.Card` without a `Popup` container component.
-export var PopupModelContext = React.createContext({
-    state: {},
-    events: { show: noop, hide: noop },
 });
+// create enough of a model to use `Popup.Card` without a `Popup` container component.
+export var PopupModelContext = usePopupModel.Context;

package/dist/es6/popup/lib/hooks/usePopupPopper.d.ts

@@ -1,12 +1,30 @@
 import React from 'react';
+import { Placement } from '../Popper';
 /**
  * Hooks a Popper up to a PopupModel
  */
-export declare const usePopupPopper: <P extends {}, R>(model: import("../../../common").Model<import("./usePopupModel").PopupState, import("./usePopupModel").PopupEvents>, elemProps?: P | undefined, ref?: ((instance: R | null) => void) | React.RefObject<R> | null | undefined) => {
+export declare const usePopupPopper: <P extends {}, R>(model: {
+    state: {
+        stackRef: React.RefObject<HTMLDivElement>;
+        targetRef: React.RefObject<HTMLButtonElement>;
+        initialFocusRef: React.RefObject<any> | undefined;
+        returnFocusRef: React.RefObject<any> | undefined;
+        placement: import("@popperjs/core").Placement;
+        id: string;
+        visibility: import("../../..").Visibility;
+    };
+    events: {
+        updatePlacement(data: {
+            placement: import("@popperjs/core").Placement;
+        }): void;
+        show(event?: Event | React.SyntheticEvent<Element, Event> | undefined): void;
+        hide(event?: Event | React.SyntheticEvent<Element, Event> | undefined): void;
+    };
+}, elemProps?: P | undefined, ref?: ((instance: R | null) => void) | React.RefObject<R> | null | undefined) => {
     open: boolean;
     anchorElement: React.RefObject<HTMLButtonElement>;
     ref: (instance: any) => void;
-    onPlacementChange: (placement: import("@popperjs/core").Placement) => void;
+    onPlacementChange: (placement: Placement) => void;
 } & P & (R extends HTMLOrSVGElement ? {
     ref: React.Ref<R>;
 } : {});

package/dist/es6/popup/lib/hooks/usePopupPopper.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"usePopupPopper.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/usePopupPopper.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B;;GAEG;AACH,eAAO,MAAM,cAAc;;;;;;;OAkBzB,CAAC"}
+{"version":3,"file":"usePopupPopper.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/usePopupPopper.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAC,SAAS,EAAC,MAAM,WAAW,CAAC;AAEpC;;GAEG;AACH,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;;;;;;;mCAGX,SAAS;;;OAevB,CAAC"}

package/dist/es6/popup/lib/hooks/usePopupPopper.js

@@ -1,9 +1,10 @@
-import { createHook, useForkRef } from '@workday/canvas-kit-react/common';
+import { createElemPropsHook, useForkRef } from '@workday/canvas-kit-react/common';
+import { usePopupModel } from './usePopupModel';
 import React from 'react';
 /**
  * Hooks a Popper up to a PopupModel
  */
-export var usePopupPopper = createHook(function (_a, ref) {
+export var usePopupPopper = createElemPropsHook(usePopupModel)(function (_a, ref) {
     var state = _a.state, events = _a.events;
     var elementRef = useForkRef(ref, state.stackRef);
     var onPlacementChange = React.useCallback(function (placement) {

package/dist/es6/popup/lib/hooks/usePopupStack.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"usePopupStack.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/usePopupStack.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiCG;AACH,eAAO,MAAM,aAAa,wMA8CzB,CAAC"}
+{"version":3,"file":"usePopupStack.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/usePopupStack.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiCG;AACH,eAAO,MAAM,aAAa,4KAGvB,MAAM,SAAS,CAAC,WAAW,CA2C7B,CAAC"}

package/dist/es6/popup/lib/hooks/usePopupTarget.d.ts

@@ -1,10 +1,26 @@
-/// <reference types="@emotion/core" />
 /**
  * Adds the necessary props to a `Target` component. Used by the Popup.Target subcomponent.
  */
-export declare const usePopupTarget: <P extends {}, R>(model: import("../../../common").Model<import("./usePopupModel").PopupState, import("./usePopupModel").PopupEvents>, elemProps?: P | undefined, ref?: ((instance: R | null) => void) | import("react").RefObject<R> | null | undefined) => {
+export declare const usePopupTarget: <P extends {}, R>(model: {
+    state: {
+        stackRef: import("react").RefObject<HTMLDivElement>;
+        targetRef: import("react").RefObject<HTMLButtonElement>;
+        initialFocusRef: import("react").RefObject<any> | undefined;
+        returnFocusRef: import("react").RefObject<any> | undefined;
+        placement: import("@popperjs/core").Placement;
+        id: string;
+        visibility: import("../../..").Visibility;
+    };
+    events: {
+        updatePlacement(data: {
+            placement: import("@popperjs/core").Placement;
+        }): void;
+        show(event?: Event | import("react").SyntheticEvent<Element, Event> | undefined): void;
+        hide(event?: Event | import("react").SyntheticEvent<Element, Event> | undefined): void;
+    };
+}, elemProps?: P | undefined, ref?: ((instance: R | null) => void) | import("react").RefObject<R> | null | undefined) => {
     ref: (instance: any) => void;
-    onClick: (event: import("react").MouseEvent<Element, MouseEvent>) => void;
+    onClick: (event: React.MouseEvent) => void;
 } & P & (R extends HTMLOrSVGElement ? {
     ref: import("react").Ref<R>;
 } : {});

package/dist/es6/popup/lib/hooks/usePopupTarget.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"usePopupTarget.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/usePopupTarget.ts"],"names":[],"mappings":";AAGA;;GAEG;AACH,eAAO,MAAM,cAAc;;;;;OAoBzB,CAAC"}
+{"version":3,"file":"usePopupTarget.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/usePopupTarget.ts"],"names":[],"mappings":"AAGA;;GAEG;AACH,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;;;;;qBAIN,gBAAgB;;;OAgBnC,CAAC"}