@pega/cosmos-react-core 5.0.0-dev.4.7 → 5.0.0-dev.4.8

package/lib/hooks/useElement.js

@@ -1,10 +0,0 @@
-import { useState } from 'react';
-/**
- * @example const [element, setElementFunction] = useElement(initial);
- * @param initial The initial value to set to element.
- * @returns * element:: A DOM Element.
- *          * setElementFunction:: The function responsible for setting and resetting the element variable. This function is typically passed to the ref attribute of the element you wish to reference.
- */
-const useElement = (initial = null) => useState(initial);
-export default useElement;
-//# sourceMappingURL=useElement.js.map

package/lib/hooks/useElement.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"useElement.js","sourceRoot":"","sources":["../../src/hooks/useElement.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAe,MAAM,OAAO,CAAC;AAE9C;;;;;GAKG;AACH,MAAM,UAAU,GAAG,CAAoB,UAAoB,IAAI,EAA8B,EAAE,CAC7F,QAAQ,CAAW,OAAO,CAAC,CAAC;AAE9B,eAAe,UAAU,CAAC","sourcesContent":["import { useState, RefCallback } from 'react';\n\n/**\n * @example const [element, setElementFunction] = useElement(initial);\n * @param initial The initial value to set to element.\n * @returns * element:: A DOM Element.\n *          * setElementFunction:: The function responsible for setting and resetting the element variable. This function is typically passed to the ref attribute of the element you wish to reference.\n */\nconst useElement = <T extends Element>(initial: T | null = null): [T | null, RefCallback<T>] =>\n  useState<T | null>(initial);\n\nexport default useElement;\n"]}

package/lib/hooks/useEscape.d.ts

@@ -1,13 +0,0 @@
-import { DependencyList, RefObject } from 'react';
-/**
- * Hook to define function triggered on Escape button. It attaches the listener to the element
- * identified by target prop, defaults to document. Used primarily for convenience when dismissing
- * popovers.
- * @example useEscape((event) => { do something });
- * @param cb The function that should be executed on keydown keyevent.
- * @param target To which esc event to be attached - Defaults to document
- * @param dependencies List of dependencies
- */
-declare const useEscape: (cb: (e: KeyboardEvent) => void, target?: HTMLElement | RefObject<HTMLElement> | Document | null, dependencies?: DependencyList) => void;
-export default useEscape;
-//# sourceMappingURL=useEscape.d.ts.map

package/lib/hooks/useEscape.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"useEscape.d.ts","sourceRoot":"","sources":["../../src/hooks/useEscape.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,SAAS,EAAe,MAAM,OAAO,CAAC;AAI/D;;;;;;;;GAQG;AAEH,QAAA,MAAM,SAAS,WACL,aAAa,KAAK,IAAI,WACtB,WAAW,GAAG,UAAU,WAAW,CAAC,GAAG,QAAQ,GAAG,IAAI,wCAW/D,CAAC;AAEF,eAAe,SAAS,CAAC"}

package/lib/hooks/useEscape.js

@@ -1,20 +0,0 @@
-import { useCallback } from 'react';
-import useEvent from './useEvent';
-/**
- * Hook to define function triggered on Escape button. It attaches the listener to the element
- * identified by target prop, defaults to document. Used primarily for convenience when dismissing
- * popovers.
- * @example useEscape((event) => { do something });
- * @param cb The function that should be executed on keydown keyevent.
- * @param target To which esc event to be attached - Defaults to document
- * @param dependencies List of dependencies
- */
-const useEscape = (cb, target = document, dependencies = []) => {
-    const onKeyDown = useCallback((e) => {
-        if (e.key === 'Escape')
-            cb(e);
-    }, [cb, ...dependencies]);
-    useEvent('keydown', onKeyDown, { target });
-};
-export default useEscape;
-//# sourceMappingURL=useEscape.js.map

