polotno 2.23.0 → 2.23.2

package/model/page-model.js

@@ -1 +1 @@
-Object.defineProperty(exports,"__esModule",{value:!0}),exports.Page=void 0;const e=require("mobx-state-tree"),t=require("nanoid"),n=require("./group-model"),i=require("./store"),o=require("./group-model"),r=require("../utils/math");exports.Page=e.types.model("Page",{id:e.types.identifier,children:e.types.array(e.types.late((()=>n.ElementTypes))),width:e.types.optional(e.types.union(e.types.number,e.types.literal("auto")),"auto"),height:e.types.optional(e.types.union(e.types.number,e.types.literal("auto")),"auto"),background:"white",bleed:0,custom:e.types.frozen(),duration:5e3,_exporting:!1,_rendering:!1,_forceMount:!1}).postProcessSnapshot((e=>{const t=Object.assign({},e),n={};for(var i in t){"_"!==i[0]&&(n[i]=e[i])}return n})).views((t=>({get store(){return(0,e.getParentOfType)(t,i.Store)}}))).views((e=>({get startTime(){let t=0;for(const n of e.store.pages){if(n.id===e.id){return t}t+=n.duration}return t},get _exportingOrRendering(){return e._exporting||e._rendering}}))).views((e=>({get computedWidth(){return"auto"===e.width?e.store.width:e.width},get computedHeight(){return"auto"===e.height?e.store.height:e.height}}))).actions((t=>({toJSON:()=>JSON.parse(JSON.stringify((0,e.getSnapshot)(t))),_forEachElementUp(e,n){const i=e.map((e=>({id:e,index:t.children.findIndex((t=>t.id===e))})));i.sort(((e,t)=>t.index-e.index));for(const{index:o}of i){if(-1==o){continue}const i=o<t.children.length-1&&t.children[o+1],r=e.indexOf(null==i?void 0:i.id)>=0;o===t.children.length-1||r||n(o)}},_forEachElementDown(e,n){const i=e.map((e=>({id:e,index:t.children.findIndex((t=>t.id===e))})));i.sort(((e,t)=>e.index-t.index));for(const{index:o}of i){if(-1==o){continue}const i=o>0&&t.children[o-1],r=e.indexOf(null==i?void 0:i.id)>=0;0===o||r||n(o)}return!1}}))).actions((n=>({clone(e={}){const i=n.toJSON();i.children.forEach((e=>{e.id=(0,t.nanoid)(10),(0,o.forEveryChild)(e,(e=>{e.id=(0,t.nanoid)(10)}))}));const r=Object.assign(Object.assign(Object.assign({},i),{id:(0,t.nanoid)(10)}),e),d=n.store.addPage(r),s=n.store.pages.indexOf(n);d.setZIndex(s+1),d.select()},setZIndex(e){n.store.setPageZIndex(n.id,e)},set(e){Object.assign(n,e)},select(){n.store.selectPage(n.id)},addElement(e,{skipSelect:i=!1}={}){const r=o.TYPES_MAP[e.type];if(!r){return void console.error("Can not find model with type "+e.type)}"children"in e&&Array.isArray(e.children)&&e.children.forEach((e=>{e.id=(0,t.nanoid)(10)}));const d=r.create(Object.assign({id:(0,t.nanoid)(10)},e));return n.children.push(d),d.selectable&&!i&&n.store.selectElements([d.id]),d},canMoveElementsUp(e){let t=!1;return n._forEachElementUp(e,(()=>{t=t||!0})),t},moveElementsUp(t){n._forEachElementUp(t,(t=>{const i=n.children[t];(0,e.detach)(i),n.children.splice(t+1,0,i)}))},canMoveElementsTop(e){return this.canMoveElementsUp(e)},moveElementsTop(e){const t=[],i=[];n.children.forEach((n=>{e.indexOf(n.id)>=0?t.push(n):i.push(n)})),n.children.replace(i.concat(t))},canMoveElementsDown(e){let t=!1;return n._forEachElementDown(e,(()=>{t=t||!0})),t},moveElementsDown(t){n._forEachElementDown(t,(t=>{const i=n.children[t];(0,e.detach)(i),n.children.splice(t-1,0,i)}))},canMoveElementsBottom(e){return this.canMoveElementsDown(e)},moveElementsBottom(e){const t=[],i=[];n.children.forEach((n=>{e.indexOf(n.id)>=0?t.push(n):i.push(n)})),n.children.replace(t.concat(i))},setElementZIndex(t,i){const o=n.children.find((e=>e.id===t));o&&((0,e.detach)(o),n.children.remove(o),n.children.splice(i,0,o))},setSize({width:e,height:t,useMagic:i,softChange:d}){if(i){const i=[],d=e=>"image"===e.type&&e.x<1&&e.y<1&&e.width>=n.computedWidth-2&&e.height>=n.computedHeight-2;(0,o.forEveryChild)(n,(e=>{"group"!==e.type&&(d(e)||i.push(e))}));const s=i.length?(0,r.getTotalClientRect)(i):{x:0,y:0,width:n.computedWidth,height:n.computedHeight},a=1/4,c=Math.max(0,Math.min(s.x,n.computedWidth-s.x-s.width)),h=n.computedWidth*a,l=Math.max(0,c-h),p=Math.max(0,Math.min(s.y,n.computedHeight-s.y-s.height)),m=n.computedHeight*a,u=Math.max(0,p-m),g=n.computedWidth-2*l,E=n.computedHeight-2*u,f=e/g,y=t/E,v=Math.min(f,y),x=(e-g*v)/2-l*v,w=(t-E*v)/2-u*v;(0,o.forEveryChild)(n,(e=>{"group"!==e.type&&(d(e)?e.set({x:e.x*v,y:e.y*v,width:e.width*f,height:e.height*y,cropX:0,cropY:0,cropWidth:1,cropHeight:1}):(e.set({x:x+e.x*v,y:w+e.y*v,width:e.width*v,height:e.height*v}),"text"===e.type?e.set({fontSize:e.fontSize*v}):"figure"===e.type&&e.set({strokeWidth:e.strokeWidth*v})))}))}d||(n.width=e),d||(n.height=t)}}))).actions((e=>({moveElementUp(t){console.warn("page.moveElementUp(id) is deprecated. Please use page.moveElementsUp([id1, id2]) instead."),e.moveElementsUp([t])},moveElementDown(t){console.warn("page.moveElementDown(id) is deprecated. Please use page.moveElementsDown([id1, id2]) instead."),e.moveElementsDown([t])},moveElementTop(t){console.warn("page.moveElementTop(id) is deprecated. Please use page.moveElementsTop([id1, id2]) instead."),e.moveElementsTop([t])},moveElementBottom(t){console.warn("page.moveElementBottom(id) is deprecated. Please use page.moveElementsBottom([id1, id2]) instead."),e.moveElementsBottom([t])},play(){e.store.play({startTime:e.startTime,endTime:e.startTime+e.duration})}})));
+Object.defineProperty(exports,"__esModule",{value:!0}),exports.Page=void 0;const e=require("mobx-state-tree"),t=require("nanoid"),n=require("./group-model"),i=require("./store"),o=require("./group-model"),r=require("../utils/math");exports.Page=e.types.model("Page",{id:e.types.identifier,children:e.types.array(e.types.late((()=>n.ElementTypes))),width:e.types.optional(e.types.union(e.types.number,e.types.literal("auto")),"auto"),height:e.types.optional(e.types.union(e.types.number,e.types.literal("auto")),"auto"),background:"white",bleed:0,custom:e.types.frozen(),duration:5e3,_exporting:!1,_rendering:!1,_forceMount:!1}).postProcessSnapshot((e=>{const t=Object.assign({},e),n={};for(var i in t){"_"!==i[0]&&(n[i]=e[i])}return n})).views((t=>({get store(){return(0,e.getParentOfType)(t,i.Store)}}))).views((e=>({get startTime(){let t=0;for(const n of e.store.pages){if(n.id===e.id){return t}t+=n.duration}return t},get _exportingOrRendering(){return e._exporting||e._rendering}}))).views((e=>({get computedWidth(){return"auto"===e.width?e.store.width:e.width},get computedHeight(){return"auto"===e.height?e.store.height:e.height}}))).actions((t=>({toJSON:()=>JSON.parse(JSON.stringify((0,e.getSnapshot)(t))),_forEachElementUp(e,n){const i=e.map((e=>({id:e,index:t.children.findIndex((t=>t.id===e))})));i.sort(((e,t)=>t.index-e.index));for(const{index:o}of i){if(-1==o){continue}const i=o<t.children.length-1&&t.children[o+1],r=e.indexOf(null==i?void 0:i.id)>=0;o===t.children.length-1||r||n(o)}},_forEachElementDown(e,n){const i=e.map((e=>({id:e,index:t.children.findIndex((t=>t.id===e))})));i.sort(((e,t)=>e.index-t.index));for(const{index:o}of i){if(-1==o){continue}const i=o>0&&t.children[o-1],r=e.indexOf(null==i?void 0:i.id)>=0;0===o||r||n(o)}return!1}}))).actions((n=>({clone(e={}){const i=n.toJSON();i.children.forEach((e=>{e.id=(0,t.nanoid)(10),(0,o.forEveryChild)(e,(e=>{e.id=(0,t.nanoid)(10)}))}));const r=Object.assign(Object.assign(Object.assign({},i),{id:(0,t.nanoid)(10)}),e),d=n.store.addPage(r),s=n.store.pages.indexOf(n);return d.setZIndex(s+1),d.select(),d},setZIndex(e){n.store.setPageZIndex(n.id,e)},set(e){Object.assign(n,e)},select(){n.store.selectPage(n.id)},addElement(e,{skipSelect:i=!1}={}){const r=o.TYPES_MAP[e.type];if(!r){return void console.error("Can not find model with type "+e.type)}"children"in e&&Array.isArray(e.children)&&(0,o.forEveryChild)(e,(e=>{e.id=(0,t.nanoid)(10)}));const d=r.create(Object.assign({id:(0,t.nanoid)(10)},e));return n.children.push(d),d.selectable&&!i&&n.store.selectElements([d.id]),d},canMoveElementsUp(e){let t=!1;return n._forEachElementUp(e,(()=>{t=t||!0})),t},moveElementsUp(t){n._forEachElementUp(t,(t=>{const i=n.children[t];(0,e.detach)(i),n.children.splice(t+1,0,i)}))},canMoveElementsTop(e){return this.canMoveElementsUp(e)},moveElementsTop(e){const t=[],i=[];n.children.forEach((n=>{e.indexOf(n.id)>=0?t.push(n):i.push(n)})),n.children.replace(i.concat(t))},canMoveElementsDown(e){let t=!1;return n._forEachElementDown(e,(()=>{t=t||!0})),t},moveElementsDown(t){n._forEachElementDown(t,(t=>{const i=n.children[t];(0,e.detach)(i),n.children.splice(t-1,0,i)}))},canMoveElementsBottom(e){return this.canMoveElementsDown(e)},moveElementsBottom(e){const t=[],i=[];n.children.forEach((n=>{e.indexOf(n.id)>=0?t.push(n):i.push(n)})),n.children.replace(t.concat(i))},setElementZIndex(t,i){const o=n.children.find((e=>e.id===t));o&&((0,e.detach)(o),n.children.remove(o),n.children.splice(i,0,o))},setSize({width:e,height:t,useMagic:i,softChange:d}){if(i){const i=[],d=e=>"image"===e.type&&e.x<1&&e.y<1&&e.width>=n.computedWidth-2&&e.height>=n.computedHeight-2;(0,o.forEveryChild)(n,(e=>{"group"!==e.type&&(d(e)||i.push(e))}));const s=i.length?(0,r.getTotalClientRect)(i):{x:0,y:0,width:n.computedWidth,height:n.computedHeight},a=1/4,c=Math.max(0,Math.min(s.x,n.computedWidth-s.x-s.width)),h=n.computedWidth*a,l=Math.max(0,c-h),p=Math.max(0,Math.min(s.y,n.computedHeight-s.y-s.height)),m=n.computedHeight*a,u=Math.max(0,p-m),g=n.computedWidth-2*l,E=n.computedHeight-2*u,f=e/g,y=t/E,v=Math.min(f,y),x=(e-g*v)/2-l*v,w=(t-E*v)/2-u*v;(0,o.forEveryChild)(n,(e=>{"group"!==e.type&&(d(e)?e.set({x:e.x*v,y:e.y*v,width:e.width*f,height:e.height*y,cropX:0,cropY:0,cropWidth:1,cropHeight:1}):(e.set({x:x+e.x*v,y:w+e.y*v,width:e.width*v,height:e.height*v}),"text"===e.type?e.set({fontSize:e.fontSize*v}):"figure"===e.type&&e.set({strokeWidth:e.strokeWidth*v})))}))}d||(n.width=e),d||(n.height=t)}}))).actions((e=>({moveElementUp(t){console.warn("page.moveElementUp(id) is deprecated. Please use page.moveElementsUp([id1, id2]) instead."),e.moveElementsUp([t])},moveElementDown(t){console.warn("page.moveElementDown(id) is deprecated. Please use page.moveElementsDown([id1, id2]) instead."),e.moveElementsDown([t])},moveElementTop(t){console.warn("page.moveElementTop(id) is deprecated. Please use page.moveElementsTop([id1, id2]) instead."),e.moveElementsTop([t])},moveElementBottom(t){console.warn("page.moveElementBottom(id) is deprecated. Please use page.moveElementsBottom([id1, id2]) instead."),e.moveElementsBottom([t])},play(){e.store.play({startTime:e.startTime,endTime:e.startTime+e.duration})}})));

package/model/shape-model.js

@@ -1 +1 @@
-Object.defineProperty(exports,"__esModule",{value:!0}),exports.Shape=exports.INDEPENDENT_FILTERS=exports.ShapeFilter=exports.getDiff=exports.Animation=void 0;const e=require("mobx-state-tree"),t=require("../utils/animations"),i=require("mobx"),o=require("./node-model");exports.Animation=e.types.model("Animation",{delay:0,duration:500,enabled:!0,type:e.types.enumeration("Type",["enter","exit","loop"]),name:"none",data:e.types.frozen({})}),exports.getDiff=(e,t)=>{const i={};for(const o in t){if("number"==typeof e[o]&&"number"==typeof t[o]){const n=t[o]-e[o];0!==n&&(i[o]=n)}}return i},exports.ShapeFilter=e.types.model("ShapeFilter",{intensity:1}),exports.INDEPENDENT_FILTERS=["temperature","contrast","highlights","shadows","white","black","saturation","vibrance"],exports.Shape=o.Node.named("Shape").props({x:0,y:0,width:100,height:100,rotation:0,opacity:1,animations:e.types.array(exports.Animation),blurEnabled:!1,blurRadius:10,brightnessEnabled:!1,brightness:0,sepiaEnabled:!1,grayscaleEnabled:!1,filters:e.types.map(exports.ShapeFilter),shadowEnabled:!1,shadowBlur:5,shadowOffsetX:0,shadowOffsetY:0,shadowColor:"black",shadowOpacity:1,visible:!0,draggable:!0,resizable:!0,selectable:!0,contentEditable:!0,styleEditable:!0,alwaysOnTop:!1,showInExport:!0}).preProcessSnapshot((e=>{const t=Object.assign(Object.assign({},e),{x:e.x||0,y:e.y||0,filters:Array.isArray(e.filters)?{}:e.filters});return"width"in e&&(t.width=t.width||1),"height"in e&&(t.height=t.height||1),e.locked&&(t.draggable=!1,t.contentEditable=!1,t.styleEditable=!1,t.resizable=!1,t.removable=!1),t})).views((e=>{const o=(0,i.observable)({x:e.x,y:e.y,width:e.width,height:e.height,rotation:e.rotation,opacity:e.opacity,color:e.color,fontSize:e.fontSize}),n=(0,i.action)((e=>{Object.assign(o,e)})),a=(0,i.action)((e=>{for(const t in e){"number"==typeof o[t]&&(o[t]=o[t]+e[t])}}));return{get a(){const{currentTime:i}=e.store;if(n({x:e.x,y:e.y,width:e.width,height:e.height,rotation:e.rotation,opacity:e.opacity,color:e.color,fontSize:e.fontSize,cropX:e.cropX,cropY:e.cropY,cropWidth:e.cropWidth,cropHeight:e.cropHeight}),0===i){return o}const r=i-e.page.startTime;if(r>e.page.duration){return o}if(r<0){return o}const s=e.store.animatedElementsIds;if(s.length&&!s.includes(e.id)){return o}const l=e.animations.find((e=>"enter"===e.type)),d=(null==l?void 0:l.enabled)&&r<l.delay;d&&n({opacity:0});const p=(null==l?void 0:l.enabled)&&r>=l.delay&&r<=l.delay+l.duration;if(p){const i=r-l.delay,o=(0,t.animate)({element:e,animation:l,dTime:i}),n=(0,exports.getDiff)(e,o);a(n)}const c=e.animations.find((e=>"exit"===e.type));if(!d&&!p&&(null==c?void 0:c.enabled)&&r>=e.page.duration-c.duration-c.delay&&r<=e.page.duration-c.delay){const i=r-(e.page.duration-c.duration-c.delay),o=(0,t.animate)({element:e,animation:c,dTime:i}),n=(0,exports.getDiff)(e,o);a(n)}(null==c?void 0:c.enabled)&&r>=e.page.duration-c.delay&&n({opacity:0});const h=e.animations.find((e=>"loop"===e.type));if(null==h?void 0:h.enabled){const i=r,o=(0,t.animate)({element:e,animation:h,dTime:i}),n=(0,exports.getDiff)(e,o);a(n)}return o},animated:t=>e.a[t]}})).actions((e=>({setAnimation(t,i){const o=e.animations.find((e=>e.type===t));o?Object.assign(o,i):e.animations.push(Object.assign({type:t},i))},setFilter(t,i){exports.INDEPENDENT_FILTERS.includes(t)||e.filters.forEach(((t,i)=>{exports.INDEPENDENT_FILTERS.includes(i.toString())||e.filters.delete(i.toString())})),null==i&&e.filters.delete(t),e.filters.set(t,{intensity:i})}})));
+Object.defineProperty(exports,"__esModule",{value:!0}),exports.Shape=exports.INDEPENDENT_FILTERS=exports.ShapeFilter=exports.getDiff=exports.Animation=void 0;const e=require("mobx-state-tree"),t=require("../utils/animations"),i=require("mobx"),o=require("./node-model");exports.Animation=e.types.model("Animation",{delay:0,duration:500,enabled:!0,type:e.types.enumeration("Type",["enter","exit","loop"]),name:"none",data:e.types.frozen({})}),exports.getDiff=(e,t)=>{const i={};for(const o in t){if("number"==typeof e[o]&&"number"==typeof t[o]){const n=t[o]-e[o];0!==n&&(i[o]=n)}}return i},exports.ShapeFilter=e.types.model("ShapeFilter",{intensity:1}),exports.INDEPENDENT_FILTERS=["temperature","contrast","highlights","shadows","white","black","saturation","vibrance"],exports.Shape=o.Node.named("Shape").props({x:0,y:0,width:100,height:100,rotation:0,opacity:1,animations:e.types.array(exports.Animation),blurEnabled:!1,blurRadius:10,brightnessEnabled:!1,brightness:0,sepiaEnabled:!1,grayscaleEnabled:!1,filters:e.types.map(exports.ShapeFilter),shadowEnabled:!1,shadowBlur:5,shadowOffsetX:0,shadowOffsetY:0,shadowColor:"black",shadowOpacity:1,visible:!0,draggable:!0,resizable:!0,selectable:!0,contentEditable:!0,styleEditable:!0,alwaysOnTop:!1,showInExport:!0}).preProcessSnapshot((e=>{const t=Object.assign(Object.assign({},e),{x:e.x||0,y:e.y||0,filters:Array.isArray(e.filters)?{}:e.filters});return"width"in e&&(t.width=t.width||1),"height"in e&&(t.height=t.height||1),e.locked&&(t.draggable=!1,t.contentEditable=!1,t.styleEditable=!1,t.resizable=!1,t.removable=!1),t})).views((e=>{const o=(0,i.observable)({x:e.x,y:e.y,width:e.width,height:e.height,rotation:e.rotation,opacity:e.opacity,color:e.color,fontSize:e.fontSize}),n=(0,i.action)((e=>{Object.assign(o,e)})),a=(0,i.action)((e=>{for(const t in e){"number"==typeof o[t]&&(o[t]=o[t]+e[t])}}));return{get a(){const{currentTime:i}=e.store;if(n({x:e.x,y:e.y,width:e.width,height:e.height,rotation:e.rotation,opacity:e.opacity,color:e.color,fontSize:e.fontSize,cropX:e.cropX,cropY:e.cropY,cropWidth:e.cropWidth,cropHeight:e.cropHeight}),0===i){return o}const r=i-e.page.startTime;if(r>e.page.duration){return o}if(r<0){return o}const s=e.store.animatedElementsIds;if(s.length&&!s.includes(e.id)){return o}const l=e.animations.find((e=>"enter"===e.type)),d=(null==l?void 0:l.enabled)&&r<l.delay;d&&n({opacity:0});const p=(null==l?void 0:l.enabled)&&r>=l.delay&&r<=l.delay+l.duration;if(p){const i=r-l.delay,o=(0,t.animate)({element:e,animation:l,dTime:i}),n=(0,exports.getDiff)(e,o);a(n)}const c=e.animations.find((e=>"exit"===e.type));if(!d&&!p&&(null==c?void 0:c.enabled)&&r>=e.page.duration-c.duration-c.delay&&r<=e.page.duration-c.delay){const i=r-(e.page.duration-c.duration-c.delay),o=(0,t.animate)({element:e,animation:c,dTime:i}),n=(0,exports.getDiff)(e,o);a(n)}(null==c?void 0:c.enabled)&&r>=e.page.duration-c.delay&&n({opacity:0});const h=e.animations.find((e=>"loop"===e.type));if(null==h?void 0:h.enabled){const i=r,o=(0,t.animate)({element:e,animation:h,dTime:i}),n=(0,exports.getDiff)(e,o);a(n)}return o},animated:t=>e.a[t]}})).actions((e=>({setAnimation(t,i){const o=e.animations.find((e=>e.type===t));o?Object.assign(o,i):e.animations.push(Object.assign({type:t},i))},setFilter(t,i){exports.INDEPENDENT_FILTERS.includes(t)||e.filters.forEach(((t,i)=>{exports.INDEPENDENT_FILTERS.includes(i.toString())||e.filters.delete(i.toString())})),null==i?e.filters.delete(t):e.filters.set(t,{intensity:i})}})));

package/model/store.d.ts

@@ -129,6 +129,7 @@ export declare const Store: import("mobx-state-tree").IModelType<{
     scaleToFit: import("mobx-state-tree").IType<number, number, number>;
     unit: import("mobx-state-tree").IType<string, string, string>;
     dpi: import("mobx-state-tree").IType<number, number, number>;
+    schemaVersion: import("mobx-state-tree").IType<number, number, number>;
     bleedVisible: import("mobx-state-tree").IType<boolean, boolean, boolean>;
     rulesVisible: import("mobx-state-tree").IType<boolean, boolean, boolean>;
     openedSidePanel: import("mobx-state-tree").IType<string, string, string>;
@@ -864,6 +865,7 @@ export declare const Store: import("mobx-state-tree").IModelType<{
         unit: string;
         dpi: number;
         custom: any;
+        schemaVersion: number;
     };
     loadJSON(json: any, keepHistory?: boolean): void;
     clear({ keepHistory }?: {

package/model/store.js

@@ -1 +1 @@
-var e,t=this&&this.__createBinding||(Object.create?function(e,t,i,o){void 0===o&&(o=i);var n=Object.getOwnPropertyDescriptor(t,i);n&&!("get"in n?!t.__esModule:n.writable||n.configurable)||(n={enumerable:!0,get:function(){return t[i]}}),Object.defineProperty(e,o,n)}:function(e,t,i,o){void 0===o&&(o=i),e[o]=t[i]}),i=this&&this.__setModuleDefault||(Object.create?function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}:function(e,t){e.default=t}),o=this&&this.__importStar||(e=function(t){return e=Object.getOwnPropertyNames||function(e){var t=[];for(var i in e){Object.prototype.hasOwnProperty.call(e,i)&&(t[t.length]=i)}return t},e(t)},function(o){if(o&&o.__esModule){return o}var n={};if(null!=o){for(var a=e(o),s=0;s<a.length;s++){"default"!==a[s]&&t(n,o,a[s])}}return i(n,o),n}),n=this&&this.__rest||function(e,t){var i={};for(var o in e){Object.prototype.hasOwnProperty.call(e,o)&&t.indexOf(o)<0&&(i[o]=e[o])}if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var n=0;for(o=Object.getOwnPropertySymbols(e);n<o.length;n++){t.indexOf(o[n])<0&&Object.prototype.propertyIsEnumerable.call(e,o[n])&&(i[o[n]]=e[o[n]])}}return i},a=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(exports,"__esModule",{value:!0}),exports.Store=exports.Font=void 0,exports.createStore=_;const s=require("mobx-state-tree"),r=require("./history"),l=require("nanoid"),d=a(require("konva")),c=require("../utils/download"),p=require("../utils/pdf"),u=require("../utils/gif-lib"),g=require("../utils/validate-key"),m=o(require("../utils/fonts")),h=require("../utils/loader"),f=require("../utils/unit"),y=require("../utils/deep-equal"),b=require("../utils/wait"),v=require("../utils/to-html"),w=require("../utils/to-svg"),P=require("./page-model"),x=require("./group-model"),E=require("./audio-model");function _({key:e,showCredit:t}={key:"",showCredit:!1}){return exports.Store.create({_forceShowCredit:t,_key:e})}(0,s.setLivelinessChecking)("ignore"),exports.Font=s.types.model("Font",{fontFamily:s.types.string,url:s.types.optional(s.types.string,""),styles:s.types.frozen()}).preProcessSnapshot((e=>Object.assign(Object.assign({},e),{fontFamily:e.fontFamily||e.name}))),exports.Store=s.types.model("Store",{role:"",pages:s.types.array(P.Page),fonts:s.types.array(exports.Font),audios:s.types.array(E.Audio),width:1080,height:1080,currentTime:0,isPlaying:!1,scale:1,scaleToFit:1,unit:"px",dpi:72,bleedVisible:!1,rulesVisible:!1,openedSidePanel:"",previousOpenedSidePanel:"",custom:s.types.frozen(),selectedElementsIds:s.types.array(s.types.string),animatedElementsIds:s.types.array(s.types.string),history:s.types.optional(r.UndoManager,{targetPath:"../pages"}),_elementsPixelRatio:Math.min(2,window.devicePixelRatio||1),_activePageId:"",_forceShowCredit:!1,_key:"",_validated:!1}).views((e=>({get _bleedVisible(){return console.warn("store._bleedVisible is deprecated. Please use store.bleedVisible instead."),e.bleedVisible},get selectedElements(){return e.selectedElementsIds.map((t=>{for(const i of e.pages){for(const e of i.children){if(e.id===t){return e}}}})).filter((e=>!!e))},get children(){return e.pages},get selectedShapes(){const t=[];return(0,x.forEveryChild)({children:e.selectedElements},(e=>{"group"!==e.type&&t.push(e)})),t},get activePage(){return e.pages.slice().find((t=>t.id===e._activePageId))||(e.pages.length?e.pages[0]:null)},get duration(){let t=0;return e.pages.forEach((e=>{t+=e.duration})),t},get _hasCroppedImages(){return e.find((e=>"image"===e.type&&e._cropModeEnabled))},find(t){let i;return(0,x.forEveryChild)({children:e.pages},(e=>{if(!i&&t(e)){return i=e,!0}})),i},getElementById:t=>e.find((e=>e.id===t))}))).actions((e=>{let t=0,i=null,o=!1;return{afterCreate(){e.history.canUndo},setCurrentTime(t){e.currentTime=t},_togglePlaying(t=!e.isPlaying){e.isPlaying=t},play({animatedElementsIds:n=[],startTime:a=0,currentTime:r=0,endTime:l=e.duration,repeat:d=!1}={}){r&&(console.warn("currentTime property of store.play() is deprecated. Please use startTime instead."),a=r),e.animatedElementsIds=(0,s.cast)(n),e.currentTime=a,e.isPlaying=!0,t=Date.now(),i=l,o=d,requestAnimationFrame(e.seek)},checkActivePage(){let t=0;for(const i of e.pages){if(e.currentTime>=i.startTime&&e.currentTime<i.startTime+i.duration){e.selectPage(i.id);break}t+=i.duration}},seek(){if(!e.isPlaying){return}const n=Date.now(),a=n-t;t=n,e.currentTime+=a,e.checkActivePage();const s=i||e.duration;e.isPlaying&&e.currentTime<s?requestAnimationFrame(e.seek):e.isPlaying&&o?(e.currentTime=0,requestAnimationFrame(e.seek)):e.stop()},stop(){e.isPlaying=!1,e.currentTime=0,e.animatedElementsIds=(0,s.cast)([]),e.checkActivePage()}}})).actions((e=>({__(){e._validated||((0,g.validateKey)(e._key,e._forceShowCredit),e._validated=!0)},set(t){Object.assign(e,t)},setUnit({unit:t,dpi:i}){e.unit=t||e.unit,e.dpi=i||e.dpi},setRole(t){e.role=t},addPage(t){const i=P.Page.create(Object.assign({id:(0,l.nanoid)(10)},t));return e.pages.push(i),e._activePageId=i.id,i},selectPage(t){e._activePageId=t},selectElements(t){const i=t.map((t=>e.getElementById(t))).sort(((e,t)=>e.page.children.indexOf(e)-e.page.children.indexOf(t))).filter((e=>!!e)).map((e=>e.id));e.selectedElementsIds=(0,s.cast)(i)},toggleBleed(t){e.bleedVisible=null!=t?t:!e.bleedVisible},toggleRulers(t){e.rulesVisible=null!=t?t:!e.rulesVisible},openSidePanel(t){e.openedSidePanel!==t&&(e.previousOpenedSidePanel=e.openedSidePanel,e.openedSidePanel=t)},setScale(t){e.scale=t},_setScaleToFit(t){e.scaleToFit=t},setElementsPixelRatio(t){e._elementsPixelRatio=t},setSize(t,i,o){e.pages.forEach((e=>{e.setSize({width:t,height:i,useMagic:o,softChange:!0})})),e.width=t,e.height=i},setPageZIndex(t,i){const o=e.pages.find((e=>e.id===t));o&&((0,s.detach)(o),e.pages.remove(o),e.pages.splice(i,0,o))},deletePages(t){const i=e.pages.indexOf(e.activePage);t.forEach((t=>{const i=e.pages.find((e=>e.id===t));(0,s.destroy)(i)}));const o=Math.min(e.pages.length-1,i),n=e.pages[o];n&&(e._activePageId=n.id),e.selectedElementsIds=(0,s.cast)(e.selectedElementsIds.filter((t=>e.getElementById(t))))},groupElements(t){const i=t.map((t=>e.getElementById(t)));i.forEach((e=>{e&&(0,s.detach)(e)}));const o=e.activePage,n={id:(0,l.nanoid)(10),children:i,type:"group"};return o.children.push(n),e.selectedElementsIds=(0,s.cast)([n.id]),o.children.find((e=>e.id===n.id))},ungroupElements(t){const i=t.map((t=>e.getElementById(t))),o=[];i.forEach((e=>{if(e&&"group"===e.type){const t=e.page,i=t.children.indexOf(e);e.children.forEach((e=>{o.push(e.id)})),e.children.forEach((e=>{(0,s.detach)(e),t.children.push(e)})),t.children.splice(i,1)}})),e.selectedElementsIds=(0,s.cast)(o)},deleteElements(t){const i=[];e.find((e=>(t.includes(e.id)&&i.push(e),!1))),i.forEach((e=>{(0,s.destroy)(e)})),e.selectedElementsIds=(0,s.cast)(e.selectedElementsIds.filter((t=>e.getElementById(t))))},on(t,i){if("change"===t){let t=e.toJSON();return(0,s.onSnapshot)(e,(o=>{const n=e.toJSON();!(0,y.deepEqual)(t,n)&&(t=n,i(n))}))}},async _toCanvas({pixelRatio:t,ignoreBackground:i,pageId:o,mimeType:n,includeBleed:a,_skipTimeout:s,quickMode:r=!1}={}){var l;const c=t||1;o=o||(null===(l=e.pages[0])||void 0===l?void 0:l.id);const p=e.pages.find((e=>e.id===o));if(!p){throw new Error(`No page for export with id ${o}`)}r?null==p||p.set({_forceMount:!0}):null==p||p.set({_exporting:!0});const u=await(0,b.waitTillAvailable)((()=>d.default.stages.find((e=>e.getAttr("pageId")===o))));if(!u){throw null==p||p.set({_forceMount:!1,_exporting:!1}),new Error(`Export is failed. Can not find stage for page ${o}. Looks like <Workspace /> component is not mounted, but it is required in order to process the export.`)}const g=!!u.findOne(".page-container"),m=e._elementsPixelRatio;c>e._elementsPixelRatio&&e.setElementsPixelRatio(c),await e.waitLoading({_skipTimeout:s});const h=u.findOne(".page-container");if(!h){throw e.setElementsPixelRatio(m),null==p||p.set({_forceMount:!1,_exporting:!1}),new Error(`Export is failed. Can't find page container. ${g}`)}const f=u.position();u.position({x:0,y:0}),u.find("Transformer").forEach((e=>{e.setAttr("oldVisible",e.visible()),e.visible(!1)})),h.find(".page-background").forEach((e=>e.shadowEnabled(!1))),h.find(".page-background").forEach((e=>e.strokeEnabled(!1))),h.find(".highlighter").forEach((e=>e.visible(!1)));const y=h.findOne(".page-background-group"),v=y.clip();y.clip({x:null,y:null,width:null,height:null});const w=h.findOne(".elements-container"),P=w.clip();w.clip({x:null,y:null,width:null,height:null});const x=h.find((e=>e.getAttr("hideInExport")));x.forEach((e=>{e.setAttr("oldVisible",e.visible()),e.hide()}));const E=h.find((e=>!e.visible()&&e.getAttr("editModeEnabled")));E.forEach((e=>{e.setAttr("oldVisible",e.visible()),e.show()})),i&&h.find(".page-background").forEach((e=>e.hide()));const _=a?p.bleed:0;let O=_;!e.bleedVisible&&a||(e.bleedVisible||a?e.bleedVisible&&a?O=0:e.bleedVisible&&!a&&(O=-p.bleed):O=0);const k=document.createElement("canvas");k.width=Math.round((p.computedWidth+2*_)*c),k.height=Math.round((p.computedHeight+2*_)*c);const I=k.getContext("2d");"image/jpeg"===n&&(I.fillStyle="white",I.fillRect(0,0,k.width,k.height));const S=h.scale();h.scale({x:1,y:1});const T=h.toCanvas({x:h.x()-O,y:h.y()-O,width:p.computedWidth+2*_,height:p.computedHeight+2*_,pixelRatio:c});return h.scale(S),I.drawImage(T,0,0,k.width,k.height),d.default.Util.releaseCanvas(T),i&&h.find(".page-background").forEach((e=>e.show())),x.forEach((e=>{e.visible(e.getAttr("oldVisible"))})),E.forEach((e=>{e.visible(e.getAttr("oldVisible"))})),h.find(".page-background").forEach((e=>e.shadowEnabled(!0))),h.find(".page-background").forEach((e=>e.strokeEnabled(!0))),u.find("Transformer").forEach((e=>{e.visible(e.getAttr("oldVisible"))})),h.find(".highlighter").forEach((e=>e.visible(!0))),y.clip(v),w.clip(P),u.position(f),e.setElementsPixelRatio(m),null==p||p.set({_exporting:!1,_forceMount:!1}),k},async toDataURL(t={}){var{mimeType:i,quality:o}=t,a=n(t,["mimeType","quality"]);const s=await e._toCanvas(Object.assign({mimeType:i},a)),r=s.toDataURL(i,o);return d.default.Util.releaseCanvas(s),r},async toBlob(t={}){var{mimeType:i,quality:o}=t,a=n(t,["mimeType","quality"]);const s=await e._toCanvas(Object.assign({mimeType:i},a)),r=await new Promise((e=>{s.toBlob(e,i,o)}));return d.default.Util.releaseCanvas(s),r},async saveAsImage(t={}){var{fileName:i}=t,o=n(t,["fileName"]);const a=o.mimeType||"image/png",s=a.split("/")[1];(0,c.downloadFile)(await e.toDataURL(o),i||"polotno."+s,a)},async _toPDF(t){const i=t.dpi||e.dpi,o=t.parallel||1,n=t.unit||("px"===e.unit?"mm":e.unit),a=t.pixelRatio||1,s=t.pageIds||e.pages.map((e=>e.id)),r=e.pages.filter((e=>s.includes(e.id))),l=await(0,p.getJsPDF)(),d=e=>(0,f.pxToUnit)({px:e,unit:n,dpi:i}),c=t.cropMarkSize||0,u=d(c),g=r[0]||{},m=t.includeBleed?g.bleed:0,h=d(g.computedWidth+2*m+2*u),y=d(g.computedHeight+2*m+2*u);var b=new l({unit:n,orientation:h>y?"landscape":"portrait",format:[h,y],compress:!0,putOnlyUsedFonts:!0});b.deletePage(1);const v=((e,t)=>{for(var i=[],o=0;o<e.length;o+=t){i.push(e.slice(o,o+t))}return i})(r,o);let w=0;for(const p of v){const i=p.map((async i=>{const o=t.includeBleed?i.bleed:0,n=i.computedWidth+2*o+2*c,r=i.computedHeight+2*o+2*c,l=d(n),p=d(r);let u=0,g=a;for(;u<10;){u+=1,2===u&&console.error("Polotno can not export PDF with current settings. Quality is automatically reduced.");const o=await e.toDataURL(Object.assign(Object.assign({},t),{pageId:i.id,pixelRatio:g}));if(o.length>20){return t.onProgress&&t.onProgress(++w/s.length*.9),{url:o,width:l,height:p,widthPx:n,heightPx:r}}g*=.8}}));(await Promise.all(i)).forEach((({url:e,width:t,height:i,widthPx:o,heightPx:a})=>{b.addPage([t,i],t>i?"landscape":"portrait");const s=b.getCurrentPageInfo();var r;switch(n){case"pt":r=1;break;case"mm":r=72/25.4;break;case"cm":r=72/2.54;break;case"in":r=72;break;case"px":r=.75;break;case"pc":case"em":r=12;break;case"ex":r=6;break;default:throw"Invalid unit: "+n}if(s.pageContext.cropBox={bottomLeftX:0,bottomLeftY:0,topRightX:t*r,topRightY:i*r},s.pageContext.artBox={bottomLeftX:d(c+m)*r,bottomLeftY:d(c+m)*r,topRightX:d(o-c-m)*r,topRightY:d(a-c-m)*r},s.pageContext.bleedBox={bottomLeftX:d(c+m)*r,bottomLeftY:d(c+m)*r,topRightX:d(o-c-m)*r,topRightY:d(a-c-m)*r},u){b.setLineWidth(d(1));const e=u+d(m);b.line(e,0,e,u),b.line(0,e,u,e),b.line(t-e,0,t-e,u),b.line(t,e,t-u,e),b.line(0,i-e,u,i-e),b.line(e,i,e,i-u),b.line(t,i-e,t-u,i-e),b.line(t-e,i,t-e,i-u)}b.addImage(e,u,u,t-2*u,i-2*u,void 0,"FAST")}))}return b},toPDFDataURL:async t=>(await e._toPDF(Object.assign({mimeType:"image/jpeg"},t))).output("datauristring"),async toGIFDataURL(t={}){const i=t.pixelRatio||1,o=await(0,u.createGIF)({width:e.width*i,height:e.height*i}),n=1e3/(t.fps||10),a=e.duration/n;for(let s=0;s<a-1;s++){const t=s*n||1;e.setCurrentTime(t);let a=0,r="";for(const i of e.pages){if(a+=i.duration,i.set({_rendering:a>t}),a>t){r=i.id;break}}const l=await e._toCanvas({pixelRatio:i,pageId:r,_skipTimeout:!0});o.addFrame(l.getContext("2d"),{delay:n,copy:!0})}for(const s of e.pages){s.set({_rendering:!1})}return e.stop(),o.render(),new Promise((e=>{o.on("finished",(function(t){!function(e,t){var i=new FileReader;i.onload=function(e){t(e.target.result)},i.readAsDataURL(e)}(t,e)}))}))},async saveAsGIF(t={}){var{fileName:i}=t,o=n(t,["fileName"]);const a=await e.toGIFDataURL(o);(0,c.downloadFile)(a,i||"polotno.gif")},async toHTML({elementHook:t}={elementHook:void 0}){const i=e.toJSON();return(0,v.jsonToHTML)({json:i,elementHook:t})},async saveAsHTML({fileName:t}={}){const i=await e.toHTML(),o="data:text/html;base64,"+window.btoa(unescape(encodeURIComponent(i)));(0,c.downloadFile)(o,t||"polotno.html")},async toSVG({elementHook:t,pageId:i}={elementHook:void 0,pageId:void 0}){var o;const n=e.toJSON();i=i||(null===(o=n.pages[0])||void 0===o?void 0:o.id);const a=n.pages.find((e=>e.id===i));return(0,w.jsonToSVG)({json:Object.assign(Object.assign({},n),{pages:a?[a]:[]}),elementHook:t})},async saveAsSVG({fileName:t,elementHook:i,pageId:o}={}){const n=await e.toSVG({elementHook:i,pageId:o}),a="data:text/svg;base64,"+window.btoa(unescape(encodeURIComponent(n)));(0,c.downloadFile)(a,t||"polotno.svg")},async saveAsPDF(t={}){var{fileName:i}=t,o=n(t,["fileName"]);(await e._toPDF(Object.assign({mimeType:"image/jpeg"},o))).save(i||"polotno.pdf")},async waitLoading({_skipTimeout:e=!1}={}){e||await new Promise((e=>setTimeout(e,50))),await(0,h.whenLoaded)()},toJSON:()=>({width:e.width,height:e.height,fonts:(0,s.getSnapshot)(e.fonts),pages:(0,s.getSnapshot)(e.pages),audios:(0,s.getSnapshot)(e.audios),unit:e.unit,dpi:e.dpi,custom:e.custom}),loadJSON(t,i=!1){var o;const n=Object.assign({},t),a=e.pages.indexOf(e.activePage);let r=null===(o=n.pages[a]||n.pages[0])||void 0===o?void 0:o.id;n._activePageId=r;const l=Object.assign({},(0,s.getSnapshot)(e));Object.assign(l,n),l.history=i?e.history.toJSON():{history:[],undoIdx:-1},(0,s.applySnapshot)(e,l)},clear({keepHistory:t=!1}={}){const i=e.pages.map((e=>e.id));e.deletePages(i),e.custom=null,t||e.history.clear()},addFont(t){e.removeFont(t.fontFamily),e.fonts.push(t),e.loadFont(t.fontFamily)},removeFont(t){e.fonts.filter((e=>e.fontFamily===t)).forEach((e=>(0,s.destroy)(e)))},addAudio(t){const i=E.Audio.create(Object.assign({id:(0,l.nanoid)(10)},t));e.audios.push(i)},removeAudio(t){const i=e.audios.find((e=>e.id===t));i&&e.audios.remove(i)},async loadFont(t){const i=e.fonts.find((e=>e.fontFamily===t))||m.globalFonts.find((e=>e.fontFamily===t));let o=[{fontStyle:"normal",fontWeight:"normal"}];return i?(i.styles&&(o=i.styles.map((e=>({fontStyle:e.fontStyle||"normal",fontWeight:e.fontWeight||"normal"})))),m.injectCustomFont(i)):m.injectGoogleFont(t),Promise.all(o.map((e=>m.loadFont(t,e.fontStyle,e.fontWeight))))},validate:e=>exports.Store.validate(e,[{path:"",type:exports.Store}]).map((e=>({path:"store"+e.context.map((e=>e.path)).join("."),message:e.message})))}))),exports.default=_;
+var e,t=this&&this.__createBinding||(Object.create?function(e,t,i,n){void 0===n&&(n=i);var o=Object.getOwnPropertyDescriptor(t,i);o&&!("get"in o?!t.__esModule:o.writable||o.configurable)||(o={enumerable:!0,get:function(){return t[i]}}),Object.defineProperty(e,n,o)}:function(e,t,i,n){void 0===n&&(n=i),e[n]=t[i]}),i=this&&this.__setModuleDefault||(Object.create?function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}:function(e,t){e.default=t}),n=this&&this.__importStar||(e=function(t){return e=Object.getOwnPropertyNames||function(e){var t=[];for(var i in e){Object.prototype.hasOwnProperty.call(e,i)&&(t[t.length]=i)}return t},e(t)},function(n){if(n&&n.__esModule){return n}var o={};if(null!=n){for(var a=e(n),s=0;s<a.length;s++){"default"!==a[s]&&t(o,n,a[s])}}return i(o,n),o}),o=this&&this.__rest||function(e,t){var i={};for(var n in e){Object.prototype.hasOwnProperty.call(e,n)&&t.indexOf(n)<0&&(i[n]=e[n])}if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var o=0;for(n=Object.getOwnPropertySymbols(e);o<n.length;o++){t.indexOf(n[o])<0&&Object.prototype.propertyIsEnumerable.call(e,n[o])&&(i[n[o]]=e[n[o]])}}return i},a=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(exports,"__esModule",{value:!0}),exports.Store=exports.Font=void 0,exports.createStore=O;const s=require("mobx-state-tree"),r=require("./history"),l=require("nanoid"),d=a(require("konva")),c=require("../utils/download"),p=require("../utils/pdf"),g=require("../utils/gif-lib"),u=require("../utils/validate-key"),h=n(require("../utils/fonts")),m=require("../utils/flags"),f=require("../utils/loader"),y=require("../utils/unit"),b=require("../utils/deep-equal"),v=require("../utils/wait"),w=require("../utils/to-html"),P=require("../utils/to-svg"),x=require("./page-model"),E=require("./group-model"),_=require("./audio-model");function O({key:e,showCredit:t}={key:"",showCredit:!1}){return exports.Store.create({_forceShowCredit:t,_key:e})}(0,s.setLivelinessChecking)("ignore"),exports.Font=s.types.model("Font",{fontFamily:s.types.string,url:s.types.optional(s.types.string,""),styles:s.types.frozen()}).preProcessSnapshot((e=>Object.assign(Object.assign({},e),{fontFamily:e.fontFamily||e.name}))),exports.Store=s.types.model("Store",{role:"",pages:s.types.array(x.Page),fonts:s.types.array(exports.Font),audios:s.types.array(_.Audio),width:1080,height:1080,currentTime:0,isPlaying:!1,scale:1,scaleToFit:1,unit:"px",dpi:72,schemaVersion:1,bleedVisible:!1,rulesVisible:!1,openedSidePanel:"",previousOpenedSidePanel:"",custom:s.types.frozen(),selectedElementsIds:s.types.array(s.types.string),animatedElementsIds:s.types.array(s.types.string),history:s.types.optional(r.UndoManager,{targetPath:"../pages"}),_elementsPixelRatio:Math.min(2,window.devicePixelRatio||1),_activePageId:"",_forceShowCredit:!1,_key:"",_validated:!1}).views((e=>({get _bleedVisible(){return console.warn("store._bleedVisible is deprecated. Please use store.bleedVisible instead."),e.bleedVisible},get selectedElements(){return e.selectedElementsIds.map((t=>{for(const i of e.pages){for(const e of i.children){if(e.id===t){return e}}}})).filter((e=>!!e))},get children(){return e.pages},get selectedShapes(){const t=[];return(0,E.forEveryChild)({children:e.selectedElements},(e=>{"group"!==e.type&&t.push(e)})),t},get activePage(){return e.pages.slice().find((t=>t.id===e._activePageId))||(e.pages.length?e.pages[0]:null)},get duration(){let t=0;return e.pages.forEach((e=>{t+=e.duration})),t},get _hasCroppedImages(){return e.find((e=>"image"===e.type&&e._cropModeEnabled))},find(t){let i;return(0,E.forEveryChild)({children:e.pages},(e=>{if(!i&&t(e)){return i=e,!0}})),i},getElementById:t=>e.find((e=>e.id===t))}))).actions((e=>{let t=0,i=null,n=!1;return{afterCreate(){e.history.canUndo},setCurrentTime(t){e.currentTime=t},_togglePlaying(t=!e.isPlaying){e.isPlaying=t},play({animatedElementsIds:o=[],startTime:a=0,currentTime:r=0,endTime:l=e.duration,repeat:d=!1}={}){r&&(console.warn("currentTime property of store.play() is deprecated. Please use startTime instead."),a=r),e.animatedElementsIds=(0,s.cast)(o),e.currentTime=a,e.isPlaying=!0,t=Date.now(),i=l,n=d,requestAnimationFrame(e.seek)},checkActivePage(){let t=0;for(const i of e.pages){if(e.currentTime>=i.startTime&&e.currentTime<i.startTime+i.duration){e.selectPage(i.id);break}t+=i.duration}},seek(){if(!e.isPlaying){return}const o=Date.now(),a=o-t;t=o,e.currentTime+=a,e.checkActivePage();const s=i||e.duration;e.isPlaying&&e.currentTime<s?requestAnimationFrame(e.seek):e.isPlaying&&n?(e.currentTime=0,requestAnimationFrame(e.seek)):e.stop()},stop(){e.isPlaying=!1,e.currentTime=0,e.animatedElementsIds=(0,s.cast)([]),e.checkActivePage()}}})).actions((e=>({__(){e._validated||((0,u.validateKey)(e._key,e._forceShowCredit),e._validated=!0)},set(t){Object.assign(e,t)},setUnit({unit:t,dpi:i}){e.unit=t||e.unit,e.dpi=i||e.dpi},setRole(t){e.role=t},addPage(t){const i=x.Page.create(Object.assign({id:(0,l.nanoid)(10)},t));return e.pages.push(i),e._activePageId=i.id,i},selectPage(t){e._activePageId=t},selectElements(t){const i=t.map((t=>e.getElementById(t))).sort(((e,t)=>e.page.children.indexOf(e)-e.page.children.indexOf(t))).filter((e=>!!e)).map((e=>e.id));e.selectedElementsIds=(0,s.cast)(i)},toggleBleed(t){e.bleedVisible=null!=t?t:!e.bleedVisible},toggleRulers(t){e.rulesVisible=null!=t?t:!e.rulesVisible},openSidePanel(t){e.openedSidePanel!==t&&(e.previousOpenedSidePanel=e.openedSidePanel,e.openedSidePanel=t)},setScale(t){e.scale=t},_setScaleToFit(t){e.scaleToFit=t},setElementsPixelRatio(t){e._elementsPixelRatio=t},setSize(t,i,n){e.pages.forEach((e=>{e.setSize({width:t,height:i,useMagic:n,softChange:!0})})),e.width=t,e.height=i},setPageZIndex(t,i){const n=e.pages.find((e=>e.id===t));n&&((0,s.detach)(n),e.pages.remove(n),e.pages.splice(i,0,n))},deletePages(t){const i=e.pages.indexOf(e.activePage);t.forEach((t=>{const i=e.pages.find((e=>e.id===t));(0,s.destroy)(i)}));const n=Math.min(e.pages.length-1,i),o=e.pages[n];o&&(e._activePageId=o.id),e.selectedElementsIds=(0,s.cast)(e.selectedElementsIds.filter((t=>e.getElementById(t))))},groupElements(t){const i=t.map((t=>e.getElementById(t)));i.forEach((e=>{e&&(0,s.detach)(e)}));const n=e.activePage,o={id:(0,l.nanoid)(10),children:i,type:"group"};return n.children.push(o),e.selectedElementsIds=(0,s.cast)([o.id]),n.children.find((e=>e.id===o.id))},ungroupElements(t){const i=t.map((t=>e.getElementById(t))),n=[];i.forEach((e=>{if(e&&"group"===e.type){const t=e.page,i=t.children.indexOf(e);e.children.forEach((e=>{n.push(e.id)})),e.children.forEach((e=>{(0,s.detach)(e),t.children.push(e)})),t.children.splice(i,1)}})),e.selectedElementsIds=(0,s.cast)(n)},deleteElements(t){const i=[];e.find((e=>(t.includes(e.id)&&i.push(e),!1))),i.forEach((e=>{(0,s.destroy)(e)})),e.selectedElementsIds=(0,s.cast)(e.selectedElementsIds.filter((t=>e.getElementById(t))))},on(t,i){if("change"===t){let t=e.toJSON();return(0,s.onSnapshot)(e,(n=>{const o=e.toJSON();!(0,b.deepEqual)(t,o)&&(t=o,i(o))}))}},async _toCanvas({pixelRatio:t,ignoreBackground:i,pageId:n,mimeType:o,includeBleed:a,_skipTimeout:s,quickMode:r=!1}={}){var l;const c=t||1;n=n||(null===(l=e.pages[0])||void 0===l?void 0:l.id);const p=e.pages.find((e=>e.id===n));if(!p){throw new Error(`No page for export with id ${n}`)}r?null==p||p.set({_forceMount:!0}):null==p||p.set({_exporting:!0});const g=await(0,v.waitTillAvailable)((()=>d.default.stages.find((e=>e.getAttr("pageId")===n))));if(!g){throw null==p||p.set({_forceMount:!1,_exporting:!1}),new Error(`Export is failed. Can not find stage for page ${n}. Looks like <Workspace /> component is not mounted, but it is required in order to process the export.`)}const u=!!g.findOne(".page-container"),h=e._elementsPixelRatio;c>e._elementsPixelRatio&&e.setElementsPixelRatio(c),await e.waitLoading({_skipTimeout:s});const m=g.findOne(".page-container");if(!m){throw e.setElementsPixelRatio(h),null==p||p.set({_forceMount:!1,_exporting:!1}),new Error(`Export is failed. Can't find page container. ${u}`)}const f=g.position();g.position({x:0,y:0}),g.find("Transformer").forEach((e=>{e.setAttr("oldVisible",e.visible()),e.visible(!1)})),m.find(".page-background").forEach((e=>e.shadowEnabled(!1))),m.find(".page-background").forEach((e=>e.strokeEnabled(!1))),m.find(".highlighter").forEach((e=>e.visible(!1)));const y=m.findOne(".page-background-group"),b=y.clip();y.clip({x:null,y:null,width:null,height:null});const w=m.findOne(".elements-container"),P=w.clip();w.clip({x:null,y:null,width:null,height:null});const x=m.find((e=>e.getAttr("hideInExport")));x.forEach((e=>{e.setAttr("oldVisible",e.visible()),e.hide()}));const E=m.find((e=>!e.visible()&&e.getAttr("editModeEnabled")));E.forEach((e=>{e.setAttr("oldVisible",e.visible()),e.show()})),i&&m.find(".page-background").forEach((e=>e.hide()));const _=a?p.bleed:0;let O=_;!e.bleedVisible&&a||(e.bleedVisible||a?e.bleedVisible&&a?O=0:e.bleedVisible&&!a&&(O=-p.bleed):O=0);const S=document.createElement("canvas");S.width=Math.round((p.computedWidth+2*_)*c),S.height=Math.round((p.computedHeight+2*_)*c);const k=S.getContext("2d");"image/jpeg"===o&&(k.fillStyle="white",k.fillRect(0,0,S.width,S.height));const I=m.scale();m.scale({x:1,y:1});const T=m.toCanvas({x:m.x()-O,y:m.y()-O,width:p.computedWidth+2*_,height:p.computedHeight+2*_,pixelRatio:c});return m.scale(I),k.drawImage(T,0,0,S.width,S.height),d.default.Util.releaseCanvas(T),i&&m.find(".page-background").forEach((e=>e.show())),x.forEach((e=>{e.visible(e.getAttr("oldVisible"))})),E.forEach((e=>{e.visible(e.getAttr("oldVisible"))})),m.find(".page-background").forEach((e=>e.shadowEnabled(!0))),m.find(".page-background").forEach((e=>e.strokeEnabled(!0))),g.find("Transformer").forEach((e=>{e.visible(e.getAttr("oldVisible"))})),m.find(".highlighter").forEach((e=>e.visible(!0))),y.clip(b),w.clip(P),g.position(f),e.setElementsPixelRatio(h),null==p||p.set({_exporting:!1,_forceMount:!1}),S},async toDataURL(t={}){var{mimeType:i,quality:n}=t,a=o(t,["mimeType","quality"]);const s=await e._toCanvas(Object.assign({mimeType:i},a)),r=s.toDataURL(i,n);return d.default.Util.releaseCanvas(s),r},async toBlob(t={}){var{mimeType:i,quality:n}=t,a=o(t,["mimeType","quality"]);const s=await e._toCanvas(Object.assign({mimeType:i},a)),r=await new Promise((e=>{s.toBlob(e,i,n)}));return d.default.Util.releaseCanvas(s),r},async saveAsImage(t={}){var{fileName:i}=t,n=o(t,["fileName"]);const a=n.mimeType||"image/png",s=a.split("/")[1];(0,c.downloadFile)(await e.toDataURL(n),i||"polotno."+s,a)},async _toPDF(t){const i=t.dpi||e.dpi,n=t.parallel||1,o=t.unit||("px"===e.unit?"mm":e.unit),a=t.pixelRatio||1,s=t.pageIds||e.pages.map((e=>e.id)),r=e.pages.filter((e=>s.includes(e.id))),l=await(0,p.getJsPDF)(),d=e=>(0,y.pxToUnit)({px:e,unit:o,dpi:i}),c=t.cropMarkSize||0,g=d(c),u=r[0]||{},h=t.includeBleed?u.bleed:0,m=d(u.computedWidth+2*h+2*g),f=d(u.computedHeight+2*h+2*g);var b=new l({unit:o,orientation:m>f?"landscape":"portrait",format:[m,f],compress:!0,putOnlyUsedFonts:!0});b.deletePage(1);const v=((e,t)=>{for(var i=[],n=0;n<e.length;n+=t){i.push(e.slice(n,n+t))}return i})(r,n);let w=0;for(const p of v){const i=p.map((async i=>{const n=t.includeBleed?i.bleed:0,o=i.computedWidth+2*n+2*c,r=i.computedHeight+2*n+2*c,l=d(o),p=d(r);let g=0,u=a;for(;g<10;){g+=1,2===g&&console.error("Polotno can not export PDF with current settings. Quality is automatically reduced.");const n=await e.toDataURL(Object.assign(Object.assign({},t),{pageId:i.id,pixelRatio:u}));if(n.length>20){return t.onProgress&&t.onProgress(++w/s.length*.9),{url:n,width:l,height:p,widthPx:o,heightPx:r}}u*=.8}}));(await Promise.all(i)).forEach((({url:e,width:t,height:i,widthPx:n,heightPx:a})=>{b.addPage([t,i],t>i?"landscape":"portrait");const s=b.getCurrentPageInfo();var r;switch(o){case"pt":r=1;break;case"mm":r=72/25.4;break;case"cm":r=72/2.54;break;case"in":r=72;break;case"px":r=.75;break;case"pc":case"em":r=12;break;case"ex":r=6;break;default:throw"Invalid unit: "+o}if(s.pageContext.cropBox={bottomLeftX:0,bottomLeftY:0,topRightX:t*r,topRightY:i*r},s.pageContext.artBox={bottomLeftX:d(c+h)*r,bottomLeftY:d(c+h)*r,topRightX:d(n-c-h)*r,topRightY:d(a-c-h)*r},s.pageContext.bleedBox={bottomLeftX:d(c+h)*r,bottomLeftY:d(c+h)*r,topRightX:d(n-c-h)*r,topRightY:d(a-c-h)*r},g){b.setLineWidth(d(1));const e=g+d(h);b.line(e,0,e,g),b.line(0,e,g,e),b.line(t-e,0,t-e,g),b.line(t,e,t-g,e),b.line(0,i-e,g,i-e),b.line(e,i,e,i-g),b.line(t,i-e,t-g,i-e),b.line(t-e,i,t-e,i-g)}b.addImage(e,g,g,t-2*g,i-2*g,void 0,"FAST")}))}return b},toPDFDataURL:async t=>(await e._toPDF(Object.assign({mimeType:"image/jpeg"},t))).output("datauristring"),async toGIFDataURL(t={}){const i=t.pixelRatio||1,n=await(0,g.createGIF)({width:e.width*i,height:e.height*i}),o=1e3/(t.fps||10),a=e.duration/o;for(let s=0;s<a-1;s++){const t=s*o||1;e.setCurrentTime(t);let a=0,r="";for(const i of e.pages){if(a+=i.duration,i.set({_rendering:a>t}),a>t){r=i.id;break}}const l=await e._toCanvas({pixelRatio:i,pageId:r,_skipTimeout:!0});n.addFrame(l.getContext("2d"),{delay:o,copy:!0})}for(const s of e.pages){s.set({_rendering:!1})}return e.stop(),n.render(),new Promise((e=>{n.on("finished",(function(t){!function(e,t){var i=new FileReader;i.onload=function(e){t(e.target.result)},i.readAsDataURL(e)}(t,e)}))}))},async saveAsGIF(t={}){var{fileName:i}=t,n=o(t,["fileName"]);const a=await e.toGIFDataURL(n);(0,c.downloadFile)(a,i||"polotno.gif")},async toHTML({elementHook:t}={elementHook:void 0}){const i=e.toJSON();return(0,w.jsonToHTML)({json:i,elementHook:t})},async saveAsHTML({fileName:t}={}){const i=await e.toHTML(),n="data:text/html;base64,"+window.btoa(unescape(encodeURIComponent(i)));(0,c.downloadFile)(n,t||"polotno.html")},async toSVG({elementHook:t,pageId:i}={elementHook:void 0,pageId:void 0}){var n;const o=e.toJSON();i=i||(null===(n=o.pages[0])||void 0===n?void 0:n.id);const a=o.pages.find((e=>e.id===i));return(0,P.jsonToSVG)({json:Object.assign(Object.assign({},o),{pages:a?[a]:[]}),elementHook:t})},async saveAsSVG({fileName:t,elementHook:i,pageId:n}={}){const o=await e.toSVG({elementHook:i,pageId:n}),a="data:text/svg;base64,"+window.btoa(unescape(encodeURIComponent(o)));(0,c.downloadFile)(a,t||"polotno.svg")},async saveAsPDF(t={}){var{fileName:i}=t,n=o(t,["fileName"]);(await e._toPDF(Object.assign({mimeType:"image/jpeg"},n))).save(i||"polotno.pdf")},async waitLoading({_skipTimeout:e=!1}={}){e||await new Promise((e=>setTimeout(e,50))),await(0,f.whenLoaded)()},toJSON:()=>({width:e.width,height:e.height,fonts:(0,s.getSnapshot)(e.fonts),pages:(0,s.getSnapshot)(e.pages),audios:(0,s.getSnapshot)(e.audios),unit:e.unit,dpi:e.dpi,custom:e.custom,schemaVersion:e.schemaVersion}),loadJSON(t,i=!1){var n;const o=Object.assign({},t);void 0===o.schemaVersion&&m.flags.htmlRenderEnabled&&(0,E.forEveryChild)({children:o.pages},(e=>{if("text"===e.type){const t=16,i=e.letterSpacing*t;e.letterSpacing=i/e.fontSize}}));const a=e.pages.indexOf(e.activePage);let r=null===(n=o.pages[a]||o.pages[0])||void 0===n?void 0:n.id;o._activePageId=r;const l=Object.assign({},(0,s.getSnapshot)(e));Object.assign(l,o),l.history=i?e.history.toJSON():{history:[],undoIdx:-1},(0,s.applySnapshot)(e,l)},clear({keepHistory:t=!1}={}){const i=e.pages.map((e=>e.id));e.deletePages(i),e.custom=null,t||e.history.clear()},addFont(t){e.removeFont(t.fontFamily),e.fonts.push(t),e.loadFont(t.fontFamily)},removeFont(t){e.fonts.filter((e=>e.fontFamily===t)).forEach((e=>(0,s.destroy)(e)))},addAudio(t){const i=_.Audio.create(Object.assign({id:(0,l.nanoid)(10)},t));e.audios.push(i)},removeAudio(t){const i=e.audios.find((e=>e.id===t));i&&e.audios.remove(i)},async loadFont(t){const i=e.fonts.find((e=>e.fontFamily===t))||h.globalFonts.find((e=>e.fontFamily===t));let n=[{fontStyle:"normal",fontWeight:"normal"}];return i?(i.styles&&(n=i.styles.map((e=>({fontStyle:e.fontStyle||"normal",fontWeight:e.fontWeight||"normal"})))),h.injectCustomFont(i)):h.injectGoogleFont(t),Promise.all(n.map((e=>h.loadFont(t,e.fontStyle,e.fontWeight))))},validate:e=>exports.Store.validate(e,[{path:"",type:exports.Store}]).map((e=>({path:"store"+e.context.map((e=>e.path)).join("."),message:e.message})))}))),exports.default=O;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "polotno",
-  "version": "2.23.0",
+  "version": "2.23.2",
   "description": "Design Editor Framework",
   "author": "Anton Lavrenov",
   "keywords": [

package/polotno-app.d.ts

@@ -110,6 +110,7 @@ export declare function createPolotnoApp({ container, key, showCredit, sections
         scaleToFit: import("mobx-state-tree").IType<number, number, number>;
         unit: import("mobx-state-tree").IType<string, string, string>;
         dpi: import("mobx-state-tree").IType<number, number, number>;
+        schemaVersion: import("mobx-state-tree").IType<number, number, number>;
         bleedVisible: import("mobx-state-tree").IType<boolean, boolean, boolean>;
         rulesVisible: import("mobx-state-tree").IType<boolean, boolean, boolean>;
         openedSidePanel: import("mobx-state-tree").IType<string, string, string>;
@@ -1085,6 +1086,7 @@ export declare function createPolotnoApp({ container, key, showCredit, sections
             unit: string;
             dpi: number;
             custom: any;
+            schemaVersion: number;
         };
         loadJSON(json: any, keepHistory?: boolean): void;
         clear({ keepHistory }?: {
@@ -1195,6 +1197,7 @@ export declare function createPolotnoApp({ container, key, showCredit, sections
         scaleToFit: import("mobx-state-tree").IType<number, number, number>;
         unit: import("mobx-state-tree").IType<string, string, string>;
         dpi: import("mobx-state-tree").IType<number, number, number>;
+        schemaVersion: import("mobx-state-tree").IType<number, number, number>;
         bleedVisible: import("mobx-state-tree").IType<boolean, boolean, boolean>;
         rulesVisible: import("mobx-state-tree").IType<boolean, boolean, boolean>;
         openedSidePanel: import("mobx-state-tree").IType<string, string, string>;
@@ -2170,6 +2173,7 @@ export declare function createPolotnoApp({ container, key, showCredit, sections
             unit: string;
             dpi: number;
             custom: any;
+            schemaVersion: number;
         };
         loadJSON(json: any, keepHistory?: boolean): void;
         clear({ keepHistory }?: {

package/polotno.bundle.js

@@ -226,20 +226,20 @@ https://polotno.com/docs/server-api`,lR={unsplashList:({query:e,page:t=1})=>`${l
           0     0     0     1 0" />
       </filter>
     </svg>
-  `,n}}}async function sn(e){return new Promise((t,n)=>{let r=document.createElement("video");r.crossOrigin="anonymous",r.src=e,r.addEventListener("loadedmetadata",()=>{let{videoWidth:e,videoHeight:n}=r;t({width:e,height:n})}),r.addEventListener("error",t=>{let r=e.slice(0,100);n(Error(`Failed to load video: ${r}`))})})}async function sr(e){return new Promise(t=>{let n=document.createElement("video");n.crossOrigin="anonymous",n.src=e,n.addEventListener("loadedmetadata",()=>{let{duration:e}=n;t(e)})})}async function si(e,t=5){return new Promise((n,r)=>{var i=document.createElement("video"),o=document.createElement("canvas");o.width=480,o.height=360;var a=o.getContext("2d");i.crossOrigin="anonymous",i.src=e,i.addEventListener("error",e=>{r(e)}),i.addEventListener("loadeddata",function(){let e=i.videoWidth/i.videoHeight;o.width=480,o.height=480/e,i.currentTime=t}),i.addEventListener("seeked",function(){a.drawImage(i,0,0,o.width,o.height);try{var e=o.toDataURL();n(e)}catch(e){r(e)}})})}async function so(e,t,n){return new Promise((r,i)=>{let o=t.getContext("2d"),a=()=>{try{o.drawImage(e,0,0,t.width,t.height);let n=t.toDataURL();r(n),e.removeEventListener("seeked",a)}catch(t){i(t),e.removeEventListener("seeked",a)}};e.addEventListener("seeked",a),e.currentTime=n})}let sa=(e,t,...n)=>({type:e,props:t,children:n||[]}),sl=async({element:e,page:t,store:n})=>{let r,i,{src:o}=e;"svg"===e.type&&Object.keys(e.colorsReplace).length&&(o=oi(await i7(o),new Map(Object.entries(e.colorsReplace))));let a="";e.flipX&&(a+="scaleX(-1)"),e.flipY&&(a+="scaleY(-1)"),a||(a="none");let l={};if(e.clipSrc){let t=await i9(e.clipSrc);l["clip-path"]=`url(${t})`}let s=await l5(o),u=s.width*e.cropWidth,c=s.height*e.cropHeight,d=e.width/e.height;"svg"===e.type?(r=u,i=c):d>=u/c?(r=u,i=u/d):(r=c*d,i=c);let h=r/s.width,f=i/s.height,p=r/i>e.width/e.height?e.height/i:e.width/r,g=r*p/h,m=i*p/f,v=e.cropX*p*s.width,y=e.cropY*p*s.height;return sa("div",{style:{...l,width:"100%",height:"100%","border-radius":e.cornerRadius+"px",border:e.borderSize?`${e.borderSize}px solid ${e.borderColor}`:"none",background:`url(${o})`,transform:a,"background-size":`${Math.round(g)}px ${Math.round(m)}px`,"background-position-x":`${-Math.round(v)}px`,"background-position-y":`${-Math.round(y)}px`}})},ss=({element:e,type:t})=>{let n={"stroke-width":e.height,stroke:e.color,"line-cap":"round","stroke-linejoin":"round",opacity:e.opacity};if("arrow"===t||"triangle"===t)return sa("polyline",{points:`${3*e.height},${-(2*e.height)} 0,0 ${3*e.height},${2*e.height}`,...n});if("bar"===t)return sa("polyline",{points:`0,${-(2*e.height)} 0,${2*e.height}`,...n});if("circle"===t)return sa("circle",{r:e.height,...n});if("square"===t)return sa("polyline",{points:`${-e.height},${-e.height} ${-e.height},${e.height} ${e.height},${e.height} ${e.height},${-e.height}`,...n});else return null},su={image:sl,svg:sl,text:async({element:e,page:t,store:n})=>{let r={top:0,left:0};e.fill.indexOf("gradient")>=0&&(r={...r,"background-color":e.fill,"background-image":e.fill,"background-clip":"text","text-fill-color":"transparent","-webkit-background-clip":"text","-webkit-text-fill-color":"transparent"});let i=e.backgroundPadding*(e.fontSize*e.lineHeight),o=sa("div",{style:{position:"absolute",top:-i/2+"px",left:-i/2+"px",display:e.backgroundEnabled?"block":"none",width:e.width+i+"px",height:e.height+i+"px","background-color":e.backgroundColor,"border-radius":e.backgroundCornerRadius*(e.fontSize*e.lineHeight*.5)+"px"}});"middle"===e.verticalAlign?(r.top="50%",r.transform="translateY(-50%)"):"bottom"===e.verticalAlign&&(r.bottom=0);let a=/<[a-z][\s\S]*>/i.test(e.text),l={...r,position:"absolute",width:e.width+"px",color:e.fill,"white-space":"pre-wrap","font-size":e.fontSize+"px","text-align":e.align,"font-family":e.fontFamily,"text-decoration":e.textDecoration||"none","line-height":e.lineHeight,"letter-spacing":e.letterSpacing+"em","font-style":e.fontStyle,"font-weight":e.fontWeight,"-webkit-text-stroke":`${e.strokeWidth}px ${e.stroke}`,"text-stroke":`${e.strokeWidth}px ${e.stroke}`},s="el-"+e.id,u=`<style>#${s} {${aa}}</style>`,c=sa("div",{style:l,...a?{id:s}:{},innerHTML:a?`${u}${e.text}`:e.text.split("\n").join("<br />")});return sa("div",{style:{position:"relative",width:"100%",height:"100%"}},o,c)},line:async({element:e,page:t,store:n})=>sa("svg",{style:{width:"100%",height:"100%",contain:"layout style size",overflow:"visible"}},sa("rect",{x:0,y:0,width:e.width,height:e.height,fill:e.color}),sa("g",{transform:`translate(0 ${e.height/2})`},ss({element:e,type:e.startHead})),sa("g",{transform:`translate(${e.width} ${e.height/2}) rotate(180)`},ss({element:e,type:e.endHead}))),figure:async({element:e,page:t,store:n,elementHook:r})=>{let i=sa("div",{innerHTML:ln(e)});return r&&r({dom:i,element:e})||i},group:async({element:e,page:t,store:n,elementHook:r})=>{let i=await Promise.all(e.children.map(e=>sc({element:e,page:t,store:n,elementHook:r}))),o=sa("div",{style:{"transform-origin":"top left",opacity:e.opacity}},...i);return r&&r({dom:o,element:e})||o},video:async({element:e,page:t,store:n,elementHook:r})=>{let i,o,{cropX:a,cropY:l,cropWidth:s,cropHeight:u}=e,c=await sn(e.src),d=c.width*s,h=c.height*u,f=e.width/e.height;f>=d/h?(i=d,o=d/f):(i=h*f,o=h);let p=i/s,g=o/u,m=a*c.width,v=l*c.height,y=Math.max(e.width/c.width,e.height/c.height),b={position:"absolute",width:`${Math.round(p*y)}px`,height:`${Math.round(g*y)}px`,left:`${-Math.round(m*y)}px`,top:`${-Math.round(v*y)}px`,"object-fit":"fill"},x=`video-${e.id}`,w=sa("div",{style:{position:"relative",width:"100%",height:"100%",overflow:"hidden","border-radius":e.cornerRadius+"px",border:e.borderSize?`${e.borderSize}px solid ${e.borderColor}`:"none"}},sa("video",{id:x,src:e.src,style:b,controls:!0,playsInline:!0,muted:!0,volume:e.volume}));return r&&r({dom:w,element:e})||w},gif:sl};async function sc({element:e,page:t,store:n,elementHook:r}){let i=await su[e.type];if(i||(i=()=>sa("div",{}),console.error(`HTML export does not support ${e.type} type...`)),!e.visible)return null;let o=await i({element:e,page:t,store:n}),a=[],l=[];if(e.blurEnabled&&a.push(`blur(${e.blurRadius/2}px)`),e.brightnessEnabled&&a.push(`brightness(${100*e.brightness+100}%)`),e.sepiaEnabled&&a.push("sepia()"),e.grayscaleEnabled&&a.push("grayscale()"),e.filters)for(let[t,n]of Object.entries(e.filters)){let e=st(se[t],n.intensity);e&&(a.push(e.filter),e.html&&l.push(e.html))}e.shadowEnabled&&a.push(`drop-shadow(${e.shadowOffsetX}px ${e.shadowOffsetY}px ${e.shadowBlur}px ${e.shadowColor})`);let s=sa("div",{id:e.id,style:{position:"absolute",left:e.x+"px",top:e.y+"px",width:e.width+"px",height:e.height+"px",transform:`rotate(${e.rotation}deg)`,"transform-origin":"top left",opacity:e.opacity,display:e.visible&&e.showInExport?"block":"none",filter:a.join(" ")||"none"}},o,...l);return r&&r({dom:s,element:e})||s}async function sd({page:e,store:t,elementHook:n}){let r=await Promise.all(e.children.map(r=>sc({element:r,page:e,store:t,elementHook:n}))),i="auto"===e.width?t.width:e.width,o="auto"===e.height?t.height:e.height,a={};if(e.background.indexOf("url")>=0||e.background.indexOf("http")>=0||e.background.indexOf(".jpg")>=0||e.background.indexOf(".png")>=0||e.background.indexOf(".jpeg")>=0){let{width:n,height:i}=await l5(e.background),o=await sl({element:{x:0,y:0,width:n,height:i,src:e.background,cornerRadius:0,...l7({width:n,height:i},{width:n,height:i})},page:e,store:t});r.unshift(o)}else a={...a,"background-color":e.background};return sa("div",{className:"page",id:e.id,style:{...a,width:i+"px",height:o+"px",overflow:"hidden",position:"relative"}},...r)}async function sh({json:e,elementHook:t}){let n=await Promise.all(e.pages.map(n=>sd({page:n,store:e,elementHook:t}))),r=[];e.pages.forEach(e=>{e.children.forEach(e=>{"text"===e.type&&-1===r.indexOf(e.fontFamily)&&r.push(e.fontFamily)})});let i=r.map(t=>e.fonts.find(e=>e.fontFamily===t)?sa("style",{},""):sa("link",{href:iR(t),rel:"stylesheet"}));return sa("div",{className:"design"},...i,...n)}let sf=(e,t)=>"object"==typeof t?`${e}="${Object.keys(t).map(e=>`${e}:${t[e]};`).join(" ")}"`:`${e}="${t}"`,sp=({dom:e})=>{if("string"==typeof e)return e;if(!e)return"";let{innerHTML:t,...n}=e.props;return`<${e.type} ${Object.keys(n).map(t=>sf(t,e.props[t])).join(" ")}>${t||e.children.map(e=>sp({dom:e})).join("")}</${e.type}>`};async function sg({json:e,elementHook:t}){return sp({dom:await sh({json:e,elementHook:t})})}let sm=(e,t)=>{if(e.children)for(let n of e.children){if(!0===t(n))break;sm(n,t)}},sv=(e,t,...n)=>({type:e,props:t,children:n||[]}),sy=async e=>{try{let t=await fetch(e);{let e=await t.arrayBuffer(),n=oM.from(e).toString("base64"),r=t.headers.get("content-type")||"image/png";return`data:${r};base64,${n}`}}catch(t){return console.error("Error converting URL to data URL:",t),e}},sb=async({element:e,page:t,store:n})=>{let r,i,{src:o}=e;o="svg"===e.type?oi(await i7(o),new Map(Object.entries(e.colorsReplace))):await sy(o);let a="";e.flipX&&(a+="scaleX(-1)"),e.flipY&&(a+="scaleY(-1)"),e.clipSrc&&await i9(e.clipSrc);let l=await l5(o),s=l.width*e.cropWidth,u=l.height*e.cropHeight,c=e.width/e.height;"svg"===e.type?(r=s,i=u):c>=s/u?(r=s,i=s/c):(r=u*c,i=u);let d=r/l.width,h=i/l.height,f=r/i>e.width/e.height?e.height/i:e.width/r,p=r*f/d,g=i*f/h,m=e.cropX*l.width*f,v=e.cropY*l.height*f,y=`clip-${e.id}`,b=o.replace(/&/g,"&amp;");return sv("g",{style:{transform:a}},sv("defs",{},sv("clipPath",{id:y},sv("rect",{x:0,y:0,width:e.width,height:e.height}))),sv("image",{href:b,x:-m,y:-v,width:p,height:g,preserveAspectRatio:"none","clip-path":`url(#${y})`}))},sx=({element:e,type:t})=>{let n={"stroke-width":e.height,stroke:e.color,"line-cap":"round","stroke-linejoin":"round",opacity:e.opacity};if("arrow"===t||"triangle"===t)return sv("polyline",{points:`${3*e.height},${-(2*e.height)} 0,0 ${3*e.height},${2*e.height}`,...n});if("bar"===t)return sv("polyline",{points:`0,${-(2*e.height)} 0,${2*e.height}`,...n});if("circle"===t)return sv("circle",{r:e.height,...n});if("square"===t)return sv("polyline",{points:`${-e.height},${-e.height} ${-e.height},${e.height} ${e.height},${e.height} ${e.height},${-e.height}`,...n});else return null},sw={image:sb,svg:sb,text:async({element:e,page:t,store:n})=>{let r=(e,t,n,r,i)=>{let o=document.createElement("canvas").getContext("2d");return o.font=`${i} ${r} ${t}px ${n}`,o.measureText(e).width},i=((e,t,n,i,o,a)=>{let l=[];return e.split("\n").forEach(e=>{let s=e.split(" "),u="";for(let e=0;e<s.length;e++){let c=u+s[e]+" ";r(c,n,i,o,a)>t+.5&&e>0?(l.push(u.trim()),u=s[e]+" "):u=c}l.push(u.trim())}),l})(e.text,e.width,e.fontSize,e.fontFamily,e.fontWeight,e.fontStyle),o=e.fontSize*e.lineHeight,a="center"===e.align?"middle":"right"===e.align?"end":"start",l=i.map((t,n)=>sv("tspan",{x:"center"===e.align?e.width/2:"right"===e.align?e.width:0,dy:0===n?0:o,innerHTML:t}));return sv("g",{},sv("text",{fill:e.fill,y:e.fontSize,"font-size":e.fontSize+"px","text-anchor":a,"font-family":e.fontFamily,"font-style":e.fontStyle,"font-weight":e.fontWeight,"text-decoration":e.textDecoration,"line-height":e.lineHeight,"letter-spacing":e.letterSpacing+"em","stroke-width":e.strokeWidth,stroke:e.stroke},...l))},line:async({element:e,page:t,store:n})=>sv("g",{},sv("line",{x1:0,y1:e.height/2,x2:e.width,y2:e.height/2,stroke:e.color,"stroke-width":e.height}),sv("g",{transform:`translate(0 ${e.height/2})`},sx({element:e,type:e.startHead})),sv("g",{transform:`translate(${e.width} ${e.height/2}) rotate(180)`},sx({element:e,type:e.endHead}))),figure:async({element:e,page:t,store:n,elementHook:r})=>{let i,o=sv("g",{innerHTML:ln(e).replace(/<svg[^>]*>/,"").replace(/<\/svg>/,"")});return r&&r({dom:o,element:e})||o},group:async({element:e,page:t,store:n,elementHook:r})=>{let i=await Promise.all(e.children.map(e=>sC({element:e,page:t,store:n,elementHook:r}))),o=sv("g",{opacity:e.opacity,style:{"transform-origin":"top left"}},...i);return r&&r({dom:o,element:e})||o},gif:sb};async function sC({element:e,page:t,store:n,elementHook:r}){let i=await sw[e.type];i||(i=()=>sv("g",{}),console.error(`SVG export does not support ${e.type} type...`));let o=await i({element:e,page:t,store:n}),a=[],l=[];if(e.blurEnabled&&a.push(`blur(${e.blurRadius/2}px)`),e.brightnessEnabled&&a.push(`brightness(${100*e.brightness+100}%)`),e.sepiaEnabled&&a.push("sepia()"),e.grayscaleEnabled&&a.push("grayscale()"),e.shadowEnabled&&a.push(`drop-shadow(${e.shadowOffsetX}px ${e.shadowOffsetY}px ${e.shadowBlur}px ${e.shadowColor})`),e.filters)for(let[t,n]of Object.entries(e.filters)){let e=st(se[t],n.intensity);if(e&&(a.push(e.filter),e.html)){let t=e.html.replace(/<svg([^>]*)>/,"<g$1>").replace(/<\/svg>/,"</g>");l.push(t)}}let s=sv("g",{className:"element",id:e.id,transform:"group"!==e.type?`translate(${e.x}, ${e.y}) rotate(${e.rotation})`:void 0,display:e.visible?void 0:"none",style:{"transform-origin":"top left",filter:a.join(" ")}},o,...l);return r&&r({dom:s,element:e})||s}async function s_({page:e,store:t,elementHook:n}){let r,i=await Promise.all(e.children.map(r=>sC({element:r,page:e,store:t,elementHook:n}))),o=e.background.indexOf("url")>=0||e.background.indexOf("http")>=0||e.background.indexOf(".jpg")>=0||e.background.indexOf(".png")>=0||e.background.indexOf(".jpeg")>=0;if(o){let n=await l5(e.background);r=await l9(e.background,{width:t.width,height:t.height,x:0,y:0,...l7({width:t.width,height:t.height},{width:n.width,height:n.height})})}return sv("g",{className:"page",style:{}},o?sv("image",{"xlink:href":r,x:0,y:0,width:t.width,height:t.height,preserveAspectRatio:"none"}):sv("rect",{x:0,y:0,width:t.width,height:t.height,fill:o?void 0:e.background}),...i)}async function sS(e){try{let t=await fetch(e),n=await t.blob();return new Promise((e,t)=>{let r=new FileReader;r.onloadend=()=>e(r.result),r.onerror=t,r.readAsDataURL(n)})}catch(t){return console.error("Error embedding font:",t),e}}async function sE(e,t){return await Promise.all(e.map(async e=>{let n=t.find(t=>t.fontFamily===e);if(n){let t=await sS(n.url);return sv("style",{},`@font-face { font-family: ${e}; src: url(${t}); }`)}{let t=`https://fonts.googleapis.com/css?family=${e}:bi,normal,i,b`;try{let n=await fetch(t),r=await n.text(),i=r.match(/url\((.*?)\)/g)?.map(e=>e.replace(/url\((.*?)\)/,"$1"))?.filter(e=>e.startsWith("https"));if(!i?.length)throw Error("No font URLs found");let o=await Promise.all(i.map(async t=>{let n=await sS(t),i=r.match(/font-style:\s*(.*?);/),o=r.match(/font-weight:\s*(.*?);/),a=i?i[1]:"normal",l=o?o[1]:"normal";return`@font-face {
+  `,n}}}async function sn(e){return new Promise((t,n)=>{let r=document.createElement("video");r.crossOrigin="anonymous",r.src=e,r.addEventListener("loadedmetadata",()=>{let{videoWidth:e,videoHeight:n}=r;t({width:e,height:n})}),r.addEventListener("error",t=>{let r=e.slice(0,100);n(Error(`Failed to load video: ${r}`))})})}async function sr(e){return new Promise(t=>{let n=document.createElement("video");n.crossOrigin="anonymous",n.src=e,n.addEventListener("loadedmetadata",()=>{let{duration:e}=n;t(e)})})}async function si(e,t=5){return new Promise((n,r)=>{var i=document.createElement("video"),o=document.createElement("canvas");o.width=480,o.height=360;var a=o.getContext("2d");i.crossOrigin="anonymous",i.src=e,i.addEventListener("error",e=>{r(e)}),i.addEventListener("loadeddata",function(){let e=i.videoWidth/i.videoHeight;o.width=480,o.height=480/e,i.currentTime=t}),i.addEventListener("seeked",function(){a.drawImage(i,0,0,o.width,o.height);try{var e=o.toDataURL();n(e)}catch(e){r(e)}})})}async function so(e,t,n){return new Promise((r,i)=>{let o=t.getContext("2d"),a=()=>{try{o.drawImage(e,0,0,t.width,t.height);let n=t.toDataURL();r(n),e.removeEventListener("seeked",a)}catch(t){i(t),e.removeEventListener("seeked",a)}};e.addEventListener("seeked",a),e.currentTime=n})}let sa=(e,t,...n)=>({type:e,props:t,children:n||[]}),sl=async({element:e,page:t,store:n})=>{let r,i,{src:o}=e;"svg"===e.type&&Object.keys(e.colorsReplace).length&&(o=oi(await i7(o),new Map(Object.entries(e.colorsReplace))));let a="";e.flipX&&(a+="scaleX(-1)"),e.flipY&&(a+="scaleY(-1)"),a||(a="none");let l={};if(e.clipSrc){let t=await i9(e.clipSrc);l["clip-path"]=`url(${t})`}let s=await l5(o),u=s.width*e.cropWidth,c=s.height*e.cropHeight,d=e.width/e.height;"svg"===e.type?(r=u,i=c):d>=u/c?(r=u,i=u/d):(r=c*d,i=c);let h=r/s.width,f=i/s.height,p=r/i>e.width/e.height?e.height/i:e.width/r,g=r*p/h,m=i*p/f,v=e.cropX*p*s.width,y=e.cropY*p*s.height;return sa("div",{style:{...l,width:"100%",height:"100%","border-radius":e.cornerRadius+"px",border:e.borderSize?`${e.borderSize}px solid ${e.borderColor}`:"none",backgroundRepeat:"no-repeat",background:`url(${o})`,transform:a,"background-size":`${Math.round(g)}px ${Math.round(m)}px`,"background-position-x":`${-Math.round(v)}px`,"background-position-y":`${-Math.round(y)}px`}})},ss=({element:e,type:t})=>{let n={"stroke-width":e.height,stroke:e.color,"line-cap":"round","stroke-linejoin":"round",opacity:e.opacity};if("arrow"===t||"triangle"===t)return sa("polyline",{points:`${3*e.height},${-(2*e.height)} 0,0 ${3*e.height},${2*e.height}`,...n});if("bar"===t)return sa("polyline",{points:`0,${-(2*e.height)} 0,${2*e.height}`,...n});if("circle"===t)return sa("circle",{r:e.height,...n});if("square"===t)return sa("polyline",{points:`${-e.height},${-e.height} ${-e.height},${e.height} ${e.height},${e.height} ${e.height},${-e.height}`,...n});else return null},su={image:sl,svg:sl,text:async({element:e,page:t,store:n})=>{let r={top:0,left:0};e.fill.indexOf("gradient")>=0&&(r={...r,"background-color":e.fill,"background-image":e.fill,"background-clip":"text","text-fill-color":"transparent","-webkit-background-clip":"text","-webkit-text-fill-color":"transparent"});let i=e.backgroundPadding*(e.fontSize*e.lineHeight),o=sa("div",{style:{position:"absolute",top:-i/2+"px",left:-i/2+"px",display:e.backgroundEnabled?"block":"none",width:e.width+i+"px",height:e.height+i+"px","background-color":e.backgroundColor,"border-radius":e.backgroundCornerRadius*(e.fontSize*e.lineHeight*.5)+"px"}});"middle"===e.verticalAlign?(r.top="50%",r.transform="translateY(-50%)"):"bottom"===e.verticalAlign&&(r.bottom=0);let a=/<[a-z][\s\S]*>/i.test(e.text),l={...r,position:"absolute",width:e.width+"px",color:e.fill,"white-space":"pre-wrap","font-size":e.fontSize+"px","text-align":e.align,"font-family":e.fontFamily,"text-decoration":e.textDecoration||"none","line-height":e.lineHeight,"letter-spacing":e.letterSpacing+"em","font-style":e.fontStyle,"font-weight":e.fontWeight,"-webkit-text-stroke":`${e.strokeWidth}px ${e.stroke}`,"text-stroke":`${e.strokeWidth}px ${e.stroke}`},s="el-"+e.id,u=`<style>#${s} {${aa}}</style>`,c=sa("div",{style:l,...a?{id:s}:{},innerHTML:a?`${u}${e.text}`:e.text.split("\n").join("<br />")});return sa("div",{style:{position:"relative",width:"100%",height:"100%"}},o,c)},line:async({element:e,page:t,store:n})=>sa("svg",{style:{width:"100%",height:"100%",contain:"layout style size",overflow:"visible"}},sa("rect",{x:0,y:0,width:e.width,height:e.height,fill:e.color}),sa("g",{transform:`translate(0 ${e.height/2})`},ss({element:e,type:e.startHead})),sa("g",{transform:`translate(${e.width} ${e.height/2}) rotate(180)`},ss({element:e,type:e.endHead}))),figure:async({element:e,page:t,store:n,elementHook:r})=>{let i=sa("div",{innerHTML:ln(e)});return r&&r({dom:i,element:e})||i},group:async({element:e,page:t,store:n,elementHook:r})=>{let i=await Promise.all(e.children.map(e=>sc({element:e,page:t,store:n,elementHook:r}))),o=sa("div",{style:{"transform-origin":"top left",opacity:e.opacity}},...i);return r&&r({dom:o,element:e})||o},video:async({element:e,page:t,store:n,elementHook:r})=>{let i,o,{cropX:a,cropY:l,cropWidth:s,cropHeight:u}=e,c=await sn(e.src),d=c.width*s,h=c.height*u,f=e.width/e.height;f>=d/h?(i=d,o=d/f):(i=h*f,o=h);let p=i/s,g=o/u,m=a*c.width,v=l*c.height,y=Math.max(e.width/c.width,e.height/c.height),b={position:"absolute",width:`${Math.round(p*y)}px`,height:`${Math.round(g*y)}px`,left:`${-Math.round(m*y)}px`,top:`${-Math.round(v*y)}px`,"object-fit":"fill"},x=`video-${e.id}`,w=sa("div",{style:{position:"relative",width:"100%",height:"100%",overflow:"hidden","border-radius":e.cornerRadius+"px",border:e.borderSize?`${e.borderSize}px solid ${e.borderColor}`:"none"}},sa("video",{id:x,src:e.src,style:b,controls:!0,playsInline:!0,muted:!0,volume:e.volume}));return r&&r({dom:w,element:e})||w},gif:sl};async function sc({element:e,page:t,store:n,elementHook:r}){let i=await su[e.type];if(i||(i=()=>sa("div",{}),console.error(`HTML export does not support ${e.type} type...`)),!e.visible)return null;let o=await i({element:e,page:t,store:n}),a=[],l=[];if(e.blurEnabled&&a.push(`blur(${e.blurRadius/2}px)`),e.brightnessEnabled&&a.push(`brightness(${100*e.brightness+100}%)`),e.sepiaEnabled&&a.push("sepia()"),e.grayscaleEnabled&&a.push("grayscale()"),e.filters)for(let[t,n]of Object.entries(e.filters)){let e=st(se[t],n.intensity);e&&(a.push(e.filter),e.html&&l.push(e.html))}e.shadowEnabled&&a.push(`drop-shadow(${e.shadowOffsetX}px ${e.shadowOffsetY}px ${e.shadowBlur}px ${e.shadowColor})`);let s=sa("div",{id:e.id,style:{position:"absolute",left:e.x+"px",top:e.y+"px",width:e.width+"px",height:e.height+"px",transform:`rotate(${e.rotation}deg)`,"transform-origin":"top left",opacity:e.opacity,display:e.visible&&e.showInExport?"block":"none",filter:a.join(" ")||"none"}},o,...l);return r&&r({dom:s,element:e})||s}async function sd({page:e,store:t,elementHook:n}){let r=await Promise.all(e.children.map(r=>sc({element:r,page:e,store:t,elementHook:n}))),i="auto"===e.width?t.width:e.width,o="auto"===e.height?t.height:e.height,a={};if(e.background.indexOf("url")>=0||e.background.indexOf("http")>=0||e.background.indexOf(".jpg")>=0||e.background.indexOf(".png")>=0||e.background.indexOf(".jpeg")>=0){let{width:n,height:i}=await l5(e.background),o=await sl({element:{x:0,y:0,width:n,height:i,src:e.background,cornerRadius:0,...l7({width:n,height:i},{width:n,height:i})},page:e,store:t});r.unshift(o)}else a={...a,"background-color":e.background};return sa("div",{className:"page",id:e.id,style:{...a,width:i+"px",height:o+"px",overflow:"hidden",position:"relative"}},...r)}async function sh({json:e,elementHook:t}){let n=await Promise.all(e.pages.map(n=>sd({page:n,store:e,elementHook:t}))),r=[];e.pages.forEach(e=>{e.children.forEach(e=>{"text"===e.type&&-1===r.indexOf(e.fontFamily)&&r.push(e.fontFamily)})});let i=r.map(t=>e.fonts.find(e=>e.fontFamily===t)?sa("style",{},""):sa("link",{href:iR(t),rel:"stylesheet"}));return sa("div",{className:"design"},...i,...n)}let sf=(e,t)=>"object"==typeof t?`${e}="${Object.keys(t).map(e=>`${e}:${t[e]};`).join(" ")}"`:`${e}="${t}"`,sp=({dom:e})=>{if("string"==typeof e)return e;if(!e)return"";let{innerHTML:t,...n}=e.props;return`<${e.type} ${Object.keys(n).map(t=>sf(t,e.props[t])).join(" ")}>${t||e.children.map(e=>sp({dom:e})).join("")}</${e.type}>`};async function sg({json:e,elementHook:t}){return sp({dom:await sh({json:e,elementHook:t})})}let sm=(e,t)=>{if(e.children)for(let n of e.children){if(!0===t(n))break;sm(n,t)}},sv=(e,t,...n)=>({type:e,props:t,children:n||[]}),sy=async e=>{try{let t=await fetch(e);{let e=await t.arrayBuffer(),n=oM.from(e).toString("base64"),r=t.headers.get("content-type")||"image/png";return`data:${r};base64,${n}`}}catch(t){return console.error("Error converting URL to data URL:",t),e}},sb=async({element:e,page:t,store:n})=>{let r,i,{src:o}=e;o="svg"===e.type?oi(await i7(o),new Map(Object.entries(e.colorsReplace))):await sy(o);let a="";e.flipX&&(a+="scaleX(-1)"),e.flipY&&(a+="scaleY(-1)"),e.clipSrc&&await i9(e.clipSrc);let l=await l5(o),s=l.width*e.cropWidth,u=l.height*e.cropHeight,c=e.width/e.height;"svg"===e.type?(r=s,i=u):c>=s/u?(r=s,i=s/c):(r=u*c,i=u);let d=r/l.width,h=i/l.height,f=r/i>e.width/e.height?e.height/i:e.width/r,p=r*f/d,g=i*f/h,m=e.cropX*l.width*f,v=e.cropY*l.height*f,y=`clip-${e.id}`,b=o.replace(/&/g,"&amp;");return sv("g",{style:{transform:a}},sv("defs",{},sv("clipPath",{id:y},sv("rect",{x:0,y:0,width:e.width,height:e.height}))),sv("image",{href:b,x:-m,y:-v,width:p,height:g,preserveAspectRatio:"none","clip-path":`url(#${y})`}))},sx=({element:e,type:t})=>{let n={"stroke-width":e.height,stroke:e.color,"line-cap":"round","stroke-linejoin":"round",opacity:e.opacity};if("arrow"===t||"triangle"===t)return sv("polyline",{points:`${3*e.height},${-(2*e.height)} 0,0 ${3*e.height},${2*e.height}`,...n});if("bar"===t)return sv("polyline",{points:`0,${-(2*e.height)} 0,${2*e.height}`,...n});if("circle"===t)return sv("circle",{r:e.height,...n});if("square"===t)return sv("polyline",{points:`${-e.height},${-e.height} ${-e.height},${e.height} ${e.height},${e.height} ${e.height},${-e.height}`,...n});else return null},sw={image:sb,svg:sb,text:async({element:e,page:t,store:n})=>{let r=(e,t,n,r,i)=>{let o=document.createElement("canvas").getContext("2d");return o.font=`${i} ${r} ${t}px ${n}`,o.measureText(e).width},i=((e,t,n,i,o,a)=>{let l=[];return e.split("\n").forEach(e=>{let s=e.split(" "),u="";for(let e=0;e<s.length;e++){let c=u+s[e]+" ";r(c,n,i,o,a)>t+.5&&e>0?(l.push(u.trim()),u=s[e]+" "):u=c}l.push(u.trim())}),l})(e.text,e.width,e.fontSize,e.fontFamily,e.fontWeight,e.fontStyle),o=e.fontSize*e.lineHeight,a="center"===e.align?"middle":"right"===e.align?"end":"start",l=i.map((t,n)=>sv("tspan",{x:"center"===e.align?e.width/2:"right"===e.align?e.width:0,dy:0===n?0:o,innerHTML:t}));return sv("g",{},sv("text",{fill:e.fill,y:e.fontSize,"font-size":e.fontSize+"px","text-anchor":a,"font-family":e.fontFamily,"font-style":e.fontStyle,"font-weight":e.fontWeight,"text-decoration":e.textDecoration,"line-height":e.lineHeight,"letter-spacing":e.letterSpacing+"em","stroke-width":e.strokeWidth,stroke:e.stroke},...l))},line:async({element:e,page:t,store:n})=>sv("g",{},sv("line",{x1:0,y1:e.height/2,x2:e.width,y2:e.height/2,stroke:e.color,"stroke-width":e.height}),sv("g",{transform:`translate(0 ${e.height/2})`},sx({element:e,type:e.startHead})),sv("g",{transform:`translate(${e.width} ${e.height/2}) rotate(180)`},sx({element:e,type:e.endHead}))),figure:async({element:e,page:t,store:n,elementHook:r})=>{let i,o=sv("g",{innerHTML:ln(e).replace(/<svg[^>]*>/,"").replace(/<\/svg>/,"")});return r&&r({dom:o,element:e})||o},group:async({element:e,page:t,store:n,elementHook:r})=>{let i=await Promise.all(e.children.map(e=>sC({element:e,page:t,store:n,elementHook:r}))),o=sv("g",{opacity:e.opacity,style:{"transform-origin":"top left"}},...i);return r&&r({dom:o,element:e})||o},gif:sb};async function sC({element:e,page:t,store:n,elementHook:r}){let i=await sw[e.type];i||(i=()=>sv("g",{}),console.error(`SVG export does not support ${e.type} type...`));let o=await i({element:e,page:t,store:n}),a=[],l=[];if(e.blurEnabled&&a.push(`blur(${e.blurRadius/2}px)`),e.brightnessEnabled&&a.push(`brightness(${100*e.brightness+100}%)`),e.sepiaEnabled&&a.push("sepia()"),e.grayscaleEnabled&&a.push("grayscale()"),e.shadowEnabled&&a.push(`drop-shadow(${e.shadowOffsetX}px ${e.shadowOffsetY}px ${e.shadowBlur}px ${e.shadowColor})`),e.filters)for(let[t,n]of Object.entries(e.filters)){let e=st(se[t],n.intensity);if(e&&(a.push(e.filter),e.html)){let t=e.html.replace(/<svg([^>]*)>/,"<g$1>").replace(/<\/svg>/,"</g>");l.push(t)}}let s=sv("g",{className:"element",id:e.id,transform:"group"!==e.type?`translate(${e.x}, ${e.y}) rotate(${e.rotation})`:void 0,display:e.visible?void 0:"none",style:{"transform-origin":"top left",filter:a.join(" ")}},o,...l);return r&&r({dom:s,element:e})||s}async function s_({page:e,store:t,elementHook:n}){let r,i=await Promise.all(e.children.map(r=>sC({element:r,page:e,store:t,elementHook:n}))),o=e.background.indexOf("url")>=0||e.background.indexOf("http")>=0||e.background.indexOf(".jpg")>=0||e.background.indexOf(".png")>=0||e.background.indexOf(".jpeg")>=0;if(o){let n=await l5(e.background);r=await l9(e.background,{width:t.width,height:t.height,x:0,y:0,...l7({width:t.width,height:t.height},{width:n.width,height:n.height})})}return sv("g",{className:"page",style:{}},o?sv("image",{"xlink:href":r,x:0,y:0,width:t.width,height:t.height,preserveAspectRatio:"none"}):sv("rect",{x:0,y:0,width:t.width,height:t.height,fill:o?void 0:e.background}),...i)}async function sS(e){try{let t=await fetch(e),n=await t.blob();return new Promise((e,t)=>{let r=new FileReader;r.onloadend=()=>e(r.result),r.onerror=t,r.readAsDataURL(n)})}catch(t){return console.error("Error embedding font:",t),e}}async function sE(e,t){return await Promise.all(e.map(async e=>{let n=t.find(t=>t.fontFamily===e);if(n){let t=await sS(n.url);return sv("style",{},`@font-face { font-family: ${e}; src: url(${t}); }`)}{let t=`https://fonts.googleapis.com/css?family=${e}:bi,normal,i,b`;try{let n=await fetch(t),r=await n.text(),i=r.match(/url\((.*?)\)/g)?.map(e=>e.replace(/url\((.*?)\)/,"$1"))?.filter(e=>e.startsWith("https"));if(!i?.length)throw Error("No font URLs found");let o=await Promise.all(i.map(async t=>{let n=await sS(t),i=r.match(/font-style:\s*(.*?);/),o=r.match(/font-weight:\s*(.*?);/),a=i?i[1]:"normal",l=o?o[1]:"normal";return`@font-face {
                 font-family: ${e};
                 font-style: ${a};
                 font-weight: ${l};
                 src: url(${n});
               }`}));return sv("style",{},o.join("\n"))}catch(e){return console.error("Error embedding Google Font:",e),sv("defs",{},sv("style",{type:"text/css",innerHTML:`@import url('${t}');`.replace(/&/g,"&amp;")}))}}}))}async function sk({json:e,elementHook:t}){let n=await Promise.all(e.pages.map(n=>s_({page:n,store:e,elementHook:t}))),r=[];sm({children:e.pages},e=>{"text"===e.type&&-1===r.indexOf(e.fontFamily)&&r.push(e.fontFamily)});let i=await sE(r,e.fonts);return sv("svg",{xmlns:"http://www.w3.org/2000/svg","xmlns:xlink":"http://www.w3.org/1999/xlink",viewBox:`0 0 ${e.width} ${e.height}`,width:e.width,height:e.height},...i,...n)}let sO=(e,t)=>"object"==typeof t?`${e}="${Object.keys(t).map(e=>`${e}:${t[e]};`).join(" ")}"`:null==t||""===t?"":`${e}="${t}"`,sP=({dom:e,nestLevel:t=0})=>{if("string"==typeof e)return e;if(!e)return"";let{innerHTML:n,...r}=e.props,i=" ".repeat(t);return`${i}<${e.type} ${Object.keys(r).map(e=>sO(e,r[e])).join(" ")}>${n||"\n"+e.children.map(e=>sP({dom:e,nestLevel:t+1})).join("")}${i}</${e.type}>
-`};async function sT({json:e,elementHook:t}){return sP({dom:await sk({json:e,elementHook:t})})}var iq=v("58B0H");let sA=(0,iq.types).model("Page",{id:iq.types.identifier,children:(0,iq.types).array((0,iq.types).late(()=>sJ)),width:(0,iq.types).optional((0,iq.types).union(iq.types.number,(0,iq.types).literal("auto")),"auto"),height:(0,iq.types).optional((0,iq.types).union(iq.types.number,(0,iq.types).literal("auto")),"auto"),background:"white",bleed:0,custom:(0,iq.types).frozen(),duration:5e3,_exporting:!1,_rendering:!1,_forceMount:!1}).postProcessSnapshot(e=>{let t={...e},n={};for(var r in t)"_"!==r[0]&&(n[r]=e[r]);return n}).views(e=>({get store(){return(0,iq.getParentOfType)(e,sR)}})).views(e=>({get startTime(){let t=0;for(let n of e.store.pages){if(n.id===e.id)break;t+=n.duration}return t},get _exportingOrRendering(){return e._exporting||e._rendering}})).views(e=>({get computedWidth(){if("auto"===e.width)return e.store.width;return e.width},get computedHeight(){if("auto"===e.height)return e.store.height;return e.height}})).actions(e=>({toJSON:()=>JSON.parse(JSON.stringify((0,iq.getSnapshot)(e))),_forEachElementUp(t,n){let r=t.map(t=>({id:t,index:e.children.findIndex(e=>e.id===t)}));for(let{index:i}of(r.sort((e,t)=>t.index-e.index),r)){if(-1==i)continue;let r=i<e.children.length-1&&e.children[i+1],o=t.indexOf(r?.id)>=0;i===e.children.length-1||o||n(i)}},_forEachElementDown(t,n){let r=t.map(t=>({id:t,index:e.children.findIndex(e=>e.id===t)}));for(let{index:i}of(r.sort((e,t)=>e.index-t.index),r)){if(-1==i)continue;let r=i>0&&e.children[i-1],o=t.indexOf(r?.id)>=0;0===i||o||n(i)}return!1}})).actions(e=>({clone(t={}){let n=e.toJSON();n.children.forEach(e=>{e.id=lw(10),sZ(e,e=>{e.id=lw(10)})});let r={...n,id:lw(10),...t},i=e.store.addPage(r),o=e.store.pages.indexOf(e);i.setZIndex(o+1),i.select()},setZIndex(t){e.store.setPageZIndex(e.id,t)},set(t){Object.assign(e,t)},select(){e.store.selectPage(e.id)},addElement(t,{skipSelect:n=!1}={}){let r=s2[t.type];if(!r){console.error("Can not find model with type "+t.type);return}"children"in t&&Array.isArray(t.children)&&t.children.forEach(e=>{e.id=lw(10)});let i=r.create({id:lw(10),...t});return e.children.push(i),i.selectable&&!n&&e.store.selectElements([i.id]),i},canMoveElementsUp(t){let n=!1;return e._forEachElementUp(t,()=>{n=n||!0}),n},moveElementsUp(t){e._forEachElementUp(t,t=>{let n=e.children[t];(0,iq.detach)(n),e.children.splice(t+1,0,n)})},canMoveElementsTop(e){return this.canMoveElementsUp(e)},moveElementsTop(t){let n=[],r=[];e.children.forEach(e=>{t.indexOf(e.id)>=0?n.push(e):r.push(e)}),e.children.replace(r.concat(n))},canMoveElementsDown(t){let n=!1;return e._forEachElementDown(t,()=>{n=n||!0}),n},moveElementsDown(t){e._forEachElementDown(t,t=>{let n=e.children[t];(0,iq.detach)(n),e.children.splice(t-1,0,n)})},canMoveElementsBottom(e){return this.canMoveElementsDown(e)},moveElementsBottom(t){let n=[],r=[];e.children.forEach(e=>{t.indexOf(e.id)>=0?n.push(e):r.push(e)}),e.children.replace(n.concat(r))},setElementZIndex(t,n){let r=e.children.find(e=>e.id===t);r&&((0,iq.detach)(r),e.children.remove(r),e.children.splice(n,0,r))},setSize({width:t,height:n,useMagic:r,softChange:i}){if(r){let r=[],i=t=>"image"===t.type&&t.x<1&&t.y<1&&t.width>=e.computedWidth-2&&t.height>=e.computedHeight-2;sZ(e,e=>{"group"!==e.type&&(i(e)||r.push(e))});let o=r.length?aF(r):{x:0,y:0,width:e.computedWidth,height:e.computedHeight},a=1/4,l=Math.max(0,Math.max(0,Math.min(o.x,e.computedWidth-o.x-o.width))-e.computedWidth*a),s=Math.max(0,Math.max(0,Math.min(o.y,e.computedHeight-o.y-o.height))-e.computedHeight*a),u=e.computedWidth-2*l,c=e.computedHeight-2*s,d=t/u,h=n/c,f=Math.min(d,h),p=(t-u*f)/2-l*f,g=(n-c*f)/2-s*f;sZ(e,e=>{"group"!==e.type&&(i(e)?e.set({x:e.x*f,y:e.y*f,width:e.width*d,height:e.height*h,cropX:0,cropY:0,cropWidth:1,cropHeight:1}):(e.set({x:p+e.x*f,y:g+e.y*f,width:e.width*f,height:e.height*f}),"text"===e.type?e.set({fontSize:e.fontSize*f}):"figure"===e.type&&e.set({strokeWidth:e.strokeWidth*f})))})}i||(e.width=t),i||(e.height=n)}})).actions(e=>({moveElementUp(t){console.warn("page.moveElementUp(id) is deprecated. Please use page.moveElementsUp([id1, id2]) instead."),e.moveElementsUp([t])},moveElementDown(t){console.warn("page.moveElementDown(id) is deprecated. Please use page.moveElementsDown([id1, id2]) instead."),e.moveElementsDown([t])},moveElementTop(t){console.warn("page.moveElementTop(id) is deprecated. Please use page.moveElementsTop([id1, id2]) instead."),e.moveElementsTop([t])},moveElementBottom(t){console.warn("page.moveElementBottom(id) is deprecated. Please use page.moveElementsBottom([id1, id2]) instead."),e.moveElementsBottom([t])},play(){e.store.play({startTime:e.startTime,endTime:e.startTime+e.duration})}}));var iq=v("58B0H");let sj=(0,iq.types).model("Audio",{id:iq.types.identifier,src:"",duration:0,startTime:0,endTime:1,volume:1,delay:0}).actions(e=>({toJSON:()=>({...(0,iq.getSnapshot)(e)})})).actions(e=>({set(t){Object.assign(e,t)}}));(0,iq.setLivelinessChecking)("ignore");let sN=(0,iq.types).model("Font",{fontFamily:iq.types.string,url:(0,iq.types).optional(iq.types.string,""),styles:(0,iq.types).frozen()}).preProcessSnapshot(e=>({...e,fontFamily:e.fontFamily||e.name})),sR=(0,iq.types).model("Store",{role:"",pages:(0,iq.types).array(sA),fonts:(0,iq.types).array(sN),audios:(0,iq.types).array(sj),width:1080,height:1080,currentTime:0,isPlaying:!1,scale:1,scaleToFit:1,unit:"px",dpi:72,bleedVisible:!1,rulesVisible:!1,openedSidePanel:"",previousOpenedSidePanel:"",custom:(0,iq.types).frozen(),selectedElementsIds:(0,iq.types).array(iq.types.string),animatedElementsIds:(0,iq.types).array(iq.types.string),history:(0,iq.types).optional(l_,{targetPath:"../pages"}),_elementsPixelRatio:Math.min(2,window.devicePixelRatio||1),_activePageId:"",_forceShowCredit:!1,_key:"",_validated:!1}).views(e=>({get _bleedVisible(){return console.warn("store._bleedVisible is deprecated. Please use store.bleedVisible instead."),e.bleedVisible},get selectedElements(){return e.selectedElementsIds.map(t=>{for(let n of e.pages)for(let e of n.children)if(e.id===t)return e}).filter(e=>!!e)},get children(){return e.pages},get selectedShapes(){let t=[];return sZ({children:e.selectedElements},e=>{"group"!==e.type&&t.push(e)}),t},get activePage(){return e.pages.slice().find(t=>t.id===e._activePageId)||(e.pages.length?e.pages[0]:null)},get duration(){let t=0;return e.pages.forEach(e=>{t+=e.duration}),t},get _hasCroppedImages(){return e.find(e=>"image"===e.type&&e._cropModeEnabled)},find(t){let n;return sZ({children:e.pages},e=>{if(!n&&t(e))return n=e,!0}),n},getElementById:t=>e.find(e=>e.id===t)})).actions(e=>{let t=0,n=null,r=!1;return{afterCreate(){e.history.canUndo},setCurrentTime(t){e.currentTime=t},_togglePlaying(t=!e.isPlaying){e.isPlaying=t},play({animatedElementsIds:i=[],startTime:o=0,currentTime:a=0,endTime:l=e.duration,repeat:s=!1}={}){a&&(console.warn("currentTime property of store.play() is deprecated. Please use startTime instead."),o=a),e.animatedElementsIds=(0,iq.cast)(i),e.currentTime=o,e.isPlaying=!0,t=Date.now(),n=l,r=s,requestAnimationFrame(e.seek)},checkActivePage(){for(let t of e.pages){if(e.currentTime>=t.startTime&&e.currentTime<t.startTime+t.duration){e.selectPage(t.id);break}t.duration}},seek(){if(!e.isPlaying)return;let i=Date.now(),o=i-t;t=i,e.currentTime+=o,e.checkActivePage();let a=n||e.duration;e.isPlaying&&e.currentTime<a?requestAnimationFrame(e.seek):e.isPlaying&&r?(e.currentTime=0,requestAnimationFrame(e.seek)):e.stop()},stop(){e.isPlaying=!1,e.currentTime=0,e.animatedElementsIds=(0,iq.cast)([]),e.checkActivePage()}}}).actions(e=>({__(){e._validated||(l0(e._key,e._forceShowCredit),e._validated=!0)},set(t){Object.assign(e,t)},setUnit({unit:t,dpi:n}){e.unit=t||e.unit,e.dpi=n||e.dpi},setRole(t){e.role=t},addPage(t){let n=sA.create({id:lw(10),...t});return e.pages.push(n),e._activePageId=n.id,n},selectPage(t){e._activePageId=t},selectElements(t){let n=t.map(t=>e.getElementById(t)).sort((e,t)=>e.page.children.indexOf(e)-e.page.children.indexOf(t)).filter(e=>!!e).map(e=>e.id);e.selectedElementsIds=(0,iq.cast)(n)},toggleBleed(t){e.bleedVisible=t??!e.bleedVisible},toggleRulers(t){e.rulesVisible=t??!e.rulesVisible},openSidePanel(t){e.openedSidePanel!==t&&(e.previousOpenedSidePanel=e.openedSidePanel,e.openedSidePanel=t)},setScale(t){e.scale=t},_setScaleToFit(t){e.scaleToFit=t},setElementsPixelRatio(t){e._elementsPixelRatio=t},setSize(t,n,r){e.pages.forEach(e=>{e.setSize({width:t,height:n,useMagic:r,softChange:!0})}),e.width=t,e.height=n},setPageZIndex(t,n){let r=e.pages.find(e=>e.id===t);r&&((0,iq.detach)(r),e.pages.remove(r),e.pages.splice(n,0,r))},deletePages(t){let n=e.pages.indexOf(e.activePage);t.forEach(t=>{let n=e.pages.find(e=>e.id===t);(0,iq.destroy)(n)});let r=Math.min(e.pages.length-1,n),i=e.pages[r];i&&(e._activePageId=i.id),e.selectedElementsIds=(0,iq.cast)(e.selectedElementsIds.filter(t=>e.getElementById(t)))},groupElements(t){let n=t.map(t=>e.getElementById(t));n.forEach(e=>{e&&(0,iq.detach)(e)});let r=e.activePage,i={id:lw(10),children:n,type:"group"};return r.children.push(i),e.selectedElementsIds=(0,iq.cast)([i.id]),r.children.find(e=>e.id===i.id)},ungroupElements(t){let n=t.map(t=>e.getElementById(t)),r=[];n.forEach(e=>{if(e&&"group"===e.type){let t=e.page,n=t.children.indexOf(e);e.children.forEach(e=>{r.push(e.id)}),e.children.forEach(e=>{(0,iq.detach)(e),t.children.push(e)}),t.children.splice(n,1)}}),e.selectedElementsIds=(0,iq.cast)(r)},deleteElements(t){let n=[];e.find(e=>(t.includes(e.id)&&n.push(e),!1)),n.forEach(e=>{(0,iq.destroy)(e)}),e.selectedElementsIds=(0,iq.cast)(e.selectedElementsIds.filter(t=>e.getElementById(t)))},on(t,n){if("change"===t){let t=e.toJSON();return(0,iq.onSnapshot)(e,r=>{let i=e.toJSON();lC(t,i)||(t=i,n(i))})}},async _toCanvas({pixelRatio:t,ignoreBackground:n,pageId:r,mimeType:i,includeBleed:o,_skipTimeout:a,quickMode:l=!1}={}){let s=t||1;r=r||e.pages[0]?.id;let u=e.pages.find(e=>e.id===r);if(!u)throw Error(`No page for export with id ${r}`);l?u?.set({_forceMount:!0}):u?.set({_exporting:!0});let c=await l8(()=>h(M).stages.find(e=>e.getAttr("pageId")===r));if(!c)throw u?.set({_forceMount:!1,_exporting:!1}),Error(`Export is failed. Can not find stage for page ${r}. Looks like <Workspace /> component is not mounted, but it is required in order to process the export.`);let d=!!c.findOne(".page-container"),f=e._elementsPixelRatio;s>e._elementsPixelRatio&&e.setElementsPixelRatio(s),await e.waitLoading({_skipTimeout:a});let p=c.findOne(".page-container");if(!p)throw e.setElementsPixelRatio(f),u?.set({_forceMount:!1,_exporting:!1}),Error(`Export is failed. Can't find page container. ${d}`);let g=c.position();c.position({x:0,y:0}),c.find("Transformer").forEach(e=>{e.setAttr("oldVisible",e.visible()),e.visible(!1)}),p.find(".page-background").forEach(e=>e.shadowEnabled(!1)),p.find(".page-background").forEach(e=>e.strokeEnabled(!1)),p.find(".highlighter").forEach(e=>e.visible(!1));let m=p.findOne(".page-background-group"),v=m.clip();m.clip({x:null,y:null,width:null,height:null});let y=p.findOne(".elements-container"),b=y.clip();y.clip({x:null,y:null,width:null,height:null});let x=p.find(e=>e.getAttr("hideInExport"));x.forEach(e=>{e.setAttr("oldVisible",e.visible()),e.hide()});let w=p.find(e=>!e.visible()&&e.getAttr("editModeEnabled"));w.forEach(e=>{e.setAttr("oldVisible",e.visible()),e.show()}),n&&p.find(".page-background").forEach(e=>e.hide());let C=o?u.bleed:0,_=C;!e.bleedVisible&&o||(e.bleedVisible||o?e.bleedVisible&&o?_=0:e.bleedVisible&&!o&&(_=-u.bleed):_=0);let S=document.createElement("canvas");S.width=Math.round((u.computedWidth+2*C)*s),S.height=Math.round((u.computedHeight+2*C)*s);let E=S.getContext("2d");"image/jpeg"===i&&(E.fillStyle="white",E.fillRect(0,0,S.width,S.height));let k=p.scale();p.scale({x:1,y:1});let O=p.toCanvas({x:p.x()-_,y:p.y()-_,width:u.computedWidth+2*C,height:u.computedHeight+2*C,pixelRatio:s});return p.scale(k),E.drawImage(O,0,0,S.width,S.height),h(M).Util.releaseCanvas(O),n&&p.find(".page-background").forEach(e=>e.show()),x.forEach(e=>{e.visible(e.getAttr("oldVisible"))}),w.forEach(e=>{e.visible(e.getAttr("oldVisible"))}),p.find(".page-background").forEach(e=>e.shadowEnabled(!0)),p.find(".page-background").forEach(e=>e.strokeEnabled(!0)),c.find("Transformer").forEach(e=>{e.visible(e.getAttr("oldVisible"))}),p.find(".highlighter").forEach(e=>e.visible(!0)),m.clip(v),y.clip(b),c.position(g),e.setElementsPixelRatio(f),u?.set({_exporting:!1,_forceMount:!1}),S},async toDataURL({mimeType:t,quality:n,...r}={}){let i=await e._toCanvas({mimeType:t,...r}),o=i.toDataURL(t,n);return h(M).Util.releaseCanvas(i),o},async toBlob({mimeType:t,quality:n,...r}={}){let i=await e._toCanvas({mimeType:t,...r}),o=await new Promise(e=>{i.toBlob(e,t,n)});return h(M).Util.releaseCanvas(i),o},async saveAsImage({fileName:t,...n}={}){let r=n.mimeType||"image/png",i=r.split("/")[1];lS(await e.toDataURL(n),t||"polotno."+i,r)},async _toPDF(t){let n=t.dpi||e.dpi,r=t.parallel||1,i=t.unit||("px"===e.unit?"mm":e.unit),o=t.pixelRatio||1,a=t.pageIds||e.pages.map(e=>e.id),l=e.pages.filter(e=>a.includes(e.id)),s=await (window.jspdf?.jsPDF?Promise.resolve(window.jspdf.jsPDF):lE||(lE=new Promise(e=>{var t=document.createElement("script");t.onload=function(){e(window.jspdf.jsPDF)},t.src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/3.0.1/jspdf.umd.min.js",document.head.appendChild(t)}))),u=e=>l1({px:e,unit:i,dpi:n}),c=t.cropMarkSize||0,d=u(c),h=l[0]||{},f=t.includeBleed?h.bleed:0,p=u(h.computedWidth+2*f+2*d),g=u(h.computedHeight+2*f+2*d);var m=new s({unit:i,orientation:p>g?"landscape":"portrait",format:[p,g],compress:!0,putOnlyUsedFonts:!0});m.deletePage(1);let v=((e,t)=>{for(var n=[],r=0;r<e.length;r+=t)n.push(e.slice(r,r+t));return n})(l,r),y=0;for(let n of v){let r=n.map(async n=>{let r=t.includeBleed?n.bleed:0,i=n.computedWidth+2*r+2*c,l=n.computedHeight+2*r+2*c,s=u(i),d=u(l),h=0,f=o;for(;h<10;){2===(h+=1)&&console.error("Polotno can not export PDF with current settings. Quality is automatically reduced.");let r=await e.toDataURL({...t,pageId:n.id,pixelRatio:f});if(r.length>20)return t.onProgress&&t.onProgress(++y/a.length*.9),{url:r,width:s,height:d,widthPx:i,heightPx:l};f*=.8}});(await Promise.all(r)).forEach(({url:e,width:t,height:n,widthPx:r,heightPx:o})=>{var a;m.addPage([t,n],t>n?"landscape":"portrait");let l=m.getCurrentPageInfo();switch(i){case"pt":a=1;break;case"mm":a=72/25.4;break;case"cm":a=72/2.54;break;case"in":a=72;break;case"px":a=.75;break;case"pc":case"em":a=12;break;case"ex":a=6;break;default:throw"Invalid unit: "+i}if(l.pageContext.cropBox={bottomLeftX:0,bottomLeftY:0,topRightX:t*a,topRightY:n*a},l.pageContext.artBox={bottomLeftX:u(c+f)*a,bottomLeftY:u(c+f)*a,topRightX:u(r-c-f)*a,topRightY:u(o-c-f)*a},l.pageContext.bleedBox={bottomLeftX:u(c+f)*a,bottomLeftY:u(c+f)*a,topRightX:u(r-c-f)*a,topRightY:u(o-c-f)*a},d){m.setLineWidth(u(1));let e=d+u(f);m.line(e,0,e,d),m.line(0,e,d,e),m.line(t-e,0,t-e,d),m.line(t,e,t-d,e),m.line(0,n-e,d,n-e),m.line(e,n,e,n-d),m.line(t,n-e,t-d,n-e),m.line(t-e,n,t-e,n-d)}m.addImage(e,d,d,t-2*d,n-2*d,void 0,"FAST")})}return m},toPDFDataURL:async t=>(await e._toPDF({mimeType:"image/jpeg",...t})).output("datauristring"),async toGIFDataURL(t={}){let n=t.pixelRatio||1,r=await lk({width:e.width*n,height:e.height*n}),i=1e3/(t.fps||10),o=e.duration/i;for(let t=0;t<o-1;t++){let o=t*i||1;e.setCurrentTime(o);let a=0,l="";for(let t of e.pages)if(a+=t.duration,t.set({_rendering:a>o}),a>o){l=t.id;break}let s=await e._toCanvas({pixelRatio:n,pageId:l,_skipTimeout:!0});r.addFrame(s.getContext("2d"),{delay:i,copy:!0})}for(let t of e.pages)t.set({_rendering:!1});return e.stop(),r.render(),new Promise(e=>{r.on("finished",function(t){var n;(n=new FileReader).onload=function(t){e(t.target.result)},n.readAsDataURL(t)})})},async saveAsGIF({fileName:t,...n}={}){lS(await e.toGIFDataURL(n),t||"polotno.gif")},toHTML:async({elementHook:t}={elementHook:void 0})=>sg({json:e.toJSON(),elementHook:t}),async saveAsHTML({fileName:t}={}){let n=await e.toHTML();lS("data:text/html;base64,"+window.btoa(unescape(encodeURIComponent(n))),t||"polotno.html")},async toSVG({elementHook:t,pageId:n}={elementHook:void 0,pageId:void 0}){let r=e.toJSON();n=n||r.pages[0]?.id;let i=r.pages.find(e=>e.id===n);return sT({json:{...r,pages:i?[i]:[]},elementHook:t})},async saveAsSVG({fileName:t,elementHook:n,pageId:r}={}){let i=await e.toSVG({elementHook:n,pageId:r});lS("data:text/svg;base64,"+window.btoa(unescape(encodeURIComponent(i))),t||"polotno.svg")},async saveAsPDF({fileName:t,...n}={}){(await e._toPDF({mimeType:"image/jpeg",...n})).save(t||"polotno.pdf")},async waitLoading({_skipTimeout:e=!1}={}){e||await new Promise(e=>setTimeout(e,50)),await new Promise(e=>{var t;return t=()=>{ih()?setTimeout(e,300):e(!0)},void(0===ig?t():im.push(t))})},toJSON:()=>({width:e.width,height:e.height,fonts:(0,iq.getSnapshot)(e.fonts),pages:(0,iq.getSnapshot)(e.pages),audios:(0,iq.getSnapshot)(e.audios),unit:e.unit,dpi:e.dpi,custom:e.custom}),loadJSON(t,n=!1){let r={...t},i=e.pages.indexOf(e.activePage),o=(r.pages[i]||r.pages[0])?.id;r._activePageId=o;let a={...(0,iq.getSnapshot)(e)};Object.assign(a,r),n?a.history=e.history.toJSON():a.history={history:[],undoIdx:-1},(0,iq.applySnapshot)(e,a)},clear({keepHistory:t=!1}={}){let n=e.pages.map(e=>e.id);e.deletePages(n),e.custom=null,t||e.history.clear()},addFont(t){e.removeFont(t.fontFamily),e.fonts.push(t),e.loadFont(t.fontFamily)},removeFont(t){e.fonts.filter(e=>e.fontFamily===t).forEach(e=>(0,iq.destroy)(e))},addAudio(t){let n=sj.create({id:lw(10),...t});e.audios.push(n)},removeAudio(t){let n=e.audios.find(e=>e.id===t);n&&e.audios.remove(n)},async loadFont(t){let n=e.fonts.find(e=>e.fontFamily===t)||iE.find(e=>e.fontFamily===t),r=[{fontStyle:"normal",fontWeight:"normal"}];return n?(n.styles&&(r=n.styles.map(e=>({fontStyle:e.fontStyle||"normal",fontWeight:e.fontWeight||"normal"}))),function(e){let t=e.fontFamily;if(iL[t]||!e.url&&!e.styles)return;let n=document.createElement("style");n.type="text/css";let r=e.styles||(e.url?[{src:`url("${e.url}")`}]:[]),i="";r.forEach(e=>{i+=`
+`};async function sT({json:e,elementHook:t}){return sP({dom:await sk({json:e,elementHook:t})})}var iq=v("58B0H");let sA=(0,iq.types).model("Page",{id:iq.types.identifier,children:(0,iq.types).array((0,iq.types).late(()=>sJ)),width:(0,iq.types).optional((0,iq.types).union(iq.types.number,(0,iq.types).literal("auto")),"auto"),height:(0,iq.types).optional((0,iq.types).union(iq.types.number,(0,iq.types).literal("auto")),"auto"),background:"white",bleed:0,custom:(0,iq.types).frozen(),duration:5e3,_exporting:!1,_rendering:!1,_forceMount:!1}).postProcessSnapshot(e=>{let t={...e},n={};for(var r in t)"_"!==r[0]&&(n[r]=e[r]);return n}).views(e=>({get store(){return(0,iq.getParentOfType)(e,sR)}})).views(e=>({get startTime(){let t=0;for(let n of e.store.pages){if(n.id===e.id)break;t+=n.duration}return t},get _exportingOrRendering(){return e._exporting||e._rendering}})).views(e=>({get computedWidth(){if("auto"===e.width)return e.store.width;return e.width},get computedHeight(){if("auto"===e.height)return e.store.height;return e.height}})).actions(e=>({toJSON:()=>JSON.parse(JSON.stringify((0,iq.getSnapshot)(e))),_forEachElementUp(t,n){let r=t.map(t=>({id:t,index:e.children.findIndex(e=>e.id===t)}));for(let{index:i}of(r.sort((e,t)=>t.index-e.index),r)){if(-1==i)continue;let r=i<e.children.length-1&&e.children[i+1],o=t.indexOf(r?.id)>=0;i===e.children.length-1||o||n(i)}},_forEachElementDown(t,n){let r=t.map(t=>({id:t,index:e.children.findIndex(e=>e.id===t)}));for(let{index:i}of(r.sort((e,t)=>e.index-t.index),r)){if(-1==i)continue;let r=i>0&&e.children[i-1],o=t.indexOf(r?.id)>=0;0===i||o||n(i)}return!1}})).actions(e=>({clone(t={}){let n=e.toJSON();n.children.forEach(e=>{e.id=lw(10),sZ(e,e=>{e.id=lw(10)})});let r={...n,id:lw(10),...t},i=e.store.addPage(r),o=e.store.pages.indexOf(e);return i.setZIndex(o+1),i.select(),i},setZIndex(t){e.store.setPageZIndex(e.id,t)},set(t){Object.assign(e,t)},select(){e.store.selectPage(e.id)},addElement(t,{skipSelect:n=!1}={}){let r=s2[t.type];if(!r){console.error("Can not find model with type "+t.type);return}"children"in t&&Array.isArray(t.children)&&sZ(t,e=>{e.id=lw(10)});let i=r.create({id:lw(10),...t});return e.children.push(i),i.selectable&&!n&&e.store.selectElements([i.id]),i},canMoveElementsUp(t){let n=!1;return e._forEachElementUp(t,()=>{n=n||!0}),n},moveElementsUp(t){e._forEachElementUp(t,t=>{let n=e.children[t];(0,iq.detach)(n),e.children.splice(t+1,0,n)})},canMoveElementsTop(e){return this.canMoveElementsUp(e)},moveElementsTop(t){let n=[],r=[];e.children.forEach(e=>{t.indexOf(e.id)>=0?n.push(e):r.push(e)}),e.children.replace(r.concat(n))},canMoveElementsDown(t){let n=!1;return e._forEachElementDown(t,()=>{n=n||!0}),n},moveElementsDown(t){e._forEachElementDown(t,t=>{let n=e.children[t];(0,iq.detach)(n),e.children.splice(t-1,0,n)})},canMoveElementsBottom(e){return this.canMoveElementsDown(e)},moveElementsBottom(t){let n=[],r=[];e.children.forEach(e=>{t.indexOf(e.id)>=0?n.push(e):r.push(e)}),e.children.replace(n.concat(r))},setElementZIndex(t,n){let r=e.children.find(e=>e.id===t);r&&((0,iq.detach)(r),e.children.remove(r),e.children.splice(n,0,r))},setSize({width:t,height:n,useMagic:r,softChange:i}){if(r){let r=[],i=t=>"image"===t.type&&t.x<1&&t.y<1&&t.width>=e.computedWidth-2&&t.height>=e.computedHeight-2;sZ(e,e=>{"group"!==e.type&&(i(e)||r.push(e))});let o=r.length?aF(r):{x:0,y:0,width:e.computedWidth,height:e.computedHeight},a=1/4,l=Math.max(0,Math.max(0,Math.min(o.x,e.computedWidth-o.x-o.width))-e.computedWidth*a),s=Math.max(0,Math.max(0,Math.min(o.y,e.computedHeight-o.y-o.height))-e.computedHeight*a),u=e.computedWidth-2*l,c=e.computedHeight-2*s,d=t/u,h=n/c,f=Math.min(d,h),p=(t-u*f)/2-l*f,g=(n-c*f)/2-s*f;sZ(e,e=>{"group"!==e.type&&(i(e)?e.set({x:e.x*f,y:e.y*f,width:e.width*d,height:e.height*h,cropX:0,cropY:0,cropWidth:1,cropHeight:1}):(e.set({x:p+e.x*f,y:g+e.y*f,width:e.width*f,height:e.height*f}),"text"===e.type?e.set({fontSize:e.fontSize*f}):"figure"===e.type&&e.set({strokeWidth:e.strokeWidth*f})))})}i||(e.width=t),i||(e.height=n)}})).actions(e=>({moveElementUp(t){console.warn("page.moveElementUp(id) is deprecated. Please use page.moveElementsUp([id1, id2]) instead."),e.moveElementsUp([t])},moveElementDown(t){console.warn("page.moveElementDown(id) is deprecated. Please use page.moveElementsDown([id1, id2]) instead."),e.moveElementsDown([t])},moveElementTop(t){console.warn("page.moveElementTop(id) is deprecated. Please use page.moveElementsTop([id1, id2]) instead."),e.moveElementsTop([t])},moveElementBottom(t){console.warn("page.moveElementBottom(id) is deprecated. Please use page.moveElementsBottom([id1, id2]) instead."),e.moveElementsBottom([t])},play(){e.store.play({startTime:e.startTime,endTime:e.startTime+e.duration})}}));var iq=v("58B0H");let sj=(0,iq.types).model("Audio",{id:iq.types.identifier,src:"",duration:0,startTime:0,endTime:1,volume:1,delay:0}).actions(e=>({toJSON:()=>({...(0,iq.getSnapshot)(e)})})).actions(e=>({set(t){Object.assign(e,t)}}));(0,iq.setLivelinessChecking)("ignore");let sN=(0,iq.types).model("Font",{fontFamily:iq.types.string,url:(0,iq.types).optional(iq.types.string,""),styles:(0,iq.types).frozen()}).preProcessSnapshot(e=>({...e,fontFamily:e.fontFamily||e.name})),sR=(0,iq.types).model("Store",{role:"",pages:(0,iq.types).array(sA),fonts:(0,iq.types).array(sN),audios:(0,iq.types).array(sj),width:1080,height:1080,currentTime:0,isPlaying:!1,scale:1,scaleToFit:1,unit:"px",dpi:72,schemaVersion:1,bleedVisible:!1,rulesVisible:!1,openedSidePanel:"",previousOpenedSidePanel:"",custom:(0,iq.types).frozen(),selectedElementsIds:(0,iq.types).array(iq.types.string),animatedElementsIds:(0,iq.types).array(iq.types.string),history:(0,iq.types).optional(l_,{targetPath:"../pages"}),_elementsPixelRatio:Math.min(2,window.devicePixelRatio||1),_activePageId:"",_forceShowCredit:!1,_key:"",_validated:!1}).views(e=>({get _bleedVisible(){return console.warn("store._bleedVisible is deprecated. Please use store.bleedVisible instead."),e.bleedVisible},get selectedElements(){return e.selectedElementsIds.map(t=>{for(let n of e.pages)for(let e of n.children)if(e.id===t)return e}).filter(e=>!!e)},get children(){return e.pages},get selectedShapes(){let t=[];return sZ({children:e.selectedElements},e=>{"group"!==e.type&&t.push(e)}),t},get activePage(){return e.pages.slice().find(t=>t.id===e._activePageId)||(e.pages.length?e.pages[0]:null)},get duration(){let t=0;return e.pages.forEach(e=>{t+=e.duration}),t},get _hasCroppedImages(){return e.find(e=>"image"===e.type&&e._cropModeEnabled)},find(t){let n;return sZ({children:e.pages},e=>{if(!n&&t(e))return n=e,!0}),n},getElementById:t=>e.find(e=>e.id===t)})).actions(e=>{let t=0,n=null,r=!1;return{afterCreate(){e.history.canUndo},setCurrentTime(t){e.currentTime=t},_togglePlaying(t=!e.isPlaying){e.isPlaying=t},play({animatedElementsIds:i=[],startTime:o=0,currentTime:a=0,endTime:l=e.duration,repeat:s=!1}={}){a&&(console.warn("currentTime property of store.play() is deprecated. Please use startTime instead."),o=a),e.animatedElementsIds=(0,iq.cast)(i),e.currentTime=o,e.isPlaying=!0,t=Date.now(),n=l,r=s,requestAnimationFrame(e.seek)},checkActivePage(){for(let t of e.pages){if(e.currentTime>=t.startTime&&e.currentTime<t.startTime+t.duration){e.selectPage(t.id);break}t.duration}},seek(){if(!e.isPlaying)return;let i=Date.now(),o=i-t;t=i,e.currentTime+=o,e.checkActivePage();let a=n||e.duration;e.isPlaying&&e.currentTime<a?requestAnimationFrame(e.seek):e.isPlaying&&r?(e.currentTime=0,requestAnimationFrame(e.seek)):e.stop()},stop(){e.isPlaying=!1,e.currentTime=0,e.animatedElementsIds=(0,iq.cast)([]),e.checkActivePage()}}}).actions(e=>({__(){e._validated||(l0(e._key,e._forceShowCredit),e._validated=!0)},set(t){Object.assign(e,t)},setUnit({unit:t,dpi:n}){e.unit=t||e.unit,e.dpi=n||e.dpi},setRole(t){e.role=t},addPage(t){let n=sA.create({id:lw(10),...t});return e.pages.push(n),e._activePageId=n.id,n},selectPage(t){e._activePageId=t},selectElements(t){let n=t.map(t=>e.getElementById(t)).sort((e,t)=>e.page.children.indexOf(e)-e.page.children.indexOf(t)).filter(e=>!!e).map(e=>e.id);e.selectedElementsIds=(0,iq.cast)(n)},toggleBleed(t){e.bleedVisible=t??!e.bleedVisible},toggleRulers(t){e.rulesVisible=t??!e.rulesVisible},openSidePanel(t){e.openedSidePanel!==t&&(e.previousOpenedSidePanel=e.openedSidePanel,e.openedSidePanel=t)},setScale(t){e.scale=t},_setScaleToFit(t){e.scaleToFit=t},setElementsPixelRatio(t){e._elementsPixelRatio=t},setSize(t,n,r){e.pages.forEach(e=>{e.setSize({width:t,height:n,useMagic:r,softChange:!0})}),e.width=t,e.height=n},setPageZIndex(t,n){let r=e.pages.find(e=>e.id===t);r&&((0,iq.detach)(r),e.pages.remove(r),e.pages.splice(n,0,r))},deletePages(t){let n=e.pages.indexOf(e.activePage);t.forEach(t=>{let n=e.pages.find(e=>e.id===t);(0,iq.destroy)(n)});let r=Math.min(e.pages.length-1,n),i=e.pages[r];i&&(e._activePageId=i.id),e.selectedElementsIds=(0,iq.cast)(e.selectedElementsIds.filter(t=>e.getElementById(t)))},groupElements(t){let n=t.map(t=>e.getElementById(t));n.forEach(e=>{e&&(0,iq.detach)(e)});let r=e.activePage,i={id:lw(10),children:n,type:"group"};return r.children.push(i),e.selectedElementsIds=(0,iq.cast)([i.id]),r.children.find(e=>e.id===i.id)},ungroupElements(t){let n=t.map(t=>e.getElementById(t)),r=[];n.forEach(e=>{if(e&&"group"===e.type){let t=e.page,n=t.children.indexOf(e);e.children.forEach(e=>{r.push(e.id)}),e.children.forEach(e=>{(0,iq.detach)(e),t.children.push(e)}),t.children.splice(n,1)}}),e.selectedElementsIds=(0,iq.cast)(r)},deleteElements(t){let n=[];e.find(e=>(t.includes(e.id)&&n.push(e),!1)),n.forEach(e=>{(0,iq.destroy)(e)}),e.selectedElementsIds=(0,iq.cast)(e.selectedElementsIds.filter(t=>e.getElementById(t)))},on(t,n){if("change"===t){let t=e.toJSON();return(0,iq.onSnapshot)(e,r=>{let i=e.toJSON();lC(t,i)||(t=i,n(i))})}},async _toCanvas({pixelRatio:t,ignoreBackground:n,pageId:r,mimeType:i,includeBleed:o,_skipTimeout:a,quickMode:l=!1}={}){let s=t||1;r=r||e.pages[0]?.id;let u=e.pages.find(e=>e.id===r);if(!u)throw Error(`No page for export with id ${r}`);l?u?.set({_forceMount:!0}):u?.set({_exporting:!0});let c=await l8(()=>h(M).stages.find(e=>e.getAttr("pageId")===r));if(!c)throw u?.set({_forceMount:!1,_exporting:!1}),Error(`Export is failed. Can not find stage for page ${r}. Looks like <Workspace /> component is not mounted, but it is required in order to process the export.`);let d=!!c.findOne(".page-container"),f=e._elementsPixelRatio;s>e._elementsPixelRatio&&e.setElementsPixelRatio(s),await e.waitLoading({_skipTimeout:a});let p=c.findOne(".page-container");if(!p)throw e.setElementsPixelRatio(f),u?.set({_forceMount:!1,_exporting:!1}),Error(`Export is failed. Can't find page container. ${d}`);let g=c.position();c.position({x:0,y:0}),c.find("Transformer").forEach(e=>{e.setAttr("oldVisible",e.visible()),e.visible(!1)}),p.find(".page-background").forEach(e=>e.shadowEnabled(!1)),p.find(".page-background").forEach(e=>e.strokeEnabled(!1)),p.find(".highlighter").forEach(e=>e.visible(!1));let m=p.findOne(".page-background-group"),v=m.clip();m.clip({x:null,y:null,width:null,height:null});let y=p.findOne(".elements-container"),b=y.clip();y.clip({x:null,y:null,width:null,height:null});let x=p.find(e=>e.getAttr("hideInExport"));x.forEach(e=>{e.setAttr("oldVisible",e.visible()),e.hide()});let w=p.find(e=>!e.visible()&&e.getAttr("editModeEnabled"));w.forEach(e=>{e.setAttr("oldVisible",e.visible()),e.show()}),n&&p.find(".page-background").forEach(e=>e.hide());let C=o?u.bleed:0,_=C;!e.bleedVisible&&o||(e.bleedVisible||o?e.bleedVisible&&o?_=0:e.bleedVisible&&!o&&(_=-u.bleed):_=0);let S=document.createElement("canvas");S.width=Math.round((u.computedWidth+2*C)*s),S.height=Math.round((u.computedHeight+2*C)*s);let E=S.getContext("2d");"image/jpeg"===i&&(E.fillStyle="white",E.fillRect(0,0,S.width,S.height));let k=p.scale();p.scale({x:1,y:1});let O=p.toCanvas({x:p.x()-_,y:p.y()-_,width:u.computedWidth+2*C,height:u.computedHeight+2*C,pixelRatio:s});return p.scale(k),E.drawImage(O,0,0,S.width,S.height),h(M).Util.releaseCanvas(O),n&&p.find(".page-background").forEach(e=>e.show()),x.forEach(e=>{e.visible(e.getAttr("oldVisible"))}),w.forEach(e=>{e.visible(e.getAttr("oldVisible"))}),p.find(".page-background").forEach(e=>e.shadowEnabled(!0)),p.find(".page-background").forEach(e=>e.strokeEnabled(!0)),c.find("Transformer").forEach(e=>{e.visible(e.getAttr("oldVisible"))}),p.find(".highlighter").forEach(e=>e.visible(!0)),m.clip(v),y.clip(b),c.position(g),e.setElementsPixelRatio(f),u?.set({_exporting:!1,_forceMount:!1}),S},async toDataURL({mimeType:t,quality:n,...r}={}){let i=await e._toCanvas({mimeType:t,...r}),o=i.toDataURL(t,n);return h(M).Util.releaseCanvas(i),o},async toBlob({mimeType:t,quality:n,...r}={}){let i=await e._toCanvas({mimeType:t,...r}),o=await new Promise(e=>{i.toBlob(e,t,n)});return h(M).Util.releaseCanvas(i),o},async saveAsImage({fileName:t,...n}={}){let r=n.mimeType||"image/png",i=r.split("/")[1];lS(await e.toDataURL(n),t||"polotno."+i,r)},async _toPDF(t){let n=t.dpi||e.dpi,r=t.parallel||1,i=t.unit||("px"===e.unit?"mm":e.unit),o=t.pixelRatio||1,a=t.pageIds||e.pages.map(e=>e.id),l=e.pages.filter(e=>a.includes(e.id)),s=await (window.jspdf?.jsPDF?Promise.resolve(window.jspdf.jsPDF):lE||(lE=new Promise(e=>{var t=document.createElement("script");t.onload=function(){e(window.jspdf.jsPDF)},t.src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/3.0.1/jspdf.umd.min.js",document.head.appendChild(t)}))),u=e=>l1({px:e,unit:i,dpi:n}),c=t.cropMarkSize||0,d=u(c),h=l[0]||{},f=t.includeBleed?h.bleed:0,p=u(h.computedWidth+2*f+2*d),g=u(h.computedHeight+2*f+2*d);var m=new s({unit:i,orientation:p>g?"landscape":"portrait",format:[p,g],compress:!0,putOnlyUsedFonts:!0});m.deletePage(1);let v=((e,t)=>{for(var n=[],r=0;r<e.length;r+=t)n.push(e.slice(r,r+t));return n})(l,r),y=0;for(let n of v){let r=n.map(async n=>{let r=t.includeBleed?n.bleed:0,i=n.computedWidth+2*r+2*c,l=n.computedHeight+2*r+2*c,s=u(i),d=u(l),h=0,f=o;for(;h<10;){2===(h+=1)&&console.error("Polotno can not export PDF with current settings. Quality is automatically reduced.");let r=await e.toDataURL({...t,pageId:n.id,pixelRatio:f});if(r.length>20)return t.onProgress&&t.onProgress(++y/a.length*.9),{url:r,width:s,height:d,widthPx:i,heightPx:l};f*=.8}});(await Promise.all(r)).forEach(({url:e,width:t,height:n,widthPx:r,heightPx:o})=>{var a;m.addPage([t,n],t>n?"landscape":"portrait");let l=m.getCurrentPageInfo();switch(i){case"pt":a=1;break;case"mm":a=72/25.4;break;case"cm":a=72/2.54;break;case"in":a=72;break;case"px":a=.75;break;case"pc":case"em":a=12;break;case"ex":a=6;break;default:throw"Invalid unit: "+i}if(l.pageContext.cropBox={bottomLeftX:0,bottomLeftY:0,topRightX:t*a,topRightY:n*a},l.pageContext.artBox={bottomLeftX:u(c+f)*a,bottomLeftY:u(c+f)*a,topRightX:u(r-c-f)*a,topRightY:u(o-c-f)*a},l.pageContext.bleedBox={bottomLeftX:u(c+f)*a,bottomLeftY:u(c+f)*a,topRightX:u(r-c-f)*a,topRightY:u(o-c-f)*a},d){m.setLineWidth(u(1));let e=d+u(f);m.line(e,0,e,d),m.line(0,e,d,e),m.line(t-e,0,t-e,d),m.line(t,e,t-d,e),m.line(0,n-e,d,n-e),m.line(e,n,e,n-d),m.line(t,n-e,t-d,n-e),m.line(t-e,n,t-e,n-d)}m.addImage(e,d,d,t-2*d,n-2*d,void 0,"FAST")})}return m},toPDFDataURL:async t=>(await e._toPDF({mimeType:"image/jpeg",...t})).output("datauristring"),async toGIFDataURL(t={}){let n=t.pixelRatio||1,r=await lk({width:e.width*n,height:e.height*n}),i=1e3/(t.fps||10),o=e.duration/i;for(let t=0;t<o-1;t++){let o=t*i||1;e.setCurrentTime(o);let a=0,l="";for(let t of e.pages)if(a+=t.duration,t.set({_rendering:a>o}),a>o){l=t.id;break}let s=await e._toCanvas({pixelRatio:n,pageId:l,_skipTimeout:!0});r.addFrame(s.getContext("2d"),{delay:i,copy:!0})}for(let t of e.pages)t.set({_rendering:!1});return e.stop(),r.render(),new Promise(e=>{r.on("finished",function(t){var n;(n=new FileReader).onload=function(t){e(t.target.result)},n.readAsDataURL(t)})})},async saveAsGIF({fileName:t,...n}={}){lS(await e.toGIFDataURL(n),t||"polotno.gif")},toHTML:async({elementHook:t}={elementHook:void 0})=>sg({json:e.toJSON(),elementHook:t}),async saveAsHTML({fileName:t}={}){let n=await e.toHTML();lS("data:text/html;base64,"+window.btoa(unescape(encodeURIComponent(n))),t||"polotno.html")},async toSVG({elementHook:t,pageId:n}={elementHook:void 0,pageId:void 0}){let r=e.toJSON();n=n||r.pages[0]?.id;let i=r.pages.find(e=>e.id===n);return sT({json:{...r,pages:i?[i]:[]},elementHook:t})},async saveAsSVG({fileName:t,elementHook:n,pageId:r}={}){let i=await e.toSVG({elementHook:n,pageId:r});lS("data:text/svg;base64,"+window.btoa(unescape(encodeURIComponent(i))),t||"polotno.svg")},async saveAsPDF({fileName:t,...n}={}){(await e._toPDF({mimeType:"image/jpeg",...n})).save(t||"polotno.pdf")},async waitLoading({_skipTimeout:e=!1}={}){e||await new Promise(e=>setTimeout(e,50)),await new Promise(e=>{var t;return t=()=>{ih()?setTimeout(e,300):e(!0)},void(0===ig?t():im.push(t))})},toJSON:()=>({width:e.width,height:e.height,fonts:(0,iq.getSnapshot)(e.fonts),pages:(0,iq.getSnapshot)(e.pages),audios:(0,iq.getSnapshot)(e.audios),unit:e.unit,dpi:e.dpi,custom:e.custom,schemaVersion:e.schemaVersion}),loadJSON(t,n=!1){let r={...t};void 0===r.schemaVersion&&iM.htmlRenderEnabled&&sZ({children:r.pages},e=>{if("text"===e.type){let t=16*e.letterSpacing;e.letterSpacing=t/e.fontSize}});let i=e.pages.indexOf(e.activePage),o=(r.pages[i]||r.pages[0])?.id;r._activePageId=o;let a={...(0,iq.getSnapshot)(e)};Object.assign(a,r),n?a.history=e.history.toJSON():a.history={history:[],undoIdx:-1},(0,iq.applySnapshot)(e,a)},clear({keepHistory:t=!1}={}){let n=e.pages.map(e=>e.id);e.deletePages(n),e.custom=null,t||e.history.clear()},addFont(t){e.removeFont(t.fontFamily),e.fonts.push(t),e.loadFont(t.fontFamily)},removeFont(t){e.fonts.filter(e=>e.fontFamily===t).forEach(e=>(0,iq.destroy)(e))},addAudio(t){let n=sj.create({id:lw(10),...t});e.audios.push(n)},removeAudio(t){let n=e.audios.find(e=>e.id===t);n&&e.audios.remove(n)},async loadFont(t){let n=e.fonts.find(e=>e.fontFamily===t)||iE.find(e=>e.fontFamily===t),r=[{fontStyle:"normal",fontWeight:"normal"}];return n?(n.styles&&(r=n.styles.map(e=>({fontStyle:e.fontStyle||"normal",fontWeight:e.fontWeight||"normal"}))),function(e){let t=e.fontFamily;if(iL[t]||!e.url&&!e.styles)return;let n=document.createElement("style");n.type="text/css";let r=e.styles||(e.url?[{src:`url("${e.url}")`}]:[]),i="";r.forEach(e=>{i+=`
       @font-face {
         font-family: '${t}';
         src: ${e.src};
         font-style: ${e.fontStyle||"normal"};
         font-weight: ${e.fontWeight||"normal"};
       }
-    `}),n.innerHTML=i,document.getElementsByTagName("head")[0].appendChild(n),iL[e.fontFamily]=!0}(n)):function(e){if(ij[e])return;let t=iR(e),n=document.createElement("link");n.type="text/css",n.href=t,n.rel="stylesheet",document.getElementsByTagName("head")[0].appendChild(n),ij[e]=!0}(t),Promise.all(r.map(e=>iA(t,e.fontStyle,e.fontWeight)))},validate:e=>sR.validate(e,[{path:"",type:sR}]).map(e=>({path:"store"+e.context.map(e=>e.path).join("."),message:e.message}))})),sL=(0,iq.types).model("Node",{id:iq.types.identifier,type:"none",name:"",opacity:1,custom:(0,iq.types).frozen(),visible:!0,selectable:!0,removable:!0,alwaysOnTop:!1,showInExport:!0}).preProcessSnapshot(e=>{for(var t in e)null===e[t]&&(e[t]=void 0);return e}).postProcessSnapshot(e=>{let t={...e},n={};for(var r in t)"_"!==r[0]&&(n[r]=e[r]);return n}).views(e=>({get locked(){return!e.draggable&&!e.contentEditable&&!e.styleEditable&&!e.resizable},get page(){return(0,iq.getParentOfType)(e,sA)},get store(){return(0,iq.getParentOfType)(e,sR)},get top(){let t=e;for(;;){if(!(0,iq.hasParentOfType)(t,s0))return t;t=(0,iq.getParentOfType)(t,s0)}},get parent(){if((0,iq.hasParentOfType)(e,s0))return(0,iq.getParentOfType)(e,s0);if((0,iq.hasParentOfType)(e,sA))return(0,iq.getParentOfType)(e,sA);if((0,iq.hasParentOfType)(e,sR))return(0,iq.getParentOfType)(e,sR);return null},get zIndex(){return e.parent.children.indexOf(e)}})).actions(e=>({toJSON:()=>({...(0,iq.getSnapshot)(e)})})).actions(e=>({clone(t={},{skipSelect:n=!1}={}){let r=JSON.parse(JSON.stringify(e.toJSON()));return t.id=t.id||lw(10),sZ(r,e=>{e.id=lw(10)}),Object.assign(r,t),e.page.addElement(r,{skipSelect:n})},set(t){Object.assign(e,t)},moveUp(){e.page.moveElementsUp([e.id])},moveTop(){e.page.moveElementsTop([e.id])},moveDown(){e.page.moveElementsDown([e.id])},moveBottom(){e.page.moveElementsBottom([e.id])},setZIndex(t){e.parent.setElementZIndex(e.id,t)},beforeDestroy(){}}));var iq=v("58B0H");let sM={right:{from:{x:-200},to:{x:0}},left:{from:{x:200},to:{x:0}},up:{from:{y:200},to:{y:0}},down:{from:{y:-200},to:{y:0}},"bottom-right":{from:{x:-200,y:-200},to:{x:0,y:0}},"bottom-left":{from:{x:200,y:-200},to:{x:0,y:0}},"top-right":{from:{x:-200,y:200},to:{x:0,y:0}},"top-left":{from:{x:200,y:200},to:{x:0,y:0}}},sI={right:{cropX:-1},left:{cropX:1},up:{cropY:1},down:{cropY:-1}},sD={fade:({dTime:e,element:t,animation:n})=>{let r=e/n.duration;return"enter"===n.type?{opacity:r*t.opacity}:{opacity:(1-r)*t.opacity}},rotate:({dTime:e,element:t,animation:n})=>{let r=n.duration;return function(e,t){let n=function(e){let t=aI(e.rotation||0);return{x:e.x+e.width/2*Math.cos(t)+e.height/2*Math.sin(-t),y:e.y+e.height/2*Math.cos(t)+e.width/2*Math.sin(t)}}(e);return function(e,t,n){let r=aI(t),i=n.x+(e.x-n.x)*Math.cos(r)-(e.y-n.y)*Math.sin(r),o=n.y+(e.x-n.x)*Math.sin(r)+(e.y-n.y)*Math.cos(r);return{...e,rotation:e.rotation+t,x:i,y:o}}(e,t,n)}({x:t.x,y:t.y,width:t.width,height:t.height,rotation:t.rotation},e/r*360)},blink:({dTime:e,element:t,animation:n})=>{let r=n.duration,i=e%r/(r/2);return{opacity:t.opacity*(i<=1?i:2-i)}},bounce:({dTime:e,element:t,animation:n})=>{let r=n.duration,i=n.data.strength??1,o={},a={x:t.x+t.width/3*i,y:t.y+t.height/3*i,width:t.width/3*i,height:t.height/3*i,fontSize:t.fontSize/3*i},l={x:t.x,y:t.y,width:t.width,height:t.height,fontSize:t.fontSize},s=e%r/(r/2),u=s<=1?s:2-s;for(let e in a){let t=a[e],n=l[e]-t;o[e]=t+u*n}return o},move:({dTime:e,element:t,animation:n})=>{let r=sM[n.data.direction]||sM.right,i=n.data.strength??1,o={};for(var a in r.from){let l=r.from[a],s=r.to[a];"exit"===n.type&&(l=r.to[a],s=-r.from[a]),l*=i,s*=i;let u=t[a]+l,c=t[a]+s-u;o[a]=u+e/n.duration*c}return o},zoom:({dTime:e,element:t,animation:n})=>{let r={},i=n.data.direction||"in",o=1+(("in"===i?3/4:5/4)-1)*(n.data.strength??1),a=t.rotation*Math.PI/180,l=Math.cos(a),s=Math.sin(a),u=t.width*(1-o),c=t.height*(1-o),d={x:t.x+(u*l-c*s)/2,y:t.y+(u*s+c*l)/2,width:t.width*o,height:t.height*o,fontSize:t.fontSize*o},h={x:t.x,y:t.y,width:t.width,height:t.height,fontSize:t.fontSize};for(var f in d){let t=d[f],i=h[f];if("exit"===n.type){let e=t;t=i,i=e}let o=i-t;r[f]=t+e/n.duration*o}return r},cameraZoom:({dTime:e,element:t,animation:n})=>{let r,i,o={},a=sI[n.data.direction||"right"]||sI.right,l=n.data.movementStrength??.1,s=n.data.shakeStrength??.015,u=n.data.zoomStrength??.6,c=e/n.duration,d=s*(1-c),h=Math.sin(12*c)*d*.7+Math.sin(8*c)*d*.3;"exit"===n.type&&(u=Math.min(u,1-Math.max(t.cropWidth||1,t.cropHeight||1))),n.type;let f=1-Math.pow(1-c,2),p=t.cropX||0,g=t.cropY||0,m=t.cropWidth||1,v=t.cropHeight||1,y=0,b=0;return a.cropX&&(y=Math.min(a.cropX>0?1-(p+m):p,Math.abs(l))*a.cropX),a.cropY&&(b=Math.min(a.cropY>0?1-(g+v):g,Math.abs(l))*a.cropY),"enter"===n.type?(r=a.cropX?p+y*(1-f):p,i=a.cropY?g+b*(1-f):g):(r=a.cropX?p+y*f:p,i=a.cropY?g+b*f:g),o.cropX=Math.max(0,Math.min(1-m,r+h*m)),o.cropY=Math.max(0,Math.min(1-v,i+h*v)),o.cropWidth=m,o.cropHeight=v,o}},sz=({element:e,dTime:t,animation:n})=>{let r=sD[n.name];return r?r({element:e,dTime:t,animation:n}):(console.error("Can not find animation type: "+n.name),{})};var _=v("2SBKn");let sF=(0,iq.types).model("Animation",{delay:0,duration:500,enabled:!0,type:(0,iq.types).enumeration("Type",["enter","exit","loop"]),name:"none",data:(0,iq.types).frozen({})}),sB=(e,t)=>{let n={};for(let r in t)if("number"==typeof e[r]&&"number"==typeof t[r]){let i=t[r]-e[r];0!==i&&(n[r]=i)}return n},sH=(0,iq.types).model("ShapeFilter",{intensity:1}),sV=["temperature","contrast","highlights","shadows","white","black","saturation","vibrance"],sU=sL.named("Shape").props({x:0,y:0,width:100,height:100,rotation:0,opacity:1,animations:(0,iq.types).array(sF),blurEnabled:!1,blurRadius:10,brightnessEnabled:!1,brightness:0,sepiaEnabled:!1,grayscaleEnabled:!1,filters:(0,iq.types).map(sH),shadowEnabled:!1,shadowBlur:5,shadowOffsetX:0,shadowOffsetY:0,shadowColor:"black",shadowOpacity:1,visible:!0,draggable:!0,resizable:!0,selectable:!0,contentEditable:!0,styleEditable:!0,alwaysOnTop:!1,showInExport:!0}).preProcessSnapshot(e=>{let t={...e,x:e.x||0,y:e.y||0,filters:Array.isArray(e.filters)?{}:e.filters};return"width"in e&&(t.width=t.width||1),"height"in e&&(t.height=t.height||1),e.locked&&(t.draggable=!1,t.contentEditable=!1,t.styleEditable=!1,t.resizable=!1,t.removable=!1),t}).views(e=>{let t=(0,_.observable)({x:e.x,y:e.y,width:e.width,height:e.height,rotation:e.rotation,opacity:e.opacity,color:e.color,fontSize:e.fontSize}),n=(0,_.action)(e=>{Object.assign(t,e)}),r=(0,_.action)(e=>{for(let n in e)"number"==typeof t[n]&&(t[n]=t[n]+e[n])});return{get a(){let{currentTime:i}=e.store;if(n({x:e.x,y:e.y,width:e.width,height:e.height,rotation:e.rotation,opacity:e.opacity,color:e.color,fontSize:e.fontSize,cropX:e.cropX,cropY:e.cropY,cropWidth:e.cropWidth,cropHeight:e.cropHeight}),0===i)return t;let o=i-e.page.startTime;if(o>e.page.duration||o<0)return t;let a=e.store.animatedElementsIds;if(a.length&&!a.includes(e.id))return t;let l=e.animations.find(e=>"enter"===e.type),s=l?.enabled&&o<l.delay;s&&n({opacity:0});let u=l?.enabled&&o>=l.delay&&o<=l.delay+l.duration;if(u){let t=o-l.delay,n=sz({element:e,animation:l,dTime:t});r(sB(e,n))}let c=e.animations.find(e=>"exit"===e.type);if(!s&&!u&&c?.enabled&&o>=e.page.duration-c.duration-c.delay&&o<=e.page.duration-c.delay){let t=o-(e.page.duration-c.duration-c.delay),n=sz({element:e,animation:c,dTime:t});r(sB(e,n))}c?.enabled&&o>=e.page.duration-c.delay&&n({opacity:0});let d=e.animations.find(e=>"loop"===e.type);if(d?.enabled){let t=sz({element:e,animation:d,dTime:o});r(sB(e,t))}return t},animated:t=>e.a[t]}}).actions(e=>({setAnimation(t,n){let r=e.animations.find(e=>e.type===t);r?Object.assign(r,n):e.animations.push({type:t,...n})},setFilter(t,n){sV.includes(t)||e.filters.forEach((t,n)=>{sV.includes(n.toString())||e.filters.delete(n.toString())}),null==n&&e.filters.delete(t),e.filters.set(t,{intensity:n})}}));var iq=v("58B0H");let sG=sU.named("Text").props({type:"text",text:"",placeholder:"",fontSize:14,fontFamily:"Roboto",fontStyle:"normal",fontWeight:"normal",textDecoration:"",fill:"black",align:"center",width:100,height:0,verticalAlign:"top",strokeWidth:0,stroke:"black",lineHeight:(0,iq.types).optional((0,iq.types).union(iq.types.number,iq.types.string),1.2),letterSpacing:0,_editModeEnabled:!1,backgroundEnabled:!1,backgroundColor:"#7ED321",backgroundOpacity:1,backgroundCornerRadius:.5,backgroundPadding:.5}).preProcessSnapshot(e=>({...e})).actions(e=>({toggleEditMode(t){e._editModeEnabled=t??!e._editModeEnabled,e._editModeEnabled?e.store.history.startTransaction():e.store.history.endTransaction()}})),sq=sU.named("Image").props({type:"image",width:100,height:100,src:"",cropX:0,cropY:0,cropWidth:1,cropHeight:1,cornerRadius:0,flipX:!1,flipY:!1,clipSrc:"",borderColor:"black",borderSize:0,keepRatio:!1,stretchEnabled:!1,_cropModeEnabled:!1}).actions(e=>({toggleCropMode(t){e._cropModeEnabled=t??!e._cropModeEnabled,e._cropModeEnabled?e.store.history.startTransaction():e.store.history.endTransaction()},beforeDestroy(){e._cropModeEnabled&&e.store.history.endTransaction()}})),sW=sq.named("Video").props({type:"video",duration:0,startTime:0,endTime:1,volume:1});var iq=v("58B0H");let s$=sU.named("Line").props({type:"line",width:400,height:10,color:"black",dash:(0,iq.types).array(iq.types.number),startHead:"",endHead:""}).actions(e=>({}));var iq=v("58B0H");let sK=sU.named("SVG").props({type:"svg",src:"",maskSrc:"",cropX:0,cropY:0,cropWidth:1,cropHeight:1,keepRatio:!0,stretchEnabled:!0,flipX:!1,flipY:!1,width:100,height:100,borderColor:"black",borderSize:0,cornerRadius:0,colorsReplace:(0,iq.types).map(iq.types.string)}).preProcessSnapshot(e=>({...e,src:e.src||e.svgSource,colorsReplace:Array.isArray(e.colorsReplace)?{}:e.colorsReplace})).actions(e=>({replaceColor(t,n){e.colorsReplace.set(t,n)}}));var iq=v("58B0H");let sY=sU.named("Figure").props({type:"figure",subType:"rect",fill:"rgb(0, 161, 255)",dash:(0,iq.types).array(iq.types.number),strokeWidth:0,stroke:"rgba(98, 197, 255, 1)",cornerRadius:0}),sX=sq.named("Gif").props({type:"gif",duration:0,keepRatio:!0}),sZ=(e,t)=>{if(e.children)for(let n of e.children){if(!0===t(n))break;sZ(n,t)}},sQ=[...Array(20)].map((e,t)=>(0,iq.types).late(()=>s1[t])),sJ=(0,iq.types).union({dispatcher:e=>{let t=s2[e.type];if(!t)throw Error(`Unknown element type: "${e.type}"`);return t}},sK,sG,sq,s$,sW,sY,sX,(0,iq.types).late(()=>s0),...sQ),s0=sL.named("Group").props({type:"group",children:(0,iq.types).array(sJ)}).views(e=>({get draggable(){let t=!0;return sZ(e,e=>{e.draggable||(t=!1)}),t},get resizable(){let t=!0;return sZ(e,e=>{e.resizable||(t=!1)}),t},get contentEditable(){let t=!0;return sZ(e,e=>{e.contentEditable||(t=!1)}),t},get styleEditable(){let t=!0;return sZ(e,e=>{e.styleEditable||(t=!1)}),t},get locked(){let t=!0;return sZ(e,e=>{e.locked||(t=!1)}),t}})).actions(e=>({set({draggable:t,contentEditable:n,styleEditable:r,resizable:i,...o}){void 0!==t&&sZ(e,e=>{e.set({draggable:t})}),void 0!==n&&sZ(e,e=>{e.set({contentEditable:n})}),void 0!==r&&sZ(e,e=>{e.set({styleEditable:r})}),void 0!==i&&sZ(e,e=>{e.set({resizable:i})}),Object.assign(e,o)},addElement(t,{skipSelect:n=!1}={}){let r=s2[t.type];if(!r){console.error("Can not find model with type "+t.type);return}t.children&&t.children.forEach(e=>{e.id=lw(10)});let i=r.create({id:lw(10),...t});return e.children.push(i),i.selectable&&!n&&e.store.selectElements([i.id]),i},setElementZIndex(t,n){let r=e.children.find(e=>e.id===t);r&&((0,iq.detach)(r),e.children.remove(r),e.children.splice(n,0,r))}})),s1=[],s2={svg:sK,text:sG,image:sq,group:s0,line:s$,video:sW,figure:sY,gif:sX},s3={text:i2,image:oE,svg:oE,line:aY,video:a9,figure:la,group:R(e=>{let{element:t,store:n}=e,{children:r}=t,i=t.selectable||"admin"===n.role;return(0,b.jsx)(rK,{opacity:t.opacity,listening:i,hideInExport:!t.showInExport,children:r.map(t=>(0,C.createElement)(s6,{...e,key:t.id,store:n,element:t}))})}),gif:ly},s4=e=>{let[t,n]=h(C).useState(null);return h(C).useEffect(()=>{let t=e.page.id;n(h(M).stages.find(e=>e.getAttr("pageId")===t))},[e.id]),t},s8=(e,t)=>{let n=[];sZ(e,e=>{"group"!==e.type&&n.push(e.a)});let r=[];n.forEach(e=>{let t=[{x:0,y:0},{x:0+e.width,y:0},{x:0+e.width,y:0+e.height},{x:0,y:0+e.height}],n=new(h(M)).Transform;n.translate(e.x,e.y),n.rotate(h(M).Util.degToRad(e.rotation)),t.forEach(e=>{let t=n.point(e);r.push(t)})});let i=new(h(M)).Transform;i.rotate(-h(M).Util.degToRad(t));let o=1/0,a=1/0,l=-1/0,s=-1/0;r.forEach(e=>{let t=i.point(e);o=Math.min(o,t.x),a=Math.min(a,t.y),l=Math.max(l,t.x),s=Math.max(s,t.y)}),i.invert();let u=i.point({x:o,y:a});return{x:u.x,y:u.y,width:l-o,height:s-a,rotation:t}},s6=R(e=>{let{element:t,store:n}=e,[r,i]=h(C).useState(!1),o=n.selectedElements.indexOf(t)>=0&&t.selectable,a="group"===t.parent.type,l=s4(t),s=l?.findOne("Transformer");h(C).useEffect(()=>{l&&(l.on("mouseover",e=>{let r=e.target.findAncestor(".element",!0),o=n.getElementById(r?.id()),a=o?.top;i(a?.id===t.id)}),l.on("mouseleave",e=>{i(!1)}))},[l]);let u=s3[e.element.type];return("text"===e.element.type&&iM.htmlRenderEnabled&&(u=aM),e.element.visible)?u?(0,b.jsxs)(h(C).Fragment,{children:[(0,b.jsx)(u,{...e}),(r||o)&&!a&&(0,b.jsx)(lx,{element:"group"===t.type?{a:s8(t,s?.rotation()||0)}:t})]}):(console.error("Can not find component for "+e.element.type),null):null}),s5=h(M).DD._drag;window.removeEventListener("mousemove",s5),h(M).DD._drag=function(e){(0,_.runInAction)(()=>{s5.call(this,e)})},window.addEventListener("mousemove",h(M).DD._drag);let s9=new(h(M)).Group;s9.add(new(h(M)).Rect({width:20,height:20,fill:"white"})),s9.add(new(h(M)).Path({scaleX:20/24,scaleY:20/24,data:"M4.98313549,11.0001422 C5.49589839,10.9914935 5.92501998,11.3703506 5.99116425,11.8666444 L5.99985778,11.9831355 L6.00348884,12.2068855 C6.11245031,15.4321748 8.76323537,17.9999971 11.9999971,17.9999971 C12.1869612,17.9999971 12.3726725,17.9914753 12.5567465,17.9745765 L12.2928932,17.7071068 C11.9023689,17.3165825 11.9023689,16.6834175 12.2928932,16.2928932 C12.6834175,15.9023689 13.3165825,15.9023689 13.7071068,16.2928932 L15.7071068,18.2928932 C16.0976311,18.6834175 16.0976311,19.3165825 15.7071068,19.7071068 L13.7071068,21.7071068 C13.3165825,22.0976311 12.6834175,22.0976311 12.2928932,21.7071068 C11.9023689,21.3165825 11.9023689,20.6834175 12.2928932,20.2928932 L12.6111505,19.9769552 C12.4086045,19.9922816 12.2047796,19.9999971 11.9999971,19.9999971 C7.7687005,19.9999971 4.28886152,16.7094374 4.01666425,12.5105203 L4.00420123,12.2575143 L4.00014222,12.0168645 C3.9908282,11.4646583 4.43092928,11.0094562 4.98313549,11.0001422 Z M11.7071068,2.29289322 C12.0675907,2.65337718 12.0953203,3.22060824 11.7902954,3.61289944 L11.7071068,3.70710678 L11.3891629,4.0230186 C11.5916051,4.00770767 11.7953244,4 12,4 C16.418278,4 20,7.581722 20,12 C20,12.5522847 19.5522847,13 19,13 C18.4477153,13 18,12.5522847 18,12 C18,8.6862915 15.3137085,6 12,6 C11.8129339,6 11.6271216,6.00853145 11.4429483,6.02544919 L11.7071068,6.29289322 C12.0976311,6.68341751 12.0976311,7.31658249 11.7071068,7.70710678 C11.3466228,8.06759074 10.7793918,8.09532028 10.3871006,7.79029539 L10.2928932,7.70710678 L8.29289322,5.70710678 C7.93240926,5.34662282 7.90467972,4.77939176 8.20970461,4.38710056 L8.29289322,4.29289322 L10.2928932,2.29289322 C10.6834175,1.90236893 11.3165825,1.90236893 11.7071068,2.29289322 Z",fill:"black"}));let s7=s9.toCanvas({pixelRatio:2,width:20,height:20}),ue={enabledAnchors:["top-left","top-center","top-right","middle-left","bottom-left","bottom-right","bottom-center","middle-right"],borderEnabled:!0,rotateEnabled:!0,rotationSnaps:[0,45,90,135,180,225,270,315],ignoreStroke:!0,flipEnabled:!1,anchorStrokeWidth:2,borderStrokeWidth:2,rotateAnchorOffset:30,anchorStyleFunc:e=>{e.hasName("rotater")&&e.setAttrs({width:20,height:20,cornerRadius:10,offsetX:10,offsetY:10,fillPatternImage:s7,fillPatternScaleX:.5,fillPatternScaleY:.5,fillPriority:"pattern",fillPatternRepeat:"no-repeat"})}},ut={text:{enabledAnchors:["top-left","top-right","middle-left","bottom-left","bottom-right","middle-right"]},svg:{enabledAnchors:["top-left","top-right","bottom-left","bottom-right"]},gif:{enabledAnchors:["top-left","top-right","bottom-left","bottom-right"]},line:{enabledAnchors:[],borderEnabled:!1,rotateEnabled:!1},image:{enabledAnchors:["top-left","top-right","bottom-left","bottom-right"]},many:{enabledAnchors:["top-left","top-right","bottom-left","bottom-right"]},group:{enabledAnchors:["top-left","top-right","bottom-left","bottom-right"]}},un=e=>(0,b.jsx)(rX,{...e,preventDefault:!1}),ur=({url:e,...t})=>{let[n,r]=h(r4)(e,"anonymous"),i=n?function(e,t,n="scale"){let r,i,o=t.width/t.height;o>=e.width/e.height?(r=e.width,i=e.width/o):(r=e.height*o,i=e.height);let a=0,l=0;return"left-top"===n?(a=0,l=0):"left-middle"===n?(a=0,l=(e.height-i)/2):"left-bottom"===n?(a=0,l=e.height-i):"center-top"===n?(a=(e.width-r)/2,l=0):"center-middle"===n?(a=(e.width-r)/2,l=(e.height-i)/2):"center-bottom"===n?(a=(e.width-r)/2,l=e.height-i):"right-top"===n?(a=e.width-r,l=0):"right-middle"===n?(a=e.width-r,l=(e.height-i)/2):"right-bottom"===n?(a=e.width-r,l=e.height-i):"scale"===n?(a=0,l=0,r=e.width,i=e.height):console.error(Error("Unknown clip position property - "+n)),{cropX:a,cropY:l,cropWidth:r,cropHeight:i}}(n,{width:t.width,height:t.height},"center-middle"):{};return oC(r,e,"page background"),(0,b.jsx)(rQ,{image:n,...t,...i})},ui=e=>{let t=id({fill:e.fill,a:{width:e.width,height:e.height}});return(0,b.jsx)(rX,{...e,...t})},uo=e=>{let{background:t,scale:n,borderColor:r,...i}=e,o=h(C).useMemo(()=>!!h(M).Util.colorToRGBA(t)||is(t),[t]),a=h(C).useMemo(()=>{let e=document.createElement("canvas");e.width=60,e.height=60;let t=e.getContext("2d");return t&&(t.fillStyle="black",t.fillRect(30,0,30,30),t.fillRect(0,30,30,30)),e},[]);return(0,b.jsxs)(h(C).Fragment,{children:[(0,b.jsx)(rX,{fillPatternImage:a,...i,opacity:.1,hideInExport:!0}),o?(0,b.jsx)(ui,{fill:t,...i}):(0,b.jsx)(ur,{url:t,...i})]})},ua=R(({selection:e})=>e.visible?(0,b.jsx)(rX,{name:"selection",x:Math.min(e.x1,e.x2),y:Math.min(e.y1,e.y2),width:Math.abs(e.x1-e.x2),height:Math.abs(e.y1-e.y2),fill:"rgba(0, 161, 255, 0.3)"}):null),ul=R(({x:e,y:t,width:n,height:r,rotation:i,anchor:o,store:a})=>{let l=az({x:e,y:t,width:n,height:r,rotation:h(M).Util.radToDeg(i)});if(void 0===o)return null;let s=(r/2+70)*Math.cos(i-Math.PI/2),u=(r/2+70)*Math.sin(i-Math.PI/2),c=l2({unit:a.unit,dpi:a.dpi,px:n/a.scale,precious:+("px"!==a.unit)})+" x "+l2({unit:a.unit,dpi:a.dpi,px:r/a.scale,precious:+("px"!==a.unit)})+("px"===a.unit?"":" "+a.unit);return(0,b.jsxs)(b.Fragment,{children:[(0,b.jsxs)(rY,{x:(l.minX+l.maxX)/2+s,y:(l.minY+l.maxY)/2+u,offsetX:14,offsetY:14,visible:"rotater"===o,children:[(0,b.jsx)("Tag",{cornerRadius:5,fill:"rgb(0, 161, 255)"}),(0,b.jsx)(rJ,{align:"center",verticalAlign:"middle",fill:"white",padding:8,text:Math.round(h(M).Util.radToDeg(i)).toString()+"°"})]}),(0,b.jsxs)(rY,{x:(l.minX+l.maxX)/2,y:l.maxY+20,visible:"rotater"!==o,children:[(0,b.jsx)("Tag",{cornerRadius:5,fill:"rgb(0, 161, 255)",pointerDirection:"up",pointerHeight:0,pointerWidth:0}),(0,b.jsx)(rJ,{align:"center",verticalAlign:"middle",fill:"white",padding:8,text:c})]})]})}),us=R(({elements:e,store:t})=>{let n=e.filter(e=>e.alwaysOnTop),r=e.filter(e=>!e.alwaysOnTop).concat(n);return(0,b.jsx)(h(C).Fragment,{children:r.map(e=>(0,b.jsx)(s6,{store:t,element:e,onClick:()=>{console.warn("Polotno warning: onClick callback is deprecated. Just stop using it. Polotno will do selection automatically.")}},e.id))})}),uu=({store:e})=>{let[t,n]=h(C).useState(!1),[r,i]=h(C).useState({x:0,y:0});return{open:h(C).useCallback(e=>{n(!0),i(e)},[]),close:h(C).useCallback(()=>{n(!1)},[]),props:{isOpen:t,offset:r,setIsOpen:n}}},uc=null,ud=e=>{uc=e},uh=({stageRef:e,containerRef:t,viewportSize:n})=>{h(C).useEffect(()=>{let n=t.current?.closest(".polotno-workspace-inner");function r(){if(!e.current)return;let r=t.current?.getBoundingClientRect(),i=n?.getBoundingClientRect(),o=Math.max(0,i.left-r.left-100),a=Math.max(0,i.top-r.top-100);e.current.position({x:-o,y:-a}),e.current.container().style.transform=`translate(${o}px, ${a}px)`}return r(),n.addEventListener("scroll",r),()=>{n.removeEventListener("scroll",r)}},[n.width,n.height])},uf=atob("UG9sb3RubyBmcmVlIGxpY2Vuc2UgbGltaXRhdGlvbiBleGNlZWRlZCAtIFBsZWFzZSB1cGdyYWRlIHlvdXIgYWNjb3VudC4="),up=atob("cmVk"),ug=atob("djAuOS4y"),um=e=>(0,b.jsx)(b.Fragment,{children:(0,b.jsxs)(rY,{fill:up,height:200,children:[(0,b.jsx)("Tag",{fill:up}),(0,b.jsx)(rJ,{...e,fill:"white",text:uf,height:void 0,padding:10,fontSize:20})]})});var uv=R(({store:e,page:t,width:n,height:r,pageControlsEnabled:i,backColor:o,pageBorderColor:a,activePageBorderColor:l,components:s,bleedColor:u,altCloneEnabled:c,viewportSize:d})=>{var f;let p=e.bleedVisible?t.bleed:0,g=t.computedWidth+2*p,m=t.computedHeight+2*p,v=(n-g*e.scale)/2,y=(r-m*e.scale)/2,x=h(C).useRef(null),w=h(C).useRef(null),S=h(C).useRef(null),[E,k]=h(C).useState(null),[O,P]=h(C).useState({}),T=uu({store:e}),A=e.selectedElements.find(e=>e._cropModeEnabled),j=e.selectedShapes.filter(e=>!e.resizable).length>0,N=e.selectedShapes.filter(e=>!e.draggable).length>0,R=e.selectedElements.filter(e=>!e.visible).length>0;h(C).useLayoutEffect(()=>{if(!x.current)return;let t=x.current.getStage(),n=e.selectedShapes.map(e=>e._cropModeEnabled?null:t.findOne("#"+e.id)).filter(e=>e),r=1===e.selectedElements.length&&e.selectedElements[0]?.type||"many";ut[r]?(x.current.setAttrs({...ue,...ut[r]}),"svg"!==r&&"image"!==r&&"gif"!==r||e.selectedElements[0].keepRatio||x.current.setAttrs({enabledAnchors:ue.enabledAnchors}),"text"===r&&iM.textVerticalResizeEnabled&&x.current.setAttrs({enabledAnchors:ut.text.enabledAnchors?.concat(["bottom-center"])})):x.current.setAttrs(ue),j&&x.current.enabledAnchors([]),N&&x.current.rotateEnabled(!1),n.find(e=>e?.isDragging())&&n.forEach(e=>{e.isDragging()||e?.startDrag()}),x.current.nodes(n),x.current.getLayer()?.batchDraw()},[e.selectedShapes,A,j,R,N]);let L=(f=()=>({visible:!1,x1:0,y1:0,x2:0,y2:0}),(0,C.useState)(function(){return(0,_.observable)(f(),void 0,{autoBind:!0})})[0]),I=h(C).useRef(!1),D=iU(),z=(0,_.action)(e=>{if(D)return;I.current=!1;let t=e.target.findAncestor(".elements-container"),n=e.target.findAncestor("Transformer"),r=e.target.findAncestor(".page-abs-container");if(t||n||r)return;let i=e.target.getStage()?.getPointerPosition();i.x-=e.target.getStage()?.x(),i.y-=e.target.getStage()?.y(),i&&(L.visible=!0,L.x1=i.x,L.y1=i.y,L.x2=i.x,L.y2=i.y,e.target.getStage()?.getPointersPositions().length>=2&&(L.visible=!1))});uh({stageRef:w,containerRef:S,viewportSize:d}),h(C).useEffect(()=>{let t=(0,_.action)(e=>{if(!L.visible)return;w.current?.setPointersPositions(e);let t=w.current?.getPointerPosition();t?(t.x-=w.current?.x(),t.y-=w.current?.y()):t={x:L.x2,y:L.y2},L.x2=t.x,L.y2=t.y}),n=(0,_.action)(()=>{if(!L.visible||!w.current)return;let t=w.current.findOne(".selection"),n=t?t.getClientRect():{width:0,height:0,x:0,y:0};if(n.width&&n.height){let t=[];w.current.find(".element").forEach(r=>{let i=r.getClientRect(),o=e.getElementById(r.id()),a=o?.draggable,l=o?.selectable;h(M).Util.haveIntersection(n,i)&&a&&l&&t.push(o.top.id)});let r=[...new Set(t)];e.selectElements(r)}L.visible=!1,I.current=!0});return window.addEventListener("mousemove",t),window.addEventListener("touchmove",t),window.addEventListener("mouseup",n),window.addEventListener("touchend",n),()=>{window.removeEventListener("mousemove",t),window.removeEventListener("touchmove",t),window.removeEventListener("mouseup",n),window.removeEventListener("touchend",n)}},[]);let F=h(C).useRef(!1);h(C).useEffect(()=>{let e,t=S.current?.closest(".polotno-workspace-inner"),n=()=>{F.current=!0,clearTimeout(e),e=setTimeout(()=>{F.current=!1},300)};return t.addEventListener("scroll",n),()=>{clearTimeout(e),t.removeEventListener("scroll",n)}},[]);let B=n=>{if(e.activePage!==t&&t.select(),F.current||I.current)return;let r=n.evt.ctrlKey||n.evt.metaKey||n.evt.shiftKey,i=n.target.findAncestor(".elements-container"),o=n.target.findAncestor(".page-abs-container"),a=n.target.findAncestor("Transformer");if(!r&&!i&&!a&&!o){e.selectElements([]);return}let l=n.target.findAncestor(".element",!0),s=e.getElementById(l?.id()),u=s?.top,c=u?.id,d=e.selectedElementsIds.indexOf(c)>=0;c&&r&&!d?e.selectElements(e.selectedElementsIds.concat([c])):c&&r&&d?e.selectElements(e.selectedElementsIds.filter(e=>e!==c)):!c||r||d||e.selectElements([c])};!function(e,t){let n=h(C).useRef(null),r=e=>e.hasName("element")||e.hasName("page-background")||!n.current&&e.hasName("elements-area");function i(t){let n=e.current?.getStage(),i=[],o=[];return n.find(r).forEach(e=>{if(!(t.indexOf(e)>=0)){var n=e.getClientRect({skipShadow:!0,skipStroke:!0});i.push({offset:n.x,node:e,snap:"start"},{offset:n.x+n.width,node:e,snap:"end"},{offset:n.x+n.width/2,node:e,snap:"center"}),o.push({offset:n.y,node:e,snap:"start"},{offset:n.y+n.height,node:e,snap:"end"},{offset:n.y+n.height/2,node:e,snap:"center"})}}),{vertical:i,horizontal:o}}function o(t){let n=e.current?.getLayer(),r=n?.children.find(e=>"line-guides"===e.name());t.forEach(e=>{if("H"===e.orientation){var t=new(h(M)).Line({x:-n.getStage().x(),y:-n.getStage().y(),points:[-6e3,e.lineGuide,6e3,e.lineGuide],stroke:"rgb(0, 161, 255)",strokeWidth:1,name:"guid-line",dash:[4,6]});r?.add(t),n.batchDraw()}else if("V"===e.orientation){var t=new(h(M)).Line({x:-n.getStage().x(),y:-n.getStage().y(),points:[e.lineGuide,-6e3,e.lineGuide,6e3],stroke:"rgb(0, 161, 255)",strokeWidth:1,name:"guid-line",dash:[4,6]});r?.add(t)}})}let a=e=>{let t=e.target.getLayer().children.find(e=>"line-guides"===e.name());t?.destroyChildren();var n=aH(i(e.target.nodes()),function(e){let t=e.__getNodeRect(),n=az({...t,rotation:h(M).Util.radToDeg(t.rotation)}),r=e.getAbsolutePosition();return{vertical:[{guide:n.x,offset:r.x-n.x,snap:"start",nodes:e.nodes()},{guide:n.x+n.width/2,offset:r.x-n.x-n.width/2,snap:"center",nodes:e.nodes()},{guide:n.x+n.width,offset:r.x-n.x-n.width,snap:"end",nodes:e.nodes()}],horizontal:[{guide:n.y,offset:r.y-n.y,snap:"start",nodes:e.nodes()},{guide:n.y+n.height/2,offset:r.y-n.y-n.height/2,snap:"center",nodes:e.nodes()},{guide:n.y+n.height,offset:r.y-n.y-n.height,snap:"end",nodes:e.nodes()}]}}(e.target));if(!n.length)return;o(n);let r=e.target.getAbsolutePosition();e.target.nodes().map(e=>e.getAbsolutePosition());let a={...r};n.forEach(e=>{switch(e.snap){case"start":case"center":case"end":switch(e.orientation){case"V":a.x=e.lineGuide+e.offset;break;case"H":a.y=e.lineGuide+e.offset}}});let l=a.x-r.x,s=a.y-r.y;e.evt.ctrlKey||e.evt.metaKey||e.target.nodes().forEach(e=>{let t=e.getAbsolutePosition();e.setAbsolutePosition({x:t.x+l,y:t.y+s})})},l=(t,n,r)=>{let a=e.current,l=a.getLayer().children.find(e=>"line-guides"===e.name());if(l?.destroyChildren(),"rotater"===a.getActiveAnchor())return n;let s=aG[a.getActiveAnchor()],u=a.findOne(`.${s}`)?.getAbsolutePosition();if(!u)return n;let c={x:t.x-u.x,y:t.y-u.y},d=function(e,t){let n=aU(e,t)/aU(t,t);return{x:n*t.x,y:n*t.y}}({x:n.x-t.x,y:n.y-t.y},c),h={x:t.x+d.x,y:t.y+d.y};var f=aH(i(a.nodes()),{vertical:[{guide:h.x,offset:0,snap:"start",nodes:a.nodes()}],horizontal:[{guide:h.y,offset:0,snap:"start",nodes:a.nodes()}]});if(!f.length||(o(f),r.ctrlKey||r.metaKey))return n;let p=[];if(f.forEach(e=>{let t=function(e,t,n){if("V"===n.orientation){let r=n.lineGuide;if(1e-4>Math.abs(t.x-e.x))return null;let i=(t.y-e.y)/(t.x-e.x),o=e.y-i*e.x;return{x:r,y:i*r+o}}{let r=n.lineGuide;if(1e-4>Math.abs(t.y-e.y))return null;let i=(t.y-e.y)/(t.x-e.x);return{x:(r-e.y)/i+e.x,y:r}}}(h,u,{orientation:e.orientation,lineGuide:e.lineGuide});t&&p.push(t)}),p.length>0){let e=p[0],t=Math.sqrt(Math.pow(h.x-e.x,2)+Math.pow(h.y-e.y,2));if(p.forEach(n=>{let r=Math.sqrt(Math.pow(h.x-n.x,2)+Math.pow(h.y-n.y,2));r<t&&(t=r,e=n)}),t<10)return e}return h},s=e=>{if(!e.target)return;let t=e.target.getLayer(),n=t.children.find(e=>"line-guides"===e.name());n?.destroyChildren(),t.batchDraw()};h(C).useEffect(()=>{e.current&&(e.current.anchorDragBoundFunc(l),e.current.on("dragstart",e=>{setTimeout(()=>{if(0===h(M).DD._dragElements.size)return;let e=[...h(M).DD._dragElements.entries()],t=e.find(([e,t])=>t.node instanceof h(M).Transformer);t&&(e.splice(e.indexOf(t),1),e.unshift(t),h(M).DD._dragElements.clear(),e.forEach(([e,t])=>{h(M).DD._dragElements.set(e,t)}))})}),e.current.on("dragmove",a),e.current.on("dragend",s),e.current.on("transformend",s),e.current.on("transform",t=>{t.evt.ctrlKey||t.evt.metaKey?e.current?.rotationSnapTolerance(0):e.current?.rotationSnapTolerance(5)}))},[])}(x,0);let H=e.activePage===t,V=s?.PageControls,U=s?.Tooltip,G=s?.ContextMenu,q=1/e.scale,W=0/e.scale;return(0,b.jsxs)("div",{ref:S,onDragOver:e=>e.preventDefault(),onDrop:n=>{if(n.preventDefault(),!w.current)return;w.current.setPointersPositions(n);let r=w.current.findOne(".elements-container").getRelativePointerPosition(),i=w.current.getPointerPosition(),o=[...new Set(w.current.getAllIntersections(i).map(e=>e.findAncestor(".element",!0)).filter(Boolean).reverse())].map(t=>e.getElementById(t.id())),a=o[0];uc&&(uc(r,a,{elements:o,page:t}),uc=null)},style:{position:"relative",width:n+"px",height:r+"px",overflow:"hidden"},className:"polotno-page-container"+(H?" active-page":""),children:[(0,b.jsx)(r3,{ref:w,width:Math.min(n,d.width+200),height:Math.min(d.height+200,r),onClick:B,onTap:B,onContextMenu:t=>{t.evt.preventDefault();let n=t.target.findAncestor(".element",!0),r=e.getElementById(n?.id()),i=r?.top,o=i?.id;o?e.selectedElementsIds.indexOf(o)>=0||e.selectElements([o]):e.selectElements([]),T.open({x:t.evt.clientX,y:t.evt.clientY})},onMouseDown:z,onMouseMove:n=>{if(!n.evt.altKey&&E){k(null);return}if(!n.evt.altKey)return;let r=n.target.findAncestor(".element",!0),i=r?.id();if(!e.selectedElements[0]||e.selectedElementsIds.includes(i))return;let o=aF(e.selectedShapes),a=az(i?e.getElementById(i):{x:0,y:0,width:t.computedWidth,height:t.computedHeight,rotation:0}),l=[];o.minX>a.maxX&&l.push({distance:o.minX-a.maxX,box1:o,box2:a,points:[{x:o.minX,y:o.minY+o.height/2},{x:a.maxX,y:o.minY+o.height/2},{x:a.maxX,y:a.minY+a.height/2}]}),o.maxX<a.minX&&l.push({distance:a.minX-o.maxX,box1:o,box2:a,points:[{x:o.maxX,y:o.minY+o.height/2},{x:a.minX,y:o.minY+o.height/2},{x:a.minX,y:a.minY+a.height/2}]}),o.minY>a.maxY&&l.push({box1:o,box2:a,distance:o.minY-a.maxY,points:[{x:o.minX+o.width/2,y:o.minY},{x:o.minX+o.width/2,y:a.maxY},{x:a.minX+a.width/2,y:a.maxY}]}),o.maxY<a.minY&&l.push({box1:o,box2:a,distance:a.minY-o.maxY,points:[{x:o.minX+o.width/2,y:o.maxY},{x:o.minX+o.width/2,y:a.minY},{x:a.minX+a.width/2,y:a.minY}]}),o.minX>=a.minX&&o.maxX<=a.maxX&&o.minY>=a.minY&&o.maxY<=a.maxY&&(l.push({distance:o.minX-a.minX,box1:o,box2:a,points:[{x:o.minX,y:o.minY+o.height/2},{x:a.minX,y:o.minY+o.height/2},{x:a.minX,y:a.minY+a.height/2}]}),l.push({distance:a.maxX-o.maxX,box1:o,box2:a,points:[{x:o.maxX,y:o.minY+o.height/2},{x:a.maxX,y:o.minY+o.height/2},{x:a.maxX,y:a.minY+a.height/2}]}),l.push({box1:o,box2:a,distance:o.minY-a.minY,points:[{x:o.minX+o.width/2,y:o.minY},{x:o.minX+o.width/2,y:a.minY},{x:a.minX+a.width/2,y:a.minY}]}),l.push({box1:o,box2:a,distance:a.maxY-o.maxY,points:[{x:o.minX+o.width/2,y:o.maxY},{x:o.minX+o.width/2,y:a.maxY},{x:a.minX+a.width/2,y:a.maxY}]})),JSON.stringify(E)!==JSON.stringify(l)&&k(l)},onDragStart:t=>{let n=t.target.findAncestor(".element",!0);if(n){let r=e.getElementById(n?.id()),i=r?.top,o=i?.id;!(e.selectedElementsIds.indexOf(o)>=0)&&o&&(e.selectElements([o]),t.target.stopDrag(),t.target.startDrag(t),x.current?.startDrag(t))}E&&k(null)},pageId:t.id,style:{position:"absolute",overflow:"hidden",top:0,left:0},children:(0,b.jsxs)("Layer",{children:[(0,b.jsx)(un,{width:n,height:r,fill:o}),(0,b.jsx)(rK,{x:v,y:y,scaleX:e.scale,scaleY:e.scale,name:"page-container",children:(0,b.jsxs)(rK,{name:"page-container-2",children:[(0,b.jsx)(rK,{name:"page-background-group",x:p,y:p,children:(0,b.jsx)(uo,{x:-t.bleed,y:-t.bleed,width:t.computedWidth+2*t.bleed,height:t.computedHeight+2*t.bleed,background:t.background,name:"page-background",preventDefault:!1,scale:e.scale})}),(0,b.jsxs)(rK,{x:p,y:p,name:"elements-container",listening:!e.isPlaying,children:[(0,b.jsx)(rX,{name:"elements-area",width:t.computedWidth,height:t.computedHeight,listening:!1}),(0,b.jsx)(us,{elements:t.children,store:e})]}),(0,b.jsx)(rX,{stroke:u,name:"bleed",strokeWidth:t.bleed,x:t.bleed/2,y:t.bleed/2,width:t.computedWidth+t.bleed,height:t.computedHeight+t.bleed,listening:!1,visible:t.bleed>0&&e.bleedVisible,hideInExport:!0}),lU()===ug&&(0,b.jsx)(um,{name:"hit-detection",x:-q/2-W,y:-q/2-W,width:g+q+2*W,height:m+q+2*W})]})}),(0,b.jsx)(rZ,{name:"workspace-background",points:[0,0,n,0,n,r,0,r,0,0,v,y,v,r-y,n-v,r-y,n-v,y,v,y],listening:!1,closed:!0,fill:o}),(0,b.jsx)(rK,{x:v,y:y,scaleX:e.scale,scaleY:e.scale,children:(0,b.jsx)(rX,{name:"page-highlight",hideInExport:!0,x:-q/2-W,y:-q/2-W,width:g+q+2*W,height:m+q+2*W,stroke:H&&e.pages.length>1?l:a,strokeWidth:2,listening:!1,strokeScaleEnabled:!1})}),(0,b.jsxs)(rK,{x:v+p*e.scale,y:y+p*e.scale,scaleX:e.scale,scaleY:e.scale,name:"page-abs-container",children:[(0,b.jsx)(r1,{ref:x,onDragStart:n=>{n.evt?.altKey&&c&&e.selectedElements.forEach(e=>{let n=e.clone({},{skipSelect:!0}),r=t.children.indexOf(e);t.setElementZIndex(n.id,r)}),e.history.startTransaction()},onDragEnd:()=>{e.history.endTransaction()},onTransformStart:()=>{e.history.startTransaction(),k(null)},boundBoxFunc:(e,t)=>{let n=1>Math.abs(t.width)||1>Math.abs(t.height),r=1>Math.abs(e.width)||1>Math.abs(e.height);return n&&!r?e:t},onTransform:e=>{let t=x.current.nodes(),n=t[t.length-1];if(e.target!==n)return;let r=x.current?.__getNodeRect();P({anchor:x.current?.getActiveAnchor(),x:r.x,y:r.y,rotation:r.rotation,width:r.width,height:r.height})},onTransformEnd:t=>{P({}),e.history.endTransaction()},visible:!e.isPlaying}),E&&E.map(({points:t,distance:n,box1:r,box2:i},o)=>(0,b.jsxs)(rK,{name:"distances-container",hideInExport:!0,listening:!1,children:[(0,b.jsx)(rX,{...r,stroke:"rgb(0, 161, 255)",strokeWidth:1,strokeScaleEnabled:!1}),(0,b.jsx)(rX,{...i,stroke:"rgb(0, 161, 255)",strokeWidth:1,strokeScaleEnabled:!1}),(0,b.jsx)(rZ,{points:[t[0].x,t[0].y,t[1].x,t[1].y],stroke:"rgb(0, 161, 255)",strokeWidth:1,strokeScaleEnabled:!1}),(0,b.jsx)(rZ,{points:[t[1].x,t[1].y,t[2].x,t[2].y],stroke:"rgb(0, 161, 255)",strokeWidth:1,strokeScaleEnabled:!1}),(0,b.jsxs)(rY,{x:(t[0].x+t[1].x)/2,y:(t[0].y+t[1].y)/2,offsetY:-10,scaleX:1/e.scale,scaleY:1/e.scale,children:[(0,b.jsx)("Tag",{cornerRadius:5,fill:"rgb(0, 161, 255)",pointerDirection:"down"}),(0,b.jsx)(rJ,{align:"center",verticalAlign:"middle",fill:"white",padding:5,text:l4({unit:e.unit,dpi:e.dpi,px:n})})]})]},o)),t._rendering&&(0,b.jsxs)(rK,{children:[(0,b.jsx)(rX,{width:g,height:m,fill:"rgba(255,255,255,0.9)"}),(0,b.jsx)(rJ,{text:"Rendering...",fontSize:60,width:g,height:m,align:"center",verticalAlign:"middle"})]}),U&&(0,b.jsx)(U,{components:s,store:e,page:t,stageRef:w}),G&&(0,b.jsx)(r5,{children:(0,b.jsx)(G,{components:s,store:e,...T.props})})]}),(0,b.jsx)(ul,{...O,store:e}),(0,b.jsx)(ua,{selection:L}),lG()&&(0,b.jsx)(rJ,{text:"Powered by polotno.com",fontSize:14,fill:"rgba(0,0,0,0.6)",x:n-170,y:r-18,onMouseEnter:e=>{e.target.getStage().container().style.cursor="pointer"},onMouseLeave:e=>{e.target.getStage().container().style.cursor=""},onTouchStart:e=>{e.cancelBubble=!0},onMouseDown:e=>{e.cancelBubble=!0},onClick:()=>{window.open("https://polotno.com")},onTap:()=>{window.open("https://polotno.com")}}),(0,b.jsx)(rK,{name:"line-guides"})]})}),(i??!0)&&V&&(0,b.jsx)(V,{store:e,page:t,xPadding:v,yPadding:y})]})}),C=v("8NFma");let uy=aS("div",h(C).forwardRef)`
+    `}),n.innerHTML=i,document.getElementsByTagName("head")[0].appendChild(n),iL[e.fontFamily]=!0}(n)):function(e){if(ij[e])return;let t=iR(e),n=document.createElement("link");n.type="text/css",n.href=t,n.rel="stylesheet",document.getElementsByTagName("head")[0].appendChild(n),ij[e]=!0}(t),Promise.all(r.map(e=>iA(t,e.fontStyle,e.fontWeight)))},validate:e=>sR.validate(e,[{path:"",type:sR}]).map(e=>({path:"store"+e.context.map(e=>e.path).join("."),message:e.message}))})),sL=(0,iq.types).model("Node",{id:iq.types.identifier,type:"none",name:"",opacity:1,custom:(0,iq.types).frozen(),visible:!0,selectable:!0,removable:!0,alwaysOnTop:!1,showInExport:!0}).preProcessSnapshot(e=>{for(var t in e)null===e[t]&&(e[t]=void 0);return e}).postProcessSnapshot(e=>{let t={...e},n={};for(var r in t)"_"!==r[0]&&(n[r]=e[r]);return n}).views(e=>({get locked(){return!e.draggable&&!e.contentEditable&&!e.styleEditable&&!e.resizable},get page(){return(0,iq.getParentOfType)(e,sA)},get store(){return(0,iq.getParentOfType)(e,sR)},get top(){let t=e;for(;;){if(!(0,iq.hasParentOfType)(t,s0))return t;t=(0,iq.getParentOfType)(t,s0)}},get parent(){if((0,iq.hasParentOfType)(e,s0))return(0,iq.getParentOfType)(e,s0);if((0,iq.hasParentOfType)(e,sA))return(0,iq.getParentOfType)(e,sA);if((0,iq.hasParentOfType)(e,sR))return(0,iq.getParentOfType)(e,sR);return null},get zIndex(){return e.parent.children.indexOf(e)}})).actions(e=>({toJSON:()=>({...(0,iq.getSnapshot)(e)})})).actions(e=>({clone(t={},{skipSelect:n=!1}={}){let r=JSON.parse(JSON.stringify(e.toJSON()));return t.id=t.id||lw(10),sZ(r,e=>{e.id=lw(10)}),Object.assign(r,t),e.page.addElement(r,{skipSelect:n})},set(t){Object.assign(e,t)},moveUp(){e.page.moveElementsUp([e.id])},moveTop(){e.page.moveElementsTop([e.id])},moveDown(){e.page.moveElementsDown([e.id])},moveBottom(){e.page.moveElementsBottom([e.id])},setZIndex(t){e.parent.setElementZIndex(e.id,t)},beforeDestroy(){}}));var iq=v("58B0H");let sM={right:{from:{x:-200},to:{x:0}},left:{from:{x:200},to:{x:0}},up:{from:{y:200},to:{y:0}},down:{from:{y:-200},to:{y:0}},"bottom-right":{from:{x:-200,y:-200},to:{x:0,y:0}},"bottom-left":{from:{x:200,y:-200},to:{x:0,y:0}},"top-right":{from:{x:-200,y:200},to:{x:0,y:0}},"top-left":{from:{x:200,y:200},to:{x:0,y:0}}},sI={right:{cropX:-1},left:{cropX:1},up:{cropY:1},down:{cropY:-1}},sD={fade:({dTime:e,element:t,animation:n})=>{let r=e/n.duration;return"enter"===n.type?{opacity:r*t.opacity}:{opacity:(1-r)*t.opacity}},rotate:({dTime:e,element:t,animation:n})=>{let r=n.duration;return function(e,t){let n=function(e){let t=aI(e.rotation||0);return{x:e.x+e.width/2*Math.cos(t)+e.height/2*Math.sin(-t),y:e.y+e.height/2*Math.cos(t)+e.width/2*Math.sin(t)}}(e);return function(e,t,n){let r=aI(t),i=n.x+(e.x-n.x)*Math.cos(r)-(e.y-n.y)*Math.sin(r),o=n.y+(e.x-n.x)*Math.sin(r)+(e.y-n.y)*Math.cos(r);return{...e,rotation:e.rotation+t,x:i,y:o}}(e,t,n)}({x:t.x,y:t.y,width:t.width,height:t.height,rotation:t.rotation},e/r*360)},blink:({dTime:e,element:t,animation:n})=>{let r=n.duration,i=e%r/(r/2);return{opacity:t.opacity*(i<=1?i:2-i)}},bounce:({dTime:e,element:t,animation:n})=>{let r=n.duration,i=n.data.strength??1,o={},a={x:t.x+t.width/3*i,y:t.y+t.height/3*i,width:t.width/3*i,height:t.height/3*i,fontSize:t.fontSize/3*i},l={x:t.x,y:t.y,width:t.width,height:t.height,fontSize:t.fontSize},s=e%r/(r/2),u=s<=1?s:2-s;for(let e in a){let t=a[e],n=l[e]-t;o[e]=t+u*n}return o},move:({dTime:e,element:t,animation:n})=>{let r=sM[n.data.direction]||sM.right,i=n.data.strength??1,o={};for(var a in r.from){let l=r.from[a],s=r.to[a];"exit"===n.type&&(l=r.to[a],s=-r.from[a]),l*=i,s*=i;let u=t[a]+l,c=t[a]+s-u;o[a]=u+e/n.duration*c}return o},zoom:({dTime:e,element:t,animation:n})=>{let r={},i=n.data.direction||"in",o=1+(("in"===i?3/4:5/4)-1)*(n.data.strength??1),a=t.rotation*Math.PI/180,l=Math.cos(a),s=Math.sin(a),u=t.width*(1-o),c=t.height*(1-o),d={x:t.x+(u*l-c*s)/2,y:t.y+(u*s+c*l)/2,width:t.width*o,height:t.height*o,fontSize:t.fontSize*o},h={x:t.x,y:t.y,width:t.width,height:t.height,fontSize:t.fontSize};for(var f in d){let t=d[f],i=h[f];if("exit"===n.type){let e=t;t=i,i=e}let o=i-t;r[f]=t+e/n.duration*o}return r},cameraZoom:({dTime:e,element:t,animation:n})=>{let r,i,o={},a=sI[n.data.direction||"right"]||sI.right,l=n.data.movementStrength??.1,s=n.data.shakeStrength??.015,u=n.data.zoomStrength??.6,c=e/n.duration,d=s*(1-c),h=Math.sin(12*c)*d*.7+Math.sin(8*c)*d*.3;"exit"===n.type&&(u=Math.min(u,1-Math.max(t.cropWidth||1,t.cropHeight||1))),n.type;let f=1-Math.pow(1-c,2),p=t.cropX||0,g=t.cropY||0,m=t.cropWidth||1,v=t.cropHeight||1,y=0,b=0;return a.cropX&&(y=Math.min(a.cropX>0?1-(p+m):p,Math.abs(l))*a.cropX),a.cropY&&(b=Math.min(a.cropY>0?1-(g+v):g,Math.abs(l))*a.cropY),"enter"===n.type?(r=a.cropX?p+y*(1-f):p,i=a.cropY?g+b*(1-f):g):(r=a.cropX?p+y*f:p,i=a.cropY?g+b*f:g),o.cropX=Math.max(0,Math.min(1-m,r+h*m)),o.cropY=Math.max(0,Math.min(1-v,i+h*v)),o.cropWidth=m,o.cropHeight=v,o}},sz=({element:e,dTime:t,animation:n})=>{let r=sD[n.name];return r?r({element:e,dTime:t,animation:n}):(console.error("Can not find animation type: "+n.name),{})};var _=v("2SBKn");let sF=(0,iq.types).model("Animation",{delay:0,duration:500,enabled:!0,type:(0,iq.types).enumeration("Type",["enter","exit","loop"]),name:"none",data:(0,iq.types).frozen({})}),sB=(e,t)=>{let n={};for(let r in t)if("number"==typeof e[r]&&"number"==typeof t[r]){let i=t[r]-e[r];0!==i&&(n[r]=i)}return n},sH=(0,iq.types).model("ShapeFilter",{intensity:1}),sV=["temperature","contrast","highlights","shadows","white","black","saturation","vibrance"],sU=sL.named("Shape").props({x:0,y:0,width:100,height:100,rotation:0,opacity:1,animations:(0,iq.types).array(sF),blurEnabled:!1,blurRadius:10,brightnessEnabled:!1,brightness:0,sepiaEnabled:!1,grayscaleEnabled:!1,filters:(0,iq.types).map(sH),shadowEnabled:!1,shadowBlur:5,shadowOffsetX:0,shadowOffsetY:0,shadowColor:"black",shadowOpacity:1,visible:!0,draggable:!0,resizable:!0,selectable:!0,contentEditable:!0,styleEditable:!0,alwaysOnTop:!1,showInExport:!0}).preProcessSnapshot(e=>{let t={...e,x:e.x||0,y:e.y||0,filters:Array.isArray(e.filters)?{}:e.filters};return"width"in e&&(t.width=t.width||1),"height"in e&&(t.height=t.height||1),e.locked&&(t.draggable=!1,t.contentEditable=!1,t.styleEditable=!1,t.resizable=!1,t.removable=!1),t}).views(e=>{let t=(0,_.observable)({x:e.x,y:e.y,width:e.width,height:e.height,rotation:e.rotation,opacity:e.opacity,color:e.color,fontSize:e.fontSize}),n=(0,_.action)(e=>{Object.assign(t,e)}),r=(0,_.action)(e=>{for(let n in e)"number"==typeof t[n]&&(t[n]=t[n]+e[n])});return{get a(){let{currentTime:i}=e.store;if(n({x:e.x,y:e.y,width:e.width,height:e.height,rotation:e.rotation,opacity:e.opacity,color:e.color,fontSize:e.fontSize,cropX:e.cropX,cropY:e.cropY,cropWidth:e.cropWidth,cropHeight:e.cropHeight}),0===i)return t;let o=i-e.page.startTime;if(o>e.page.duration||o<0)return t;let a=e.store.animatedElementsIds;if(a.length&&!a.includes(e.id))return t;let l=e.animations.find(e=>"enter"===e.type),s=l?.enabled&&o<l.delay;s&&n({opacity:0});let u=l?.enabled&&o>=l.delay&&o<=l.delay+l.duration;if(u){let t=o-l.delay,n=sz({element:e,animation:l,dTime:t});r(sB(e,n))}let c=e.animations.find(e=>"exit"===e.type);if(!s&&!u&&c?.enabled&&o>=e.page.duration-c.duration-c.delay&&o<=e.page.duration-c.delay){let t=o-(e.page.duration-c.duration-c.delay),n=sz({element:e,animation:c,dTime:t});r(sB(e,n))}c?.enabled&&o>=e.page.duration-c.delay&&n({opacity:0});let d=e.animations.find(e=>"loop"===e.type);if(d?.enabled){let t=sz({element:e,animation:d,dTime:o});r(sB(e,t))}return t},animated:t=>e.a[t]}}).actions(e=>({setAnimation(t,n){let r=e.animations.find(e=>e.type===t);r?Object.assign(r,n):e.animations.push({type:t,...n})},setFilter(t,n){sV.includes(t)||e.filters.forEach((t,n)=>{sV.includes(n.toString())||e.filters.delete(n.toString())}),null==n?e.filters.delete(t):e.filters.set(t,{intensity:n})}}));var iq=v("58B0H");let sG=sU.named("Text").props({type:"text",text:"",placeholder:"",fontSize:14,fontFamily:"Roboto",fontStyle:"normal",fontWeight:"normal",textDecoration:"",fill:"black",align:"center",width:100,height:0,verticalAlign:"top",strokeWidth:0,stroke:"black",lineHeight:(0,iq.types).optional((0,iq.types).union(iq.types.number,iq.types.string),1.2),letterSpacing:0,_editModeEnabled:!1,backgroundEnabled:!1,backgroundColor:"#7ED321",backgroundOpacity:1,backgroundCornerRadius:.5,backgroundPadding:.5}).preProcessSnapshot(e=>({...e})).actions(e=>({toggleEditMode(t){e._editModeEnabled=t??!e._editModeEnabled,e._editModeEnabled?e.store.history.startTransaction():e.store.history.endTransaction()}})),sq=sU.named("Image").props({type:"image",width:100,height:100,src:"",cropX:0,cropY:0,cropWidth:1,cropHeight:1,cornerRadius:0,flipX:!1,flipY:!1,clipSrc:"",borderColor:"black",borderSize:0,keepRatio:!1,stretchEnabled:!1,_cropModeEnabled:!1}).actions(e=>({toggleCropMode(t){e._cropModeEnabled=t??!e._cropModeEnabled,e._cropModeEnabled?e.store.history.startTransaction():e.store.history.endTransaction()},beforeDestroy(){e._cropModeEnabled&&e.store.history.endTransaction()}})),sW=sq.named("Video").props({type:"video",duration:0,startTime:0,endTime:1,volume:1});var iq=v("58B0H");let s$=sU.named("Line").props({type:"line",width:400,height:10,color:"black",dash:(0,iq.types).array(iq.types.number),startHead:"",endHead:""}).actions(e=>({}));var iq=v("58B0H");let sK=sU.named("SVG").props({type:"svg",src:"",maskSrc:"",cropX:0,cropY:0,cropWidth:1,cropHeight:1,keepRatio:!0,stretchEnabled:!0,flipX:!1,flipY:!1,width:100,height:100,borderColor:"black",borderSize:0,cornerRadius:0,colorsReplace:(0,iq.types).map(iq.types.string)}).preProcessSnapshot(e=>({...e,src:e.src||e.svgSource,colorsReplace:Array.isArray(e.colorsReplace)?{}:e.colorsReplace})).actions(e=>({replaceColor(t,n){e.colorsReplace.set(t,n)}}));var iq=v("58B0H");let sY=sU.named("Figure").props({type:"figure",subType:"rect",fill:"rgb(0, 161, 255)",dash:(0,iq.types).array(iq.types.number),strokeWidth:0,stroke:"rgba(98, 197, 255, 1)",cornerRadius:0}),sX=sq.named("Gif").props({type:"gif",duration:0,keepRatio:!0}),sZ=(e,t)=>{if(e.children)for(let n of e.children){if(!0===t(n))break;sZ(n,t)}},sQ=[...Array(20)].map((e,t)=>(0,iq.types).late(()=>s1[t])),sJ=(0,iq.types).union({dispatcher:e=>{let t=s2[e.type];if(!t)throw Error(`Unknown element type: "${e.type}"`);return t}},sK,sG,sq,s$,sW,sY,sX,(0,iq.types).late(()=>s0),...sQ),s0=sL.named("Group").props({type:"group",children:(0,iq.types).array(sJ)}).views(e=>({get draggable(){let t=!0;return sZ(e,e=>{e.draggable||(t=!1)}),t},get resizable(){let t=!0;return sZ(e,e=>{e.resizable||(t=!1)}),t},get contentEditable(){let t=!0;return sZ(e,e=>{e.contentEditable||(t=!1)}),t},get styleEditable(){let t=!0;return sZ(e,e=>{e.styleEditable||(t=!1)}),t},get locked(){let t=!0;return sZ(e,e=>{e.locked||(t=!1)}),t}})).actions(e=>({set({draggable:t,contentEditable:n,styleEditable:r,resizable:i,...o}){void 0!==t&&sZ(e,e=>{e.set({draggable:t})}),void 0!==n&&sZ(e,e=>{e.set({contentEditable:n})}),void 0!==r&&sZ(e,e=>{e.set({styleEditable:r})}),void 0!==i&&sZ(e,e=>{e.set({resizable:i})}),Object.assign(e,o)},addElement(t,{skipSelect:n=!1}={}){let r=s2[t.type];if(!r){console.error("Can not find model with type "+t.type);return}t.children&&t.children.forEach(e=>{e.id=lw(10)});let i=r.create({id:lw(10),...t});return e.children.push(i),i.selectable&&!n&&e.store.selectElements([i.id]),i},setElementZIndex(t,n){let r=e.children.find(e=>e.id===t);r&&((0,iq.detach)(r),e.children.remove(r),e.children.splice(n,0,r))}})),s1=[],s2={svg:sK,text:sG,image:sq,group:s0,line:s$,video:sW,figure:sY,gif:sX},s3={text:i2,image:oE,svg:oE,line:aY,video:a9,figure:la,group:R(e=>{let{element:t,store:n}=e,{children:r}=t,i=t.selectable||"admin"===n.role;return(0,b.jsx)(rK,{opacity:t.opacity,listening:i,hideInExport:!t.showInExport,children:r.map(t=>(0,C.createElement)(s6,{...e,key:t.id,store:n,element:t}))})}),gif:ly},s4=e=>{let[t,n]=h(C).useState(null);return h(C).useEffect(()=>{let t=e.page.id;n(h(M).stages.find(e=>e.getAttr("pageId")===t))},[e.id]),t},s8=(e,t)=>{let n=[];sZ(e,e=>{"group"!==e.type&&n.push(e.a)});let r=[];n.forEach(e=>{let t=[{x:0,y:0},{x:0+e.width,y:0},{x:0+e.width,y:0+e.height},{x:0,y:0+e.height}],n=new(h(M)).Transform;n.translate(e.x,e.y),n.rotate(h(M).Util.degToRad(e.rotation)),t.forEach(e=>{let t=n.point(e);r.push(t)})});let i=new(h(M)).Transform;i.rotate(-h(M).Util.degToRad(t));let o=1/0,a=1/0,l=-1/0,s=-1/0;r.forEach(e=>{let t=i.point(e);o=Math.min(o,t.x),a=Math.min(a,t.y),l=Math.max(l,t.x),s=Math.max(s,t.y)}),i.invert();let u=i.point({x:o,y:a});return{x:u.x,y:u.y,width:l-o,height:s-a,rotation:t}},s6=R(e=>{let{element:t,store:n}=e,[r,i]=h(C).useState(!1),o=n.selectedElements.indexOf(t)>=0&&t.selectable,a="group"===t.parent.type,l=s4(t),s=l?.findOne("Transformer");h(C).useEffect(()=>{l&&(l.on("mouseover",e=>{let r=e.target.findAncestor(".element",!0),o=n.getElementById(r?.id()),a=o?.top;i(a?.id===t.id)}),l.on("mouseleave",e=>{i(!1)}))},[l]);let u=s3[e.element.type];return("text"===e.element.type&&iM.htmlRenderEnabled&&(u=aM),e.element.visible)?u?(0,b.jsxs)(h(C).Fragment,{children:[(0,b.jsx)(u,{...e}),(r||o)&&!a&&(0,b.jsx)(lx,{element:"group"===t.type?{a:s8(t,s?.rotation()||0)}:t})]}):(console.error("Can not find component for "+e.element.type),null):null}),s5=h(M).DD._drag;window.removeEventListener("mousemove",s5),h(M).DD._drag=function(e){(0,_.runInAction)(()=>{s5.call(this,e)})},window.addEventListener("mousemove",h(M).DD._drag);let s9=new(h(M)).Group;s9.add(new(h(M)).Rect({width:20,height:20,fill:"white"})),s9.add(new(h(M)).Path({scaleX:20/24,scaleY:20/24,data:"M4.98313549,11.0001422 C5.49589839,10.9914935 5.92501998,11.3703506 5.99116425,11.8666444 L5.99985778,11.9831355 L6.00348884,12.2068855 C6.11245031,15.4321748 8.76323537,17.9999971 11.9999971,17.9999971 C12.1869612,17.9999971 12.3726725,17.9914753 12.5567465,17.9745765 L12.2928932,17.7071068 C11.9023689,17.3165825 11.9023689,16.6834175 12.2928932,16.2928932 C12.6834175,15.9023689 13.3165825,15.9023689 13.7071068,16.2928932 L15.7071068,18.2928932 C16.0976311,18.6834175 16.0976311,19.3165825 15.7071068,19.7071068 L13.7071068,21.7071068 C13.3165825,22.0976311 12.6834175,22.0976311 12.2928932,21.7071068 C11.9023689,21.3165825 11.9023689,20.6834175 12.2928932,20.2928932 L12.6111505,19.9769552 C12.4086045,19.9922816 12.2047796,19.9999971 11.9999971,19.9999971 C7.7687005,19.9999971 4.28886152,16.7094374 4.01666425,12.5105203 L4.00420123,12.2575143 L4.00014222,12.0168645 C3.9908282,11.4646583 4.43092928,11.0094562 4.98313549,11.0001422 Z M11.7071068,2.29289322 C12.0675907,2.65337718 12.0953203,3.22060824 11.7902954,3.61289944 L11.7071068,3.70710678 L11.3891629,4.0230186 C11.5916051,4.00770767 11.7953244,4 12,4 C16.418278,4 20,7.581722 20,12 C20,12.5522847 19.5522847,13 19,13 C18.4477153,13 18,12.5522847 18,12 C18,8.6862915 15.3137085,6 12,6 C11.8129339,6 11.6271216,6.00853145 11.4429483,6.02544919 L11.7071068,6.29289322 C12.0976311,6.68341751 12.0976311,7.31658249 11.7071068,7.70710678 C11.3466228,8.06759074 10.7793918,8.09532028 10.3871006,7.79029539 L10.2928932,7.70710678 L8.29289322,5.70710678 C7.93240926,5.34662282 7.90467972,4.77939176 8.20970461,4.38710056 L8.29289322,4.29289322 L10.2928932,2.29289322 C10.6834175,1.90236893 11.3165825,1.90236893 11.7071068,2.29289322 Z",fill:"black"}));let s7=s9.toCanvas({pixelRatio:2,width:20,height:20}),ue={enabledAnchors:["top-left","top-center","top-right","middle-left","bottom-left","bottom-right","bottom-center","middle-right"],borderEnabled:!0,rotateEnabled:!0,rotationSnaps:[0,45,90,135,180,225,270,315],ignoreStroke:!0,flipEnabled:!1,anchorStrokeWidth:2,borderStrokeWidth:2,rotateAnchorOffset:30,anchorStyleFunc:e=>{e.hasName("rotater")&&e.setAttrs({width:20,height:20,cornerRadius:10,offsetX:10,offsetY:10,fillPatternImage:s7,fillPatternScaleX:.5,fillPatternScaleY:.5,fillPriority:"pattern",fillPatternRepeat:"no-repeat"})}},ut={text:{enabledAnchors:["top-left","top-right","middle-left","bottom-left","bottom-right","middle-right"]},svg:{enabledAnchors:["top-left","top-right","bottom-left","bottom-right"]},gif:{enabledAnchors:["top-left","top-right","bottom-left","bottom-right"]},line:{enabledAnchors:[],borderEnabled:!1,rotateEnabled:!1},image:{enabledAnchors:["top-left","top-right","bottom-left","bottom-right"]},many:{enabledAnchors:["top-left","top-right","bottom-left","bottom-right"]},group:{enabledAnchors:["top-left","top-right","bottom-left","bottom-right"]}},un=e=>(0,b.jsx)(rX,{...e,preventDefault:!1}),ur=({url:e,...t})=>{let[n,r]=h(r4)(e,"anonymous"),i=n?function(e,t,n="scale"){let r,i,o=t.width/t.height;o>=e.width/e.height?(r=e.width,i=e.width/o):(r=e.height*o,i=e.height);let a=0,l=0;return"left-top"===n?(a=0,l=0):"left-middle"===n?(a=0,l=(e.height-i)/2):"left-bottom"===n?(a=0,l=e.height-i):"center-top"===n?(a=(e.width-r)/2,l=0):"center-middle"===n?(a=(e.width-r)/2,l=(e.height-i)/2):"center-bottom"===n?(a=(e.width-r)/2,l=e.height-i):"right-top"===n?(a=e.width-r,l=0):"right-middle"===n?(a=e.width-r,l=(e.height-i)/2):"right-bottom"===n?(a=e.width-r,l=e.height-i):"scale"===n?(a=0,l=0,r=e.width,i=e.height):console.error(Error("Unknown clip position property - "+n)),{cropX:a,cropY:l,cropWidth:r,cropHeight:i}}(n,{width:t.width,height:t.height},"center-middle"):{};return oC(r,e,"page background"),(0,b.jsx)(rQ,{image:n,...t,...i})},ui=e=>{let t=id({fill:e.fill,a:{width:e.width,height:e.height}});return(0,b.jsx)(rX,{...e,...t})},uo=e=>{let{background:t,scale:n,borderColor:r,...i}=e,o=h(C).useMemo(()=>!!h(M).Util.colorToRGBA(t)||is(t),[t]),a=h(C).useMemo(()=>{let e=document.createElement("canvas");e.width=60,e.height=60;let t=e.getContext("2d");return t&&(t.fillStyle="black",t.fillRect(30,0,30,30),t.fillRect(0,30,30,30)),e},[]);return(0,b.jsxs)(h(C).Fragment,{children:[(0,b.jsx)(rX,{fillPatternImage:a,...i,opacity:.1,hideInExport:!0}),o?(0,b.jsx)(ui,{fill:t,...i}):(0,b.jsx)(ur,{url:t,...i})]})},ua=R(({selection:e})=>e.visible?(0,b.jsx)(rX,{name:"selection",x:Math.min(e.x1,e.x2),y:Math.min(e.y1,e.y2),width:Math.abs(e.x1-e.x2),height:Math.abs(e.y1-e.y2),fill:"rgba(0, 161, 255, 0.3)"}):null),ul=R(({x:e,y:t,width:n,height:r,rotation:i,anchor:o,store:a})=>{let l=az({x:e,y:t,width:n,height:r,rotation:h(M).Util.radToDeg(i)});if(void 0===o)return null;let s=(r/2+70)*Math.cos(i-Math.PI/2),u=(r/2+70)*Math.sin(i-Math.PI/2),c=l2({unit:a.unit,dpi:a.dpi,px:n/a.scale,precious:+("px"!==a.unit)})+" x "+l2({unit:a.unit,dpi:a.dpi,px:r/a.scale,precious:+("px"!==a.unit)})+("px"===a.unit?"":" "+a.unit);return(0,b.jsxs)(b.Fragment,{children:[(0,b.jsxs)(rY,{x:(l.minX+l.maxX)/2+s,y:(l.minY+l.maxY)/2+u,offsetX:14,offsetY:14,visible:"rotater"===o,children:[(0,b.jsx)("Tag",{cornerRadius:5,fill:"rgb(0, 161, 255)"}),(0,b.jsx)(rJ,{align:"center",verticalAlign:"middle",fill:"white",padding:8,text:Math.round(h(M).Util.radToDeg(i)).toString()+"°"})]}),(0,b.jsxs)(rY,{x:(l.minX+l.maxX)/2,y:l.maxY+20,visible:"rotater"!==o,children:[(0,b.jsx)("Tag",{cornerRadius:5,fill:"rgb(0, 161, 255)",pointerDirection:"up",pointerHeight:0,pointerWidth:0}),(0,b.jsx)(rJ,{align:"center",verticalAlign:"middle",fill:"white",padding:8,text:c})]})]})}),us=R(({elements:e,store:t})=>{let n=e.filter(e=>e.alwaysOnTop),r=e.filter(e=>!e.alwaysOnTop).concat(n);return(0,b.jsx)(h(C).Fragment,{children:r.map(e=>(0,b.jsx)(s6,{store:t,element:e,onClick:()=>{console.warn("Polotno warning: onClick callback is deprecated. Just stop using it. Polotno will do selection automatically.")}},e.id))})}),uu=({store:e})=>{let[t,n]=h(C).useState(!1),[r,i]=h(C).useState({x:0,y:0});return{open:h(C).useCallback(e=>{n(!0),i(e)},[]),close:h(C).useCallback(()=>{n(!1)},[]),props:{isOpen:t,offset:r,setIsOpen:n}}},uc=null,ud=e=>{uc=e},uh=({stageRef:e,containerRef:t,viewportSize:n})=>{h(C).useEffect(()=>{let n=t.current?.closest(".polotno-workspace-inner");function r(){if(!e.current)return;let r=t.current?.getBoundingClientRect(),i=n?.getBoundingClientRect(),o=Math.max(0,i.left-r.left-100),a=Math.max(0,i.top-r.top-100);e.current.position({x:-o,y:-a}),e.current.container().style.transform=`translate(${o}px, ${a}px)`}return r(),n.addEventListener("scroll",r),()=>{n.removeEventListener("scroll",r)}},[n.width,n.height])},uf=atob("UG9sb3RubyBmcmVlIGxpY2Vuc2UgbGltaXRhdGlvbiBleGNlZWRlZCAtIFBsZWFzZSB1cGdyYWRlIHlvdXIgYWNjb3VudC4="),up=atob("cmVk"),ug=atob("djAuOS4y"),um=e=>(0,b.jsx)(b.Fragment,{children:(0,b.jsxs)(rY,{fill:up,height:200,children:[(0,b.jsx)("Tag",{fill:up}),(0,b.jsx)(rJ,{...e,fill:"white",text:uf,height:void 0,padding:10,fontSize:20})]})});var uv=R(({store:e,page:t,width:n,height:r,pageControlsEnabled:i,backColor:o,pageBorderColor:a,activePageBorderColor:l,components:s,bleedColor:u,altCloneEnabled:c,viewportSize:d})=>{var f;let p=e.bleedVisible?t.bleed:0,g=t.computedWidth+2*p,m=t.computedHeight+2*p,v=(n-g*e.scale)/2,y=(r-m*e.scale)/2,x=h(C).useRef(null),w=h(C).useRef(null),S=h(C).useRef(null),[E,k]=h(C).useState(null),[O,P]=h(C).useState({}),T=uu({store:e}),A=e.selectedElements.find(e=>e._cropModeEnabled),j=e.selectedShapes.filter(e=>!e.resizable).length>0,N=e.selectedShapes.filter(e=>!e.draggable).length>0,R=e.selectedElements.filter(e=>!e.visible).length>0;h(C).useLayoutEffect(()=>{if(!x.current)return;let t=x.current.getStage(),n=e.selectedShapes.map(e=>e._cropModeEnabled?null:t.findOne("#"+e.id)).filter(e=>e),r=1===e.selectedElements.length&&e.selectedElements[0]?.type||"many";ut[r]?(x.current.setAttrs({...ue,...ut[r]}),"svg"!==r&&"image"!==r&&"gif"!==r||e.selectedElements[0].keepRatio||x.current.setAttrs({enabledAnchors:ue.enabledAnchors}),"text"===r&&iM.textVerticalResizeEnabled&&x.current.setAttrs({enabledAnchors:ut.text.enabledAnchors?.concat(["bottom-center"])})):x.current.setAttrs(ue),j&&x.current.enabledAnchors([]),N&&x.current.rotateEnabled(!1),n.find(e=>e?.isDragging())&&n.forEach(e=>{e.isDragging()||e?.startDrag()}),x.current.nodes(n),x.current.getLayer()?.batchDraw()},[e.selectedShapes,A,j,R,N]);let L=(f=()=>({visible:!1,x1:0,y1:0,x2:0,y2:0}),(0,C.useState)(function(){return(0,_.observable)(f(),void 0,{autoBind:!0})})[0]),I=h(C).useRef(!1),D=iU(),z=(0,_.action)(e=>{if(D)return;I.current=!1;let t=e.target.findAncestor(".elements-container"),n=e.target.findAncestor("Transformer"),r=e.target.findAncestor(".page-abs-container");if(t||n||r)return;let i=e.target.getStage()?.getPointerPosition();i.x-=e.target.getStage()?.x(),i.y-=e.target.getStage()?.y(),i&&(L.visible=!0,L.x1=i.x,L.y1=i.y,L.x2=i.x,L.y2=i.y,e.target.getStage()?.getPointersPositions().length>=2&&(L.visible=!1))});uh({stageRef:w,containerRef:S,viewportSize:d}),h(C).useEffect(()=>{let t=(0,_.action)(e=>{if(!L.visible)return;w.current?.setPointersPositions(e);let t=w.current?.getPointerPosition();t?(t.x-=w.current?.x(),t.y-=w.current?.y()):t={x:L.x2,y:L.y2},L.x2=t.x,L.y2=t.y}),n=(0,_.action)(()=>{if(!L.visible||!w.current)return;let t=w.current.findOne(".selection"),n=t?t.getClientRect():{width:0,height:0,x:0,y:0};if(n.width&&n.height){let t=[];w.current.find(".element").forEach(r=>{let i=r.getClientRect(),o=e.getElementById(r.id()),a=o?.draggable,l=o?.selectable;h(M).Util.haveIntersection(n,i)&&a&&l&&t.push(o.top.id)});let r=[...new Set(t)];e.selectElements(r)}L.visible=!1,I.current=!0});return window.addEventListener("mousemove",t),window.addEventListener("touchmove",t),window.addEventListener("mouseup",n),window.addEventListener("touchend",n),()=>{window.removeEventListener("mousemove",t),window.removeEventListener("touchmove",t),window.removeEventListener("mouseup",n),window.removeEventListener("touchend",n)}},[]);let F=h(C).useRef(!1);h(C).useEffect(()=>{let e,t=S.current?.closest(".polotno-workspace-inner"),n=()=>{F.current=!0,clearTimeout(e),e=setTimeout(()=>{F.current=!1},300)};return t.addEventListener("scroll",n),()=>{clearTimeout(e),t.removeEventListener("scroll",n)}},[]);let B=n=>{if(e.activePage!==t&&t.select(),F.current||I.current)return;let r=n.evt.ctrlKey||n.evt.metaKey||n.evt.shiftKey,i=n.target.findAncestor(".elements-container"),o=n.target.findAncestor(".page-abs-container"),a=n.target.findAncestor("Transformer");if(!r&&!i&&!a&&!o){e.selectElements([]);return}let l=n.target.findAncestor(".element",!0),s=e.getElementById(l?.id()),u=s?.top,c=u?.id,d=e.selectedElementsIds.indexOf(c)>=0;c&&r&&!d?e.selectElements(e.selectedElementsIds.concat([c])):c&&r&&d?e.selectElements(e.selectedElementsIds.filter(e=>e!==c)):!c||r||d||e.selectElements([c])};!function(e,t){let n=h(C).useRef(null),r=e=>e.hasName("element")||e.hasName("page-background")||!n.current&&e.hasName("elements-area");function i(t){let n=e.current?.getStage(),i=[],o=[];return n.find(r).forEach(e=>{if(!(t.indexOf(e)>=0)){var n=e.getClientRect({skipShadow:!0,skipStroke:!0});i.push({offset:n.x,node:e,snap:"start"},{offset:n.x+n.width,node:e,snap:"end"},{offset:n.x+n.width/2,node:e,snap:"center"}),o.push({offset:n.y,node:e,snap:"start"},{offset:n.y+n.height,node:e,snap:"end"},{offset:n.y+n.height/2,node:e,snap:"center"})}}),{vertical:i,horizontal:o}}function o(t){let n=e.current?.getLayer(),r=n?.children.find(e=>"line-guides"===e.name());t.forEach(e=>{if("H"===e.orientation){var t=new(h(M)).Line({x:-n.getStage().x(),y:-n.getStage().y(),points:[-6e3,e.lineGuide,6e3,e.lineGuide],stroke:"rgb(0, 161, 255)",strokeWidth:1,name:"guid-line",dash:[4,6]});r?.add(t),n.batchDraw()}else if("V"===e.orientation){var t=new(h(M)).Line({x:-n.getStage().x(),y:-n.getStage().y(),points:[e.lineGuide,-6e3,e.lineGuide,6e3],stroke:"rgb(0, 161, 255)",strokeWidth:1,name:"guid-line",dash:[4,6]});r?.add(t)}})}let a=e=>{let t=e.target.getLayer().children.find(e=>"line-guides"===e.name());t?.destroyChildren();var n=aH(i(e.target.nodes()),function(e){let t=e.__getNodeRect(),n=az({...t,rotation:h(M).Util.radToDeg(t.rotation)}),r=e.getAbsolutePosition();return{vertical:[{guide:n.x,offset:r.x-n.x,snap:"start",nodes:e.nodes()},{guide:n.x+n.width/2,offset:r.x-n.x-n.width/2,snap:"center",nodes:e.nodes()},{guide:n.x+n.width,offset:r.x-n.x-n.width,snap:"end",nodes:e.nodes()}],horizontal:[{guide:n.y,offset:r.y-n.y,snap:"start",nodes:e.nodes()},{guide:n.y+n.height/2,offset:r.y-n.y-n.height/2,snap:"center",nodes:e.nodes()},{guide:n.y+n.height,offset:r.y-n.y-n.height,snap:"end",nodes:e.nodes()}]}}(e.target));if(!n.length)return;o(n);let r=e.target.getAbsolutePosition();e.target.nodes().map(e=>e.getAbsolutePosition());let a={...r};n.forEach(e=>{switch(e.snap){case"start":case"center":case"end":switch(e.orientation){case"V":a.x=e.lineGuide+e.offset;break;case"H":a.y=e.lineGuide+e.offset}}});let l=a.x-r.x,s=a.y-r.y;e.evt.ctrlKey||e.evt.metaKey||e.target.nodes().forEach(e=>{let t=e.getAbsolutePosition();e.setAbsolutePosition({x:t.x+l,y:t.y+s})})},l=(t,n,r)=>{let a=e.current,l=a.getLayer().children.find(e=>"line-guides"===e.name());if(l?.destroyChildren(),"rotater"===a.getActiveAnchor())return n;let s=aG[a.getActiveAnchor()],u=a.findOne(`.${s}`)?.getAbsolutePosition();if(!u)return n;let c={x:t.x-u.x,y:t.y-u.y},d=function(e,t){let n=aU(e,t)/aU(t,t);return{x:n*t.x,y:n*t.y}}({x:n.x-t.x,y:n.y-t.y},c),h={x:t.x+d.x,y:t.y+d.y};var f=aH(i(a.nodes()),{vertical:[{guide:h.x,offset:0,snap:"start",nodes:a.nodes()}],horizontal:[{guide:h.y,offset:0,snap:"start",nodes:a.nodes()}]});if(!f.length||(o(f),r.ctrlKey||r.metaKey))return n;let p=[];if(f.forEach(e=>{let t=function(e,t,n){if("V"===n.orientation){let r=n.lineGuide;if(1e-4>Math.abs(t.x-e.x))return null;let i=(t.y-e.y)/(t.x-e.x),o=e.y-i*e.x;return{x:r,y:i*r+o}}{let r=n.lineGuide;if(1e-4>Math.abs(t.y-e.y))return null;let i=(t.y-e.y)/(t.x-e.x);return{x:(r-e.y)/i+e.x,y:r}}}(h,u,{orientation:e.orientation,lineGuide:e.lineGuide});t&&p.push(t)}),p.length>0){let e=p[0],t=Math.sqrt(Math.pow(h.x-e.x,2)+Math.pow(h.y-e.y,2));if(p.forEach(n=>{let r=Math.sqrt(Math.pow(h.x-n.x,2)+Math.pow(h.y-n.y,2));r<t&&(t=r,e=n)}),t<10)return e}return h},s=e=>{if(!e.target)return;let t=e.target.getLayer(),n=t.children.find(e=>"line-guides"===e.name());n?.destroyChildren(),t.batchDraw()};h(C).useEffect(()=>{e.current&&(e.current.anchorDragBoundFunc(l),e.current.on("dragstart",e=>{setTimeout(()=>{if(0===h(M).DD._dragElements.size)return;let e=[...h(M).DD._dragElements.entries()],t=e.find(([e,t])=>t.node instanceof h(M).Transformer);t&&(e.splice(e.indexOf(t),1),e.unshift(t),h(M).DD._dragElements.clear(),e.forEach(([e,t])=>{h(M).DD._dragElements.set(e,t)}))})}),e.current.on("dragmove",a),e.current.on("dragend",s),e.current.on("transformend",s),e.current.on("transform",t=>{t.evt.ctrlKey||t.evt.metaKey?e.current?.rotationSnapTolerance(0):e.current?.rotationSnapTolerance(5)}))},[])}(x,0);let H=e.activePage===t,V=s?.PageControls,U=s?.Tooltip,G=s?.ContextMenu,q=1/e.scale,W=0/e.scale;return(0,b.jsxs)("div",{ref:S,onDragOver:e=>e.preventDefault(),onDrop:n=>{if(n.preventDefault(),!w.current)return;w.current.setPointersPositions(n);let r=w.current.findOne(".elements-container").getRelativePointerPosition(),i=w.current.getPointerPosition(),o=[...new Set(w.current.getAllIntersections(i).map(e=>e.findAncestor(".element",!0)).filter(Boolean).reverse())].map(t=>e.getElementById(t.id())),a=o[0];uc&&(uc(r,a,{elements:o,page:t}),uc=null)},style:{position:"relative",width:n+"px",height:r+"px",overflow:"hidden"},className:"polotno-page-container"+(H?" active-page":""),children:[(0,b.jsx)(r3,{ref:w,width:Math.min(n,d.width+200),height:Math.min(d.height+200,r),onClick:B,onTap:B,onContextMenu:t=>{t.evt.preventDefault();let n=t.target.findAncestor(".element",!0),r=e.getElementById(n?.id()),i=r?.top,o=i?.id;o?e.selectedElementsIds.indexOf(o)>=0||e.selectElements([o]):e.selectElements([]),T.open({x:t.evt.clientX,y:t.evt.clientY})},onMouseDown:z,onMouseMove:n=>{if(!n.evt.altKey&&E){k(null);return}if(!n.evt.altKey)return;let r=n.target.findAncestor(".element",!0),i=r?.id();if(!e.selectedElements[0]||e.selectedElementsIds.includes(i))return;let o=aF(e.selectedShapes),a=az(i?e.getElementById(i):{x:0,y:0,width:t.computedWidth,height:t.computedHeight,rotation:0}),l=[];o.minX>a.maxX&&l.push({distance:o.minX-a.maxX,box1:o,box2:a,points:[{x:o.minX,y:o.minY+o.height/2},{x:a.maxX,y:o.minY+o.height/2},{x:a.maxX,y:a.minY+a.height/2}]}),o.maxX<a.minX&&l.push({distance:a.minX-o.maxX,box1:o,box2:a,points:[{x:o.maxX,y:o.minY+o.height/2},{x:a.minX,y:o.minY+o.height/2},{x:a.minX,y:a.minY+a.height/2}]}),o.minY>a.maxY&&l.push({box1:o,box2:a,distance:o.minY-a.maxY,points:[{x:o.minX+o.width/2,y:o.minY},{x:o.minX+o.width/2,y:a.maxY},{x:a.minX+a.width/2,y:a.maxY}]}),o.maxY<a.minY&&l.push({box1:o,box2:a,distance:a.minY-o.maxY,points:[{x:o.minX+o.width/2,y:o.maxY},{x:o.minX+o.width/2,y:a.minY},{x:a.minX+a.width/2,y:a.minY}]}),o.minX>=a.minX&&o.maxX<=a.maxX&&o.minY>=a.minY&&o.maxY<=a.maxY&&(l.push({distance:o.minX-a.minX,box1:o,box2:a,points:[{x:o.minX,y:o.minY+o.height/2},{x:a.minX,y:o.minY+o.height/2},{x:a.minX,y:a.minY+a.height/2}]}),l.push({distance:a.maxX-o.maxX,box1:o,box2:a,points:[{x:o.maxX,y:o.minY+o.height/2},{x:a.maxX,y:o.minY+o.height/2},{x:a.maxX,y:a.minY+a.height/2}]}),l.push({box1:o,box2:a,distance:o.minY-a.minY,points:[{x:o.minX+o.width/2,y:o.minY},{x:o.minX+o.width/2,y:a.minY},{x:a.minX+a.width/2,y:a.minY}]}),l.push({box1:o,box2:a,distance:a.maxY-o.maxY,points:[{x:o.minX+o.width/2,y:o.maxY},{x:o.minX+o.width/2,y:a.maxY},{x:a.minX+a.width/2,y:a.maxY}]})),JSON.stringify(E)!==JSON.stringify(l)&&k(l)},onDragStart:t=>{let n=t.target.findAncestor(".element",!0);if(n){let r=e.getElementById(n?.id()),i=r?.top,o=i?.id;!(e.selectedElementsIds.indexOf(o)>=0)&&o&&(e.selectElements([o]),t.target.stopDrag(),t.target.startDrag(t),x.current?.startDrag(t))}E&&k(null)},pageId:t.id,style:{position:"absolute",overflow:"hidden",top:0,left:0},children:(0,b.jsxs)("Layer",{children:[(0,b.jsx)(un,{width:n,height:r,fill:o}),(0,b.jsx)(rK,{x:v,y:y,scaleX:e.scale,scaleY:e.scale,name:"page-container",children:(0,b.jsxs)(rK,{name:"page-container-2",children:[(0,b.jsx)(rK,{name:"page-background-group",x:p,y:p,children:(0,b.jsx)(uo,{x:-t.bleed,y:-t.bleed,width:t.computedWidth+2*t.bleed,height:t.computedHeight+2*t.bleed,background:t.background,name:"page-background",preventDefault:!1,scale:e.scale})}),(0,b.jsxs)(rK,{x:p,y:p,name:"elements-container",listening:!e.isPlaying,children:[(0,b.jsx)(rX,{name:"elements-area",width:t.computedWidth,height:t.computedHeight,listening:!1}),(0,b.jsx)(us,{elements:t.children,store:e})]}),(0,b.jsx)(rX,{stroke:u,name:"bleed",strokeWidth:t.bleed,x:t.bleed/2,y:t.bleed/2,width:t.computedWidth+t.bleed,height:t.computedHeight+t.bleed,listening:!1,visible:t.bleed>0&&e.bleedVisible,hideInExport:!0}),lU()===ug&&(0,b.jsx)(um,{name:"hit-detection",x:-q/2-W,y:-q/2-W,width:g+q+2*W,height:m+q+2*W})]})}),(0,b.jsx)(rZ,{name:"workspace-background",points:[0,0,n,0,n,r,0,r,0,0,v,y,v,r-y,n-v,r-y,n-v,y,v,y],listening:!1,closed:!0,fill:o}),(0,b.jsx)(rK,{x:v,y:y,scaleX:e.scale,scaleY:e.scale,children:(0,b.jsx)(rX,{name:"page-highlight",hideInExport:!0,x:-q/2-W,y:-q/2-W,width:g+q+2*W,height:m+q+2*W,stroke:H&&e.pages.length>1?l:a,strokeWidth:2,listening:!1,strokeScaleEnabled:!1})}),(0,b.jsxs)(rK,{x:v+p*e.scale,y:y+p*e.scale,scaleX:e.scale,scaleY:e.scale,name:"page-abs-container",children:[(0,b.jsx)(r1,{ref:x,onDragStart:n=>{n.evt?.altKey&&c&&e.selectedElements.forEach(e=>{let n=e.clone({},{skipSelect:!0}),r=t.children.indexOf(e);t.setElementZIndex(n.id,r)}),e.history.startTransaction()},onDragEnd:()=>{e.history.endTransaction()},onTransformStart:()=>{e.history.startTransaction(),k(null)},boundBoxFunc:(e,t)=>{let n=1>Math.abs(t.width)||1>Math.abs(t.height),r=1>Math.abs(e.width)||1>Math.abs(e.height);return n&&!r?e:t},onTransform:e=>{let t=x.current.nodes(),n=t[t.length-1];if(e.target!==n)return;let r=x.current?.__getNodeRect();P({anchor:x.current?.getActiveAnchor(),x:r.x,y:r.y,rotation:r.rotation,width:r.width,height:r.height})},onTransformEnd:t=>{P({}),e.history.endTransaction()},visible:!e.isPlaying}),E&&E.map(({points:t,distance:n,box1:r,box2:i},o)=>(0,b.jsxs)(rK,{name:"distances-container",hideInExport:!0,listening:!1,children:[(0,b.jsx)(rX,{...r,stroke:"rgb(0, 161, 255)",strokeWidth:1,strokeScaleEnabled:!1}),(0,b.jsx)(rX,{...i,stroke:"rgb(0, 161, 255)",strokeWidth:1,strokeScaleEnabled:!1}),(0,b.jsx)(rZ,{points:[t[0].x,t[0].y,t[1].x,t[1].y],stroke:"rgb(0, 161, 255)",strokeWidth:1,strokeScaleEnabled:!1}),(0,b.jsx)(rZ,{points:[t[1].x,t[1].y,t[2].x,t[2].y],stroke:"rgb(0, 161, 255)",strokeWidth:1,strokeScaleEnabled:!1}),(0,b.jsxs)(rY,{x:(t[0].x+t[1].x)/2,y:(t[0].y+t[1].y)/2,offsetY:-10,scaleX:1/e.scale,scaleY:1/e.scale,children:[(0,b.jsx)("Tag",{cornerRadius:5,fill:"rgb(0, 161, 255)",pointerDirection:"down"}),(0,b.jsx)(rJ,{align:"center",verticalAlign:"middle",fill:"white",padding:5,text:l4({unit:e.unit,dpi:e.dpi,px:n})})]})]},o)),t._rendering&&(0,b.jsxs)(rK,{children:[(0,b.jsx)(rX,{width:g,height:m,fill:"rgba(255,255,255,0.9)"}),(0,b.jsx)(rJ,{text:"Rendering...",fontSize:60,width:g,height:m,align:"center",verticalAlign:"middle"})]}),U&&(0,b.jsx)(U,{components:s,store:e,page:t,stageRef:w}),G&&(0,b.jsx)(r5,{children:(0,b.jsx)(G,{components:s,store:e,...T.props})})]}),(0,b.jsx)(ul,{...O,store:e}),(0,b.jsx)(ua,{selection:L}),lG()&&(0,b.jsx)(rJ,{text:"Powered by polotno.com",fontSize:14,fill:"rgba(0,0,0,0.6)",x:n-170,y:r-18,onMouseEnter:e=>{e.target.getStage().container().style.cursor="pointer"},onMouseLeave:e=>{e.target.getStage().container().style.cursor=""},onTouchStart:e=>{e.cancelBubble=!0},onMouseDown:e=>{e.cancelBubble=!0},onClick:()=>{window.open("https://polotno.com")},onTap:()=>{window.open("https://polotno.com")}}),(0,b.jsx)(rK,{name:"line-guides"})]})}),(i??!0)&&V&&(0,b.jsx)(V,{store:e,page:t,xPadding:v,yPadding:y})]})}),C=v("8NFma");let uy=aS("div",h(C).forwardRef)`
   position: absolute;
   top: 0;
   left: 0;

package/utils/to-html.js

@@ -1 +1 @@
-var e,t=this&&this.__createBinding||(Object.create?function(e,t,i,o){void 0===o&&(o=i);var r=Object.getOwnPropertyDescriptor(t,i);r&&!("get"in r?!t.__esModule:r.writable||r.configurable)||(r={enumerable:!0,get:function(){return t[i]}}),Object.defineProperty(e,o,r)}:function(e,t,i,o){void 0===o&&(o=i),e[o]=t[i]}),i=this&&this.__setModuleDefault||(Object.create?function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}:function(e,t){e.default=t}),o=this&&this.__importStar||(e=function(t){return e=Object.getOwnPropertyNames||function(e){var t=[];for(var i in e){Object.prototype.hasOwnProperty.call(e,i)&&(t[t.length]=i)}return t},e(t)},function(o){if(o&&o.__esModule){return o}var r={};if(null!=o){for(var n=e(o),s=0;s<n.length;s++){"default"!==n[s]&&t(r,o,n[s])}}return i(r,o),r}),r=this&&this.__rest||function(e,t){var i={};for(var o in e){Object.prototype.hasOwnProperty.call(e,o)&&t.indexOf(o)<0&&(i[o]=e[o])}if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var r=0;for(o=Object.getOwnPropertySymbols(e);r<o.length;r++){t.indexOf(o[r])<0&&Object.prototype.propertyIsEnumerable.call(e,o[r])&&(i[o[r]]=e[o[r]])}}return i};Object.defineProperty(exports,"__esModule",{value:!0}),exports.fixRatio=function(e){var t=(new DOMParser).parseFromString(e,"image/svg+xml");return t.documentElement.setAttribute("preserveAspectRatio","none"),(new XMLSerializer).serializeToString(t)},exports.jsonToDOM=y,exports.jsonToHTML=async function({json:e,elementHook:t}){const i=await y({json:e,elementHook:t});return w({dom:i})};const n=require("./image"),s=o(require("./svg")),a=require("./image"),l=require("./figure-to-svg"),h=require("./html2canvas"),c=require("./filters"),d=require("./video"),p=require("./fonts"),g=(e,t,...i)=>({type:e,props:t,children:i||[]}),u=async({element:e,page:t,store:i})=>{let{src:o}=e;if("svg"===e.type&&Object.keys(e.colorsReplace).length){const t=await s.urlToString(o);o=s.replaceColors(t,new Map(Object.entries(e.colorsReplace)))}let r="";e.flipX&&(r+="scaleX(-1)"),e.flipY&&(r+="scaleY(-1)"),r||(r="none");const n={};if(e.clipSrc){const t=await s.urlToBase64(e.clipSrc);n["clip-path"]=`url(${t})`}const l=await(0,a.loadImage)(o),h=l.width*e.cropWidth,c=l.height*e.cropHeight,d=e.width/e.height;let p,u;const f=h/c;"svg"===e.type?(p=h,u=c):d>=f?(p=h,u=h/d):(p=c*d,u=c);const b=p/l.width,m=u/l.height,y=p/u>e.width/e.height?e.height/u:e.width/p,w=p*y/b,x=u*y/m,$=e.cropX*y*l.width,O=e.cropY*y*l.height;return g("div",{style:Object.assign(Object.assign({},n),{width:"100%",height:"100%","border-radius":e.cornerRadius+"px",border:e.borderSize?`${e.borderSize}px solid ${e.borderColor}`:"none",background:`url(${o})`,transform:r,"background-size":`${Math.round(w)}px ${Math.round(x)}px`,"background-position-x":-Math.round($)+"px","background-position-y":-Math.round(O)+"px"})})},f=({element:e,type:t})=>{const i={"stroke-width":e.height,stroke:e.color,"line-cap":"round","stroke-linejoin":"round",opacity:e.opacity};return"arrow"===t||"triangle"===t?g("polyline",Object.assign({points:`${3*e.height},${2*-e.height} 0,0 ${3*e.height},${2*e.height}`},i)):"bar"===t?g("polyline",Object.assign({points:`0,${2*-e.height} 0,${2*e.height}`},i)):"circle"===t?g("circle",Object.assign({r:e.height},i)):"square"===t?g("polyline",Object.assign({points:`${-e.height},${-e.height} ${-e.height},${e.height} ${e.height},${e.height} ${e.height},${-e.height}`},i)):null},b={image:u,svg:u,text:async({element:e,page:t,store:i})=>{let o={top:0,left:0};e.fill.indexOf("gradient")>=0&&(o=Object.assign(Object.assign({},o),{"background-color":e.fill,"background-image":e.fill,"background-clip":"text","text-fill-color":"transparent","-webkit-background-clip":"text","-webkit-text-fill-color":"transparent"}));const r=e.backgroundPadding*(e.fontSize*e.lineHeight),n=g("div",{style:{position:"absolute",top:-r/2+"px",left:-r/2+"px",display:e.backgroundEnabled?"block":"none",width:e.width+r+"px",height:e.height+r+"px","background-color":e.backgroundColor,"border-radius":e.backgroundCornerRadius*(e.fontSize*e.lineHeight*.5)+"px"}});"middle"===e.verticalAlign?(o.top="50%",o.transform="translateY(-50%)"):"bottom"===e.verticalAlign&&(o.bottom=0);const s=/<[a-z][\s\S]*>/i.test(e.text),a=Object.assign(Object.assign({},o),{position:"absolute",width:e.width+"px",color:e.fill,"white-space":"pre-wrap","font-size":e.fontSize+"px","text-align":e.align,"font-family":e.fontFamily,"text-decoration":e.textDecoration||"none","line-height":e.lineHeight,"letter-spacing":e.letterSpacing+"em","font-style":e.fontStyle,"font-weight":e.fontWeight,"-webkit-text-stroke":`${e.strokeWidth}px ${e.stroke}`,"text-stroke":`${e.strokeWidth}px ${e.stroke}`}),l="el-"+e.id,c=s?{id:l}:{},d=`<style>#${l} {${h.resetStyleContent}}</style>`,p=g("div",Object.assign(Object.assign({style:a},c),{innerHTML:s?`${d}${e.text}`:e.text.split("\n").join("<br />")}));return g("div",{style:{position:"relative",width:"100%",height:"100%"}},n,p)},line:async({element:e,page:t,store:i})=>g("svg",{style:{width:"100%",height:"100%",contain:"layout style size",overflow:"visible"}},g("rect",{x:0,y:0,width:e.width,height:e.height,fill:e.color}),g("g",{transform:`translate(0 ${e.height/2})`},f({element:e,type:e.startHead})),g("g",{transform:`translate(${e.width} ${e.height/2}) rotate(180)`},f({element:e,type:e.endHead}))),figure:async({element:e,page:t,store:i,elementHook:o})=>{const r=(0,l.figureToSvg)(e),n=g("div",{innerHTML:r});return o&&o({dom:n,element:e})||n},group:async({element:e,page:t,store:i,elementHook:o})=>{const r=await Promise.all(e.children.map((e=>m({element:e,page:t,store:i,elementHook:o})))),n=g("div",{style:{"transform-origin":"top left",opacity:e.opacity}},...r);return o&&o({dom:n,element:e})||n},video:async({element:e,page:t,store:i,elementHook:o})=>{const{cropX:r,cropY:n,cropWidth:s,cropHeight:a}=e,l=await(0,d.getVideoSize)(e.src),h=l.width*s,c=l.height*a,p=e.width/e.height;let u,f;p>=h/c?(u=h,f=h/p):(u=c*p,f=c);const b=u/s,m=f/a,y=r*l.width,w=n*l.height,x=Math.max(e.width/l.width,e.height/l.height),$={position:"absolute",width:`${Math.round(b*x)}px`,height:`${Math.round(m*x)}px`,left:-Math.round(y*x)+"px",top:-Math.round(w*x)+"px","object-fit":"fill"},O=`video-${e.id}`,v=g("div",{style:{position:"relative",width:"100%",height:"100%",overflow:"hidden","border-radius":e.cornerRadius+"px",border:e.borderSize?`${e.borderSize}px solid ${e.borderColor}`:"none"}},g("video",{id:O,src:e.src,style:$,controls:!0,playsInline:!0,muted:!0,volume:e.volume}));return o&&o({dom:v,element:e})||v},gif:u};async function m({element:e,page:t,store:i,elementHook:o}){let r=await b[e.type];if(r||(r=()=>g("div",{}),console.error(`HTML export does not support ${e.type} type...`)),!e.visible){return null}const n=await r({element:e,page:t,store:i}),s=[],a=[];if(e.blurEnabled&&s.push(`blur(${e.blurRadius/2}px)`),e.brightnessEnabled&&s.push(`brightness(${100*e.brightness+100}%)`),e.sepiaEnabled&&s.push("sepia()"),e.grayscaleEnabled&&s.push("grayscale()"),e.filters){for(const[h,d]of Object.entries(e.filters)){const e=(0,c.shapeFilterToCSS)(c.Effects[h],d.intensity);e&&(s.push(e.filter),e.html&&a.push(e.html))}}e.shadowEnabled&&s.push(`drop-shadow(${e.shadowOffsetX}px ${e.shadowOffsetY}px ${e.shadowBlur}px ${e.shadowColor})`);const l=g("div",{id:e.id,style:{position:"absolute",left:e.x+"px",top:e.y+"px",width:e.width+"px",height:e.height+"px",transform:`rotate(${e.rotation}deg)`,"transform-origin":"top left",opacity:e.opacity,display:e.visible&&e.showInExport?"block":"none",filter:s.join(" ")||"none"}},n,...a);return o&&o({dom:l,element:e})||l}async function y({json:e,elementHook:t}){const i=await Promise.all(e.pages.map((i=>async function({page:e,store:t,elementHook:i}){const o=await Promise.all(e.children.map((o=>m({element:o,page:e,store:t,elementHook:i})))),r="auto"===e.width?t.width:e.width,s="auto"===e.height?t.height:e.height;let l={};if(e.background.indexOf("url")>=0||e.background.indexOf("http")>=0||e.background.indexOf(".jpg")>=0||e.background.indexOf(".png")>=0||e.background.indexOf(".jpeg")>=0){const{width:i,height:r}=await(0,a.loadImage)(e.background),s=await u({element:Object.assign({x:0,y:0,width:i,height:r,src:e.background,cornerRadius:0},(0,n.getCrop)({width:i,height:r},{width:i,height:r})),page:e,store:t});o.unshift(s)}else{l=Object.assign(Object.assign({},l),{"background-color":e.background})}return g("div",{className:"page",id:e.id,style:Object.assign(Object.assign({},l),{width:r+"px",height:s+"px",overflow:"hidden",position:"relative"})},...o)}({page:i,store:e,elementHook:t})))),o=[];e.pages.forEach((e=>{e.children.forEach((e=>{"text"===e.type&&-1===o.indexOf(e.fontFamily)&&o.push(e.fontFamily)}))}));const r=o.map((t=>e.fonts.find((e=>e.fontFamily===t))?g("style",{},""):g("link",{href:(0,p.getGoogleFontsUrl)(t),rel:"stylesheet"})));return g("div",{className:"design"},...r,...i)}const w=({dom:e})=>{if("string"==typeof e){return e}if(!e){return""}const t=e.props,{innerHTML:i}=t,o=r(t,["innerHTML"]);return`<${e.type} ${Object.keys(o).map((t=>((e,t)=>"object"==typeof t?`${e}="${Object.keys(t).map((e=>`${e}:${t[e]};`)).join(" ")}"`:`${e}="${t}"`)(t,e.props[t]))).join(" ")}>${i||e.children.map((e=>w({dom:e}))).join("")}</${e.type}>`};
+var e,t=this&&this.__createBinding||(Object.create?function(e,t,i,o){void 0===o&&(o=i);var r=Object.getOwnPropertyDescriptor(t,i);r&&!("get"in r?!t.__esModule:r.writable||r.configurable)||(r={enumerable:!0,get:function(){return t[i]}}),Object.defineProperty(e,o,r)}:function(e,t,i,o){void 0===o&&(o=i),e[o]=t[i]}),i=this&&this.__setModuleDefault||(Object.create?function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}:function(e,t){e.default=t}),o=this&&this.__importStar||(e=function(t){return e=Object.getOwnPropertyNames||function(e){var t=[];for(var i in e){Object.prototype.hasOwnProperty.call(e,i)&&(t[t.length]=i)}return t},e(t)},function(o){if(o&&o.__esModule){return o}var r={};if(null!=o){for(var n=e(o),s=0;s<n.length;s++){"default"!==n[s]&&t(r,o,n[s])}}return i(r,o),r}),r=this&&this.__rest||function(e,t){var i={};for(var o in e){Object.prototype.hasOwnProperty.call(e,o)&&t.indexOf(o)<0&&(i[o]=e[o])}if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var r=0;for(o=Object.getOwnPropertySymbols(e);r<o.length;r++){t.indexOf(o[r])<0&&Object.prototype.propertyIsEnumerable.call(e,o[r])&&(i[o[r]]=e[o[r]])}}return i};Object.defineProperty(exports,"__esModule",{value:!0}),exports.fixRatio=function(e){var t=(new DOMParser).parseFromString(e,"image/svg+xml");return t.documentElement.setAttribute("preserveAspectRatio","none"),(new XMLSerializer).serializeToString(t)},exports.jsonToDOM=y,exports.jsonToHTML=async function({json:e,elementHook:t}){const i=await y({json:e,elementHook:t});return w({dom:i})};const n=require("./image"),s=o(require("./svg")),a=require("./image"),l=require("./figure-to-svg"),h=require("./html2canvas"),c=require("./filters"),d=require("./video"),p=require("./fonts"),g=(e,t,...i)=>({type:e,props:t,children:i||[]}),u=async({element:e,page:t,store:i})=>{let{src:o}=e;if("svg"===e.type&&Object.keys(e.colorsReplace).length){const t=await s.urlToString(o);o=s.replaceColors(t,new Map(Object.entries(e.colorsReplace)))}let r="";e.flipX&&(r+="scaleX(-1)"),e.flipY&&(r+="scaleY(-1)"),r||(r="none");const n={};if(e.clipSrc){const t=await s.urlToBase64(e.clipSrc);n["clip-path"]=`url(${t})`}const l=await(0,a.loadImage)(o),h=l.width*e.cropWidth,c=l.height*e.cropHeight,d=e.width/e.height;let p,u;const f=h/c;"svg"===e.type?(p=h,u=c):d>=f?(p=h,u=h/d):(p=c*d,u=c);const b=p/l.width,m=u/l.height,y=p/u>e.width/e.height?e.height/u:e.width/p,w=p*y/b,x=u*y/m,$=e.cropX*y*l.width,O=e.cropY*y*l.height;return g("div",{style:Object.assign(Object.assign({},n),{width:"100%",height:"100%","border-radius":e.cornerRadius+"px",border:e.borderSize?`${e.borderSize}px solid ${e.borderColor}`:"none",backgroundRepeat:"no-repeat",background:`url(${o})`,transform:r,"background-size":`${Math.round(w)}px ${Math.round(x)}px`,"background-position-x":-Math.round($)+"px","background-position-y":-Math.round(O)+"px"})})},f=({element:e,type:t})=>{const i={"stroke-width":e.height,stroke:e.color,"line-cap":"round","stroke-linejoin":"round",opacity:e.opacity};return"arrow"===t||"triangle"===t?g("polyline",Object.assign({points:`${3*e.height},${2*-e.height} 0,0 ${3*e.height},${2*e.height}`},i)):"bar"===t?g("polyline",Object.assign({points:`0,${2*-e.height} 0,${2*e.height}`},i)):"circle"===t?g("circle",Object.assign({r:e.height},i)):"square"===t?g("polyline",Object.assign({points:`${-e.height},${-e.height} ${-e.height},${e.height} ${e.height},${e.height} ${e.height},${-e.height}`},i)):null},b={image:u,svg:u,text:async({element:e,page:t,store:i})=>{let o={top:0,left:0};e.fill.indexOf("gradient")>=0&&(o=Object.assign(Object.assign({},o),{"background-color":e.fill,"background-image":e.fill,"background-clip":"text","text-fill-color":"transparent","-webkit-background-clip":"text","-webkit-text-fill-color":"transparent"}));const r=e.backgroundPadding*(e.fontSize*e.lineHeight),n=g("div",{style:{position:"absolute",top:-r/2+"px",left:-r/2+"px",display:e.backgroundEnabled?"block":"none",width:e.width+r+"px",height:e.height+r+"px","background-color":e.backgroundColor,"border-radius":e.backgroundCornerRadius*(e.fontSize*e.lineHeight*.5)+"px"}});"middle"===e.verticalAlign?(o.top="50%",o.transform="translateY(-50%)"):"bottom"===e.verticalAlign&&(o.bottom=0);const s=/<[a-z][\s\S]*>/i.test(e.text),a=Object.assign(Object.assign({},o),{position:"absolute",width:e.width+"px",color:e.fill,"white-space":"pre-wrap","font-size":e.fontSize+"px","text-align":e.align,"font-family":e.fontFamily,"text-decoration":e.textDecoration||"none","line-height":e.lineHeight,"letter-spacing":e.letterSpacing+"em","font-style":e.fontStyle,"font-weight":e.fontWeight,"-webkit-text-stroke":`${e.strokeWidth}px ${e.stroke}`,"text-stroke":`${e.strokeWidth}px ${e.stroke}`}),l="el-"+e.id,c=s?{id:l}:{},d=`<style>#${l} {${h.resetStyleContent}}</style>`,p=g("div",Object.assign(Object.assign({style:a},c),{innerHTML:s?`${d}${e.text}`:e.text.split("\n").join("<br />")}));return g("div",{style:{position:"relative",width:"100%",height:"100%"}},n,p)},line:async({element:e,page:t,store:i})=>g("svg",{style:{width:"100%",height:"100%",contain:"layout style size",overflow:"visible"}},g("rect",{x:0,y:0,width:e.width,height:e.height,fill:e.color}),g("g",{transform:`translate(0 ${e.height/2})`},f({element:e,type:e.startHead})),g("g",{transform:`translate(${e.width} ${e.height/2}) rotate(180)`},f({element:e,type:e.endHead}))),figure:async({element:e,page:t,store:i,elementHook:o})=>{const r=(0,l.figureToSvg)(e),n=g("div",{innerHTML:r});return o&&o({dom:n,element:e})||n},group:async({element:e,page:t,store:i,elementHook:o})=>{const r=await Promise.all(e.children.map((e=>m({element:e,page:t,store:i,elementHook:o})))),n=g("div",{style:{"transform-origin":"top left",opacity:e.opacity}},...r);return o&&o({dom:n,element:e})||n},video:async({element:e,page:t,store:i,elementHook:o})=>{const{cropX:r,cropY:n,cropWidth:s,cropHeight:a}=e,l=await(0,d.getVideoSize)(e.src),h=l.width*s,c=l.height*a,p=e.width/e.height;let u,f;p>=h/c?(u=h,f=h/p):(u=c*p,f=c);const b=u/s,m=f/a,y=r*l.width,w=n*l.height,x=Math.max(e.width/l.width,e.height/l.height),$={position:"absolute",width:`${Math.round(b*x)}px`,height:`${Math.round(m*x)}px`,left:-Math.round(y*x)+"px",top:-Math.round(w*x)+"px","object-fit":"fill"},O=`video-${e.id}`,k=g("div",{style:{position:"relative",width:"100%",height:"100%",overflow:"hidden","border-radius":e.cornerRadius+"px",border:e.borderSize?`${e.borderSize}px solid ${e.borderColor}`:"none"}},g("video",{id:O,src:e.src,style:$,controls:!0,playsInline:!0,muted:!0,volume:e.volume}));return o&&o({dom:k,element:e})||k},gif:u};async function m({element:e,page:t,store:i,elementHook:o}){let r=await b[e.type];if(r||(r=()=>g("div",{}),console.error(`HTML export does not support ${e.type} type...`)),!e.visible){return null}const n=await r({element:e,page:t,store:i}),s=[],a=[];if(e.blurEnabled&&s.push(`blur(${e.blurRadius/2}px)`),e.brightnessEnabled&&s.push(`brightness(${100*e.brightness+100}%)`),e.sepiaEnabled&&s.push("sepia()"),e.grayscaleEnabled&&s.push("grayscale()"),e.filters){for(const[h,d]of Object.entries(e.filters)){const e=(0,c.shapeFilterToCSS)(c.Effects[h],d.intensity);e&&(s.push(e.filter),e.html&&a.push(e.html))}}e.shadowEnabled&&s.push(`drop-shadow(${e.shadowOffsetX}px ${e.shadowOffsetY}px ${e.shadowBlur}px ${e.shadowColor})`);const l=g("div",{id:e.id,style:{position:"absolute",left:e.x+"px",top:e.y+"px",width:e.width+"px",height:e.height+"px",transform:`rotate(${e.rotation}deg)`,"transform-origin":"top left",opacity:e.opacity,display:e.visible&&e.showInExport?"block":"none",filter:s.join(" ")||"none"}},n,...a);return o&&o({dom:l,element:e})||l}async function y({json:e,elementHook:t}){const i=await Promise.all(e.pages.map((i=>async function({page:e,store:t,elementHook:i}){const o=await Promise.all(e.children.map((o=>m({element:o,page:e,store:t,elementHook:i})))),r="auto"===e.width?t.width:e.width,s="auto"===e.height?t.height:e.height;let l={};if(e.background.indexOf("url")>=0||e.background.indexOf("http")>=0||e.background.indexOf(".jpg")>=0||e.background.indexOf(".png")>=0||e.background.indexOf(".jpeg")>=0){const{width:i,height:r}=await(0,a.loadImage)(e.background),s=await u({element:Object.assign({x:0,y:0,width:i,height:r,src:e.background,cornerRadius:0},(0,n.getCrop)({width:i,height:r},{width:i,height:r})),page:e,store:t});o.unshift(s)}else{l=Object.assign(Object.assign({},l),{"background-color":e.background})}return g("div",{className:"page",id:e.id,style:Object.assign(Object.assign({},l),{width:r+"px",height:s+"px",overflow:"hidden",position:"relative"})},...o)}({page:i,store:e,elementHook:t})))),o=[];e.pages.forEach((e=>{e.children.forEach((e=>{"text"===e.type&&-1===o.indexOf(e.fontFamily)&&o.push(e.fontFamily)}))}));const r=o.map((t=>e.fonts.find((e=>e.fontFamily===t))?g("style",{},""):g("link",{href:(0,p.getGoogleFontsUrl)(t),rel:"stylesheet"})));return g("div",{className:"design"},...r,...i)}const w=({dom:e})=>{if("string"==typeof e){return e}if(!e){return""}const t=e.props,{innerHTML:i}=t,o=r(t,["innerHTML"]);return`<${e.type} ${Object.keys(o).map((t=>((e,t)=>"object"==typeof t?`${e}="${Object.keys(t).map((e=>`${e}:${t[e]};`)).join(" ")}"`:`${e}="${t}"`)(t,e.props[t]))).join(" ")}>${i||e.children.map((e=>w({dom:e}))).join("")}</${e.type}>`};

package/utils/validate-key.js

@@ -1 +1 @@
-var e,t=this&&this.__createBinding||(Object.create?function(e,t,o,n){void 0===n&&(n=o);var r=Object.getOwnPropertyDescriptor(t,o);r&&!("get"in r?!t.__esModule:r.writable||r.configurable)||(r={enumerable:!0,get:function(){return t[o]}}),Object.defineProperty(e,n,r)}:function(e,t,o,n){void 0===n&&(n=o),e[n]=t[o]}),o=this&&this.__setModuleDefault||(Object.create?function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}:function(e,t){e.default=t}),n=this&&this.__importStar||(e=function(t){return e=Object.getOwnPropertyNames||function(e){var t=[];for(var o in e){Object.prototype.hasOwnProperty.call(e,o)&&(t[t.length]=o)}return t},e(t)},function(n){if(n&&n.__esModule){return n}var r={};if(null!=n){for(var i=e(n),a=0;a<i.length;a++){"default"!==i[a]&&t(r,n,i[a])}}return o(r,n),r});Object.defineProperty(exports,"__esModule",{value:!0}),exports.__=exports.getKey=exports.isCreditVisible=exports.___=void 0,exports.isKeyPaid=w,exports.validateKey=async function(e,t){u=e,await w(e)&&!t||c()};const r=n(require("mobx")),i=require("./api"),a=require("./flags"),s=r.observable({value:!1}),l=r.observable({value:"v1"});exports.___=()=>l.value,exports.isCreditVisible=()=>s.value;const c=r.action((()=>{s.value=!0}));let u="";exports.getKey=()=>u||"";const d=5,p=3e3,g="Polotno API is initialized without API key. It may lead to unexpected behavior and stop working. Please create API key here: https://polotno.com/cabinet",v="Polotno API key is not valid. Please get new API key here: https://polotno.com/cabinet",f="Can not validate Polotno API key. Please report to anton@polotno.com immediately.",b="%cPolotno Free Version. Development or non-commercial usage only. https://polotno.com/";let _=window.location.origin;const m=navigator.userAgent.indexOf("Headless")>-1,h=navigator.userAgent.indexOf("Electron")>-1;"file://"===_&&m&&(_="headless"),"file://"===_&&h&&(_="electron");const y=`%cPolotno error! Current domain is not allowed. It may lead to unexpected behavior and stop working. Please add "${_}" here: https://polotno.com/cabinet`;let P=fetch;async function w(e){for(let o=0;o<d;o++){try{const t=await P((0,i.getAPI)()+"/validate-key",{method:"POST",body:JSON.stringify({key:e,site:location.host,skdVersion:"2.23.0"})});if(l.value=t.headers.get("x-api-version"),!e){return console.warn(g),!1}if(200!==t.status){await new Promise((e=>setTimeout(e,p)));continue}const o=await t.json();return o.is_valid||console.warn(v),o.is_paid||console.log(b,"background: rgb(0, 161, 255); color: white; padding: 5px; margin: 5px;"),o.is_domain_valid||console.log(y,"background: rgba(247, 101, 68, 1); color: white; padding: 5px; margin: 5px;"),(0,a.useRemoveBackground)(o.remove_background_enabled),o.is_paid||!1}catch(t){await new Promise((e=>setTimeout(e,p)))}}return console.error(f),!0}exports.__=e=>{P=e};
+var e,t=this&&this.__createBinding||(Object.create?function(e,t,o,n){void 0===n&&(n=o);var r=Object.getOwnPropertyDescriptor(t,o);r&&!("get"in r?!t.__esModule:r.writable||r.configurable)||(r={enumerable:!0,get:function(){return t[o]}}),Object.defineProperty(e,n,r)}:function(e,t,o,n){void 0===n&&(n=o),e[n]=t[o]}),o=this&&this.__setModuleDefault||(Object.create?function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}:function(e,t){e.default=t}),n=this&&this.__importStar||(e=function(t){return e=Object.getOwnPropertyNames||function(e){var t=[];for(var o in e){Object.prototype.hasOwnProperty.call(e,o)&&(t[t.length]=o)}return t},e(t)},function(n){if(n&&n.__esModule){return n}var r={};if(null!=n){for(var i=e(n),a=0;a<i.length;a++){"default"!==i[a]&&t(r,n,i[a])}}return o(r,n),r});Object.defineProperty(exports,"__esModule",{value:!0}),exports.__=exports.getKey=exports.isCreditVisible=exports.___=void 0,exports.isKeyPaid=w,exports.validateKey=async function(e,t){u=e,await w(e)&&!t||c()};const r=n(require("mobx")),i=require("./api"),a=require("./flags"),s=r.observable({value:!1}),l=r.observable({value:"v1"});exports.___=()=>l.value,exports.isCreditVisible=()=>s.value;const c=r.action((()=>{s.value=!0}));let u="";exports.getKey=()=>u||"";const d=5,p=3e3,g="Polotno API is initialized without API key. It may lead to unexpected behavior and stop working. Please create API key here: https://polotno.com/cabinet",v="Polotno API key is not valid. Please get new API key here: https://polotno.com/cabinet",f="Can not validate Polotno API key. Please report to anton@polotno.com immediately.",b="%cPolotno Free Version. Development or non-commercial usage only. https://polotno.com/";let _=window.location.origin;const m=navigator.userAgent.indexOf("Headless")>-1,h=navigator.userAgent.indexOf("Electron")>-1;"file://"===_&&m&&(_="headless"),"file://"===_&&h&&(_="electron");const y=`%cPolotno error! Current domain is not allowed. It may lead to unexpected behavior and stop working. Please add "${_}" here: https://polotno.com/cabinet`;let P=fetch;async function w(e){for(let o=0;o<d;o++){try{const t=await P((0,i.getAPI)()+"/validate-key",{method:"POST",body:JSON.stringify({key:e,site:location.host,skdVersion:"2.23.2"})});if(l.value=t.headers.get("x-api-version"),!e){return console.warn(g),!1}if(200!==t.status){await new Promise((e=>setTimeout(e,p)));continue}const o=await t.json();return o.is_valid||console.warn(v),o.is_paid||console.log(b,"background: rgb(0, 161, 255); color: white; padding: 5px; margin: 5px;"),o.is_domain_valid||console.log(y,"background: rgba(247, 101, 68, 1); color: white; padding: 5px; margin: 5px;"),(0,a.useRemoveBackground)(o.remove_background_enabled),o.is_paid||!1}catch(t){await new Promise((e=>setTimeout(e,p)))}}return console.error(f),!0}exports.__=e=>{P=e};