New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More
Socket
Sign inDemoInstall
Socket

@idraw/board

Package Overview
Dependencies
Maintainers
2
Versions
120
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@idraw/board - npm Package Compare versions

Comparing version 0.4.0-alpha.3 to 0.4.0-alpha.4

2

dist/esm/index.d.ts
import { EventEmitter } from '@idraw/util';
import type { Data, BoardOptions, BoardMiddleware, ViewSizeInfo, PointSize, BoardExtendEvent } from '@idraw/types';
import { Sharer } from './lib/sharer';
import { Viewer } from './lib/viewer';
export declare class Board<T extends BoardExtendEvent = BoardExtendEvent> {

@@ -34,2 +35,3 @@ private _opts;

getSharer(): Sharer;
getViewer(): Viewer;
setData(data: Data): {

@@ -36,0 +38,0 @@ viewSizeInfo: ViewSizeInfo;

@@ -228,2 +228,5 @@ import { Renderer } from '@idraw/renderer';

}
getViewer() {
return this._viewer;
}
setData(data) {

@@ -278,3 +281,4 @@ const sharer = this._sharer;

const { viewContent } = this._opts;
const { helperContext, viewContext, boardContext } = viewContent;
const { underContext, helperContext, viewContext, boardContext } = viewContent;
underContext.clearRect(0, 0, underContext.canvas.width, underContext.canvas.height);
helperContext.clearRect(0, 0, helperContext.canvas.width, helperContext.canvas.height);

@@ -281,0 +285,0 @@ viewContext.clearRect(0, 0, viewContext.canvas.width, viewContext.canvas.height);

8

dist/esm/lib/viewer.js

@@ -28,3 +28,3 @@ import { EventEmitter, viewScale, viewScroll } from '@idraw/util';

const { scale, offsetTop, offsetBottom, offsetLeft, offsetRight, width, height, contextHeight, contextWidth, devicePixelRatio } = snapshot.activeStore;
const { viewContext, helperContext, boardContext } = viewContent;
const { underContext, viewContext, helperContext, boardContext } = viewContent;
if (snapshot === null || snapshot === void 0 ? void 0 : snapshot.activeStore.data) {

@@ -50,4 +50,6 @@ renderer.drawData(snapshot.activeStore.data, {

boardContext.clearRect(0, 0, width, height);
boardContext.drawImage(underContext.canvas, 0, 0, width, height);
boardContext.drawImage(viewContext.canvas, 0, 0, width, height);
boardContext.drawImage(helperContext.canvas, 0, 0, width, height);
underContext.clearRect(0, 0, width, height);
viewContext.clearRect(0, 0, width, height);

@@ -108,3 +110,3 @@ helperContext.clearRect(0, 0, width, height);

const { width, height, devicePixelRatio } = newViewSize;
const { boardContext, helperContext, viewContext } = this._opts.viewContent;
const { underContext, boardContext, helperContext, viewContext } = this._opts.viewContent;
boardContext.canvas.width = width * devicePixelRatio;

@@ -114,2 +116,4 @@ boardContext.canvas.height = height * devicePixelRatio;

boardContext.canvas.style.height = `${height}px`;
underContext.canvas.width = width * devicePixelRatio;
underContext.canvas.height = height * devicePixelRatio;
helperContext.canvas.width = width * devicePixelRatio;

@@ -116,0 +120,0 @@ helperContext.canvas.height = height * devicePixelRatio;

@@ -1,1 +0,1 @@

var iDrawBoard=function(e){"use strict";function t(e,t){let i=-1;return function(...n){i>0||(i=setTimeout((()=>{e(...n),i=-1}),t))}}function i(e){return"string"==typeof e&&(/^\#([0-9a-f]{3}|[0-9a-f]{6}|[0-9a-f]{8})$/i.test(e)||/^[a-z]{1,}$/i.test(e))}function n(e){return function e(t){const i=function(e){return Object.prototype.toString.call(e).replace(/[\]|\[]{1,1}/gi,"").split(" ")[1]}(t);if(["Null","Number","String","Boolean","Undefined"].indexOf(i)>=0)return t;if("Array"===i){const i=[];return t.forEach((t=>{i.push(e(t))})),i}if("Object"===i){const i={};Object.keys(t).forEach((n=>{i[n]=e(t[n])}));return Object.getOwnPropertySymbols(t).forEach((n=>{i[n]=e(t[n])})),i}}(e)}function o(e){return(Object.prototype.toString.call(e)||"").replace(/(\[object|\])/gi,"").trim()}const a={type(e,t){const i=o(e);return!0===t?i.toLocaleLowerCase():i},array:e=>"Array"===o(e),json:e=>"Object"===o(e),function:e=>"Function"===o(e),asyncFunction:e=>"AsyncFunction"===o(e),string:e=>"String"===o(e),number:e=>"Number"===o(e),undefined:e=>"Undefined"===o(e),null:e=>"Null"===o(e),promise:e=>"Promise"===o(e)};var r=globalThis&&globalThis.__awaiter||function(e,t,i,n){return new(i||(i=Promise))((function(o,a){function r(e){try{l(n.next(e))}catch(e){a(e)}}function s(e){try{l(n.throw(e))}catch(e){a(e)}}function l(e){var t;e.done?o(e.value):(t=e.value,t instanceof i?t:new i((function(e){e(t)}))).then(r,s)}l((n=n.apply(e,t||[])).next())}))};const{Image:s}=window;function l(e){return new Promise(((t,i)=>{const n=new s;n.crossOrigin="anonymous",n.onload=function(){t(n)},n.onabort=i,n.onerror=i,n.src=e}))}function h(e){return r(this,void 0,void 0,(function*(){const t=yield function(e){return new Promise(((t,i)=>{const n=new Blob([e],{type:"image/svg+xml;charset=utf-8"}),o=new FileReader;o.readAsDataURL(n),o.onload=function(e){var i;const n=null===(i=null==e?void 0:e.target)||void 0===i?void 0:i.result;t(n)},o.onerror=function(e){i(e)}}))}(e);return yield l(t)}))}function c(e,t){return r(this,void 0,void 0,(function*(){e=e.replace(/\&/gi,"&amp;");const i=yield function(e,t){const{width:i,height:n}=t;return new Promise(((t,o)=>{const a=new Blob([`\n <svg \n xmlns="http://www.w3.org/2000/svg" \n width="${i||""}" \n height = "${n||""}">\n <foreignObject width="100%" height="100%">\n <div xmlns = "http://www.w3.org/1999/xhtml">\n ${e}\n </div>\n </foreignObject>\n </svg>\n `],{type:"image/svg+xml;charset=utf-8"}),r=new FileReader;r.readAsDataURL(a),r.onload=function(e){var i;const n=null===(i=null==e?void 0:e.target)||void 0===i?void 0:i.result;t(n)},r.onerror=function(e){o(e)}}))}(e,t);return yield l(i)}))}function d(e){return"number"==typeof e&&(e>0||e<=0)}function u(e){return"number"==typeof e&&e>=0}function f(e){return"string"==typeof e&&/^(http:\/\/|https:\/\/|\.\/|\/)/.test(`${e}`)}function v(e){return"string"==typeof e&&/^(data:image\/)/.test(`${e}`)}const g={x:function(e){return d(e)},y:function(e){return d(e)},w:u,h:function(e){return"number"==typeof e&&e>=0},angle:function(e){return"number"==typeof e&&e>=-360&&e<=360},number:d,numberStr:function(e){return/^(-?\d+(?:\.\d+)?)$/.test(`${e}`)},borderWidth:function(e){return u(e)},borderRadius:function(e){return d(e)&&e>=0},color:function(e){return i(e)},imageSrc:function(e){return v(e)||f(e)},imageURL:f,imageBase64:v,svg:function(e){return"string"==typeof e&&/^(<svg[\s]{1,}|<svg>)/i.test(`${e}`.trim())&&/<\/[\s]{0,}svg>$/i.test(`${e}`.trim())},html:function(e){let t=!1;if("string"==typeof e){let i=document.createElement("div");i.innerHTML=e,i.children.length>0&&(t=!0),i=null}return t},text:function(e){return"string"==typeof e},fontSize:function(e){return d(e)&&e>0},lineHeight:function(e){return d(e)&&e>0},textAlign:function(e){return["center","left","right"].includes(e)},fontFamily:function(e){return"string"==typeof e&&e.length>0},fontWeight:function(e){return["bold"].includes(e)},strokeWidth:function(e){return d(e)&&e>0}};class w{constructor(){this._listeners=new Map}on(e,t){if(this._listeners.has(e)){const i=this._listeners.get(e)||[];null==i||i.push(t),this._listeners.set(e,i)}else this._listeners.set(e,[t])}off(e,t){if(this._listeners.has(e)){const i=this._listeners.get(e);if(Array.isArray(i))for(let e=0;e<(null==i?void 0:i.length);e++)if(i[e]===t){i.splice(e,1);break}this._listeners.set(e,i||[])}}trigger(e,t){const i=this._listeners.get(e);return!!Array.isArray(i)&&(i.forEach((e=>{e(t)})),!0)}has(e){if(this._listeners.has(e)){const t=this._listeners.get(e);if(Array.isArray(t)&&t.length>0)return!0}return!1}}class m{constructor(e){this._backUpDefaultStorage=n(e.defaultStorage),this._temp=this._createTempStorage()}set(e,t){this._temp[e]=t}get(e){return this._temp[e]}getSnapshot(){return n(this._temp)}clear(){this._temp=this._createTempStorage()}_createTempStorage(){return n(this._backUpDefaultStorage)}}function _(e){return e/180*Math.PI}function x(e,t,i){const n=S(t),o=_(t.angle||0);n&&(o>0||o<0)&&(e.translate(n.x,n.y),e.rotate(o),e.translate(-n.x,-n.y)),i(e),n&&(o>0||o<0)&&(e.translate(n.x,n.y),e.rotate(-o),e.translate(-n.x,-n.y))}function S(e){return{x:e.x+e.w/2,y:e.y+e.h/2}}function p(e,t,i){const n=function(e,t){const i=t.x-e.x,n=t.y-e.y;if(0===i){if(n<0)return 0;if(n>0)return Math.PI}else if(0===n){if(i<0)return 3*Math.PI/2;if(i>0)return Math.PI/2}return i>0&&n<0?Math.atan(Math.abs(i)/Math.abs(n)):i>0&&n>0?Math.PI-Math.atan(Math.abs(i)/Math.abs(n)):i<0&&n>0?Math.PI+Math.atan(Math.abs(i)/Math.abs(n)):i<0&&n<0?2*Math.PI-Math.atan(Math.abs(i)/Math.abs(n)):0}(e,t);let o=n+i;o>2*Math.PI?o-=2*Math.PI:o<0-2*Math.PI&&(o+=2*Math.PI),o<0&&(o+=2*Math.PI);const a=function(e,t){const i=(e.x-t.x)*(e.x-t.x)+(e.y-t.y)*(e.y-t.y);return 0===i?i:Math.sqrt(i)}(e,t);let r=0,s=0;return 0===o?(r=0,s=0-a):o>0&&o<Math.PI/2?(r=Math.sin(o)*a,s=0-Math.cos(o)*a):o===Math.PI/2?(r=a,s=0):o>Math.PI/2&&o<Math.PI?(r=Math.sin(Math.PI-o)*a,s=Math.cos(Math.PI-o)*a):o===Math.PI?(r=0,s=a):o>Math.PI&&o<1.5*Math.PI?(r=0-Math.sin(o-Math.PI)*a,s=Math.cos(o-Math.PI)*a):o===1.5*Math.PI?(r=0-a,s=0):o>1.5*Math.PI&&o<2*Math.PI?(r=0-Math.sin(2*Math.PI-o)*a,s=0-Math.cos(2*Math.PI-o)*a):o===2*Math.PI&&(r=0,s=0-a),r+=e.x,s+=e.y,{x:r,y:s}}function y(e){const{angle:t=0}=e;return function(e,t,i){const{x:n,y:o,w:a,h:r}=e;let s={x:n,y:o},l={x:n+a,y:o},h={x:n+a,y:o+r},c={x:n,y:o+r};if(i&&(i>0||i<0)){const e=_(function(e){if(!(e>0||e<0)||0===e)return 0;let t=e%360;return t<0&&(t+=360),t}(i));s=p(t,s,e),l=p(t,l,e),h=p(t,h,e),c=p(t,c,e)}return[s,l,h,c]}(e,S(e),t)}function b(e,t){const{viewScaleInfo:i}=t,{x:n,y:o,w:a,h:r,angle:s}=e,{scale:l,offsetTop:h,offsetLeft:c}=i;return{x:n*l+c,y:o*l+h,w:a*l,h:r*l,angle:s}}function I(e,t){const{context2d:i,element:n,viewScaleInfo:o,viewSizeInfo:a}=t,{angle:r=0}=n,{x:s,y:l,w:h,h:c}=b(n,{viewScaleInfo:o,viewSizeInfo:a}),d=y({x:s,y:l,w:h,h:c,angle:r});if(d.length>=2){i.beginPath(),i.moveTo(d[0].x,d[0].y);for(let e=1;e<d.length;e++)i.lineTo(d[e].x,d[e].y);i.closePath()}return!!i.isPointInPath(e.x,e.y)}function M(e){let t="";return e.forEach((e=>{t+=e.type+e.params.join(" ")})),t}function P(e,t,n){var o,r;void 0!==(null===(o=null==t?void 0:t.detail)||void 0===o?void 0:o.opacity)&&(null===(r=null==t?void 0:t.detail)||void 0===r?void 0:r.opacity)>0?e.globalAlpha=t.detail.opacity:e.globalAlpha=1;const{pattern:s,renderContent:l,originElem:h,calcElemSize:c,viewScaleInfo:d,viewSizeInfo:u}=n||{};!function(e,t,i){const{renderContent:n,originElem:o,calcElemSize:a,viewScaleInfo:r,viewSizeInfo:s}=i,l=r.scale*s.devicePixelRatio,{clipPath:h}=(null==o?void 0:o.detail)||{};if(h&&a&&h.commands){const{x:i,y:o,w:r,h:s}=a,{originW:c,originH:d,originX:u,originY:f}=h,v=r/c,g=s/d;let w=i-u*v,m=o-f*g;e.save(),e.translate(w,m),e.scale(l*v,l*g);const _=M(h.commands||[]),S=new Path2D(_);e.clip(S),e.translate(0-w,0-m),e.setTransform(1,0,0,1,0,0),x(e,Object.assign({},t),(()=>{null==n||n()})),e.restore()}else null==n||n()}(e,t,{originElem:h,calcElemSize:c,viewScaleInfo:d,viewSizeInfo:u,renderContent:()=>{!function(e,t,n){if(!i(t.detail.borderColor))return;const{viewScaleInfo:o}=n;let a="#000000";!0===i(t.detail.borderColor)&&(a=t.detail.borderColor);const{borderWidth:r,borderRadius:s,borderDash:l}=t.detail;let h=0;"number"==typeof r&&(h=r||1);h*=o.scale;let c=s||0;e.strokeStyle=a,e.setLineDash(l||[]);let d=0,u=0,f=0,v=0;Array.isArray(r)&&(d=r[0]||0,u=r[1]||0,f=r[2]||0,v=r[3]||0);if(v||u||d||f){const{x:i,y:n,w:a,h:r}=t;v&&(e.beginPath(),e.lineWidth=v*o.scale,e.moveTo(i,n),e.lineTo(i,n+r),e.closePath(),e.stroke()),u&&(e.beginPath(),e.lineWidth=u*o.scale,e.moveTo(i+a,n),e.lineTo(i+a,n+r),e.closePath(),e.stroke()),d&&(e.beginPath(),e.lineWidth=d*o.scale,e.moveTo(i,n),e.lineTo(i+a,n),e.closePath(),e.stroke()),f&&(e.beginPath(),e.lineWidth=f*o.scale,e.moveTo(i,n+r),e.lineTo(i+a,n+r),e.closePath(),e.stroke())}else{let{x:i,y:n,w:o,h:a}=t;const{boxSizing:r}=t.detail;"border-box"===r?(i=t.x,n=t.y,o=t.w,a=t.h):(i=t.x-h,n=t.y-h,o=t.w+2*h,a=t.h+2*h),c=Math.min(c,o/2,a/2),c<o/2&&c<a/2&&(c+=h/2),e.beginPath(),e.lineWidth=h,e.moveTo(i+c,n),e.arcTo(i+o,n,i+o,n+a,c),e.arcTo(i+o,n+a,i,n+a,c),e.arcTo(i,n+a,i,n,c),e.arcTo(i,n,i+o,n,c),e.closePath(),e.stroke()}}(e,t,{viewScaleInfo:d,viewSizeInfo:u}),function(e,t,i){var n,o;const{pattern:r,viewScaleInfo:s}=i;let l=[];if(t.detail.background||r){const{x:i,y:h,w:c,h:d}=t;let u=(t.detail.borderRadius||0)*s.scale;if(u=Math.min(u,c/2,d/2),(c<2*u||d<2*u)&&(u=0),e.beginPath(),e.moveTo(i+u,h),e.arcTo(i+c,h,i+c,h+d,u),e.arcTo(i+c,h+d,i,h+d,u),e.arcTo(i,h+d,i,h,u),e.arcTo(i,h,i+c,h,u),e.closePath(),"string"==typeof r)e.fillStyle=r;else if(["CanvasPattern"].includes(a.type(r)))e.fillStyle=r;else if("string"==typeof t.detail.background)e.fillStyle=t.detail.background;else if("linearGradient"===(null===(n=t.detail.background)||void 0===n?void 0:n.type)){const{start:n,end:o,stops:a}=t.detail.background,r={x:n.x+i,y:n.y+h},s={x:o.x+i,y:o.y+h},l=e.createLinearGradient(r.x,r.y,s.x,s.y);a.forEach((e=>{l.addColorStop(e.offset,e.color)})),e.fillStyle=l}else if("radialGradient"===(null===(o=t.detail.background)||void 0===o?void 0:o.type)){const{inner:n,outer:o,stops:a}=t.detail.background;l=t.detail.background.transform||[];const r={x:n.x,y:n.y,radius:n.radius*s.scale},c={x:o.x,y:o.y,radius:o.radius*s.scale},d=e.createRadialGradient(r.x,r.y,r.radius,c.x,c.y,c.radius);if(a.forEach((e=>{d.addColorStop(e.offset,e.color)})),e.fillStyle=d,l&&l.length>0)for(let t=0;t<(null==l?void 0:l.length);t++){const n=l[t];"translate"===n.method?e.translate(n.args[0]+i,n.args[1]+h):"rotate"===n.method?e.rotate(...n.args):"scale"===n.method&&e.scale(...n.args)}}e.fill(),l&&l.length>0&&e.setTransform(1,0,0,1,0,0)}}(e,t,{pattern:s,viewScaleInfo:d,viewSizeInfo:u}),null==l||l()}}),e.globalAlpha=1}function T(e,t,i){const{detail:n}=t,{viewScaleInfo:o,renderContent:a}=i,{shadowColor:r,shadowOffsetX:s,shadowOffsetY:l,shadowBlur:h}=n;g.number(h)?(e.save(),e.shadowColor=r||"#000000",e.shadowOffsetX=(s||0)*o.scale,e.shadowOffsetY=(l||0)*o.scale,e.shadowBlur=(h||0)*o.scale,a(),e.restore()):a()}function z(e,t,n){var o;if(!0!==(null===(o=null==t?void 0:t.operations)||void 0===o?void 0:o.invisible))try{switch(t.type){case"rect":!function(e,t,i){const{calculator:n,viewScaleInfo:o,viewSizeInfo:a}=i;let{x:r,y:s,w:l,h:h,angle:c}=n.elementSize(t,o,a);const d=Object.assign(Object.assign({},t),{x:r,y:s,w:l,h:h,angle:c});x(e,{x:r,y:s,w:l,h:h,angle:c},(()=>{T(e,d,{viewScaleInfo:o,viewSizeInfo:a,renderContent:()=>{P(e,d,{originElem:t,calcElemSize:{x:r,y:s,w:l,h:h,angle:c},viewScaleInfo:o,viewSizeInfo:a,renderContent:()=>{}})}})}))}(e,t,n);break;case"circle":!function(e,t,i){const{detail:n,angle:o}=t,{background:a="#000000",borderColor:r="#000000",borderWidth:s=0}=n,{calculator:l,viewScaleInfo:h,viewSizeInfo:c}=i,{x:d,y:u,w:f,h:v}=l.elementSize({x:t.x,y:t.y,w:t.w,h:t.h},h,c);x(e,{x:d,y:u,w:f,h:v,angle:o},(()=>{const t=f/2,i=v/2,n=d+t,o=u+i;if(s&&s>0){const a=s/2+t,l=s/2+i;e.beginPath(),e.strokeStyle=r,e.lineWidth=s,e.circle(n,o,a,l,0,0,2*Math.PI),e.closePath(),e.stroke()}e.beginPath(),e.fillStyle=a,e.circle(n,o,t,i,0,0,2*Math.PI),e.closePath(),e.fill()}))}(e,t,n);break;case"text":!function(e,t,n){const{calculator:o,viewScaleInfo:a,viewSizeInfo:r}=n,{x:s,y:l,w:h,h:c,angle:d}=o.elementSize(t,a,r),u=Object.assign(Object.assign({},t),{x:s,y:l,w:h,h:c,angle:d});x(e,{x:s,y:l,w:h,h:c,angle:d},(()=>{P(e,u,{originElem:t,calcElemSize:{x:s,y:l,w:h,h:c,angle:d},viewScaleInfo:a,viewSizeInfo:r,renderContent:()=>{const n=Object.assign({fontSize:12,fontFamily:"sans-serif",textAlign:"center"},t.detail),o=n.fontSize*a.scale,r=n.lineHeight?n.lineHeight*a.scale:o;e.fillStyle=t.detail.color,e.textBaseline="top",e.$setFont({fontWeight:n.fontWeight,fontSize:o,fontFamily:n.fontFamily});const d=n.text.replace(/\r\n/gi,"\n"),u=r,f=d.split("\n"),v=[];let w=0;f.forEach(((t,i)=>{let n="";if(t.length>0){for(let o=0;o<t.length&&(e.measureText(n+(t[o]||"")).width<e.$doPixelRatio(h)?n+=t[o]||"":(v.push({text:n,width:e.$undoPixelRatio(e.measureText(n).width)}),n=t[o]||"",w++),!((w+1)*u>c));o++)if(t.length-1===o&&(w+1)*u<c){v.push({text:n,width:e.$undoPixelRatio(e.measureText(n).width)}),i<f.length-1&&w++;break}}else v.push({text:"",width:0})}));let m=0;v.length*u<c&&("top"===t.detail.verticalAlign?m=0:"bottom"===t.detail.verticalAlign?m+=c-v.length*u:m+=(c-v.length*u)/2);{const t=l+m;void 0!==n.textShadowColor&&i(n.textShadowColor)&&(e.shadowColor=n.textShadowColor),void 0!==n.textShadowOffsetX&&g.number(n.textShadowOffsetX)&&(e.shadowOffsetX=n.textShadowOffsetX),void 0!==n.textShadowOffsetY&&g.number(n.textShadowOffsetY)&&(e.shadowOffsetY=n.textShadowOffsetY),void 0!==n.textShadowBlur&&g.number(n.textShadowBlur)&&(e.shadowBlur=n.textShadowBlur),v.forEach(((i,o)=>{let a=s;"center"===n.textAlign?a=s+(h-i.width)/2:"right"===n.textAlign&&(a=s+(h-i.width)),e.fillText(i.text,a,t+u*o)}))}}})}))}(e,t,n);break;case"image":!function(e,t,i){const n=i.loader.getContent(t.uuid),{calculator:o,viewScaleInfo:a,viewSizeInfo:r}=i,{x:s,y:l,w:h,h:c,angle:d}=o.elementSize(t,a,r);x(e,{x:s,y:l,w:h,h:c,angle:d},(()=>{n||i.loader.load(t,i.elementAssets||{}),"image"===t.type&&n&&e.drawImage(n,s,l,h,c)}))}(e,t,n);break;case"svg":!function(e,t,i){const n=i.loader.getContent(t.uuid),{calculator:o,viewScaleInfo:a,viewSizeInfo:r}=i,{x:s,y:l,w:h,h:c,angle:d}=o.elementSize(t,a,r);x(e,{x:s,y:l,w:h,h:c,angle:d},(()=>{n||i.loader.load(t,i.elementAssets||{}),"svg"===t.type&&n&&e.drawImage(n,s,l,h,c)}))}(e,t,n);break;case"html":!function(e,t,i){const n=i.loader.getContent(t.uuid),{calculator:o,viewScaleInfo:a,viewSizeInfo:r}=i,{x:s,y:l,w:h,h:c,angle:d}=o.elementSize(t,a,r);x(e,{x:s,y:l,w:h,h:c,angle:d},(()=>{n||i.loader.load(t),"html"===t.type&&n&&e.drawImage(n,s,l,h,c)}))}(e,t,n);break;case"path":!function(e,t,i){const{detail:n}=t,{originX:o,originY:a,originW:r,originH:s}=n,{calculator:l,viewScaleInfo:h,viewSizeInfo:c}=i,{x:d,y:u,w:f,h:v,angle:g}=l.elementSize(t,h,c),w=f/r,m=v/s,_=d-o*w,S=u-a*m,p=h.scale*c.devicePixelRatio,y=Object.assign(Object.assign({},t),{x:d,y:u,w:f,h:v,angle:g});x(e,{x:d,y:u,w:f,h:v,angle:g},(()=>{P(e,y,{originElem:t,calcElemSize:{x:d,y:u,w:f,h:v,angle:g},viewScaleInfo:h,viewSizeInfo:c,renderContent:()=>{T(e,y,{viewScaleInfo:h,viewSizeInfo:c,renderContent:()=>{e.save(),e.translate(_,S),e.scale(p*w/h.scale,p*m/h.scale);const t=M(n.commands||[]),i=new Path2D(t);n.fill&&(e.fillStyle=n.fill,e.fill(i)),n.stroke&&0!==n.strokeWidth&&(e.strokeStyle=n.stroke,e.lineWidth=(n.strokeWidth||1)/c.devicePixelRatio,e.lineCap=n.strokeLineCap||"square",e.stroke(i)),e.translate(-_,-S),e.restore()}})}})}))}(e,t,n);break;case"group":!function(e,t,i){const{calculator:n,viewScaleInfo:o,viewSizeInfo:a}=i,{x:r,y:s,w:l,h:h,angle:c}=n.elementSize({x:t.x,y:t.y,w:t.w,h:t.h,angle:t.angle},o,a),d=Object.assign(Object.assign({},t),{x:r,y:s,w:l,h:h,angle:c});x(e,{x:r,y:s,w:l,h:h,angle:c},(()=>{P(e,d,{originElem:t,calcElemSize:{x:r,y:s,w:l,h:h,angle:c},viewScaleInfo:o,viewSizeInfo:a,renderContent:()=>{if(Array.isArray(t.detail.children)){const{parentElementSize:n}=i,o={x:n.x+t.x,y:n.y+t.y,w:t.w||n.w,h:t.h||n.h,angle:t.angle},{calculator:a}=i;"hidden"===t.detail.overflow&&(e.save(),e.beginPath(),e.moveTo(r,s),e.lineTo(r+l,s),e.lineTo(r+l,s+h),e.lineTo(r,s+h),e.closePath(),e.clip());for(let n=0;n<t.detail.children.length;n++){let r=t.detail.children[n];if(r=Object.assign(Object.assign({},r),{x:o.x+r.x,y:o.y+r.y}),a.isElementInView(r,i.viewScaleInfo,i.viewSizeInfo))try{z(e,r,Object.assign({},i))}catch(e){console.error(e)}}e.restore()}}})}))}(e,t,n)}}catch(e){console.error(e)}}var O=globalThis&&globalThis.__awaiter||function(e,t,i,n){return new(i||(i=Promise))((function(o,a){function r(e){try{l(n.next(e))}catch(e){a(e)}}function s(e){try{l(n.throw(e))}catch(e){a(e)}}function l(e){var t;e.done?o(e.value):(t=e.value,t instanceof i?t:new i((function(e){e(t)}))).then(r,s)}l((n=n.apply(e,t||[])).next())}))};const C=["image","svg","html"];class j extends w{constructor(){super(),this._loadFuncMap={},this._currentLoadItemMap={},this._storageLoadItemMap={},this._registerLoadFunc("image",((e,t)=>O(this,void 0,void 0,(function*(){var i;const n=(null===(i=t[e.detail.src])||void 0===i?void 0:i.value)||e.detail.src,o=yield l(n);return{uuid:e.uuid,lastModified:Date.now(),content:o}})))),this._registerLoadFunc("html",((e,t)=>O(this,void 0,void 0,(function*(){var i;const n=(null===(i=t[e.detail.html])||void 0===i?void 0:i.value)||e.detail.html,o=yield c(n,{width:e.detail.width||e.w,height:e.detail.height||e.h});return{uuid:e.uuid,lastModified:Date.now(),content:o}})))),this._registerLoadFunc("svg",((e,t)=>O(this,void 0,void 0,(function*(){var i;const n=(null===(i=t[e.detail.svg])||void 0===i?void 0:i.value)||e.detail.svg,o=yield h(n);return{uuid:e.uuid,lastModified:Date.now(),content:o}}))))}_registerLoadFunc(e,t){this._loadFuncMap[e]=t}_getLoadElementSource(e){var t,i,n;let o=null;return"image"===e.type?o=(null===(t=null==e?void 0:e.detail)||void 0===t?void 0:t.src)||null:"svg"===e.type?o=(null===(i=null==e?void 0:e.detail)||void 0===i?void 0:i.svg)||null:"html"===e.type&&(o=(null===(n=null==e?void 0:e.detail)||void 0===n?void 0:n.html)||null),o}_createLoadItem(e){return{element:e,status:"null",content:null,error:null,startTime:-1,endTime:-1,source:this._getLoadElementSource(e)}}_emitLoad(e){const t=e.element.uuid,i=this._storageLoadItemMap[t];i?i.startTime<e.startTime&&(this._storageLoadItemMap[t]=e,this.trigger("load",Object.assign(Object.assign({},e),{countTime:e.endTime-e.startTime}))):(this._storageLoadItemMap[t]=e,this.trigger("load",Object.assign(Object.assign({},e),{countTime:e.endTime-e.startTime})))}_emitError(e){const t=e.element.uuid,i=this._storageLoadItemMap[t];i?i.startTime<e.startTime&&(this._storageLoadItemMap[t]=e,this.trigger("error",Object.assign(Object.assign({},e),{countTime:e.endTime-e.startTime}))):(this._storageLoadItemMap[t]=e,this.trigger("error",Object.assign(Object.assign({},e),{countTime:e.endTime-e.startTime})))}_loadResource(e,t){const i=this._createLoadItem(e);this._currentLoadItemMap[e.uuid]=i;const n=this._loadFuncMap[e.type];"function"==typeof n&&(i.startTime=Date.now(),n(e,t).then((e=>{i.content=e.content,i.endTime=Date.now(),i.status="load",this._emitLoad(i)})).catch((t=>{console.warn(`Load element source "${i.source}" fail`,t,e),i.endTime=Date.now(),i.status="error",i.error=t,this._emitError(i)})))}_isExistingErrorStorage(e){var t;const i=null===(t=this._currentLoadItemMap)||void 0===t?void 0:t[null==e?void 0:e.uuid];return!(!i||"error"!==i.status||!i.source||i.source!==this._getLoadElementSource(e))}load(e,t){if(!this._isExistingErrorStorage(e)&&C.includes(e.type)){const i=n(e);this._loadResource(i,t)}}getContent(e){var t,i;return(null===(i=null===(t=this._storageLoadItemMap)||void 0===t?void 0:t[e])||void 0===i?void 0:i.content)||null}}class A extends w{constructor(e){super(),this._loader=new j,this._opts=e,this._init()}_init(){const{_loader:e}=this;e.on("load",(e=>{this.trigger("load",e)})),e.on("error",(()=>{}))}updateOptions(e){this._opts=e}drawData(e,t){const{_loader:i}=this,{calculator:n}=this._opts,{viewContext:o}=this._opts.viewContent;o.clearRect(0,0,o.canvas.width,o.canvas.height);const a={x:0,y:0,w:t.viewSizeInfo.width,h:t.viewSizeInfo.height};!function(e,t,i){const{elements:n=[]}=t;for(let t=0;t<n.length;t++){const o=n[t];if(i.calculator.isElementInView(o,i.viewScaleInfo,i.viewSizeInfo))try{z(e,o,i)}catch(e){console.error(e)}}}(o,e,Object.assign({loader:i,calculator:n,parentElementSize:a,elementAssets:e.assets},t))}scale(e){const{sharer:t}=this._opts,{data:i,offsetTop:n,offsetBottom:o,offsetLeft:a,offsetRight:r,width:s,height:l,contextHeight:h,contextWidth:c,devicePixelRatio:d}=t.getActiveStoreSnapshot();i&&this.drawData(i,{viewScaleInfo:{scale:e,offsetTop:n,offsetBottom:o,offsetLeft:a,offsetRight:r},viewSizeInfo:{width:s,height:l,contextHeight:h,contextWidth:c,devicePixelRatio:d}})}}class E{constructor(e){this._opts=e}elementSize(e,t,i){return b(e,{viewScaleInfo:t,viewSizeInfo:i})}isElementInView(e,t,i){return function(e,t){const{viewSizeInfo:i,viewScaleInfo:n}=t,{width:o,height:a}=i,{angle:r}=e,{x:s,y:l,w:h,h:c}=b(e,{viewScaleInfo:n,viewSizeInfo:i}),d=y({x:s,y:l,w:h,h:c,angle:r}),u={x:0,y:0,w:o,h:a},f=Math.min(d[0].x,d[1].x,d[2].x,d[3].x),v=Math.min(d[0].y,d[1].y,d[2].y,d[3].y);return function(e,t){const i=e.x,n=e.y,o=e.x+e.w,a=e.y+e.h,r=t.x,s=t.y,l=t.x+t.w,h=t.y+t.h;return i<=l&&o>=r&&n<=h&&a>=s}(u,{x:f,y:v,w:Math.max(d[0].x,d[1].x,d[2].x,d[3].x)-f,h:Math.max(d[0].y,d[1].y,d[2].y,d[3].y)-v})}(e,{viewScaleInfo:t,viewSizeInfo:i})}isPointInElement(e,t,i,n){return I(e,{context2d:this._opts.viewContent.boardContext,element:t,viewScaleInfo:i,viewSizeInfo:n})}getPointElement(e,t){return function(e,t){var i,n,o;const{context2d:a,data:r,viewScaleInfo:s,viewSizeInfo:l,groupQueue:h}=t,c={index:-1,element:null,groupQueueIndex:-1};if(h&&Array.isArray(h)&&(null==h?void 0:h.length)>0)for(let t=h.length-1;t>=0;t--){let o=0,r=0,d=0;for(let e=0;e<=t;e++)o+=h[e].x,r+=h[e].y,d+=h[e].angle||0;const u=h[t];if(u&&"group"===u.type&&Array.isArray(null===(i=u.detail)||void 0===i?void 0:i.children))for(let i=0;i<u.detail.children.length;i++){const f=u.detail.children[i];if(!0!==(null===(n=null==f?void 0:f.operations)||void 0===n?void 0:n.invisible)){if(!f)break;if(I(e,{context2d:a,element:{x:o+f.x,y:r+f.y,w:f.w,h:f.h,angle:d+(f.angle||0)},viewScaleInfo:s,viewSizeInfo:l})){c.element=f,(t<h.length-1||"group"!==f.type)&&(c.groupQueueIndex=t);break}}}if(c.element)break}if(c.element)return c;for(let t=r.elements.length-1;t>=0;t--){const i=r.elements[t];if(!0!==(null===(o=null==i?void 0:i.operations)||void 0===o?void 0:o.invisible)&&I(e,{context2d:a,element:i,viewScaleInfo:s,viewSizeInfo:l})){c.index=t,c.element=i;break}}return c}(e,{...t,context2d:this._opts.viewContent.boardContext})}}function L(e){return e>0||e<0||0===e}class R extends w{constructor(e){super();const t=new m({defaultStorage:{hasPointDown:!1,prevClickPoint:null}});this._store=t,this._opts=e,this._init()}_init(){const e=window;e.addEventListener("mousemove",(e=>{if(!this._isInTarget(e))return;e.preventDefault();const t=this._getPoint(e);this._isVaildPoint(t)&&this.trigger("hover",{point:t})})),e.addEventListener("mousedown",(e=>{if(!this._isInTarget(e))return;e.preventDefault();const t=this._getPoint(e);this._isVaildPoint(t)&&(this._store.set("hasPointDown",!0),this.trigger("pointStart",{point:t}))})),e.addEventListener("mousemove",(e=>{if(!this._isInTarget(e))return;e.preventDefault(),e.stopPropagation();const t=this._getPoint(e);this._isVaildPoint(t)?!0===this._store.get("hasPointDown")&&this.trigger("pointMove",{point:t}):this._store.get("hasPointDown")&&(this.trigger("pointLeave",{point:t}),this._store.set("hasPointDown",!1))})),e.addEventListener("mouseup",(e=>{if(this._store.set("hasPointDown",!1),!this._isInTarget(e))return;e.preventDefault();const t=this._getPoint(e);this.trigger("pointEnd",{point:t})})),e.addEventListener("mouseleave",(e=>{if(this._store.set("hasPointDown",!1),!this._isInTarget(e))return;e.preventDefault();const t=this._getPoint(e);this.trigger("pointLeave",{point:t})})),e.addEventListener("wheel",(e=>{if(!this._isInTarget(e))return;const t=this._getPoint(e);if(!this._isVaildPoint(t))return;e.preventDefault();const i=e.deltaX>0||e.deltaX<0?e.deltaX:0,n=e.deltaY>0||e.deltaY<0?e.deltaY:0;!0===e.ctrlKey&&this.has("wheelScale")?this.trigger("wheelScale",{deltaX:i,deltaY:n,point:t}):this.has("wheelX")&&0!==i?this.trigger("wheelX",{deltaX:i,point:t}):this.has("wheelY")&&0!==n&&this.trigger("wheelY",{deltaY:n,point:t})}),{passive:!1}),e.addEventListener("click",(e=>{if(!this._isInTarget(e))return;e.preventDefault();const t=this._getPoint(e);if(!this._isVaildPoint(t))return;const i=Date.now(),n=this._store.get("prevClickPoint");n&&i-n.t<=500&&Math.abs(n.x-t.x)<=5&&Math.abs(n.y-t.y)<=5?this.trigger("doubleClick",{point:t}):this._store.set("prevClickPoint",t)})),e.addEventListener("contextmenu",(e=>{if(!this._isInTarget(e))return;e.preventDefault();const t=this._getPoint(e);this._isVaildPoint(t)}))}_isInTarget(e){return e.target===this._opts.viewContent.boardContext.canvas}_getPoint(e){const t=this._opts.viewContent.boardContext.canvas.getBoundingClientRect();return{x:e.clientX-t.left,y:e.clientY-t.top,t:Date.now()}}_isVaildPoint(e){const t=this._opts.sharer.getActiveViewSizeInfo(),{width:i,height:n}=t;return!!(L(e.x)&&L(e.y)&&e.x<=i&&e.y<=n)}}const D={width:0,height:0,devicePixelRatio:1,contextWidth:0,contextHeight:0,data:null,scale:1,offsetLeft:0,offsetRight:0,offsetTop:0,offsetBottom:0};class k{constructor(){const e=new m({defaultStorage:D}),t=new m({defaultStorage:{}});this._activeStore=e,this._sharedStore=t}getActiveStorage(e){return this._activeStore.get(e)}setActiveStorage(e,t){return this._activeStore.set(e,t)}getActiveStoreSnapshot(){return this._activeStore.getSnapshot()}getSharedStorage(e){return this._sharedStore.get(e)}setSharedStorage(e,t){return this._sharedStore.set(e,t)}getSharedStoreSnapshot(){return this._sharedStore.getSnapshot()}getActiveViewScaleInfo(){return{scale:this._activeStore.get("scale"),offsetTop:this._activeStore.get("offsetTop"),offsetBottom:this._activeStore.get("offsetBottom"),offsetLeft:this._activeStore.get("offsetLeft"),offsetRight:this._activeStore.get("offsetRight")}}setActiveViewScaleInfo(e){const{scale:t,offsetTop:i,offsetBottom:n,offsetLeft:o,offsetRight:a}=e;this._activeStore.set("scale",t),this._activeStore.set("offsetTop",i),this._activeStore.set("offsetBottom",n),this._activeStore.set("offsetLeft",o),this._activeStore.set("offsetRight",a)}setActiveViewSizeInfo(e){this._activeStore.set("width",e.width),this._activeStore.set("height",e.height),this._activeStore.set("devicePixelRatio",e.devicePixelRatio),this._activeStore.set("contextWidth",e.contextWidth),this._activeStore.set("contextHeight",e.contextHeight)}getActiveViewSizeInfo(){return{width:this._activeStore.get("width"),height:this._activeStore.get("height"),devicePixelRatio:this._activeStore.get("devicePixelRatio"),contextWidth:this._activeStore.get("contextWidth"),contextHeight:this._activeStore.get("contextHeight")}}}const{requestAnimationFrame:F}=window;class W extends w{constructor(e){super(),this._drawFrameSnapshotQueue=[],this._drawFrameStatus="FREE",this._opts=e,this._init()}_init(){const{renderer:e}=this._opts;e.on("load",(()=>{this.drawFrame()}))}_drawAnimationFrame(){if("DRAWING"===this._drawFrameStatus||0===this._drawFrameSnapshotQueue.length)return;this._drawFrameStatus="DRAWING";const e=this._drawFrameSnapshotQueue.shift(),{renderer:t,viewContent:i,beforeDrawFrame:n,afterDrawFrame:o}=this._opts;if(e){const{scale:a,offsetTop:r,offsetBottom:s,offsetLeft:l,offsetRight:h,width:c,height:d,contextHeight:u,contextWidth:f,devicePixelRatio:v}=e.activeStore,{viewContext:g,helperContext:w,boardContext:m}=i;(null==e?void 0:e.activeStore.data)&&t.drawData(e.activeStore.data,{viewScaleInfo:{scale:a,offsetTop:r,offsetBottom:s,offsetLeft:l,offsetRight:h},viewSizeInfo:{width:c,height:d,contextHeight:u,contextWidth:f,devicePixelRatio:v}}),n({snapshot:e}),m.clearRect(0,0,c,d),m.drawImage(g.canvas,0,0,c,d),m.drawImage(w.canvas,0,0,c,d),g.clearRect(0,0,c,d),w.clearRect(0,0,c,d),o({snapshot:e})}0!==this._drawFrameSnapshotQueue.length?(this._drawFrameStatus="DRAWING")&&F((()=>{this._drawAnimationFrame()})):this._drawFrameStatus="COMPLETE"}drawFrame(){const{sharer:e}=this._opts,t=e.getActiveStoreSnapshot(),i=e.getSharedStoreSnapshot();this._drawFrameSnapshotQueue.push({activeStore:t,sharedStore:i}),this._drawAnimationFrame()}scale(e){const{scale:t,point:i}=e,{sharer:n}=this._opts,{moveX:o,moveY:a}=function(e){const{scale:t,point:i,viewScaleInfo:n}=e,{offsetLeft:o,offsetTop:a}=n,r=t/n.scale,s=i.x,l=i.y;return{moveX:s-s*r+(o*r-o),moveY:l-l*r+(a*r-a)}}({scale:t,point:i,viewScaleInfo:n.getActiveViewScaleInfo(),viewSizeInfo:n.getActiveViewSizeInfo()});return n.setActiveStorage("scale",t),{moveX:o,moveY:a}}scroll(e){const{sharer:t}=this._opts,i=t.getActiveViewScaleInfo(),{moveX:n,moveY:o}=e,a=function(e){const{moveX:t=0,moveY:i=0,viewScaleInfo:n,viewSizeInfo:o}=e,{scale:a}=n,{width:r,height:s,contextWidth:l,contextHeight:h}=o;let c=n.offsetLeft,d=n.offsetRight,u=n.offsetTop,f=n.offsetBottom;return c+=t,u+=i,d=r-(l*a+c),f=s-(h*a+u),{scale:a,offsetTop:u,offsetLeft:c,offsetRight:d,offsetBottom:f}}({moveX:n,moveY:o,viewScaleInfo:i,viewSizeInfo:t.getActiveViewSizeInfo()});return t.setActiveViewScaleInfo(a),a}resize(e={}){const{sharer:t}=this._opts,i={...t.getActiveViewSizeInfo(),...e},{width:n,height:o,devicePixelRatio:a}=i,{boardContext:r,helperContext:s,viewContext:l}=this._opts.viewContent;return r.canvas.width=n*a,r.canvas.height=o*a,r.canvas.style.width=`${n}px`,r.canvas.style.height=`${o}px`,s.canvas.width=n*a,s.canvas.height=o*a,l.canvas.width=n*a,l.canvas.height=o*a,t.setActiveViewSizeInfo(i),i}}const X=["RULER"];return e.Board=class{constructor(e){this._middlewares=[],this._middlewareObjs=[],this._activeMiddlewareObjs=[],this._eventHub=new w,this._activeMode="SELECT";const{viewContent:t}=e,i=new k,n=new E({viewContent:t}),o=new R({viewContent:t,sharer:i}),a=new A({viewContent:t,sharer:i,calculator:n});this._opts=e,this._sharer=i,this._renderer=a,this._watcher=o,this._calculator=n,this._viewer=new W({viewContent:e.viewContent,sharer:i,renderer:a,calculator:n,beforeDrawFrame:e=>{this._handleBeforeDrawFrame(e)},afterDrawFrame:e=>{this._handleAfterDrawFrame(e)}}),this._init(),this._resetActiveMiddlewareObjs()}_init(){this._watcher.on("pointStart",this._handlePointStart.bind(this)),this._watcher.on("pointEnd",this._handlePointEnd.bind(this)),this._watcher.on("pointMove",t((e=>{this._handlePointMove(e)}),16)),this._watcher.on("hover",t((e=>{this._handleHover(e)}),16)),this._watcher.on("wheelX",t((e=>{this._handleWheelX(e)}),16)),this._watcher.on("wheelY",t((e=>{this._handleWheelY(e)}),16)),this._watcher.on("wheelScale",t((e=>{this._handleWheelScale(e)}),16)),this._watcher.on("scrollX",this._handleScrollX.bind(this)),this._watcher.on("scrollY",this._handleScrollY.bind(this)),this._watcher.on("resize",this._handleResize.bind(this)),this._watcher.on("doubleClick",this._handleDoubleClick.bind(this))}_handlePointStart(e){var t;for(let i=0;i<this._activeMiddlewareObjs.length;i++){const n=this._activeMiddlewareObjs[i];if(!1===(null==(t=null==n?void 0:n.pointStart)?void 0:t.call(n,e)))return}}_handlePointEnd(e){var t;for(let i=0;i<this._activeMiddlewareObjs.length;i++){const n=this._activeMiddlewareObjs[i];if(!1===(null==(t=null==n?void 0:n.pointEnd)?void 0:t.call(n,e)))return}}_handlePointMove(e){var t;for(let i=0;i<this._activeMiddlewareObjs.length;i++){const n=this._activeMiddlewareObjs[i];if(!1===(null==(t=null==n?void 0:n.pointMove)?void 0:t.call(n,e)))return}}_handleHover(e){var t;for(let i=0;i<this._activeMiddlewareObjs.length;i++){const n=this._activeMiddlewareObjs[i];if(!1===(null==(t=null==n?void 0:n.hover)?void 0:t.call(n,e)))return}}_handleDoubleClick(e){var t;for(let i=0;i<this._activeMiddlewareObjs.length;i++){const n=this._activeMiddlewareObjs[i];if(!1===(null==(t=null==n?void 0:n.doubleClick)?void 0:t.call(n,e)))return}}_handleWheelX(e){var t;for(let i=0;i<this._activeMiddlewareObjs.length;i++){const n=this._activeMiddlewareObjs[i];if(!1===(null==(t=null==n?void 0:n.wheelX)?void 0:t.call(n,e)))return}}_handleWheelY(e){var t;for(let i=0;i<this._activeMiddlewareObjs.length;i++){const n=this._activeMiddlewareObjs[i];if(!1===(null==(t=null==n?void 0:n.wheelY)?void 0:t.call(n,e)))return}}_handleWheelScale(e){var t;for(let i=0;i<this._activeMiddlewareObjs.length;i++){const n=this._activeMiddlewareObjs[i];if(!1===(null==(t=null==n?void 0:n.wheelScale)?void 0:t.call(n,e)))return}}_handleScrollX(e){var t;for(let i=0;i<this._activeMiddlewareObjs.length;i++){const n=this._activeMiddlewareObjs[i];if(!1===(null==(t=null==n?void 0:n.scrollX)?void 0:t.call(n,e)))return}}_handleScrollY(e){var t;for(let i=0;i<this._activeMiddlewareObjs.length;i++){const n=this._activeMiddlewareObjs[i];if(!1===(null==(t=null==n?void 0:n.scrollY)?void 0:t.call(n,e)))return}}_handleResize(e){var t;for(let i=0;i<this._activeMiddlewareObjs.length;i++){const n=this._activeMiddlewareObjs[i];if(!1===(null==(t=null==n?void 0:n.resize)?void 0:t.call(n,e)))return}}_handleClear(e){var t;for(let i=0;i<this._activeMiddlewareObjs.length;i++){const n=this._activeMiddlewareObjs[i];if(!1===(null==(t=null==n?void 0:n.clear)?void 0:t.call(n,e)))return}}_handleBeforeDrawFrame(e){var t;for(let i=0;i<this._activeMiddlewareObjs.length;i++){const n=this._activeMiddlewareObjs[i];if(!1===(null==(t=null==n?void 0:n.beforeDrawFrame)?void 0:t.call(n,e)))return}}_handleAfterDrawFrame(e){var t;for(let i=0;i<this._activeMiddlewareObjs.length;i++){const n=this._activeMiddlewareObjs[i];if(!1===(null==(t=null==n?void 0:n.afterDrawFrame)?void 0:t.call(n,e)))return}}_resetActiveMiddlewareObjs(){const{_activeMode:e}=this,t=[...X,e],i=[];this._middlewareObjs.forEach((e=>{(!0===e.isDefault||t.includes(e.mode))&&i.push(e)})),this._activeMiddlewareObjs=i}getSharer(){return this._sharer}setData(e){const t=this._sharer;this._sharer.setActiveStorage("data",e);const i=t.getActiveViewSizeInfo(),n=function(e,t){const i={x:0,y:0,w:0,h:0};e.forEach((e=>{const t={x:e.x,y:e.y,w:e.w,h:e.h,angle:e.angle};if(t.angle&&(t.angle>0||t.angle<0)){const e=y(t);if(4===e.length){const i=[e[0].x,e[1].x,e[2].x,e[3].x],n=[e[0].y,e[1].y,e[2].y,e[3].y];t.x=Math.min(...i),t.y=Math.min(...n),t.w=Math.abs(Math.max(...i)-Math.min(...i)),t.h=Math.abs(Math.max(...n)-Math.min(...n))}}const n=Math.min(t.x,i.x),o=Math.min(t.y,i.y),a=Math.max(t.x+t.w,i.x+i.w),r=Math.max(t.y+t.h,i.y+i.h);i.x=n,i.y=o,i.w=Math.abs(a-n),i.h=Math.abs(r-o)})),(null==t?void 0:t.extend)&&(i.x=Math.min(i.x,0),i.y=Math.min(i.y,0));const n={contextWidth:i.w,contextHeight:i.h};return(null==t?void 0:t.viewWidth)&&(null==t?void 0:t.viewHeight)&&(null==t?void 0:t.viewWidth)>0&&(null==t?void 0:t.viewHeight)>0&&(t.viewWidth>i.x+i.w&&(n.contextWidth=t.viewWidth-i.x),t.viewHeight>i.y+i.h&&(n.contextHeight=t.viewHeight-i.y)),n}(e.elements,{viewWidth:i.width,viewHeight:i.height,extend:!0});this._viewer.drawFrame();const o={...i,...n};return this._sharer.setActiveViewSizeInfo(o),{viewSizeInfo:o}}getData(){const{data:e}=this._sharer.getActiveStoreSnapshot();return e}use(e){const{viewContent:t}=this._opts,{_sharer:i,_viewer:n,_calculator:o,_eventHub:a}=this,r=e({viewContent:t,sharer:i,viewer:n,calculator:o,eventHub:a});this._middlewares.push(e),this._activeMiddlewareObjs.push(r)}scale(e){const{_viewer:t}=this,{moveX:i,moveY:n}=t.scale(e);t.scroll({moveX:i,moveY:n})}scroll(e){return this._viewer.scroll(e)}resize(e){const t=this._viewer.resize(e),{width:i,height:n,devicePixelRatio:o}=e,{viewContent:a}=this._opts;a.viewContext.$resize({width:i,height:n,devicePixelRatio:o});const r=a.viewContext.canvas;r.style.width=`${i}px`,r.style.height=`${n}px`,a.helperContext.$resize({width:i,height:n,devicePixelRatio:o}),a.boardContext.$resize({width:i,height:n,devicePixelRatio:o}),this._viewer.drawFrame(),this._watcher.trigger("resize",t),this._sharer.setActiveViewSizeInfo(e)}clear(){const{viewContent:e}=this._opts,{helperContext:t,viewContext:i,boardContext:n}=e;t.clearRect(0,0,t.canvas.width,t.canvas.height),i.clearRect(0,0,i.canvas.width,i.canvas.height),n.clearRect(0,0,n.canvas.width,n.canvas.height),this._handleClear()}getEventHub(){return this._eventHub}},Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),e}({});
var iDrawBoard=function(e){"use strict";function t(e,t){let i=-1;return function(...n){i>0||(i=setTimeout((()=>{e(...n),i=-1}),t))}}function i(e){return"string"==typeof e&&(/^\#([0-9a-f]{3}|[0-9a-f]{6}|[0-9a-f]{8})$/i.test(e)||/^[a-z]{1,}$/i.test(e))}function n(e,t){if(1===t)return e;let i=1;const n=/^\#[0-9a-f]{6,6}$/i;let o=e;if(n.test(e)?i=parseInt(e.substring(5,7).replace(/^\#/,"0x")):/^\#[0-9a-f]{8,8}$/i.test(e)&&(i=parseInt(e.substring(7,9).replace(/^\#/,"0x")),o=e.substring(0,7)),i*=t,n.test(o)&&i>0&&i<1){const e=Math.max(0,Math.min(255,Math.ceil(256*i)));o=`${o.toUpperCase()}${e.toString(16).toUpperCase()}`}return o}function o(){function e(){return(65536*(1+Math.random())|0).toString(16).substring(1)}return`${e()}${e()}-${e()}-${e()}-${e()}-${e()}${e()}${e()}`}function a(e){let t=0;for(let i=0;i<e.length;i++)t+=e.charCodeAt(i)*e.charCodeAt(i)*i*i;return t.toString(16).substring(0,4)}function r(e){const t=e.length,i=Math.floor(t/2),n=e.substring(0,4).padEnd(4,"0"),o=e.substring(0,4).padEnd(4,"0");return`@assets/${a(t.toString(16).padEnd(4,n))}${a(e.substring(i-4,i).padEnd(4,n)).padEnd(4,"f")}-${a(e.substring(i-8,i-4).padEnd(4,n)).padEnd(4,"f")}-${a(e.substring(i-12,i-8).padEnd(4,n)).padEnd(4,"f")}-${a(e.substring(i-16,i-12).padEnd(4,o)).padEnd(4,"f")}-${a(e.substring(i,i+4).padEnd(4,o)).padEnd(4,"f")}${a(e.substring(i+4,i+8).padEnd(4,o)).padEnd(4,"f")}${a(o.padEnd(4,n).padEnd(4,o))}`}function s(e){return function e(t){const i=function(e){return Object.prototype.toString.call(e).replace(/[\]|\[]{1,1}/gi,"").split(" ")[1]}(t);if(["Null","Number","String","Boolean","Undefined"].indexOf(i)>=0)return t;if("Array"===i){const i=[];return t.forEach((t=>{i.push(e(t))})),i}if("Object"===i){const i={};Object.keys(t).forEach((n=>{i[n]=e(t[n])}));return Object.getOwnPropertySymbols(t).forEach((n=>{i[n]=e(t[n])})),i}}(e)}function l(e){return(Object.prototype.toString.call(e)||"").replace(/(\[object|\])/gi,"").trim()}const h={type(e,t){const i=l(e);return!0===t?i.toLocaleLowerCase():i},array:e=>"Array"===l(e),json:e=>"Object"===l(e),function:e=>"Function"===l(e),asyncFunction:e=>"AsyncFunction"===l(e),string:e=>"String"===l(e),number:e=>"Number"===l(e),undefined:e=>"Undefined"===l(e),null:e=>"Null"===l(e),promise:e=>"Promise"===l(e)};var c=function(e,t,i,n){return new(i||(i=Promise))((function(o,a){function r(e){try{l(n.next(e))}catch(e){a(e)}}function s(e){try{l(n.throw(e))}catch(e){a(e)}}function l(e){var t;e.done?o(e.value):(t=e.value,t instanceof i?t:new i((function(e){e(t)}))).then(r,s)}l((n=n.apply(e,t||[])).next())}))};const{Image:d}=window;function f(e){return new Promise(((t,i)=>{const n=new d;n.crossOrigin="anonymous",n.onload=function(){t(n)},n.onabort=i,n.onerror=i,n.src=e}))}function u(e){return c(this,void 0,void 0,(function*(){const t=yield function(e){return new Promise(((t,i)=>{const n=new Blob([e],{type:"image/svg+xml;charset=utf-8"}),o=new FileReader;o.readAsDataURL(n),o.onload=function(e){var i;const n=null===(i=null==e?void 0:e.target)||void 0===i?void 0:i.result;t(n)},o.onerror=function(e){i(e)}}))}(e);return yield f(t)}))}function v(e,t){return c(this,void 0,void 0,(function*(){e=e.replace(/\&/gi,"&amp;");const i=yield function(e,t){const{width:i,height:n}=t;return new Promise(((t,o)=>{const a=new Blob([`\n <svg \n xmlns="http://www.w3.org/2000/svg" \n width="${i||""}" \n height = "${n||""}">\n <foreignObject width="100%" height="100%">\n <div xmlns = "http://www.w3.org/1999/xhtml">\n ${e}\n </div>\n </foreignObject>\n </svg>\n `],{type:"image/svg+xml;charset=utf-8"}),r=new FileReader;r.readAsDataURL(a),r.onload=function(e){var i;const n=null===(i=null==e?void 0:e.target)||void 0===i?void 0:i.result;t(n)},r.onerror=function(e){o(e)}}))}(e,t);return yield f(i)}))}function g(e){return"number"==typeof e&&(e>0||e<=0)}function w(e){return"number"==typeof e&&e>=0}function p(e){return"string"==typeof e&&/^(http:\/\/|https:\/\/|\.\/|\/)/.test(`${e}`)}function m(e){return"string"==typeof e&&/^(data:image\/)/.test(`${e}`)}const x={x:function(e){return g(e)},y:function(e){return g(e)},w:w,h:function(e){return"number"==typeof e&&e>=0},angle:function(e){return"number"==typeof e&&e>=-360&&e<=360},number:g,numberStr:function(e){return/^(-?\d+(?:\.\d+)?)$/.test(`${e}`)},borderWidth:function(e){return w(e)},borderRadius:function(e){return g(e)&&e>=0},color:function(e){return i(e)},imageSrc:function(e){return m(e)||p(e)},imageURL:p,imageBase64:m,svg:function(e){return"string"==typeof e&&/^(<svg[\s]{1,}|<svg>)/i.test(`${e}`.trim())&&/<\/[\s]{0,}svg>$/i.test(`${e}`.trim())},html:function(e){let t=!1;if("string"==typeof e){let i=document.createElement("div");i.innerHTML=e,i.children.length>0&&(t=!0),i=null}return t},text:function(e){return"string"==typeof e},fontSize:function(e){return g(e)&&e>0},lineHeight:function(e){return g(e)&&e>0},textAlign:function(e){return["center","left","right"].includes(e)},fontFamily:function(e){return"string"==typeof e&&e.length>0},fontWeight:function(e){return["bold"].includes(e)},strokeWidth:function(e){return g(e)&&e>0}};class S{constructor(){this._listeners=new Map}on(e,t){if(this._listeners.has(e)){const i=this._listeners.get(e)||[];null==i||i.push(t),this._listeners.set(e,i)}else this._listeners.set(e,[t])}off(e,t){if(this._listeners.has(e)){const i=this._listeners.get(e);if(Array.isArray(i))for(let e=0;e<(null==i?void 0:i.length);e++)if(i[e]===t){i.splice(e,1);break}this._listeners.set(e,i||[])}}trigger(e,t){const i=this._listeners.get(e);return!!Array.isArray(i)&&(i.forEach((e=>{e(t)})),!0)}has(e){if(this._listeners.has(e)){const t=this._listeners.get(e);if(Array.isArray(t)&&t.length>0)return!0}return!1}}class y{constructor(e){this._backUpDefaultStorage=s(e.defaultStorage),this._temp=this._createTempStorage()}set(e,t){this._temp[e]=t}get(e){return this._temp[e]}getSnapshot(){return s(this._temp)}clear(){this._temp=this._createTempStorage()}_createTempStorage(){return s(this._backUpDefaultStorage)}}function b(e){return e/180*Math.PI}function _(e,t,i){const n=I(t);!function(e,t,i,n){const o=b(t||0);i&&(o>0||o<0)&&(e.translate(i.x,i.y),e.rotate(o),e.translate(-i.x,-i.y)),n(e),i&&(o>0||o<0)&&(e.translate(i.x,i.y),e.rotate(-o),e.translate(-i.x,-i.y))}(e,t.angle||0,n,(()=>{i(e)}))}function I(e){return{x:e.x+e.w/2,y:e.y+e.h/2}}function M(e,t,i){const n=function(e,t){const i=t.x-e.x,n=t.y-e.y;if(0===i){if(n<0)return 0;if(n>0)return Math.PI}else if(0===n){if(i<0)return 3*Math.PI/2;if(i>0)return Math.PI/2}return i>0&&n<0?Math.atan(Math.abs(i)/Math.abs(n)):i>0&&n>0?Math.PI-Math.atan(Math.abs(i)/Math.abs(n)):i<0&&n>0?Math.PI+Math.atan(Math.abs(i)/Math.abs(n)):i<0&&n<0?2*Math.PI-Math.atan(Math.abs(i)/Math.abs(n)):0}(e,t);let o=n+i;o>2*Math.PI?o-=2*Math.PI:o<0-2*Math.PI&&(o+=2*Math.PI),o<0&&(o+=2*Math.PI);const a=function(e,t){const i=(e.x-t.x)*(e.x-t.x)+(e.y-t.y)*(e.y-t.y);return 0===i?i:Math.sqrt(i)}(e,t);let r=0,s=0;return 0===o?(r=0,s=0-a):o>0&&o<Math.PI/2?(r=Math.sin(o)*a,s=0-Math.cos(o)*a):o===Math.PI/2?(r=a,s=0):o>Math.PI/2&&o<Math.PI?(r=Math.sin(Math.PI-o)*a,s=Math.cos(Math.PI-o)*a):o===Math.PI?(r=0,s=a):o>Math.PI&&o<1.5*Math.PI?(r=0-Math.sin(o-Math.PI)*a,s=Math.cos(o-Math.PI)*a):o===1.5*Math.PI?(r=0-a,s=0):o>1.5*Math.PI&&o<2*Math.PI?(r=0-Math.sin(2*Math.PI-o)*a,s=0-Math.cos(2*Math.PI-o)*a):o===2*Math.PI&&(r=0,s=0-a),r+=e.x,s+=e.y,{x:r,y:s}}function P(e){const{angle:t=0}=e;return function(e,t,i){const{x:n,y:o,w:a,h:r}=e;let s={x:n,y:o},l={x:n+a,y:o},h={x:n+a,y:o+r},c={x:n,y:o+r};if(i&&(i>0||i<0)){const e=b(function(e){if(!(e>0||e<0)||0===e)return 0;let t=e%360;return t<0&&(t+=360),t}(i));s=M(t,s,e),l=M(t,l,e),h=M(t,h,e),c=M(t,c,e)}return[s,l,h,c]}(e,I(e),t)}function z(e,t){const{viewScaleInfo:i}=t,{x:n,y:o,w:a,h:r,angle:s}=e,{scale:l,offsetTop:h,offsetLeft:c}=i;return{x:n*l+c,y:o*l+h,w:a*l,h:r*l,angle:s}}function C(e,t){const{context2d:i,element:n,viewScaleInfo:o,viewSizeInfo:a}=t,{angle:r=0}=n,{x:s,y:l,w:h,h:c}=z(n,{viewScaleInfo:o,viewSizeInfo:a}),d=P({x:s,y:l,w:h,h:c,angle:r});if(d.length>=2){i.beginPath(),i.moveTo(d[0].x,d[0].y);for(let e=1;e<d.length;e++)i.lineTo(d[e].x,d[e].y);i.closePath()}return!!i.isPointInPath(e.x,e.y)}function O(e){let t="";return e.forEach((e=>{t+=e.type+e.params.join(" ")})),t}const A={boxSizing:"border-box",borderWidth:0,borderColor:"#000000",shadowColor:"#000000",borderRadius:0,borderDash:[],shadowOffsetX:0,shadowOffsetY:0,shadowBlur:0,opacity:1,color:"#000000",textAlign:"left",verticalAlign:"top",fontSize:16,lineHeight:20,fontFamily:"sans-serif",fontWeight:400};function E(e,t){const{viewScaleInfo:i}=t,{scale:n}=i;let{borderRadius:o,boxSizing:a=A.boxSizing,borderWidth:r}=e.detail;"number"!=typeof r&&(o=0);let{x:s,y:l,w:h,h:c}=e,d=[0,0,0,0];if("number"==typeof o){const e=o*n;d=[e,e,e,e]}else Array.isArray(o)&&4===(null==o?void 0:o.length)&&(d=[o[0]*n,o[1]*n,o[2]*n,o[3]*n]);let f=0;return"number"==typeof r&&(f=(r||1)*n),"border-box"===a?(s=e.x+f/2,l=e.y+f/2,h=e.w-f,c=e.h-f):"content-box"===a?(s=e.x-f/2,l=e.y-f/2,h=e.w+f,c=e.h+f):(s=e.x,l=e.y,h=e.w,c=e.h),{x:s,y:l,w:h,h:c,radiusList:d}}function T(e,t,i){if("string"==typeof t)return t;const{viewElementSize:o,viewScaleInfo:a,opacity:r=1}=i,{x:s,y:l}=o,{scale:h}=a;if("linear-gradient"===(null==t?void 0:t.type)){const{start:i,end:o,stops:a}=t,c={x:s+i.x*h,y:l+i.y*h},d={x:s+o.x*h,y:l+o.y*h},f=e.createLinearGradient(c.x,c.y,d.x,d.y);return a.forEach((e=>{f.addColorStop(e.offset,n(e.color,r))})),f}if("radial-gradient"===(null==t?void 0:t.type)){const{inner:i,outer:o,stops:a}=t,c={x:s+i.x*h,y:l+i.y*h,radius:i.radius*h},d={x:s+o.x*h,y:l+o.y*h,radius:o.radius*h},f=e.createRadialGradient(c.x,c.y,c.radius,d.x,d.y,d.radius);return a.forEach((e=>{f.addColorStop(e.offset,n(e.color,r))})),f}return"#000000"}const j={boxSizing:"border-box",borderWidth:0,borderColor:"#000000",shadowColor:"#000000",borderRadius:0,borderDash:[],shadowOffsetX:0,shadowOffsetY:0,shadowBlur:0,opacity:1,color:"#000000",textAlign:"left",verticalAlign:"top",fontSize:16,lineHeight:20,fontFamily:"sans-serif",fontWeight:400};function R(e,t,n){const{pattern:o,renderContent:a,originElem:r,calcElemSize:s,viewScaleInfo:l,viewSizeInfo:c}=n||{};!function(e,t,i){const{renderContent:n,originElem:o,calcElemSize:a,viewScaleInfo:r,viewSizeInfo:s}=i,l=r.scale*s.devicePixelRatio,{clipPath:h}=(null==o?void 0:o.detail)||{};if(h&&a&&h.commands){const{x:i,y:o,w:r,h:s}=a,{originW:c,originH:d,originX:f,originY:u}=h,v=r/c,g=s/d;let w=i-f*v,p=o-u*g;e.save(),e.translate(w,p),e.scale(l*v,l*g);const m=O(h.commands||[]),x=new Path2D(m);e.clip(x),e.translate(0-w,0-p),e.setTransform(1,0,0,1,0,0),_(e,Object.assign({},t),(()=>{null==n||n()})),e.restore()}else null==n||n()}(e,t,{originElem:r,calcElemSize:s,viewScaleInfo:l,viewSizeInfo:c,renderContent:()=>{var n,r;void 0!==(null===(n=null==t?void 0:t.detail)||void 0===n?void 0:n.opacity)&&(null===(r=null==t?void 0:t.detail)||void 0===r?void 0:r.opacity)>=0?e.globalAlpha=t.detail.opacity:e.globalAlpha=1,function(e,t,i){var n,o;const{pattern:a,viewScaleInfo:r,viewSizeInfo:s}=i;let l=[];if(t.detail,t.detail.background||a){const{x:i,y:c,w:d,h:f,radiusList:u}=E(t,{viewScaleInfo:r,viewSizeInfo:s});if(e.beginPath(),e.moveTo(i+u[0],c),e.arcTo(i+d,c,i+d,c+f,u[1]),e.arcTo(i+d,c+f,i,c+f,u[2]),e.arcTo(i,c+f,i,c,u[3]),e.arcTo(i,c,i+d,c,u[0]),e.closePath(),"string"==typeof a)e.fillStyle=a;else if(["CanvasPattern"].includes(h.type(a)))e.fillStyle=a;else if("string"==typeof t.detail.background)e.fillStyle=t.detail.background;else if("linear-gradient"===(null===(n=t.detail.background)||void 0===n?void 0:n.type)){const n=T(e,t.detail.background,{viewElementSize:{x:i,y:c,w:d,h:f},viewScaleInfo:r,opacity:e.globalAlpha});e.fillStyle=n}else if("radial-gradient"===(null===(o=t.detail.background)||void 0===o?void 0:o.type)){const n=T(e,t.detail.background,{viewElementSize:{x:i,y:c,w:d,h:f},viewScaleInfo:r,opacity:e.globalAlpha});if(e.fillStyle=n,l&&l.length>0)for(let t=0;t<(null==l?void 0:l.length);t++){const n=l[t];"translate"===n.method?e.translate(n.args[0]+i,n.args[1]+c):"rotate"===n.method?e.rotate(...n.args):"scale"===n.method&&e.scale(...n.args)}}e.fill(),l&&l.length>0&&e.setTransform(1,0,0,1,0,0)}}(e,t,{pattern:o,viewScaleInfo:l,viewSizeInfo:c}),null==a||a(),function(e,t,n){var o,a;if(0===t.detail.borderWidth)return;if(!i(t.detail.borderColor))return;void 0!==(null===(o=null==t?void 0:t.detail)||void 0===o?void 0:o.opacity)&&(null===(a=null==t?void 0:t.detail)||void 0===a?void 0:a.opacity)>=0?e.globalAlpha=t.detail.opacity:e.globalAlpha=1;const{viewScaleInfo:r}=n,{scale:s}=r;let l=j.borderColor;!0===i(t.detail.borderColor)&&(l=t.detail.borderColor);const{borderWidth:h,borderRadius:c,borderDash:d,boxSizing:f=j.boxSizing}=t.detail;let u=0;"number"==typeof h&&(u=h||1);u*=s;let v=[0,0,0,0];if("number"==typeof c){const e=c*s;v=[e,e,e,e]}else Array.isArray(c)&&4===(null==c?void 0:c.length)&&(v=[c[0]*s,c[1]*s,c[2]*s,c[3]*s]);e.strokeStyle=l;let g=[];Array.isArray(d)&&d.length>0&&(g=d.map((e=>Math.ceil(e*s))));let w=0,p=0,m=0,x=0;Array.isArray(h)&&(w=(h[0]||0)*s,p=(h[1]||0)*s,m=(h[2]||0)*s,x=(h[3]||0)*s);if(x||p||w||m){e.lineCap="butt";let{x:i,y:n,w:o,h:a}=t;"border-box"===f?(i+=x/2,n+=w/2,o=o-x/2-p/2,a=a-w/2-m/2):"content-box"===f?(i-=x/2,n-=w/2,o=o+x/2+p/2,a=a+w/2+m/2):(i=t.x,n=t.y,o=t.w,a=t.h),w&&(e.beginPath(),e.lineWidth=w,e.moveTo(i-x/2,n),e.lineTo(i+o+p/2,n),e.closePath(),e.stroke()),p&&(e.beginPath(),e.lineWidth=p,e.moveTo(i+o,n-w/2),e.lineTo(i+o,n+a+m/2),e.closePath(),e.stroke()),m&&(e.beginPath(),e.lineWidth=m,e.moveTo(i-x/2,n+a),e.lineTo(i+o+p/2,n+a),e.closePath(),e.stroke()),x&&(e.beginPath(),e.lineWidth=x,e.moveTo(i,n-w/2),e.lineTo(i,n+a+m/2),e.closePath(),e.stroke())}else{let{x:i,y:n,w:o,h:a}=t;"border-box"===f?(i=t.x+u/2,n=t.y+u/2,o=t.w-u,a=t.h-u):"content-box"===f?(i=t.x-u/2,n=t.y-u/2,o=t.w+u,a=t.h+u):(i=t.x,n=t.y,o=t.w,a=t.h),g.length>0?e.lineCap="butt":e.lineCap="square",e.setLineDash(g),e.lineWidth=u,e.beginPath(),e.moveTo(i+v[0],n),e.arcTo(i+o,n,i+o,n+a,v[1]),e.arcTo(i+o,n+a,i,n+a,v[2]),e.arcTo(i,n+a,i,n,v[3]),e.arcTo(i,n,i+o,n,v[0]),e.closePath(),e.stroke(),e.globalAlpha=1}e.setLineDash([])}(e,t,{viewScaleInfo:l,viewSizeInfo:c}),e.globalAlpha=1}})}function L(e,t,i){const{detail:n}=t,{viewScaleInfo:o,renderContent:a}=i,{shadowColor:r,shadowOffsetX:s,shadowOffsetY:l,shadowBlur:h}=n;x.number(h)?(e.save(),e.shadowColor=r||j.shadowColor,e.shadowOffsetX=(s||0)*o.scale,e.shadowOffsetY=(l||0)*o.scale,e.shadowBlur=(h||0)*o.scale,a(),e.restore()):a()}const D={boxSizing:"border-box",borderWidth:0,borderColor:"#000000",shadowColor:"#000000",borderRadius:0,borderDash:[],shadowOffsetX:0,shadowOffsetY:0,shadowBlur:0,opacity:1,color:"#000000",textAlign:"left",verticalAlign:"top",fontSize:16,lineHeight:20,fontFamily:"sans-serif",fontWeight:400};function W(e,t,n){var o;if(!0!==(null===(o=null==t?void 0:t.operations)||void 0===o?void 0:o.invisible))try{switch(t.type){case"rect":!function(e,t,i){const{calculator:n,viewScaleInfo:o,viewSizeInfo:a}=i;let{x:r,y:s,w:l,h:h,angle:c}=n.elementSize(t,o,a);const d=Object.assign(Object.assign({},t),{x:r,y:s,w:l,h:h,angle:c});_(e,{x:r,y:s,w:l,h:h,angle:c},(()=>{L(e,d,{viewScaleInfo:o,viewSizeInfo:a,renderContent:()=>{R(e,d,{originElem:t,calcElemSize:{x:r,y:s,w:l,h:h,angle:c},viewScaleInfo:o,viewSizeInfo:a,renderContent:()=>{}})}})}))}(e,t,n);break;case"circle":!function(e,t,i){const{detail:n,angle:o}=t,{background:a="#000000",borderColor:r="#000000",borderWidth:s=0}=n,{calculator:l,viewScaleInfo:h,viewSizeInfo:c}=i,{x:d,y:f,w:u,h:v}=l.elementSize({x:t.x,y:t.y,w:t.w,h:t.h},h,c),g=Object.assign(Object.assign({},t),{x:d,y:f,w:u,h:v,angle:o});_(e,{x:d,y:f,w:u,h:v,angle:o},(()=>{L(e,g,{viewScaleInfo:h,viewSizeInfo:c,renderContent:()=>{var i,n;const o=u/2,l=v/2,c=d+o,g=f+l;if(void 0!==(null===(i=null==t?void 0:t.detail)||void 0===i?void 0:i.opacity)&&(null===(n=null==t?void 0:t.detail)||void 0===n?void 0:n.opacity)>=0?e.globalAlpha=t.detail.opacity:e.globalAlpha=1,"number"==typeof s&&s>0){const t=s/2+o,i=s/2+l;e.beginPath(),e.strokeStyle=r,e.lineWidth=s,e.circle(c,g,t,i,0,0,2*Math.PI),e.closePath(),e.stroke()}e.beginPath();const w=T(e,a,{viewElementSize:{x:d,y:f,w:u,h:v},viewScaleInfo:h,opacity:e.globalAlpha});e.fillStyle=w,e.circle(c,g,o,l,0,0,2*Math.PI),e.closePath(),e.fill(),e.globalAlpha=1}})}))}(e,t,n);break;case"text":!function(e,t,n){const{calculator:o,viewScaleInfo:a,viewSizeInfo:r}=n,{x:s,y:l,w:h,h:c,angle:d}=o.elementSize(t,a,r),f=Object.assign(Object.assign({},t),{x:s,y:l,w:h,h:c,angle:d});_(e,{x:s,y:l,w:h,h:c,angle:d},(()=>{R(e,f,{originElem:t,calcElemSize:{x:s,y:l,w:h,h:c,angle:d},viewScaleInfo:a,viewSizeInfo:r,renderContent:()=>{const n=Object.assign(Object.assign({},D),t.detail),o=(n.fontSize||D.fontSize)*a.scale,r=n.lineHeight?n.lineHeight*a.scale:o;e.fillStyle=t.detail.color||D.color,e.textBaseline="top",e.$setFont({fontWeight:n.fontWeight,fontSize:o,fontFamily:n.fontFamily});const d=n.text.replace(/\r\n/gi,"\n"),f=r,u=d.split("\n"),v=[];let g=0;u.forEach(((t,i)=>{let n="";if(t.length>0){for(let o=0;o<t.length&&(e.measureText(n+(t[o]||"")).width<e.$doPixelRatio(h)?n+=t[o]||"":(v.push({text:n,width:e.$undoPixelRatio(e.measureText(n).width)}),n=t[o]||"",g++),!((g+1)*f>c));o++)if(t.length-1===o&&(g+1)*f<c){v.push({text:n,width:e.$undoPixelRatio(e.measureText(n).width)}),i<u.length-1&&g++;break}}else v.push({text:"",width:0})}));let w=0;v.length*f<c&&("top"===t.detail.verticalAlign?w=0:"bottom"===t.detail.verticalAlign?w+=c-v.length*f:w+=(c-v.length*f)/2);{const t=l+w;void 0!==n.textShadowColor&&i(n.textShadowColor)&&(e.shadowColor=n.textShadowColor),void 0!==n.textShadowOffsetX&&x.number(n.textShadowOffsetX)&&(e.shadowOffsetX=n.textShadowOffsetX),void 0!==n.textShadowOffsetY&&x.number(n.textShadowOffsetY)&&(e.shadowOffsetY=n.textShadowOffsetY),void 0!==n.textShadowBlur&&x.number(n.textShadowBlur)&&(e.shadowBlur=n.textShadowBlur),v.forEach(((i,o)=>{let a=s;"center"===n.textAlign?a=s+(h-i.width)/2:"right"===n.textAlign&&(a=s+(h-i.width)),e.fillText(i.text,a,t+f*o)}))}}})}))}(e,t,n);break;case"image":!function(e,t,i){const n=i.loader.getContent(t),{calculator:o,viewScaleInfo:a,viewSizeInfo:r}=i,{x:s,y:l,w:h,h:c,angle:d}=o.elementSize(t,a,r),f=Object.assign(Object.assign({},t),{x:s,y:l,w:h,h:c,angle:d});_(e,{x:s,y:l,w:h,h:c,angle:d},(()=>{L(e,f,{viewScaleInfo:a,viewSizeInfo:r,renderContent:()=>{R(e,f,{originElem:t,calcElemSize:{x:s,y:l,w:h,h:c,angle:d},viewScaleInfo:a,viewSizeInfo:r,renderContent:()=>{if(n||i.loader.load(t,i.elementAssets||{}),"image"===t.type&&n){const{opacity:i}=t.detail;e.globalAlpha=i||1;const{x:o,y:s,w:l,h:h,radiusList:c}=E(f,{viewScaleInfo:a,viewSizeInfo:r});e.save(),e.beginPath(),e.moveTo(o+c[0],s),e.arcTo(o+l,s,o+l,s+h,c[1]),e.arcTo(o+l,s+h,o,s+h,c[2]),e.arcTo(o,s+h,o,s,c[3]),e.arcTo(o,s,o+l,s,c[0]),e.closePath(),e.fill(),e.clip(),e.drawImage(n,o,s,l,h),e.globalAlpha=1,e.restore()}}})}})}))}(e,t,n);break;case"svg":!function(e,t,i){const n=i.loader.getContent(t),{calculator:o,viewScaleInfo:a,viewSizeInfo:r}=i,{x:s,y:l,w:h,h:c,angle:d}=o.elementSize(t,a,r);_(e,{x:s,y:l,w:h,h:c,angle:d},(()=>{if(n||i.loader.load(t,i.elementAssets||{}),"svg"===t.type&&n){const{opacity:i}=t.detail;e.globalAlpha=i||1,e.drawImage(n,s,l,h,c),e.globalAlpha=1}}))}(e,t,n);break;case"html":!function(e,t,i){const n=i.loader.getContent(t),{calculator:o,viewScaleInfo:a,viewSizeInfo:r}=i,{x:s,y:l,w:h,h:c,angle:d}=o.elementSize(t,a,r);_(e,{x:s,y:l,w:h,h:c,angle:d},(()=>{if(n||i.loader.load(t,i.elementAssets||{}),"html"===t.type&&n){const{opacity:i}=t.detail;e.globalAlpha=i||1,e.drawImage(n,s,l,h,c),e.globalAlpha=1}}))}(e,t,n);break;case"path":!function(e,t,i){const{detail:n}=t,{originX:o,originY:a,originW:r,originH:s}=n,{calculator:l,viewScaleInfo:h,viewSizeInfo:c}=i,{x:d,y:f,w:u,h:v,angle:g}=l.elementSize(t,h,c),w=u/r,p=v/s,m=d-o*w,x=f-a*p,S=h.scale*c.devicePixelRatio,y=Object.assign(Object.assign({},t),{x:d,y:f,w:u,h:v,angle:g});_(e,{x:d,y:f,w:u,h:v,angle:g},(()=>{R(e,y,{originElem:t,calcElemSize:{x:d,y:f,w:u,h:v,angle:g},viewScaleInfo:h,viewSizeInfo:c,renderContent:()=>{L(e,y,{viewScaleInfo:h,viewSizeInfo:c,renderContent:()=>{e.save(),e.translate(m,x),e.scale(S*w/h.scale,S*p/h.scale);const t=O(n.commands||[]),i=new Path2D(t);n.fill&&(e.fillStyle=n.fill,e.fill(i)),n.stroke&&0!==n.strokeWidth&&(e.strokeStyle=n.stroke,e.lineWidth=(n.strokeWidth||1)/c.devicePixelRatio,e.lineCap=n.strokeLineCap||"square",e.stroke(i)),e.translate(-m,-x),e.restore()}})}})}))}(e,t,n);break;case"group":!function(e,t,i){const{calculator:n,viewScaleInfo:o,viewSizeInfo:a}=i,{x:r,y:s,w:l,h:h,angle:c}=n.elementSize({x:t.x,y:t.y,w:t.w,h:t.h,angle:t.angle},o,a),d=Object.assign(Object.assign({},t),{x:r,y:s,w:l,h:h,angle:c});_(e,{x:r,y:s,w:l,h:h,angle:c},(()=>{R(e,d,{originElem:t,calcElemSize:{x:r,y:s,w:l,h:h,angle:c},viewScaleInfo:o,viewSizeInfo:a,renderContent:()=>{if(Array.isArray(t.detail.children)){const{parentElementSize:n}=i,o={x:n.x+t.x,y:n.y+t.y,w:t.w||n.w,h:t.h||n.h,angle:t.angle},{calculator:a}=i;"hidden"===t.detail.overflow&&(e.save(),e.beginPath(),e.moveTo(r,s),e.lineTo(r+l,s),e.lineTo(r+l,s+h),e.lineTo(r,s+h),e.closePath(),e.clip());for(let n=0;n<t.detail.children.length;n++){let r=t.detail.children[n];if(r=Object.assign(Object.assign({},r),{x:o.x+r.x,y:o.y+r.y}),a.isElementInView(r,i.viewScaleInfo,i.viewSizeInfo))try{W(e,r,Object.assign({},i))}catch(e){console.error(e)}}e.restore()}}})}))}(e,t,n)}}catch(e){console.error(e)}}const $={boxSizing:"border-box",borderWidth:0,borderColor:"#000000",shadowColor:"#000000",borderRadius:0,borderDash:[],shadowOffsetX:0,shadowOffsetY:0,shadowBlur:0,opacity:1,color:"#000000",textAlign:"left",verticalAlign:"top",fontSize:16,lineHeight:20,fontFamily:"sans-serif",fontWeight:400};var k=function(e,t,i,n){return new(i||(i=Promise))((function(o,a){function r(e){try{l(n.next(e))}catch(e){a(e)}}function s(e){try{l(n.throw(e))}catch(e){a(e)}}function l(e){var t;e.done?o(e.value):(t=e.value,t instanceof i?t:new i((function(e){e(t)}))).then(r,s)}l((n=n.apply(e,t||[])).next())}))};const F=["image","svg","html"],X=e=>{var t,i,n;let a=null;return"image"===e.type?a=(null===(t=null==e?void 0:e.detail)||void 0===t?void 0:t.src)||null:"svg"===e.type?a=(null===(i=null==e?void 0:e.detail)||void 0===i?void 0:i.svg)||null:"html"===e.type&&(a=(null===(n=null==e?void 0:e.detail)||void 0===n?void 0:n.html)||null),"string"==typeof a&&a?/^@assets\/[0-9a-z]{8,8}\-[0-9a-z]{4,4}\-[0-9a-z]{4,4}\-[0-9a-z]{4,4}\-[0-9a-z]{12,12}$/.test(`${a}`)?a:r(a):r(`${o()}-${e.uuid}-${o()}-${o()}`)};class Y extends S{constructor(){super(),this._loadFuncMap={},this._currentLoadItemMap={},this._storageLoadItemMap={},this._registerLoadFunc("image",((e,t)=>k(this,void 0,void 0,(function*(){var i;const n=(null===(i=t[e.detail.src])||void 0===i?void 0:i.value)||e.detail.src,o=yield f(n);return{uuid:e.uuid,lastModified:Date.now(),content:o}})))),this._registerLoadFunc("html",((e,t)=>k(this,void 0,void 0,(function*(){var i;const n=(null===(i=t[e.detail.html])||void 0===i?void 0:i.value)||e.detail.html,o=yield v(n,{width:e.detail.width||e.w,height:e.detail.height||e.h});return{uuid:e.uuid,lastModified:Date.now(),content:o}})))),this._registerLoadFunc("svg",((e,t)=>k(this,void 0,void 0,(function*(){var i;const n=(null===(i=t[e.detail.svg])||void 0===i?void 0:i.value)||e.detail.svg,o=yield u(n);return{uuid:e.uuid,lastModified:Date.now(),content:o}}))))}_registerLoadFunc(e,t){this._loadFuncMap[e]=t}_getLoadElementSource(e){var t,i,n;let o=null;return"image"===e.type?o=(null===(t=null==e?void 0:e.detail)||void 0===t?void 0:t.src)||null:"svg"===e.type?o=(null===(i=null==e?void 0:e.detail)||void 0===i?void 0:i.svg)||null:"html"===e.type&&(o=(null===(n=null==e?void 0:e.detail)||void 0===n?void 0:n.html)||null),o}_createLoadItem(e){return{element:e,status:"null",content:null,error:null,startTime:-1,endTime:-1,source:this._getLoadElementSource(e)}}_emitLoad(e){const t=X(e.element),i=this._storageLoadItemMap[t];i?i.startTime<e.startTime&&(this._storageLoadItemMap[t]=e,this.trigger("load",Object.assign(Object.assign({},e),{countTime:e.endTime-e.startTime}))):(this._storageLoadItemMap[t]=e,this.trigger("load",Object.assign(Object.assign({},e),{countTime:e.endTime-e.startTime})))}_emitError(e){const t=X(e.element),i=this._storageLoadItemMap[t];i?i.startTime<e.startTime&&(this._storageLoadItemMap[t]=e,this.trigger("error",Object.assign(Object.assign({},e),{countTime:e.endTime-e.startTime}))):(this._storageLoadItemMap[t]=e,this.trigger("error",Object.assign(Object.assign({},e),{countTime:e.endTime-e.startTime})))}_loadResource(e,t){const i=this._createLoadItem(e),n=X(e);this._currentLoadItemMap[n]=i;const o=this._loadFuncMap[e.type];"function"==typeof o&&(i.startTime=Date.now(),o(e,t).then((e=>{i.content=e.content,i.endTime=Date.now(),i.status="load",this._emitLoad(i)})).catch((t=>{console.warn(`Load element source "${i.source}" fail`,t,e),i.endTime=Date.now(),i.status="error",i.error=t,this._emitError(i)})))}_isExistingErrorStorage(e){var t;const i=X(e),n=null===(t=this._currentLoadItemMap)||void 0===t?void 0:t[i];return!(!n||"error"!==n.status||!n.source||n.source!==this._getLoadElementSource(e))}load(e,t){this._isExistingErrorStorage(e)||F.includes(e.type)&&this._loadResource(e,t)}getContent(e){var t,i;const n=X(e);return(null===(i=null===(t=this._storageLoadItemMap)||void 0===t?void 0:t[n])||void 0===i?void 0:i.content)||null}}class H extends S{constructor(e){super(),this._loader=new Y,this._opts=e,this._init()}_init(){const{_loader:e}=this;e.on("load",(e=>{this.trigger("load",e)})),e.on("error",(()=>{}))}updateOptions(e){this._opts=e}drawData(e,t){const{_loader:i}=this,{calculator:n}=this._opts,{viewContext:o}=this._opts.viewContent;o.clearRect(0,0,o.canvas.width,o.canvas.height);const a={x:0,y:0,w:t.viewSizeInfo.width,h:t.viewSizeInfo.height};!function(e,t,i){const{elements:n=[]}=t;for(let t=0;t<n.length;t++){const o=n[t],a=Object.assign(Object.assign({},o),{detail:Object.assign(Object.assign({},$),null==o?void 0:o.detail)});if(i.calculator.isElementInView(a,i.viewScaleInfo,i.viewSizeInfo))try{W(e,a,i)}catch(e){console.error(e)}}}(o,e,Object.assign({loader:i,calculator:n,parentElementSize:a,elementAssets:e.assets},t))}scale(e){const{sharer:t}=this._opts,{data:i,offsetTop:n,offsetBottom:o,offsetLeft:a,offsetRight:r,width:s,height:l,contextHeight:h,contextWidth:c,devicePixelRatio:d}=t.getActiveStoreSnapshot();i&&this.drawData(i,{viewScaleInfo:{scale:e,offsetTop:n,offsetBottom:o,offsetLeft:a,offsetRight:r},viewSizeInfo:{width:s,height:l,contextHeight:h,contextWidth:c,devicePixelRatio:d}})}}class B{constructor(e){this._opts=e}elementSize(e,t,i){return z(e,{viewScaleInfo:t,viewSizeInfo:i})}isElementInView(e,t,i){return function(e,t){const{viewSizeInfo:i,viewScaleInfo:n}=t,{width:o,height:a}=i,{angle:r}=e,{x:s,y:l,w:h,h:c}=z(e,{viewScaleInfo:n,viewSizeInfo:i}),d=P({x:s,y:l,w:h,h:c,angle:r}),f={x:0,y:0,w:o,h:a},u=Math.min(d[0].x,d[1].x,d[2].x,d[3].x),v=Math.min(d[0].y,d[1].y,d[2].y,d[3].y);return function(e,t){const i=e.x,n=e.y,o=e.x+e.w,a=e.y+e.h,r=t.x,s=t.y,l=t.x+t.w,h=t.y+t.h;return i<=l&&o>=r&&n<=h&&a>=s}(f,{x:u,y:v,w:Math.max(d[0].x,d[1].x,d[2].x,d[3].x)-u,h:Math.max(d[0].y,d[1].y,d[2].y,d[3].y)-v})}(e,{viewScaleInfo:t,viewSizeInfo:i})}isPointInElement(e,t,i,n){return C(e,{context2d:this._opts.viewContent.boardContext,element:t,viewScaleInfo:i,viewSizeInfo:n})}getPointElement(e,t){return function(e,t){var i,n,o;const{context2d:a,data:r,viewScaleInfo:s,viewSizeInfo:l,groupQueue:h}=t,c={index:-1,element:null,groupQueueIndex:-1};if(h&&Array.isArray(h)&&(null==h?void 0:h.length)>0)for(let t=h.length-1;t>=0;t--){let o=0,r=0,d=0;for(let e=0;e<=t;e++)o+=h[e].x,r+=h[e].y,d+=h[e].angle||0;const f=h[t];if(f&&"group"===f.type&&Array.isArray(null===(i=f.detail)||void 0===i?void 0:i.children))for(let i=0;i<f.detail.children.length;i++){const u=f.detail.children[i];if(!0!==(null===(n=null==u?void 0:u.operations)||void 0===n?void 0:n.invisible)){if(!u)break;if(C(e,{context2d:a,element:{x:o+u.x,y:r+u.y,w:u.w,h:u.h,angle:d+(u.angle||0)},viewScaleInfo:s,viewSizeInfo:l})){c.element=u,(t<h.length-1||"group"!==u.type)&&(c.groupQueueIndex=t);break}}}if(c.element)break}if(c.element)return c;for(let t=r.elements.length-1;t>=0;t--){const i=r.elements[t];if(!0!==(null===(o=null==i?void 0:i.operations)||void 0===o?void 0:o.invisible)&&C(e,{context2d:a,element:i,viewScaleInfo:s,viewSizeInfo:l})){c.index=t,c.element=i;break}}return c}(e,{...t,context2d:this._opts.viewContent.boardContext})}}function V(e){return e>0||e<0||0===e}class U extends S{constructor(e){super();const t=new y({defaultStorage:{hasPointDown:!1,prevClickPoint:null}});this._store=t,this._opts=e,this._init()}_init(){const e=window;e.addEventListener("mousemove",(e=>{if(!this._isInTarget(e))return;e.preventDefault();const t=this._getPoint(e);this._isVaildPoint(t)&&this.trigger("hover",{point:t})})),e.addEventListener("mousedown",(e=>{if(!this._isInTarget(e))return;e.preventDefault();const t=this._getPoint(e);this._isVaildPoint(t)&&(this._store.set("hasPointDown",!0),this.trigger("pointStart",{point:t}))})),e.addEventListener("mousemove",(e=>{if(!this._isInTarget(e))return;e.preventDefault(),e.stopPropagation();const t=this._getPoint(e);this._isVaildPoint(t)?!0===this._store.get("hasPointDown")&&this.trigger("pointMove",{point:t}):this._store.get("hasPointDown")&&(this.trigger("pointLeave",{point:t}),this._store.set("hasPointDown",!1))})),e.addEventListener("mouseup",(e=>{if(this._store.set("hasPointDown",!1),!this._isInTarget(e))return;e.preventDefault();const t=this._getPoint(e);this.trigger("pointEnd",{point:t})})),e.addEventListener("mouseleave",(e=>{if(this._store.set("hasPointDown",!1),!this._isInTarget(e))return;e.preventDefault();const t=this._getPoint(e);this.trigger("pointLeave",{point:t})})),e.addEventListener("wheel",(e=>{if(!this._isInTarget(e))return;const t=this._getPoint(e);if(!this._isVaildPoint(t))return;e.preventDefault();const i=e.deltaX>0||e.deltaX<0?e.deltaX:0,n=e.deltaY>0||e.deltaY<0?e.deltaY:0;!0===e.ctrlKey&&this.has("wheelScale")?this.trigger("wheelScale",{deltaX:i,deltaY:n,point:t}):this.has("wheelX")&&0!==i?this.trigger("wheelX",{deltaX:i,point:t}):this.has("wheelY")&&0!==n&&this.trigger("wheelY",{deltaY:n,point:t})}),{passive:!1}),e.addEventListener("click",(e=>{if(!this._isInTarget(e))return;e.preventDefault();const t=this._getPoint(e);if(!this._isVaildPoint(t))return;const i=Date.now(),n=this._store.get("prevClickPoint");n&&i-n.t<=500&&Math.abs(n.x-t.x)<=5&&Math.abs(n.y-t.y)<=5?this.trigger("doubleClick",{point:t}):this._store.set("prevClickPoint",t)})),e.addEventListener("contextmenu",(e=>{if(!this._isInTarget(e))return;e.preventDefault();const t=this._getPoint(e);this._isVaildPoint(t)}))}_isInTarget(e){return e.target===this._opts.viewContent.boardContext.canvas}_getPoint(e){const t=this._opts.viewContent.boardContext.canvas.getBoundingClientRect();return{x:e.clientX-t.left,y:e.clientY-t.top,t:Date.now()}}_isVaildPoint(e){const t=this._opts.sharer.getActiveViewSizeInfo(),{width:i,height:n}=t;return!!(V(e.x)&&V(e.y)&&e.x<=i&&e.y<=n)}}const Q={width:0,height:0,devicePixelRatio:1,contextWidth:0,contextHeight:0,data:null,scale:1,offsetLeft:0,offsetRight:0,offsetTop:0,offsetBottom:0};class N{constructor(){const e=new y({defaultStorage:Q}),t=new y({defaultStorage:{}});this._activeStore=e,this._sharedStore=t}getActiveStorage(e){return this._activeStore.get(e)}setActiveStorage(e,t){return this._activeStore.set(e,t)}getActiveStoreSnapshot(){return this._activeStore.getSnapshot()}getSharedStorage(e){return this._sharedStore.get(e)}setSharedStorage(e,t){return this._sharedStore.set(e,t)}getSharedStoreSnapshot(){return this._sharedStore.getSnapshot()}getActiveViewScaleInfo(){return{scale:this._activeStore.get("scale"),offsetTop:this._activeStore.get("offsetTop"),offsetBottom:this._activeStore.get("offsetBottom"),offsetLeft:this._activeStore.get("offsetLeft"),offsetRight:this._activeStore.get("offsetRight")}}setActiveViewScaleInfo(e){const{scale:t,offsetTop:i,offsetBottom:n,offsetLeft:o,offsetRight:a}=e;this._activeStore.set("scale",t),this._activeStore.set("offsetTop",i),this._activeStore.set("offsetBottom",n),this._activeStore.set("offsetLeft",o),this._activeStore.set("offsetRight",a)}setActiveViewSizeInfo(e){this._activeStore.set("width",e.width),this._activeStore.set("height",e.height),this._activeStore.set("devicePixelRatio",e.devicePixelRatio),this._activeStore.set("contextWidth",e.contextWidth),this._activeStore.set("contextHeight",e.contextHeight)}getActiveViewSizeInfo(){return{width:this._activeStore.get("width"),height:this._activeStore.get("height"),devicePixelRatio:this._activeStore.get("devicePixelRatio"),contextWidth:this._activeStore.get("contextWidth"),contextHeight:this._activeStore.get("contextHeight")}}}const{requestAnimationFrame:G}=window;class q extends S{constructor(e){super(),this._drawFrameSnapshotQueue=[],this._drawFrameStatus="FREE",this._opts=e,this._init()}_init(){const{renderer:e}=this._opts;e.on("load",(()=>{this.drawFrame()}))}_drawAnimationFrame(){if("DRAWING"===this._drawFrameStatus||0===this._drawFrameSnapshotQueue.length)return;this._drawFrameStatus="DRAWING";const e=this._drawFrameSnapshotQueue.shift(),{renderer:t,viewContent:i,beforeDrawFrame:n,afterDrawFrame:o}=this._opts;if(e){const{scale:a,offsetTop:r,offsetBottom:s,offsetLeft:l,offsetRight:h,width:c,height:d,contextHeight:f,contextWidth:u,devicePixelRatio:v}=e.activeStore,{underContext:g,viewContext:w,helperContext:p,boardContext:m}=i;(null==e?void 0:e.activeStore.data)&&t.drawData(e.activeStore.data,{viewScaleInfo:{scale:a,offsetTop:r,offsetBottom:s,offsetLeft:l,offsetRight:h},viewSizeInfo:{width:c,height:d,contextHeight:f,contextWidth:u,devicePixelRatio:v}}),n({snapshot:e}),m.clearRect(0,0,c,d),m.drawImage(g.canvas,0,0,c,d),m.drawImage(w.canvas,0,0,c,d),m.drawImage(p.canvas,0,0,c,d),g.clearRect(0,0,c,d),w.clearRect(0,0,c,d),p.clearRect(0,0,c,d),o({snapshot:e})}0!==this._drawFrameSnapshotQueue.length?(this._drawFrameStatus="DRAWING")&&G((()=>{this._drawAnimationFrame()})):this._drawFrameStatus="COMPLETE"}drawFrame(){const{sharer:e}=this._opts,t=e.getActiveStoreSnapshot(),i=e.getSharedStoreSnapshot();this._drawFrameSnapshotQueue.push({activeStore:t,sharedStore:i}),this._drawAnimationFrame()}scale(e){const{scale:t,point:i}=e,{sharer:n}=this._opts,{moveX:o,moveY:a}=function(e){const{scale:t,point:i,viewScaleInfo:n}=e,{offsetLeft:o,offsetTop:a}=n,r=t/n.scale,s=i.x,l=i.y;return{moveX:s-s*r+(o*r-o),moveY:l-l*r+(a*r-a)}}({scale:t,point:i,viewScaleInfo:n.getActiveViewScaleInfo(),viewSizeInfo:n.getActiveViewSizeInfo()});return n.setActiveStorage("scale",t),{moveX:o,moveY:a}}scroll(e){const{sharer:t}=this._opts,i=t.getActiveViewScaleInfo(),{moveX:n,moveY:o}=e,a=function(e){const{moveX:t=0,moveY:i=0,viewScaleInfo:n,viewSizeInfo:o}=e,{scale:a}=n,{width:r,height:s,contextWidth:l,contextHeight:h}=o;let c=n.offsetLeft,d=n.offsetRight,f=n.offsetTop,u=n.offsetBottom;return c+=t,f+=i,d=r-(l*a+c),u=s-(h*a+f),{scale:a,offsetTop:f,offsetLeft:c,offsetRight:d,offsetBottom:u}}({moveX:n,moveY:o,viewScaleInfo:i,viewSizeInfo:t.getActiveViewSizeInfo()});return t.setActiveViewScaleInfo(a),a}resize(e={}){const{sharer:t}=this._opts,i={...t.getActiveViewSizeInfo(),...e},{width:n,height:o,devicePixelRatio:a}=i,{underContext:r,boardContext:s,helperContext:l,viewContext:h}=this._opts.viewContent;return s.canvas.width=n*a,s.canvas.height=o*a,s.canvas.style.width=`${n}px`,s.canvas.style.height=`${o}px`,r.canvas.width=n*a,r.canvas.height=o*a,l.canvas.width=n*a,l.canvas.height=o*a,h.canvas.width=n*a,h.canvas.height=o*a,t.setActiveViewSizeInfo(i),i}}const K=["RULER"];return e.Board=class{constructor(e){this._middlewares=[],this._middlewareObjs=[],this._activeMiddlewareObjs=[],this._eventHub=new S,this._activeMode="SELECT";const{viewContent:t}=e,i=new N,n=new B({viewContent:t}),o=new U({viewContent:t,sharer:i}),a=new H({viewContent:t,sharer:i,calculator:n});this._opts=e,this._sharer=i,this._renderer=a,this._watcher=o,this._calculator=n,this._viewer=new q({viewContent:e.viewContent,sharer:i,renderer:a,calculator:n,beforeDrawFrame:e=>{this._handleBeforeDrawFrame(e)},afterDrawFrame:e=>{this._handleAfterDrawFrame(e)}}),this._init(),this._resetActiveMiddlewareObjs()}_init(){this._watcher.on("pointStart",this._handlePointStart.bind(this)),this._watcher.on("pointEnd",this._handlePointEnd.bind(this)),this._watcher.on("pointMove",t((e=>{this._handlePointMove(e)}),16)),this._watcher.on("hover",t((e=>{this._handleHover(e)}),16)),this._watcher.on("wheelX",t((e=>{this._handleWheelX(e)}),16)),this._watcher.on("wheelY",t((e=>{this._handleWheelY(e)}),16)),this._watcher.on("wheelScale",t((e=>{this._handleWheelScale(e)}),16)),this._watcher.on("scrollX",this._handleScrollX.bind(this)),this._watcher.on("scrollY",this._handleScrollY.bind(this)),this._watcher.on("resize",this._handleResize.bind(this)),this._watcher.on("doubleClick",this._handleDoubleClick.bind(this))}_handlePointStart(e){var t;for(let i=0;i<this._activeMiddlewareObjs.length;i++){const n=this._activeMiddlewareObjs[i];if(!1===(null==(t=null==n?void 0:n.pointStart)?void 0:t.call(n,e)))return}}_handlePointEnd(e){var t;for(let i=0;i<this._activeMiddlewareObjs.length;i++){const n=this._activeMiddlewareObjs[i];if(!1===(null==(t=null==n?void 0:n.pointEnd)?void 0:t.call(n,e)))return}}_handlePointMove(e){var t;for(let i=0;i<this._activeMiddlewareObjs.length;i++){const n=this._activeMiddlewareObjs[i];if(!1===(null==(t=null==n?void 0:n.pointMove)?void 0:t.call(n,e)))return}}_handleHover(e){var t;for(let i=0;i<this._activeMiddlewareObjs.length;i++){const n=this._activeMiddlewareObjs[i];if(!1===(null==(t=null==n?void 0:n.hover)?void 0:t.call(n,e)))return}}_handleDoubleClick(e){var t;for(let i=0;i<this._activeMiddlewareObjs.length;i++){const n=this._activeMiddlewareObjs[i];if(!1===(null==(t=null==n?void 0:n.doubleClick)?void 0:t.call(n,e)))return}}_handleWheelX(e){var t;for(let i=0;i<this._activeMiddlewareObjs.length;i++){const n=this._activeMiddlewareObjs[i];if(!1===(null==(t=null==n?void 0:n.wheelX)?void 0:t.call(n,e)))return}}_handleWheelY(e){var t;for(let i=0;i<this._activeMiddlewareObjs.length;i++){const n=this._activeMiddlewareObjs[i];if(!1===(null==(t=null==n?void 0:n.wheelY)?void 0:t.call(n,e)))return}}_handleWheelScale(e){var t;for(let i=0;i<this._activeMiddlewareObjs.length;i++){const n=this._activeMiddlewareObjs[i];if(!1===(null==(t=null==n?void 0:n.wheelScale)?void 0:t.call(n,e)))return}}_handleScrollX(e){var t;for(let i=0;i<this._activeMiddlewareObjs.length;i++){const n=this._activeMiddlewareObjs[i];if(!1===(null==(t=null==n?void 0:n.scrollX)?void 0:t.call(n,e)))return}}_handleScrollY(e){var t;for(let i=0;i<this._activeMiddlewareObjs.length;i++){const n=this._activeMiddlewareObjs[i];if(!1===(null==(t=null==n?void 0:n.scrollY)?void 0:t.call(n,e)))return}}_handleResize(e){var t;for(let i=0;i<this._activeMiddlewareObjs.length;i++){const n=this._activeMiddlewareObjs[i];if(!1===(null==(t=null==n?void 0:n.resize)?void 0:t.call(n,e)))return}}_handleClear(e){var t;for(let i=0;i<this._activeMiddlewareObjs.length;i++){const n=this._activeMiddlewareObjs[i];if(!1===(null==(t=null==n?void 0:n.clear)?void 0:t.call(n,e)))return}}_handleBeforeDrawFrame(e){var t;for(let i=0;i<this._activeMiddlewareObjs.length;i++){const n=this._activeMiddlewareObjs[i];if(!1===(null==(t=null==n?void 0:n.beforeDrawFrame)?void 0:t.call(n,e)))return}}_handleAfterDrawFrame(e){var t;for(let i=0;i<this._activeMiddlewareObjs.length;i++){const n=this._activeMiddlewareObjs[i];if(!1===(null==(t=null==n?void 0:n.afterDrawFrame)?void 0:t.call(n,e)))return}}_resetActiveMiddlewareObjs(){const{_activeMode:e}=this,t=[...K,e],i=[];this._middlewareObjs.forEach((e=>{(!0===e.isDefault||t.includes(e.mode))&&i.push(e)})),this._activeMiddlewareObjs=i}getSharer(){return this._sharer}getViewer(){return this._viewer}setData(e){const t=this._sharer;this._sharer.setActiveStorage("data",e);const i=t.getActiveViewSizeInfo(),n=function(e,t){const i={x:0,y:0,w:0,h:0};e.forEach((e=>{const t={x:e.x,y:e.y,w:e.w,h:e.h,angle:e.angle};if(t.angle&&(t.angle>0||t.angle<0)){const e=P(t);if(4===e.length){const i=[e[0].x,e[1].x,e[2].x,e[3].x],n=[e[0].y,e[1].y,e[2].y,e[3].y];t.x=Math.min(...i),t.y=Math.min(...n),t.w=Math.abs(Math.max(...i)-Math.min(...i)),t.h=Math.abs(Math.max(...n)-Math.min(...n))}}const n=Math.min(t.x,i.x),o=Math.min(t.y,i.y),a=Math.max(t.x+t.w,i.x+i.w),r=Math.max(t.y+t.h,i.y+i.h);i.x=n,i.y=o,i.w=Math.abs(a-n),i.h=Math.abs(r-o)})),(null==t?void 0:t.extend)&&(i.x=Math.min(i.x,0),i.y=Math.min(i.y,0));const n={contextWidth:i.w,contextHeight:i.h};return(null==t?void 0:t.viewWidth)&&(null==t?void 0:t.viewHeight)&&(null==t?void 0:t.viewWidth)>0&&(null==t?void 0:t.viewHeight)>0&&(t.viewWidth>i.x+i.w&&(n.contextWidth=t.viewWidth-i.x),t.viewHeight>i.y+i.h&&(n.contextHeight=t.viewHeight-i.y)),n}(e.elements,{viewWidth:i.width,viewHeight:i.height,extend:!0});this._viewer.drawFrame();const o={...i,...n};return this._sharer.setActiveViewSizeInfo(o),{viewSizeInfo:o}}getData(){const{data:e}=this._sharer.getActiveStoreSnapshot();return e}use(e){const{viewContent:t}=this._opts,{_sharer:i,_viewer:n,_calculator:o,_eventHub:a}=this,r=e({viewContent:t,sharer:i,viewer:n,calculator:o,eventHub:a});this._middlewares.push(e),this._activeMiddlewareObjs.push(r)}scale(e){const{_viewer:t}=this,{moveX:i,moveY:n}=t.scale(e);t.scroll({moveX:i,moveY:n})}scroll(e){return this._viewer.scroll(e)}resize(e){const t=this._viewer.resize(e),{width:i,height:n,devicePixelRatio:o}=e,{viewContent:a}=this._opts;a.viewContext.$resize({width:i,height:n,devicePixelRatio:o});const r=a.viewContext.canvas;r.style.width=`${i}px`,r.style.height=`${n}px`,a.helperContext.$resize({width:i,height:n,devicePixelRatio:o}),a.boardContext.$resize({width:i,height:n,devicePixelRatio:o}),this._viewer.drawFrame(),this._watcher.trigger("resize",t),this._sharer.setActiveViewSizeInfo(e)}clear(){const{viewContent:e}=this._opts,{underContext:t,helperContext:i,viewContext:n,boardContext:o}=e;t.clearRect(0,0,t.canvas.width,t.canvas.height),i.clearRect(0,0,i.canvas.width,i.canvas.height),n.clearRect(0,0,n.canvas.width,n.canvas.height),o.clearRect(0,0,o.canvas.width,o.canvas.height),this._handleClear()}getEventHub(){return this._eventHub}},Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),e}({});
{
"name": "@idraw/board",
"version": "0.4.0-alpha.3",
"version": "0.4.0-alpha.4",
"description": "",

@@ -24,7 +24,8 @@ "main": "dist/esm/index.js",

"devDependencies": {
"@idraw/types": "^0.4.0-alpha.0"
"@idraw/types": "^0.4.0-alpha.4"
},
"dependencies": {
"@idraw/util": "^0.4.0-alpha.3",
"@idraw/renderer": "^0.4.0-alpha.3"
"dependencies": {},
"peerDependencies": {
"@idraw/util": "^0.4.0-alpha.4",
"@idraw/renderer": "^0.4.0-alpha.4"
},

@@ -35,2 +36,2 @@ "publishConfig": {

}
}
}

Sorry, the diff of this file is too big to display

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc