@workday/canvas-kit-react 7.0.0-alpha.0-next.7 → 7.0.0-alpha.100-next.25

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

@@ -1,5 +1,7 @@
 import React from 'react';
 import { PopupStack } from '@workday/canvas-kit-popup-stack';
+import { createElemPropsHook } from '@workday/canvas-kit-react/common';
+import { usePopupModel } from './usePopupModel';
 /**
  * Registers global listener for all clicks. It will only call the PopupModel's `hide` event if the
  * click happened outside the PopupModel's `state.stackRef` element and its children _and_ the
@@ -10,8 +12,7 @@ import { PopupStack } from '@workday/canvas-kit-popup-stack';
  * dropdown menus, etc. Tooltips and hierarchical menus should use `useAlwaysCloseOnClickOutside`
  * instead.
  */
-export var useCloseOnOutsideClick = function (model, elemProps) {
-    if (elemProps === void 0) { elemProps = {}; }
+export var useCloseOnOutsideClick = createElemPropsHook(usePopupModel)(function (model) {
     var onClick = React.useCallback(function (event) {
         if (!model.state.stackRef.current) {
             return;
@@ -25,7 +26,7 @@ export var useCloseOnOutsideClick = function (model, elemProps) {
             // decide if clicking the target should toggle the popup rather than it toggling implicitly
             // because the target is outside `ref.current`
             !PopupStack.contains(model.state.stackRef.current, event.target)) {
-            model.events.hide({ event: event });
+            model.events.hide(event);
         }
     }, [model.state.stackRef, model.events]);
     var visible = model.state.visibility !== 'hidden';
@@ -40,5 +41,5 @@ export var useCloseOnOutsideClick = function (model, elemProps) {
             document.removeEventListener('mousedown', onClick);
         };
     }, [model.state.stackRef, visible, onClick]);
-    return elemProps;
-};
+    return {};
+});

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

@@ -1,4 +1,4 @@
-import { PopupModel } from './usePopupModel';
+import React from 'react';
 /**
  * Disables body scroll by adding `overflow: hidden` to the body element. This effectively prevents
  * page scrolling while the popup is visible.
@@ -6,5 +6,24 @@ import { PopupModel } from './usePopupModel';
  * This should be used with popup elements that hide all other content and force the user to accept
  * or dismiss the popup before continuing (i.e. Modals).
  */
-export declare const useDisableBodyScroll: (model: PopupModel, elemProps?: {}) => {};
+export declare const useDisableBodyScroll: <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) => {} & P & (R extends HTMLOrSVGElement ? {
+    ref: React.Ref<R>;
+} : {});
 //# sourceMappingURL=useDisableBodyScroll.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"useDisableBodyScroll.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/useDisableBodyScroll.ts"],"names":[],"mappings":"AAEA,OAAO,EAAC,UAAU,EAAC,MAAM,iBAAiB,CAAC;AAE3C;;;;;;GAMG;AACH,eAAO,MAAM,oBAAoB,UAAW,UAAU,uBAgBrD,CAAC"}
+{"version":3,"file":"useDisableBodyScroll.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/useDisableBodyScroll.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B;;;;;;GAMG;AACH,eAAO,MAAM,oBAAoB;;;;;;;;;;;;;;;;;;;OAsB/B,CAAC"}

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

@@ -1,4 +1,6 @@
 import React from 'react';
+import { createElemPropsHook } from '@workday/canvas-kit-react/common';
+import { usePopupModel } from './usePopupModel';
 /**
  * Disables body scroll by adding `overflow: hidden` to the body element. This effectively prevents
  * page scrolling while the popup is visible.
@@ -6,18 +8,21 @@ import React from 'react';
  * This should be used with popup elements that hide all other content and force the user to accept
  * or dismiss the popup before continuing (i.e. Modals).
  */
-export var useDisableBodyScroll = function (model, elemProps) {
-    if (elemProps === void 0) { elemProps = {}; }
+export var useDisableBodyScroll = createElemPropsHook(usePopupModel)(function (model) {
     var visible = model.state.visibility !== 'hidden';
     React.useLayoutEffect(function () {
         if (!visible) {
             return;
         }
+        var overflowY = document.body.style.overflowY;
+        var overflowX = document.body.style.overflowX;
         var overflow = document.body.style.overflow;
         document.body.style.overflow = 'hidden';
         return function () {
             document.body.style.overflow = overflow;
+            document.body.style.overflowY = overflowY;
+            document.body.style.overflowX = overflowX;
         };
     }, [visible]);
-    return elemProps;
-};
+    return {};
+});

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

