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

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

@@ -1,7 +1,7 @@
 /**
  * Adds the necessary props to a `Target` component. Used by the Popup.Target subcomponent.
  */
-export declare const usePopupTargetContext: <P extends {}, R>(model: {
+export declare const usePopupTargetContext: 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 usePopupTargetContext: <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 usePopupTargetContext: <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) => {
-    ref: (instance: any) => void;
+}, {
+    ref: (instance: unknown) => void;
     onContextMenu: (event: React.MouseEvent) => void;
-} & P & (R extends HTMLOrSVGElement ? {
-    ref: import("react").Ref<R>;
-} : {});
+}>;
 //# sourceMappingURL=usePopupTargetContext.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"usePopupTargetContext.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/usePopupTargetContext.ts"],"names":[],"mappings":"AAGA;;GAEG;AACH,eAAO,MAAM,qBAAqB;;;;;;;;;;;;;;;;;;;2BAIP,gBAAgB;;;OAmBzC,CAAC"}
+{"version":3,"file":"usePopupTargetContext.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/usePopupTargetContext.ts"],"names":[],"mappings":"AAGA;;GAEG;AACH,eAAO,MAAM,qBAAqB;;;;;;;;;;;;;;;;;;;2BAIP,gBAAgB;EAmBzC,CAAC"}

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

@@ -3,12 +3,11 @@ import { usePopupModel } from './usePopupModel';
 /**
  * Adds the necessary props to a `Target` component. Used by the Popup.Target subcomponent.
  */
