UNPKG

5.25 kBJavaScriptView Raw
1var $iJhOP$react = require("react");
2var $iJhOP$reactariautils = require("@react-aria/utils");
3
4
5function $parcel$export(e, n, v, s) {
6 Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
7}
8
9$parcel$export(module.exports, "useSyntheticBlurEvent", () => $625cf83917e112ad$export$715c682d09d639cc);
10/*
11 * Copyright 2020 Adobe. All rights reserved.
12 * This file is licensed to you under the Apache License, Version 2.0 (the "License");
13 * you may not use this file except in compliance with the License. You may obtain a copy
14 * of the License at http://www.apache.org/licenses/LICENSE-2.0
15 *
16 * Unless required by applicable law or agreed to in writing, software distributed under
17 * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
18 * OF ANY KIND, either express or implied. See the License for the specific language
19 * governing permissions and limitations under the License.
20 */
21
22class $625cf83917e112ad$export$905e7fc544a71f36 {
23 isDefaultPrevented() {
24 return this.nativeEvent.defaultPrevented;
25 }
26 preventDefault() {
27 this.defaultPrevented = true;
28 this.nativeEvent.preventDefault();
29 }
30 stopPropagation() {
31 this.nativeEvent.stopPropagation();
32 this.isPropagationStopped = ()=>true;
33 }
34 isPropagationStopped() {
35 return false;
36 }
37 persist() {}
38 constructor(type, nativeEvent){
39 this.nativeEvent = nativeEvent;
40 this.target = nativeEvent.target;
41 this.currentTarget = nativeEvent.currentTarget;
42 this.relatedTarget = nativeEvent.relatedTarget;
43 this.bubbles = nativeEvent.bubbles;
44 this.cancelable = nativeEvent.cancelable;
45 this.defaultPrevented = nativeEvent.defaultPrevented;
46 this.eventPhase = nativeEvent.eventPhase;
47 this.isTrusted = nativeEvent.isTrusted;
48 this.timeStamp = nativeEvent.timeStamp;
49 this.type = type;
50 }
51}
52function $625cf83917e112ad$export$715c682d09d639cc(onBlur) {
53 let stateRef = (0, $iJhOP$react.useRef)({
54 isFocused: false,
55 observer: null
56 });
57 // Clean up MutationObserver on unmount. See below.
58 // eslint-disable-next-line arrow-body-style
59 (0, $iJhOP$reactariautils.useLayoutEffect)(()=>{
60 const state = stateRef.current;
61 return ()=>{
62 if (state.observer) {
63 state.observer.disconnect();
64 state.observer = null;
65 }
66 };
67 }, []);
68 let dispatchBlur = (0, $iJhOP$reactariautils.useEffectEvent)((e)=>{
69 onBlur === null || onBlur === void 0 ? void 0 : onBlur(e);
70 });
71 // This function is called during a React onFocus event.
72 return (0, $iJhOP$react.useCallback)((e)=>{
73 // React does not fire onBlur when an element is disabled. https://github.com/facebook/react/issues/9142
74 // Most browsers fire a native focusout event in this case, except for Firefox. In that case, we use a
75 // MutationObserver to watch for the disabled attribute, and dispatch these events ourselves.
76 // For browsers that do, focusout fires before the MutationObserver, so onBlur should not fire twice.
77 if (e.target instanceof HTMLButtonElement || e.target instanceof HTMLInputElement || e.target instanceof HTMLTextAreaElement || e.target instanceof HTMLSelectElement) {
78 stateRef.current.isFocused = true;
79 let target = e.target;
80 let onBlurHandler = (e)=>{
81 stateRef.current.isFocused = false;
82 if (target.disabled) // For backward compatibility, dispatch a (fake) React synthetic event.
83 dispatchBlur(new $625cf83917e112ad$export$905e7fc544a71f36('blur', e));
84 // We no longer need the MutationObserver once the target is blurred.
85 if (stateRef.current.observer) {
86 stateRef.current.observer.disconnect();
87 stateRef.current.observer = null;
88 }
89 };
90 target.addEventListener('focusout', onBlurHandler, {
91 once: true
92 });
93 stateRef.current.observer = new MutationObserver(()=>{
94 if (stateRef.current.isFocused && target.disabled) {
95 var _stateRef_current_observer;
96 (_stateRef_current_observer = stateRef.current.observer) === null || _stateRef_current_observer === void 0 ? void 0 : _stateRef_current_observer.disconnect();
97 let relatedTargetEl = target === document.activeElement ? null : document.activeElement;
98 target.dispatchEvent(new FocusEvent('blur', {
99 relatedTarget: relatedTargetEl
100 }));
101 target.dispatchEvent(new FocusEvent('focusout', {
102 bubbles: true,
103 relatedTarget: relatedTargetEl
104 }));
105 }
106 });
107 stateRef.current.observer.observe(target, {
108 attributes: true,
109 attributeFilter: [
110 'disabled'
111 ]
112 });
113 }
114 }, [
115 dispatchBlur
116 ]);
117}
118
119
120//# sourceMappingURL=utils.main.js.map