@workday/canvas-kit-react 8.0.0-alpha.253-next.22 → 8.0.0-alpha.428-next.2

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

@@ -1 +1 @@
-{"version":3,"file":"useCloseOnEscape.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/useCloseOnEscape.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAO1B;;;;;;GAMG;AACH,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;OA2B3B,CAAC"}
+{"version":3,"file":"useCloseOnEscape.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/useCloseOnEscape.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAO1B;;;;;;GAMG;AACH,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;MA2B3B,CAAC"}

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

@@ -3,27 +3,27 @@ import { PopupStack } from '@workday/canvas-kit-popup-stack';
 import { createElemPropsHook } from '@workday/canvas-kit-react/common';
 import { usePopupModel } from './usePopupModel';
 /**
- * Registers global detection of the Escape key. It will only call the PopupModel's `hide` event if the
- * provided model's `state.stackRef` element is the topmost in the stack.
+ * Registers global detection of the Escape key. It will only call the {@link PopupModel}'s `hide`
+ * event if the provided model's `state.stackRef` element is the topmost in the stack.
  *
  * This should be used with popup elements that are dismissible like Tooltips, Modals, non-modal
  * dialogs, dropdown menus, etc.
  */
-export var useCloseOnEscape = createElemPropsHook(usePopupModel)(function (model) {
-    var onKeyDown = React.useCallback(function (event) {
+export const useCloseOnEscape = createElemPropsHook(usePopupModel)(model => {
+    const onKeyDown = React.useCallback((event) => {
         if ((event.key === 'Esc' || event.key === 'Escape') &&
             PopupStack.isTopmost(model.state.stackRef.current)) {
             model.events.hide(event);
         }
     }, [model.state.stackRef, model.events]);
-    var visible = model.state.visibility !== 'hidden';
+    const visible = model.state.visibility !== 'hidden';
     // `useLayoutEffect` for automation
-    React.useLayoutEffect(function () {
+    React.useLayoutEffect(() => {
         if (!visible) {
             return;
         }
         document.addEventListener('keydown', onKeyDown);
-        return function () {
+        return () => {
             document.removeEventListener('keydown', onKeyDown);
         };
     }, [onKeyDown, visible]);

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

@@ -4,7 +4,7 @@ import React from 'react';
  * the entire screen. This should be added to popup types that are very context sensitive like
  * Tooltips.
  */
-export declare const useCloseOnFullscreenExit: <P extends {}, R>(model: {
+export declare const useCloseOnFullscreenExit: import("@workday/canvas-kit-react/common").BehaviorHook<{
     state: {
         stackRef: React.RefObject<HTMLDivElement>;
         targetRef: React.RefObject<HTMLButtonElement>;
@@ -12,7 +12,7 @@ export declare const useCloseOnFullscreenExit: <P extends {}, R>(model: {
         returnFocusRef: React.RefObject<any> | undefined;
         placement: import("@popperjs/core").Placement;
         id: string;
-        visibility: import("../../..").Visibility;
+        visibility: "hidden" | "visible";
     };
     events: {
         updatePlacement(data: {
@@ -21,7 +21,5 @@ export declare const useCloseOnFullscreenExit: <P extends {}, R>(model: {
         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=useCloseOnFullscreenExit.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"useCloseOnFullscreenExit.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/useCloseOnFullscreenExit.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAO1B;;;;GAIG;AACH,eAAO,MAAM,wBAAwB;;;;;;;;;;;;;;;;;;;OA0BnC,CAAC"}
+{"version":3,"file":"useCloseOnFullscreenExit.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/useCloseOnFullscreenExit.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAO1B;;;;GAIG;AACH,eAAO,MAAM,wBAAwB;;;;;;;;;;;;;;;;;MA0BnC,CAAC"}

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

@@ -7,20 +7,20 @@ import { usePopupModel } from './usePopupModel';
  * the entire screen. This should be added to popup types that are very context sensitive like
  * Tooltips.
  */
-export var useCloseOnFullscreenExit = createElemPropsHook(usePopupModel)(function (model) {
-    var handler = React.useCallback(function (event) {
+export const useCloseOnFullscreenExit = createElemPropsHook(usePopupModel)(model => {
+    const handler = React.useCallback((event) => {
         if (!screenfull.isFullscreen) {
             model.events.hide(event);
         }
     }, [model.events]);
-    var visible = model.state.visibility !== 'hidden';
-    React.useEffect(function () {
+    const visible = model.state.visibility !== 'hidden';
+    React.useEffect(() => {
         if (!visible) {
             return;
         }
         if (screenfull.isEnabled) {
             screenfull.on('change', handler);
-            return function () {
+            return () => {
                 screenfull.off('change', handler);
             };
         }

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

@@ -1,15 +1,15 @@
 import React from 'react';
 /**
- * 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
- * provided `stackRef` element is the topmost element with this behavior applied in the stack. Adds
- * a `data-behavior-click-outside-close="topmost"` attribute to ensure proper functionality.
+ * Registers global listener for all clicks. It will only call the {@link PopupModel}'s `hide` event
+ * if the click happened outside the PopupModel's `state.stackRef` element and its children _and_
+ * the provided `stackRef` element is the topmost element with this behavior applied in the stack.
+ * Adds a `data-behavior-click-outside-close="topmost"` attribute to ensure proper functionality.
  *
  * This should be used with popup elements that are dismissible like Modals, non-modal dialogs,
- * dropdown menus, etc. Tooltips and hierarchical menus should use `useAlwaysCloseOnClickOutside`
- * instead.
+ * dropdown menus, etc. Tooltips and hierarchical menus should use
+ * {@link useAlwaysCloseOnClickOutside} instead.
  */
-export declare const useCloseOnOutsideClick: <P extends {}, R>(model: {
+export declare const useCloseOnOutsideClick: import("@workday/canvas-kit-react/common").BehaviorHook<{
     state: {
         stackRef: React.RefObject<HTMLDivElement>;
         targetRef: React.RefObject<HTMLButtonElement>;
@@ -17,7 +17,7 @@ export declare const useCloseOnOutsideClick: <P extends {}, R>(model: {
         returnFocusRef: React.RefObject<any> | undefined;
         placement: import("@popperjs/core").Placement;
         id: string;
-        visibility: import("../../..").Visibility;
+        visibility: "hidden" | "visible";
     };
     events: {
         updatePlacement(data: {
@@ -26,7 +26,5 @@ export declare const useCloseOnOutsideClick: <P extends {}, R>(model: {
         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=useCloseOnOutsideClick.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"useCloseOnOutsideClick.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/useCloseOnOutsideClick.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAO1B;;;;;;;;;GASG;AACH,eAAO,MAAM,sBAAsB;;;;;;;;;;;;;;;;;;;OAsCjC,CAAC"}
+{"version":3,"file":"useCloseOnOutsideClick.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/useCloseOnOutsideClick.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAO1B;;;;;;;;;GASG;AACH,eAAO,MAAM,sBAAsB;;;;;;;;;;;;;;;;;MAsCjC,CAAC"}

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

@@ -3,23 +3,23 @@ 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
- * provided `stackRef` element is the topmost element with this behavior applied in the stack. Adds
- * a `data-behavior-click-outside-close="topmost"` attribute to ensure proper functionality.
+ * Registers global listener for all clicks. It will only call the {@link PopupModel}'s `hide` event
+ * if the click happened outside the PopupModel's `state.stackRef` element and its children _and_
+ * the provided `stackRef` element is the topmost element with this behavior applied in the stack.
+ * Adds a `data-behavior-click-outside-close="topmost"` attribute to ensure proper functionality.
  *
  * This should be used with popup elements that are dismissible like Modals, non-modal dialogs,
- * dropdown menus, etc. Tooltips and hierarchical menus should use `useAlwaysCloseOnClickOutside`
- * instead.
+ * dropdown menus, etc. Tooltips and hierarchical menus should use
+ * {@link useAlwaysCloseOnClickOutside} instead.
  */
-export var useCloseOnOutsideClick = createElemPropsHook(usePopupModel)(function (model) {
-    var onClick = React.useCallback(function (event) {
+export const useCloseOnOutsideClick = createElemPropsHook(usePopupModel)(model => {
+    const onClick = React.useCallback((event) => {
         if (!model.state.stackRef.current) {
             return;
         }
-        var elements = PopupStack.getElements()
-            .filter(function (e) { return e.getAttribute('data-behavior-click-outside-close') === 'topmost'; })
-            .sort(function (a, b) { return Number(a.style.zIndex) - Number(b.style.zIndex); });
+        const elements = PopupStack.getElements()
+            .filter(e => e.getAttribute('data-behavior-click-outside-close') === 'topmost')
+            .sort((a, b) => Number(a.style.zIndex) - Number(b.style.zIndex));
         if (elements.length &&
             elements[elements.length - 1] === model.state.stackRef.current &&
             // Use `PopupStack.contains` instead of `ref.current.contains` so that the application can
@@ -29,15 +29,15 @@ export var useCloseOnOutsideClick = createElemPropsHook(usePopupModel)(function
             model.events.hide(event);
         }
     }, [model.state.stackRef, model.events]);
-    var visible = model.state.visibility !== 'hidden';
-    React.useLayoutEffect(function () {
+    const visible = model.state.visibility !== 'hidden';
+    React.useLayoutEffect(() => {
         var _a;
         if (!visible) {
             return;
         }
         document.addEventListener('mousedown', onClick);
         (_a = model.state.stackRef.current) === null || _a === void 0 ? void 0 : _a.setAttribute('data-behavior-click-outside-close', 'topmost');
-        return function () {
+        return () => {
             document.removeEventListener('mousedown', onClick);
         };
     }, [model.state.stackRef, visible, onClick]);

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

@@ -8,7 +8,7 @@ import React from 'react';
  *
  * This should be used with popup elements that are transitory like Tooltips and dropdown menus.
  */
-export declare const useCloseOnTargetHidden: <P extends {}, R>(model: {
+export declare const useCloseOnTargetHidden: import("@workday/canvas-kit-react/common").BehaviorHook<{
     state: {
         stackRef: React.RefObject<HTMLDivElement>;
         targetRef: React.RefObject<HTMLButtonElement>;
@@ -16,7 +16,7 @@ export declare const useCloseOnTargetHidden: <P extends {}, R>(model: {
         returnFocusRef: React.RefObject<any> | undefined;
         placement: import("@popperjs/core").Placement;
         id: string;
-        visibility: import("../../..").Visibility;
+        visibility: "hidden" | "visible";
     };
     events: {
         updatePlacement(data: {
@@ -25,7 +25,5 @@ export declare const useCloseOnTargetHidden: <P extends {}, R>(model: {
         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=useCloseOnTargetHidden.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"useCloseOnTargetHidden.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/useCloseOnTargetHidden.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAuB1B;;;;;;;;GAQG;AACH,eAAO,MAAM,sBAAsB;;;;;;;;;;;;;;;;;;;OAiCjC,CAAC"}
+{"version":3,"file":"useCloseOnTargetHidden.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/useCloseOnTargetHidden.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAuB1B;;;;;;;;GAQG;AACH,eAAO,MAAM,sBAAsB;;;;;;;;;;;;;;;;;MAiCjC,CAAC"}

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

@@ -5,7 +5,7 @@ function getScrollParent(element) {
     if (element === document.body || !element.parentElement) {
         return element;
     }
-    var styles = getComputedStyle(element);
+    const styles = getComputedStyle(element);
     if (styles.overflowY === 'scroll' ||
         styles.overflowY === 'auto' ||
         styles.overflowX === 'scroll' ||
@@ -23,26 +23,26 @@ function getScrollParent(element) {
  *
  * This should be used with popup elements that are transitory like Tooltips and dropdown menus.
  */
-export var useCloseOnTargetHidden = createElemPropsHook(usePopupModel)(function (model) {
-    var visible = model.state.visibility !== 'hidden';
-    var callback = React.useCallback(function (entries) {
+export const useCloseOnTargetHidden = createElemPropsHook(usePopupModel)(model => {
+    const visible = model.state.visibility !== 'hidden';
+    const callback = React.useCallback(entries => {
         if (entries[0].intersectionRatio < 0.5) {
             model.events.hide();
         }
     }, [model.events]);
-    React.useLayoutEffect(function () {
+    React.useLayoutEffect(() => {
         if (!visible || !model.state.targetRef.current) {
             return;
         }
-        var target = model.state.targetRef.current;
-        var scrollParent = getScrollParent(target);
+        const target = model.state.targetRef.current;
+        const scrollParent = getScrollParent(target);
         // eslint-disable-next-line compat/compat
-        var observer = new IntersectionObserver(callback, {
+        const observer = new IntersectionObserver(callback, {
             root: scrollParent,
             threshold: 0.5,
         });
         observer.observe(model.state.targetRef.current);
-        return function () {
+        return () => {
             observer.disconnect();
         };
     }, [callback, model.state.targetRef, visible]);

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

@@ -6,7 +6,7 @@ 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 declare const useDisableBodyScroll: <P extends {}, R>(model: {
+export declare const useDisableBodyScroll: import("@workday/canvas-kit-react/common").BehaviorHook<{
     state: {
         stackRef: React.RefObject<HTMLDivElement>;
         targetRef: React.RefObject<HTMLButtonElement>;
@@ -14,7 +14,7 @@ export declare const useDisableBodyScroll: <P extends {}, R>(model: {
         returnFocusRef: React.RefObject<any> | undefined;
         placement: import("@popperjs/core").Placement;
         id: string;
-        visibility: import("../../..").Visibility;
+        visibility: "hidden" | "visible";
     };
     events: {
         updatePlacement(data: {
@@ -23,7 +23,5 @@ export declare const useDisableBodyScroll: <P extends {}, R>(model: {
         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":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B;;;;;;GAMG;AACH,eAAO,MAAM,oBAAoB;;;;;;;;;;;;;;;;;;;OAwB/B,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;;;;;;;;;;;;;;;;;MAwB/B,CAAC"}

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

@@ -8,19 +8,19 @@ import { usePopupModel } 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 var useDisableBodyScroll = createElemPropsHook(usePopupModel)(function (model) {
-    var visible = model.state.visibility !== 'hidden';
-    React.useLayoutEffect(function () {
+export const useDisableBodyScroll = createElemPropsHook(usePopupModel)(model => {
+    const visible = model.state.visibility !== 'hidden';
+    React.useLayoutEffect(() => {
         if (!visible) {
             return;
         }
-        var overflowY = document.body.style.overflowY;
-        var overflowX = document.body.style.overflowX;
-        var overflow = document.body.style.overflow;
+        const overflowY = document.body.style.overflowY;
+        const overflowX = document.body.style.overflowX;
+        const overflow = document.body.style.overflow;
         document.body.style.overflow = 'hidden';
         document.body.style.overflowY = 'hidden';
         document.body.style.overflowX = 'hidden';
-        return function () {
+        return () => {
             document.body.style.overflow = overflow;
             document.body.style.overflowY = overflowY;
             document.body.style.overflowX = overflowX;

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

@@ -11,7 +11,7 @@ import React from 'react';
  *
  * This should be used with non-modal dialogs.
  */
-export declare const useFocusRedirect: <P extends {}, R>(model: {
+export declare const useFocusRedirect: import("@workday/canvas-kit-react/common").BehaviorHook<{
     state: {
         stackRef: React.RefObject<HTMLDivElement>;
         targetRef: React.RefObject<HTMLButtonElement>;
@@ -19,7 +19,7 @@ export declare const useFocusRedirect: <P extends {}, R>(model: {
         returnFocusRef: React.RefObject<any> | undefined;
         placement: import("@popperjs/core").Placement;
         id: string;
-        visibility: import("../../..").Visibility;
+        visibility: "hidden" | "visible";
     };
     events: {
         updatePlacement(data: {
@@ -28,7 +28,5 @@ export declare const useFocusRedirect: <P extends {}, R>(model: {
         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":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAU1B;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;OAoC3B,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;;;;;;;;;;;;;;;;;MAoC3B,CAAC"}

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

@@ -13,11 +13,11 @@ import { usePopupModel } from './usePopupModel';
  *
  * This should be used with non-modal dialogs.
  */
-export var useFocusRedirect = createElemPropsHook(usePopupModel)(function (model) {
-    var onKeyDown = React.useCallback(function (event) {
+export const useFocusRedirect = createElemPropsHook(usePopupModel)(model => {
+    const onKeyDown = React.useCallback((event) => {
         if (model.state.stackRef.current && event.key === 'Tab') {
-            var firstFocusableElement = getFirstFocusableElement(model.state.stackRef.current);
-            var lastFocusableElement = getLastFocusableElement(model.state.stackRef.current);
+            const firstFocusableElement = getFirstFocusableElement(model.state.stackRef.current);
+            const lastFocusableElement = getLastFocusableElement(model.state.stackRef.current);
             if (event.getModifierState('Shift') && document.activeElement === firstFocusableElement) {
                 event.preventDefault();
                 model.events.hide(event);
@@ -28,14 +28,14 @@ export var useFocusRedirect = createElemPropsHook(usePopupModel)(function (model
             }
         }
     }, [model.events, model.state.stackRef]);
-    var visible = model.state.visibility !== 'hidden';
+    const visible = model.state.visibility !== 'hidden';
     // `useLayoutEffect` for automation
-    React.useLayoutEffect(function () {
+    React.useLayoutEffect(() => {
         if (!visible) {
             return;
         }
         document.addEventListener('keydown', onKeyDown);
-        return function () {
+        return () => {
             document.removeEventListener('keydown', onKeyDown);
         };
     }, [visible, onKeyDown]);

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

@@ -8,7 +8,7 @@ import React from 'react';
  *
  * This should be used on popup elements that need to hide content (i.e. Modals).
  */
-export declare const useFocusTrap: <P extends {}, R>(model: {
+export declare const useFocusTrap: import("@workday/canvas-kit-react/common").BehaviorHook<{
     state: {
         stackRef: React.RefObject<HTMLDivElement>;
         targetRef: React.RefObject<HTMLButtonElement>;
@@ -16,7 +16,7 @@ export declare const useFocusTrap: <P extends {}, R>(model: {
         returnFocusRef: React.RefObject<any> | undefined;
         placement: import("@popperjs/core").Placement;
         id: string;
-        visibility: import("../../..").Visibility;
+        visibility: "hidden" | "visible";
     };
     events: {
         updatePlacement(data: {
@@ -25,7 +25,5 @@ export declare const useFocusTrap: <P extends {}, R>(model: {
         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":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAO1B;;;;;;;;GAQG;AACH,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;;OAwBvB,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;;;;;;;;;;;;;;;;;MAwBvB,CAAC"}

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

@@ -11,20 +11,20 @@ import { usePopupModel } from './usePopupModel';
  *
  * This should be used on popup elements that need to hide content (i.e. Modals).
  */
-export var useFocusTrap = createElemPropsHook(usePopupModel)(function (model) {
-    var onKeyDown = React.useCallback(function (event) {
+export const useFocusTrap = createElemPropsHook(usePopupModel)(model => {
+    const onKeyDown = React.useCallback((event) => {
         if (model.state.stackRef.current) {
             tabTrappingKey(event, model.state.stackRef.current);
         }
     }, [model.state.stackRef]);
-    var visible = model.state.visibility !== 'hidden';
+    const visible = model.state.visibility !== 'hidden';
     // `useLayoutEffect` for automation
-    React.useLayoutEffect(function () {
+    React.useLayoutEffect(() => {
         if (!visible) {
             return;
         }
         document.addEventListener('keydown', onKeyDown);
-        return function () {
+        return () => {
             document.removeEventListener('keydown', onKeyDown);
         };
     }, [visible, onKeyDown]);

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

@@ -1,13 +1,13 @@
 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
- * complete focus management solution.
+ * screen reader users alike. This should be used with {@link useFocusRedirect} or
+ * {@link useFocusTrap} for a complete focus management solution.
  *
  * This should be used for popups that have focusable elements inside, like Modals, non-modal
  * dialogs, menus, etc.
  */
-export declare const useInitialFocus: <P extends {}, R>(model: {
+export declare const useInitialFocus: import("@workday/canvas-kit-react/common").BehaviorHook<{
     state: {
         stackRef: React.RefObject<HTMLDivElement>;
         targetRef: React.RefObject<HTMLButtonElement>;
@@ -15,7 +15,7 @@ export declare const useInitialFocus: <P extends {}, R>(model: {
         returnFocusRef: React.RefObject<any> | undefined;
         placement: import("@popperjs/core").Placement;
         id: string;
-        visibility: import("../../..").Visibility;
+        visibility: "hidden" | "visible";
     };
     events: {
         updatePlacement(data: {
@@ -24,7 +24,5 @@ export declare const useInitialFocus: <P extends {}, R>(model: {
         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":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAW1B;;;;;;;GAOG;AACH,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;;;;;OAwB1B,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;;;;;;;;;;;;;;;;;MAwB1B,CAAC"}

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

@@ -3,25 +3,25 @@ import { changeFocus, assert, getFirstFocusableElement, createElemPropsHook, } f
 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
- * complete focus management solution.
+ * screen reader users alike. This should be used with {@link useFocusRedirect} or
+ * {@link useFocusTrap} for a complete focus management solution.
  *
  * This should be used for popups that have focusable elements inside, like Modals, non-modal
  * dialogs, menus, etc.
  */
-export var useInitialFocus = createElemPropsHook(usePopupModel)(function (model) {
-    var visible = model.state.visibility !== 'hidden';
+export const useInitialFocus = createElemPropsHook(usePopupModel)(model => {
+    const 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
     // top of the page.
-    React.useEffect(function () {
+    React.useEffect(() => {
         var _a;
         if (visible && model.state.stackRef.current) {
-            var element_1 = ((_a = model.state.initialFocusRef) === null || _a === void 0 ? void 0 : _a.current) ||
+            const element = ((_a = model.state.initialFocusRef) === null || _a === void 0 ? void 0 : _a.current) ||
                 getFirstFocusableElement(model.state.stackRef.current);
-            assert(element_1, 'No focusable element was found. Please ensure popup has at least one focusable element');
-            requestAnimationFrame(function () {
-                changeFocus(element_1);
+            assert(element, 'No focusable element was found. Please ensure popup has at least one focusable element');
+            requestAnimationFrame(() => {
+                changeFocus(element);
             });
         }
     }, [model.state.initialFocusRef, model.state.stackRef, visible]);

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

@@ -1,7 +1,7 @@
 /**
- * Adds the necessary props to a `Card` component. Used by the `Popup.Card` subcomponent.
+ * Adds the necessary props to a {@link PopupCard Popup.Card} subcomponent.
  */
-export declare const usePopupCard: <P extends {}, R>(model: {
+export declare const usePopupCard: import("@workday/canvas-kit-react/common").BehaviorHook<{
     state: {
         stackRef: import("react").RefObject<HTMLDivElement>;
         targetRef: import("react").RefObject<HTMLButtonElement>;
@@ -9,7 +9,7 @@ export declare const usePopupCard: <P extends {}, R>(model: {
         returnFocusRef: import("react").RefObject<any> | undefined;
         placement: import("@popperjs/core").Placement;
         id: string;
-        visibility: import("../../..").Visibility;
+        visibility: "hidden" | "visible";
     };
     events: {
         updatePlacement(data: {
@@ -18,10 +18,8 @@ export declare const usePopupCard: <P extends {}, R>(model: {
         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 ? {
-    ref: import("react").Ref<R>;
-} : {});
+}>;
 //# sourceMappingURL=usePopupCard.d.ts.map

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":"AAIA;;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;;;;;;;;;;;;;;;;;;;;EAKvB,CAAC"}

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

@@ -1,10 +1,9 @@
 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.
+ * Adds the necessary props to a {@link PopupCard Popup.Card} subcomponent.
  */
-export var usePopupCard = createElemPropsHook(usePopupModel)(function (_a) {
-    var state = _a.state;
+export const usePopupCard = createElemPropsHook(usePopupModel)(({ state }) => {
     return {
         role: 'dialog',
         'aria-labelledby': state.id,