package/lib/hooks/useEscape.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"useEscape.js","sourceRoot":"","sources":["../../src/hooks/useEscape.ts"],"names":[],"mappings":"AAAA,OAAO,EAA6B,WAAW,EAAE,MAAM,OAAO,CAAC;AAE/D,OAAO,QAAQ,MAAM,YAAY,CAAC;AAElC;;;;;;;;GAQG;AAEH,MAAM,SAAS,GAAG,CAChB,EAA8B,EAC9B,SAAiE,QAAQ,EACzE,eAA+B,EAAE,EACjC,EAAE;IACF,MAAM,SAAS,GAAG,WAAW,CAC3B,CAAC,CAAgB,EAAE,EAAE;QACnB,IAAI,CAAC,CAAC,GAAG,KAAK,QAAQ;YAAE,EAAE,CAAC,CAAC,CAAC,CAAC;IAChC,CAAC,EACD,CAAC,EAAE,EAAE,GAAG,YAAY,CAAC,CACtB,CAAC;IAEF,QAAQ,CAAC,SAAS,EAAE,SAAS,EAAE,EAAE,MAAM,EAAE,CAAC,CAAC;AAC7C,CAAC,CAAC;AAEF,eAAe,SAAS,CAAC","sourcesContent":["import { DependencyList, RefObject, useCallback } from 'react';\n\nimport useEvent from './useEvent';\n\n/**\n * Hook to define function triggered on Escape button. It attaches the listener to the element\n * identified by target prop, defaults to document. Used primarily for convenience when dismissing\n * popovers.\n * @example useEscape((event) => { do something });\n * @param cb The function that should be executed on keydown keyevent.\n * @param target To which esc event to be attached - Defaults to document\n * @param dependencies List of dependencies\n */\n\nconst useEscape = (\n  cb: (e: KeyboardEvent) => void,\n  target: HTMLElement | RefObject<HTMLElement> | Document | null = document,\n  dependencies: DependencyList = []\n) => {\n  const onKeyDown = useCallback(\n    (e: KeyboardEvent) => {\n      if (e.key === 'Escape') cb(e);\n    },\n    [cb, ...dependencies]\n  );\n\n  useEvent('keydown', onKeyDown, { target });\n};\n\nexport default useEscape;\n"]}

package/lib/hooks/useEvent.d.ts

@@ -1,27 +0,0 @@
-import { DependencyList, RefObject } from 'react';
-type EventMapForTarget<Target extends EventTarget> = Target extends HTMLElement ? HTMLElementEventMap : Target extends SVGElement ? SVGElementEventMap : Target extends Document ? DocumentEventMap : Target extends Window ? WindowEventMap : {
-    [eventType: string]: Event;
-};
-type EventNamesForTarget<T extends EventTarget> = keyof EventMapForTarget<T> & string;
-/**
- * @example useEvent('keydown', (event) => { do something });
- * @param cb The function that should be executed on keydown keyevent.
- * @param options
- */
-declare function useEvent<Target extends Document, EventName extends EventNamesForTarget<Target>>(eventName: EventName, cb: (e: EventMapForTarget<Target>[EventName]) => void, opts?: {
-    target?: undefined;
-    eventOptions?: AddEventListenerOptions | boolean;
-    dependencies: DependencyList;
-}): void;
-declare function useEvent<Target extends EventTarget, EventName extends EventNamesForTarget<Target>>(eventName: EventName, cb: (e: EventMapForTarget<Target>[EventName]) => void, opts: {
-    target: Target | RefObject<Target> | null;
-    eventOptions?: AddEventListenerOptions | boolean;
-    dependencies?: DependencyList;
-}): void;
-declare function useEvent<Target extends EventTarget, EventName extends EventNamesForTarget<Target | Document>>(eventName: EventName, cb: (e: EventMapForTarget<Target | Document>[EventName]) => void, opts: {
-    target?: Target | RefObject<Target> | null | undefined;
-    eventOptions?: AddEventListenerOptions | boolean;
-    dependencies?: DependencyList;
-}): void;
-export default useEvent;
-//# sourceMappingURL=useEvent.d.ts.map