-export var usePopupTargetContext = createElemPropsHook(usePopupModel)(function (_a, ref) {
-    var events = _a.events, state = _a.state;
-    var elementRef = useForkRef(ref, state.targetRef);
+export const usePopupTargetContext = createElemPropsHook(usePopupModel)(({ events, state }, ref) => {
+    const elementRef = useForkRef(ref, state.targetRef);
     return {
         ref: elementRef,
-        onContextMenu: function (event) {
+        onContextMenu: (event) => {
             // If we're wrapping a target component that doesn't handle ref forwarding, update the
             // `state.targetRef` manually. This ensures that custom target components don't need to handle
             // ref forwarding since ref forwarding is only really needed to programmatically open popups

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

@@ -1,12 +1,12 @@
 import React from 'react';
 /**
  * Returns focus to the target element when the popup is hidden. This works well with
- * `useInitialFocus`. This should be used with `useFocusRedirect` or `useFocusTrap` for a complete
- * focus management solution.
+ * {@link useInitialFocus}. This should be used with {@link useFocusRedirect} or
+ * {@link useFocusTrap} for a complete focus management solution.
  *
  * This should be used on popup elements that use `useInitialFocus`.
  */
-export declare const useReturnFocus: <P extends {}, R>(model: {
+export declare const useReturnFocus: import("@workday/canvas-kit-react/common").BehaviorHook<{
     state: {
         stackRef: React.RefObject<HTMLDivElement>;
         targetRef: React.RefObject<HTMLButtonElement>;
@@ -14,7 +14,7 @@ export declare const useReturnFocus: <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 useReturnFocus: <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=useReturnFocus.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"useReturnFocus.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/useReturnFocus.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAiC1B;;;;;;GAMG;AACH,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;;;;;OAgGzB,CAAC"}
+{"version":3,"file":"useReturnFocus.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/useReturnFocus.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAiC1B;;;;;;GAMG;AACH,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;;;MA6GzB,CAAC"}

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

@@ -6,7 +6,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') {
         return element;
     }
@@ -26,19 +26,19 @@ function getFocusableElement(element) {
 }
 /**
  * Returns focus to the target element when the popup is hidden. This works well with
- * `useInitialFocus`. This should be used with `useFocusRedirect` or `useFocusTrap` for a complete
- * focus management solution.
+ * {@link useInitialFocus}. This should be used with {@link useFocusRedirect} or
+ * {@link useFocusTrap} for a complete focus management solution.
  *
  * This should be used on popup elements that use `useInitialFocus`.
  */
-export var useReturnFocus = createElemPropsHook(usePopupModel)(function (model) {
-    var visible = model.state.visibility !== 'hidden';
-    var elementRef = React.useRef(null);
+export const useReturnFocus = createElemPropsHook(usePopupModel)(model => {
+    const visible = model.state.visibility !== 'hidden';
+    const elementRef = React.useRef(null);
     // This boolean tracks keyboard-driven focus changes. This is required for `useFocusRedirect` as
     // focus redirection needs synchronous focus management and everything else needs asynchronous
     // focus management.
-    var requiresFocusChangeRef = React.useRef(false);
-    var onKeyDown = React.useCallback(function (event) {
+    const requiresFocusChangeRef = React.useRef(false);
+    const onKeyDown = React.useCallback((event) => {
         // The tab key changes focus
         if (event.key === 'Tab') {
             requiresFocusChangeRef.current = true;
@@ -46,7 +46,7 @@ export var useReturnFocus = createElemPropsHook(usePopupModel)(function (model)
     }, []);
     // track mousedown events to determine if the mouse target is a focusable element. If it is, we
     // should not return focus
-    var onMouseDown = React.useCallback(function (event) {
+    const onMouseDown = React.useCallback((event) => {
         if (model.state.stackRef.current && event.target instanceof HTMLElement) {
             if (!PopupStack.contains(model.state.stackRef.current, event.target)) {
                 elementRef.current = event.target;
@@ -68,24 +68,24 @@ export var useReturnFocus = createElemPropsHook(usePopupModel)(function (model)
     // focus itself. If we don't short-circuit return focus, the user will intend to click on an
     // `input` element only to get focus changed back. This is annoying to users and unintuitive. Instead,
     // we'll use `mousedown` and `mouseup` to determine if we're closing because of a mouse click.
-    React.useLayoutEffect(function () {
+    React.useLayoutEffect(() => {
         if (!visible) {
             return;
         }
         // capture the element here. The refs will be null by the time the cleanup function is called
-        var element = (model.state.returnFocusRef || model.state.targetRef)
+        const element = (model.state.returnFocusRef || model.state.targetRef)
             .current;
         document.addEventListener('mousedown', onMouseDown, true);
         document.addEventListener('keydown', onKeyDown, true);
-        return function () {
+        return () => {
             document.removeEventListener('mousedown', onMouseDown, true);
             document.removeEventListener('keydown', onKeyDown, true);
             if (!element) {
                 return;
             }
-            var scrollParent = getScrollParent(element);
-            var scrollParentRect = scrollParent.getBoundingClientRect();
-            var elementRect = element.getBoundingClientRect();
+            const scrollParent = getScrollParent(element);
+            const scrollParentRect = scrollParent.getBoundingClientRect();
+            const elementRect = element.getBoundingClientRect();
             // Don't change focus if user focused on a different element like a `input` or the target
             // element isn't on at least halfway rendered on the screen.
             if ((elementRef.current && getFocusableElement(elementRef.current)) || // did the user click on a focusable element?
@@ -98,7 +98,11 @@ export var useReturnFocus = createElemPropsHook(usePopupModel)(function (model)
                 elementRef.current = null;
                 return;
             }
-            if (requiresFocusChangeRef.current) {
+            const activeElementOutsidePopupStack = document.activeElement !== document.body &&
+                model.state.stackRef.current &&
+                document.activeElement instanceof HTMLElement &&
+                !PopupStack.contains(model.state.stackRef.current, document.activeElement);
+            if (activeElementOutsidePopupStack || requiresFocusChangeRef.current) {
                 // We need to change focus _before_ the browser process the default action of picking a new
                 // focus target. Doing this immediately prevents the `focus` event from firing on `element`,
                 // but that's okay because the browser will change focus anyways.
@@ -107,12 +111,19 @@ export var useReturnFocus = createElemPropsHook(usePopupModel)(function (model)
             else {
                 // We wait a frame for the current event to process, allowing the browser to fire default
                 // actions. This delay allows the focus change to trigger a `focus` event on `element`.
-                requestAnimationFrame(function () {
+                requestAnimationFrame(() => {
                     changeFocus(element);
                 });
             }
             elementRef.current = null;
         };
-    }, [model.state.returnFocusRef, model.state.targetRef, visible, onMouseDown, onKeyDown]);
+    }, [
+        model.state.returnFocusRef,
+        model.state.targetRef,
+        visible,
+        onMouseDown,
+        onKeyDown,
+        model.state.stackRef,
+    ]);
     return {};
 });

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

@@ -7,7 +7,7 @@ import React from 'react';
  * Don't use this in conjunction with a hook that will close the popup when entering fullscreen.
  * Doing so would open the popup when the intention was to close it.
  */
-export declare const useTransferOnFullscreenEnter: <P extends {}, R>(model: {
+export declare const useTransferOnFullscreenEnter: import("@workday/canvas-kit-react/common").BehaviorHook<{
     state: {
         stackRef: React.RefObject<HTMLDivElement>;
         targetRef: React.RefObject<HTMLButtonElement>;
@@ -15,7 +15,7 @@ export declare const useTransferOnFullscreenEnter: <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 useTransferOnFullscreenEnter: <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=useTransferOnFullscreenEnter.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"useTransferOnFullscreenEnter.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/useTransferOnFullscreenEnter.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAQ1B;;;;;;;GAOG;AACH,eAAO,MAAM,4BAA4B;;;;;;;;;;;;;;;;;;;OA6BvC,CAAC"}
+{"version":3,"file":"useTransferOnFullscreenEnter.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/useTransferOnFullscreenEnter.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAQ1B;;;;;;;GAOG;AACH,eAAO,MAAM,4BAA4B;;;;;;;;;;;;;;;;;MA6BvC,CAAC"}

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

@@ -11,8 +11,8 @@ import { usePopupModel } from './usePopupModel';
  * Don't use this in conjunction with a hook that will close the popup when entering fullscreen.
  * Doing so would open the popup when the intention was to close it.
  */
-export var useTransferOnFullscreenEnter = createElemPropsHook(usePopupModel)(function (model) {
-    var handler = React.useCallback(function (event) {
+export const useTransferOnFullscreenEnter = createElemPropsHook(usePopupModel)(model => {
+    const handler = React.useCallback((event) => {
         if (screenfull.isFullscreen && model.state.stackRef.current) {
             PopupStack.transferToCurrentContext({
                 element: model.state.stackRef.current,
@@ -20,14 +20,14 @@ export var useTransferOnFullscreenEnter = createElemPropsHook(usePopupModel)(fun
             });
         }
     }, [model.state.stackRef, model.state.targetRef]);
-    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/useTransferOnFullscreenExit.d.ts

@@ -6,7 +6,7 @@ import React from 'react';
  * Don't use this in conjunction with a hook that will close the popup when exiting fullscreen.
  * Doing so would open the popup when the intention was to close it.
  */
-export declare const useTransferOnFullscreenExit: <P extends {}, R>(model: {
+export declare const useTransferOnFullscreenExit: import("@workday/canvas-kit-react/common").BehaviorHook<{
     state: {
         stackRef: React.RefObject<HTMLDivElement>;
         targetRef: React.RefObject<HTMLButtonElement>;
@@ -14,7 +14,7 @@ export declare const useTransferOnFullscreenExit: <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 useTransferOnFullscreenExit: <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=useTransferOnFullscreenExit.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"useTransferOnFullscreenExit.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/useTransferOnFullscreenExit.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAQ1B;;;;;;GAMG;AACH,eAAO,MAAM,2BAA2B;;;;;;;;;;;;;;;;;;;OA6BtC,CAAC"}
+{"version":3,"file":"useTransferOnFullscreenExit.d.ts","sourceRoot":"","sources":["../../../../../popup/lib/hooks/useTransferOnFullscreenExit.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAQ1B;;;;;;GAMG;AACH,eAAO,MAAM,2BAA2B;;;;;;;;;;;;;;;;;MA6BtC,CAAC"}

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

@@ -10,8 +10,8 @@ import { usePopupModel } from './usePopupModel';
  * Don't use this in conjunction with a hook that will close the popup when exiting fullscreen.
  * Doing so would open the popup when the intention was to close it.
  */
-export var useTransferOnFullscreenExit = createElemPropsHook(usePopupModel)(function (model) {
-    var handler = React.useCallback(function (event) {
+export const useTransferOnFullscreenExit = createElemPropsHook(usePopupModel)(model => {
+    const handler = React.useCallback((event) => {
         if (!screenfull.isFullscreen && model.state.stackRef.current) {
             PopupStack.transferToCurrentContext({
                 element: model.state.stackRef.current,
@@ -19,14 +19,14 @@ export var useTransferOnFullscreenExit = createElemPropsHook(usePopupModel)(func
             });
         }
     }, [model.state.stackRef, model.state.targetRef]);
-    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/radio/lib/Radio.d.ts

@@ -35,5 +35,5 @@ export interface RadioProps extends Themeable {
     value?: string;
     variant?: 'inverse' | undefined;
 }
-export declare const Radio: import("../../common").ElementComponent<"input", RadioProps>;
+export declare const Radio: import("@workday/canvas-kit-react/common").ElementComponent<"input", RadioProps>;
 //# sourceMappingURL=Radio.d.ts.map

package/dist/es6/radio/lib/Radio.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Radio.d.ts","sourceRoot":"","sources":["../../../../radio/lib/Radio.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAML,SAAS,EAEV,MAAM,kCAAkC,CAAC;AAI1C,MAAM,WAAW,UAAW,SAAQ,SAAS;IAC3C;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IAC5D;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;CACjC;AAmOD,eAAO,MAAM,KAAK,8DAqDhB,CAAC"}
+{"version":3,"file":"Radio.d.ts","sourceRoot":"","sources":["../../../../radio/lib/Radio.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAML,SAAS,EAEV,MAAM,kCAAkC,CAAC;AAI1C,MAAM,WAAW,UAAW,SAAQ,SAAS;IAC3C;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IAC5D;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;CACjC;AAmOD,eAAO,MAAM,KAAK,kFAqDhB,CAAC"}