@@ -1,4 +1,4 @@
-import { PopupModel } from './usePopupModel';
+import React from 'react';
 /**
  * Manages focus around a popup, treating the popup as if it was part of the DOM where it appears.
  * Popups are typically "portalled" (inserted at the end of `document.body`) to ensure proper
@@ -11,5 +11,24 @@ import { PopupModel } from './usePopupModel';
  *
  * This should be used with non-modal dialogs.
  */
-export declare const useFocusRedirect: (model: PopupModel, elemProps?: {}) => {};
+export declare const useFocusRedirect: <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) => {} & P & (R extends HTMLOrSVGElement ? {
+    ref: React.Ref<R>;
+} : {});
 //# sourceMappingURL=useFocusRedirect.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"useFocusRedirect.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/useFocusRedirect.ts"],"names":[],"mappings":"AAEA,OAAO,EAAC,UAAU,EAAC,MAAM,iBAAiB,CAAC;AAG3C;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,gBAAgB,UAAW,UAAU,uBAoCjD,CAAC"}
+{"version":3,"file":"useFocusRedirect.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/useFocusRedirect.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAU1B;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;OAoC3B,CAAC"}

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

@@ -1,5 +1,6 @@
 import React from 'react';
-import { getFirstFocusableElement, getLastFocusableElement } from '@workday/canvas-kit-react/common';
+import { createElemPropsHook, getFirstFocusableElement, getLastFocusableElement, } from '@workday/canvas-kit-react/common';
+import { usePopupModel } from './usePopupModel';
 /**
  * Manages focus around a popup, treating the popup as if it was part of the DOM where it appears.
  * Popups are typically "portalled" (inserted at the end of `document.body`) to ensure proper
@@ -12,19 +13,18 @@ import { getFirstFocusableElement, getLastFocusableElement } from '@workday/canv
  *
  * This should be used with non-modal dialogs.
  */
-export var useFocusRedirect = function (model, elemProps) {
-    if (elemProps === void 0) { elemProps = {}; }
+export var useFocusRedirect = createElemPropsHook(usePopupModel)(function (model) {
     var onKeyDown = React.useCallback(function (event) {
         if (model.state.stackRef.current && event.key === 'Tab') {
             var firstFocusableElement = getFirstFocusableElement(model.state.stackRef.current);
             var lastFocusableElement = getLastFocusableElement(model.state.stackRef.current);
             if (event.getModifierState('Shift') && document.activeElement === firstFocusableElement) {
                 event.preventDefault();
-                model.events.hide({ event: event });
+                model.events.hide(event);
             }
             else if (!event.getModifierState('Shift') &&
                 document.activeElement === lastFocusableElement) {
-                model.events.hide({ event: event });
+                model.events.hide(event);
             }
         }
     }, [model.events, model.state.stackRef]);
@@ -39,5 +39,5 @@ export var useFocusRedirect = function (model, elemProps) {
             document.removeEventListener('keydown', onKeyDown);
         };
     }, [visible, onKeyDown]);
-    return elemProps;
-};
+    return {};
+});

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

@@ -1,4 +1,4 @@
-import { PopupModel } from './usePopupModel';
+import React from 'react';
 /**
  * "Trap" or "loop" focus within a provided `stackRef` element. This is required for accessibility
  * on modals. If a keyboard users hits the Tab or Shift + Tab, this will force "looping" of focus.
@@ -8,5 +8,24 @@ import { PopupModel } from './usePopupModel';
  *
  * This should be used on popup elements that need to hide content (i.e. Modals).
  */
-export declare const useFocusTrap: (model: PopupModel, elemProps?: {}) => {};
+export declare const useFocusTrap: <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) => {} & P & (R extends HTMLOrSVGElement ? {
+    ref: React.Ref<R>;
+} : {});
 //# sourceMappingURL=useFocusTrap.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"useFocusTrap.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/useFocusTrap.ts"],"names":[],"mappings":"AAGA,OAAO,EAAC,UAAU,EAAC,MAAM,iBAAiB,CAAC;AAE3C;;;;;;;;GAQG;AACH,eAAO,MAAM,YAAY,UAAW,UAAU,uBAwB7C,CAAC"}