package/lib/hooks/useEvent.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"useEvent.d.ts","sourceRoot":"","sources":["../../src/hooks/useEvent.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,SAAS,EAAa,MAAM,OAAO,CAAC;AAK7D,KAAK,iBAAiB,CAAC,MAAM,SAAS,WAAW,IAAI,MAAM,SAAS,WAAW,GAC3E,mBAAmB,GACnB,MAAM,SAAS,UAAU,GACzB,kBAAkB,GAClB,MAAM,SAAS,QAAQ,GACvB,gBAAgB,GAChB,MAAM,SAAS,MAAM,GACrB,cAAc,GACd;IACE,CAAC,SAAS,EAAE,MAAM,GAAG,KAAK,CAAC;CAC5B,CAAC;AACN,KAAK,mBAAmB,CAAC,CAAC,SAAS,WAAW,IAAI,MAAM,iBAAiB,CAAC,CAAC,CAAC,GAAG,MAAM,CAAC;AAEtF;;;;GAIG;AACH,iBAAS,QAAQ,CAAC,MAAM,SAAS,QAAQ,EAAE,SAAS,SAAS,mBAAmB,CAAC,MAAM,CAAC,EACtF,SAAS,EAAE,SAAS,EACpB,EAAE,EAAE,CAAC,CAAC,EAAE,iBAAiB,CAAC,MAAM,CAAC,CAAC,SAAS,CAAC,KAAK,IAAI,EACrD,IAAI,CAAC,EAAE;IACL,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,YAAY,CAAC,EAAE,uBAAuB,GAAG,OAAO,CAAC;IACjD,YAAY,EAAE,cAAc,CAAC;CAC9B,GACA,IAAI,CAAC;AAER,iBAAS,QAAQ,CAAC,MAAM,SAAS,WAAW,EAAE,SAAS,SAAS,mBAAmB,CAAC,MAAM,CAAC,EACzF,SAAS,EAAE,SAAS,EACpB,EAAE,EAAE,CAAC,CAAC,EAAE,iBAAiB,CAAC,MAAM,CAAC,CAAC,SAAS,CAAC,KAAK,IAAI,EACrD,IAAI,EAAE;IACJ,MAAM,EAAE,MAAM,GAAG,SAAS,CAAC,MAAM,CAAC,GAAG,IAAI,CAAC;IAC1C,YAAY,CAAC,EAAE,uBAAuB,GAAG,OAAO,CAAC;IACjD,YAAY,CAAC,EAAE,cAAc,CAAC;CAC/B,GACA,IAAI,CAAC;AAER,iBAAS,QAAQ,CACf,MAAM,SAAS,WAAW,EAC1B,SAAS,SAAS,mBAAmB,CAAC,MAAM,GAAG,QAAQ,CAAC,EAExD,SAAS,EAAE,SAAS,EACpB,EAAE,EAAE,CAAC,CAAC,EAAE,iBAAiB,CAAC,MAAM,GAAG,QAAQ,CAAC,CAAC,SAAS,CAAC,KAAK,IAAI,EAChE,IAAI,EAAE;IACJ,MAAM,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC,MAAM,CAAC,GAAG,IAAI,GAAG,SAAS,CAAC;IACvD,YAAY,CAAC,EAAE,uBAAuB,GAAG,OAAO,CAAC;IACjD,YAAY,CAAC,EAAE,cAAc,CAAC;CAC/B,GACA,IAAI,CAAC;AA2BR,eAAe,QAAQ,CAAC"}

package/lib/hooks/useEvent.js

@@ -1,15 +0,0 @@
-import { useEffect } from 'react';
-import { normalizeTargets } from '../utils';
-function useEvent(eventName, cb, { target = document, eventOptions, dependencies = [] } = {}) {
-    useEffect(() => {
-        const [t] = normalizeTargets([target]);
-        if (!t)
-            return;
-        t.addEventListener(eventName, cb, eventOptions);
-        return () => {
-            t.removeEventListener(eventName, cb, eventOptions);
-        };
-    }, [eventName, target, cb, eventOptions, ...dependencies]);
-}
-export default useEvent;
-//# sourceMappingURL=useEvent.js.map

