56 lines
3.0 KiB
JavaScript
56 lines
3.0 KiB
JavaScript
|
define(["require", "exports", "@fluentui/utilities", "react", "@fluentui/react-window-provider"], function (require, exports, utilities_1, React, react_window_provider_1) {
|
||
|
|
"use strict";
|
||
|
|
Object.defineProperty(exports, "__esModule", { value: true });
|
||
|
|
exports.useTarget = void 0;
|
||
|
|
/**
|
||
|
|
* Hook to calculate and cache the target element specified by the given target attribute,
|
||
|
|
* as well as the target element's (or host element's) parent window
|
||
|
|
* @param target- Target selector passed to the component as a property, describing the element that
|
||
|
|
* the callout should target
|
||
|
|
* @param hostElement- The callout's host element, used for determining the parent window.
|
||
|
|
*/
|
||
|
|
function useTarget(target, hostElement) {
|
||
|
|
var _a, _b, _c;
|
||
|
|
var previousTargetProp = React.useRef();
|
||
|
|
var targetRef = React.useRef(null);
|
||
|
|
/**
|
||
|
|
* Stores an instance of Window, used to check
|
||
|
|
* for server side rendering and if focus was lost.
|
||
|
|
*/
|
||
|
|
var targetWindow = (0, react_window_provider_1.useWindow)();
|
||
|
|
// If the target element changed, find the new one. If we are tracking
|
||
|
|
// target with class name, always find element because we do not know if
|
||
|
|
// fabric has rendered a new element and disposed the old element.
|
||
|
|
if (!target || target !== previousTargetProp.current || typeof target === 'string') {
|
||
|
|
var currentElement = hostElement === null || hostElement === void 0 ? void 0 : hostElement.current;
|
||
|
|
if (target) {
|
||
|
|
if (typeof target === 'string') {
|
||
|
|
// If element is part of shadow dom, then querySelector on shadow root, else query on document
|
||
|
|
if ((_a = currentElement === null || currentElement === void 0 ? void 0 : currentElement.getRootNode()) === null || _a === void 0 ? void 0 : _a.host) {
|
||
|
|
targetRef.current = (_c = (_b = currentElement === null || currentElement === void 0 ? void 0 : currentElement.getRootNode()) === null || _b === void 0 ? void 0 : _b.querySelector(target)) !== null && _c !== void 0 ? _c : null;
|
||
|
|
}
|
||
|
|
else {
|
||
|
|
var currentDoc = (0, utilities_1.getDocument)(currentElement);
|
||
|
|
targetRef.current = currentDoc ? currentDoc.querySelector(target) : null;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
else if ('stopPropagation' in target) {
|
||
|
|
targetRef.current = target;
|
||
|
|
}
|
||
|
|
else if ('getBoundingClientRect' in target) {
|
||
|
|
targetRef.current = target;
|
||
|
|
}
|
||
|
|
else if ('current' in target) {
|
||
|
|
targetRef.current = target.current;
|
||
|
|
}
|
||
|
|
else {
|
||
|
|
targetRef.current = target;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
previousTargetProp.current = target;
|
||
|
|
}
|
||
|
|
return [targetRef, targetWindow];
|
||
|
|
}
|
||
|
|
exports.useTarget = useTarget;
|
||
|
|
});
|
||
|
|
//# sourceMappingURL=useTarget.js.map
|