+{"version":3,"file":"useFocusTrap.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/useFocusTrap.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAO1B;;;;;;;;GAQG;AACH,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;;OAwBvB,CAAC"}

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

@@ -1,5 +1,7 @@
 import React from 'react';
 import { tabTrappingKey } from './focus-trap-js';
+import { createElemPropsHook } from '@workday/canvas-kit-react/common';
+import { usePopupModel } from './usePopupModel';
 /**
  * "Trap" or "loop" focus within a provided `stackRef` element. This is required for accessibility
  * on modals. If a keyboard users hits the Tab or Shift + Tab, this will force "looping" of focus.
@@ -9,8 +11,7 @@ import { tabTrappingKey } from './focus-trap-js';
  *
  * This should be used on popup elements that need to hide content (i.e. Modals).
  */
-export var useFocusTrap = function (model, elemProps) {
-    if (elemProps === void 0) { elemProps = {}; }
+export var useFocusTrap = createElemPropsHook(usePopupModel)(function (model) {
     var onKeyDown = React.useCallback(function (event) {
         if (model.state.stackRef.current) {
             tabTrappingKey(event, model.state.stackRef.current);
@@ -27,5 +28,5 @@ export var useFocusTrap = function (model, elemProps) {
             document.removeEventListener('keydown', onKeyDown);
         };
     }, [visible, onKeyDown]);
-    return elemProps;
-};
+    return {};
+});

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

@@ -1,4 +1,4 @@
-import { PopupModel } from './usePopupModel';
+import React from 'react';
 /**
  * Moves focus within the popup when the popup becomes visible. This is useful for keyboard and
  * screen reader users alike. This should be used with `useFocusRedirect` or `useFocusTrap` for a
@@ -7,5 +7,24 @@ import { PopupModel } from './usePopupModel';
  * This should be used for popups that have focusable elements inside, like Modals, non-modal
  * dialogs, menus, etc.
  */
-export declare const useInitialFocus: (model: PopupModel, elemProps?: {}) => {};
+export declare const useInitialFocus: <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) => {} & P & (R extends HTMLOrSVGElement ? {
+    ref: React.Ref<R>;
+} : {});
 //# sourceMappingURL=useInitialFocus.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"useInitialFocus.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/useInitialFocus.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAC,UAAU,EAAC,MAAM,iBAAiB,CAAC;AAE3C;;;;;;;GAOG;AACH,eAAO,MAAM,eAAe,UAAW,UAAU,uBAwBhD,CAAC"}
+{"version":3,"file":"useInitialFocus.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/useInitialFocus.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAW1B;;;;;;;GAOG;AACH,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;;;;;OAwB1B,CAAC"}

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

@@ -1,5 +1,6 @@
 import React from 'react';
-import { changeFocus, assert, getFirstFocusableElement } from '@workday/canvas-kit-react/common';
+import { changeFocus, assert, getFirstFocusableElement, createElemPropsHook, } from '@workday/canvas-kit-react/common';
+import { usePopupModel } from './usePopupModel';
 /**
  * Moves focus within the popup when the popup becomes visible. This is useful for keyboard and
  * screen reader users alike. This should be used with `useFocusRedirect` or `useFocusTrap` for a
@@ -8,8 +9,7 @@ import { changeFocus, assert, getFirstFocusableElement } from '@workday/canvas-k
  * This should be used for popups that have focusable elements inside, like Modals, non-modal
  * dialogs, menus, etc.
  */
-export var useInitialFocus = function (model, elemProps) {
-    if (elemProps === void 0) { elemProps = {}; }
+export var useInitialFocus = createElemPropsHook(usePopupModel)(function (model) {
     var visible = model.state.visibility !== 'hidden';
     // Using `useEffect` instead of `useLayoutEffect` so that focus doesn't change _before_ PopperJS
     // has positioned the Popup. If we change focus before positioning, the browser will scroll to the
@@ -25,5 +25,5 @@ export var useInitialFocus = function (model, elemProps) {
             });
         }
     }, [model.state.initialFocusRef, model.state.stackRef, visible]);
-    return elemProps;
-};
+    return {};
+});

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

@@ -1,7 +1,24 @@
 /**
  * Adds the necessary props to a `Card` component. Used by the `Popup.Card` subcomponent.
  */
