@sandemo/easy-annotator 0.1.0

package/dist/markerjs3-DiaiYpgs.cjs

@@ -0,0 +1,57 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});class r{static createDefs(){return document.createElementNS("http://www.w3.org/2000/svg","defs")}static setAttributes(t,i){for(const[e,s]of i)t.setAttribute(e,s)}static createRect(t,i,e){const s=document.createElementNS("http://www.w3.org/2000/svg","rect");return s.setAttribute("width",t.toString()),s.setAttribute("height",i.toString()),e&&r.setAttributes(s,e),s}static createLine(t,i,e,s,a){const h=document.createElementNS("http://www.w3.org/2000/svg","line");return h.setAttribute("x1",t.toString()),h.setAttribute("y1",i.toString()),h.setAttribute("x2",e.toString()),h.setAttribute("y2",s.toString()),a&&r.setAttributes(h,a),h}static createPolygon(t,i){const e=document.createElementNS("http://www.w3.org/2000/svg","polygon");return e.setAttribute("points",t),i&&r.setAttributes(e,i),e}static createCircle(t,i){const e=document.createElementNS("http://www.w3.org/2000/svg","circle");return e.setAttribute("cx",(t/2).toString()),e.setAttribute("cy",(t/2).toString()),e.setAttribute("r",t.toString()),i&&r.setAttributes(e,i),e}static createEllipse(t,i,e){const s=document.createElementNS("http://www.w3.org/2000/svg","ellipse");return s.setAttribute("cx",(t/2).toString()),s.setAttribute("cy",(i/2).toString()),s.setAttribute("rx",(t/2).toString()),s.setAttribute("ry",(i/2).toString()),e&&r.setAttributes(s,e),s}static createGroup(t){const i=document.createElementNS("http://www.w3.org/2000/svg","g");return t&&r.setAttributes(i,t),i}static createTransform(){return document.createElementNS("http://www.w3.org/2000/svg","svg").createSVGTransform()}static createMarker(t,i,e,s,a,h,o){const n=document.createElementNS("http://www.w3.org/2000/svg","marker");return r.setAttributes(n,[["id",t],["orient",i],["markerWidth",e.toString()],["markerHeight",s.toString()],["refX",a.toString()],["refY",h.toString()]]),n.appendChild(o),n}static createText(t){const i=document.createElementNS("http://www.w3.org/2000/svg","text");return i.setAttribute("x","0"),i.setAttribute("y","0"),t&&r.setAttributes(i,t),i}static createTSpan(t,i){const e=document.createElementNS("http://www.w3.org/2000/svg","tspan");return e.textContent=t,i&&r.setAttributes(e,i),e}static createImage(t){const i=document.createElementNS("http://www.w3.org/2000/svg","image");return t&&r.setAttributes(i,t),i}static createPoint(t,i){const e=document.createElementNS("http://www.w3.org/2000/svg","svg").createSVGPoint();return e.x=t,e.y=i,e}static createPath(t,i){const e=document.createElementNS("http://www.w3.org/2000/svg","path");return e.setAttribute("d",t),i&&r.setAttributes(e,i),e}static createForeignObject(t){const i=document.createElementNS("http://www.w3.org/2000/svg","foreignObject");return i.setAttribute("x","0"),i.setAttribute("y","0"),t&&r.setAttributes(i,t),i}static clientToLocalCoordinates(t,i,e,s=1){if(t){const a=t.getBoundingClientRect();return{x:(i-a.left)/s,y:(e-a.top)/s}}return{x:i,y:e}}static createSvgFromString(t){const i=document.createElementNS("http://www.w3.org/2000/svg","svg");return i.innerHTML=t,i}static createFilter(t,i,e){const s=document.createElementNS("http://www.w3.org/2000/svg","filter");return s.id=t,i&&r.setAttributes(s,i),e&&(s.innerHTML=e),s}}class c{static addKey(t,i){c.keys.set(t,i),c.keyAddListeners.forEach(e=>{e()})}static addKeyAddListener(t){c.keyAddListeners.push(t)}static removeKeyAddListener(t){const i=c.keyAddListeners.indexOf(t);i>-1&&c.keyAddListeners.splice(i,1)}static isLicensed(t){if(c.keys.has(t)){const i=new RegExp(`${t}-[A-Z][0-9]{3}-[A-Z][0-9]{3}-[0-9]{4}`,"i"),e=c.keys.get(t);return e!==void 0&&i.test(e)}return!1}}c.keys=new Map,c.keyAddListeners=new Array;class b{get typeName(){return Object.getPrototypeOf(this).constructor.typeName}get container(){return this._container}get strokeColor(){return this._strokeColor}set strokeColor(t){this._strokeColor=t,this.applyStrokeColor()}applyStrokeColor(){}get fillColor(){return this._fillColor}set fillColor(t){this._fillColor=t,this.applyFillColor()}applyFillColor(){}get strokeWidth(){return this._strokeWidth}set strokeWidth(t){this._strokeWidth=t,this.applyStrokeWidth()}applyStrokeWidth(){}get strokeDasharray(){return this._strokeDasharray}set strokeDasharray(t){this._strokeDasharray=t,this.applyStrokeDasharray()}applyStrokeDasharray(){}get opacity(){return this._opacity}set opacity(t){this._opacity=t,this.applyOpacity()}applyOpacity(){}constructor(t){this.defaultSize={width:50,height:20},this.stage="normal",this._strokeColor="transparent",this._fillColor="transparent",this._strokeWidth=0,this._strokeDasharray="",this._opacity=1,this._container=t,this.applyFillColor=this.applyFillColor.bind(this),this.applyStrokeColor=this.applyStrokeColor.bind(this),this.applyStrokeWidth=this.applyStrokeWidth.bind(this),this.applyStrokeDasharray=this.applyStrokeDasharray.bind(this),this.applyOpacity=this.applyOpacity.bind(this),this.getBBox=this.getBBox.bind(this)}ownsTarget(t){return!1}dispose(){}addMarkerVisualToContainer(t){this.container.childNodes.length>0?this.container.insertBefore(t,this.container.childNodes[0]):this.container.appendChild(t)}getOutline(){return""}getState(){return{typeName:Object.getPrototypeOf(this).constructor.typeName,notes:this.notes,strokeColor:this._strokeColor,strokeWidth:this._strokeWidth,strokeDasharray:this._strokeDasharray,opacity:this._opacity}}restoreState(t){var i,e,s,a;this.notes=t.notes,this._strokeColor=(i=t.strokeColor)!==null&&i!==void 0?i:this._strokeColor,this._strokeWidth=(e=t.strokeWidth)!==null&&e!==void 0?e:this._strokeWidth,this._strokeDasharray=(s=t.strokeDasharray)!==null&&s!==void 0?s:this._strokeDasharray,this._opacity=(a=t.opacity)!==null&&a!==void 0?a:this._opacity}scale(t,i){}getBBox(){return this.container.getBBox()}}b.typeName="MarkerBase",b.applyDefaultFilter=!0;class H{static toITransformMatrix(t){return{a:t.a,b:t.b,c:t.c,d:t.d,e:t.e,f:t.f}}static toSVGMatrix(t,i){return t.a=i.a,t.b=i.b,t.c=i.c,t.d=i.d,t.e=i.e,t.f=i.f,t}}class X extends b{get centerX(){return this.left+this.width/2}get centerY(){return this.top+this.height/2}get visual(){return this._visual}set visual(t){this._visual=t;const i=r.createTransform();this._visual.transform.baseVal.appendItem(i)}constructor(t){super(t),this.left=0,this.top=0,this.width=0,this.height=0,this.rotationAngle=0,this.rotatePoint=this.rotatePoint.bind(this),this.unrotatePoint=this.unrotatePoint.bind(this),this.container.transform.baseVal.appendItem(r.createTransform())}moveVisual(t){this.visual&&(this.visual.style.transform=`translate(${t.x}px, ${t.y}px)`)}setSize(){this.moveVisual({x:this.left,y:this.top})}rotate(t){if(Math.abs(t.x-this.centerX)>.1){const i=Math.sign(t.x-this.centerX);this.rotationAngle=180*Math.atan((t.y-this.centerY)/(t.x-this.centerX))/Math.PI+90*i,this.applyRotation()}}applyRotation(){const t=this.container.transform.baseVal.getItem(0);t.setRotate(this.rotationAngle,this.centerX,this.centerY),this.container.transform.baseVal.replaceItem(t,0)}rotatePoint(t){if(this.rotationAngle===0)return t;const i=this.container.getCTM();if(i===null)return t;let e=r.createPoint(t.x,t.y);return e=e.matrixTransform(i),{x:e.x,y:e.y}}unrotatePoint(t){if(this.rotationAngle===0)return t;let i=this.container.getCTM();if(i===null)return t;i=i.inverse();let e=r.createPoint(t.x,t.y);return e=e.matrixTransform(i),{x:e.x,y:e.y}}getOutline(){return`M 0 0 
+    H ${this.defaultSize} 
+    V ${this.defaultSize} 
+    H 0 
+    V 0 Z`}getState(){return Object.assign({left:this.left,top:this.top,width:this.width,height:this.height,rotationAngle:this.rotationAngle,visualTransformMatrix:H.toITransformMatrix(this.visual.transform.baseVal.getItem(0).matrix),containerTransformMatrix:H.toITransformMatrix(this.container.transform.baseVal.getItem(0).matrix)},super.getState())}restoreState(t){super.restoreState(t);const i=t;this.left=i.left,this.top=i.top,this.width=i.width,this.height=i.height,this.rotationAngle=i.rotationAngle,this.moveVisual({x:this.left,y:this.top}),i.visualTransformMatrix&&i.containerTransformMatrix?(this.visual.transform.baseVal.getItem(0).setMatrix(H.toSVGMatrix(this.visual.transform.baseVal.getItem(0).matrix,i.visualTransformMatrix)),this.container.transform.baseVal.getItem(0).setMatrix(H.toSVGMatrix(this.container.transform.baseVal.getItem(0).matrix,i.containerTransformMatrix))):this.applyRotation()}scale(t,i){super.scale(t,i);const e=this.rotatePoint({x:this.left,y:this.top}),s=this.unrotatePoint({x:e.x*t,y:e.y*i});this.left=s.x,this.top=s.y,this.width=this.width*t,this.height=this.height*i}getBBox(){const t=this.rotatePoint({x:this.left,y:this.top}),i=this.rotatePoint({x:this.left+this.width,y:this.top}),e=this.rotatePoint({x:this.left,y:this.top+this.height}),s=this.rotatePoint({x:this.left+this.width,y:this.top+this.height}),a={x:Math.min(t.x,i.x,e.x,s.x),y:Math.min(t.y,i.y,e.y,s.y)},h=Math.max(t.x,i.x,e.x,s.x),o=Math.max(t.y,i.y,e.y,s.y);return new DOMRect(a.x,a.y,h-a.x,o-a.y)}}class W extends X{applyStrokeColor(){this.visual&&r.setAttributes(this.visual,[["stroke",this._strokeColor]])}applyStrokeWidth(){this.visual&&r.setAttributes(this.visual,[["stroke-width",this._strokeWidth.toString()]])}applyStrokeDasharray(){this.visual&&r.setAttributes(this.visual,[["stroke-dasharray",this._strokeDasharray]])}applyOpacity(){this.visual&&r.setAttributes(this.visual,[["opacity",this._opacity.toString()]])}constructor(t){super(t),this.createVisual=this.createVisual.bind(this)}ownsTarget(t){return!(!super.ownsTarget(t)&&t!==this.visual)}getPath(t=this.width,i=this.height){return"M0,0"}getOutline(){return this.getPath(this.defaultSize.width,this.defaultSize.height)}createVisual(){this.visual=r.createPath(this.getPath(),[["fill","transparent"],["stroke",this._strokeColor],["stroke-width",this._strokeWidth.toString()],["stroke-dasharray",this._strokeDasharray],["opacity",this._opacity.toString()]]),this.addMarkerVisualToContainer(this.visual)}adjustVisual(){this.visual&&r.setAttributes(this.visual,[["d",this.getPath()],["fill","transparent"],["stroke",this._strokeColor],["stroke-width",this._strokeWidth.toString()],["stroke-dasharray",this._strokeDasharray],["opacity",this._opacity.toString()]])}setSize(){super.setSize(),this.visual&&r.setAttributes(this.visual,[["d",this.getPath()]])}restoreState(t){this.createVisual(),super.restoreState(t),this.adjustVisual()}scale(t,i){super.scale(t,i),this.strokeWidth*=(t+i)/2,this.setSize()}}W.title="Shape outline marker";class j extends W{applyFillColor(){this.visual&&r.setAttributes(this.visual,[["fill",this._fillColor]])}constructor(t){super(t),this._fillColor="transparent",this.createVisual=this.createVisual.bind(this)}createVisual(){super.createVisual(),this.visual&&r.setAttributes(this.visual,[["fill",this._fillColor]])}getState(){return Object.assign({fillColor:this._fillColor},super.getState())}restoreState(t){const i=t;super.restoreState(t),this.fillColor=i.fillColor,this.setSize()}}j.title="Shape marker";class _ extends W{constructor(t){super(t),this.strokeColor="#ff0000",this.strokeWidth=3}getPath(t=this.width,i=this.height){return`M 0 0 
+      H ${t} 
+      V ${i} 
+      H 0 
+      V 0 Z`}}_.typeName="FrameMarker",_.title="Frame marker";class tt extends b{applyStrokeColor(){this.lineVisual&&r.setAttributes(this.lineVisual,[["stroke",this._strokeColor]]),this.startTerminatorVisual&&this.endTerminatorVisual&&(r.setAttributes(this.startTerminatorVisual,[["stroke",this._strokeColor],["fill",this._strokeColor]]),r.setAttributes(this.endTerminatorVisual,[["stroke",this._strokeColor],["fill",this._strokeColor]]))}applyStrokeWidth(){this.lineVisual&&r.setAttributes(this.lineVisual,[["stroke-width",this._strokeWidth.toString()]]),this.selectorVisual&&r.setAttributes(this.selectorVisual,[["stroke-width",Math.max(this._strokeWidth,8).toString()]])}applyStrokeDasharray(){this.lineVisual&&r.setAttributes(this.lineVisual,[["stroke-dasharray",this._strokeDasharray]])}applyOpacity(){this.visibleVisual&&r.setAttributes(this.visibleVisual,[["opacity",this._opacity.toString()]])}constructor(t){super(t),this.x1=0,this.y1=0,this.x2=0,this.y2=0,this.adjustVisual=this.adjustVisual.bind(this),this.getState=this.getState.bind(this),this.restoreState=this.restoreState.bind(this),this.scale=this.scale.bind(this)}ownsTarget(t){return!(!super.ownsTarget(t)&&t!==this.visual&&t!==this.selectorVisual&&t!==this.visibleVisual&&t!==this.lineVisual&&t!==this.startTerminatorVisual&&t!==this.endTerminatorVisual)}getPath(){return"M0,0"}getStartTerminatorPath(){return""}getEndTerminatorPath(){return""}createVisual(){this.visual=r.createGroup(),this.selectorVisual=r.createPath(this.getPath(),[["stroke","transparent"],["fill","transparent"],["stroke-width",Math.max(this.strokeWidth,8).toString()]]),this.visibleVisual=r.createGroup([["opacity",this.opacity.toString()]]),this.lineVisual=r.createPath(this.getPath(),[["stroke",this.strokeColor],["fill",this.strokeColor],["stroke-width",this.strokeWidth.toString()],["stroke-linejoin","round"],["stroke-dasharray",this.strokeDasharray.toString()]]),this.startTerminatorVisual=r.createPath(this.getStartTerminatorPath(),[["stroke",this.strokeColor],["fill",this.strokeColor],["stroke-width",this.strokeWidth.toString()],["stroke-linejoin","round"]]),this.endTerminatorVisual=r.createPath(this.getEndTerminatorPath(),[["stroke",this.strokeColor],["fill",this.strokeColor],["stroke-width",this.strokeWidth.toString()],["stroke-linejoin","round"]]),this.visibleVisual.appendChild(this.lineVisual),this.visibleVisual.appendChild(this.startTerminatorVisual),this.visibleVisual.appendChild(this.endTerminatorVisual),this.visual.appendChild(this.selectorVisual),this.visual.appendChild(this.visibleVisual),this.addMarkerVisualToContainer(this.visual)}adjustVisual(){this.selectorVisual&&this.visibleVisual&&this.lineVisual&&this.startTerminatorVisual&&this.endTerminatorVisual&&(r.setAttributes(this.selectorVisual,[["d",this.getPath()]]),r.setAttributes(this.visibleVisual,[["opacity",this.opacity.toString()]]),r.setAttributes(this.lineVisual,[["d",this.getPath()],["stroke",this.strokeColor],["fill",this.fillColor],["stroke-width",this.strokeWidth.toString()],["stroke-dasharray",this.strokeDasharray.toString()]]),r.setAttributes(this.startTerminatorVisual,[["d",this.getStartTerminatorPath()],["stroke",this.strokeColor],["fill",this.strokeColor],["stroke-width",this.strokeWidth.toString()]]),r.setAttributes(this.endTerminatorVisual,[["d",this.getEndTerminatorPath()],["stroke",this.strokeColor],["fill",this.strokeColor],["stroke-width",this.strokeWidth.toString()]]))}getState(){return Object.assign({x1:this.x1,y1:this.y1,x2:this.x2,y2:this.y2},super.getState())}restoreState(t){super.restoreState(t);const i=t;this.x1=i.x1,this.y1=i.y1,this.x2=i.x2,this.y2=i.y2,this.createVisual(),this.adjustVisual()}scale(t,i){super.scale(t,i),this.x1=this.x1*t,this.y1=this.y1*i,this.x2=this.x2*t,this.y2=this.y2*i,this.strokeWidth*=(t+i)/2,this.adjustVisual()}}class v extends tt{constructor(t){super(t),this.strokeColor="#ff0000",this.strokeWidth=3,this.createVisual=this.createVisual.bind(this)}getPath(){return`M ${this.x1} ${this.y1} L ${this.x2} ${this.y2}`}}v.typeName="LineMarker",v.title="Line marker";class y extends v{get arrowType(){return this._arrowType}set arrowType(t){this._arrowType=t,this.adjustVisual()}constructor(t){super(t),this._arrowType="end",this.getArrowProperties=this.getArrowProperties.bind(this),this.getStartTerminatorPath=this.getStartTerminatorPath.bind(this),this.getEndTerminatorPath=this.getEndTerminatorPath.bind(this)}getArrowProperties(){const t=10+2*this.strokeWidth,i=Math.min(Math.max(5,2*this.strokeWidth),this.strokeWidth+5),e=this.x2-this.x1,s=this.y2-this.y1;return{arrowHeight:t,arrowDipFactor:.7,angle:Math.atan2(s,e),arrowWidth:i}}getStartTerminatorPath(){const{arrowHeight:t,arrowDipFactor:i,angle:e,arrowWidth:s}=this.getArrowProperties(),a=this.x1+t*i*Math.cos(e),h=this.y1+t*i*Math.sin(e),o=this.x1+t*Math.cos(e),n=this.y1+t*Math.sin(e),l=o+s*Math.sin(e),u=n-s*Math.cos(e),p=o-s*Math.sin(e),x=n+s*Math.cos(e);return this.arrowType==="start"||this.arrowType==="both"?`M ${a} ${h}
+    L ${l} ${u} L ${this.x1} ${this.y1} L ${p} ${x} L ${a} ${h}
+    L ${a} ${h}`:""}getEndTerminatorPath(){const{arrowHeight:t,arrowDipFactor:i,angle:e,arrowWidth:s}=this.getArrowProperties(),a=this.x2-t*i*Math.cos(e),h=this.y2-t*i*Math.sin(e),o=this.x2-t*Math.cos(e),n=this.y2-t*Math.sin(e),l=o+s*Math.sin(e),u=n-s*Math.cos(e),p=o-s*Math.sin(e),x=n+s*Math.cos(e);return this.arrowType==="end"||this.arrowType==="both"?`M ${a} ${h} 
+    L ${l} ${u} L ${this.x2} ${this.y2} L ${p} ${x} L ${a} ${h} Z`:""}applyStrokeWidth(){super.applyStrokeWidth(),this.adjustVisual()}getState(){const t=Object.assign({arrowType:this.arrowType},super.getState());return t.typeName=y.typeName,t}restoreState(t){const i=t;this.arrowType=i.arrowType,super.restoreState(t)}}y.typeName="ArrowMarker",y.title="Arrow marker";class E extends v{constructor(t){super(t)}getStartTerminatorPath(){const{tipLength:t,angle:i}=this.getTerminatorProperties();return`M ${this.x1+t*Math.sin(i)} ${this.y1-t*Math.cos(i)}
+      L ${this.x1-t*Math.sin(i)} ${this.y1+t*Math.cos(i)}`}getEndTerminatorPath(){const{tipLength:t,angle:i}=this.getTerminatorProperties();return`M ${this.x2+t*Math.sin(i)} ${this.y2-t*Math.cos(i)} L ${this.x2-t*Math.sin(i)} ${this.y2+t*Math.cos(i)}`}getTerminatorProperties(){const t=5+3*this.strokeWidth,i=this.x2-this.x1,e=this.y2-this.y1;return{tipLength:t,angle:Math.atan2(e,i)}}applyStrokeWidth(){super.applyStrokeWidth(),this.adjustVisual()}}E.typeName="MeasurementMarker",E.title="Measurement marker";class f extends b{applyStrokeColor(){this.visibleVisual&&r.setAttributes(this.visibleVisual,[["stroke",this._strokeColor]])}applyFillColor(){this.visibleVisual&&r.setAttributes(this.visibleVisual,[["fill",this._fillColor]])}applyStrokeWidth(){this.visibleVisual&&r.setAttributes(this.visibleVisual,[["stroke-width",this._strokeWidth.toString()]]),this.selectorVisual&&r.setAttributes(this.selectorVisual,[["stroke-width",Math.max(this._strokeWidth,8).toString()]])}applyStrokeDasharray(){this.visibleVisual&&r.setAttributes(this.visibleVisual,[["stroke-dasharray",this._strokeDasharray]])}applyOpacity(){this.visibleVisual&&r.setAttributes(this.visibleVisual,[["opacity",this._opacity.toString()]])}constructor(t){super(t),this.points=[],this.selectorVisualLines=[],this.strokeColor="#ff0000",this.strokeWidth=3,this.createVisual=this.createVisual.bind(this),this.adjustVisual=this.adjustVisual.bind(this),this.getState=this.getState.bind(this),this.restoreState=this.restoreState.bind(this),this.scale=this.scale.bind(this)}ownsTarget(t){return!(!super.ownsTarget(t)&&t!==this.visual&&t!==this.selectorVisual&&t!==this.visibleVisual&&!this.selectorVisualLines.some(i=>i===t))}getPath(){return this.points.length>1?this.points.map((t,i)=>`${i===0?"M":"L"}${t.x},${t.y}`).join(" ")+(this.stage!=="creating"?" Z":""):"M0,0"}createVisual(){this.visual=r.createGroup(),this.visibleVisual=r.createPath(this.getPath(),[["stroke",this.strokeColor],["fill",this.fillColor],["stroke-width",this.strokeWidth.toString()],["opacity",this.opacity.toString()]]),this.visual.appendChild(this.visibleVisual),this.createSelectorVisual(),this.addMarkerVisualToContainer(this.visual)}createSelectorVisual(){this.visual&&(this.selectorVisual=r.createGroup(),this.visual.appendChild(this.selectorVisual),this.points.forEach(()=>{this.addSelectorLine()}))}adjustVisual(){this.selectorVisual&&this.visibleVisual&&(r.setAttributes(this.visibleVisual,[["d",this.getPath()],["stroke",this.strokeColor],["stroke-width",this.strokeWidth.toString()],["stroke-dasharray",this.strokeDasharray.toString()],["fill",this.fillColor],["opacity",this.opacity.toString()]]),this.adjustSelectorVisual())}adjustSelectorVisual(){if(this.selectorVisual){const t=this.points.length-this.selectorVisualLines.length;if(t>0)for(let i=0;i<t;i++)this.addSelectorLine();else if(t<0)for(let i=0;i<-t;i++)this.selectorVisual.removeChild(this.selectorVisualLines.pop());this.selectorVisualLines.forEach((i,e)=>{r.setAttributes(i,[["x1",this.points[e].x.toString()],["y1",this.points[e].y.toString()],["x2",this.points[(e+1)%this.points.length].x.toString()],["y2",this.points[(e+1)%this.points.length].y.toString()]])})}}addSelectorLine(){const t=r.createLine(0,0,0,0,[["stroke","transparent"],["stroke-width",Math.max(this.strokeWidth,8).toString()]]);this.selectorVisual.appendChild(t),this.selectorVisualLines.push(t)}getState(){const t=Object.assign({points:this.points,fillColor:this.fillColor},super.getState());return t.typeName=f.typeName,t}restoreState(t){super.restoreState(t);const i=t;this.points=i.points,i.fillColor!==void 0&&(this.fillColor=i.fillColor),this.createVisual(),this.adjustVisual()}scale(t,i){super.scale(t,i),this.points.forEach(e=>{e.x=e.x*t,e.y=e.y*i}),this.adjustVisual()}}f.typeName="PolygonMarker",f.title="Polygon marker";class k extends b{applyStrokeColor(){this.visibleVisual&&r.setAttributes(this.visibleVisual,[["stroke",this._strokeColor]])}applyStrokeWidth(){this.visibleVisual&&r.setAttributes(this.visibleVisual,[["stroke-width",this._strokeWidth.toString()]]),this.selectorVisual&&r.setAttributes(this.selectorVisual,[["stroke-width",Math.max(this._strokeWidth,8).toString()]])}applyStrokeDasharray(){this.visibleVisual&&r.setAttributes(this.visibleVisual,[["stroke-dasharray",this._strokeDasharray]])}applyOpacity(){this.visibleVisual&&r.setAttributes(this.visibleVisual,[["opacity",this._opacity.toString()]])}constructor(t){super(t),this.points=[],this.strokeColor="#ff0000",this.strokeWidth=3,this.createVisual=this.createVisual.bind(this),this.adjustVisual=this.adjustVisual.bind(this),this.getState=this.getState.bind(this),this.restoreState=this.restoreState.bind(this),this.scale=this.scale.bind(this)}ownsTarget(t){return!(!super.ownsTarget(t)&&t!==this.visual&&t!==this.selectorVisual&&t!==this.visibleVisual)}getPath(){return this.points.length>1?this.points.map((t,i)=>`${i===0?"M":"L"}${t.x},${t.y}`).join(" "):"M0,0"}createVisual(){this.visual=r.createGroup(),this.selectorVisual=r.createPath(this.getPath(),[["stroke","transparent"],["fill","transparent"],["stroke-width",Math.max(this.strokeWidth,8).toString()]]),this.visibleVisual=r.createPath(this.getPath(),[["stroke",this.strokeColor],["fill","transparent"],["stroke-width",this.strokeWidth.toString()],["opacity",this.opacity.toString()]]),this.visual.appendChild(this.selectorVisual),this.visual.appendChild(this.visibleVisual),this.addMarkerVisualToContainer(this.visual)}adjustVisual(){if(this.selectorVisual&&this.visibleVisual){const t=this.getPath();r.setAttributes(this.selectorVisual,[["d",t]]),r.setAttributes(this.visibleVisual,[["d",t]]),r.setAttributes(this.visibleVisual,[["stroke",this.strokeColor],["stroke-width",this.strokeWidth.toString()],["stroke-dasharray",this.strokeDasharray.toString()],["stroke-dasharray",this.strokeDasharray.toString()],["opacity",this.opacity.toString()]])}}getState(){return Object.assign({points:this.points},super.getState())}restoreState(t){super.restoreState(t);const i=t;this.points=i.points,this.createVisual(),this.adjustVisual()}scale(t,i){super.scale(t,i),this.points.forEach(e=>{e.x=e.x*t,e.y=e.y*i}),this.adjustVisual()}}function it(d,t,i,e){return new(i||(i=Promise))(function(s,a){function h(l){try{n(e.next(l))}catch(u){a(u)}}function o(l){try{n(e.throw(l))}catch(u){a(u)}}function n(l){var u;l.done?s(l.value):(u=l.value,u instanceof i?u:new i(function(p){p(u)})).then(h,o)}n((e=e.apply(d,[])).next())})}k.typeName="FreehandMarker",k.title="Freehand marker",k.applyDefaultFilter=!1,typeof SuppressedError=="function"&&SuppressedError;class et{get text(){return this._text}set text(t){this._text=t,this.renderText()}get boundingBox(){return this._boundingBox}set boundingBox(t){this._boundingBox=t,this.renderText()}get labelBackground(){return this._labelBackground}get textElement(){return this._textElement}set color(t){this.textElement&&r.setAttributes(this._textElement,[["fill",t]]),this._color=t}get color(){return this._color}get fontFamily(){return this._fontFamily}set fontFamily(t){this._textElement&&(this._textElement.style.fontFamily=t),this._fontFamily=t,this.positionText()}get fontSize(){return this._fontSize}set fontSize(t){this._textElement&&(this._textElement.style.fontSize=`${t.value}${t.units}`),this._fontSize=t,this.positionText()}constructor(t){this._text="",this.offsetX=0,this.offsetY=0,this._boundingBox=new DOMRect,this._labelBackground=r.createRect(10,10,[["fill","white"]]),this._textElement=r.createText(),this._color="transparent",this._fontFamily="",this._fontSize={value:1,units:"rem",step:.1},this.wordWrap=!1,this.prevWrappedText="",this.setupTextElement(),t!==void 0&&(this.text=t),this.setupTextElement=this.setupTextElement.bind(this),this.renderText=this.renderText.bind(this),this.positionText=this.positionText.bind(this),this.ownsTarget=this.ownsTarget.bind(this),this.show=this.show.bind(this),this.hide=this.hide.bind(this),this.showControlBox=this.showControlBox.bind(this),this.hideControlBox=this.hideControlBox.bind(this),this.applyFontStyles=this.applyFontStyles.bind(this),this.wrapText=this.wrapText.bind(this)}ownsTarget(t){if(t===this._textElement)return!0;{let i=!1;return this._textElement.childNodes.forEach(e=>{e===t&&(i=!0)}),i}}setupTextElement(){this._textElement.style.fontSize=`${this.fontSize.value}${this.fontSize.units}`,this._textElement.style.textAnchor="middle",this._textElement.style.userSelect="none",this._labelBackground.style.stroke="#aaa",this._labelBackground.style.strokeDasharray="2 2",this._labelBackground.style.strokeWidth="1",this._labelBackground.style.strokeOpacity="0"}wrapText(){function t(i){let e=i[0].length;return i.forEach(s=>{s.length>e&&(e=s.length)}),.35*e/i.length}if(this.text!==""){const i=this.text.split(/\r\n|[\n\v\f\r\x85\u2028\u2029]/),e=1*this.boundingBox.width/this.boundingBox.height;let s=new Array(...i),a=t(s),h=Number.MAX_VALUE;for(;a>e;){let o=s[0];s.forEach(n=>{n.length>o.length&&(o=n)}),h=o.lastIndexOf(" ",h-1),h>0?(s=[],i.forEach(n=>{let l=n;for(;l.length>h;){let u=l.lastIndexOf(" ",h);u<0&&(u=l.indexOf(" ")),u>0?(s.push(l.substring(0,u)),l=l.substring(u).trim()):(s.push(l),l="")}s.push(l)}),a=t(s)):a=-1}return s.join(`\r
+`)}return this.text}renderText(){return it(this,void 0,void 0,function*(){if(this._textElement){const t=this.wordWrap?this.wrapText():this.text;if(this.prevWrappedText===t)return void this.positionText();for(this.prevWrappedText=t;this._textElement.lastChild;)this._textElement.removeChild(this._textElement.lastChild);t.split(/\r\n|[\n\v\f\r\x85\u2028\u2029]/).forEach((i,e)=>{this._textElement.appendChild(r.createTSpan(i.trim()===""?" ":i.trim(),[["dy",e>0?"1em":"0"]]))}),this.textElement.style.opacity="0",yield new Promise(i=>requestAnimationFrame(i)),this.positionText(this)}})}applyFontStyles(){this._textElement.childNodes.forEach(t=>{const i=t;i.style.fontFamily=this._textElement.style.fontFamily,i.style.fontSize=this._textElement.style.fontSize})}get textSize(){return this._textSize}positionText(t){const i=t===void 0?this:t;i.applyFontStyles(),i._textSize=i._textElement.getBBox();const e=i.boundingBox.x+i._textSize.width/2+i.offsetX,s=i._textElement.childNodes.length,a=i._textSize.height/s,h=s>1?-a*(s-2)/2:a/3,o=i.boundingBox.y+i._textSize.height/2+h+i.offsetY;i._textElement.childNodes.forEach((l,u)=>{const p=l;r.setAttributes(p,[["x",`${e}`],["dy",u>0?"1em":"0"]])}),r.setAttributes(i._textElement,[["x",`${e}`]]),r.setAttributes(i._textElement,[["y",`${o}`]]),i._textSize=i._textElement.getBBox();const n=1.2;r.setAttributes(i.labelBackground,[["width",(i._textSize.width*n).toString()],["height",(i._textSize.height*n).toString()],["x",(e-i._textSize.width*n/2).toString()],["y",(i._textSize.y-n).toString()]]),i.onTextSizeChanged&&i.onTextSizeChanged(i),this.textElement.style.opacity="1"}show(){this._textElement.style.display="",this._labelBackground.style.display=""}hide(){this._textElement.style.display="none",this._labelBackground.style.display="none"}showControlBox(){this.labelBackground.style.strokeOpacity="1"}hideControlBox(){this.labelBackground.style.strokeOpacity="0"}}class m extends X{get color(){return this._color}set color(t){this._color=t,this.textBlock.color=t}get fontFamily(){return this._fontFamily}set fontFamily(t){this._fontFamily=t,this.textBlock.fontFamily=t}get fontSize(){return this._fontSize}set fontSize(t){this._fontSize=t,this.textBlock.fontSize=t}getDefaultText(){return Object.getPrototypeOf(this).constructor.DEFAULT_TEXT}get text(){return this.textBlock.text}set text(t){this._text=t,this.textBlock.text=this._text}constructor(t){super(t),this._color="black",this._fontFamily="Helvetica, Arial, sans-serif",this._fontSize={value:1,units:"rem",step:.1},this._text=this.getDefaultText(),this.padding=2,this.textBlock=new et(this.getDefaultText()),this.setColor=this.setColor.bind(this),this.setFont=this.setFont.bind(this),this.setFontSize=this.setFontSize.bind(this),this.setSize=this.setSize.bind(this),this.textSizeChanged=this.textSizeChanged.bind(this),this.setSizeFromTextSize=this.setSizeFromTextSize.bind(this),this.createVisual=this.createVisual.bind(this),this.adjustVisual=this.adjustVisual.bind(this),this.textBoundingBox=new DOMRect}applyOpacity(){this.visual&&r.setAttributes(this.visual,[["opacity",this.opacity.toString()]])}createVisual(){this.textBlock.fontFamily=this.fontFamily,this.textBlock.fontSize=this.fontSize,this.textBlock.color=this.color,this.textBlock.offsetX=this.padding,this.textBlock.offsetY=this.padding,this.textBlock.onTextSizeChanged=this.textSizeChanged,this.visual=r.createGroup(),r.setAttributes(this.visual,[["opacity",this._opacity.toString()]]),this.visual.appendChild(this.textBlock.textElement),this.addMarkerVisualToContainer(this.visual),this.textBlock.text=this._text}adjustVisual(){this.visual&&r.setAttributes(this.visual,[["opacity",this._opacity.toString()]]),this.setSize()}ownsTarget(t){return!(!super.ownsTarget(t)&&t!==this.visual&&!this.textBlock.ownsTarget(t))}setTextBoundingBox(){this.textBoundingBox.x=this.padding,this.textBoundingBox.y=this.padding,this.textBoundingBox.width=Number.MAX_VALUE,this.textBoundingBox.height=Number.MAX_VALUE}setSize(){const[t,i]=[this.width,this.height];super.setSize(),this.setSizeFromTextSize(),t===this.width&&i===this.height||!this.onSizeChanged||this.onSizeChanged(this),this.setTextBoundingBox()}setSizeFromTextSize(){this.textBlock.textSize&&(this.width=this.textBlock.textSize.width+2*this.padding,this.height=this.textBlock.textSize.height+2*this.padding),this.textBlock.offsetX=this.padding,this.textBlock.offsetY=this.padding}textSizeChanged(){this.adjustVisual()}setColor(t){this.color=t}setFont(t){this.fontFamily=t}setFontSize(t){this.fontSize=t}hideVisual(){this.visual&&(this.visual.style.visibility="hidden")}showVisual(){this.visual&&(this.visual.style.visibility="visible",this.textBlock.renderText())}getState(){return Object.assign({color:this.color,fontFamily:this.fontFamily,fontSize:this.fontSize,text:this.text,padding:this.padding},super.getState())}restoreState(t){const i=t;this.color=i.color,this.fontFamily=i.fontFamily,this.fontSize=i.fontSize,this.text=i.text,i.padding!==void 0&&(this.padding=i.padding),this.createVisual(),super.restoreState(t),this.adjustVisual()}scale(t,i){super.scale(t,i);const e=Object.assign(Object.assign({},this.fontSize),{value:this.fontSize.value*Math.min(t,i)});this.fontSize=e,this.padding=this.padding*Math.min(t,i),this.adjustVisual()}}m.typeName="TextMarker",m.title="Text marker",m.DEFAULT_TEXT="Text";class C extends j{constructor(t){super(t),this.fillColor="#000000",this.strokeColor="transparent",this.strokeWidth=0}getPath(t=this.width,i=this.height){return`M 0 0 
+      H ${t} 
+      V ${i} 
+      H 0 
+      V 0 Z`}}C.typeName="CoverMarker",C.title="Cover marker",C.applyDefaultFilter=!1;class S extends j{constructor(t){super(t),this.fillColor="#ffff00",this.opacity=.5,this.strokeColor="transparent",this.strokeWidth=0}getPath(t=this.width,i=this.height){return`M 0 0 
+      H ${t} 
+      V ${i} 
+      H 0 
+      V 0 Z`}}S.typeName="HighlightMarker",S.title="Highlight marker",S.applyDefaultFilter=!1;class M extends m{get tipPosition(){return this._tipPosition}set tipPosition(t){this._tipPosition=t,this.adjustVisual()}constructor(t){super(t),this._tipPosition={x:0,y:0},this.tipBase1Position={x:0,y:0},this.tipBase2Position={x:0,y:0},this._calloutVisual=r.createPath("M0,0"),this.color="#ffffff",this.fillColor="#ff0000",this.strokeColor="#ffffff",this.strokeWidth=3,this.padding=20,this.createVisual=this.createVisual.bind(this),this.adjustVisual=this.adjustVisual.bind(this),this.getPath=this.getPath.bind(this),this.setTipPoints=this.setTipPoints.bind(this)}applyStrokeColor(){r.setAttributes(this._calloutVisual,[["stroke",this._strokeColor]])}applyStrokeWidth(){r.setAttributes(this._calloutVisual,[["stroke-width",this._strokeWidth.toString()]])}applyStrokeDasharray(){r.setAttributes(this._calloutVisual,[["stroke-dasharray",this._strokeDasharray]])}applyOpacity(){this.visual&&r.setAttributes(this.visual,[["opacity",this._opacity.toString()]])}applyFillColor(){r.setAttributes(this._calloutVisual,[["fill",this._fillColor]])}getPath(){return this.setTipPoints(),`M 5 0 
+      ${this.tipBase1Position.y===0?`H ${this.tipBase1Position.x} L ${this.tipPosition.x} ${this.tipPosition.y} L ${this.tipBase2Position.x} 0`:""}
+      H ${this.width-5} 
+      A 5 5 0 0 1 ${this.width} 5 
+      ${this.tipBase1Position.x===this.width?`V ${this.tipBase1Position.y} L ${this.tipPosition.x} ${this.tipPosition.y} L  ${this.tipBase2Position.x} ${this.tipBase2Position.y}`:""}
+      V ${this.height-5} 
+      A 5 5 0 0 1 ${this.width-5} ${this.height} 
+      ${this.tipBase1Position.y===this.height?`H ${this.tipBase2Position.x} L ${this.tipPosition.x} ${this.tipPosition.y} L ${this.tipBase1Position.x} ${this.height}`:""}
+      H 5
+      A 5 5 0 0 1 0 ${this.height-5} 
+      ${this.tipBase1Position.x===0?`V ${this.tipBase2Position.y} L ${this.tipPosition.x} ${this.tipPosition.y} L  ${this.tipBase1Position.x} ${this.tipBase1Position.y}`:""}
+      V 5 
+      A 5 5 0 0 1 5 0 
+      Z`}setTipPoints(){let t=Math.min(this.height/2,15),i=this.height/5;const e=Math.atan(this.height/2/(this.width/2));this.tipPosition.x<this.width/2&&this.tipPosition.y<this.height/2?e<Math.atan((this.height/2-this.tipPosition.y)/(this.width/2-this.tipPosition.x))?(i=this.width/5,t=Math.min(this.width/2,15),this.tipBase1Position={x:t,y:0},this.tipBase2Position={x:t+i,y:0}):(this.tipBase1Position={x:0,y:t},this.tipBase2Position={x:0,y:t+i}):this.tipPosition.x>=this.width/2&&this.tipPosition.y<this.height/2?e<Math.atan((this.height/2-this.tipPosition.y)/(this.tipPosition.x-this.width/2))?(i=this.width/5,t=Math.min(this.width/2,15),this.tipBase1Position={x:this.width-t-i,y:0},this.tipBase2Position={x:this.width-t,y:0}):(this.tipBase1Position={x:this.width,y:t},this.tipBase2Position={x:this.width,y:t+i}):this.tipPosition.x>=this.width/2&&this.tipPosition.y>=this.height/2?e<Math.atan((this.tipPosition.y-this.height/2)/(this.tipPosition.x-this.width/2))?(i=this.width/5,t=Math.min(this.width/2,15),this.tipBase1Position={x:this.width-t-i,y:this.height},this.tipBase2Position={x:this.width-t,y:this.height}):(this.tipBase1Position={x:this.width,y:this.height-t-i},this.tipBase2Position={x:this.width,y:this.height-t}):e<Math.atan((this.tipPosition.y-this.height/2)/(this.width/2-this.tipPosition.x))?(i=this.width/5,t=Math.min(this.width/2,15),this.tipBase1Position={x:t,y:this.height},this.tipBase2Position={x:t+i,y:this.height}):(this.tipBase1Position={x:0,y:this.height-t-i},this.tipBase2Position={x:0,y:this.height-t})}createVisual(){var t;super.createVisual(),this._tipPosition={x:this.width/4,y:this.height+20},this._calloutVisual=r.createPath(this.getPath(),[["fill",this._fillColor],["stroke",this._strokeColor],["stroke-width",this._strokeWidth.toString()],["stroke-dasharray",this._strokeDasharray]]),(t=this.visual)===null||t===void 0||t.insertBefore(this._calloutVisual,this.textBlock.textElement)}adjustVisual(){super.adjustVisual(),this._calloutVisual&&r.setAttributes(this._calloutVisual,[["d",this.getPath()],["fill",this._fillColor],["stroke",this._strokeColor],["stroke-width",this._strokeWidth.toString()],["stroke-dasharray",this._strokeDasharray]])}ownsTarget(t){return!(!super.ownsTarget(t)&&this._calloutVisual!==t)}getState(){return Object.assign({fillColor:this.fillColor,tipPosition:this.tipPosition},super.getState())}restoreState(t){const i=t;super.restoreState(t),this.fillColor=i.fillColor,this.tipPosition=i.tipPosition,this.adjustVisual()}scale(t,i){super.scale(t,i),this.strokeWidth*=(t+i)/2,this._tipPosition={x:this._tipPosition.x*t,y:this._tipPosition.y*i},this.adjustVisual()}}M.typeName="CalloutMarker",M.title="Callout marker";class T extends W{constructor(t){super(t),this.strokeColor="#ff0000",this.strokeWidth=3}getPath(t=this.width,i=this.height){return`M ${t/2} 0 
+       a ${t/2} ${i/2} 0 1 0 0 ${i} 
+       a ${t/2} ${i/2} 0 1 0 0 -${i} z`}}T.typeName="EllipseFrameMarker",T.title="Ellipse frame marker";class P extends j{constructor(t){super(t),this.fillColor="#ff0000",this.strokeColor="#ff0000"}getPath(t=this.width,i=this.height){return`M ${t/2} 0 
+    a ${t/2} ${i/2} 0 1 0 0 ${i} 
+    a ${t/2} ${i/2} 0 1 0 0 -${i} z`}}P.typeName="EllipseMarker",P.title="Ellipse marker";class $ extends X{get svgString(){return this._svgString}set svgString(t){this._svgString=t,this.SVGImage&&this.imageType==="svg"&&(this.SVGImage.outerHTML=t!==void 0?t:"")}get imageSrc(){return this._imageSrc}set imageSrc(t){this._imageSrc=t,this.SVGImage&&this.imageType==="bitmap"&&(t!==void 0?r.setAttributes(this.SVGImage,[["href",t]]):r.setAttributes(this.SVGImage,[["href",""]]))}constructor(t){super(t),this.imageType="svg",this.naturalWidth=24,this.naturalHeight=24,this.defaultSize={width:this.naturalWidth,height:this.naturalHeight},this.createImage=this.createImage.bind(this),this.createVisual=this.createVisual.bind(this),this.adjustVisual=this.adjustVisual.bind(this),this.adjustImage=this.adjustImage.bind(this)}applyOpacity(){this.visual&&r.setAttributes(this.visual,[["opacity",this.opacity.toString()]])}createImage(){var t;if(this._svgString!==void 0){this.imageType="svg";const i=new DOMParser().parseFromString(this._svgString,"image/svg+xml").documentElement;if(!(i instanceof SVGSVGElement))throw new Error("Invalid SVG string");const e=i;this.SVGImage=this.container.ownerDocument.importNode(e,!0)}else this.imageType="bitmap",this.SVGImage=r.createImage([["href",(t=this._imageSrc)!==null&&t!==void 0?t:""]])}createVisual(){this.createImage(),this.SVGImage!==void 0&&(this.visual=r.createGroup(),this.imageType==="svg"&&r.setAttributes(this.visual,[["viewBox",`0 0 ${this.naturalWidth} ${this.naturalHeight}`],["fill",this._fillColor],["stroke",this._strokeColor],["color",this._strokeColor],["stroke-width",this.strokeWidth.toString()],["stroke-dasharray",this.strokeDasharray],["opacity",this.opacity.toString()],["pointer-events","bounding-box"]]),this.adjustImage(),this.visual.appendChild(this.SVGImage),this.addMarkerVisualToContainer(this.visual))}adjustVisual(){this.visual&&r.setAttributes(this.visual,[["opacity",this._opacity.toString()]])}adjustImage(){this.SVGImage!==void 0&&(this.SVGImage.setAttribute("x","0px"),this.SVGImage.setAttribute("y","0px"),this.SVGImage.setAttribute("width",`${this.width}px`),this.SVGImage.setAttribute("height",`${this.height}px`))}isDescendant(t,i){if(t===i)return!0;for(let e=0;e<t.children.length;e++)if(this.isDescendant(t.children[e],i))return!0;return!1}ownsTarget(t){return super.ownsTarget(t)||this.SVGImage!==void 0&&this.isDescendant(this.SVGImage,t)}setSize(){super.setSize(),this.visual&&(r.setAttributes(this.visual,[["width",`${this.width}px`],["height",`${this.height}px`]]),this.adjustImage())}getState(){return Object.assign({imageType:this.imageType,svgString:this.svgString,imageSrc:this.imageSrc},super.getState())}applyStrokeColor(){this.visual&&r.setAttributes(this.visual,[["color",this._strokeColor]])}restoreState(t){const i=t;i.imageType!==void 0&&(this.imageType=i.imageType),i.svgString!==void 0&&(this._svgString=i.svgString),i.imageSrc!==void 0&&(this._imageSrc=i.imageSrc),this.createVisual(),super.restoreState(t),this.setSize(),this.adjustVisual()}scale(t,i){super.scale(t,i),this.setSize()}}$.title="Image marker";class V extends ${}V.typeName="CustomImageMarker",V.title="Custom image marker";class B extends ${constructor(t){super(t),this._svgString='<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><g fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"><path d="M21.801 10A10 10 0 1 1 17 3.335"/><path d="m9 11l3 3L22 4"/></g></svg>',this.strokeColor="#008000"}}B.typeName="CheckImageMarker",B.title="Check image marker";class L extends ${constructor(t){super(t),this._svgString='<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><g fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"><circle cx="12" cy="12" r="10"/><path d="m15 9l-6 6m0-6l6 6"/></g></svg>',this.strokeColor="#d00000"}}L.typeName="XImageMarker",L.title="X image marker";class z extends m{constructor(t){super(t),this._outerFrameVisual=r.createPath("M0,0"),this._captionFrameVisual=r.createPath("M0,0"),this._frameVisual=r.createGroup(),this.color="#ffffff",this.fillColor="#ff0000",this.strokeColor="#ff0000",this.strokeWidth=3,this.padding=5,this.createVisual=this.createVisual.bind(this),this.adjustVisual=this.adjustVisual.bind(this),this.adjustFrameVisual=this.adjustFrameVisual.bind(this),this.getPaths=this.getPaths.bind(this)}applyStrokeColor(){r.setAttributes(this._outerFrameVisual,[["stroke",this._strokeColor]]),r.setAttributes(this._captionFrameVisual,[["stroke",this._strokeColor]])}applyStrokeWidth(){r.setAttributes(this._outerFrameVisual,[["stroke-width",this._strokeWidth.toString()]]),r.setAttributes(this._captionFrameVisual,[["stroke-width",this._strokeWidth.toString()]]),this.adjustTextPosition(),this.adjustFrameVisual()}applyStrokeDasharray(){r.setAttributes(this._outerFrameVisual,[["stroke-dasharray",this._strokeDasharray]]),r.setAttributes(this._captionFrameVisual,[["stroke-dasharray",this._strokeDasharray]])}applyOpacity(){this.visual&&r.setAttributes(this.visual,[["opacity",this._opacity.toString()]])}applyFillColor(){r.setAttributes(this._captionFrameVisual,[["fill",this._fillColor]])}getPaths(t=this.width,i=this.height){var e,s;return{frame:`M 0 0
+      V ${i}
+      H ${t}
+      V 0
+      Z`,caption:`M 0 0
+      H ${t}
+      V ${((s=(e=this.textBlock.textSize)===null||e===void 0?void 0:e.height)!==null&&s!==void 0?s:40)+2*this.padding+this.strokeWidth}
+      H 0
+      Z`}}createVisual(){var t;super.createVisual();const i=this.getPaths();this.visual&&r.setAttributes(this.visual,[["opacity",this._opacity.toString()]]),this._outerFrameVisual=r.createPath(i.frame,[["fill","transparent"],["stroke",this._strokeColor],["stroke-width",this._strokeWidth.toString()],["stroke-dasharray",this._strokeDasharray]]),this._captionFrameVisual=r.createPath(i.caption,[["fill","this._fillColor"],["fill-rule","evenodd"],["stroke",this._strokeColor],["stroke-width",this._strokeWidth.toString()],["stroke-dasharray",this._strokeDasharray]]),this._frameVisual.appendChild(this._outerFrameVisual),this._frameVisual.appendChild(this._captionFrameVisual),(t=this.visual)===null||t===void 0||t.insertBefore(this._frameVisual,this.textBlock.textElement)}adjustVisual(){super.adjustVisual(),this.adjustTextPosition(),this.adjustFrameVisual()}adjustTextPosition(){var t;this.textBlock.textSize&&(this.textBlock.textElement.style.transform=`translate(${this.width/2-((t=this.textBlock.textSize)===null||t===void 0?void 0:t.width)/2-this.padding}px, ${this.strokeWidth/2}px)`)}adjustFrameVisual(){const t=this.getPaths();this.visual&&r.setAttributes(this.visual,[["opacity",this._opacity.toString()]]),this._outerFrameVisual&&r.setAttributes(this._outerFrameVisual,[["d",t.frame],["stroke",this._strokeColor],["stroke-width",this._strokeWidth.toString()],["stroke-dasharray",this._strokeDasharray]]),this._captionFrameVisual&&r.setAttributes(this._captionFrameVisual,[["d",t.caption],["fill",this._fillColor],["stroke",this._strokeColor],["stroke-width",this._strokeWidth.toString()],["stroke-dasharray",this._strokeDasharray]])}ownsTarget(t){return!(!super.ownsTarget(t)&&this._outerFrameVisual!==t&&this._captionFrameVisual!==t)}setSize(){super.setSize(),this.adjustTextPosition(),this.adjustFrameVisual()}setSizeFromTextSize(){}hideVisual(){this.textBlock.hide()}showVisual(){this.textBlock.show(),this.textBlock.renderText()}getState(){return Object.assign({fillColor:this.fillColor},super.getState())}restoreState(t){const i=t;super.restoreState(t),this.fillColor=i.fillColor,this.adjustVisual()}scale(t,i){super.scale(t,i),this.strokeWidth*=(t+i)/2,this.setSize()}}z.typeName="CaptionFrameMarker",z.title="Caption frame marker";class G extends v{constructor(t){super(t),this.curveX=0,this.curveY=0,this.fillColor="transparent"}getPath(){return`M ${this.x1} ${this.y1} Q ${this.curveX} ${this.curveY}, ${this.x2} ${this.y2}`}getState(){return Object.assign({curveX:this.curveX,curveY:this.curveY},super.getState())}restoreState(t){this.curveX=t.curveX,this.curveY=t.curveY,super.restoreState(t)}scale(t,i){super.scale(t,i),this.curveX=this.curveX*t,this.curveY=this.curveY*i,this.adjustVisual()}}G.typeName="CurveMarker",G.title="Curve marker";class w extends k{constructor(t){super(t),this.opacity=.5,this.strokeColor="#ffff00",this.strokeWidth=20}}w.typeName="HighlighterMarker",w.title="Highlighter marker",w.applyDefaultFilter=!1;class R{static getDefaultFilterSet(){return[r.createFilter("dropShadow",[["x","-20%"],["y","-20%"],["width","140%"],["height","140%"]],'<feDropShadow dx="2" dy="2" stdDeviation="2" flood-color="rgba(0,0,0,0.8)"/>'),r.createFilter("outline",[["x","-5%"],["y","-5%"],["width","110%"],["height","110%"]],`<feMorphology operator="dilate" radius="2" in="SourceAlpha" result="expanded"/>
+      <feFlood flood-color="white" flood-opacity="1"/>
+      <feComposite in2="expanded" operator="in"/>
+      <feComposite in="SourceGraphic" operator="over"/>`),r.createFilter("glow",[["x","-50%"],["y","-50%"],["width","200%"],["height","200%"]],`<feGaussianBlur in="SourceGraphic" stdDeviation="3" result="blur"/>
+      <feFlood flood-color="#ffffff" flood-opacity="1"/>
+      <feComposite in2="blur" operator="in"/>
+      <feMerge>
+        <feMergeNode/>
+        <feMergeNode in="SourceGraphic"/>
+      </feMerge>`)]}}class F{get creationStyle(){return this._creationStyle}is(t){return this instanceof t}get marker(){return this._marker}get container(){return this._container}get overlayContainer(){return this._overlayContainer}get state(){return this._state}set state(t){this._state=t}get isSelected(){return this._isSelected}get continuousCreation(){return this._continuousCreation}set strokeColor(t){this.marker.strokeColor=t}get strokeColor(){return this.marker.strokeColor}set strokeWidth(t){this.marker.strokeWidth=t,this.adjustControlBox(),this.stateChanged()}get strokeWidth(){return this.marker.strokeWidth}set strokeDasharray(t){this.marker.strokeDasharray=t,this.stateChanged()}get strokeDasharray(){return this.marker.strokeDasharray}set fillColor(t){this.marker.fillColor=t}get fillColor(){return this.marker.fillColor}set opacity(t){this.marker.opacity=t}get opacity(){return this.marker.opacity}set notes(t){this.marker.notes=t}get notes(){return this.marker.notes}get zoomLevel(){return this._zoomLevel}set zoomLevel(t){this._zoomLevel=t,this.adjustControlBox()}constructor(t){var i;this._creationStyle="draw",this._state="new",this._isSelected=!1,this._continuousCreation=!1,this._zoomLevel=1,this.isMultiSelected=!1,this._container=t.container,this._overlayContainer=t.overlayContainer,this._markerType=t.markerType,this._marker=(i=t.marker)!==null&&i!==void 0?i:new t.markerType(t.container),this.select=this.select.bind(this),this.deselect=this.deselect.bind(this),this.ownsTarget=this.ownsTarget.bind(this),this.adjustControlBox=this.adjustControlBox.bind(this),this.stateChanged=this.stateChanged.bind(this),this.scale=this.scale.bind(this),this.dispose=this.dispose.bind(this),this.pointerDown=this.pointerDown.bind(this),this.pointerUp=this.pointerUp.bind(this),this.manipulate=this.manipulate.bind(this),this.dblClick=this.dblClick.bind(this)}ownsTarget(t){var i;let e=!1;return t!==null&&(!((i=this._marker)===null||i===void 0)&&i.ownsTarget(t))&&(e=!0),e}select(t=!1){this.isMultiSelected=t,this.container.style.cursor="move",this._isSelected=!0,this.manipulationStartState=JSON.stringify(this._marker.getState())}deselect(){this.container.style.cursor="default",this._isSelected=!1,this.stateChanged()}pointerDown(t,i,e){}dblClick(t,i,e){}manipulate(t,i){}pointerUp(t,i){}dispose(){}adjustControlBox(){}scale(t,i){this._marker.scale(t,i),this.adjustControlBox()}stateChanged(){if(this.onStateChanged&&this.state!=="creating"&&this.state!=="new"){const t=JSON.stringify(this._marker.getState());this.manipulationStartState!=t&&(this.manipulationStartState=t,this.onStateChanged(this))}}hide(){this.container.style.display="none"}show(){this.container.style.display="block"}getState(){return this.marker.getState()}restoreState(t){this._state="select",this.marker.restoreState(t),this.adjustControlBox()}}class Z{get visual(){return this._visual||this.createVisual(),this._visual}get zoomLevel(){return this._zoomLevel}set zoomLevel(t){this._zoomLevel=t,this.adjustVisual()}constructor(){this.gripSize=5,this._zoomLevel=1,this.fillColor="rgba(255,255,255,0.9)",this.strokeColor="#0ea5e9",this.createVisual=this.createVisual.bind(this),this.adjustVisual=this.adjustVisual.bind(this)}createVisual(){this._visual=r.createGroup(),this._selectorElement=r.createCircle(2*this.gripSize,[["fill","transparent"],["cx",(this.gripSize/2).toString()],["cy",(this.gripSize/2).toString()]]),this._visual.appendChild(this._selectorElement),this._visibleElement=r.createCircle(this.gripSize,[["fill-opacity","1"],["stroke-width","1"],["stroke-opacity","1"]]),this._visibleElement.style.fill=`var(--mjs-grip-fill, ${this.fillColor})`,this._visibleElement.style.stroke=`var(--mjs-grip-stroke, ${this.strokeColor})`,this._visibleElement.style.filter="drop-shadow(0px 0px 2px rgba(0, 0, 0, .7))",this._visual.appendChild(this._visibleElement)}adjustVisual(){this._selectorElement&&this._visibleElement&&(this._selectorElement.setAttribute("r",(2*this.gripSize/this.zoomLevel).toString()),this._visibleElement.setAttribute("r",(this.gripSize/this.zoomLevel).toString()),this._visibleElement.setAttribute("stroke-width",(1/this.zoomLevel).toString()))}ownsTarget(t){var i;if(t===this._visual)return!0;{let e=!1;return(i=this._visual)===null||i===void 0||i.childNodes.forEach(s=>{s===t&&(e=!0)}),e}}}class g extends Z{}class st extends F{constructor(t){super(t),this.defaultLength=50,this.manipulationStartX=0,this.manipulationStartY=0,this.manipulationBox=r.createGroup(),this.grips=[],this.ownsTarget=this.ownsTarget.bind(this),this.setupControlBox=this.setupControlBox.bind(this),this.adjustControlBox=this.adjustControlBox.bind(this),this.adjustControlGrips=this.adjustControlGrips.bind(this),this.createGrip=this.createGrip.bind(this),this.positionGrip=this.positionGrip.bind(this),this.positionGrips=this.positionGrips.bind(this),this.resize=this.resize.bind(this),this.manipulate=this.manipulate.bind(this),this.pointerDown=this.pointerDown.bind(this),this.pointerUp=this.pointerUp.bind(this)}ownsTarget(t){return!(!super.ownsTarget(t)&&!this.marker.ownsTarget(t))||!!this.grips.some(i=>i.ownsTarget(t))}pointerDown(t,i,e){super.pointerDown(t,i,e),this.manipulationStartX=t.x,this.manipulationStartY=t.y,this.adjustControlBox(),this.controlBox.style.display="",this.state==="new"?this.startCreation(t):this._state==="creating"?this.grips.length>0&&i&&this.grips[0].ownsTarget(i)?this.finishCreation():this.addNewPointWhileCreating(t):(this.select(this.isMultiSelected),this.activeGrip=i&&this.grips.find(s=>s.ownsTarget(i)),this.activeGrip?this._state="resize":this._state="move")}startCreation(t){this.marker.stage="creating",this.marker.points.push(t),this.marker.points.push(t),this.marker.createVisual(),this.marker.adjustVisual(),this.adjustControlGrips(),this.controlBox&&(this.controlBox.style.display=""),this.activeGrip=this.grips.at(-1),this.activeGrip&&(this.activeGrip.visual.style.pointerEvents="none"),this._state="creating"}addNewPointWhileCreating(t){this.marker.points.push(t),this.marker.adjustVisual(),this.adjustControlGrips(),this.activeGrip=this.grips.at(-1),this.activeGrip&&(this.activeGrip.visual.style.pointerEvents="none")}finishCreation(){this.marker.stage="normal",this.marker.points.splice(0,1),this.marker.points.length===1&&this.marker.points.splice(0,1),this.marker.adjustVisual(),this.adjustControlGrips(),this.grips.forEach(t=>{t.visual.style.pointerEvents=""}),this._state="select",this.marker.points.length>0&&this.onMarkerCreated&&this.onMarkerCreated(this)}pointerUp(t,i){super.pointerUp(t,i),this.manipulate(t,i),this._state!=="creating"&&(this._state="select"),this.stateChanged()}manipulate(t,i){this.state==="creating"?this.resize(t):this.state==="move"?(this.marker.points.forEach(e=>{e.x+=t.x-this.manipulationStartX,e.y+=t.y-this.manipulationStartY}),this.manipulationStartX=t.x,this.manipulationStartY=t.y,this.marker.adjustVisual(),this.adjustControlBox()):this.state==="resize"&&this.resize(t)}resize(t){const i=this.activeGrip?this.grips.indexOf(this.activeGrip):-1;i>=0&&(this.marker.points[i]=t,this.marker.adjustVisual(),this.adjustControlBox())}dblClick(t,i,e){if(i&&this.state==="select"){const s=this.marker.selectorVisualLines.findIndex(a=>a===i);if(s>-1)this.marker.points.splice(s+1,0,t),this.marker.adjustVisual(),this.adjustControlGrips();else{const a=this.grips.findIndex(h=>h.ownsTarget(i));a>-1&&(this.marker.points.splice(a,1),this.marker.adjustVisual(),this.adjustControlGrips())}}}setupControlBox(){this.controlBox||(this.controlBox=r.createGroup(),this.container.appendChild(this.controlBox),this.manipulationBox=r.createGroup(),this.controlBox.appendChild(this.manipulationBox),this.adjustControlGrips(),this.controlBox.style.display="none")}adjustControlBox(){this.controlBox||this.setupControlBox(),this.adjustControlGrips()}adjustControlGrips(){const t=this.marker.points.length-this.grips.length;if(t>0)for(let i=0;i<t;i++)this.grips.push(this.createGrip());else if(t<0)for(let i=0;i<-t;i++){const e=this.grips.pop();e&&this.manipulationBox.removeChild(e.visual)}this.positionGrips()}createGrip(){const t=new g;return t.zoomLevel=this.zoomLevel,t.visual.transform.baseVal.appendItem(r.createTransform()),this.manipulationBox.appendChild(t.visual),t}positionGrips(){this.grips.forEach((t,i)=>{t.zoomLevel=this.zoomLevel;const e=this.marker.points[i];this.positionGrip(t.visual,e.x-t.gripSize/2,e.y-t.gripSize/2)})}positionGrip(t,i,e){const s=t.transform.baseVal.getItem(0);s.setTranslate(i,e),t.transform.baseVal.replaceItem(s,0)}select(t=!1){super.select(t),this.adjustControlBox(),this.manipulationBox.style.display=t?"none":"",this.controlBox.style.display=""}deselect(){super.deselect(),this.controlBox&&(this.controlBox.style.display="none"),this.state==="creating"&&this.finishCreation()}}class D extends F{constructor(t){super(t),this.defaultLength=50,this.manipulationStartX=0,this.manipulationStartY=0,this.manipulationStartX1=0,this.manipulationStartY1=0,this.manipulationStartX2=0,this.manipulationStartY2=0,this.manipulationBox=r.createGroup(),this.ownsTarget=this.ownsTarget.bind(this),this.setupControlBox=this.setupControlBox.bind(this),this.adjustControlBox=this.adjustControlBox.bind(this),this.addControlGrips=this.addControlGrips.bind(this),this.createGrip=this.createGrip.bind(this),this.positionGrip=this.positionGrip.bind(this),this.positionGrips=this.positionGrips.bind(this),this.resize=this.resize.bind(this),this.manipulate=this.manipulate.bind(this),this.pointerDown=this.pointerDown.bind(this),this.pointerUp=this.pointerUp.bind(this)}ownsTarget(t){var i,e;return!(!super.ownsTarget(t)&&!this.marker.ownsTarget(t))||!(!(!((i=this.grip1)===null||i===void 0)&&i.ownsTarget(t))&&!(!((e=this.grip2)===null||e===void 0)&&e.ownsTarget(t)))}pointerDown(t,i,e){var s,a;super.pointerDown(t,i,e),this.manipulationStartX=t.x,this.manipulationStartY=t.y,this.state==="new"&&(this.setupControlBox(),this.marker.x1=t.x,this.marker.y1=t.y,this.marker.x2=t.x,this.marker.y2=t.y),this.manipulationStartX1=this.marker.x1,this.manipulationStartY1=this.marker.y1,this.manipulationStartX2=this.marker.x2,this.manipulationStartY2=this.marker.y2,this.state==="new"?(this.marker.createVisual(),this.marker.adjustVisual(),this._state="creating"):(this.select(this.isMultiSelected),i&&(!((s=this.grip1)===null||s===void 0)&&s.ownsTarget(i))?this.activeGrip=this.grip1:i&&(!((a=this.grip2)===null||a===void 0)&&a.ownsTarget(i))?this.activeGrip=this.grip2:this.activeGrip=void 0,this.activeGrip?this._state="resize":this._state="move")}pointerUp(t,i){const e=this.state;super.pointerUp(t,i),this.state==="creating"&&Math.abs(this.marker.x1-this.marker.x2)<10&&Math.abs(this.marker.y1-this.marker.y2)<10?(this.marker.x2=this.marker.x1+this.defaultLength,this.marker.adjustVisual(),this.adjustControlBox()):this.manipulate(t,i),this._state="select",e==="creating"&&this.onMarkerCreated&&this.onMarkerCreated(this),this.stateChanged()}manipulate(t,i){this.state==="creating"?this.resize(t):this.state==="move"?(this.marker.x1=this.manipulationStartX1+t.x-this.manipulationStartX,this.marker.y1=this.manipulationStartY1+t.y-this.manipulationStartY,this.marker.x2=this.manipulationStartX2+t.x-this.manipulationStartX,this.marker.y2=this.manipulationStartY2+t.y-this.manipulationStartY,this.marker.adjustVisual(),this.adjustControlBox()):this.state==="resize"&&this.resize(t)}resize(t){switch(this.activeGrip){case this.grip1:this.marker.x1=t.x,this.marker.y1=t.y;break;case this.grip2:case void 0:this.marker.x2=t.x,this.marker.y2=t.y}this.marker.adjustVisual(),this.adjustControlBox()}setupControlBox(){this._controlBox||(this._controlBox=r.createGroup(),this.container.appendChild(this._controlBox),this.manipulationBox=r.createGroup(),this._controlBox.appendChild(this.manipulationBox),this.addControlGrips(),this._controlBox.style.display="none")}adjustControlBox(){this._controlBox||this.setupControlBox(),this.positionGrips()}addControlGrips(){this.grip1=this.createGrip(),this.grip2=this.createGrip(),this.positionGrips()}createGrip(){const t=new g;return t.zoomLevel=this.zoomLevel,t.visual.transform.baseVal.appendItem(r.createTransform()),this.manipulationBox.appendChild(t.visual),t}positionGrips(){if(this.grip1&&this.grip2){const t=this.grip1.gripSize;this.positionGrip(this.grip1.visual,this.marker.x1-t/2,this.marker.y1-t/2),this.positionGrip(this.grip2.visual,this.marker.x2-t/2,this.marker.y2-t/2),this.grip1.zoomLevel=this.zoomLevel,this.grip2.zoomLevel=this.zoomLevel}}positionGrip(t,i,e){const s=t.transform.baseVal.getItem(0);s.setTranslate(i,e),t.transform.baseVal.replaceItem(s,0)}select(t=!1){super.select(t),this.adjustControlBox(),this.manipulationBox.style.display=t?"none":"",this._controlBox.style.display=""}deselect(){super.deselect(),this._controlBox&&(this._controlBox.style.display="none")}}class Q{constructor(){this.grips=new Map([["topleft",new g],["topcenter",new g],["topright",new g],["leftcenter",new g],["rightcenter",new g],["bottomleft",new g],["bottomcenter",new g],["bottomright",new g]]),this.findGripByVisual=this.findGripByVisual.bind(this)}findGripByVisual(t){for(const i of this.grips.values())if(i.ownsTarget(t))return i}getGrip(t){return this.grips.get(t)}}class rt extends Z{constructor(){super();const t=this.fillColor;this.fillColor=this.strokeColor,this.strokeColor=t}}class J extends F{constructor(){super(...arguments),this.manipulationStartLeft=0,this.manipulationStartTop=0,this.manipulationStartWidth=0,this.manipulationStartHeight=0,this.manipulationStartX=0,this.manipulationStartY=0,this.offsetX=0,this.offsetY=0,this.manipulationBox=r.createGroup(),this.CB_DISTANCE=0,this.controlGrips=new Q,this.disabledResizeGrips=[],this.disableRotation=!1,this._suppressMarkerCreateEvent=!1}ownsTarget(t){var i;return!(!super.ownsTarget(t)&&!this._marker.ownsTarget(t))||!!(((i=this.controlGrips)===null||i===void 0?void 0:i.findGripByVisual(t))!==void 0||this.rotatorGrip!==void 0&&this.rotatorGrip.ownsTarget(t))}pointerDown(t,i,e){var s;super.pointerDown(t,i,e),this.setupControlBox(),this.state==="new"&&(this.marker.left=t.x,this.marker.top=t.y),this.manipulationStartLeft=this.marker.left,this.manipulationStartTop=this.marker.top,this.manipulationStartWidth=this.marker.width,this.manipulationStartHeight=this.marker.height;const a=this.marker.unrotatePoint(t);if(this.manipulationStartX=a.x,this.manipulationStartY=a.y,this.offsetX=a.x-this.marker.left,this.offsetY=a.y-this.marker.top,this.state!=="new")if(this.select(this.isMultiSelected),this.activeGrip=(s=this.controlGrips)===null||s===void 0?void 0:s.findGripByVisual(i),this.activeGrip!==void 0)this._state="resize";else if(this.rotatorGrip!==void 0&&i!==void 0&&this.rotatorGrip.ownsTarget(i)){this.activeGrip=this.rotatorGrip;const h=this.marker.rotatePoint({x:this.marker.centerX,y:this.marker.centerY});this.marker.left=h.x-this.marker.width/2,this.marker.top=h.y-this.marker.height/2,this.marker.moveVisual({x:this.marker.left,y:this.marker.top});const o=this.container.transform.baseVal.getItem(0);o.setRotate(this.marker.rotationAngle,this.marker.centerX,this.marker.centerY),this.container.transform.baseVal.replaceItem(o,0),this.adjustControlBox(),this._state="rotate"}else this._state="move"}pointerUp(t,i){const e=this.state;super.pointerUp(t,i),this.state==="creating"&&this.marker.width<10&&this.marker.height<10?(this.marker.width=this.marker.defaultSize.width,this.marker.height=this.marker.defaultSize.height):this.manipulate(t,i),this._state="select",e==="creating"&&this.onMarkerCreated&&this._suppressMarkerCreateEvent===!1&&this.onMarkerCreated(this),this.stateChanged()}manipulate(t,i){const e=this.marker.unrotatePoint(t);this.state==="creating"?this.resize(t,i==null?void 0:i.shiftKey):this.state==="move"?(this.marker.left=this.manipulationStartLeft+(e.x-this.manipulationStartLeft)-this.offsetX,this.marker.top=this.manipulationStartTop+(e.y-this.manipulationStartTop)-this.offsetY,this.marker.moveVisual({x:this.marker.left,y:this.marker.top}),this.adjustControlBox()):this.state==="resize"?this.resize(e,i==null?void 0:i.shiftKey):this.state==="rotate"&&this.marker.rotate(t)}resize(t,i=!1){let e=this.manipulationStartLeft,s=this.manipulationStartWidth,a=this.manipulationStartTop,h=this.manipulationStartHeight;const o=t.x-this.manipulationStartX,n=t.y-this.manipulationStartY;if(i){const l=this.manipulationStartWidth!==0&&this.manipulationStartHeight!==0?this.manipulationStartWidth/this.manipulationStartHeight:1;switch(this.activeGrip){case this.controlGrips.getGrip("bottomright"):case void 0:s=this.manipulationStartWidth+Math.max(o,n),h=this.manipulationStartHeight+Math.max(o,n)/l;break;case this.controlGrips.getGrip("bottomcenter"):s=this.manipulationStartWidth+n,h=this.manipulationStartHeight+n/l,e=this.manipulationStartLeft-n/2;break;case this.controlGrips.getGrip("bottomleft"):s=this.manipulationStartWidth+Math.max(-o,n),h=this.manipulationStartHeight+Math.max(-o,n)/l,e=this.manipulationStartLeft-Math.max(-o,n);break;case this.controlGrips.getGrip("leftcenter"):s=this.manipulationStartWidth-o,h=this.manipulationStartHeight-o/l,e=this.manipulationStartLeft+o,a=this.manipulationStartTop+o/l/2;break;case this.controlGrips.getGrip("topleft"):s=this.manipulationStartWidth+Math.max(-o,-n),h=this.manipulationStartHeight+Math.max(-o,-n)/l,e=this.manipulationStartLeft-Math.max(-o,-n),a=this.manipulationStartTop-Math.max(-o,-n)/l;break;case this.controlGrips.getGrip("topcenter"):s=this.manipulationStartWidth-n,h=this.manipulationStartHeight-n/l,e=this.manipulationStartLeft+n/2,a=this.manipulationStartTop+n/l;break;case this.controlGrips.getGrip("topright"):s=this.manipulationStartWidth+Math.max(o,-n),h=this.manipulationStartHeight+Math.max(o,-n)/l,a=this.manipulationStartTop-Math.max(o,-n)/l;break;case this.controlGrips.getGrip("rightcenter"):s=this.manipulationStartWidth+o,h=this.manipulationStartHeight+o/l,a=this.manipulationStartTop-o/l/2}}else{switch(this.activeGrip){case this.controlGrips.getGrip("bottomleft"):case this.controlGrips.getGrip("leftcenter"):case this.controlGrips.getGrip("topleft"):e=this.manipulationStartLeft+t.x-this.manipulationStartX,s=this.manipulationStartWidth+this.manipulationStartLeft-e;break;case this.controlGrips.getGrip("bottomright"):case this.controlGrips.getGrip("rightcenter"):case this.controlGrips.getGrip("topright"):case void 0:s=this.manipulationStartWidth+t.x-this.manipulationStartX}switch(this.activeGrip){case this.controlGrips.getGrip("topcenter"):case this.controlGrips.getGrip("topleft"):case this.controlGrips.getGrip("topright"):a=this.manipulationStartTop+t.y-this.manipulationStartY,h=this.manipulationStartHeight+this.manipulationStartTop-a;break;case this.controlGrips.getGrip("bottomcenter"):case this.controlGrips.getGrip("bottomleft"):case this.controlGrips.getGrip("bottomright"):case void 0:h=this.manipulationStartHeight+t.y-this.manipulationStartY}}s>=0?(this.marker.left=e,this.marker.width=s):(this.marker.left=e+s,this.marker.width=-s),h>=0?(this.marker.top=a,this.marker.height=h):(this.marker.top=a+h,this.marker.height=-h),this.setSize()}setSize(){this.marker.setSize(),this.adjustControlBox()}select(t=!1){super.select(t),this.adjustControlBox(),this.manipulationBox.style.display=t?"none":"",this.controlBox&&(this.controlBox.style.display="")}deselect(){super.deselect(),this.controlBox&&(this.controlBox.style.display="none")}setupControlBox(){if(this.controlBox)return;this.controlBox=r.createGroup();const t=r.createTransform();t.setTranslate(-this.CB_DISTANCE/2,-this.CB_DISTANCE/2),this.controlBox.transform.baseVal.appendItem(t),this.container.appendChild(this.controlBox),this.manipulationBox=r.createGroup(),this.controlBox.appendChild(this.manipulationBox),this.controlRect=r.createRect(this.marker.width+this.CB_DISTANCE,this.marker.height+this.CB_DISTANCE,[["stroke","black"],["stroke-width",(1/this.zoomLevel).toString()],["stroke-opacity","0.5"],["stroke-dasharray","3, 2"],["fill","transparent"],["pointer-events","none"]]),this.controlBox.appendChild(this.controlRect),this.disableRotation!==!0&&(this.rotatorGripLine=r.createLine((this.marker.width+2*this.CB_DISTANCE)/2,this.marker.top-this.CB_DISTANCE,(this.marker.width+2*this.CB_DISTANCE)/2,this.marker.top-3*this.CB_DISTANCE,[["stroke","black"],["stroke-width",(1/this.zoomLevel).toString()],["stroke-opacity","0.5"],["stroke-dasharray","3, 2"]]),this.rotatorGripLine.style.filter="drop-shadow(rgba(255, 255, 255, 0.7) 0px 2px 0px)",this.manipulationBox.appendChild(this.rotatorGripLine)),this.controlGrips=new Q,this.addControlGrips(),this.controlBox.style.display="none"}adjustControlBox(){var t,i,e;if(this.controlBox||this.setupControlBox(),this.controlBox){const s=this.controlBox.transform.baseVal.getItem(0);s.setTranslate(this.marker.left-this.CB_DISTANCE/2,this.marker.top-this.CB_DISTANCE/2),this.controlBox.transform.baseVal.replaceItem(s,0),(t=this.controlRect)===null||t===void 0||t.setAttribute("width",(this.marker.width+this.CB_DISTANCE).toString()),(i=this.controlRect)===null||i===void 0||i.setAttribute("height",(this.marker.height+this.CB_DISTANCE).toString()),(e=this.controlRect)===null||e===void 0||e.setAttribute("stroke-width",(1/this.zoomLevel).toString()),this.rotatorGripLine!==void 0&&(this.rotatorGripLine.setAttribute("x1",((this.marker.width+this.CB_DISTANCE)/2).toString()),this.rotatorGripLine.setAttribute("y1",(-this.CB_DISTANCE/2).toString()),this.rotatorGripLine.setAttribute("x2",((this.marker.width+this.CB_DISTANCE)/2).toString()),this.rotatorGripLine.setAttribute("y2",(-Math.max(3*this.CB_DISTANCE,30)).toString()),this.rotatorGripLine.setAttribute("stroke-width",(1/this.zoomLevel).toString())),this.positionGrips()}}addControlGrips(){for(const t of this.controlGrips.grips.values())t.visual.transform.baseVal.appendItem(r.createTransform()),this.manipulationBox.appendChild(t.visual),this.manipulationBox.appendChild(t.visual);this.disableRotation!==!0&&(this.rotatorGrip=this.createRotateGrip()),this.positionGrips()}createRotateGrip(){const t=new rt;return t.visual.transform.baseVal.appendItem(r.createTransform()),this.manipulationBox.appendChild(t.visual),t}positionGrips(){var t,i;if(this.controlGrips!==void 0){const e=(t=this.controlGrips.getGrip("topleft").gripSize)!==null&&t!==void 0?t:0,s=-e/2,a=s,h=(this.marker.width+this.CB_DISTANCE)/2-e/2,o=(this.marker.height+this.CB_DISTANCE)/2-e/2,n=this.marker.height+this.CB_DISTANCE-e/2,l=this.marker.width+this.CB_DISTANCE-e/2;if(this.positionGrip(this.controlGrips.getGrip("topleft").visual,s,a),this.positionGrip(this.controlGrips.getGrip("topcenter").visual,h,a),this.positionGrip(this.controlGrips.getGrip("topright").visual,l,a),this.positionGrip(this.controlGrips.getGrip("leftcenter").visual,s,o),this.positionGrip(this.controlGrips.getGrip("rightcenter").visual,l,o),this.positionGrip(this.controlGrips.getGrip("bottomleft").visual,s,n),this.positionGrip(this.controlGrips.getGrip("bottomcenter").visual,h,n),this.positionGrip(this.controlGrips.getGrip("bottomright").visual,l,n),this.controlGrips.grips.forEach(u=>{u.zoomLevel=this.zoomLevel}),this.rotatorGrip!==void 0){this.rotatorGrip.zoomLevel=this.zoomLevel;const u=(i=this.rotatorGrip.gripSize)!==null&&i!==void 0?i:0,p=-u/2,x=(this.marker.width+this.CB_DISTANCE)/2-u/2;this.positionGrip(this.rotatorGrip.visual,x,p-Math.max(Math.max(3*this.CB_DISTANCE,30),15/this.zoomLevel))}}this.adjustGripVisibility()}positionGrip(t,i,e){if(t!==void 0){const s=t.transform.baseVal.getItem(0);s.setTranslate(i,e),t.transform.baseVal.replaceItem(s,0)}}hideControlBox(){this.controlBox&&(this.controlBox.style.display="none")}showControlBox(){this.controlBox&&(this.controlBox.style.display="")}adjustGripVisibility(){for(const t of this.disabledResizeGrips){const i=this.controlGrips.getGrip(t);i!==void 0&&(i.visual.style.display="none")}}scale(t,i){super.scale(t,i),this.adjustControlBox()}}class U extends J{constructor(t){super(t),this._creationStyle="draw"}pointerDown(t,i,e){super.pointerDown(t,i,e),this.state==="new"&&(this.marker.createVisual(),this.marker.moveVisual(t),this._state="creating")}resize(t,i=!1){super.resize(t,i),this.setSize()}pointerUp(t,i){super.pointerUp(t,i),this.setSize()}}class pt{constructor(){this.undoStack=[],this.redoStack=[]}get isUndoPossible(){return this.undoStack.length>1}get isRedoPossible(){return this.redoStack.length>0}get undoStepCount(){return this.undoStack.length}get redoStepCount(){return this.redoStack.length}addUndoStep(t){return(this.undoStack.length===0||JSON.stringify(this.undoStack[this.undoStack.length-1])!==JSON.stringify(t))&&(this.undoStack.push(JSON.parse(JSON.stringify(t))),JSON.stringify(this.lastRedoStep)!==JSON.stringify(t)&&this.redoStack.splice(0,this.redoStack.length),!0)}replaceLastUndoStep(t){this.undoStack.length>0&&(this.undoStack[this.undoStack.length-1]=JSON.parse(JSON.stringify(t)))}getLastUndoStep(){return this.undoStack.length>0?this.undoStack[this.undoStack.length-1]:void 0}undo(){if(this.undoStack.length>1){const t=this.undoStack.pop();return t!==void 0&&this.redoStack.push(t),this.undoStack.length>0?this.undoStack[this.undoStack.length-1]:void 0}}redo(){return this.lastRedoStep=this.redoStack.pop(),this.lastRedoStep!==void 0&&this.undoStack.push(this.lastRedoStep),this.lastRedoStep}}class I extends F{constructor(t){super(t),this.manipulationStartX=0,this.manipulationStartY=0,this._continuousCreation=!0,this.ownsTarget=this.ownsTarget.bind(this),this.setupControlBox=this.setupControlBox.bind(this),this.adjustControlBox=this.adjustControlBox.bind(this),this.manipulate=this.manipulate.bind(this),this.pointerDown=this.pointerDown.bind(this),this.pointerUp=this.pointerUp.bind(this)}ownsTarget(t){return!(!super.ownsTarget(t)&&!this.marker.ownsTarget(t)&&t!==this.controlRect)}pointerDown(t,i,e){super.pointerDown(t,i,e),this.manipulationStartX=t.x,this.manipulationStartY=t.y,this.state==="new"?(this.setupControlBox(),this.startCreation(t)):this.state!=="move"&&(this.select(),this._state="move")}startCreation(t){this.marker.stage="creating",this.marker.points.push(t),this.marker.createVisual(),this.marker.adjustVisual(),this._state="creating"}addNewPointWhileCreating(t){this.marker.points.push(t),this.marker.adjustVisual()}finishCreation(){this.marker.stage="normal",this.marker.adjustVisual(),this._state="select",this.onMarkerCreated&&this.onMarkerCreated(this)}pointerUp(t,i){super.pointerUp(t,i),this.manipulate(t,i),this._state==="creating"&&this.finishCreation(),this.state="select",this.stateChanged()}manipulate(t,i){this.state==="creating"?this.addNewPointWhileCreating(t):this.state==="move"&&(this.marker.points.forEach(e=>{e.x+=t.x-this.manipulationStartX,e.y+=t.y-this.manipulationStartY}),this.manipulationStartX=t.x,this.manipulationStartY=t.y,this.marker.adjustVisual(),this.adjustControlBox())}setupControlBox(){this.controlBox||(this.controlBox=r.createGroup(),this.container.appendChild(this.controlBox),this.controlRect=r.createRect(0,0,[["stroke","black"],["stroke-width","1"],["stroke-opacity","0.5"],["stroke-dasharray","3, 2"],["fill","transparent"]]),this.controlBox.appendChild(this.controlRect),this.controlBox.style.display="none")}adjustControlBox(){if(this.controlBox||this.setupControlBox(),this.marker.points.length>0){const t=Math.min(...this.marker.points.map(a=>a.x)),i=Math.min(...this.marker.points.map(a=>a.y)),e=Math.max(...this.marker.points.map(a=>a.x)),s=Math.max(...this.marker.points.map(a=>a.y));this.controlRect&&r.setAttributes(this.controlRect,[["x",(t-this.strokeWidth).toString()],["y",(i-this.strokeWidth).toString()],["width",(e-t+2*this.strokeWidth).toString()],["height",(s-i+2*this.strokeWidth).toString()]])}}select(){super.select(),this.adjustControlBox(),this.controlBox&&(this.controlBox.style.display="")}deselect(){super.deselect(),this.controlBox&&(this.controlBox.style.display="none")}}class at{get width(){return this._width}set width(t){this._width=t,this.textEditor.style.width=`${this.width}px`}get height(){return this._height}set height(t){this._height=t,this.textEditor.style.height=`${this.height}px`}get left(){return this._left}set left(t){this._left=t,this.textEditor.style.left=`${this.left}px`}get top(){return this._top}set top(t){this._top=t,this.textEditor.style.top=`${this.top}px`}get text(){return this._text}set text(t){this._text=t}get fontFamily(){return this._fontFamily}set fontFamily(t){this._fontFamily=t,this.textEditor.style.fontFamily=this._fontFamily}get fontSize(){return this._fontSize}set fontSize(t){this._fontSize=t,this.textEditor.style.fontSize=this._fontSize}get textColor(){return this._textColor}set textColor(t){this._textColor=t,this.textEditor.style.color=this.textColor}get bgColor(){return this._bgColor}set bgColor(t){this._bgColor=t,this.textEditor.style.backgroundColor=this.bgColor}constructor(){this.isInFocus=!1,this._width=0,this._height=0,this._left=0,this._top=0,this._text="",this._fontFamily="sans-serif",this._fontSize="1rem",this._textColor="#000",this._bgColor="transparent",this.isSetupCompleted=!1,this.textEditor=document.createElement("textarea"),this.getEditorUi=this.getEditorUi.bind(this),this.focus=this.focus.bind(this),this.setup=this.setup.bind(this)}setup(){this.textEditor.style.pointerEvents="auto",this.textEditor.style.width=`${this._width}px`,this.textEditor.style.height=`${this._height}px`,this.textEditor.style.overflow="hidden",this.textEditor.style.textAlign="center",this.textEditor.style.alignContent="center",this.textEditor.style.padding="0px",this.textEditor.style.margin="0px",this.textEditor.style.fontFamily=this._fontFamily,this.textEditor.style.fontSize=this._fontSize,this.textEditor.style.lineHeight="1em",this.textEditor.style.outline="none",this.textEditor.style.border="none",this.textEditor.style.resize="none",this.textEditor.value=this._text,this.textEditor.style.color=this._textColor,this.textEditor.style.whiteSpace="pre",this.textEditor.addEventListener("pointerdown",t=>{t.stopPropagation()}),this.textEditor.addEventListener("pointerup",t=>{t.stopPropagation()}),this.textEditor.addEventListener("keydown",t=>{t.key==="Escape"&&(t.preventDefault(),this.textEditor.blur())}),this.textEditor.addEventListener("keyup",t=>{t.cancelBubble=!0,this._text=this.textEditor.value,this.onTextChanged!==void 0&&this.onTextChanged(this._text)}),this.textEditor.addEventListener("blur",()=>{this._text=this.textEditor.value,this.onTextChanged!==void 0&&this.onTextChanged(this._text),this.onBlur!==void 0&&this.onBlur()}),this.isSetupCompleted=!0}getEditorUi(){return this.isSetupCompleted||this.setup(),this.textEditor}focus(){this.textEditor.focus()}blur(){this.textEditor.blur()}}class Y extends J{set color(t){this.marker.color=t,this.stateChanged()}get color(){return this.marker.color}set fontFamily(t){this.marker.fontFamily=t,this.stateChanged()}get fontFamily(){return this.marker.fontFamily}set fontSize(t){this.marker.fontSize=t,this.stateChanged()}get fontSize(){return this.marker.fontSize}constructor(t){super(t),this.textBlockEditorContainer=r.createForeignObject(),this._pointerDownTime=Number.MAX_VALUE,this._pointerDownPoint={x:0,y:0},this.markerSizeChanged=()=>{this.setSize()},this.disabledResizeGrips=["topleft","topcenter","topright","bottomleft","bottomcenter","bottomright","leftcenter","rightcenter"],this._creationStyle="drop",this.textBlockEditor=new at,this.marker.onSizeChanged=this.markerSizeChanged,this.showEditor=this.showEditor.bind(this),this.hideEditor=this.hideEditor.bind(this),this.pointerDown=this.pointerDown.bind(this),this.pointerUp=this.pointerUp.bind(this),this.resize=this.resize.bind(this),this.markerSizeChanged=this.markerSizeChanged.bind(this)}pointerDown(t,i,e){super.pointerDown(t,i,e),this._pointerDownTime=Date.now(),this._pointerDownPoint=t,this.state==="new"&&(this.marker.createVisual(),this.marker.moveVisual(t),this._state="creating")}dblClick(t,i,e){super.dblClick(t,i,e),this.state!=="edit"&&this.showEditor()}setSize(){super.setSize(),this.textBlockEditorContainer.style.display="flex",this.textBlockEditorContainer.style.transform=`translate(${this.marker.left}px, ${this.marker.top}px)`,this.textBlockEditorContainer.style.width=`${this.marker.width}px`,this.textBlockEditorContainer.setAttribute("width",`${this.marker.width}`),this.textBlockEditorContainer.style.height=`${this.marker.height}px`,this.textBlockEditorContainer.setAttribute("height",`${this.marker.height}`),this.textBlockEditor.width=this.marker.width,this.textBlockEditor.height=this.marker.height}resize(t,i=!1){super.resize(t,i),this.setSize()}pointerUp(t,i){const e=this.state;super.pointerUp(t,i),this.setSize(),(e==="creating"||Date.now()-this._pointerDownTime>500&&Math.abs(this._pointerDownPoint.x-t.x)<5&&Math.abs(this._pointerDownPoint.y-t.y)<5)&&this.showEditor(),this.adjustControlBox()}showEditor(){this.textBlockEditor.text=this.marker.text,this.textBlockEditor.textColor=this.marker.color,this.textBlockEditor.bgColor=this.marker.fillColor,this.textBlockEditor.fontFamily=this.marker.fontFamily,this.textBlockEditor.fontSize=`${this.marker.fontSize.value}${this.marker.fontSize.units}`,this.textBlockEditor.onTextChanged===void 0&&(this.textBlockEditor.onTextChanged=t=>{this.marker.text=t}),this.textBlockEditor.onBlur===void 0&&(this.textBlockEditor.onBlur=()=>{this.hideEditor(),this.deselect()}),this.textBlockEditorContainer.appendChild(this.textBlockEditor.getEditorUi()),this.container.appendChild(this.textBlockEditorContainer),this.marker.hideVisual(),this.hideControlBox(),this.textBlockEditor.focus()}hideEditor(){this.marker.text=this.textBlockEditor.text,this.marker.showVisual(),this.showControlBox(),this.state="select",this.container.removeChild(this.textBlockEditorContainer)}}var ht='<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2"><path style="fill:none" d="M413.33 667.848h305.294v148.981H413.33z" transform="matrix(.20963 0 0 .42959 -86.648 -286.898)"/><path d="m909.846 1031.18-62.778-1.78v-15.82l62.778-2.92v20.52Z" style="fill:#ffe862" transform="matrix(.83313 0 0 .79653 -699.87 -771.183)"/><path d="M771.747 702.002v-6.3h1.248v1.344l-.228.144a2.03 2.03 0 0 1 .306-.6c.14-.192.312-.362.516-.51.204-.148.424-.266.66-.354.236-.088.478-.132.726-.132.36 0 .676.06.948.18.272.12.496.3.672.54.176.24.304.54.384.9l-.192-.048.084-.204c.088-.184.21-.358.366-.522a2.863 2.863 0 0 1 1.17-.738 2.15 2.15 0 0 1 .66-.108c.472 0 .862.096 1.17.288.308.192.54.484.696.876.156.392.234.88.234 1.464v3.78h-1.248v-3.708c0-.36-.046-.654-.138-.882a1.021 1.021 0 0 0-.414-.51c-.184-.112-.42-.168-.708-.168-.224 0-.434.038-.63.114a1.55 1.55 0 0 0-.51.318 1.446 1.446 0 0 0-.456 1.068v3.768h-1.248v-3.732c0-.328-.048-.606-.144-.834a1.123 1.123 0 0 0-.42-.522 1.204 1.204 0 0 0-.672-.18 1.68 1.68 0 0 0-.624.114 1.62 1.62 0 0 0-.504.312 1.398 1.398 0 0 0-.456 1.05v3.792h-1.248Z" style="fill:#e60076;fill-rule:nonzero" transform="matrix(4.60055 0 0 4.60055 -3539.456 -3186.295)"/></svg>';class O extends U{}class ot extends D{set arrowType(t){this.marker.arrowType=t}get arrowType(){return this.marker.arrowType}}class nt extends Y{constructor(t){super(t),this.manipulationStartTipPositionX=0,this.manipulationStartTipPositionY=0}addControlGrips(){this.tipGrip=this.createTipGrip(),super.addControlGrips()}createTipGrip(){const t=new g;return t.zoomLevel=this.zoomLevel,t.visual.transform.baseVal.appendItem(r.createTransform()),this.manipulationBox.appendChild(t.visual),t}positionGrips(){var t;if(super.positionGrips(),this.tipGrip){this.tipGrip.zoomLevel=this.zoomLevel;const i=(t=this.tipGrip.gripSize)!==null&&t!==void 0?t:0;this.positionGrip(this.tipGrip.visual,this.marker.tipPosition.x-i/2,this.marker.tipPosition.y-i/2)}}ownsTarget(t){var i;return!(!super.ownsTarget(t)&&!(!((i=this.tipGrip)===null||i===void 0)&&i.ownsTarget(t)))}pointerDown(t,i,e){super.pointerDown(t,i,e),this.manipulationStartTipPositionX=this.marker.tipPosition.x,this.manipulationStartTipPositionY=this.marker.tipPosition.y,this.tipGrip!==void 0&&i!==void 0&&this.tipGrip.ownsTarget(i)&&(this.activeGrip=this.tipGrip,this._state="resize")}resize(t,i=!1){const e=this.manipulationStartTipPositionX+t.x-this.manipulationStartX,s=this.manipulationStartTipPositionY+t.y-this.manipulationStartY;this.activeGrip===this.tipGrip?(this.marker.tipPosition={x:e,y:s},this.adjustControlBox()):super.resize(t,i)}}class N extends J{constructor(t){super(t),this._creationStyle="drop",this.disabledResizeGrips=["topcenter","bottomcenter","leftcenter","rightcenter"],this.pointerDown=this.pointerDown.bind(this),this.pointerUp=this.pointerUp.bind(this),this.resize=this.resize.bind(this)}pointerDown(t,i,e){super.pointerDown(t,i,e),this.state==="new"&&(this.marker.createVisual(),this.marker.moveVisual(t),this._state="creating")}pointerUp(t,i){super.pointerUp(t,i),this.setSize(),this.adjustControlBox()}}class lt extends Y{constructor(t){super(t),this.disabledResizeGrips=[],this._creationStyle="draw"}setSize(){if(super.setSize(),this.textBlockEditorContainer.style.transform=`translate(${this.marker.left}px, ${this.marker.top+this.marker.strokeWidth/2}px)`,this.marker.textBlock.textSize){const t=this.marker.textBlock.textSize.height+2*this.marker.padding;this.textBlockEditorContainer.style.width=`${this.marker.width}px`,this.textBlockEditorContainer.style.height=`${t}px`,this.textBlockEditor.width=this.marker.width,this.textBlockEditor.height=t}}}class dt extends D{constructor(){super(...arguments),this.manipulationStartCurveX=0,this.manipulationStartCurveY=0}ownsTarget(t){var i;return!(!super.ownsTarget(t)&&!(!((i=this.curveGrip)===null||i===void 0)&&i.ownsTarget(t)))}pointerDown(t,i,e){var s;this.state==="new"&&(this.marker.curveX=t.x,this.marker.curveY=t.y),this.manipulationStartCurveX=this.marker.curveX,this.manipulationStartCurveY=this.marker.curveY,super.pointerDown(t,i,e),this.state!=="new"&&this.state!=="creating"&&(i&&(!((s=this.curveGrip)===null||s===void 0)&&s.ownsTarget(i))&&(this.activeGrip=this.curveGrip),this.activeGrip?this._state="resize":this._state="move")}resize(t){super.resize(t),this.activeGrip===this.curveGrip&&(this.marker.curveX=t.x,this.marker.curveY=t.y,this.marker.adjustVisual(),this.adjustControlBox()),this.state==="creating"&&(this.marker.curveX=this.marker.x1+(this.marker.x2-this.marker.x1)/2,this.marker.curveY=this.marker.y1+(this.marker.y2-this.marker.y1)/2)}manipulate(t,i){this.state==="move"&&(this.marker.curveX=this.manipulationStartCurveX+t.x-this.manipulationStartX,this.marker.curveY=this.manipulationStartCurveY+t.y-this.manipulationStartY),super.manipulate(t,i)}setupControlBox(){super.setupControlBox();const t=1/this.zoomLevel;this.curveControlLine1=r.createLine(this.marker.x1,this.marker.y1,this.marker.curveX,this.marker.curveY,[["stroke","black"],["stroke-width",t.toString()],["stroke-opacity","0.5"],["stroke-dasharray","3, 2"],["fill","transparent"],["pointer-events","none"]]),this.curveControlLine2=r.createLine(this.marker.x2,this.marker.y2,this.marker.curveX,this.marker.curveY,[["stroke","black"],["stroke-width",t.toString()],["stroke-opacity","0.5"],["stroke-dasharray","3, 2"],["fill","transparent"],["pointer-events","none"]]),this._controlBox.insertBefore(this.curveControlLine1,this._controlBox.firstChild),this._controlBox.insertBefore(this.curveControlLine2,this._controlBox.firstChild)}adjustControlBox(){super.adjustControlBox();const t=1/this.zoomLevel;this.curveControlLine1&&this.curveControlLine2&&this.curveGrip&&(this.curveControlLine1.setAttribute("x1",this.marker.x1.toString()),this.curveControlLine1.setAttribute("y1",this.marker.y1.toString()),this.curveControlLine1.setAttribute("x2",this.marker.curveX.toString()),this.curveControlLine1.setAttribute("y2",this.marker.curveY.toString()),this.curveControlLine1.setAttribute("stroke-width",t.toString()),this.curveControlLine2.setAttribute("x1",this.marker.x2.toString()),this.curveControlLine2.setAttribute("y1",this.marker.y2.toString()),this.curveControlLine2.setAttribute("x2",this.marker.curveX.toString()),this.curveControlLine2.setAttribute("y2",this.marker.curveY.toString()),this.curveControlLine2.setAttribute("stroke-width",t.toString()),this.curveGrip.zoomLevel=this.zoomLevel)}addControlGrips(){super.addControlGrips(),this.curveGrip=this.createGrip(),this.curveGrip.zoomLevel=this.zoomLevel,this.positionGrips()}positionGrips(){if(super.positionGrips(),this.curveGrip){const t=this.curveGrip.gripSize;this.positionGrip(this.curveGrip.visual,this.marker.curveX-t/2,this.marker.curveY-t/2)}}}class ut extends HTMLElement{get targetWidth(){return this._targetWidth}set targetWidth(t){this._targetWidth=t,this.setMainCanvasSize()}get targetHeight(){return this._targetHeight}set targetHeight(t){this._targetHeight=t,this.setMainCanvasSize()}get currentMarkerEditor(){return this._currentMarkerEditor}get selectedMarkerEditors(){return this._selectedMarkerEditors}get targetImage(){return this._targetImage}set targetImage(t){this._targetImage=t,this._targetImageLoaded=!1,t!==void 0&&this.addTargetImage()}get zoomLevel(){return this._zoomLevel}set zoomLevel(t){const i=this._zoomLevel;this._zoomLevel=t,this._canvasContainer&&this._contentContainer&&this._mainCanvas&&this._overlayContainer&&(this._panX=this._panX*t/i,this._panY=this._panY*t/i,this.applyTransform(),this.adjustEditorsZoom())}autoZoom(){if(!this._autoZoomIn&&!this._autoZoomOut||!this._canvasContainer||this._targetWidth<=0||this._targetHeight<=0)return;const t=this._canvasContainer.clientWidth,i=this._canvasContainer.clientHeight;if(t<=0||i<=0)return;const e=t/this._targetWidth,s=i/this._targetHeight,a=Math.min(e,s);(a>1&&this._autoZoomIn||a<1&&this._autoZoomOut)&&(this._panX=0,this._panY=0,this.zoomLevel=a)}applyTransform(){this._transformContainer&&(this._transformContainer.style.transform=`translate(${this._panX}px, ${this._panY}px) scale(${this._zoomLevel})`)}panTo(t){this._panX-=this.prevPanPoint.x-t.x,this._panY-=this.prevPanPoint.y-t.y,this.applyTransform(),this.prevPanPoint=t}getPinchDistance(){const t=Array.from(this.activePointers.values());if(t.length<2)return 0;const i=t[1].x-t[0].x,e=t[1].y-t[0].y;return Math.sqrt(i*i+e*e)}getPinchMidpoint(){const t=Array.from(this.activePointers.values());return t.length<2?{x:0,y:0}:{x:(t[0].x+t[1].x)/2,y:(t[0].y+t[1].y)/2}}get defaultFilter(){return this._defaultFilter}set defaultFilter(t){this._defaultFilter=t}get autoZoomIn(){return this._autoZoomIn}set autoZoomIn(t){this._autoZoomIn=t}get autoZoomOut(){return this._autoZoomOut}set autoZoomOut(t){this._autoZoomOut=t}constructor(){super(),this.width=0,this.height=0,this._targetWidth=-1,this._targetHeight=-1,this.mode="select",this._isInitialized=!1,this._selectedMarkerEditors=[],this._newMarkerOutline=r.createPath("",[["stroke","#333"],["stroke-width","0.5"],["stroke-dasharray","2 5"],["fill","rgba(200,200,200,0.5)"],["pointer-events","none"]]),this._targetImageLoaded=!1,this.markerEditors=new Map,this.editors=[],this._zoomLevel=1,this._panX=0,this._panY=0,this.prevPanPoint={x:0,y:0},this.undoRedoManager=new pt,this._autoZoomIn=!1,this._autoZoomOut=!1,this._defs=[],this.touchPoints=0,this.isDragging=!1,this.isSelecting=!1,this.isPanning=!1,this.activePointers=new Map,this.isPinching=!1,this.prevPinchDistance=0,this.prevPinchMidpoint={x:0,y:0},this._marqueeSelectOutline=r.createRect(0,0,[["stroke","rgb(35, 35, 255)"],["stroke-width","1"],["fill","rgba(129, 129, 255, 0.3)"],["pointer-events","none"],["cursor","move"]]),this._marqueeSelectRect=new DOMRect(0,0,0,0),this._manipulationStartX=0,this._manipulationStartY=0,this._stateToRestoreAddUndoStep=!0,this.markerEditors.set(_,U),this.markerEditors.set(T,U),this.markerEditors.set(v,D),this.markerEditors.set(f,st),this.markerEditors.set(k,I),this.markerEditors.set(m,Y),this.markerEditors.set(C,O),this.markerEditors.set(S,O),this.markerEditors.set(P,O),this.markerEditors.set(y,ot),this.markerEditors.set(E,D),this.markerEditors.set(M,nt),this.markerEditors.set(V,N),this.markerEditors.set(B,N),this.markerEditors.set(L,N),this.markerEditors.set(z,lt),this.markerEditors.set(G,dt),this.markerEditors.set(w,I),this.connectedCallback=this.connectedCallback.bind(this),this.disconnectedCallback=this.disconnectedCallback.bind(this),this.createLayout=this.createLayout.bind(this),this.addMainCanvas=this.addMainCanvas.bind(this),this.setMainCanvasSize=this.setMainCanvasSize.bind(this),this.setEditingTargetSize=this.setEditingTargetSize.bind(this),this.initOverlay=this.initOverlay.bind(this),this.addTargetImage=this.addTargetImage.bind(this),this.attachEvents=this.attachEvents.bind(this),this.attachWindowEvents=this.attachWindowEvents.bind(this),this.detachEvents=this.detachEvents.bind(this),this.detachWindowEvents=this.detachWindowEvents.bind(this),this.onCanvasPointerDown=this.onCanvasPointerDown.bind(this),this.onCanvasDblClick=this.onCanvasDblClick.bind(this),this.onKeyUp=this.onKeyUp.bind(this),this.onPointerMove=this.onPointerMove.bind(this),this.onPointerOut=this.onPointerOut.bind(this),this.onPointerUp=this.onPointerUp.bind(this),this.createMarker=this.createMarker.bind(this),this.addNewMarker=this.addNewMarker.bind(this),this.markerCreated=this.markerCreated.bind(this),this.markerStateChanged=this.markerStateChanged.bind(this),this.deleteMarker=this.deleteMarker.bind(this),this.deleteSelectedMarkers=this.deleteSelectedMarkers.bind(this),this.switchToSelectMode=this.switchToSelectMode.bind(this),this.showOutline=this.showOutline.bind(this),this.hideOutline=this.hideOutline.bind(this),this.scaleMarkers=this.scaleMarkers.bind(this),this.adjustEditorsZoom=this.adjustEditorsZoom.bind(this),this.autoZoom=this.autoZoom.bind(this),this.getState=this.getState.bind(this),this.restoreState=this.restoreState.bind(this),this.undo=this.undo.bind(this),this.addUndoStep=this.addUndoStep.bind(this),this.undoStep=this.undoStep.bind(this),this.redo=this.redo.bind(this),this.redoStep=this.redoStep.bind(this),this.toggleLogo=this.toggleLogo.bind(this),this.addLogo=this.addLogo.bind(this),this.removeLogo=this.removeLogo.bind(this),this.adjustMarqueeSelectOutline=this.adjustMarqueeSelectOutline.bind(this),this.hideMarqueeSelectOutline=this.hideMarqueeSelectOutline.bind(this),this.addDefs=this.addDefs.bind(this),this.addDefaultFilterDefs=this.addDefaultFilterDefs.bind(this),this.attachShadow({mode:"open"})}connectedCallback(){this.dispatchEvent(new CustomEvent("areainit",{detail:{markerArea:this}})),c.addKeyAddListener(this.toggleLogo),this.createLayout(),this.addMainCanvas(),this.initOverlay(),this.attachEvents(),this._isInitialized=!0,this.targetImage!==void 0&&this.addTargetImage(),this.setMainCanvasSize(),this.addDefaultFilterDefs(),this.toggleLogo(),this.addUndoStep(),this.dispatchEvent(new CustomEvent("areashow",{detail:{markerArea:this}}))}disconnectedCallback(){this.detachEvents()}createLayout(){var t;this.style.display="flex",this.style.width=this.style.width!==""?this.style.width:"100%",this.style.height=this.style.height!==""?this.style.height:"100%",this.style.position="relative",this._contentContainer=document.createElement("div"),this._contentContainer.style.display="flex",this._contentContainer.style.position="relative",this._contentContainer.style.flexGrow="2",this._contentContainer.style.flexShrink="1",this._contentContainer.style.overflow="hidden",this._canvasContainer=document.createElement("div"),this._canvasContainer.style.touchAction="none",this._canvasContainer.className="canvas-container",this._canvasContainer.style.display="flex",this._canvasContainer.style.flexGrow="2",this._canvasContainer.style.flexShrink="2",this._canvasContainer.style.justifyContent="center",this._canvasContainer.style.alignItems="center",this._canvasContainer.style.overflow="hidden",this._canvasContainer.style.userSelect="none",this._canvasContainer.addEventListener("wheel",i=>{i.preventDefault(),this._panX-=i.deltaX,this._panY-=i.deltaY,this.applyTransform()},{passive:!1}),this._transformContainer=document.createElement("div"),this._transformContainer.style.display="grid",this._transformContainer.style.gridTemplateColumns="1fr",this._canvasContainer.appendChild(this._transformContainer),this._contentContainer.appendChild(this._canvasContainer),(t=this.shadowRoot)===null||t===void 0||t.appendChild(this._contentContainer)}addMainCanvas(){var t,i;this.width=((t=this._contentContainer)===null||t===void 0?void 0:t.clientWidth)||0,this.height=((i=this._contentContainer)===null||i===void 0?void 0:i.clientHeight)||0,this._mainCanvas=document.createElementNS("http://www.w3.org/2000/svg","svg"),this._mainCanvas.setAttribute("xmlns","http://www.w3.org/2000/svg"),this.setMainCanvasSize(),this._mainCanvas.style.gridColumnStart="1",this._mainCanvas.style.gridRowStart="1",this._mainCanvas.style.pointerEvents="auto",this.addDefsToMainCanvas(),this._groupLayer=r.createGroup(),this._mainCanvas.appendChild(this._groupLayer),this._transformContainer.appendChild(this._mainCanvas)}addDefsToMainCanvas(){var t;this._defsElement=r.createDefs(),(t=this._mainCanvas)===null||t===void 0||t.appendChild(this._defsElement),this._defsElement.append(...this._defs)}setMainCanvasSize(){this._mainCanvas!==void 0&&this._targetHeight>0&&this._targetWidth>0&&(this._mainCanvas.style.width=`${this._targetWidth}px`,this._mainCanvas.style.height=`${this._targetHeight}px`,this._mainCanvas.setAttribute("width",`${this._targetWidth}`),this._mainCanvas.setAttribute("height",`${this._targetHeight}`),this._mainCanvas.setAttribute("viewBox","0 0 "+this._targetWidth.toString()+" "+this._targetHeight.toString()),this.setEditingTargetSize())}setEditingTargetSize(){this._editingTarget!==void 0&&(this._editingTarget.width=this._targetWidth,this._editingTarget.height=this._targetHeight,this._editingTarget.style.width=`${this._targetWidth}px`,this._editingTarget.style.height=`${this._targetHeight}px`)}initOverlay(){this._overlayContainer=document.createElement("div"),this._overlayContainer.style.pointerEvents="none",this._overlayContainer.style.display="flex",this._overlayContainer.style.alignItems="center",this._overlayContainer.style.justifyContent="center",this._overlayContainer.style.gridRowStart="1",this._overlayContainer.style.gridColumnStart="1",this._transformContainer.appendChild(this._overlayContainer),this._overlayContentContainer=document.createElement("div"),this._overlayContentContainer.style.position="relative",this._overlayContentContainer.style.display="flex",this._overlayContainer.appendChild(this._overlayContentContainer)}addTargetImage(){this._isInitialized&&this._editingTarget===void 0&&this.targetImage!==void 0&&this._canvasContainer!==void 0&&this._mainCanvas!==void 0&&(this._editingTarget=document.createElement("img"),this._targetWidth=this._targetWidth>0?this._targetWidth:this.targetImage.clientWidth,this._targetHeight=this._targetHeight>0?this._targetHeight:this.targetImage.clientHeight,this._editingTarget.addEventListener("load",t=>{if(this._editingTarget!==void 0){if(this._targetHeight<=0||this._targetWidth<=0){const i=t.target,e=i.naturalWidth/i.naturalHeight,s=this._targetWidth>0?this._targetWidth:this._targetHeight>0?this._targetHeight*e:i.clientWidth>0?i.clientWidth:i.naturalWidth,a=this._targetHeight>0?this._targetHeight:this._targetWidth>0?this._targetWidth/e:i.clientHeight>0?i.clientHeight:i.naturalHeight;this._targetWidth=s,this._targetHeight=a}this._editingTarget.width=this._targetWidth,this._editingTarget.height=this._targetHeight,this._editingTarget.style.width=`${this._targetWidth}px`,this._editingTarget.style.height=`${this._targetHeight}px`,this._editingTarget.style.gridColumnStart="1",this._editingTarget.style.gridRowStart="1",this.setMainCanvasSize(),this._targetImageLoaded=!0,this._stateToRestore!==void 0&&this.restoreState(this._stateToRestore,this._stateToRestoreAddUndoStep)}this.zoomLevel=this._zoomLevel,this.autoZoom()}),this._editingTarget.src=this.targetImage.src,this._transformContainer.insertBefore(this._editingTarget,this._mainCanvas))}addDefaultFilterDefs(){this.addDefs(...R.getDefaultFilterSet())}registerMarkerType(t,i){this.markerEditors.set(t,i)}createMarker(t){let i=_;i=typeof t=="string"?this.getMarkerTypeByName(t)||_:t;const e=this.markerEditors.get(i);return e&&this._mainCanvas&&(this.setCurrentEditor(),this.deselectEditor(),this.addUndoStep(),this._currentMarkerEditor=this.addNewMarker(e,i),this._currentMarkerEditor.onMarkerCreated=this.markerCreated,this._currentMarkerEditor.onStateChanged=this.markerStateChanged,this._currentMarkerEditor.creationStyle==="drop"?this._mainCanvas.style.cursor="move":this._mainCanvas.style.cursor="crosshair",this.dispatchEvent(new CustomEvent("markercreating",{detail:{markerArea:this,markerEditor:this._currentMarkerEditor}}))),this._currentMarkerEditor}addNewMarker(t,i){if(this._mainCanvas===void 0)throw new Error("Main canvas is not initialized.");const e=r.createGroup();this.defaultFilter&&i.applyDefaultFilter&&e.setAttribute("filter",this.defaultFilter),this._mainCanvas.appendChild(e);const s=new t({container:e,overlayContainer:this._overlayContentContainer,markerType:i});return s.zoomLevel=this.zoomLevel,s}markerCreated(t){if(this._mainCanvas){if(this.mode="select",this.editors.push(t),this.setCurrentEditor(t),t.continuousCreation){const i=this.createMarker(t.marker.typeName);t.is(I)&&(i!=null&&i.is(I))&&(i.strokeColor=t.strokeColor,i.strokeWidth=t.strokeWidth,i.strokeDasharray=t.strokeDasharray)}else this._mainCanvas.style.cursor="default";this.addUndoStep(),this.dispatchEvent(new CustomEvent("markercreate",{detail:{markerArea:this,markerEditor:t}}))}}markerStateChanged(t){this.addUndoStep(),this.dispatchEvent(new CustomEvent("markerchange",{detail:{markerArea:this,markerEditor:t}}))}deleteMarker(t,i=!1){var e;this.editors.indexOf(t)>=0&&(this.dispatchEvent(new CustomEvent("markerbeforedelete",{detail:{markerArea:this,markerEditor:t}})),(e=this._mainCanvas)===null||e===void 0||e.removeChild(t.container),t.dispose(),this.editors.splice(this.editors.indexOf(t),1),this._selectedMarkerEditors.splice(this._selectedMarkerEditors.indexOf(t),1),i||this.addUndoStep(),this.dispatchEvent(new CustomEvent("markerdelete",{detail:{markerArea:this,markerEditor:t}})))}deleteSelectedMarkers(){const t=[...this._selectedMarkerEditors];t.forEach((i,e)=>this.deleteMarker(i,e!==t.length-1)),this.hideMarqueeSelectOutline()}setCurrentEditor(t){this._currentMarkerEditor!==t&&this._currentMarkerEditor!==void 0&&this.deselectEditor(this._currentMarkerEditor),this._currentMarkerEditor=t,this._currentMarkerEditor===void 0||this._currentMarkerEditor.isSelected||this._currentMarkerEditor.state!=="new"&&(this.selectEditor(this._currentMarkerEditor),this._currentMarkerEditor.select(!1))}selectEditor(t){this._selectedMarkerEditors.indexOf(t)<0&&(this._selectedMarkerEditors.length>0&&this._selectedMarkerEditors[0].select(!0),this._selectedMarkerEditors.push(t),t.select(!0),this.dispatchEvent(new CustomEvent("markerselect",{detail:{markerArea:this,markerEditor:t}})))}deselectEditor(t){const i=this._selectedMarkerEditors.length;if(t&&t.state==="creating"&&t.deselect(),i>0){const e=t??this._selectedMarkerEditors[this._selectedMarkerEditors.length-1];if(t===void 0)this._selectedMarkerEditors.forEach(s=>s.deselect()),this._selectedMarkerEditors.splice(0);else{const s=this._selectedMarkerEditors.indexOf(t);s>=0&&(this._selectedMarkerEditors.splice(s,1),t.deselect())}this.dispatchEvent(new CustomEvent("markerdeselect",{detail:{markerArea:this,markerEditor:e}}))}}onCanvasPointerDown(t){var i;if(this.activePointers.set(t.pointerId,{x:t.clientX,y:t.clientY}),this._manipulationStartX=t.clientX,this._manipulationStartY=t.clientY,this.touchPoints++,this.touchPoints===1&&(this.leadPointerId=t.pointerId),t.pointerType==="touch"&&this.touchPoints===1||t.pointerType!=="touch"&&t.button===0&&!t.altKey)if(this._currentMarkerEditor===void 0||this._currentMarkerEditor.state!=="new"&&this._currentMarkerEditor.state!=="creating"){if(this.mode==="select"){const e=r.clientToLocalCoordinates(this._mainCanvas,t.clientX,t.clientY,this.zoomLevel),s=this.editors.find(a=>a.ownsTarget(t.target));s!==void 0?(this.isDragging=!0,t.shiftKey?(this.selectEditor(s),this.initializeMarqueeSelection(e)):s.isSelected||(this.deselectEditor(),this.setCurrentEditor(s)),this._selectedMarkerEditors.forEach(a=>{var h;return a.pointerDown(e,(h=t.target)!==null&&h!==void 0?h:void 0,t)})):t.target===this._marqueeSelectOutline&&this._selectedMarkerEditors.length>1?(this.isDragging=!0,this._selectedMarkerEditors.forEach(a=>{var h;return a.pointerDown(e,(h=t.target)!==null&&h!==void 0?h:void 0,t)})):(this.setCurrentEditor(),this.deselectEditor(),this.isSelecting=!0,this.isDragging=!0,this.initializeMarqueeSelection(e),this.prevPanPoint={x:t.clientX,y:t.clientY})}}else this.isDragging=!0,this._currentMarkerEditor.pointerDown(r.clientToLocalCoordinates(this._mainCanvas,t.clientX,t.clientY,this.zoomLevel),(i=t.target)!==null&&i!==void 0?i:void 0,t);else t.pointerType!=="touch"&&(t.button===0&&t.altKey||t.button===1)?(this.isDragging=!0,this.isPanning=!0,this.prevPanPoint={x:t.clientX,y:t.clientY},this._mainCanvas&&(this._mainCanvas.style.cursor="grabbing")):t.pointerType==="touch"&&this.touchPoints===2&&(this.isPinching=!0,this.prevPinchDistance=this.getPinchDistance(),this.prevPinchMidpoint=this.getPinchMidpoint())}initializeMarqueeSelection(t){this._marqueeSelectRect.x=t.x,this._marqueeSelectRect.y=t.y,this._marqueeSelectRect.width=0,this._marqueeSelectRect.height=0,r.setAttributes(this._marqueeSelectOutline,[["x",t.x.toString()],["y",t.y.toString()],["width","0"],["height","0"]]),this._groupLayer&&!this._groupLayer.contains(this._marqueeSelectOutline)&&this._groupLayer.appendChild(this._marqueeSelectOutline)}onCanvasDblClick(t){var i;if(this.mode==="select"){const e=this.editors.find(s=>s.ownsTarget(t.target));e!==void 0&&e!==this._currentMarkerEditor&&this.setCurrentEditor(e),this._currentMarkerEditor!==void 0?this._currentMarkerEditor.dblClick(r.clientToLocalCoordinates(this._mainCanvas,t.clientX,t.clientY,this.zoomLevel),(i=t.target)!==null&&i!==void 0?i:void 0,t):this.setCurrentEditor()}}onPointerMove(t){var i;if(this.activePointers.set(t.pointerId,{x:t.clientX,y:t.clientY}),t.pointerType==="touch"&&this.touchPoints===1||t.pointerType!=="touch"&&this.isDragging&&!t.altKey){const e=r.clientToLocalCoordinates(this._mainCanvas,t.clientX,t.clientY,this.zoomLevel);if(this._currentMarkerEditor!==void 0||this._selectedMarkerEditors.length>0)this._currentMarkerEditor!==void 0&&this._currentMarkerEditor.state==="edit"||t.preventDefault(),this._currentMarkerEditor!==void 0||this._selectedMarkerEditors.length>0?(this.showOutline(e),this._selectedMarkerEditors.length>0?this._selectedMarkerEditors.forEach(s=>s.manipulate(e,t)):(i=this._currentMarkerEditor)===null||i===void 0||i.manipulate(e,t)):this.zoomLevel>1&&this.panTo({x:t.clientX,y:t.clientY}),this.adjustMarqueeSelectOutline();else if(this.isSelecting){const s=r.clientToLocalCoordinates(this._mainCanvas,this._manipulationStartX,this._manipulationStartY,this.zoomLevel);this._marqueeSelectRect.x=Math.min(e.x,s.x),this._marqueeSelectRect.y=Math.min(e.y,s.y),this._marqueeSelectRect.width=Math.abs(t.clientX-this._manipulationStartX)/this.zoomLevel,this._marqueeSelectRect.height=Math.abs(t.clientY-this._manipulationStartY)/this.zoomLevel,r.setAttributes(this._marqueeSelectOutline,[["x",`${this._marqueeSelectRect.x}`],["y",`${this._marqueeSelectRect.y}`],["width",`${this._marqueeSelectRect.width}`],["height",`${this._marqueeSelectRect.height}`]])}}else if(t.pointerType!=="touch"&&this.isPanning)this.panTo({x:t.clientX,y:t.clientY});else if(t.pointerType==="touch"&&this.touchPoints===2&&this.isPinching){const e=this.getPinchDistance(),s=this.getPinchMidpoint();if(this._panX+=s.x-this.prevPinchMidpoint.x,this._panY+=s.y-this.prevPinchMidpoint.y,this.prevPinchDistance>0&&this._canvasContainer){const a=e/this.prevPinchDistance,h=Math.max(.1,Math.min(10,this._zoomLevel*a)),o=h/this._zoomLevel,n=this._canvasContainer.getBoundingClientRect(),l=s.x-(n.left+n.width/2),u=s.y-(n.top+n.height/2);this._panX=l*(1-o)+this._panX*o,this._panY=u*(1-o)+this._panY*o,this._zoomLevel=h,this.applyTransform(),this.adjustEditorsZoom()}this.prevPinchDistance=e,this.prevPinchMidpoint=Object.assign({},s)}}showOutline(t){if(this._currentMarkerEditor&&this._currentMarkerEditor.creationStyle==="drop"&&this._currentMarkerEditor.state==="new"){this._mainCanvas===void 0||this._mainCanvas.contains(this._newMarkerOutline)||this._mainCanvas.appendChild(this._newMarkerOutline);const i=this._currentMarkerEditor.marker.defaultSize;r.setAttributes(this._newMarkerOutline,[["d",this._currentMarkerEditor.marker.getOutline()]]),this._newMarkerOutline.style.transform=`translate(${t.x-i.width/2}px, ${t.y-i.height/2}px)`}}hideOutline(){var t;!((t=this._mainCanvas)===null||t===void 0)&&t.contains(this._newMarkerOutline)&&this._mainCanvas.removeChild(this._newMarkerOutline)}onPointerUp(t){var i;if(this.activePointers.delete(t.pointerId),this.touchPoints>0&&(this.touchPoints--,this.touchPoints===0&&(this.leadPointerId=void 0)),this.touchPoints<2&&(this.isPinching=!1,this.prevPinchDistance=0),this.touchPoints===1&&this.activePointers.size===1&&(this.prevPanPoint=Array.from(this.activePointers.values())[0]),this.touchPoints===0){if(this._mainCanvas&&(this._mainCanvas.style.cursor="default"),this.isDragging&&(this._currentMarkerEditor!==void 0||this._selectedMarkerEditors.length>0)){const e=r.clientToLocalCoordinates(this._mainCanvas,t.clientX,t.clientY,this.zoomLevel);this._selectedMarkerEditors.length>1?(this._selectedMarkerEditors.forEach(s=>s.pointerUp(e,t)),this.adjustMarqueeSelectOutline()):(i=this._currentMarkerEditor)===null||i===void 0||i.pointerUp(e,t),this.hideOutline(),this.addUndoStep()}else if(this.isSelecting&&(this.finishMarqueeSelection(),this._selectedMarkerEditors.length<2&&(this.hideMarqueeSelectOutline(),this._selectedMarkerEditors.length===1))){const e=this._selectedMarkerEditors[0];this.deselectEditor(),this.setCurrentEditor(e)}}this.isDragging=!1,this.isSelecting=!1,this.isPanning=!1,this.touchPoints===0&&(this.isPinching=!1,this.prevPinchDistance=0)}finishMarqueeSelection(){this.deselectEditor(),this.editors.forEach(t=>{const i=t.marker.getBBox();i.x<this._marqueeSelectRect.x+this._marqueeSelectRect.width&&i.x+i.width>this._marqueeSelectRect.x&&i.y<this._marqueeSelectRect.y+this._marqueeSelectRect.height&&i.y+i.height>this._marqueeSelectRect.y&&this.selectEditor(t)}),this.adjustMarqueeSelectOutline()}adjustMarqueeSelectOutline(){let t=Number.MAX_VALUE,i=Number.MAX_VALUE,e=0,s=0;this._selectedMarkerEditors.forEach(a=>{const h=a.marker.getBBox();t=Math.min(t,h.x),i=Math.min(i,h.y),e=Math.max(e,h.x+h.width),s=Math.max(s,h.y+h.height)}),this._selectedMarkerEditors.length>1?(this._marqueeSelectRect.x=t,this._marqueeSelectRect.y=i,this._marqueeSelectRect.width=e-t,this._marqueeSelectRect.height=s-i,r.setAttributes(this._marqueeSelectOutline,[["x",`${this._marqueeSelectRect.x}`],["y",`${this._marqueeSelectRect.y}`],["width",`${this._marqueeSelectRect.width}`],["height",`${this._marqueeSelectRect.height}`],["pointer-events",""]])):this.hideMarqueeSelectOutline()}hideMarqueeSelectOutline(){this._groupLayer&&this._groupLayer.contains(this._marqueeSelectOutline)&&this._groupLayer.removeChild(this._marqueeSelectOutline)}onPointerOut(t){this.activePointers.delete(t.pointerId),this.touchPoints>0&&this.touchPoints--,this.hideOutline()}onKeyUp(t){this._currentMarkerEditor!==void 0&&(t.key==="Delete"||t.key)}attachEvents(){var t,i,e;this.hasAttribute("tabindex")||this.setAttribute("tabindex","0"),(t=this._mainCanvas)===null||t===void 0||t.addEventListener("pointerdown",this.onCanvasPointerDown),(i=this._mainCanvas)===null||i===void 0||i.addEventListener("touchmove",s=>s.preventDefault()),(e=this._mainCanvas)===null||e===void 0||e.addEventListener("dblclick",this.onCanvasDblClick),this._marqueeSelectOutline.addEventListener("dblclick",s=>{s.preventDefault(),s.stopPropagation(),this.deselectEditor(),this.hideMarqueeSelectOutline()}),this.attachWindowEvents()}attachWindowEvents(){window.addEventListener("pointermove",this.onPointerMove),window.addEventListener("pointerup",this.onPointerUp),window.addEventListener("pointerleave",this.onPointerUp),window.addEventListener("pointercancel",this.onPointerOut),window.addEventListener("pointerout",this.onPointerOut),window.addEventListener("keyup",this.onKeyUp)}detachEvents(){this.detachWindowEvents()}detachWindowEvents(){}getMarkerTypeByName(t){let i;return this.markerEditors.forEach((e,s)=>{s.typeName===t&&(i=s)}),i}switchToSelectMode(){this.setCurrentEditor(),this._mainCanvas&&(this._mainCanvas.style.cursor="default")}getState(){const t={version:3,width:this.targetWidth,height:this.targetHeight,defaultFilter:this.defaultFilter,markers:this.editors.map(i=>i.getState())};return JSON.parse(JSON.stringify(t))}restoreState(t,i=!0){if(!this._targetImageLoaded)return this._stateToRestore=t,void(this._stateToRestoreAddUndoStep=i);this._stateToRestore=void 0,this._stateToRestoreAddUndoStep=!0;const e=JSON.parse(JSON.stringify(t));if(this.editors.splice(0),this._mainCanvas&&this._groupLayer){for(this.hideMarqueeSelectOutline(),this.deselectEditor();this._mainCanvas.lastChild;)this._mainCanvas.removeChild(this._mainCanvas.lastChild);this.addDefsToMainCanvas(),this._mainCanvas.appendChild(this._groupLayer)}this.defaultFilter===void 0&&e.defaultFilter&&(this.defaultFilter=e.defaultFilter),e.markers.forEach(s=>{const a=this.getMarkerTypeByName(s.typeName);if(a!==void 0){const h=this.markerEditors.get(a);if(h!==void 0){const o=this.addNewMarker(h,a);o.restoreState(s),this.editors.push(o)}}}),e.width&&e.height&&(e.width!==this.targetWidth||e.height!==this.targetHeight)&&this.scaleMarkers(this.targetWidth/e.width,this.targetHeight/e.height),i&&this.addUndoStep(!0),this.dispatchEvent(new CustomEvent("arearestorestate",{detail:{markerArea:this}}))}scaleMarkers(t,i){let e;e=this._currentMarkerEditor,this.setCurrentEditor(),this.editors.forEach(s=>{s!==this._currentMarkerEditor&&s.scale(t,i)}),e!==void 0&&this.setCurrentEditor(e)}adjustEditorsZoom(){this.editors.forEach(t=>{t.zoomLevel=this._zoomLevel})}toggleLogo(){c.isLicensed("MJS3E")||c.isLicensed("MJS3")?this.removeLogo():this.addLogo()}addLogo(){var t,i;this._logoUI!==void 0&&((t=this._contentContainer)===null||t===void 0||t.removeChild(this._logoUI)),this._logoUI=document.createElement("div"),this._logoUI.style.display="inline-block",this._logoUI.style.margin="0px",this._logoUI.style.padding="0px",this._logoUI.style.fill="#333333",this._logoUI.style.opacity="0.5";const e=this._logoUI;this._logoUI.addEventListener("mouseenter",()=>{e.style.opacity="1"}),this._logoUI.addEventListener("mouseleave",()=>{e.style.opacity="0.5"});const s=document.createElement("a");s.href="https://markerjs.com/?utm_source=markerjs3&utm_medium=logo&utm_content=marker_area",s.target="_blank",s.innerHTML=ht,s.title="Powered by marker.js",s.style.display="grid",s.style.alignItems="center",s.style.justifyItems="center",s.style.padding="3px",s.style.width="20px",s.style.height="20px",s.style.cursor="pointer",this._logoUI.appendChild(s),(i=this._contentContainer)===null||i===void 0||i.appendChild(this._logoUI),this._logoUI.style.position="absolute",this._logoUI.style.pointerEvents="all",this.positionLogo()}removeLogo(){this._contentContainer&&this._logoUI!==void 0&&this._contentContainer.contains(this._logoUI)&&this._contentContainer.removeChild(this._logoUI)}positionLogo(){this._logoUI&&this._contentContainer&&(this._logoUI.style.left="20px",this._logoUI.style.bottom="20px")}get isUndoPossible(){return!(!this.undoRedoManager||!this.undoRedoManager.isUndoPossible)}get isRedoPossible(){return!(!this.undoRedoManager||!this.undoRedoManager.isRedoPossible)}addUndoStep(t=!1){if(this._currentMarkerEditor===void 0||this._currentMarkerEditor.state!=="edit"){const i=this.getState(),e=this.undoRedoManager.getLastUndoStep();t||!e||e.width===i.width&&e.height===i.height?this.undoRedoManager.addUndoStep(i)&&this.dispatchEvent(new CustomEvent("areastatechange",{detail:{markerArea:this}})):(this.undoRedoManager.replaceLastUndoStep(i),this.dispatchEvent(new CustomEvent("areastatechange",{detail:{markerArea:this}})))}}undo(){this.undoStep()}undoStep(){const t=this.undoRedoManager.undo();t!==void 0&&this.restoreState(t,!1)}redo(){this.redoStep()}redoStep(){const t=this.undoRedoManager.redo();t!==void 0&&(this.restoreState(t,!1),this.dispatchEvent(new CustomEvent("areastatechange",{detail:{markerArea:this}})))}addDefs(...t){this._defs.push(...t),this._defsElement&&this._defsElement.append(...t)}addEventListener(t,i,e){super.addEventListener(t,i,e)}removeEventListener(t,i,e){super.removeEventListener(t,i,e)}}window&&window.customElements&&window.customElements.get("mjs-marker-area")===void 0&&window.customElements.define("mjs-marker-area",ut);class ct extends HTMLElement{get targetWidth(){return this._targetWidth}set targetWidth(t){this._targetWidth=t,this.setMainCanvasSize()}get targetHeight(){return this._targetHeight}set targetHeight(t){this._targetHeight=t,this.setMainCanvasSize()}get targetImage(){return this._targetImage}set targetImage(t){this._targetImage=t,this._targetImageLoaded=!1,t!==void 0&&this.addTargetImage()}get zoomLevel(){return this._zoomLevel}set zoomLevel(t){const i=this._zoomLevel;this._zoomLevel=t,this._canvasContainer&&this._contentContainer&&this._mainCanvas&&(this._panX=this._panX*t/i,this._panY=this._panY*t/i,this.applyTransform())}autoZoom(){if(!this._autoZoomIn&&!this._autoZoomOut||!this._canvasContainer||this._targetWidth<=0||this._targetHeight<=0)return;const t=this._canvasContainer.clientWidth,i=this._canvasContainer.clientHeight;if(t<=0||i<=0)return;const e=t/this._targetWidth,s=i/this._targetHeight,a=Math.min(e,s);(a>1&&this._autoZoomIn||a<1&&this._autoZoomOut)&&(this._panX=0,this._panY=0,this.zoomLevel=a)}get defaultFilter(){return this._defaultFilter}set defaultFilter(t){this._defaultFilter=t}get autoZoomIn(){return this._autoZoomIn}set autoZoomIn(t){this._autoZoomIn=t}get autoZoomOut(){return this._autoZoomOut}set autoZoomOut(t){this._autoZoomOut=t}applyTransform(){this._transformContainer&&(this._transformContainer.style.transform=`translate(${this._panX}px, ${this._panY}px) scale(${this._zoomLevel})`)}constructor(){super(),this.width=0,this.height=0,this._targetWidth=-1,this._targetHeight=-1,this._targetImageLoaded=!1,this.markerTypes=[],this.markers=[],this._zoomLevel=1,this._autoZoomIn=!1,this._autoZoomOut=!1,this._isInitialized=!1,this._defs=[],this._panX=0,this._panY=0,this.prevPanPoint={x:0,y:0},this.touchPoints=0,this.activePointers=new Map,this.isPinching=!1,this.prevPinchDistance=0,this.prevPinchMidpoint={x:0,y:0},this.markerTypes=[_,v,y,E,f,k,m,C,S,M,T,P,V,B,L,z,G,w],this.connectedCallback=this.connectedCallback.bind(this),this.disconnectedCallback=this.disconnectedCallback.bind(this),this.createLayout=this.createLayout.bind(this),this.addMainCanvas=this.addMainCanvas.bind(this),this.setMainCanvasSize=this.setMainCanvasSize.bind(this),this.setEditingTargetSize=this.setEditingTargetSize.bind(this),this.addTargetImage=this.addTargetImage.bind(this),this.attachMarkerEvents=this.attachMarkerEvents.bind(this),this.attachEvents=this.attachEvents.bind(this),this.attachWindowEvents=this.attachWindowEvents.bind(this),this.detachEvents=this.detachEvents.bind(this),this.detachWindowEvents=this.detachWindowEvents.bind(this),this.onCanvasPointerDown=this.onCanvasPointerDown.bind(this),this.onPointerMove=this.onPointerMove.bind(this),this.onPointerUp=this.onPointerUp.bind(this),this.onPointerOut=this.onPointerOut.bind(this),this.addNewMarker=this.addNewMarker.bind(this),this.show=this.show.bind(this),this.scaleMarkers=this.scaleMarkers.bind(this),this.autoZoom=this.autoZoom.bind(this),this.toggleLogo=this.toggleLogo.bind(this),this.addLogo=this.addLogo.bind(this),this.removeLogo=this.removeLogo.bind(this),this.addDefs=this.addDefs.bind(this),this.addDefaultFilterDefs=this.addDefaultFilterDefs.bind(this),this.attachShadow({mode:"open"})}connectedCallback(){this.dispatchEvent(new CustomEvent("viewinit",{detail:{markerView:this}})),c.addKeyAddListener(this.toggleLogo),this.createLayout(),this.addMainCanvas(),this.attachEvents(),this._isInitialized=!0,this.targetImage!==void 0&&this.addTargetImage(),this.setMainCanvasSize(),this.addDefaultFilterDefs(),this.toggleLogo(),this.dispatchEvent(new CustomEvent("viewshow",{detail:{markerView:this}}))}disconnectedCallback(){this.detachEvents()}createLayout(){var t;this.style.display="flex",this.style.width=this.style.width!==""?this.style.width:"100%",this.style.height=this.style.height!==""?this.style.height:"100%",this.style.position="relative",this._contentContainer=document.createElement("div"),this._contentContainer.style.display="flex",this._contentContainer.style.position="relative",this._contentContainer.style.flexGrow="2",this._contentContainer.style.flexShrink="1",this._contentContainer.style.overflow="hidden",this._canvasContainer=document.createElement("div"),this._canvasContainer.style.touchAction="none",this._canvasContainer.className="canvas-container",this._canvasContainer.style.display="flex",this._canvasContainer.style.flexGrow="2",this._canvasContainer.style.flexShrink="2",this._canvasContainer.style.justifyContent="center",this._canvasContainer.style.alignItems="center",this._canvasContainer.style.overflow="hidden",this._canvasContainer.addEventListener("wheel",i=>{i.preventDefault(),this._panX-=i.deltaX,this._panY-=i.deltaY,this.applyTransform()},{passive:!1}),this._transformContainer=document.createElement("div"),this._transformContainer.style.display="grid",this._transformContainer.style.gridTemplateColumns="1fr",this._canvasContainer.appendChild(this._transformContainer),this._contentContainer.appendChild(this._canvasContainer),(t=this.shadowRoot)===null||t===void 0||t.appendChild(this._contentContainer)}addMainCanvas(){var t,i;this.width=((t=this._contentContainer)===null||t===void 0?void 0:t.clientWidth)||0,this.height=((i=this._contentContainer)===null||i===void 0?void 0:i.clientHeight)||0,this._mainCanvas=document.createElementNS("http://www.w3.org/2000/svg","svg"),this._mainCanvas.setAttribute("xmlns","http://www.w3.org/2000/svg"),this.setMainCanvasSize(),this._mainCanvas.style.gridColumnStart="1",this._mainCanvas.style.gridRowStart="1",this._mainCanvas.style.pointerEvents="auto",this.addDefsToMainCanvas(),this._groupLayer=r.createGroup(),this._mainCanvas.appendChild(this._groupLayer),this._transformContainer.appendChild(this._mainCanvas)}addDefsToMainCanvas(){var t;this._defsElement=r.createDefs(),(t=this._mainCanvas)===null||t===void 0||t.appendChild(this._defsElement),this._defsElement.append(...this._defs)}setMainCanvasSize(){this._mainCanvas!==void 0&&this._targetHeight>0&&this._targetWidth>0&&(this._mainCanvas.style.width=`${this._targetWidth}px`,this._mainCanvas.style.height=`${this._targetHeight}px`,this._mainCanvas.setAttribute("width",`${this._targetWidth}`),this._mainCanvas.setAttribute("height",`${this._targetHeight}`),this._mainCanvas.setAttribute("viewBox","0 0 "+this._targetWidth.toString()+" "+this._targetHeight.toString()),this.setEditingTargetSize())}setEditingTargetSize(){this._editingTarget!==void 0&&(this._editingTarget.width=this._targetWidth,this._editingTarget.height=this._targetHeight,this._editingTarget.style.width=`${this._targetWidth}px`,this._editingTarget.style.height=`${this._targetHeight}px`)}addTargetImage(){this._isInitialized&&this._editingTarget===void 0&&this.targetImage!==void 0&&this._canvasContainer!==void 0&&this._mainCanvas!==void 0&&(this._editingTarget=document.createElement("img"),this._targetWidth=this._targetWidth>0?this._targetWidth:this.targetImage.clientWidth,this._targetHeight=this._targetHeight>0?this._targetHeight:this.targetImage.clientHeight,this._editingTarget.addEventListener("load",t=>{if(this._editingTarget!==void 0){if(this._targetHeight<=0||this._targetWidth<=0){const i=t.target,e=i.naturalWidth/i.naturalHeight,s=this._targetWidth>0?this._targetWidth:this._targetHeight>0?this._targetHeight*e:i.clientWidth>0?i.clientWidth:i.naturalWidth,a=this._targetHeight>0?this._targetHeight:this._targetWidth>0?this._targetWidth/e:i.clientHeight>0?i.clientHeight:i.naturalHeight;this._targetWidth=s,this._targetHeight=a}this._editingTarget.width=this._targetWidth,this._editingTarget.height=this._targetHeight,this._editingTarget.style.width=`${this._targetWidth}px`,this._editingTarget.style.height=`${this._targetHeight}px`,this._editingTarget.style.gridColumnStart="1",this._editingTarget.style.gridRowStart="1",this.setMainCanvasSize(),this._targetImageLoaded=!0,this._stateToRestore!==void 0&&this.show(this._stateToRestore)}this.zoomLevel=this._zoomLevel,this.autoZoom()}),this._editingTarget.src=this.targetImage.src,this._transformContainer.insertBefore(this._editingTarget,this._mainCanvas))}addDefaultFilterDefs(){this.addDefs(...R.getDefaultFilterSet())}addNewMarker(t){if(this._mainCanvas===void 0)throw new Error("Main canvas is not initialized.");const i=r.createGroup();this.defaultFilter&&t.applyDefaultFilter&&i.setAttribute("filter",this.defaultFilter),this._mainCanvas.appendChild(i);const e=new t(i);return this.attachMarkerEvents(e),e}attachMarkerEvents(t){t.container.addEventListener("click",()=>{this.dispatchEvent(new CustomEvent("markerclick",{detail:{marker:t,markerView:this}}))}),t.container.addEventListener("pointerover",()=>{this.dispatchEvent(new CustomEvent("markerover",{detail:{marker:t,markerView:this}}))}),t.container.addEventListener("pointerdown",()=>{this.dispatchEvent(new CustomEvent("markerpointerdown",{detail:{marker:t,markerView:this}}))}),t.container.addEventListener("pointermove",()=>{this.dispatchEvent(new CustomEvent("markerpointermove",{detail:{marker:t,markerView:this}}))}),t.container.addEventListener("pointerup",()=>{this.dispatchEvent(new CustomEvent("markerpointerup",{detail:{marker:t,markerView:this}}))}),t.container.addEventListener("pointerenter",()=>{this.dispatchEvent(new CustomEvent("markerpointerenter",{detail:{marker:t,markerView:this}}))}),t.container.addEventListener("pointerleave",()=>{this.dispatchEvent(new CustomEvent("markerpointerleave",{detail:{marker:t,markerView:this}}))})}attachEvents(){var t,i;this.hasAttribute("tabindex")||this.setAttribute("tabindex","0"),(t=this._mainCanvas)===null||t===void 0||t.addEventListener("pointerdown",this.onCanvasPointerDown),(i=this._mainCanvas)===null||i===void 0||i.addEventListener("touchmove",e=>e.preventDefault()),this.attachWindowEvents()}attachWindowEvents(){window.addEventListener("pointermove",this.onPointerMove),window.addEventListener("pointerup",this.onPointerUp),window.addEventListener("pointerleave",this.onPointerUp),window.addEventListener("pointercancel",this.onPointerOut),window.addEventListener("pointerout",this.onPointerOut)}detachEvents(){this.detachWindowEvents()}detachWindowEvents(){}onCanvasPointerDown(t){this.activePointers.set(t.pointerId,{x:t.clientX,y:t.clientY}),this.touchPoints++,this.touchPoints===1?(this.leadPointerId=t.pointerId,this.prevPanPoint={x:t.clientX,y:t.clientY},this._mainCanvas&&(this._mainCanvas.style.cursor="grabbing")):this.touchPoints===2&&(this.isPinching=!0,this.prevPinchDistance=this.getPinchDistance(),this.prevPinchMidpoint=this.getPinchMidpoint())}onPointerMove(t){if(this.activePointers.set(t.pointerId,{x:t.clientX,y:t.clientY}),this.touchPoints===2&&this.isPinching){const i=this.getPinchDistance(),e=this.getPinchMidpoint();if(this._panX+=e.x-this.prevPinchMidpoint.x,this._panY+=e.y-this.prevPinchMidpoint.y,this.prevPinchDistance>0&&this._canvasContainer){const s=i/this.prevPinchDistance,a=Math.max(.1,Math.min(10,this._zoomLevel*s)),h=a/this._zoomLevel,o=this._canvasContainer.getBoundingClientRect(),n=e.x-(o.left+o.width/2),l=e.y-(o.top+o.height/2);this._panX=n*(1-h)+this._panX*h,this._panY=l*(1-h)+this._panY*h,this._zoomLevel=a,this.applyTransform()}this.prevPinchDistance=i,this.prevPinchMidpoint=Object.assign({},e)}else this.touchPoints>0&&this.leadPointerId===t.pointerId&&this.panTo({x:t.clientX,y:t.clientY})}onPointerUp(t){this.activePointers.delete(t.pointerId),this.touchPoints>0&&(this.touchPoints--,this.touchPoints===0&&(this.leadPointerId=void 0),this._mainCanvas&&(this._mainCanvas.style.cursor="default")),this.touchPoints<2&&(this.isPinching=!1,this.prevPinchDistance=0),this.touchPoints===1&&this.activePointers.size===1&&(this.prevPanPoint=Array.from(this.activePointers.values())[0])}onPointerOut(t){this.activePointers.delete(t.pointerId),this.touchPoints>0&&this.touchPoints--}getMarkerTypeByName(t){let i;return this.markerTypes.forEach(e=>{e.typeName===t&&(i=e)}),i}registerMarkerType(t){this.markerTypes.indexOf(t)<0&&this.markerTypes.push(t)}show(t){var i;if(!this._targetImageLoaded)return void(this._stateToRestore=t);this._stateToRestore=void 0;const e=JSON.parse(JSON.stringify(t));for(this.markers.splice(0);!((i=this._mainCanvas)===null||i===void 0)&&i.lastChild;)this._mainCanvas.removeChild(this._mainCanvas.lastChild);this.addDefsToMainCanvas(),this.defaultFilter===void 0&&e.defaultFilter&&(this.defaultFilter=e.defaultFilter),e.markers.forEach(s=>{const a=this.getMarkerTypeByName(s.typeName);if(a!==void 0){const h=this.addNewMarker(a);h.restoreState(s),this.markers.push(h)}}),e.width&&e.height&&(e.width!==this.targetWidth||e.height!==this.targetHeight)&&this.scaleMarkers(this.targetWidth/e.width,this.targetHeight/e.height),this.dispatchEvent(new CustomEvent("viewrestorestate",{detail:{markerView:this}}))}scaleMarkers(t,i){this.markers.forEach(e=>{e.scale(t,i)})}panTo(t){this._panX-=this.prevPanPoint.x-t.x,this._panY-=this.prevPanPoint.y-t.y,this.applyTransform(),this.prevPanPoint=t}getPinchDistance(){const t=Array.from(this.activePointers.values());if(t.length<2)return 0;const i=t[1].x-t[0].x,e=t[1].y-t[0].y;return Math.sqrt(i*i+e*e)}getPinchMidpoint(){const t=Array.from(this.activePointers.values());return t.length<2?{x:0,y:0}:{x:(t[0].x+t[1].x)/2,y:(t[0].y+t[1].y)/2}}toggleLogo(){c.isLicensed("MJS3V")||c.isLicensed("MJS3")?this.removeLogo():this.addLogo()}addLogo(){var t,i;this._logoUI!==void 0&&((t=this._contentContainer)===null||t===void 0||t.removeChild(this._logoUI)),this._logoUI=document.createElement("div"),this._logoUI.style.display="inline-block",this._logoUI.style.margin="0px",this._logoUI.style.padding="0px",this._logoUI.style.fill="#333333",this._logoUI.style.opacity="0.5";const e=this._logoUI;this._logoUI.addEventListener("mouseenter",()=>{e.style.opacity="1"}),this._logoUI.addEventListener("mouseleave",()=>{e.style.opacity="0.5"});const s=document.createElement("a");s.href="https://markerjs.com/?utm_source=markerjs3&utm_medium=logo&utm_content=marker_view",s.target="_blank",s.innerHTML=ht,s.title="Powered by marker.js",s.style.display="grid",s.style.alignItems="center",s.style.justifyItems="center",s.style.padding="3px",s.style.width="20px",s.style.height="20px",s.style.cursor="pointer",this._logoUI.appendChild(s),(i=this._contentContainer)===null||i===void 0||i.appendChild(this._logoUI),this._logoUI.style.position="absolute",this._logoUI.style.pointerEvents="all",this.positionLogo()}removeLogo(){this._contentContainer&&this._logoUI!==void 0&&this._contentContainer.contains(this._logoUI)&&this._contentContainer.removeChild(this._logoUI)}positionLogo(){this._logoUI&&this._contentContainer&&(this._logoUI.style.left="20px",this._logoUI.style.bottom="20px")}addDefs(...t){this._defs.push(...t),this._defsElement&&this._defsElement.append(...t)}addEventListener(t,i,e){super.addEventListener(t,i,e)}removeEventListener(t,i,e){super.removeEventListener(t,i,e)}}window&&window.customElements&&window.customElements.get("mjs-marker-view")===void 0&&window.customElements.define("mjs-marker-view",ct);class gt{get targetWidth(){return this._targetWidth}set targetWidth(t){this._targetWidth=t,this.setMainCanvasSize()}get targetHeight(){return this._targetHeight}set targetHeight(t){this._targetHeight=t,this.setMainCanvasSize()}get targetImage(){return this._targetImage}set targetImage(t){this._targetImageLoaded=!1,this._targetImage=t,t!==void 0&&this.addTargetImage()}get defaultFilter(){return this._defaultFilter}set defaultFilter(t){this._defaultFilter=t}get targetImageLoadTimeout(){return this._targetImageLoadTimeout}set targetImageLoadTimeout(t){this._targetImageLoadTimeout=t}constructor(){this._targetWidth=-1,this._targetHeight=-1,this._targetImageLoaded=!1,this.markerTypes=[],this.markers=[],this._isInitialized=!1,this.naturalSize=!1,this.imageType="image/png",this.markersOnly=!1,this._targetImageLoadTimeout=1e4,this._defs=[],this.markerTypes=[_,v,y,E,f,k,m,C,S,M,T,P,V,B,L,z,G,w],this.init=this.init.bind(this),this.addMainCanvas=this.addMainCanvas.bind(this),this.setMainCanvasSize=this.setMainCanvasSize.bind(this),this.setEditingTargetSize=this.setEditingTargetSize.bind(this),this.addTargetImage=this.addTargetImage.bind(this),this.addNewMarker=this.addNewMarker.bind(this),this.restoreState=this.restoreState.bind(this),this.scaleMarkers=this.scaleMarkers.bind(this),this.addDefs=this.addDefs.bind(this),this.addDefaultFilterDefs=this.addDefaultFilterDefs.bind(this)}init(){this.addMainCanvas(),this._isInitialized=!0,this.targetImage!==void 0&&this.addTargetImage(),this.setMainCanvasSize(),this.addDefaultFilterDefs()}addMainCanvas(){this._mainCanvas=document.createElementNS("http://www.w3.org/2000/svg","svg"),this._mainCanvas.setAttribute("xmlns","http://www.w3.org/2000/svg"),this.setMainCanvasSize(),this._mainCanvas.style.gridColumnStart="1",this._mainCanvas.style.gridRowStart="1",this._mainCanvas.style.pointerEvents="auto",this._mainCanvas.style.visibility="hidden",this.addDefsToMainCanvas(),this._renderHelperContainer=document.createElement("div"),this._renderHelperContainer.style.position="absolute",this._renderHelperContainer.style.top="0px",this._renderHelperContainer.style.left="0px",this._renderHelperContainer.style.width="10px",this._renderHelperContainer.style.height="10px",this._renderHelperContainer.style.overflow="hidden",this._renderHelperContainer.style.visibility="hidden",this._renderHelperContainer.appendChild(this._mainCanvas),document.body.appendChild(this._renderHelperContainer)}addDefsToMainCanvas(){var t;this._defsElement=r.createDefs(),(t=this._mainCanvas)===null||t===void 0||t.appendChild(this._defsElement),this._defsElement.append(...this._defs)}setMainCanvasSize(){this._mainCanvas!==void 0&&this._targetHeight>0&&this._targetWidth>0&&(this._mainCanvas.style.width=`${this._targetWidth}px`,this._mainCanvas.style.height=`${this._targetHeight}px`,this._mainCanvas.setAttribute("width",`${this._targetWidth}`),this._mainCanvas.setAttribute("height",`${this._targetHeight}`),this._mainCanvas.setAttribute("viewBox","0 0 "+this._targetWidth.toString()+" "+this._targetHeight.toString()),this.setEditingTargetSize())}setEditingTargetSize(){this._editingTarget!==void 0&&(this._editingTarget.width=this._targetWidth,this._editingTarget.height=this._targetHeight,this._editingTarget.style.width=`${this._targetWidth}px`,this._editingTarget.style.height=`${this._targetHeight}px`)}addTargetImage(){var t;this._isInitialized&&this._editingTarget===void 0&&this.targetImage!==void 0&&this._mainCanvas!==void 0&&(this._editingTarget=document.createElement("img"),this._targetWidth=this._targetWidth>0?this._targetWidth:this.targetImage.clientWidth,this._targetHeight=this._targetHeight>0?this._targetHeight:this.targetImage.clientHeight,this._editingTarget.addEventListener("load",i=>{if(this._editingTarget!==void 0){if(this._targetHeight<=0||this._targetWidth<=0){const e=i.target,s=e.naturalWidth/e.naturalHeight,a=this._targetWidth>0?this._targetWidth:this._targetHeight>0?this._targetHeight*s:e.naturalWidth,h=this._targetHeight>0?this._targetHeight:this._targetWidth>0?this._targetWidth/s:e.naturalHeight;this._targetWidth=a,this._targetHeight=h}this._editingTarget.width=this._targetWidth,this._editingTarget.height=this._targetHeight,this._editingTarget.style.width=`${this._targetWidth}px`,this._editingTarget.style.height=`${this._targetHeight}px`,this._editingTarget.style.gridColumnStart="1",this._editingTarget.style.gridRowStart="1",this._targetImageLoaded=!0,this.setMainCanvasSize()}}),this._editingTarget.style.visibility="hidden",this._editingTarget.src=this.targetImage.src,(t=this._renderHelperContainer)===null||t===void 0||t.insertBefore(this._editingTarget,this._mainCanvas))}addDefaultFilterDefs(){this.addDefs(...R.getDefaultFilterSet())}addNewMarker(t){if(this._mainCanvas===void 0)throw new Error("Main canvas is not initialized.");const i=r.createGroup();return this.defaultFilter&&t.applyDefaultFilter&&i.setAttribute("filter",this.defaultFilter),this._mainCanvas.appendChild(i),new t(i)}getMarkerTypeByName(t){let i;return this.markerTypes.forEach(e=>{e.typeName===t&&(i=e)}),i}registerMarkerType(t){this.markerTypes.indexOf(t)<0&&this.markerTypes.push(t)}restoreState(t){var i;const e=JSON.parse(JSON.stringify(t));for(this.markers.splice(0);!((i=this._mainCanvas)===null||i===void 0)&&i.lastChild;)this._mainCanvas.removeChild(this._mainCanvas.lastChild);this.addDefsToMainCanvas(),this.defaultFilter===void 0&&e.defaultFilter&&(this.defaultFilter=e.defaultFilter),e.markers.forEach(s=>{const a=this.getMarkerTypeByName(s.typeName);if(a!==void 0){const h=this.addNewMarker(a);h.restoreState(s),this.markers.push(h)}}),e.width&&e.height&&(e.width!==this.targetWidth||e.height!==this.targetHeight)&&this.scaleMarkers(this.targetWidth/e.width,this.targetHeight/e.height)}scaleMarkers(t,i){this.markers.forEach(e=>{e.scale(t,i)})}rasterize(t,i){var e,s;return it(this,void 0,void 0,function*(){if(!this.naturalSize&&this.targetWidth<=0&&this.targetHeight<=0&&(this._targetWidth=t.width,this._targetHeight=t.height),this.init(),this._mainCanvas===void 0||this.targetImage===void 0)throw new Error("Not properly initialized.");let a=0;for(;!this._targetImageLoaded&&(this._targetImageLoadTimeout===0||a++<this._targetImageLoadTimeout/100);)yield new Promise(A=>setTimeout(A,100));this.restoreState(t);const h=i!==void 0?i:document.createElement("canvas");this.targetImage===null&&(this.markersOnly=!0,this.naturalSize=!1);const o=document.createElementNS("http://www.w3.org/2000/svg","svg");o.setAttribute("xmlns","http://www.w3.org/2000/svg"),o.setAttribute("width",this._mainCanvas.width.baseVal.valueAsString),o.setAttribute("height",this._mainCanvas.height.baseVal.valueAsString),o.setAttribute("viewBox","0 0 "+this._mainCanvas.viewBox.baseVal.width.toString()+" "+this._mainCanvas.viewBox.baseVal.height.toString()),yield new Promise(A=>setTimeout(A,200)),o.innerHTML=this._mainCanvas.innerHTML,this.naturalSize===!0?(o.width.baseVal.value=this.targetImage.naturalWidth,o.height.baseVal.value=this.targetImage.naturalHeight):this.width!==void 0&&this.height!==void 0&&(o.width.baseVal.value=this.width,o.height.baseVal.value=this.height),h.width=o.width.baseVal.value,h.height=o.height.baseVal.value;const n=o.outerHTML,l=h.getContext("2d");if(l===null)throw new Error("Canvas 2D context is not available.");this.markersOnly!==!0&&l.drawImage(this.targetImage,0,0,h.width,h.height);const u=window.URL,p=new Image(h.width,h.height);p.setAttribute("crossOrigin","anonymous");const x=new Blob([n],{type:"image/svg+xml"}),K=u.createObjectURL(x);let q="";for(p.onload=()=>{l.drawImage(p,0,0),u.revokeObjectURL(K),q=h.toDataURL(this.imageType,this.imageQuality)},p.src=K,a=0;!q&&a++<100;)yield new Promise(A=>setTimeout(A,100));return this._editingTarget&&((e=this._renderHelperContainer)===null||e===void 0||e.removeChild(this._editingTarget)),(s=this._renderHelperContainer)===null||s===void 0||s.removeChild(this._mainCanvas),document.body.removeChild(this._renderHelperContainer),q})}addDefs(...t){this._defs.push(...t),this._defsElement&&this._defsElement.append(...t)}}exports.Activator=c;exports.ArrowMarker=y;exports.ArrowMarkerEditor=ot;exports.CalloutMarker=M;exports.CalloutMarkerEditor=nt;exports.CaptionFrameMarker=z;exports.CaptionFrameMarkerEditor=lt;exports.CheckImageMarker=B;exports.CoverMarker=C;exports.CurveMarker=G;exports.CurveMarkerEditor=dt;exports.CustomImageMarker=V;exports.EllipseFrameMarker=T;exports.EllipseMarker=P;exports.FrameMarker=_;exports.FreehandMarker=k;exports.FreehandMarkerEditor=I;exports.Grip=Z;exports.HighlightMarker=S;exports.HighlighterMarker=w;exports.ImageMarkerBase=$;exports.ImageMarkerEditor=N;exports.LineMarker=v;exports.LinearMarkerBase=tt;exports.LinearMarkerEditor=D;exports.MarkerArea=ut;exports.MarkerBase=b;exports.MarkerBaseEditor=F;exports.MarkerView=ct;exports.MeasurementMarker=E;exports.PolygonMarker=f;exports.PolygonMarkerEditor=st;exports.RectangularBoxMarkerBase=X;exports.Renderer=gt;exports.ResizeGrip=g;exports.RotateGrip=rt;exports.ShapeMarkerBase=j;exports.ShapeMarkerEditor=O;exports.ShapeOutlineMarkerBase=W;exports.ShapeOutlineMarkerEditor=U;exports.SvgFilters=R;exports.SvgHelper=r;exports.TextBlock=et;exports.TextBlockEditor=at;exports.TextMarker=m;exports.TextMarkerEditor=Y;exports.XImageMarker=L;
+//# sourceMappingURL=markerjs3-DiaiYpgs.cjs.map