@pacem/pacem-2d 1.0.0-abel

package/dist/bundle/pacem-2d.min.mjs

@@ -0,0 +1 @@
+var Bt=Object.defineProperty;var Ze=(n,e)=>{for(var t in e)Bt(n,t,{get:e[t],enumerable:!0})};var Yt={};Ze(Yt,{Drawing:()=>gt});var gt={};Ze(gt,{AdapterUtils:()=>E,CornerType:()=>ge,DrawableElement:()=>O,Pacem2DElement:()=>A,PacemCanvasAdapterElement:()=>pt,PacemCircleElement:()=>ee,PacemEllipseElement:()=>W,PacemGroupElement:()=>ue,PacemImageElement:()=>R,PacemLineElement:()=>Se,PacemPathElement:()=>We,PacemPolygonElement:()=>re,PacemPolylineElement:()=>$e,PacemRectElement:()=>X,PacemSvgAdapterElement:()=>mt,PacemTextElement:()=>M,PresentationElement:()=>T,ShapeElement:()=>_,UiElement:()=>w,getStageOptions:()=>de});import{Components as tr,CustomElementUtils as Nt,PropertyConverters as At,Watch as Mt}from"@pacem/pacem-core";import{CustomElement as Jt,Watch as fe,ViewChild as Et,Debounce as qt,PCSS as _t,P as Ue,Utils as b,PropertyConverters as Ne,PropertyChangeEvent as Zt,CustomEventUtils as et,avoidHandler as tt,EventKeyModifier as bt,Components as Ge}from"@pacem/pacem-core";import{Rect as rt,Matrix2D as Kt}from"@pacem/pacem-foundation";var Fr=2*Math.PI;var xt={};Ze(xt,{DragEvent:()=>ne,DrawableEvent:()=>L,PresentationState:()=>be,Shape:()=>z,StageEvent:()=>Ee,UI2DEvent:()=>ae,isDrawable:()=>oe,isGroup:()=>Q,isImage:()=>pe,isLinearGradient:()=>_e,isPresentationObject:()=>we,isRadialGradient:()=>le,isShape:()=>ce,isText:()=>he,isUiObject:()=>P});import{Utils as Qe,CustomUIEvent as Ft}from"@pacem/pacem-core";import{Point as Ke,Matrix2D as vt}from"@pacem/pacem-foundation";function oe(n){return!Qe.isNull(n)&&"stage"in n}function P(n){return oe(n)}function yt(n){return"stops"in n&&Qe.isArray(n.stops)}function _e(n){return yt(n)&&"start"in n&&Ke.isPoint(n.start)&&"end"in n&&Ke.isPoint(n.end)}function le(n){return yt(n)&&"center"in n&&Ke.isPoint(n.center)&&"radius"in n&&typeof n.radius=="number"}var be=class{static combine(e,t,r=null){return{opacity:(e.opacity??1)*(t.opacity??1),transformMatrix:r??vt.multiply(t.transformMatrix,e.transformMatrix),dashArray:e.dashArray??t.dashArray,fill:e.fill??t.fill,lineCap:e.lineCap??t.lineCap,lineJoin:e.lineJoin??t.lineJoin,lineWidth:e.lineWidth??t.lineWidth,stroke:e.stroke??t.stroke}}};function we(n){return P(n)&&("fill"in n||"transformMatrix"in n||"stroke"in n||"lineJoin"in n||"dashArray"in n||"lineWidth"in n||"opacity"in n||"lineCap"in n)}function ce(n){return P(n)&&"pathData"in n}function Q(n){return P(n)&&"childDrawables"in n&&!Qe.isNullOrEmpty(n.childDrawables)}function he(n){return P(n)&&"text"in n&&typeof n.text=="string"}function pe(n){return P(n)&&"src"in n&&typeof n.src=="string"}var ae=class extends Ft{constructor(e,t,r,s){super(e,t,r),this.#e=s}#e;get transformMatrix(){return this.#e}project(e={x:this.screenX,y:this.screenY}){return vt.multiply(e,this.#e)}},z=class{static empty(){return{pathData:"",vertices:[],boundingRect:{x:0,y:0,width:0,height:0}}}},ne=class extends ae{},L=class extends ae{constructor(e,t,r,s){super(e,{detail:t,bubbles:!0,cancelable:!0},r,s)}},Ee=class extends ae{constructor(e,t,r,s=t.transformMatrix){super(e,{detail:t,bubbles:!0,cancelable:!0},r,s)}};var I=function(n,e,t,r){var s=arguments.length,i=s<3?e:r===null?r=Object.getOwnPropertyDescriptor(e,t):r,a;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")i=Reflect.decorate(n,e,t,r);else for(var o=n.length-1;o>=0;o--)(a=n[o])&&(i=(s<3?a(i):s>3?a(e,t,i):a(e,t))||i);return s>3&&i&&Object.defineProperty(e,t,i),i},Qt=/^\s*[xX]\s*([Mm](in|ax|id))\s*[yY]\s*([Mm](in|ax|id))(\s+(none|slice|meet))?\s*$/,er={convert:n=>{let e=Qt.exec(n);return e&&e.length>=4?{x:e[1].toLowerCase(),y:e[3].toLowerCase(),slice:e[6]==="slice"}:"none"},convertBack:n=>b.isNull(n)||typeof n=="string"?"none":`xM${n.x.substring(1)}YM${n.y.substring(1)} ${n.slice?"slice":"meet"}`},wt={panControl:!0,zoomControl:!0,panModifiers:[bt.AltKey],zoomModifiers:[bt.AltKey],clickModifiers:[]};function de(n){let e=n instanceof A?n.options:{};return b.extend({},wt,e)}var A=class extends Ge.PacemItemsContainerElement{constructor(){super(...arguments),this.#t=Kt.identity,this.#i=wt,this._resizeHandler=e=>{this.#r={x:e.detail.left,y:e.detail.top,width:e.detail.width,height:e.detail.height};let t=this.adapter;b.isNull(t)||this._invalidateSize()},this._zoomHandler=e=>{if(!e.isTrusted)return;let t=this.#i;if(t.zoomControl&&et.matchModifiers(e,t.zoomModifiers)){tt(e);let r=e.deltaY<0,s=.1,i=r?-1:1,a=s*i,o=1+a,l=b.offsetRect(e.currentTarget),c={x:e.clientX,y:e.clientY};this._zoom(o,l,c)}},this._panHandler=e=>{let t=this.#s,r=this._getPanPoint(e);if(!b.isNullOrEmpty(t&&t.point)&&!b.isNull(r)){tt(e);let s=t.factor,i=t.box,a=t.point;this.viewbox={x:i.x-s*(r.x-a.x),y:i.y-s*(r.y-a.y),width:i.width,height:i.height}}},this._panStartHandler=e=>{if(!this.#i.panControl||!e.isTrusted)return;let r=this.#r,s=this.viewbox||{x:0,y:0,width:r.width,height:r.height},i=this._getPanPoint(e);if(i){tt(e),this._stage.style.pointerEvents="none";let a=this._getActualAspectRatio(),o=s.width/r.width,l=s.height/r.height,c=a.slice?Math.min(o,l):Math.max(o,l);this.#s={point:i,box:s,factor:c}}},this._panEndHandler=e=>{this._stage.style.pointerEvents="",this.#s=null}}get stage(){return this._stage}snapshot(e,t,r){let s=this.adapter;return b.isNull(s)?Promise.resolve(null):s.snapshot(this,e,t,r)}#e;#t;get transformMatrix(){return this.#t}_transformMatrixScale(){let e=this.#r||b.offsetRect(this._stage);var t=this.#e||e;let r=this.viewbox||t,s=this.aspectRatio||"none",i=s==="none"?"stretch":s.slice?"cover":"contain";return rt.findTransform(r,t,i).a}validate(e){return e instanceof O&&b.isNull(e.parent)}draw(e,t=!1){let r=this.adapter;if(!this.disabled&&!b.isNull(r)){let s=new CustomEvent("predraw",{cancelable:!0});this.dispatchEvent(s),s.defaultPrevented||(r.draw(this,e,t),this.dispatchEvent(new CustomEvent("draw")))}}_drawDebounced(e,t=!1){!b.isNull(e)&&Q(e)?this.draw(e,t):this.draw(e)}requestDraw(e,t=!1){this._drawDebounced(e,t)}_buildUpDatasourceFromDOM(){this.datasource=(this.items||[]).slice()}#i;#r;_getActualAspectRatio(){let e=this.aspectRatio||"none",t=e==="none"?"mid":e.x,r=e==="none"?"mid":e.y,s=e==="none"?!1:e.slice;return{x:t,y:r,slice:s}}_zoomFromValue(e){let t=this.#r;if(b.isNull(t))return;let r=t,s=this.#e||r,i=this.viewbox||s,a=this.aspectRatio||"none",o=a==="none"?"stretch":a.slice?"cover":"contain",l=rt.findTransform(i,r,o),c=rt.findTransform(s,r,o),h=l.a,m=c.a*e,f=h/m;this._zoom(f)}_zoom(e,t,r){b.isNull(t)&&(t=b.offsetRect(this._stage)),b.isNull(r)&&(r={x:t.x+t.width*.5,y:t.y+t.height*.5});let s=this.#r,i=this.viewbox||s,a=Math.min(i.width,i.height),o=a*e,l=a*e;if(o>0&&l>0){let c=this._getActualAspectRatio(),h=c.x,p=c.y,m=c.slice,f=i.width/i.height,d=m?Math.max(t.width,t.height):Math.min(t.width,t.height),v,y;switch(h){case"mid":v=(o-i.width)*(r.x-t.x-.5*(t.width-d))/(d*f);break;case"max":v=(o-i.width)*(r.x-t.x-(t.width-d))/(d*f);break;default:v=(o-i.width)*(r.x-t.x)/(d*f);break}switch(p){case"mid":y=(l-i.height)*(r.y-t.y-.5*(t.height-d))/(d*f);break;case"max":y=(l-i.height)*(r.y-t.y-(t.height-d))/(d*f);break;default:y=(l-i.height)*(r.y-t.y)/(d*f);break}let k=i.x-v,N=i.y-y;this.viewbox={x:k,y:N,width:o,height:l}}}_getPanPoint(e){let t=this.#i;return e instanceof MouseEvent&&et.matchModifiers(e,t.panModifiers)?et.getEventCoordinates(e).page:null}#s;_invalidateSize(){this.adapter.invalidateSize(this,this.#r);let e=this.#t;this.#t=this.adapter.getTransformMatrix(this),this.dispatchEvent(new Zt({propertyName:"transformMatrix",currentValue:this.#t,oldValue:e})),this.zoom=this._transformMatrixScale(),this.dispatchEvent(new Ge.ResizeEvent(this.#r))}viewActivatedCallback(){super.viewActivatedCallback();let e=this.adapter;b.isNull(e)||(e.initialize(this),this._invalidateSize(),this._drawDebounced());let t=this._resize;t.addEventListener(Ge.ResizeEventName,this._resizeHandler,!1);let r=this._stage;t.target=r;let s={capture:!1,passive:!0};r.addEventListener("wheel",this._zoomHandler,!1),r.addEventListener("mousedown",this._panStartHandler,!1),r.addEventListener("touchstart",this._panStartHandler,s),window.addEventListener("mousemove",this._panHandler,!1),window.addEventListener("mouseup",this._panEndHandler,!1),window.addEventListener("touchmove",this._panHandler,s),window.addEventListener("touchend",this._panEndHandler,s)}propertyChangedCallback(e,t,r,s){switch(super.propertyChangedCallback(e,t,r,s),e){case"adapter":b.isNull(t)||t.dispose(this),b.isNull(r)||(r.initialize(this),this._invalidateSize(),this._drawDebounced());break;case"aspectRatio":b.isNull(this.adapter)||this._invalidateSize();break;case"viewbox":b.isNull(this.adapter)||this._invalidateSize(),this.#e??=this.viewbox||null;break;case"items":this._buildUpDatasourceFromDOM();break;case"zoom":r!==this._transformMatrixScale()&&this._zoomFromValue(r);break;case"options":this.#i=de(this);break;case"disabled":case"datasource":this._drawDebounced();break}}disconnectedCallback(){let e=this._resize,t=this._stage;b.isNull(e)||e.removeEventListener(Ge.ResizeEventName,this._resizeHandler,!1),b.isNull(t)||(t.removeEventListener("wheel",this._zoomHandler,!1),t.removeEventListener("mousedown",this._panStartHandler,!1),t.removeEventListener("touchstart",this._panStartHandler),window.removeEventListener("mousemove",this._panHandler,!1),window.removeEventListener("mouseup",this._panEndHandler,!1),window.removeEventListener("touchmove",this._panHandler),window.removeEventListener("touchend",this._panEndHandler)),b.isNull(this.adapter)||this.adapter.dispose(this),super.disconnectedCallback()}};I([fe({converter:Ne.Element})],A.prototype,"adapter",void 0);I([fe({reflectBack:!0,converter:Ne.Rect})],A.prototype,"viewbox",void 0);I([fe({emit:!1,reflectBack:!0,converter:er})],A.prototype,"aspectRatio",void 0);I([fe({emit:!1,converter:Ne.Json})],A.prototype,"datasource",void 0);I([fe({emit:!1,converter:Ne.Json})],A.prototype,"options",void 0);I([fe({converter:Ne.Number})],A.prototype,"zoom",void 0);I([Et("."+_t+"-2d")],A.prototype,"_stage",void 0);I([Et(Ue+"-resize")],A.prototype,"_resize",void 0);I([qt(!0)],A.prototype,"_drawDebounced",null);A=I([Jt({tagName:Ue+"-"+"2d",shadow:!0,template:`<${Ue}-resize watch-position="true"></${Ue}-resize><div class="${_t}-2d" part="container"></div><slot></slot>`})],A);var Dt=function(n,e,t,r){var s=arguments.length,i=s<3?e:r===null?r=Object.getOwnPropertyDescriptor(e,t):r,a;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")i=Reflect.decorate(n,e,t,r);else for(var o=n.length-1;o>=0;o--)(a=n[o])&&(i=(s<3?a(i):s>3?a(e,t,i):a(e,t))||i);return s>3&&i&&Object.defineProperty(e,t,i),i},O=class n extends tr.PacemCrossItemsContainerElement{validate(e){return!1}findContainer(){return this.parent||this.stage}get stage(){return this._scene=this._scene||Nt.findAncestorOfType(this,A)}get parent(){return this._drawableParent=this._drawableParent||Nt.findAncestor(this,e=>e instanceof n)}disconnectedCallback(){delete this._scene,delete this._drawableParent,super.disconnectedCallback()}propertyChangedCallback(e,t,r,s){super.propertyChangedCallback(e,t,r,s),s||e==="hide"&&this.stage?.draw(this)}};Dt([Mt({emit:!1,reflectBack:!0,converter:At.String})],O.prototype,"tag",void 0);Dt([Mt({emit:!1,converter:At.Boolean})],O.prototype,"inert",void 0);import{Watch as C,PropertyConverters as $,Utils as rr}from"@pacem/pacem-core";import{Matrix2D as ir}from"@pacem/pacem-foundation";var S=function(n,e,t,r){var s=arguments.length,i=s<3?e:r===null?r=Object.getOwnPropertyDescriptor(e,t):r,a;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")i=Reflect.decorate(n,e,t,r);else for(var o=n.length-1;o>=0;o--)(a=n[o])&&(i=(s<3?a(i):s>3?a(e,t,i):a(e,t))||i);return s>3&&i&&Object.defineProperty(e,t,i),i},sr=Math.PI/180,w=class extends O{#e=ir.identity;viewActivatedCallback(){super.viewActivatedCallback(),this._updateTransformMatrix()}propertyChangedCallback(e,t,r,s){if(super.propertyChangedCallback(e,t,r,s),!s)switch(e){case"rotate":case"scaleX":case"scaleY":case"translateX":case"translateY":this._updateTransformMatrix();case"opacity":this.stage?.draw(this);break}}_updateTransformMatrix(){let e=sr*(this.rotate??0),t=Math.cos(e),r=Math.sin(e),s=(this.scaleX??1)*t,i=-r,a=r,o=(this.scaleY??1)*t,l=this.translateX??0,c=this.translateY??0;this.#e={a:s,b:i,c:a,d:o,e:l,f:c}}get transformMatrix(){let e=this.#e;return{a:e.a,b:e.b,c:e.c,d:e.d,e:e.e,f:e.f}}};S([C({emit:!1,converter:$.Number})],w.prototype,"rotate",void 0);S([C({emit:!1,converter:$.Number})],w.prototype,"scaleX",void 0);S([C({emit:!1,converter:$.Number})],w.prototype,"scaleY",void 0);S([C({emit:!1,converter:$.Number})],w.prototype,"translateX",void 0);S([C({emit:!1,converter:$.Number})],w.prototype,"translateY",void 0);S([C({emit:!1,converter:$.Number})],w.prototype,"opacity",void 0);var T=class extends w{propertyChangedCallback(e,t,r,s){if(super.propertyChangedCallback(e,t,r,s),!s)switch(e){case"stroke":case"lineWidth":case"lineJoin":case"lineCap":case"dashArray":case"fill":rr.isNull(this.stage)||this.stage.draw(this);break}}};S([C({emit:!1,converter:$.String})],T.prototype,"stroke",void 0);S([C({emit:!1,converter:$.String})],T.prototype,"fill",void 0);S([C({emit:!1,converter:{convert:n=>n?.split(",").map(e=>parseInt(e)).filter(e=>!Number.isNaN(e)),convertBack:n=>n?.join(",")}})],T.prototype,"dashArray",void 0);S([C({emit:!1,converter:$.Number})],T.prototype,"lineWidth",void 0);S([C({emit:!1,converter:$.String})],T.prototype,"lineJoin",void 0);S([C({emit:!1,converter:$.String})],T.prototype,"lineCap",void 0);var _=class extends T{propertyChangedCallback(e,t,r,s){super.propertyChangedCallback(e,t,r,s),s||e==="data"&&this.stage?.draw(this)}viewActivatedCallback(){super.viewActivatedCallback(),this.recomputeShape()}recomputeShape(){let{pathData:e,vertices:t,boundingRect:r}=this.getShapeGeometry();this.#t=t,this.#e=r,this.data=e}get pathData(){return this.data}#e;get boundingRect(){return this.#e}#t;get vertices(){return this.#t}};S([C({emit:!1,converter:$.String})],_.prototype,"data",void 0);import{CustomElement as ar,Watch as nr,P as or,Utils as lr}from"@pacem/pacem-core";var Pt=function(n,e,t,r){var s=arguments.length,i=s<3?e:r===null?r=Object.getOwnPropertyDescriptor(e,t):r,a;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")i=Reflect.decorate(n,e,t,r);else for(var o=n.length-1;o>=0;o--)(a=n[o])&&(i=(s<3?a(i):s>3?a(e,t,i):a(e,t))||i);return s>3&&i&&Object.defineProperty(e,t,i),i},ue=class extends T{validate(e){return e instanceof O&&e.parent===this}#e=[];get childDrawables(){return this.#e}propertyChangedCallback(e,t,r,s){switch(super.propertyChangedCallback(e,t,r,s),e){case"items":case"datasource":this.#e=r||[];let i=this.stage;lr.isNull(i)||i.draw(this,!0);break}}};Pt([nr({emit:!1})],ue.prototype,"datasource",void 0);ue=Pt([ar({tagName:or+"-"+"2d"+"-group"})],ue);import{CustomElement as St,Watch as j,PropertyConverters as V,P as Ct,Utils as Ae}from"@pacem/pacem-core";import{Rect as De}from"@pacem/pacem-foundation";var H=function(n,e,t,r){var s=arguments.length,i=s<3?e:r===null?r=Object.getOwnPropertyDescriptor(e,t):r,a;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")i=Reflect.decorate(n,e,t,r);else for(var o=n.length-1;o>=0;o--)(a=n[o])&&(i=(s<3?a(i):s>3?a(e,t,i):a(e,t))||i);return s>3&&i&&Object.defineProperty(e,t,i),i},it,st;function cr(n,e,t){let r=2*e,s=n.x,i=n.y;return{pathData:`M ${s} ${i} m ${-e},0 a ${e},${t} 0 1,1 ${r},0 a ${e},${t} 0 1,1 ${-r},0`,vertices:[],boundingRect:{x:s-e,y:i-t,width:2*e,height:2*t}}}function hr(n,e,t,r,s){let i=Math.PI/180,a=i*r,o=i*s,l=N=>e*t/Math.sqrt(Math.pow(Math.cos(N)*t,2)+Math.pow(Math.sin(N)*e,2)),c=l(a),h=l(o),p=(N,U)=>({x:N*Math.cos(U),y:N*Math.sin(U)}),m=p(c,a),f=p(h,o),d={x:n.x+m.x,y:n.y+m.y},v={x:n.x+f.x,y:n.y+f.y},y=De.expand(n,d,v);s<r&&(s+=360),(r<=0&&s>0||s>=360)&&(y=De.expand(y,{x:n.x+e,y:n.y})),(r<=90&&s>90||s>=450)&&(y=De.expand(y,{x:n.x,y:n.y+t})),(r<=180&&s>180||s>=540)&&(y=De.expand(y,{x:n.x-e,y:n.y})),(r<=270&&s>270||s>=630)&&(y=De.expand(y,{x:n.x,y:n.y-t}));let k=o-a>Math.PI?"1":"0";return{pathData:`M ${d.x} ${d.y} A ${e},${t} 0 ${k},1 ${v.x},${v.y} L ${n.x},${n.y} Z`,vertices:[d,v],boundingRect:y}}function at(n,e,t,r,s){for(r??=0,s??=0,r%=360,s%=360;r<0;)r+=360;for(;s<r;)s+=360;return(r-s).isCloseTo(0)?cr(n,e,t):hr(n,e,t,r,s)}var W=it=class extends _{propertyChangedCallback(e,t,r,s){if(super.propertyChangedCallback(e,t,r,s),!s)switch(e){case"center":case"rx":case"ry":case"start":case"end":this.recomputeShape();break}}getPathData(){let e=this.rx,t=this.ry,r=this.center,s=this.start??0,i=this.end??0;return!Ae.isNull(r)&&!Ae.isNull(e)&&!Ae.isNull(t)?it.getPathData(r,e,t,s,i):null}getShapeGeometry(){let e=this.center??{x:0,y:0},t=this.rx??0,r=this.ry??0;return at(e,t,r,this.start,this.end)}static getPathData(e={x:NaN,y:NaN},t=NaN,r=NaN,s,i){let{pathData:a}=at(e,t,r,s,i);return a}};H([j({emit:!1,converter:V.Point})],W.prototype,"center",void 0);H([j({emit:!1,converter:V.Number})],W.prototype,"rx",void 0);H([j({emit:!1,converter:V.Number})],W.prototype,"ry",void 0);H([j({emit:!1,converter:V.Number})],W.prototype,"start",void 0);H([j({emit:!1,converter:V.Number})],W.prototype,"end",void 0);W=it=H([St({tagName:Ct+"-"+"2d"+"-ellipse"})],W);var ee=st=class extends _{propertyChangedCallback(e,t,r,s){if(super.propertyChangedCallback(e,t,r,s),!s)switch(e){case"center":case"radius":case"start":case"end":this.recomputeShape();break}}getPathData(){let e=this.radius,t=this.center;return!Ae.isNull(t)&&!Ae.isNull(e)?st.getPathData(t,e,this.start,this.end):null}getShapeGeometry(){let e=this.center??{x:0,y:0},t=this.radius??0;return at(e,t,t,this.start,this.end)}static getPathData(e={x:NaN,y:NaN},t=NaN,r,s){return W.getPathData(e,t,t,r,s)}};H([j({emit:!1,converter:V.Point})],ee.prototype,"center",void 0);H([j({emit:!1,converter:V.Number})],ee.prototype,"radius",void 0);H([j({emit:!1,converter:V.Number})],ee.prototype,"start",void 0);H([j({emit:!1,converter:V.Number})],ee.prototype,"end",void 0);ee=st=H([St({tagName:Ct+"-"+"2d"+"-circle"})],ee);import{CustomElement as pr,Watch as ve,PropertyConverters as Pe,P as fr,Utils as me}from"@pacem/pacem-core";var te=function(n,e,t,r){var s=arguments.length,i=s<3?e:r===null?r=Object.getOwnPropertyDescriptor(e,t):r,a;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")i=Reflect.decorate(n,e,t,r);else for(var o=n.length-1;o>=0;o--)(a=n[o])&&(i=(s<3?a(i):s>3?a(e,t,i):a(e,t))||i);return s>3&&i&&Object.defineProperty(e,t,i),i},nt;function Me(n){let e=n[2],t=n[4]??e,r=n[6]==="cut"?ge.Cut:ge.Rounded;return{rx:Tt(e),ry:Tt(t),type:r}}function Tt(n){return{value:parseFloat(n),unit:n.endsWith("%")?"pct":"u"}}function J(n){return`${n.value}${n.unit==="pct"?"%":""}`}var dr=/(([\d\.]+%?)(\s*,?\s*([\d\.]+%?))?(\s+(cut|round))?)/g;function ur(n){let e,t=[];for(;e=dr.exec(n);)t.push(e);switch(t.length){case 1:let r=Me(t[0]);return[r,r,r,r];case 4:let s=Me(t[0]),i=Me(t[1]),a=Me(t[2]),o=Me(t[3]);return[s,i,a,o];default:return null}}function mr(n){let e=n[0],t=n[1],r=n[2],s=n[3],i=J(e.rx),a=J(e.ry),o=J(t.rx),l=J(t.ry),c=J(r.rx),h=J(r.ry),p=J(s.rx),m=J(s.ry);return`${i},${a} ${o},${l} ${c},${h} ${p},${m}`}var ge;(function(n){n.Rounded="rounded",n.Cut="cut"})(ge||(ge={}));var X=nt=class extends _{propertyChangedCallback(e,t,r,s){super.propertyChangedCallback(e,t,r,s),!s&&(e==="x"||e==="y"||e==="w"||e==="h"||e==="r"||e==="cornerType")&&this.recomputeShape()}getPathData(){let e=this.x,t=this.y,r=this.w,s=this.h,i=this.r??{rx:{value:0},ry:{value:0},type:ge.Rounded};return me.isArray(i)||(i=[i,i,i,i]),i=i.map(a=>typeof a=="number"?{rx:{value:a},ry:{value:a},type:this.cornerType}:a),!me.isNull(e)&&!me.isNull(t)&&!me.isNull(r)&&!me.isNull(s)?nt.getPathData(e,t,r,s,i):null}getShapeGeometry(){let e=this.x,t=this.y,r=e+this.w,s=t+this.h;return{pathData:this.getPathData(),vertices:[{x:e,y:t},{x:r,y:t},{x:r,y:s},{x:e,y:s}],boundingRect:{x:e,y:t,width:this.w,height:this.h}}}static getPathData(e=NaN,t=NaN,r=NaN,s=NaN,i=null){if(!i)return`M ${e} ${t} h ${r} v ${s} h ${-r} z`;me.isArray(i)||(i=[i,i,i,i]);let a=i[0],o=i[1],l=i[2],c=i[3],h=K=>K.unit==="pct"?K.value*.01*r:K.value,p=K=>K.unit==="pct"?K.value*.01*s:K.value,m=h(a.rx),f=p(a.ry),d=h(o.rx),v=p(o.ry),y=h(l.rx),k=p(l.ry),N=h(c.rx),U=p(c.ry),D=`M ${e},${t+f}`;return a.type==="cut"?D+=` l ${m},${-f}`:D+=` a ${m} ${f} 0 0 1 ${m} ${-f}`,D+=` h ${r-m-d}`,o.type==="cut"?D+=` l ${d},${v}`:D+=` a ${d} ${v} 0 0 1 ${d} ${v}`,D+=` v ${s-v-k}`,l.type==="cut"?D+=` l ${-y},${k}`:D+=` a ${y} ${k} 0 0 1 ${-y} ${k}`,D+=` h ${-(r-y-N)}`,c.type==="cut"?D+=` l ${-N},${-U}`:D+=` a ${N} ${U} 0 0 1 ${-N} ${-U}`,D+" z"}};te([ve({emit:!1,converter:Pe.Number})],X.prototype,"x",void 0);te([ve({emit:!1,converter:Pe.Number})],X.prototype,"y",void 0);te([ve({emit:!1,converter:Pe.Number})],X.prototype,"w",void 0);te([ve({emit:!1,converter:Pe.Number})],X.prototype,"h",void 0);te([ve({emit:!1,converter:{convert:n=>ur(n),convertBack:n=>mr(n)}})],X.prototype,"r",void 0);te([ve({emit:!1,converter:Pe.String})],X.prototype,"cornerType",void 0);X=nt=te([pr({tagName:fr+"-"+"2d"+"-rect"})],X);import{CustomElement as gr,Watch as $t,PropertyConverters as Rt,P as vr,Utils as ze}from"@pacem/pacem-core";var lt=function(n,e,t,r){var s=arguments.length,i=s<3?e:r===null?r=Object.getOwnPropertyDescriptor(e,t):r,a;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")i=Reflect.decorate(n,e,t,r);else for(var o=n.length-1;o>=0;o--)(a=n[o])&&(i=(s<3?a(i):s>3?a(e,t,i):a(e,t))||i);return s>3&&i&&Object.defineProperty(e,t,i),i},ot,Se=ot=class extends _{propertyChangedCallback(e,t,r,s){if(super.propertyChangedCallback(e,t,r,s),!s)switch(e){case"from":case"to":this.recomputeShape();break}}getShapeGeometry(){let e=this.from,t=this.to;if(ze.isNull(e)||ze.isNull(t))return z.empty();let r=e.x,s=e.y,i=t.x,a=t.y,o={x:Math.min(r,i),y:Math.min(s,a),width:Math.abs(r-i),height:Math.abs(s-a)};return{pathData:this.getPathData(),vertices:[e,t],boundingRect:o}}getPathData(){let e=this.from,t=this.to;return!ze.isNull(e)&&!ze.isNull(t)?ot.getPathData(e,t):null}static getPathData(e={x:NaN,y:NaN},t={x:NaN,y:NaN}){let r=e.x,s=e.y,i=t.x,a=t.y;return`M ${r} ${s} L ${i} ${a}`}};lt([$t({emit:!1,converter:Rt.Point})],Se.prototype,"from",void 0);lt([$t({emit:!1,converter:Rt.Point})],Se.prototype,"to",void 0);Se=ot=lt([gr({tagName:vr+"-"+"2d"+"-line"})],Se);import{CustomElement as yr,Watch as xr,PropertyConverters as br,P as Er}from"@pacem/pacem-core";var kt=function(n,e,t,r){var s=arguments.length,i=s<3?e:r===null?r=Object.getOwnPropertyDescriptor(e,t):r,a;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")i=Reflect.decorate(n,e,t,r);else for(var o=n.length-1;o>=0;o--)(a=n[o])&&(i=(s<3?a(i):s>3?a(e,t,i):a(e,t))||i);return s>3&&i&&Object.defineProperty(e,t,i),i},We=class extends _{constructor(){super(...arguments),this.getPathData=()=>this.d}propertyChangedCallback(e,t,r,s){super.propertyChangedCallback(e,t,r,s),e==="d"&&!s&&this.recomputeShape()}getShapeGeometry(){return{pathData:this.getPathData(),boundingRect:null,vertices:[]}}};kt([xr({emit:!1,converter:br.String})],We.prototype,"d",void 0);We=kt([yr({tagName:Er+"-"+"2d"+"-path"})],We);import{CustomElement as _r,Watch as je,PropertyConverters as Ve,P as wr,Utils as Lt}from"@pacem/pacem-core";var Te=function(n,e,t,r){var s=arguments.length,i=s<3?e:r===null?r=Object.getOwnPropertyDescriptor(e,t):r,a;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")i=Reflect.decorate(n,e,t,r);else for(var o=n.length-1;o>=0;o--)(a=n[o])&&(i=(s<3?a(i):s>3?a(e,t,i):a(e,t))||i);return s>3&&i&&Object.defineProperty(e,t,i),i},Ce,re=Ce=class extends _{propertyChangedCallback(e,t,r,s){if(super.propertyChangedCallback(e,t,r,s),!s)switch(e){case"radius":case"starIndent":case"sides":this.recomputeShape();break}}getPathData(){let e=this.sides,t=this.radius,r=this.center;return!Lt.isNull(e)&&!Lt.isNull(t)?Ce.getPathData(r,t,e,this.starIndent):null}getShapeGeometry(){let e=this.center??{x:0,y:0},t=this.radius??0,r=this.sides??3,s=this.starIndent;return r<3?z.empty():Ce.getShapeGeometry(e,t,r,s)}static getShapeGeometry(e,t,r,s=0){let i={x:e.x,y:e.y-t},a=`M ${i.x} ${i.y}`,o=[i],l=2*Math.PI/r,c=.5*l,h=s>0,p=t*Math.cos(c);for(let f=1;f<r;f++){let d=f*l,v=e.x+Math.sin(d)*t,y=e.y-Math.cos(d)*t;if(h){let k=p*(1-s),N=d-c,U=e.x+Math.sin(N)*k,D=e.y-Math.cos(N)*k;a+=` L ${U} ${D} L ${v} ${y}`,o.push({x:U,y:D})}else a+=` L ${v} ${y}`;o.push({x:v,y})}if(h){let f=p*(1-s),d=2*Math.PI-c,v=e.x+Math.sin(d)*f,y=e.y-Math.cos(d)*f;a+=` L ${v} ${y}`,o.push({x:v,y})}o.push(i);let m=t*2;return{pathData:a+" Z",vertices:o,boundingRect:{x:i.x-t,y:i.y,width:m,height:m}}}static getPathData(e,t,r,s=0){let{pathData:i}=Ce.getShapeGeometry(e,t,r,s);return i}};Te([je({emit:!1,converter:Ve.Number})],re.prototype,"sides",void 0);Te([je({emit:!1,converter:Ve.Number})],re.prototype,"radius",void 0);Te([je({emit:!1,converter:Ve.Point})],re.prototype,"center",void 0);Te([je({emit:!1,converter:Ve.Number})],re.prototype,"starIndent",void 0);re=Ce=Te([_r({tagName:wr+"-"+"2d"+"-polygon"})],re);import{CustomElement as Nr,Watch as Ot,PropertyConverters as Dr,P as Ar,Utils as Mr}from"@pacem/pacem-core";import{parseAsNumericalArray as Pr}from"@pacem/pacem-foundation";var ct=function(n,e,t,r){var s=arguments.length,i=s<3?e:r===null?r=Object.getOwnPropertyDescriptor(e,t):r,a;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")i=Reflect.decorate(n,e,t,r);else for(var o=n.length-1;o>=0;o--)(a=n[o])&&(i=(s<3?a(i):s>3?a(e,t,i):a(e,t))||i);return s>3&&i&&Object.defineProperty(e,t,i),i},Xe,Sr={convert:n=>{let e=Pr(n);if(e.length%2===0){let t=[];for(let r=0;r<e.length;r+=2)t.push({x:e[r],y:e[r+1]});return t}return JSON.parse(n)},convertBack:n=>JSON.stringify(n)},$e=Xe=class extends _{propertyChangedCallback(e,t,r,s){if(super.propertyChangedCallback(e,t,r,s),!s)switch(e){case"points":case"closed":this.recomputeShape();break}}static getShapeGeometry(e,t){if(Mr.isNullOrEmpty(e))return z.empty();let r="",s=Number.MAX_VALUE,i=Number.MAX_VALUE,a=Number.MIN_VALUE,o=Number.MIN_VALUE;for(let c=0;c<e.length;c++){let{x:h,y:p}=e[c];r+=`${c===0?"M":"L"} ${h} ${p} `,s=Math.min(s,h),a=Math.max(a,h),i=Math.min(i,p),o=Math.max(o,p)}let l={x:s,y:i,width:a-s,height:o-i};return t&&(r+="Z"),{pathData:r,vertices:e,boundingRect:l}}getShapeGeometry(){return Xe.getShapeGeometry(this.points,this.closed)}getPathData(){let{pathData:e}=this.getShapeGeometry();return e}static getPathData(e,t){let{pathData:r}=Xe.getShapeGeometry(e,t);return r}};ct([Ot({emit:!1,converter:Sr})],$e.prototype,"points",void 0);ct([Ot({emit:!1,converter:Dr.Boolean})],$e.prototype,"closed",void 0);$e=Xe=ct([Nr({tagName:Ar+"-"+"2d"+"-polyline"})],$e);import{CustomElement as Cr,Watch as Re,PropertyConverters as ke,P as Tr}from"@pacem/pacem-core";var ye=function(n,e,t,r){var s=arguments.length,i=s<3?e:r===null?r=Object.getOwnPropertyDescriptor(e,t):r,a;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")i=Reflect.decorate(n,e,t,r);else for(var o=n.length-1;o>=0;o--)(a=n[o])&&(i=(s<3?a(i):s>3?a(e,t,i):a(e,t))||i);return s>3&&i&&Object.defineProperty(e,t,i),i},R=class extends w{propertyChangedCallback(e,t,r,s){if(super.propertyChangedCallback(e,t,r,s),!s)switch(e){case"src":case"x":case"y":case"width":case"height":this.stage?.draw(this);break}}};ye([Re({emit:!1,converter:ke.String})],R.prototype,"src",void 0);ye([Re({emit:!1,converter:ke.Number})],R.prototype,"x",void 0);ye([Re({emit:!1,converter:ke.Number})],R.prototype,"y",void 0);ye([Re({emit:!1,converter:ke.Number})],R.prototype,"width",void 0);ye([Re({emit:!1,converter:ke.Number})],R.prototype,"height",void 0);R=ye([Cr({tagName:Tr+"-"+"2d"+"-image"})],R);import{CustomElement as $r,Watch as q,PropertyConverters as Z,P as Rr,Utils as kr}from"@pacem/pacem-core";var Y=function(n,e,t,r){var s=arguments.length,i=s<3?e:r===null?r=Object.getOwnPropertyDescriptor(e,t):r,a;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")i=Reflect.decorate(n,e,t,r);else for(var o=n.length-1;o>=0;o--)(a=n[o])&&(i=(s<3?a(i):s>3?a(e,t,i):a(e,t))||i);return s>3&&i&&Object.defineProperty(e,t,i),i},M=class extends w{propertyChangedCallback(e,t,r,s){if(!s)switch(e){case"text":case"color":case"fontFamily":case"fontSize":case"fontWeight":case"fontStyle":case"anchor":kr.isNull(this.stage)||this.stage.draw(this);break}}};Y([q({emit:!1,converter:Z.String})],M.prototype,"text",void 0);Y([q({emit:!1,converter:Z.String})],M.prototype,"color",void 0);Y([q({emit:!1,converter:Z.String})],M.prototype,"fontFamily",void 0);Y([q({emit:!1,converter:Z.Number})],M.prototype,"fontSize",void 0);Y([q({emit:!1,converter:Z.String})],M.prototype,"fontWeight",void 0);Y([q({emit:!1,converter:Z.String})],M.prototype,"fontStyle",void 0);Y([q({emit:!1,converter:Z.Point})],M.prototype,"anchor",void 0);Y([q({emit:!1,converter:Z.String})],M.prototype,"textAnchor",void 0);M=Y([$r({tagName:Rr+"-"+"2d"+"-text"})],M);import{Utils as Ht,UI as Ye}from"@pacem/pacem-core";import{Rect as Lr}from"@pacem/pacem-foundation";var E=class{static stageDispatch(e,t,r){e instanceof EventTarget&&e.dispatchEvent(new Ee("stage"+t,e,r,e.transformMatrix))}static isValidViewbox(e){return!Ht.isNullOrEmpty(e)&&Lr.isRect(e)&&Number.isFinite(e.x)&&Number.isFinite(e.y)&&Number.isFinite(e.width)&&Number.isFinite(e.height)}static itemDispatch(e,t,r){if(Ht.isNull(e?.stage))return!1;var s,i,a;r instanceof Event?i=r:s={item:e,offset:r},typeof t=="string"?a=t:(a=t.type,i=t.originalEvent);let o=e.stage.transformMatrix,l=()=>r instanceof Event?new L(a,e,i,o):new ne(a,{detail:s,cancelable:a===Ye.DragDropEventType.Init||a===Ye.DragDropEventType.Drag},i,o),c=r instanceof Event?new L("item"+a,e,i,o):new ne("item"+a,{detail:s,cancelable:a===Ye.DragDropEventType.Init||a===Ye.DragDropEventType.Drag},i,o);var h=!1;if(e instanceof EventTarget){let p=l();e.dispatchEvent(p),h=p.defaultPrevented}return e.stage.dispatchEvent(c),h||c.defaultPrevented}};import{CustomElement as Gr,P as Ut,CustomElementUtils as ft,Utils as g,Logging as Ur,CustomEventUtils as ht,UI as B,avoidHandler as zr}from"@pacem/pacem-core";import{Matrix2D as F,Rect as Wr}from"@pacem/pacem-foundation";import{PacemEventTarget as Or,Utils as It}from"@pacem/pacem-core";var Hr=.9,xe=class extends Or{constructor(){super(...arguments),this.DefaultShapeValues={stroke:"#000",lineWidth:1,fill:"#fff"}}snapshotElement(e,t,r,s){let i=!It.isNullOrEmpty(t),a=r??(i?"image/jpeg":null),o=s??(i?Hr:null);return It.snapshotElement(e,t,a,o)}};var Ir=function(n,e,t,r){var s=arguments.length,i=s<3?e:r===null?r=Object.getOwnPropertyDescriptor(e,t):r,a;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")i=Reflect.decorate(n,e,t,r);else for(var o=n.length-1;o>=0;o--)(a=n[o])&&(i=(s<3?a(i):s>3?a(e,t,i):a(e,t))||i);return s>3&&i&&Object.defineProperty(e,t,i),i},Be="pacem:2d-canvas-scene",Gt="pacem:2d-parent-matrix",jr="pacem:2d-world-matrix",Fe=ft.setAttachedPropertyValue,Le=ft.getAttachedPropertyValue;function ie(n){return n==="none"||g.isNullOrEmpty(n)}function Oe(n,e){return g.isNull(n)?e:n}var pt=class extends xe{constructor(){super(...arguments),this._pointer={page:{x:Number.NaN,y:Number.NaN},screen:{x:Number.NaN,y:Number.NaN},client:{x:Number.NaN,y:Number.NaN}},this._dragInitHandler=e=>{let t=this._hitTarget;if(g.isNull(t)||!P(t)||!t.draggable){e.preventDefault();return}let r=e.detail,s=t,i=t.transformMatrix??F.identity,a=Le(t,Gt,F.identity);r.data={item:s,initialTransformMatrix:i,parentMatrix:a},E.itemDispatch(s,e,{x:0,y:0})&&e.preventDefault()},this._draggingHandler=e=>{zr(e),this._dragging=!0;let t=e.detail,r=t.data,s={x:t.currentPosition.x-t.origin.x,y:t.currentPosition.y-t.origin.y},i={x:s.x*r.parentMatrix.a+r.initialTransformMatrix.e,y:s.y*r.parentMatrix.d+r.initialTransformMatrix.f},a=r.item.stage.transformMatrix;if(!E.itemDispatch(r.item,e,{x:s.x*a.a+a.e,y:s.y*a.d+a.f}))if(r.item instanceof w)r.item.translateX=i.x,r.item.translateY=i.y;else{let l=r.initialTransformMatrix,c={a:l.a,b:l.b,c:l.c,d:l.d,e:i.x,f:i.y};g.extend(r.item,{transformMatrix:c})}},this._dragEndHandler=e=>{this._dragging=!1;let t=e.detail,r=t.data,s=r.item.transformMatrix;E.itemDispatch(r.item,e,{x:s.e,y:s.f})},this._mouseleaveHandler=e=>{if(this._dragging)return;let t=this._hitTarget;if(g.isNull(t))return;this._scopeEvent=e;let r={x:Number.NaN,y:Number.NaN};this._pointer={page:r,screen:r,client:r};let s=e.srcElement,i=Le(s,Be);this._requestDraw(i)},this._mousemoveHandler=e=>{this._scopeEvent=e,this._pointer=ht.getEventCoordinates(e);let t=e.srcElement,r=Le(t,Be);this._requestDraw(r),this._dragging||g.isNull(this._hitTarget)||E.stageDispatch(r,"move",e)},this._mouseDownUpHandler=e=>{this._scopeEvent=e,this._pointer=ht.getEventCoordinates(e);let t=e.target;if(t instanceof HTMLCanvasElement){let r=Le(t,Be),s=this._hitTarget,i=e.type.replace(/^(mouse|touch)/,""),a=i==="end"?"click":i,o=de(r);ht.matchModifiers(e,o.clickModifiers)&&(!g.isNull(s)&&s.stage===r?E.itemDispatch(s,a,e):E.stageDispatch(r,a,e))}},this._scenes=new WeakMap,this._handles=new WeakMap}snapshot(e,t,r,s){let i=this._scenes;if(i.has(e)){let a=i.get(e).context,o=a.canvas;return this.snapshotElement(o,t,r,s)}else return Promise.resolve(null)}getCanvas(e){let t=this._scenes;return t.has(e)?t.get(e).context.canvas:null}_getScreenInverseMatrix(e,t){return F.invert({a:e.a,b:e.b,c:e.c,d:e.d,e:e.e+t.x,f:e.f+t.y})}getTransformMatrix(e){let t=this._scenes;return t.has(e)?t.get(e).screenInverseMatrix:F.identity}#e;viewActivatedCallback(){super.viewActivatedCallback();let e=this.#e=document.createElement(Ut+"-drag-drop");e.mode=B.DragDataMode.Copy,e.dropBehavior=B.DropBehavior.None,e.spillBehavior=B.DropTargetMissedBehavior.None;let t=document.createElement("div");t.hidden=!0,e.floater=t,ft.findAncestorShell(this).appendChild(e),e.addEventListener(B.DragDropEventType.Init,this._dragInitHandler,!1),e.addEventListener(B.DragDropEventType.Drag,this._draggingHandler,!1),e.addEventListener(B.DragDropEventType.End,this._dragEndHandler,!1)}disconnectedCallback(){let e=this.#e;g.isNull(e)||(e.removeEventListener(B.DragDropEventType.Init,this._dragInitHandler,!1),e.removeEventListener(B.DragDropEventType.Drag,this._draggingHandler,!1),e.removeEventListener(B.DragDropEventType.End,this._dragEndHandler,!1),e.remove()),super.disconnectedCallback()}invalidateSize(e,t){let r=this._scenes;if(!g.isNull(e)&&!g.isNullOrEmpty(t)&&r.has(e)){let s=r.get(e),i=s.context;i.canvas.width=t.width,i.canvas.height=t.height;let a=s.offset=g.offsetRect(i.canvas),o={x:0,y:0,width:t.width,height:t.height},l=e.aspectRatio,c=e.viewbox;if(E.isValidViewbox(c)){let h="contain",p="center",m="middle";if(typeof l=="object"){switch(h=l.slice?"cover":"contain",l.x){case"min":p="left";break;case"max":p="right";break}switch(l.y){case"min":m="top";break;case"max":m="bottom";break}}let f=Wr.findTransform({x:0,y:0,width:c.width,height:c.height},o,h,p,m),d=F.translate(f,{x:-f.a*c.x,y:-f.a*c.y});s.transformMatrix=d,s.screenInverseMatrix=this._getScreenInverseMatrix(d,a)}else s.transformMatrix=F.identity}this._requestDraw(e)}getHitTarget(e){let t=this._hitTarget;return!g.isNull(t)&&t.stage===e?t:null}initialize(e){if(g.isNull(e))throw"Provided scene is null or undefined.";let t=this._scenes,r=this.#e;if(t.has(e)){let o=t.get(e).context.canvas;return g.isNull(r)||r.register(o),o}let s=e.stage;s.innerHTML="";let i=document.createElement("canvas");i.setAttribute("part","stage"),Fe(i,Be,e);let a=i.getContext("2d");return i.addEventListener("mousemove",this._mousemoveHandler,!1),i.addEventListener("mouseleave",this._mouseleaveHandler,!1),i.addEventListener("touchstart",this._mouseDownUpHandler,{passive:!0}),i.addEventListener("touchmove",this._mouseDownUpHandler,{passive:!0}),i.addEventListener("touchend",this._mouseDownUpHandler,{passive:!0}),i.addEventListener("click",this._mouseDownUpHandler,!1),i.addEventListener("mousedown",this._mouseDownUpHandler,!1),i.addEventListener("mouseup",this._mouseDownUpHandler,!1),s.appendChild(i),t.set(e,{context:a,transformMatrix:F.identity,offset:g.offsetRect(i),screenInverseMatrix:F.identity}),g.isNull(r)||r.register(i),i}dispose(e){let t=this._scenes;if(t.has(e)){var r=t.get(e),s=r.context,i=s.canvas;let a=this.#e;g.isNull(a)||a.unregister(i),i.removeEventListener("click",this._mouseDownUpHandler,!1),i.removeEventListener("touchend",this._mouseDownUpHandler,!1),i.removeEventListener("mousedown",this._mouseDownUpHandler,!1),i.removeEventListener("mouseup",this._mouseDownUpHandler,!1),i.removeEventListener("touchstart",this._mouseDownUpHandler),i.removeEventListener("mouseleave",this._mouseleaveHandler,!1),i.removeEventListener("mousemove",this._mousemoveHandler,!1),i.remove(),t.delete(e)}}_requestDraw(e){let t=this._handles;t.has(e)&&cancelAnimationFrame(t.get(e));let r=()=>(this.draw(e),requestAnimationFrame(()=>{}));t.set(e,r())}#t;draw(e){let t=this._scenes,r=this._handles;if(!g.isNull(e)){if(e.adapter!==this){t.has(e)&&(t.delete(e),r.get(e));return}if(!t.has(e)){this.initialize(e);return}r.has(e)&&cancelAnimationFrame(r.get(e));let s=this._hitTarget,i=e.datasource||[];this._hitTarget=null;let a=t.get(e),o=a.context,l=o.canvas;this.#t=getComputedStyle(l),o.resetTransform(),o.clearRect(0,0,l.width,l.height);let c=a.transformMatrix;o.setTransform(c);let h=this._pointer,p=a.offset,m=Number.isNaN(h.page.x)||Number.isNaN(h.page.y)?null:{x:h.page.x-p.x,y:h.page.y-p.y};for(let d of i)this._draw(e,o,d,{transformMatrix:c},m);let f=this._hitTarget;f!=s&&(g.isNull(s)||(s instanceof Element&&s.dispatchEvent(new L("out",s,this._scopeEvent,c)),e.dispatchEvent(new L("itemout",s,this._scopeEvent,c))),g.isNull(f)||(f instanceof Element&&f.dispatchEvent(new L("over",f,this._scopeEvent,c)),e.dispatchEvent(new L("itemover",f,this._scopeEvent,c))))}}_draw(e,t,r,s,i){if(r.stage??=e,oe(r)&&r.hide)return;P(r)&&r.draggable&&!r.hide&&!r.inert&&Fe(r,Gt,t.getTransform().inverse());let a;P(r)&&(a=r.transformMatrix,!g.isNull(a)&&!F.isIdentity(a)&&t.transform(a.a,a.b,a.c,a.d,a.e,a.f));let o=s;if(we(r)&&(o=be.combine(r,s,t.getTransform()),this._setPresentationState(t,o)),ce(r)||r instanceof _)this._drawShape(t,r,i);else if(he(r)||r instanceof M)this._drawText(t,r,i);else if(pe(r)||r instanceof R)this._drawImage(t,r,i);else if(Q(r)||r instanceof ue)for(let l of r.childDrawables||[])this._draw(e,t,l,o,i);P(r)&&r.draggable&&!r.hide&&!r.inert&&Fe(r,jr,t.getTransform().inverse()),this._setPresentationState(t,s)}_setPresentationState(e,t){if(e.setTransform(t.transformMatrix),!g.isNullOrEmpty(t.stroke)&&!ie(t.stroke)?e.strokeStyle=t.stroke:e.strokeStyle="transparent",g.isNullOrEmpty(t.lineWidth)?e.lineWidth=0:e.lineWidth=t.lineWidth,g.isNullOrEmpty(t.dashArray)?e.setLineDash([]):e.setLineDash(t.dashArray),g.isNullOrEmpty(t.lineCap)?e.lineCap="butt":e.lineCap=t.lineCap,g.isNullOrEmpty(t.lineJoin)?e.lineJoin="miter":e.lineJoin=t.lineJoin,typeof t.fill=="object"&&!g.isNullOrEmpty(t.fill)){let{stops:r}=t.fill,s;if(_e(t.fill)){let{start:i,end:a}=t.fill;s=e.createLinearGradient(i.x,i.y,a.x,a.y)}else if(le(t.fill)){let{center:i,radius:a}=t.fill;s=e.createRadialGradient(i.x,i.y,a,i.x,i.y,a)}else throw new Error("Unmanaged gradient type.");for(let i of r)s.addColorStop(i.offset,i.color);e.fillStyle=s}else!g.isNullOrEmpty(t.fill)&&typeof t.fill=="string"&&!ie(t.fill)?e.fillStyle=t.fill:e.fillStyle="transparent";g.isNullOrEmpty(t.opacity)?e.globalAlpha=1:e.globalAlpha=t.opacity}_drawImage(e,t,r){let s="pacem:2d-canvas-imagesrc",i=Le(t,s),a=()=>{let o=i.naturalWidth,l=i.naturalHeight,c=t.width,h=t.height;if(c>0&&h>0||(c>0?h=l*c/o:h>0?c=o*h/l:(c=o,h=l)),!this._dragging&&!t.inert&&!g.isNull(r)){let p=new Path2D(`M ${t.x} ${t.y} h ${c} v ${h} H ${t.x} Z`);e.isPointInPath(p,r.x,r.y)&&(this._hitTarget=t)}e.globalAlpha=Oe(t.opacity,1),e.drawImage(i,t.x,t.y,c,h)};g.isNull(i)?(i=new Image,i.src=t.src,i.onload=()=>{Fe(t,s,i),a()}):a()}_drawText(e,t,r){let s=this.DefaultShapeValues,i=e.fillStyle=Oe(t.color,s.stroke),a=e.getTransform(),o=t.fontSize>0?`${t.fontSize}px`:this.#t.fontSize,l=t.fontStyle||this.#t.fontStyle,c=t.fontWeight||this.#t.fontWeight;e.font=`${l} ${c} ${o} ${t.fontFamily??this.#t.fontFamily}`,e.textAlign=t.textAnchor==="middle"?"center":t.textAnchor,e.fillText(t.text,t.anchor.x,t.anchor.y),e.globalAlpha=Oe(t.opacity,1);let h=!ie(i);if(!this._dragging&&!t.inert&&!g.isNull(r)){let p=e.measureText(t.text),m=p.width,f=p.actualBoundingBoxAscent+p.actualBoundingBoxDescent,d=t.anchor.x-p.actualBoundingBoxLeft,v=t.anchor.y-p.actualBoundingBoxAscent,y=new Path2D(`M ${d} ${v} h ${m} v ${f} H ${d} z`);h&&e.isPointInPath(y,r.x,r.y)&&(this._hitTarget=t)}}_drawShape(e,t,r){if(g.isNullOrEmpty(t?.pathData))return;e.beginPath();let s=typeof e.fillStyle!="string"||!ie(e.fillStyle),i=typeof e.strokeStyle!="string"||!ie(e.strokeStyle);var a=new Path2D(t.pathData);!this._dragging&&!t.inert&&!g.isNull(r)&&(s&&e.isPointInPath(a,r.x,r.y)||i&&e.isPointInStroke(a,r.x,r.y))&&(this._hitTarget=t),i&&e.stroke(a),s&&e.fill(a);let o=!g.isNullOrEmpty(t.vertices)&&t.vertices.length>1,l=!g.isNull(t.markerEnd),c=!g.isNull(t.markerStart),h=!g.isNull(t.markerMid);if((l||h||c)&&(o||this.log(Ur.LogLevel.Warn,"Not enough vertices were explicited in order to make markers renderable.")),o){let p=e.getTransform();if(c){let m=t.markerEnd,f=t.vertices[1],d=t.vertices[0],v=Math.atan2(d.y-f.y,d.x-f.x);this._drawMarker(e,m,d,v)}if(h){let m=t.markerEnd;for(let f=1;f<t.vertices.length-1;f++){e.setTransform(p);let d=t.vertices[f],v=t.vertices[f+1],y=Math.atan2(v.y-d.y,v.x-d.x);this._drawMarker(e,m,v,y)}}if(l){e.setTransform(p);let m=t.markerEnd,f=t.vertices[t.vertices.length-2],d=t.vertices[t.vertices.length-1],v=Math.atan2(d.y-f.y,d.x-f.x);this._drawMarker(e,m,d,v)}}}_drawMarker(e,t,r,s){let i=this.DefaultShapeValues,a=t.ref?.x||0,o=t.ref?.y||0,l=(t.width||1)*e.lineWidth,c=(t.width||1)*e.lineWidth,h=t.viewbox,p={x:0,y:0,width:l,height:c};g.isNull(h)&&(h=p);let m={a:p.width/h.width,d:p.height/h.height};e.translate(r.x,r.y),e.rotate(s),e.scale(m.a,m.d),e.translate(-a,-o),e.fillStyle=Oe(t.fill,i.fill),e.strokeStyle=Oe(t.stroke,i.stroke);let f=!ie(t.fill),d=!ie(t.stroke);var v=new Path2D(t.pathData);f&&e.fill(v),d&&e.stroke(v)}};pt=Ir([Gr({tagName:Ut+"-"+"2d"+"-canvas-adapter"})],pt);import{CustomElement as Xr,P as Xt,CustomElementUtils as qe,CustomEventUtils as zt,Utils as u,UI as se,avoidHandler as Yr}from"@pacem/pacem-core";import{Matrix2D as dt}from"@pacem/pacem-foundation";var Vr=function(n,e,t,r){var s=arguments.length,i=s<3?e:r===null?r=Object.getOwnPropertyDescriptor(e,t):r,a;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")i=Reflect.decorate(n,e,t,r);else for(var o=n.length-1;o>=0;o--)(a=n[o])&&(i=(s<3?a(i):s>3?a(e,t,i):a(e,t))||i);return s>3&&i&&Object.defineProperty(e,t,i),i},G="http://www.w3.org/2000/svg",He="pacem:2-svg-drawable",Je="pacem:2d-svg-stage",Ie=qe.getAttachedPropertyValue,Wt=qe.setAttachedPropertyValue,jt=qe.deleteAttachedPropertyValue;function ut(n,e){return u.isNull(n)?e:n}function Vt(n,e,t){return t>=n.children.length?(n.appendChild(e),null):n.replaceChild(e,n.children.item(t))}var mt=class extends xe{constructor(){super(...arguments),this._hitTarget=null,this._dragInitHandler=e=>{let t=e.detail,r=t.element,s=Ie(r,He),i=s.stage.transformMatrix,a=s.transformMatrix??dt.identity;t.data={stageTransformMatrix:i,item:s,initialTransformMatrix:a},E.itemDispatch(s,e,{x:0,y:0})&&e.preventDefault()},this._draggingHandler=e=>{Yr(e),this.#t=!0;let t=e.detail.element,r=e.detail.data,s=e.detail,i={x:(s.currentPosition.x-s.origin.x)*r.stageTransformMatrix.a,y:(s.currentPosition.y-s.origin.y)*r.stageTransformMatrix.d},a={x:i.x+r.initialTransformMatrix.e,y:i.y+r.initialTransformMatrix.f},o={x:i.x+r.stageTransformMatrix.e,y:i.y+r.stageTransformMatrix.f};if(!E.itemDispatch(r.item,e,o)){let c=r.initialTransformMatrix;t.style.transform=`matrix(${c.a},${c.b},${c.c},${c.d},${a.x},${a.y})`}},this._dragEndHandler=e=>{this.#t=!1;let t=e.detail,r=t.element,s=t.data,i=u.deserializeTransform(r.style),a={x:i.e,y:i.f};if(s.item instanceof w)s.item.translateX=a.x,s.item.translateY=a.y;else{let o=s.initialTransformMatrix,l={a:o.a,b:o.b,c:o.c,d:o.d,e:a.x,f:a.y};u.extend(s.item,{transformMatrix:l})}r.style.transform="",E.itemDispatch(s.item,e,a)},this._mouseleaveHandler=e=>{if(this.#t)return;let t=this._hitTarget;u.isNull(t)||(this._hitTarget=null,u.isNull(t)||(this.#e.unregister(this._items.get(t)),E.itemDispatch(t,"out",e)))},this._mousemoveHandler=e=>{var t=zt.getEventCoordinates(e).client;if(!this.#t){var r=null;e.target.getRootNode().elementsFromPoint(t.x,t.y).find(l=>(r=Ie(l,He),r&&!r.inert));var s=this._hitTarget,i=r;(u.isNull(r&&r.stage)||!this._scenes.has(r.stage)||r.inert)&&(i=null);let o=this._hitTarget=i;if(i!==s&&(u.isNull(s)||(this.#e.unregister(this._items.get(s)),E.itemDispatch(s,"out",e)),u.isNull(i)||(i.draggable&&this.#e.register(this._items.get(i)),E.itemDispatch(i,"over",e))),u.isNull(o)){let l=e.currentTarget,c=Ie(l,Je);u.isNull(c)||E.stageDispatch(c,"move",e)}}},this._mouseDownUpHandler=e=>{let t=e.currentTarget;if(t instanceof SVGSVGElement){let r=Ie(t,Je),s=this._hitTarget,i=e.type.replace(/^mouse/,""),a=de(r);zt.matchModifiers(e,a.clickModifiers)&&(!u.isNull(s)&&s.stage===r?E.itemDispatch(s,i,e):E.stageDispatch(r,i,e))}},this._scenes=new WeakMap,this._markers=new WeakMap,this._gradients=new WeakMap,this._items=new WeakMap}snapshot(e,t,r,s){if(this._scenes.has(e)){let i=this._scenes.get(e);return this.snapshotElement(i,t,r,s)}else return Promise.resolve(null)}getTransformMatrix(e){let t=this._scenes;return t.has(e)?t.get(e).getScreenCTM().inverse():dt.identity}#e;viewActivatedCallback(){super.viewActivatedCallback();let e=this.#e=document.createElement(Xt+"-drag-drop");e.mode=se.DragDataMode.Self,qe.findAncestorShell(this).appendChild(e),e.addEventListener(se.DragDropEventType.Init,this._dragInitHandler,!1),e.addEventListener(se.DragDropEventType.Drag,this._draggingHandler,!1),e.addEventListener(se.DragDropEventType.End,this._dragEndHandler,!1)}disconnectedCallback(){let e=this.#e;u.isNull(e)||(e.removeEventListener(se.DragDropEventType.Init,this._dragInitHandler,!1),e.removeEventListener(se.DragDropEventType.Drag,this._draggingHandler,!1),e.removeEventListener(se.DragDropEventType.End,this._dragEndHandler,!1),e.remove()),super.disconnectedCallback()}invalidateSize(e,t){let r=this._scenes;if(!u.isNull(e)&&!u.isNullOrEmpty(t)&&r.has(e)){var s=r.get(e);s.setAttribute("width",t.width+""),s.setAttribute("height",t.height+"");let i=e.viewbox,a=e.aspectRatio;E.isValidViewbox(i)?s.setAttribute("viewBox",`${i.x} ${i.y} ${i.width} ${i.height}`):s.removeAttribute("viewBox"),u.isNullOrEmpty(a)||typeof a=="string"?s.removeAttribute("preserveAspectRatio"):s.setAttribute("preserveAspectRatio",`xM${a.x.substring(1)}YM${a.y.substring(1)} ${a.slice?"slice":"meet"}`)}}initialize(e){if(u.isNull(e))throw"Provided scene is null or undefined.";let t=this._scenes;if(t.has(e))return t.get(e);let r=e.stage;r.innerHTML="",this._items=new WeakMap;var s=document.createElementNS(G,"svg");s.setAttribute("part","stage"),Wt(s,Je,e),r.appendChild(s),t.set(e,s);let i={passive:!1,capture:!0};return s.addEventListener("mousemove",this._mousemoveHandler,!1),s.addEventListener("click",this._mouseDownUpHandler,!1),s.addEventListener("mousedown",this._mouseDownUpHandler,!1),s.addEventListener("mouseup",this._mouseDownUpHandler,!1),s.addEventListener("mouseleave",this._mouseleaveHandler,!1),s}dispose(e){let t=this._scenes;if(t.has(e)){var r=t.get(e);r.removeEventListener("mousemove",this._mousemoveHandler),r.removeEventListener("click",this._mouseDownUpHandler),r.removeEventListener("mousedown",this._mouseDownUpHandler),r.removeEventListener("mouseup",this._mouseDownUpHandler),r.removeEventListener("mouseleave",this._mouseleaveHandler),jt(r,Je),r.remove(),t.delete(e)}}getHitTarget(e){return this._hitTarget}draw(e,t,r=!1){let s=this._scenes,i=this._items;if(!u.isNull(e)){if(e.adapter===this)s.has(e)||this.initialize(e);else{s.has(e)&&s.delete(e);return}var a=e.datasource,o=!0,l=s.get(e);!u.isNull(t)&&i.has(t)&&(a=[t],l=i.get(t).parentNode,o=!1),o&&(l.innerHTML="<defs></defs>",this._markers=new WeakMap),this._draw(e,l,a||[],o,r)}}#t;_hasItems(e){return Q(e)}_disposeSvg(e){if(!u.isNull(e)){var t=Ie(e,He);jt(e,He),this._items.delete(t)}}_draw(e,t,r,s,i){let a=this._items,o=0;if(t.firstElementChild instanceof SVGDefsElement&&o++,!u.isNullOrEmpty(r))for(let l of r){l.stage??=e;let c;if(a.has(l)?(c=a.get(l),c.parentNode!==t&&this._disposeSvg(Vt(t,c,o))):(c=this._buildSVGElement(l),Wt(c,He,l),this._disposeSvg(Vt(t,c,o)),a.set(l,c)),oe(l)&&(l.hide?c.setAttribute("display","none"):c.removeAttribute("display"),c.style.transform=""),ce(l)){let h=c;h.setAttribute("d",ut(l.pathData,"M0,0"));for(let{marker:p,suffix:m}of[{marker:l.markerStart,suffix:"start"},{marker:l.markerEnd,suffix:"end"},{marker:l.markerMid,suffix:"mid"}])if(p){let f=this._ensureMarker(t,p);h.setAttribute("marker-"+m,`url(#${f.id})`)}else h.removeAttribute("marker-"+m)}else if(he(l)){let h=c;h.textContent=l.text,h.style.fill=u.isNullOrEmpty(l.color)?"":l.color,h.style.fontFamily=u.isNullOrEmpty(l.fontFamily)?"":l.fontFamily,h.style.fontSize=u.isNull(l.fontSize)?"":l.fontSize+"px",u.isNullOrEmpty(l.fontWeight)||(h.style.fontWeight=l.fontWeight),u.isNullOrEmpty(l.fontStyle)||(h.style.fontStyle=l.fontStyle),h.setAttribute("text-anchor",ut(l.textAnchor,"start")),u.isNull(l.anchor)?(h.removeAttribute("x"),h.removeAttribute("y")):(h.setAttribute("x",l.anchor.x.toString()),h.setAttribute("y",l.anchor.y.toString()))}else if(pe(l)){let h=c;h.setAttribute("href",l.src),h.setAttribute("preserveAspectRatio","none"),l.width>0?h.setAttribute("width",""+l.width):h.removeAttribute("width"),l.height>0?h.setAttribute("height",""+l.height):h.removeAttribute("height"),u.isNull(l.x)?h.removeAttribute("x"):h.setAttribute("x",""+l.x),u.isNull(l.y)?h.removeAttribute("y"):h.setAttribute("y",""+l.y)}if(P(l)){let h=l.transformMatrix;u.isNull(h)||dt.isIdentity(h)?c.removeAttribute("transform"):c.setAttribute("transform",`matrix(${h.a} ${h.b} ${h.c} ${h.d} ${h.e} ${h.f})`);let p=ut(l.opacity,1);p===1?c.removeAttribute("opacity"):c.setAttribute("opacity",""+p)}if(we(l)){if(u.isNullOrEmpty(l.fill))c.removeAttribute("fill");else if(typeof l.fill=="string")c.setAttribute("fill",l.fill);else{let h=this._ensureGradient(t,l.fill);c.setAttribute("fill",`url(#${h.id})`)}u.isNullOrEmpty(l.stroke)?c.removeAttribute("stroke"):c.setAttribute("stroke",l.stroke),u.isNullOrEmpty(l.dashArray)?c.removeAttribute("stroke-dasharray"):c.setAttribute("stroke-dasharray",l.dashArray.join(" ")),u.isNullOrEmpty(l.lineCap)?c.removeAttribute("stroke-linecap"):c.setAttribute("stroke-linecap",l.lineCap),u.isNullOrEmpty(l.lineJoin)?c.removeAttribute("stroke-linejoin"):c.setAttribute("stroke-linejoin",l.lineJoin),u.isNullOrEmpty(l.lineWidth)?c.removeAttribute("stroke-width"):c.setAttribute("stroke-width",""+l.lineWidth)}l.inert?c.style.pointerEvents="none":c.style.pointerEvents="",(s||i)&&this._hasItems(l)&&this._draw(e,c,l.childDrawables,!0,i),o++}if(s)for(let l=t.children.length-1;l>=o;l--){let c=t.children.item(l);this._disposeSvg(c),c.remove()}}_buildSVGElement(e){return ce(e)||e instanceof _?document.createElementNS(G,"path"):he(e)||e instanceof M?document.createElementNS(G,"text"):pe(e)||e instanceof R?document.createElementNS(G,"image"):document.createElementNS(G,"g")}_ensureGradient(e,t){let r=this._gradients;r.has(e)||r.set(e,new WeakMap);let s=r.get(e),i=_e(t),a=le(t);if(s.has(t)){let h=s.get(t);(i&&h instanceof SVGLinearGradientElement||a&&h instanceof SVGRadialGradientElement)&&(h.remove(),s.delete(t))}if(!s.has(t)){let h=e,p;for(;u.isNull(p=h.querySelector(":scope > defs"));){let m=h.parentElement;if(m instanceof SVGElement)h=m;else break}if(u.isNull(p))throw new Error("Must provide a <defs> element.");var o=null;if(i)o=document.createElementNS(G,"linearGradient");else if(le(t))o=document.createElementNS(G,"radialGradient");else throw new Error("Unmanaged gradient type.");o.setAttribute("gradientUnits","userSpaceOnUse"),o.setAttribute("id",`grad-${u.uniqueCode()}`),p.appendChild(o),s.set(t,o)}let l=s.get(t);i?(l.setAttribute("x1",t.start.x.toString()),l.setAttribute("y1",t.start.y.toString()),l.setAttribute("x2",t.end.x.toString()),l.setAttribute("y2",t.end.y.toString())):a&&(l.setAttribute("cx",t.center.x.toString()),l.setAttribute("cy",t.center.y.toString()),l.setAttribute("r",t.radius.toString()));let c=0;for(let h of t.stops){for(;l.children.length<=c;){let m=document.createElementNS(G,"stop");l.appendChild(m)}let p=l.children.item(c);p.setAttribute("offset",h.offset*100+"%"),p.setAttribute("stop-color",h.color),u.isNull(h.opacity)||p.setAttribute("stop-opacity",h.opacity.toString()),c++}for(;l.children.length>t.stops.length;){let h=l.children.item(l.children.length-1);l.removeChild(h)}return l}_ensureMarker(e,t){let r=this._markers;r.has(e)||r.set(e,new WeakMap);let s=r.get(e);if(!s.has(t)){let o=document.createElementNS(G,"marker");s.set(t,o);let l=document.createElementNS(G,"path");o.appendChild(l),o.setAttribute("id","mark"+u.uniqueCode());let c=e,h;for(;u.isNull(h=c.querySelector(":scope > defs"));){let p=c.parentElement;if(p instanceof SVGElement)c=p;else break}if(u.isNull(h))throw new Error("Must provide a <defs> element.");h.appendChild(o)}let i=s.get(t),a=i.firstElementChild;return i.setAttribute("orient","auto-start-reverse"),u.isNullOrEmpty(t.viewbox)?i.removeAttribute("viewBox"):i.setAttribute("viewBox",`${t.viewbox.x} ${t.viewbox.y} ${t.viewbox.width} ${t.viewbox.height}`),u.isNullOrEmpty(t.ref)?(i.removeAttribute("refX"),i.removeAttribute("refY")):(i.setAttribute("refX",t.ref.x.toString()),i.setAttribute("refY",t.ref.y.toString())),t.height>0?i.setAttribute("markerHeight",t.height.toString()):i.removeAttribute("markerHeight"),t.width>0?i.setAttribute("markerWidth",t.width.toString()):i.removeAttribute("markerWidth"),a.setAttribute("d",t.pathData),u.isNullOrEmpty(t.fill)?a.removeAttribute("fill"):a.setAttribute("fill",t.fill),u.isNullOrEmpty(t.stroke)?a.removeAttribute("stroke"):a.setAttribute("stroke",t.stroke),i}};mt=Vr([Xr({tagName:Xt+"-"+"2d"+"-svg-adapter"})],mt);export{Yt as Components,xt as Drawing};