package/lib/hooks/useEvent.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"useEvent.js","sourceRoot":"","sources":["../../src/hooks/useEvent.ts"],"names":[],"mappings":"AAAA,OAAO,EAA6B,SAAS,EAAE,MAAM,OAAO,CAAC;AAE7D,OAAO,EAAE,gBAAgB,EAAE,MAAM,UAAU,CAAC;AAsD5C,SAAS,QAAQ,CACf,SAAoB,EACpB,EAAqD,EACrD,EACE,MAAM,GAAG,QAA6B,EACtC,YAAY,EACZ,YAAY,GAAG,EAAE,KAKf,EAAE;IAEN,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,CAAC,CAAC,CAAC,GAAG,gBAAgB,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC;QACvC,IAAI,CAAC,CAAC;YAAE,OAAO;QAEf,CAAC,CAAC,gBAAgB,CAAC,SAAS,EAAE,EAAmB,EAAE,YAAY,CAAC,CAAC;QAEjE,OAAO,GAAG,EAAE;YACV,CAAC,CAAC,mBAAmB,CAAC,SAAS,EAAE,EAAmB,EAAE,YAAY,CAAC,CAAC;QACtE,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,EAAE,EAAE,YAAY,EAAE,GAAG,YAAY,CAAC,CAAC,CAAC;AAC7D,CAAC;AAED,eAAe,QAAQ,CAAC","sourcesContent":["import { DependencyList, RefObject, useEffect } from 'react';\n\nimport { normalizeTargets } from '../utils';\n\n//  Based on https://github.com/microsoft/TypeScript/issues/33047#issuecomment-704005614\ntype EventMapForTarget<Target extends EventTarget> = Target extends HTMLElement\n  ? HTMLElementEventMap\n  : Target extends SVGElement\n  ? SVGElementEventMap\n  : Target extends Document\n  ? DocumentEventMap\n  : Target extends Window\n  ? WindowEventMap\n  : {\n      [eventType: string]: Event;\n    };\ntype EventNamesForTarget<T extends EventTarget> = keyof EventMapForTarget<T> & string;\n\n/**\n * @example useEvent('keydown', (event) => { do something });\n * @param cb The function that should be executed on keydown keyevent.\n * @param options\n */\nfunction useEvent<Target extends Document, EventName extends EventNamesForTarget<Target>>(\n  eventName: EventName,\n  cb: (e: EventMapForTarget<Target>[EventName]) => void,\n  opts?: {\n    target?: undefined;\n    eventOptions?: AddEventListenerOptions | boolean;\n    dependencies: DependencyList;\n  }\n): void;\n\nfunction useEvent<Target extends EventTarget, EventName extends EventNamesForTarget<Target>>(\n  eventName: EventName,\n  cb: (e: EventMapForTarget<Target>[EventName]) => void,\n  opts: {\n    target: Target | RefObject<Target> | null;\n    eventOptions?: AddEventListenerOptions | boolean;\n    dependencies?: DependencyList;\n  }\n): void;\n\nfunction useEvent<\n  Target extends EventTarget,\n  EventName extends EventNamesForTarget<Target | Document>\n>(\n  eventName: EventName,\n  cb: (e: EventMapForTarget<Target | Document>[EventName]) => void,\n  opts: {\n    target?: Target | RefObject<Target> | null | undefined;\n    eventOptions?: AddEventListenerOptions | boolean;\n    dependencies?: DependencyList;\n  }\n): void;\n\nfunction useEvent<Target extends EventTarget, EventName extends EventNamesForTarget<Target>>(\n  eventName: EventName,\n  cb: (e: EventMapForTarget<Target>[EventName]) => void,\n  {\n    target = document as unknown as Target,\n    eventOptions,\n    dependencies = []\n  }: {\n    target?: Target | RefObject<Target> | null;\n    eventOptions?: AddEventListenerOptions | boolean;\n    dependencies?: DependencyList;\n  } = {}\n) {\n  useEffect(() => {\n    const [t] = normalizeTargets([target]);\n    if (!t) return;\n\n    t.addEventListener(eventName, cb as EventListener, eventOptions);\n\n    return () => {\n      t.removeEventListener(eventName, cb as EventListener, eventOptions);\n    };\n  }, [eventName, target, cb, eventOptions, ...dependencies]);\n}\n\nexport default useEvent;\n"]}

package/lib/hooks/useFocusTrap.d.ts