-export declare const usePopupCard: <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 usePopupCard: <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) => {
     role: string;
     'aria-labelledby': string;
 } & P & (R extends HTMLOrSVGElement ? {

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

@@ -1 +1 @@
-{"version":3,"file":"usePopupCard.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/usePopupCard.ts"],"names":[],"mappings":"AAGA;;GAEG;AACH,eAAO,MAAM,YAAY;;;;;OAKvB,CAAC"}
+{"version":3,"file":"usePopupCard.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/usePopupCard.ts"],"names":[],"mappings":"AAIA;;GAEG;AACH,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;OAKvB,CAAC"}

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

@@ -1,8 +1,9 @@
-import { createHook } from '@workday/canvas-kit-react/common';
+import { createElemPropsHook } from '@workday/canvas-kit-react/common';
+import { usePopupModel } from './usePopupModel';
 /**
  * Adds the necessary props to a `Card` component. Used by the `Popup.Card` subcomponent.
  */
-export var usePopupCard = createHook(function (_a) {
+export var usePopupCard = createElemPropsHook(usePopupModel)(function (_a) {
     var state = _a.state;
     return {
         role: 'dialog',

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

@@ -2,8 +2,25 @@
  * Adds the necessary props to a close button component. Used by the `Popup.CloseButton`
  * subcomponent and `Popup.CloseIcon` subcomponent.
  */
-export declare const usePopupCloseButton: <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) => {
-    onClick: (event: React.MouseEvent) => void;
+export declare const usePopupCloseButton: <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) => {
+    onClick: (event?: Event | import("react").SyntheticEvent<Element, Event> | undefined) => void;
 } & P & (R extends HTMLOrSVGElement ? {
     ref: import("react").Ref<R>;
 } : {});

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

@@ -1 +1 @@
-{"version":3,"file":"usePopupCloseButton.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/usePopupCloseButton.ts"],"names":[],"mappings":"AAGA;;;GAGG;AACH,eAAO,MAAM,mBAAmB;qBAEX,gBAAgB;;;OAInC,CAAC"}
+{"version":3,"file":"usePopupCloseButton.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/usePopupCloseButton.ts"],"names":[],"mappings":"AAGA;;;GAGG;AACH,eAAO,MAAM,mBAAmB;;;;;;;;;;;;;;;;;;;;;OAI9B,CAAC"}

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

@@ -1,13 +1,12 @@
-import { createHook } from '@workday/canvas-kit-react/common';
+import { createElemPropsHook } from '@workday/canvas-kit-react/common';
+import { usePopupModel } from './usePopupModel';
 /**
  * Adds the necessary props to a close button component. Used by the `Popup.CloseButton`
  * subcomponent and `Popup.CloseIcon` subcomponent.
  */
-export var usePopupCloseButton = createHook(function (_a) {
+export var usePopupCloseButton = createElemPropsHook(usePopupModel)(function (_a) {
     var events = _a.events;
     return {
-        onClick: function (event) {
-            events.hide({ event: event });
-        },
+        onClick: events.hide,
     };
 });

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

@@ -1,7 +1,24 @@
 /**
  * Adds the necessary props to the `Heading` component. Used by the `Popup.Heading` subcomponent.
  */
-export declare const usePopupHeading: <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 usePopupHeading: <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) => {
     id: string;
 } & P & (R extends HTMLOrSVGElement ? {
     ref: import("react").Ref<R>;

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

@@ -1 +1 @@
-{"version":3,"file":"usePopupHeading.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/usePopupHeading.ts"],"names":[],"mappings":"AAGA;;GAEG;AACH,eAAO,MAAM,eAAe;;;;OAI1B,CAAC"}
+{"version":3,"file":"usePopupHeading.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/usePopupHeading.ts"],"names":[],"mappings":"AAGA;;GAEG;AACH,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;OAI1B,CAAC"}

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

@@ -1,8 +1,9 @@
-import { createHook } from '@workday/canvas-kit-react/common';
+import { createElemPropsHook } from '@workday/canvas-kit-react/common';
+import { usePopupModel } from './usePopupModel';
 /**
  * Adds the necessary props to the `Heading` component. Used by the `Popup.Heading` subcomponent.
  */
-export var usePopupHeading = createHook(function (_a) {
+export var usePopupHeading = createElemPropsHook(usePopupModel)(function (_a) {
     var state = _a.state;
     return {
         id: state.id,