@nova-ui/bits
Version:
SolarWinds Nova Framework
76 lines • 12 kB
JavaScript
// © 2022 SolarWinds Worldwide, LLC. All rights reserved.
//
// Permission is hereby granted, free of charge, to any person obtaining a copy
// of this software and associated documentation files (the "Software"), to
// deal in the Software without restriction, including without limitation the
// rights to use, copy, modify, merge, publish, distribute, sublicense, and/or
// sell copies of the Software, and to permit persons to whom the Software is
// furnished to do so, subject to the following conditions:
//
// The above copyright notice and this permission notice shall be included in
// all copies or substantial portions of the Software.
//
// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
// THE SOFTWARE.
import some from "lodash/some";
export class OverlayUtilitiesService {
setPopupComponent(overlayComponent) {
this.overlayComponent = overlayComponent;
return this;
}
// might be heavy, think about another way to handle that
getResizeObserver(config) {
// We need the overlay to keep track of the width and height of its toggle reference in order to follow it's dimensions.
// Derived from NUI-4744
const toggleRefResizeObserver$ = new ResizeObserver((entries) => {
// We need to use requestAnimationFrame here to avoid a common 'ResizeObserver loop limit exceeded' error.
// This error means that ResizeObserver was not able to deliver all observations within a single animation frame.
// This error is not breaking for the component, and can be ignored, though it breaks unit tests heavily.
// https://stackoverflow.com/questions/49384120/resizeobserver-loop-limit-exceeded
window.requestAnimationFrame(() => {
if (!Array.isArray(entries) || !entries.length) {
return;
}
entries.forEach((entry) => {
this.overlayComponent.getOverlayRef()?.updatePosition();
if (!(config && config.updateSize === false)) {
this.overlayComponent.getOverlayRef()?.updateSize({
width: entry.target.getBoundingClientRect()
.width,
});
}
});
});
});
return toggleRefResizeObserver$;
}
syncWidth() {
const overlayRef = this.getOverlayRef();
if (!overlayRef) {
return;
}
if (this.isOverlayWidthConfigured) {
return;
}
const refRect = this.overlayComponent.toggleReference.getBoundingClientRect();
const popupWidth = refRect.width;
this.overlayComponent.getOverlayRef().updateSize({ width: popupWidth });
}
getOverlayRef() {
return this.overlayComponent?.getOverlayRef();
}
get isOverlayWidthConfigured() {
return (this.overlayComponent.overlayConfig &&
some([
this.overlayComponent.overlayConfig.width,
this.overlayComponent.overlayConfig.minWidth,
this.overlayComponent.overlayConfig.maxWidth,
]));
}
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoib3ZlcmxheS11dGlsaXRpZXMuc2VydmljZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9saWIvb3ZlcmxheS9vdmVybGF5LXV0aWxpdGllcy5zZXJ2aWNlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLHlEQUF5RDtBQUN6RCxFQUFFO0FBQ0YsK0VBQStFO0FBQy9FLDRFQUE0RTtBQUM1RSw4RUFBOEU7QUFDOUUsK0VBQStFO0FBQy9FLDhFQUE4RTtBQUM5RSw0REFBNEQ7QUFDNUQsRUFBRTtBQUNGLDZFQUE2RTtBQUM3RSx1REFBdUQ7QUFDdkQsRUFBRTtBQUNGLDZFQUE2RTtBQUM3RSw0RUFBNEU7QUFDNUUsK0VBQStFO0FBQy9FLDBFQUEwRTtBQUMxRSxpRkFBaUY7QUFDakYsNkVBQTZFO0FBQzdFLGlCQUFpQjtBQUdqQixPQUFPLElBQUksTUFBTSxhQUFhLENBQUM7QUFLL0IsTUFBTSxPQUFPLHVCQUF1QjtJQUd6QixpQkFBaUIsQ0FDcEIsZ0JBQWtDO1FBRWxDLElBQUksQ0FBQyxnQkFBZ0IsR0FBRyxnQkFBZ0IsQ0FBQztRQUN6QyxPQUFPLElBQUksQ0FBQztJQUNoQixDQUFDO0lBRUQseURBQXlEO0lBQ2xELGlCQUFpQixDQUFDLE1BQXNCO1FBQzNDLHdIQUF3SDtRQUN4SCx3QkFBd0I7UUFDeEIsTUFBTSx3QkFBd0IsR0FBRyxJQUFJLGNBQWMsQ0FDL0MsQ0FBQyxPQUE4QixFQUFFLEVBQUU7WUFDL0IsMEdBQTBHO1lBQzFHLGlIQUFpSDtZQUNqSCx5R0FBeUc7WUFDekcsa0ZBQWtGO1lBQ2xGLE1BQU0sQ0FBQyxxQkFBcUIsQ0FBQyxHQUFHLEVBQUU7Z0JBQzlCLElBQUksQ0FBQyxLQUFLLENBQUMsT0FBTyxDQUFDLE9BQU8sQ0FBQyxJQUFJLENBQUMsT0FBTyxDQUFDLE1BQU0sRUFBRTtvQkFDNUMsT0FBTztpQkFDVjtnQkFFRCxPQUFPLENBQUMsT0FBTyxDQUFDLENBQUMsS0FBMEIsRUFBRSxFQUFFO29CQUMzQyxJQUFJLENBQUMsZ0JBQWdCLENBQUMsYUFBYSxFQUFFLEVBQUUsY0FBYyxFQUFFLENBQUM7b0JBQ3hELElBQUksQ0FBQyxDQUFDLE1BQU0sSUFBSSxNQUFNLENBQUMsVUFBVSxLQUFLLEtBQUssQ0FBQyxFQUFFO3dCQUMxQyxJQUFJLENBQUMsZ0JBQWdCLENBQUMsYUFBYSxFQUFFLEVBQUUsVUFBVSxDQUFDOzRCQUM5QyxLQUFLLEVBQUUsS0FBSyxDQUFDLE1BQU0sQ0FBQyxxQkFBcUIsRUFBRTtpQ0FDdEMsS0FBSzt5QkFDYixDQUFDLENBQUM7cUJBQ047Z0JBQ0wsQ0FBQyxDQUFDLENBQUM7WUFDUCxDQUFDLENBQUMsQ0FBQztRQUNQLENBQUMsQ0FDSixDQUFDO1FBQ0YsT0FBTyx3QkFBd0IsQ0FBQztJQUNwQyxDQUFDO0lBRU0sU0FBUztRQUNaLE1BQU0sVUFBVSxHQUFHLElBQUksQ0FBQyxhQUFhLEVBQUUsQ0FBQztRQUN4QyxJQUFJLENBQUMsVUFBVSxFQUFFO1lBQ2IsT0FBTztTQUNWO1FBRUQsSUFBSSxJQUFJLENBQUMsd0JBQXdCLEVBQUU7WUFDL0IsT0FBTztTQUNWO1FBRUQsTUFBTSxPQUFPLEdBQ1QsSUFBSSxDQUFDLGdCQUFnQixDQUFDLGVBQWUsQ0FBQyxxQkFBcUIsRUFBRSxDQUFDO1FBQ2xFLE1BQU0sVUFBVSxHQUFHLE9BQU8sQ0FBQyxLQUFLLENBQUM7UUFDakMsSUFBSSxDQUFDLGdCQUFnQixDQUFDLGFBQWEsRUFBRSxDQUFDLFVBQVUsQ0FBQyxFQUFFLEtBQUssRUFBRSxVQUFVLEVBQUUsQ0FBQyxDQUFDO0lBQzVFLENBQUM7SUFFTyxhQUFhO1FBQ2pCLE9BQU8sSUFBSSxDQUFDLGdCQUFnQixFQUFFLGFBQWEsRUFBRSxDQUFDO0lBQ2xELENBQUM7SUFFRCxJQUFZLHdCQUF3QjtRQUNoQyxPQUFPLENBQ0gsSUFBSSxDQUFDLGdCQUFnQixDQUFDLGFBQWE7WUFDbkMsSUFBSSxDQUFDO2dCQUNELElBQUksQ0FBQyxnQkFBZ0IsQ0FBQyxhQUFhLENBQUMsS0FBSztnQkFDekMsSUFBSSxDQUFDLGdCQUFnQixDQUFDLGFBQWEsQ0FBQyxRQUFRO2dCQUM1QyxJQUFJLENBQUMsZ0JBQWdCLENBQUMsYUFBYSxDQUFDLFFBQVE7YUFDL0MsQ0FBQyxDQUNMLENBQUM7SUFDTixDQUFDO0NBQ0oiLCJzb3VyY2VzQ29udGVudCI6WyIvLyDCqSAyMDIyIFNvbGFyV2luZHMgV29ybGR3aWRlLCBMTEMuIEFsbCByaWdodHMgcmVzZXJ2ZWQuXG4vL1xuLy8gUGVybWlzc2lvbiBpcyBoZXJlYnkgZ3JhbnRlZCwgZnJlZSBvZiBjaGFyZ2UsIHRvIGFueSBwZXJzb24gb2J0YWluaW5nIGEgY29weVxuLy8gIG9mIHRoaXMgc29mdHdhcmUgYW5kIGFzc29jaWF0ZWQgZG9jdW1lbnRhdGlvbiBmaWxlcyAodGhlIFwiU29mdHdhcmVcIiksIHRvXG4vLyAgZGVhbCBpbiB0aGUgU29mdHdhcmUgd2l0aG91dCByZXN0cmljdGlvbiwgaW5jbHVkaW5nIHdpdGhvdXQgbGltaXRhdGlvbiB0aGVcbi8vICByaWdodHMgdG8gdXNlLCBjb3B5LCBtb2RpZnksIG1lcmdlLCBwdWJsaXNoLCBkaXN0cmlidXRlLCBzdWJsaWNlbnNlLCBhbmQvb3Jcbi8vICBzZWxsIGNvcGllcyBvZiB0aGUgU29mdHdhcmUsIGFuZCB0byBwZXJtaXQgcGVyc29ucyB0byB3aG9tIHRoZSBTb2Z0d2FyZSBpc1xuLy8gIGZ1cm5pc2hlZCB0byBkbyBzbywgc3ViamVjdCB0byB0aGUgZm9sbG93aW5nIGNvbmRpdGlvbnM6XG4vL1xuLy8gVGhlIGFib3ZlIGNvcHlyaWdodCBub3RpY2UgYW5kIHRoaXMgcGVybWlzc2lvbiBub3RpY2Ugc2hhbGwgYmUgaW5jbHVkZWQgaW5cbi8vICBhbGwgY29waWVzIG9yIHN1YnN0YW50aWFsIHBvcnRpb25zIG9mIHRoZSBTb2Z0d2FyZS5cbi8vXG4vLyBUSEUgU09GVFdBUkUgSVMgUFJPVklERUQgXCJBUyBJU1wiLCBXSVRIT1VUIFdBUlJBTlRZIE9GIEFOWSBLSU5ELCBFWFBSRVNTIE9SXG4vLyAgSU1QTElFRCwgSU5DTFVESU5HIEJVVCBOT1QgTElNSVRFRCBUTyBUSEUgV0FSUkFOVElFUyBPRiBNRVJDSEFOVEFCSUxJVFksXG4vLyAgRklUTkVTUyBGT1IgQSBQQVJUSUNVTEFSIFBVUlBPU0UgQU5EIE5PTklORlJJTkdFTUVOVC4gSU4gTk8gRVZFTlQgU0hBTEwgVEhFXG4vLyAgQVVUSE9SUyBPUiBDT1BZUklHSFQgSE9MREVSUyBCRSBMSUFCTEUgRk9SIEFOWSBDTEFJTSwgREFNQUdFUyBPUiBPVEhFUlxuLy8gIExJQUJJTElUWSwgV0hFVEhFUiBJTiBBTiBBQ1RJT04gT0YgQ09OVFJBQ1QsIFRPUlQgT1IgT1RIRVJXSVNFLCBBUklTSU5HIEZST00sXG4vLyAgT1VUIE9GIE9SIElOIENPTk5FQ1RJT04gV0lUSCBUSEUgU09GVFdBUkUgT1IgVEhFIFVTRSBPUiBPVEhFUiBERUFMSU5HUyBJTlxuLy8gIFRIRSBTT0ZUV0FSRS5cblxuaW1wb3J0IHsgT3ZlcmxheVJlZiB9IGZyb20gXCJAYW5ndWxhci9jZGsvb3ZlcmxheVwiO1xuaW1wb3J0IHNvbWUgZnJvbSBcImxvZGFzaC9zb21lXCI7XG5cbmltcG9ydCB7IE92ZXJsYXlDb21wb25lbnQgfSBmcm9tIFwiLi9vdmVybGF5LWNvbXBvbmVudC9vdmVybGF5LmNvbXBvbmVudFwiO1xuaW1wb3J0IHsgSVJlc2l6ZUNvbmZpZyB9IGZyb20gXCIuL3R5cGVzXCI7XG5cbmV4cG9ydCBjbGFzcyBPdmVybGF5VXRpbGl0aWVzU2VydmljZSB7XG4gICAgcHJpdmF0ZSBvdmVybGF5Q29tcG9uZW50OiBPdmVybGF5Q29tcG9uZW50O1xuXG4gICAgcHVibGljIHNldFBvcHVwQ29tcG9uZW50KFxuICAgICAgICBvdmVybGF5Q29tcG9uZW50OiBPdmVybGF5Q29tcG9uZW50XG4gICAgKTogT3ZlcmxheVV0aWxpdGllc1NlcnZpY2Uge1xuICAgICAgICB0aGlzLm92ZXJsYXlDb21wb25lbnQgPSBvdmVybGF5Q29tcG9uZW50O1xuICAgICAgICByZXR1cm4gdGhpcztcbiAgICB9XG5cbiAgICAvLyBtaWdodCBiZSBoZWF2eSwgdGhpbmsgYWJvdXQgYW5vdGhlciB3YXkgdG8gaGFuZGxlIHRoYXRcbiAgICBwdWJsaWMgZ2V0UmVzaXplT2JzZXJ2ZXIoY29uZmlnPzogSVJlc2l6ZUNvbmZpZyk6IFJlc2l6ZU9ic2VydmVyIHtcbiAgICAgICAgLy8gV2UgbmVlZCB0aGUgb3ZlcmxheSB0byBrZWVwIHRyYWNrIG9mIHRoZSB3aWR0aCBhbmQgaGVpZ2h0IG9mIGl0cyB0b2dnbGUgcmVmZXJlbmNlIGluIG9yZGVyIHRvIGZvbGxvdyBpdCdzIGRpbWVuc2lvbnMuXG4gICAgICAgIC8vIERlcml2ZWQgZnJvbSBOVUktNDc0NFxuICAgICAgICBjb25zdCB0b2dnbGVSZWZSZXNpemVPYnNlcnZlciQgPSBuZXcgUmVzaXplT2JzZXJ2ZXIoXG4gICAgICAgICAgICAoZW50cmllczogUmVzaXplT2JzZXJ2ZXJFbnRyeVtdKSA9PiB7XG4gICAgICAgICAgICAgICAgLy8gV2UgbmVlZCB0byB1c2UgcmVxdWVzdEFuaW1hdGlvbkZyYW1lIGhlcmUgdG8gYXZvaWQgYSBjb21tb24gJ1Jlc2l6ZU9ic2VydmVyIGxvb3AgbGltaXQgZXhjZWVkZWQnIGVycm9yLlxuICAgICAgICAgICAgICAgIC8vIFRoaXMgZXJyb3IgbWVhbnMgdGhhdCBSZXNpemVPYnNlcnZlciB3YXMgbm90IGFibGUgdG8gZGVsaXZlciBhbGwgb2JzZXJ2YXRpb25zIHdpdGhpbiBhIHNpbmdsZSBhbmltYXRpb24gZnJhbWUuXG4gICAgICAgICAgICAgICAgLy8gVGhpcyBlcnJvciBpcyBub3QgYnJlYWtpbmcgZm9yIHRoZSBjb21wb25lbnQsIGFuZCBjYW4gYmUgaWdub3JlZCwgdGhvdWdoIGl0IGJyZWFrcyB1bml0IHRlc3RzIGhlYXZpbHkuXG4gICAgICAgICAgICAgICAgLy8gaHR0cHM6Ly9zdGFja292ZXJmbG93LmNvbS9xdWVzdGlvbnMvNDkzODQxMjAvcmVzaXplb2JzZXJ2ZXItbG9vcC1saW1pdC1leGNlZWRlZFxuICAgICAgICAgICAgICAgIHdpbmRvdy5yZXF1ZXN0QW5pbWF0aW9uRnJhbWUoKCkgPT4ge1xuICAgICAgICAgICAgICAgICAgICBpZiAoIUFycmF5LmlzQXJyYXkoZW50cmllcykgfHwgIWVudHJpZXMubGVuZ3RoKSB7XG4gICAgICAgICAgICAgICAgICAgICAgICByZXR1cm47XG4gICAgICAgICAgICAgICAgICAgIH1cblxuICAgICAgICAgICAgICAgICAgICBlbnRyaWVzLmZvckVhY2goKGVudHJ5OiBSZXNpemVPYnNlcnZlckVudHJ5KSA9PiB7XG4gICAgICAgICAgICAgICAgICAgICAgICB0aGlzLm92ZXJsYXlDb21wb25lbnQuZ2V0T3ZlcmxheVJlZigpPy51cGRhdGVQb3NpdGlvbigpO1xuICAgICAgICAgICAgICAgICAgICAgICAgaWYgKCEoY29uZmlnICYmIGNvbmZpZy51cGRhdGVTaXplID09PSBmYWxzZSkpIHtcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICB0aGlzLm92ZXJsYXlDb21wb25lbnQuZ2V0T3ZlcmxheVJlZigpPy51cGRhdGVTaXplKHtcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgd2lkdGg6IGVudHJ5LnRhcmdldC5nZXRCb3VuZGluZ0NsaWVudFJlY3QoKVxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgLndpZHRoLFxuICAgICAgICAgICAgICAgICAgICAgICAgICAgIH0pO1xuICAgICAgICAgICAgICAgICAgICAgICAgfVxuICAgICAgICAgICAgICAgICAgICB9KTtcbiAgICAgICAgICAgICAgICB9KTtcbiAgICAgICAgICAgIH1cbiAgICAgICAgKTtcbiAgICAgICAgcmV0dXJuIHRvZ2dsZVJlZlJlc2l6ZU9ic2VydmVyJDtcbiAgICB9XG5cbiAgICBwdWJsaWMgc3luY1dpZHRoKCk6IHZvaWQge1xuICAgICAgICBjb25zdCBvdmVybGF5UmVmID0gdGhpcy5nZXRPdmVybGF5UmVmKCk7XG4gICAgICAgIGlmICghb3ZlcmxheVJlZikge1xuICAgICAgICAgICAgcmV0dXJuO1xuICAgICAgICB9XG5cbiAgICAgICAgaWYgKHRoaXMuaXNPdmVybGF5V2lkdGhDb25maWd1cmVkKSB7XG4gICAgICAgICAgICByZXR1cm47XG4gICAgICAgIH1cblxuICAgICAgICBjb25zdCByZWZSZWN0ID1cbiAgICAgICAgICAgIHRoaXMub3ZlcmxheUNvbXBvbmVudC50b2dnbGVSZWZlcmVuY2UuZ2V0Qm91bmRpbmdDbGllbnRSZWN0KCk7XG4gICAgICAgIGNvbnN0IHBvcHVwV2lkdGggPSByZWZSZWN0LndpZHRoO1xuICAgICAgICB0aGlzLm92ZXJsYXlDb21wb25lbnQuZ2V0T3ZlcmxheVJlZigpLnVwZGF0ZVNpemUoeyB3aWR0aDogcG9wdXBXaWR0aCB9KTtcbiAgICB9XG5cbiAgICBwcml2YXRlIGdldE92ZXJsYXlSZWYoKTogT3ZlcmxheVJlZiB7XG4gICAgICAgIHJldHVybiB0aGlzLm92ZXJsYXlDb21wb25lbnQ/LmdldE92ZXJsYXlSZWYoKTtcbiAgICB9XG5cbiAgICBwcml2YXRlIGdldCBpc092ZXJsYXlXaWR0aENvbmZpZ3VyZWQoKTogYm9vbGVhbiB7XG4gICAgICAgIHJldHVybiAoXG4gICAgICAgICAgICB0aGlzLm92ZXJsYXlDb21wb25lbnQub3ZlcmxheUNvbmZpZyAmJlxuICAgICAgICAgICAgc29tZShbXG4gICAgICAgICAgICAgICAgdGhpcy5vdmVybGF5Q29tcG9uZW50Lm92ZXJsYXlDb25maWcud2lkdGgsXG4gICAgICAgICAgICAgICAgdGhpcy5vdmVybGF5Q29tcG9uZW50Lm92ZXJsYXlDb25maWcubWluV2lkdGgsXG4gICAgICAgICAgICAgICAgdGhpcy5vdmVybGF5Q29tcG9uZW50Lm92ZXJsYXlDb25maWcubWF4V2lkdGgsXG4gICAgICAgICAgICBdKVxuICAgICAgICApO1xuICAgIH1cbn1cbiJdfQ==