@@ -1,10 +0,0 @@
-import { RefObject, DependencyList } from 'react';
-/**
- * @example useFocusTrap(elementRef)
- * @param elementRef ref of the element in which focus needs to be retained
- * @param addToDocument boolean value to specify if event to be attached to document or to be taken from elementRef, defaults to true
- * @param dependencies  list of variables or functions that will initiate this hook when they are updated.
- */
-declare const useFocusTrap: (elementRef: RefObject<HTMLElement>, attachToDocument?: boolean, dependencies?: DependencyList) => void;
-export default useFocusTrap;
-//# sourceMappingURL=useFocusTrap.d.ts.map

package/lib/hooks/useFocusTrap.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"useFocusTrap.d.ts","sourceRoot":"","sources":["../../src/hooks/useFocusTrap.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAe,cAAc,EAAE,MAAM,OAAO,CAAC;AAM/D;;;;;GAKG;AACH,QAAA,MAAM,YAAY,eACJ,UAAU,WAAW,CAAC,qBAChB,OAAO,wCAyB1B,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/lib/hooks/useFocusTrap.js

@@ -1,32 +0,0 @@
-import { useCallback } from 'react';
-import { getFocusables, getActiveElement } from '../utils';
-import useEvent from './useEvent';
-/**
- * @example useFocusTrap(elementRef)
- * @param elementRef ref of the element in which focus needs to be retained
- * @param addToDocument boolean value to specify if event to be attached to document or to be taken from elementRef, defaults to true
- * @param dependencies  list of variables or functions that will initiate this hook when they are updated.
- */
-const useFocusTrap = (elementRef, attachToDocument = true, dependencies = []) => {
-    const onKeydown = useCallback((e) => {
-        if (e.key === 'Tab') {
-            const focusables = getFocusables(elementRef);
-            const { 0: firstFocusable, [focusables.length - 1]: lastFocusable } = focusables;
-            const activeEl = getActiveElement();
-            const requiresFocus = activeEl === elementRef.current ||
-                !elementRef.current?.contains(activeEl) ||
-                (elementRef.current?.contains(activeEl) && !focusables.includes(activeEl));
-            if (!e.shiftKey && (activeEl === lastFocusable || requiresFocus)) {
-                firstFocusable?.focus();
-                e.preventDefault();
-            }
-            else if (e.shiftKey && (activeEl === firstFocusable || requiresFocus)) {
-                lastFocusable?.focus();
-                e.preventDefault();
-            }
-        }
-    }, dependencies);
-    useEvent('keydown', onKeydown, { target: attachToDocument ? undefined : elementRef });
-};
-export default useFocusTrap;
-//# sourceMappingURL=useFocusTrap.js.map

package/lib/hooks/useFocusTrap.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"useFocusTrap.js","sourceRoot":"","sources":["../../src/hooks/useFocusTrap.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,WAAW,EAAkB,MAAM,OAAO,CAAC;AAE/D,OAAO,EAAE,aAAa,EAAE,gBAAgB,EAAE,MAAM,UAAU,CAAC;AAE3D,OAAO,QAAQ,MAAM,YAAY,CAAC;AAElC;;;;;GAKG;AACH,MAAM,YAAY,GAAG,CACnB,UAAkC,EAClC,mBAA4B,IAAI,EAChC,eAA+B,EAAE,EACjC,EAAE;IACF,MAAM,SAAS,GAAG,WAAW,CAAC,CAAC,CAAgB,EAAE,EAAE;QACjD,IAAI,CAAC,CAAC,GAAG,KAAK,KAAK,EAAE;YACnB,MAAM,UAAU,GAAG,aAAa,CAAC,UAAU,CAAC,CAAC;YAC7C,MAAM,EAAE,CAAC,EAAE,cAAc,EAAE,CAAC,UAAU,CAAC,MAAM,GAAG,CAAC,CAAC,EAAE,aAAa,EAAE,GAAG,UAAU,CAAC;YACjF,MAAM,QAAQ,GAAG,gBAAgB,EAAE,CAAC;YAEpC,MAAM,aAAa,GACjB,QAAQ,KAAK,UAAU,CAAC,OAAO;gBAC/B,CAAC,UAAU,CAAC,OAAO,EAAE,QAAQ,CAAC,QAAQ,CAAC;gBACvC,CAAC,UAAU,CAAC,OAAO,EAAE,QAAQ,CAAC,QAAQ,CAAC,IAAI,CAAC,UAAU,CAAC,QAAQ,CAAC,QAAuB,CAAC,CAAC,CAAC;YAE5F,IAAI,CAAC,CAAC,CAAC,QAAQ,IAAI,CAAC,QAAQ,KAAK,aAAa,IAAI,aAAa,CAAC,EAAE;gBAChE,cAAc,EAAE,KAAK,EAAE,CAAC;gBACxB,CAAC,CAAC,cAAc,EAAE,CAAC;aACpB;iBAAM,IAAI,CAAC,CAAC,QAAQ,IAAI,CAAC,QAAQ,KAAK,cAAc,IAAI,aAAa,CAAC,EAAE;gBACvE,aAAa,EAAE,KAAK,EAAE,CAAC;gBACvB,CAAC,CAAC,cAAc,EAAE,CAAC;aACpB;SACF;IACH,CAAC,EAAE,YAAY,CAAC,CAAC;IAEjB,QAAQ,CAAC,SAAS,EAAE,SAAS,EAAE,EAAE,MAAM,EAAE,gBAAgB,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,UAAU,EAAE,CAAC,CAAC;AACxF,CAAC,CAAC;AAEF,eAAe,YAAY,CAAC","sourcesContent":["import { RefObject, useCallback, DependencyList } from 'react';\n\nimport { getFocusables, getActiveElement } from '../utils';\n\nimport useEvent from './useEvent';\n\n/**\n * @example useFocusTrap(elementRef)\n * @param elementRef ref of the element in which focus needs to be retained\n * @param addToDocument boolean value to specify if event to be attached to document or to be taken from elementRef, defaults to true\n * @param dependencies  list of variables or functions that will initiate this hook when they are updated.\n */\nconst useFocusTrap = (\n  elementRef: RefObject<HTMLElement>,\n  attachToDocument: boolean = true,\n  dependencies: DependencyList = []\n) => {\n  const onKeydown = useCallback((e: KeyboardEvent) => {\n    if (e.key === 'Tab') {\n      const focusables = getFocusables(elementRef);\n      const { 0: firstFocusable, [focusables.length - 1]: lastFocusable } = focusables;\n      const activeEl = getActiveElement();\n\n      const requiresFocus =\n        activeEl === elementRef.current ||\n        !elementRef.current?.contains(activeEl) ||\n        (elementRef.current?.contains(activeEl) && !focusables.includes(activeEl as HTMLElement));\n\n      if (!e.shiftKey && (activeEl === lastFocusable || requiresFocus)) {\n        firstFocusable?.focus();\n        e.preventDefault();\n      } else if (e.shiftKey && (activeEl === firstFocusable || requiresFocus)) {\n        lastFocusable?.focus();\n        e.preventDefault();\n      }\n    }\n  }, dependencies);\n\n  useEvent('keydown', onKeydown, { target: attachToDocument ? undefined : elementRef });\n};\n\nexport default useFocusTrap;\n"]}

package/lib/hooks/useFocusWithin.d.ts

@@ -1,9 +0,0 @@
-import { RefObject } from 'react';
-/** Hook for properly handling focus state of children components.
- * @example const hasFocus = useFocusWithin([containerRef, ...], (isFocused, element) => { doSomething; });
- * @param onFocusChange Callback function that is invoked with the current focus state and the current element when any child elements takes focus or all of them lose focus.
- * @returns * hasFocus:: A boolean indicating if the ref element has focus or not.
- */
-declare const useFocusWithin: <T extends HTMLElement = HTMLElement>(els: (T | RefObject<T | null> | null)[], onFocusChange?: ((isFocused: boolean, element: Element | T | null) => void) | undefined) => boolean;
-export default useFocusWithin;
-//# sourceMappingURL=useFocusWithin.d.ts.map

package/lib/hooks/useFocusWithin.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"useFocusWithin.d.ts","sourceRoot":"","sources":["../../src/hooks/useFocusWithin.ts"],"names":[],"mappings":"AAAA,OAAO,EAAuB,SAAS,EAAuB,MAAM,OAAO,CAAC;AAI5E;;;;GAIG;AACH,QAAA,MAAM,cAAc,8GAEU,OAAO,kCAAkC,IAAI,kBACxE,OA8FF,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/lib/hooks/useFocusWithin.js

@@ -1,85 +0,0 @@
-import { useState, useEffect, useCallback, useRef } from 'react';
-import { getAllPopovers, normalizeTargets } from '../utils';
-/** Hook for properly handling focus state of children components.
- * @example const hasFocus = useFocusWithin([containerRef, ...], (isFocused, element) => { doSomething; });
- * @param onFocusChange Callback function that is invoked with the current focus state and the current element when any child elements takes focus or all of them lose focus.
- * @returns * hasFocus:: A boolean indicating if the ref element has focus or not.
- */
-const useFocusWithin = (els, onFocusChange) => {
-    const [hasFocus, setFocus] = useState(false);
-    const focusedElRef = useRef(null);
-    const handlerAbortControllerRef = useRef();
-    useEffect(() => {
-        return () => {
-            handlerAbortControllerRef.current?.abort();
-        };
-    }, []);
-    const onBlur = useCallback(({ relatedTarget }) => {
-        if (!hasFocus)
-            return;
-        const elements = normalizeTargets(els).flatMap(el => [el, ...getAllPopovers(el)]);
-        if (relatedTarget instanceof Node) {
-            // changing focus to another relevant child doesn't count
-            const focusedEl = elements.find(el => el?.contains(relatedTarget));
-            if (focusedEl) {
-                // ... just update the currently focused item
-                focusedElRef.current = focusedEl;
-                return;
-            }
-        }
-        // Code below is similar to the useOuterEvent hook, but single-shot only and need to be attached
-        // after blur event only. Due to various order of events between browsers and OSes, we need to
-        // postpone calling 'onBlur' callback until next element gets focus or on outer click to check
-        // if the relevant element contains the target element, which means the focus is retained.
-        const handlerAbortController = new AbortController();
-        const handler = (e) => {
-            if (!elements.some(el => {
-                return el?.contains(e.target);
-            })) {
-                setFocus(false);
-                onFocusChange?.(false, focusedElRef.current);
-                focusedElRef.current = null;
-            }
-            handlerAbortController.abort();
-        };
-        // For keyboard and SR navigation - wait for 'focusin'.
-        document.addEventListener('focusin', handler, {
-            once: true,
-            signal: handlerAbortController.signal
-        });
-        // For mouse and touch navigation - wait for 'mouseup'.
-        // The chosen event need to occur before 'click' to allow the given callback code finish before
-        // 'click' handlers.
-        document.addEventListener('mouseup', handler, {
-            once: true,
-            signal: handlerAbortController.signal
-        });
-        handlerAbortControllerRef.current = handlerAbortController;
-    }, [hasFocus, onFocusChange, els]);
-    const onFocus = useCallback(({ currentTarget }) => {
-        if (!hasFocus) {
-            setFocus(true);
-            const targetEl = currentTarget;
-            onFocusChange?.(true, targetEl);
-            focusedElRef.current = targetEl;
-        }
-    }, [hasFocus, onFocusChange]);
-    useEffect(() => {
-        const elements = normalizeTargets(els)
-            .flatMap(el => [el, ...getAllPopovers(el)])
-            .filter((el) => el instanceof HTMLElement);
-        elements.forEach(el => {
-            el?.addEventListener('focusin', onFocus);
-            el?.addEventListener('focusout', onBlur);
-        });
-        return () => {
-            elements.forEach(el => {
-                el?.removeEventListener('focusin', onFocus);
-                el?.removeEventListener('focusout', onBlur);
-            });
-        };
-    }, [els, onFocus, onBlur]);
-    return hasFocus;
-};
-export default useFocusWithin;
-//# sourceMappingURL=useFocusWithin.js.map

package/lib/hooks/useFocusWithin.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"useFocusWithin.js","sourceRoot":"","sources":["../../src/hooks/useFocusWithin.ts"],"names":[],"mappings":"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","sourcesContent":["import { useState, useEffect, RefObject, useCallback, useRef } from 'react';\n\nimport { getAllPopovers, normalizeTargets } from '../utils';\n\n/** Hook for properly handling focus state of children components.\n * @example const hasFocus = useFocusWithin([containerRef, ...], (isFocused, element) => { doSomething; });\n * @param onFocusChange Callback function that is invoked with the current focus state and the current element when any child elements takes focus or all of them lose focus.\n * @returns * hasFocus:: A boolean indicating if the ref element has focus or not.\n */\nconst useFocusWithin = <T extends HTMLElement = HTMLElement>(\n  els: (T | null | RefObject<T | null>)[],\n  onFocusChange?: (isFocused: boolean, element: T | Element | null) => void\n): boolean => {\n  const [hasFocus, setFocus] = useState(false);\n  const focusedElRef = useRef<T | Element | null>(null);\n\n  const handlerAbortControllerRef = useRef<AbortController>();\n  useEffect(() => {\n    return () => {\n      handlerAbortControllerRef.current?.abort();\n    };\n  }, []);\n\n  const onBlur = useCallback(\n    ({ relatedTarget }: FocusEvent) => {\n      if (!hasFocus) return;\n\n      const elements = normalizeTargets(els).flatMap(el => [el, ...getAllPopovers(el)]);\n\n      if (relatedTarget instanceof Node) {\n        // changing focus to another relevant child doesn't count\n        const focusedEl = elements.find(el => el?.contains(relatedTarget));\n        if (focusedEl) {\n          // ... just update the currently focused item\n          focusedElRef.current = focusedEl;\n          return;\n        }\n      }\n\n      // Code below is similar to the useOuterEvent hook, but single-shot only and need to be attached\n      // after blur event only. Due to various order of events between browsers and OSes, we need to\n      // postpone calling 'onBlur' callback until next element gets focus or on outer click to check\n      // if the relevant element contains the target element, which means the focus is retained.\n      const handlerAbortController = new AbortController();\n      const handler = (e: FocusEvent | MouseEvent) => {\n        if (\n          !elements.some(el => {\n            return el?.contains(e.target as Node);\n          })\n        ) {\n          setFocus(false);\n          onFocusChange?.(false, focusedElRef.current);\n          focusedElRef.current = null;\n        }\n        handlerAbortController.abort();\n      };\n\n      // For keyboard and SR navigation - wait for 'focusin'.\n      document.addEventListener('focusin', handler, {\n        once: true,\n        signal: handlerAbortController.signal\n      });\n\n      // For mouse and touch navigation - wait for 'mouseup'.\n      // The chosen event need to occur before 'click' to allow the given callback code finish before\n      // 'click' handlers.\n      document.addEventListener('mouseup', handler, {\n        once: true,\n        signal: handlerAbortController.signal\n      });\n\n      handlerAbortControllerRef.current = handlerAbortController;\n    },\n    [hasFocus, onFocusChange, els]\n  );\n\n  const onFocus = useCallback(\n    ({ currentTarget }: FocusEvent) => {\n      if (!hasFocus) {\n        setFocus(true);\n        const targetEl = currentTarget as T;\n        onFocusChange?.(true, targetEl);\n        focusedElRef.current = targetEl;\n      }\n    },\n    [hasFocus, onFocusChange]\n  );\n\n  useEffect(() => {\n    const elements = normalizeTargets(els)\n      .flatMap(el => [el, ...getAllPopovers(el)])\n      .filter((el): el is HTMLElement => el instanceof HTMLElement);\n\n    elements.forEach(el => {\n      el?.addEventListener('focusin', onFocus);\n      el?.addEventListener('focusout', onBlur);\n    });\n    return () => {\n      elements.forEach(el => {\n        el?.removeEventListener('focusin', onFocus);\n        el?.removeEventListener('focusout', onBlur);\n      });\n    };\n  }, [els, onFocus, onBlur]);\n\n  return hasFocus;\n};\n\nexport default useFocusWithin;\n"]}