@inweb/markup 25.7.7 → 25.7.9

package/dist/markup.js

@@ -12407,10 +12407,13 @@
 	                this._konvaTransformer.nodes([]);
 	            }
 	        };
-	        this.resize = () => {
+	        this.resizeContainer = (entries) => {
 	            var _a, _b;
-	            (_a = this._konvaStage) === null || _a === void 0 ? void 0 : _a.width(this._container.clientWidth);
-	            (_b = this._konvaStage) === null || _b === void 0 ? void 0 : _b.height(this._container.clientHeight);
+	            const { width, height } = entries[0].contentRect;
+	            if (!width || !height)
+	                return; // <- invisible container, or container with parent removed
+	            (_a = this._konvaStage) === null || _a === void 0 ? void 0 : _a.width(width);
+	            (_b = this._konvaStage) === null || _b === void 0 ? void 0 : _b.height(height);
 	        };
 	        this.pan = (event) => {
 	            const dX = event.dX / window.devicePixelRatio;
@@ -12438,12 +12441,12 @@
 	        this._markupContainer.style.outline = "0px";
 	        const parentDiv = this._container.parentElement;
 	        parentDiv.appendChild(this._markupContainer);
+	        this._resizeObserver = new ResizeObserver(this.resizeContainer);
+	        this._resizeObserver.observe(parentDiv);
 	        this._markupColor.setColor(255, 0, 0);
 	        this.initializeKonva();
-	        this.resize();
 	        if (this._viewer) {
 	            this._pointerEvents.forEach((x) => this._markupContainer.addEventListener(x, this.redirectToViewer));
-	            this._viewer.addEventListener("resize", this.resize);
 	            this._viewer.addEventListener("changeactivedragger", this.changeActiveDragger);
 	            this._viewer.addEventListener("pan", this.pan);
 	        }
@@ -12455,10 +12458,11 @@
 	        if (this._viewer) {
 	            this._viewer.removeEventListener("pan", this.pan);
 	            this._viewer.removeEventListener("changeactivedragger", this.changeActiveDragger);
-	            this._viewer.removeEventListener("resize", this.resize);
 	        }
 	        this._pointerEvents.forEach((x) => this._markupContainer.removeEventListener(x, this.redirectToViewer));
 	        this.destroyKonva();
+	        this._resizeObserver.disconnect();
+	        this._resizeObserver = undefined;
 	        this._markupContainer.remove();
 	        this._markupContainer = undefined;
 	        this._container = undefined;