UNPKG

@wordpress/compose

Version:
98 lines (96 loc) 3.39 kB
"use strict"; var __defProp = Object.defineProperty; var __getOwnPropDesc = Object.getOwnPropertyDescriptor; var __getOwnPropNames = Object.getOwnPropertyNames; var __hasOwnProp = Object.prototype.hasOwnProperty; var __export = (target, all) => { for (var name in all) __defProp(target, name, { get: all[name], enumerable: true }); }; var __copyProps = (to, from, except, desc) => { if (from && typeof from === "object" || typeof from === "function") { for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable }); } return to; }; var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod); // packages/compose/src/hooks/use-focus-outside/index.ts var use_focus_outside_exports = {}; __export(use_focus_outside_exports, { default: () => useFocusOutside }); module.exports = __toCommonJS(use_focus_outside_exports); var import_element = require("@wordpress/element"); var INPUT_BUTTON_TYPES = ["button", "submit"]; function isFocusNormalizedButton(eventTarget) { if (!(eventTarget instanceof window.HTMLElement)) { return false; } switch (eventTarget.nodeName) { case "A": case "BUTTON": return true; case "INPUT": return INPUT_BUTTON_TYPES.includes( eventTarget.type ); } return false; } function useFocusOutside(onFocusOutside) { const currentOnFocusOutsideRef = (0, import_element.useRef)(onFocusOutside); (0, import_element.useEffect)(() => { currentOnFocusOutsideRef.current = onFocusOutside; }, [onFocusOutside]); const preventBlurCheckRef = (0, import_element.useRef)(false); const blurCheckTimeoutIdRef = (0, import_element.useRef)(); const cancelBlurCheck = (0, import_element.useCallback)(() => { clearTimeout(blurCheckTimeoutIdRef.current); }, []); (0, import_element.useEffect)(() => { if (!onFocusOutside) { cancelBlurCheck(); } }, [onFocusOutside, cancelBlurCheck]); const normalizeButtonFocus = (0, import_element.useCallback)((event) => { const { type, target } = event; const isInteractionEnd = ["mouseup", "touchend"].includes(type); if (isInteractionEnd) { preventBlurCheckRef.current = false; } else if (isFocusNormalizedButton(target)) { preventBlurCheckRef.current = true; } }, []); const queueBlurCheck = (0, import_element.useCallback)((event) => { event.persist(); if (preventBlurCheckRef.current) { return; } const ignoreForRelatedTarget = event.target.getAttribute( "data-unstable-ignore-focus-outside-for-relatedtarget" ); if (ignoreForRelatedTarget && event.relatedTarget?.closest(ignoreForRelatedTarget)) { return; } blurCheckTimeoutIdRef.current = setTimeout(() => { if (!document.hasFocus()) { event.preventDefault(); return; } if ("function" === typeof currentOnFocusOutsideRef.current) { currentOnFocusOutsideRef.current(event); } }, 0); }, []); return { onFocus: cancelBlurCheck, onMouseDown: normalizeButtonFocus, onMouseUp: normalizeButtonFocus, onTouchStart: normalizeButtonFocus, onTouchEnd: normalizeButtonFocus, onBlur: queueBlurCheck }; } //# sourceMappingURL=index.js.map