@overtone-art/canvas-editor-core 0.8.3 → 0.8.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.global.js +1 -1
- package/dist/index.global.js.map +1 -1
- package/dist/index.js +14 -4
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +14 -4
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.global.js
CHANGED
|
@@ -504,5 +504,5 @@ void main() {
|
|
|
504
504
|
`}applyTo2d({imageData:{data:r}}){let t=-this.vibrance;for(let e=0;e<r.length;e+=4){let i=r[e],s=r[e+1],n=r[e+2],a=Math.max(i,s,n),o=(i+s+n)/3,l=2*Math.abs(a-o)/255*t;r[e]+=a===i?0:(a-i)*l,r[e+1]+=a===s?0:(a-s)*l,r[e+2]+=a===n?0:(a-n)*l}}sendUniformData(r,t){r.uniform1f(t.uVibrance,-this.vibrance)}isNeutralState(){return this.vibrance===0}};m($r,"type","Vibrance"),m($r,"defaults",{vibrance:0}),m($r,"uniformLocations",["uVibrance"]),_.setClass($r);var ri=Zr({BaseFilter:()=>G,BlackWhite:()=>dd,BlendColor:()=>Mr,BlendImage:()=>Pr,Blur:()=>Er,Brightness:()=>Ar,Brownie:()=>ad,ColorMatrix:()=>fe,Composed:()=>Sn,Contrast:()=>Dr,Convolute:()=>jr,Gamma:()=>Lr,Grayscale:()=>Fr,HueRotation:()=>ji,Invert:()=>Ir,Kodachrome:()=>ld,Noise:()=>Rr,Pixelate:()=>Br,Polaroid:()=>cd,RemoveColor:()=>Xr,Resize:()=>Wr,Saturation:()=>Yr,Sepia:()=>ud,Technicolor:()=>hd,Vibrance:()=>$r,Vintage:()=>od});var Ze=class{listeners=new Map;on(t,e){this.listeners.has(t)||this.listeners.set(t,new Set),this.listeners.get(t).add(e)}off(t,e){this.listeners.get(t)?.delete(e)}once(t,e){let i=s=>{this.off(t,i),e(s)};this.on(t,i)}emit(t,e){let i=this.listeners.get(t);if(i)for(let s of i)s(e)}removeAllListeners(t){t?this.listeners.delete(t):this.listeners.clear()}};var ta=Eh("crypto");var Zl="useandom-26T198340PX75pxJACKVERYMINDBUSHWOLF_GQZbfghjklqvwyzrict";var md=128,ae,Qe;function yd(r){if(r<0)throw new RangeError("Wrong ID size");try{!ae||ae.length<r?(ae=Buffer.allocUnsafe(r*md),ta.webcrypto.getRandomValues(ae),Qe=0):Qe+r>ae.length&&(ta.webcrypto.getRandomValues(ae),Qe=0)}catch(t){throw ae=void 0,t}Qe+=r}function Ql(r=21){yd(r|=0);let t="";for(let e=Qe-r;e<Qe;e++)t+=Zl[ae[e]&63];return t}var mt=()=>Ql(12);var ea=["normal","darken","multiply","color-burn","lighten","screen","color-dodge","linear-dodge","overlay","soft-light","hard-light","difference","exclusion","hue","saturation","color","luminosity"],vd={normal:"source-over","linear-dodge":"lighter"};function ii(r){return vd[r]??r}function ns(r){if(!r)return"normal";for(let t of ea)if(ii(t)===r)return t;return"normal"}var th=[{label:"Normal",modes:["normal"]},{label:"Darken",modes:["darken","multiply","color-burn"]},{label:"Lighten",modes:["lighten","screen","color-dodge","linear-dodge"]},{label:"Contrast",modes:["overlay","soft-light","hard-light"]},{label:"Comparative",modes:["difference","exclusion"]},{label:"Composite",modes:["hue","saturation","color","luminosity"]}];function eh(r){return r==="linear-dodge"?"Linear Dodge (Add)":r.split("-").map(t=>(t[0]??"").toUpperCase()+t.slice(1)).join(" ")}var tr=class{id;type;name;visible;locked;opacity;meta;fabricObject;renderProxy;children;parentId;constructor(t,e,i,s){this.id=s??mt(),this.type=t,this.name=i??`${t}-${this.id.slice(0,4)}`,this.visible=!0,this.locked=!1,this.opacity=1,this.meta={},this.fabricObject=e,this.renderProxy=null,this.children=[],this.parentId=null,this.fabricObject._layerId=this.id}hasMeta(){return Object.keys(this.meta).length>0}toData(){let t=ns(this.fabricObject.globalCompositeOperation);return{id:this.id,type:this.type,name:this.name,visible:this.visible,locked:this.locked,opacity:this.opacity,...t!=="normal"?{blend:t}:{},...this.hasMeta()?{meta:this.meta}:{},...this.children.length>0?{children:this.children.map(e=>e.toData())}:{}}}serialize(){return{...this.toData(),fabricObject:this.fabricObject.toObject()}}},er=class{constructor(t,e){this.canvas=t;this.events=e}canvas;events;layers=[];onPropertyChanged;setHistoryCallback(t){this.onPropertyChanged=t}add(t,e,i,s){let n=new tr(t,e,i,s);return this.layers.push(n),this.canvas.add(e),this.events.emit("layer:added",{layer:n.toData()}),this.emitChanged(),n}remove(t){let e=this.get(t);if(!e)return!1;if(e.parentId){let s=this.get(e.parentId);return s?(s.fabricObject.remove(e.fabricObject),s.children=s.children.filter(n=>n.id!==t),e.parentId=null,this.events.emit("layer:removed",{layerId:t}),s.children.length<2&&this.dissolve(s),this.emitChanged(),this.onPropertyChanged?.(),this.canvas.requestRenderAll(),!0):!1}let i=this.layers.findIndex(s=>s.id===t);return i===-1?!1:(this.canvas.remove(e.fabricObject),e.renderProxy&&this.canvas.remove(e.renderProxy),this.layers.splice(i,1),this.events.emit("layer:removed",{layerId:t}),this.emitChanged(),this.onPropertyChanged?.(),!0)}detach(t){let e=this.layers.findIndex(s=>s.id===t);if(e===-1)return;let[i]=this.layers.splice(e,1);return this.canvas.remove(i.fabricObject),i.renderProxy&&this.canvas.remove(i.renderProxy),i}explode(t){let e=[...t.children];return this.dissolve(t),this.events.emit("layer:removed",{layerId:t.id}),this.emitChanged(),this.onPropertyChanged?.(),this.canvas.requestRenderAll(),e}dissolve(t){let e=t.fabricObject.removeAll(),i=this.layers.findIndex(n=>n.id===t.id),s=t.children;t.children=[];for(let[n,a]of e.entries()){a.setCoords();let o=s[n];o&&(o.parentId=null,this.layers.splice(i+n,0,o),this.canvas.add(a),o.renderProxy&&this.canvas.add(o.renderProxy))}this.canvas.remove(t.fabricObject),this.layers=this.layers.filter(n=>n.id!==t.id),this.syncZOrder()}adoptChildren(t,e){for(let i of e)i.parentId=t.id;t.children=e,this.emitChanged(),this.onPropertyChanged?.()}adoptGroupChildren(t,e){let i=t.fabricObject.getObjects();t.children=i.map((s,n)=>{let a=e[n],o=new tr(a?.type??"shape",s,a?.name,a?.id);return o.parentId=t.id,a?.meta&&(o.meta=structuredClone(a.meta)),a&&!a.visible&&(o.visible=!1,s.visible=!1),a?.locked&&(o.locked=!0,s.selectable=!1,s.evented=!1),a&&a.opacity!==1&&(o.opacity=a.opacity,s.opacity=a.opacity),o}),this.emitChanged()}replaceObject(t,e){let i=this.get(t);if(!i||i.fabricObject===e)return!1;let s=i.fabricObject,n=this.canvas.getObjects().indexOf(s),a=this.canvas.getActiveObject()===s;return this.canvas.remove(s),i.fabricObject=e,e._layerId=t,e.set({visible:i.visible,opacity:i.opacity,selectable:!i.locked,evented:!i.locked,globalCompositeOperation:s.globalCompositeOperation}),this.canvas.insertAt(Math.max(0,n),e),i.renderProxy&&(e.set({opacity:0}),this.syncZOrder()),a&&this.canvas.setActiveObject(e),this.canvas.requestRenderAll(),this.events.emit("layer:modified",{layerId:t}),this.emitChanged(),this.onPropertyChanged?.(),!0}setRenderProxy(t,e){let i=this.get(t);!i||i.renderProxy===e||(i.renderProxy&&this.canvas.remove(i.renderProxy),i.renderProxy=e,e&&(e._layerId=t,e.set({visible:i.visible,opacity:i.opacity,selectable:!i.locked,evented:!i.locked,globalCompositeOperation:i.fabricObject.globalCompositeOperation}),this.canvas.add(e),this.syncZOrder()),this.canvas.requestRenderAll(),this.emitChanged())}syncZOrder(){for(let t of this.layers)this.canvas.bringObjectToFront(t.fabricObject),t.renderProxy&&this.canvas.bringObjectToFront(t.renderProxy)}siblingsOf(t){return t.parentId?this.get(t.parentId)?.children??this.layers:this.layers}reorder(t,e){let i=this.get(t);if(!i)return!1;let s=this.siblingsOf(i),n=s.indexOf(i);if(n===-1||!Number.isFinite(e))return!1;let a=Math.max(0,Math.min(s.length-1,Math.round(e)));if(n===a)return!1;let[o]=s.splice(n,1);if(s.splice(a,0,o),o.parentId){let l=this.get(o.parentId)?.fabricObject;l&&(l.remove(o.fabricObject),l.insertAt(a,o.fabricObject))}else this.syncZOrder();return this.events.emit("layer:reordered",{layerIds:s.map(l=>l.id)}),this.emitChanged(),this.onPropertyChanged?.(),!0}select(t){if(t===null)this.canvas.discardActiveObject(),this.exitGroups();else{let i=this.get(t);i&&(i.parentId?this.enterGroup(i.parentId):this.exitGroups(),this.canvas.setActiveObject(i.renderProxy??i.fabricObject))}this.canvas.requestRenderAll(),this.events.emit("layer:selected",{layerId:t});let e=t&&this.get(t)?[t]:[];this.events.emit("selection:changed",{selected:e})}enterGroup(t){let e=this.get(t);if(!e)return;let i=e.fabricObject;i.subTargetCheck=!0,i.interactive=!0}exitGroups(){for(let t of this.layers){if(t.type!=="group")continue;let e=t.fabricObject;e.interactive&&(e.interactive=!1)}}selectMany(t){let e=t.flatMap(s=>{let n=this.get(s);return n&&!n.parentId?[n]:[]});if(e.length===0)return this.select(null);if(e.length===1)return this.select(e[0].id);this.canvas.discardActiveObject(),this.exitGroups();let i=new Ye(e.map(s=>s.renderProxy??s.fabricObject),{canvas:this.canvas});this.canvas.setActiveObject(i),this.canvas.requestRenderAll(),this.events.emit("selection:changed",{selected:e.map(s=>s.id)})}*walk(t=this.layers){for(let e of t)yield e,e.children.length>0&&(yield*this.walk(e.children))}get(t){for(let e of this.walk())if(e.id===t)return e}getAll(){return[...this.layers]}getTree(){return this.layers.map(t=>t.toData())}findByObject(t){let e=t._layerId;if(e)return this.get(e);for(let i of this.walk())if(i.fabricObject===t)return i}setVisibility(t,e){let i=this.get(t);i&&i.visible!==e&&(i.visible=e,i.fabricObject.visible=e,i.renderProxy&&(i.renderProxy.visible=e),this.canvas.requestRenderAll(),this.emitChanged(),this.onPropertyChanged?.())}setLocked(t,e){let i=this.get(t);if(!i||i.locked===e)return;i.locked=e;let s=i.renderProxy??i.fabricObject;s.selectable=!e,s.evented=!e,this.canvas.requestRenderAll(),this.emitChanged(),this.onPropertyChanged?.()}setOpacity(t,e){let i=this.get(t);if(!i||!Number.isFinite(e))return;let s=Math.max(0,Math.min(1,e));i.opacity!==s&&(i.opacity=s,i.renderProxy?i.renderProxy.opacity=s:i.fabricObject.opacity=s,this.canvas.requestRenderAll(),this.emitChanged(),this.onPropertyChanged?.())}setName(t,e){let i=this.get(t);i&&i.name!==e&&(i.name=e,this.emitChanged(),this.onPropertyChanged?.())}setMeta(t,e){let i=this.get(t);if(!i)return;let s={...i.meta},n=!1;for(let[a,o]of Object.entries(e)){if(o===void 0){a in s&&(delete s[a],n=!0);continue}s[a]!==o&&(n=!0),s[a]=o}n&&(i.meta=s,this.emitChanged(),this.onPropertyChanged?.())}clear(){for(let t of this.layers)this.canvas.remove(t.fabricObject),t.renderProxy&&this.canvas.remove(t.renderProxy),t.children=[];this.layers=[],this.emitChanged()}count(){return this.layers.length}emitChanged(){this.events.emit("layers:changed",{layers:this.layers.map(t=>t.toData())})}};var rh=24;function bd(r){return typeof r.text=="string"}function xd(r,t){let e=new Map(r.parameters.map(s=>[s.key,s.label||s.key])),i=new Map;for(let s of r.svg.matchAll(/<text\b[^>]*>([\s\S]*?)<\/text>/g)){let n=/\{\{(\w+)(?:[|:]([^}]*))?\}\}/.exec(s[1]);if(!n)continue;let a=e.get(n[1]);if(!a)continue;let o=String(t[n[1]]??n[2]??"").trim();o&&i.set(o,a)}return i}function wd(r,t){let e=r.trim(),i=t.get(e);return i||(e?e.length>rh?`${e.slice(0,rh-1)}\u2026`:e:"Text")}function Cd(r){let t=r.id;if(typeof t=="string"&&t)return t;let e=r.type||"shape";return e.charAt(0).toUpperCase()+e.slice(1)}function Sd(r){return new Yt(r.text,{left:r.left,top:r.top,originX:r.originX,originY:r.originY,angle:r.angle,scaleX:r.scaleX,scaleY:r.scaleY,fontSize:r.fontSize,fontFamily:r.fontFamily,fontWeight:r.fontWeight,fontStyle:r.fontStyle,textAlign:r.textAlign,charSpacing:r.charSpacing,lineHeight:r.lineHeight,fill:r.fill,stroke:r.stroke,strokeWidth:r.strokeWidth,opacity:r.opacity,width:Math.max(1,(r.width??0)+2)})}function ra(r,t,e){if(r.id==="circular-text")return{arc:100,wave:0};if(r.id==="wave-text")return{arc:0,wave:50};let i=Number(t.radius??200);if(!Number.isFinite(i)||i<=0)return{arc:0,wave:0};let s=100*e/(Math.PI*i);return{arc:Math.max(-100,Math.min(100,s)),wave:0}}function as(r,t){let e=String(t.text??"Text"),i=r.id==="circular-text"?28:40,s=new Yt(e,{fontSize:i,fontFamily:String(t.font??"Arial"),fontWeight:"bold",fill:String(t.color??"#000000"),originX:"left",originY:"top",width:Math.max(1,e.length*i*.62)});return{type:"text",name:r.parameters.find(n=>n.key==="text")?.label||"Text",object:s,curve:ra(r,t,s.width??0)}}async function os(r,t,e){let i=xd(r,e),{objects:s}=await ql(t),n=[];for(let a of s)if(a!==null){if(bd(a)){n.push({type:"text",name:wd(a.text,i),object:Sd(a)});continue}n.push({type:"shape",name:Cd(a),object:a})}return n}var rr=class r{static ASSET_KEY="__canvasEditorHistoryAsset";undoStack=[];redoStack=[];assets=new Map;assetIds=new Map;nextAssetId=1;maxSize;maxBytes;paused=!1;debounceTimer=null;debounceMs;getState;restoreState;events;transactionDepth=0;transactionDirty=!1;constructor(t){this.getState=t.getState,this.restoreState=t.restoreState,this.events=t.events,this.maxSize=t.maxSize??50,this.maxBytes=t.maxBytes??50*1024*1024,this.debounceMs=t.debounceMs??300}save(){if(!this.paused){if(this.transactionDepth>0){this.transactionDirty=!0;return}this.debounceTimer&&clearTimeout(this.debounceTimer),this.debounceTimer=setTimeout(()=>{this.saveImmediate()},this.debounceMs),this.emitChanged()}}saveImmediate(){if(this.paused){this.cancelPending();return}if(this.transactionDepth>0){this.transactionDirty=!0;return}this.cancelPending();let t=this.getState(),e=this.compactState(t);if(this.undoStack.at(-1)===e){this.emitChanged();return}for(this.undoStack.push(e);this.undoStack.length>this.maxSize;)this.undoStack.shift();this.redoStack=[],this.trimToBudget(),this.events.emit("history:snapshot",{bytes:t.length*2,totalBytes:this.snapshotBytes(),entries:this.undoStack.length}),this.emitChanged()}beginTransaction(){this.transactionDepth===0&&this.debounceTimer&&this.saveImmediate(),this.transactionDepth+=1}endTransaction(){this.transactionDepth!==0&&(this.transactionDepth-=1,this.transactionDepth===0&&this.transactionDirty&&(this.transactionDirty=!1,this.saveImmediate()))}async transaction(t){this.beginTransaction();try{return await t()}finally{this.endTransaction()}}async undo(){this.cancelPending();let t=this.undoStack.at(-1);if(!t)return;let e=this.compactState(this.getState()),i=e===t;if(i&&this.undoStack.length<2)return;let s=i?this.undoStack[this.undoStack.length-2]:t;this.paused=!0;try{await this.restoreState(this.expandState(s)),i&&this.undoStack.pop(),this.redoStack.push(e),this.trimToBudget()}catch(n){throw this.events.emit("error",{message:"Failed to undo the last change",error:n}),n}finally{this.paused=!1,this.emitChanged()}}async redo(){this.cancelPending();let t=this.redoStack.at(-1);if(t){this.paused=!0;try{await this.restoreState(this.expandState(t)),this.redoStack.pop(),this.undoStack.at(-1)!==t&&this.undoStack.push(t),this.trimToBudget()}catch(e){throw this.events.emit("error",{message:"Failed to redo the last change",error:e}),e}finally{this.paused=!1,this.emitChanged()}}}isRestoring(){return this.paused}pause(){this.paused=!0}resume(){this.paused=!1}canUndo(){return this.undoStack.length>1||this.debounceTimer!==null}canRedo(){return this.redoStack.length>0}clear(){this.cancelPending(),this.undoStack=[],this.redoStack=[],this.assets.clear(),this.assetIds.clear(),this.emitChanged()}getSnapshotBytes(){return this.snapshotBytes()}cancelPending(){this.debounceTimer&&(clearTimeout(this.debounceTimer),this.debounceTimer=null)}dispose(){this.cancelPending(),this.transactionDepth=0,this.transactionDirty=!1,this.undoStack=[],this.redoStack=[],this.assets.clear(),this.assetIds.clear()}emitChanged(){this.events.emit("history:changed",{canUndo:this.canUndo(),canRedo:this.canRedo()})}snapshotBytes(){let t=[...this.undoStack,...this.redoStack].reduce((i,s)=>i+s.length*2,0),e=[...this.assets.values()].reduce((i,s)=>i+s.length*2,0);return t+e}trimToBudget(){for(this.pruneAssets();this.undoStack.length>1&&this.snapshotBytes()>this.maxBytes;)this.undoStack.shift(),this.pruneAssets();for(;this.redoStack.length>1&&this.snapshotBytes()>this.maxBytes;)this.redoStack.shift(),this.pruneAssets()}compactState(t){let e;try{e=JSON.parse(t)}catch{return t}let i=s=>{if(typeof s=="string"&&/^data:image\/(?:png|jpeg|webp);base64,/i.test(s)){let n=this.assetIds.get(s);return n||(n=`a${this.nextAssetId++}`,this.assetIds.set(s,n),this.assets.set(n,s)),{[r.ASSET_KEY]:n}}return Array.isArray(s)?s.map(i):!s||typeof s!="object"?s:Object.fromEntries(Object.entries(s).map(([n,a])=>[n,i(a)]))};return JSON.stringify(i(e))}expandState(t){let e;try{e=JSON.parse(t)}catch{return t}let i=s=>{if(Array.isArray(s))return s.map(i);if(!s||typeof s!="object")return s;let n=s,a=n[r.ASSET_KEY];if(typeof a=="string"&&Object.keys(n).length===1){let o=this.assets.get(a);if(!o)throw new Error(`Missing history raster asset: ${a}`);return o}return Object.fromEntries(Object.entries(n).map(([o,l])=>[o,i(l)]))};return JSON.stringify(i(e))}pruneAssets(){if(this.assets.size===0)return;let t=[...this.undoStack,...this.redoStack];for(let[e,i]of this.assets){let s=`"${r.ASSET_KEY}":"${e}"`;t.some(n=>n.includes(s))||(this.assets.delete(e),this.assetIds.delete(i))}}};var _d="#22c55e",ir=class{constructor(t,e){this.canvas=t;this.events=e;this.onMoving=i=>this.handleMoving(i.target),this.onAfterRender=()=>this.drawGuides(),this.onModified=()=>this.clearGuides(),this.canvas.on("object:moving",this.onMoving),this.canvas.on("after:render",this.onAfterRender),this.canvas.on("mouse:up",this.onModified),this.canvas.on("selection:cleared",this.onModified)}canvas;events;enabled=!1;threshold=8;guides=[];onMoving;onAfterRender;onModified;setEnabled(t){this.enabled!==t&&(this.enabled=t,t||this.clearGuides(),this.events.emit("snap:changed",{enabled:t}))}isEnabled(){return this.enabled}setThreshold(t){this.threshold=Math.max(0,t)}dispose(){this.canvas.off("object:moving",this.onMoving),this.canvas.off("after:render",this.onAfterRender),this.canvas.off("mouse:up",this.onModified),this.canvas.off("selection:cleared",this.onModified),this.guides=[]}handleMoving(t){if(!this.enabled||!t)return;t.setCoords();let e=t.getBoundingRect(),i=this.canvas.getWidth(),s=this.canvas.getHeight(),{xs:n,ys:a}=Td(this.canvas,t,i,s);this.guides=[];let o=ih([e.left,e.left+e.width/2,e.left+e.width],n,this.threshold);o!==null&&(t.set("left",(t.left??0)+o.delta),this.guides.push({x:o.line}));let l=ih([e.top,e.top+e.height/2,e.top+e.height],a,this.threshold);l!==null&&(t.set("top",(t.top??0)+l.delta),this.guides.push({y:l.line})),t.setCoords()}drawGuides(){if(!this.enabled||this.guides.length===0)return;let t=this.canvas.contextTop;if(!t)return;let e=this.canvas.getRetinaScaling(),i=this.canvas.getWidth(),s=this.canvas.getHeight();t.save(),t.setTransform(e,0,0,e,0,0),t.lineWidth=1,t.strokeStyle=_d,t.setLineDash([4,4]),t.beginPath();for(let n of this.guides)n.x!==void 0&&(t.moveTo(n.x,0),t.lineTo(n.x,s)),n.y!==void 0&&(t.moveTo(0,n.y),t.lineTo(i,n.y));t.stroke(),t.restore()}clearGuides(){this.guides.length!==0&&(this.guides=[],this.canvas.clearContext(this.canvas.contextTop))}};function Td(r,t,e,i){let s=[0,e/2,e],n=[0,i/2,i];for(let a of r.getObjects()){if(a===t||!a.visible)continue;a.setCoords();let o=a.getBoundingRect();s.push(o.left,o.left+o.width/2,o.left+o.width),n.push(o.top,o.top+o.height/2,o.top+o.height)}return{xs:s,ys:n}}function ih(r,t,e){let i=null;for(let s of r)for(let n of t){let a=Math.abs(s-n);a<=e&&(i===null||a<i.dist)&&(i={delta:n-s,line:n,dist:a})}return i?{delta:i.delta,line:i.line}:null}function Y(r,t,e){return Math.min(e,Math.max(t,r))}function et(r){return Math.round(r*100)/100}var sr=class{constructor(t,e,i){this.canvas=t;this.history=e;this.events=i;this.onSelectionCleared=()=>{this.session&&this.cancel()},this.canvas.on("selection:cleared",this.onSelectionCleared)}canvas;history;events;session=null;onSelectionCleared;isActive(){return this.session!==null}activeLayerId(){return this.session?.layerId??null}start(t){if(t.type!=="image")return;this.session&&this.cancel();let e=t.fabricObject,i=e.angle??0;i&&e.rotate(0),e.setCoords();let s=e.getBoundingRect(),n=new V({left:s.left,top:s.top,width:s.width,height:s.height,originX:"left",originY:"top",fill:"rgba(34,197,94,0.12)",stroke:sh,strokeWidth:1,strokeDashArray:[4,4],strokeUniform:!0,lockRotation:!0,cornerColor:sh,transparentCorners:!1});n.setControlsVisibility({mtr:!1});let a=e.selectable??!0,o=e.evented??!0;e.selectable=!1,e.evented=!1,this.canvas.add(n),this.canvas.setActiveObject(n),this.canvas.requestRenderAll(),this.session={layerId:t.id,image:e,rect:n,prevSelectable:a,prevEvented:o,prevAngle:i},this.events.emit("crop:changed",{active:!0,layerId:t.id})}apply(){let t=this.session;if(!t)return;let{image:e,rect:i}=t;i.setCoords(),e.setCoords();let s=e.scaleX??1,n=e.scaleY??1,a=e.left??0,o=e.top??0,l=e.getElement(),h=l.naturalWidth||e.width||0,c=l.naturalHeight||e.height||0,u=(e.cropX??0)+(i.left-a)/s,d=(e.cropY??0)+(i.top-o)/n,g=i.getScaledWidth()/s,p=i.getScaledHeight()/n;u=Y(u,0,Math.max(0,h-1)),d=Y(d,0,Math.max(0,c-1)),g=Y(g,1,h-u),p=Y(p,1,c-d),e.set({cropX:u,cropY:d,width:g,height:p,left:a+(u-(e.cropX??0))*s,top:o+(d-(e.cropY??0))*n}),e.setCoords(),t.prevAngle&&(e.rotate(t.prevAngle),e.setCoords()),this.finish(),this.history.save()}cancel(){let t=this.session;t&&(t.prevAngle&&(t.image.rotate(t.prevAngle),t.image.setCoords()),this.finish())}dispose(){this.cancel(),this.canvas.off("selection:cleared",this.onSelectionCleared)}finish(){let t=this.session;t&&(this.session=null,this.canvas.remove(t.rect),t.image.selectable=t.prevSelectable,t.image.evented=t.prevEvented,this.canvas.setActiveObject(t.image),this.canvas.requestRenderAll(),this.events.emit("crop:changed",{active:!1,layerId:null}))}},sh="#22c55e";var _e=.5,kd=1e5,nh=1.1,Od=8,Md=24;function Pd(r){let t=r.width;try{r.set({width:kd}),r.initDimensions?.();let e=r.calcTextWidth?.()??t;return Number.isFinite(e)&&e>0?e:t}finally{r.set({width:t}),r.initDimensions?.()}}function ut(r){if(!r)return null;let t=r;return typeof t.text=="string"&&typeof t.calcTextWidth=="function"?t:null}function nr(r){let t=Math.max(0,r.width??0),e=r.calcTextWidth?.()??t,i=Math.max(1,Math.min(t,Number.isFinite(e)?e:t)),s=(t-i)/2,n=r.textAlign??"left";if(n.includes("center"))return{width:i,dx:0};let a=r.flipX?-1:1;return{width:i,dx:a*(n.includes("right")?s:-s)}}function Se(r,t){r.set({width:t}),r.initDimensions?.();let e=r.text.split(`
|
|
505
505
|
`).length;return(r._textLines?.length??0)>e}function Ed(r,t){if(!Se(r,t))return t;let e=t,i=t,s=!1;for(let n=0;n<Od;n+=1)if(e=i,i=i*nh+1,!Se(r,i)){s=!0;break}if(!s)return i;for(let n=0;n<Md&&i-e>_e;n+=1){let a=(e+i)/2;Se(r,a)?e=a:i=a}return r.width!==i&&Se(r,i),i}function Ad(r,t){try{r.set({width:t}),r.initDimensions?.()}catch{}}function Dd(r,t){if(Se(r,t))return!1;let e=Se(r,t-_e);return Se(r,t),e}function ls(r){let t=ut(r);if(!t||t.path)return!1;let e=t.width;try{let i=nr(t),s=Pd(t)+_e;if(Math.abs(s-e)<_e||e>s&&e<=s*nh+1&&Dd(t,e))return!1;let a=t.getCenterPoint(),o=Ed(t,s),l=nr(t),h=(i.dx-l.dx)*(t.scaleX??1),c=(t.angle??0)*Math.PI/180,u=new v(a.x+h*Math.cos(c),a.y+h*Math.sin(c));return t.setPositionByOrigin(u,"center","center"),t.setCoords(),t.dirty=!0,Math.abs(o-e)>=_e}catch(i){throw Ad(t,e),i}}function hs(r,t,e,i,s,n){let a=n??{x:t/2,y:e/2},l=jd(a,t,e)*2,h=Math.max(1,l/200),c=Math.max(h,i*(1+r.horizontalSpacing/100)),u=Math.max(h,s*(1+r.verticalSpacing/100)),d=Math.ceil(l/c)+2,g=Math.ceil(l/u)+2,[p,f]=ah(r.horizontalLimit,Math.ceil(d/2)),[y,b]=ah(r.verticalLimit,Math.ceil(g/2)),x=c*(oh(r.offsetX)/100),w=u*(oh(r.offsetY)/100),S=[];for(let C=y;C<=b;C++)for(let k=p;k<=f;k++){let T=k*c+x,O=C*u+w;r.mode==="brick-horizontal"&&lh(C)===1?T+=c*(r.horizontalOffset/100):r.mode==="brick-vertical"&&lh(k)===1&&(O+=u*(r.horizontalOffset/100));let M=(k*r.rotationStepH+C*r.rotationStepV)*Math.PI/180;S.push({x:T,y:O,rotation:M})}return S}function ar(r,t,e,i,s,n,a,o,l){let h=o??{x:i/2,y:s/2},c=l&&l.width>0?l.width:n,u=l&&l.height>0?l.height:a;r.save(),r.translate(h.x,h.y),r.rotate(e.angle*Math.PI/180);for(let d of hs(e,i,s,n,a,h))r.save(),r.translate(d.x,d.y),r.rotate(d.rotation),r.drawImage(t,-c/2,-u/2,c,u),r.restore();r.restore()}function ah(r,t){let e=Number.isFinite(r)?Math.floor(r):0;if(!e||e<=0)return[-t,t];let i=-Math.floor((e-1)/2);return[i,i+e-1]}function jd(r,t,e){let i=Math.max(Math.abs(r.x),Math.abs(t-r.x)),s=Math.max(Math.abs(r.y),Math.abs(e-r.y));return Math.sqrt(i*i+s*s)}function oh(r){return typeof r!="number"||!Number.isFinite(r)?0:Math.max(-100,Math.min(100,r))}function lh(r){return(r%2+2)%2}var Ld=16e6,Fd=8,Id=2,hh=2,oe=class r extends z{static type="TiledPattern";source;config;area;snapshotEl=null;snapshotScale=0;constructor(t,e,i){super({originX:"center",originY:"center",objectCaching:!1,lockScalingFlip:!0}),this.source=t,this.config=e,this.area=i,this.setControlsVisibility({ml:!1,mr:!1,mt:!1,mb:!1}),this.syncBox()}setConfig(t){this.config=t,this.syncBox()}setArea(t){this.area=t,this.invalidate(),this.syncBox()}invalidate(){this.snapshotEl=null,this.snapshotScale=0,this.dirty=!0}dispose(){this.snapshotEl=null,this.snapshotScale=0}syncBox(){let{tileW:t,tileH:e}=this.baseTile(),i=this.source.getCenterPoint().add(this.inkOffset()),s=this.anchorFromOrigin(i,t,e,this.config.angle);this.set({left:s.x,top:s.y,width:t,height:e,scaleX:1,scaleY:1,angle:this.config.angle}),this.setCoords(),this.dirty=!0}liveAngle(){return this.angle??0}liveScale(){return(this.config.scale??100)*Math.abs(this.scaleX??1)}liveOrigin(){let{tileW:t,tileH:e}=this.liveTile(),i=this.getCenterPoint(),s=this.shiftVector(t,e,this.liveAngle()),n=this.inkOffset();return new v(i.x-s.x-n.x,i.y-s.y-n.y)}_render(t){let{width:e,height:i}=this.area;if(e<=0||i<=0)return;let{tileW:s,tileH:n}=this.liveTile(),a=Bd(t),o=this.ensureSnapshot(a*(s/Math.max(1,this.baseW())));if(!o)return;let l=this.getCenterPoint(),h=this.liveAngle();t.save(),t.scale(1/(this.scaleX||1),1/(this.scaleY||1)),t.rotate(-h*Math.PI/180),t.translate(-l.x,-l.y);let c={x:l.x,y:l.y},u={...this.config,angle:h,offsetX:0,offsetY:0};ar(t,o,u,e,i,s,n,c,this.drawSize(s,n,hh/a)),t.restore()}_toSVG(){let{width:t,height:e}=this.area;if(t<=0||e<=0)return[];let i=document.createElement("canvas");i.width=Math.max(1,Math.round(t)),i.height=Math.max(1,Math.round(e));let s=i.getContext("2d");if(!s)return[];let{tileW:n,tileH:a}=this.liveTile(),o=this.ensureSnapshot(n/Math.max(1,this.baseW()));if(!o)return[];let l=this.getCenterPoint(),h=this.liveAngle();return ar(s,o,{...this.config,angle:h,offsetX:0,offsetY:0},t,e,n,a,{x:l.x,y:l.y},this.drawSize(n,a,hh)),[`<g transform="rotate(${-h}) translate(${-l.x} ${-l.y})">`,`<image x="0" y="0" width="${t}" height="${e}" `,`xlink:href="${i.toDataURL("image/png")}"></image></g>
|
|
506
506
|
`]}toObject(){let t=super.toObject();return delete t.source,t}clone(){let t=new r(this.source,this.config,this.area);return t.set({left:this.left,top:this.top,angle:this.angle,scaleX:this.scaleX,scaleY:this.scaleY,width:this.width,height:this.height,visible:this.visible,opacity:this.opacity}),Promise.resolve(t)}sourceBox(){let t=ut(this.source),e=Rd(this.source),i=this.source.getBoundingRect();if(e&&!t)return{width:i.width,height:i.height};let s={};e||(s.strokeWidth=0),t&&(s.width=nr(t).width);let n=this.source._getTransformedDimensions(s),a=(this.source.angle??0)*Math.PI/180,o=Math.abs(Math.cos(a)),l=Math.abs(Math.sin(a));return{width:n.x*o+n.y*l,height:n.x*l+n.y*o}}inkOffset(){let t=ut(this.source);if(!t)return new v(0,0);let{dx:e}=nr(t);if(!e)return new v(0,0);let i=e*(this.source.scaleX??1),s=(this.source.angle??0)*Math.PI/180;return new v(i*Math.cos(s),i*Math.sin(s))}baseW(){return Math.max(1,this.sourceBox().width)}baseH(){return Math.max(1,this.sourceBox().height)}drawSize(t,e,i=0){let s=this.snapshotEl;return!s||this.snapshotScale<=0?{width:t+i,height:e+i}:{width:s.width/this.snapshotScale*(t/this.baseW())+i,height:s.height/this.snapshotScale*(e/this.baseH())+i}}baseTile(){let t=this.sourceBox(),e=Math.max(1,this.config.scale??100)/100,i=this.tileFloor();return{tileW:Math.max(i,t.width*e),tileH:Math.max(i,t.height*e)}}liveTile(){let t=this.baseTile(),e=this.tileFloor();return{tileW:Math.max(e,t.tileW*Math.abs(this.scaleX??1)),tileH:Math.max(e,t.tileH*Math.abs(this.scaleY??1))}}tileFloor(){let{width:t,height:e}=this.area;return Math.max(2,Math.sqrt(t*t+e*e)/200)}shiftVector(t,e,i){let s=t*(ch(this.config.offsetX)/100),n=e*(ch(this.config.offsetY)/100),a=i*Math.PI/180,o=Math.cos(a),l=Math.sin(a);return new v(s*o-n*l,s*l+n*o)}anchorFromOrigin(t,e,i,s){let n=this.shiftVector(e,i,s);return new v(t.x+n.x,t.y+n.y)}ensureSnapshot(t){let e=this.clampScale(t);if(!(this.source.dirty||!this.snapshotEl||this.snapshotScale<e||this.snapshotScale>e*Id))return this.snapshotEl;let s=this.source,n=s.opacity;s.opacity=1;let a=ut(s),o=a?.width,l=a?nr(a).width+_e:0,h=a!==null&&o!==void 0&&l<o;try{h&&a&&(a.set({width:l}),a.initDimensions?.());let c=s.toCanvasElement({multiplier:e,enableRetinaScaling:!1});if(!c.width||!c.height)return null;this.snapshotEl=c,this.snapshotScale=e}catch{return this.snapshotEl}finally{s.opacity=n,h&&a&&o!==void 0&&(a.set({width:o}),a.initDimensions?.()),s.dirty=!1}return this.snapshotEl}clampScale(t){let e=Math.min(Fd,Math.max(.05,t)),i=this.source.getBoundingRect(),s=Math.max(1,i.width*i.height),n=Math.sqrt(Ld/s);return Math.max(.05,Math.min(e,n))}};function Rd(r){if(!r.strokeWidth||r.strokeWidth<=0)return!1;let{stroke:t}=r;return typeof t=="string"?t!==""&&t!=="transparent":t!=null}function ch(r){return typeof r!="number"||!Number.isFinite(r)?0:Math.max(-100,Math.min(100,r))}function Bd(r){if(typeof r.getTransform!="function")return 1;try{let t=r.getTransform();return Math.max(Math.hypot(t.a,t.b),Math.hypot(t.c,t.d),.05)}catch{return 1}}var Xd=10,Wd=300,Te=class{constructor(t,e,i,s){this.canvas=t;this.layers=e;this.history=i;this.events=s;this.canvas.on("object:modified",this.onObjectModified),this.canvas.on("text:changed",this.onSourceModified),this.events.on("layer:removed",this.onLayerRemoved)}canvas;layers;history;events;proxies=new Map;onObjectModified=t=>{let e=t.target;e instanceof oe?this.commitGesture(e):this.invalidateFor(e)};onSourceModified=t=>{this.invalidateFor(t.target)};onLayerRemoved=({layerId:t})=>{let e=this.proxies.get(t);e&&(e.dispose(),this.proxies.delete(t))};isPattern(t){return!!this.layers.get(t)?.meta.pattern}getConfig(t){return this.layers.get(t)?.meta.pattern?.config??null}async apply(t,e){let i=this.layers.get(t);if(i)try{this.layers.setMeta(t,{pattern:{config:e}});let s=this.proxies.get(t);s?(s.setConfig(e),this.canvas.requestRenderAll()):this.attach(i,e),this.history.save()}catch(s){throw this.events.emit("error",{message:"Failed to apply pattern",error:s}),s}}async disable(t){let e=this.layers.get(t);if(e?.meta.pattern)try{this.detach(t),si(e.fabricObject,e.meta.pattern.originalLocks),e.fabricObject.set({opacity:e.opacity,selectable:!e.locked,evented:!e.locked}),this.layers.setMeta(t,{pattern:void 0}),this.canvas.requestRenderAll(),this.history.save()}catch(i){throw this.events.emit("error",{message:"Failed to clear pattern",error:i}),i}}async rehydrateAll(){this.clearProxies();for(let t of this.layers.getAll()){let e=t.meta.pattern;if(e)try{Gd(e)&&(await Hd(t,e),this.layers.setMeta(t.id,{pattern:{config:e.config}})),this.attach(t,e.config)}catch(i){this.events.emit("error",{message:"Failed to restore pattern layer",error:i})}}this.canvas.requestRenderAll()}syncArea(){let t=this.area();for(let e of this.proxies.values())e.setArea(t);this.proxies.size>0&&this.canvas.requestRenderAll()}invalidate(t){let e=this.proxies.get(t);e&&(e.invalidate(),e.syncBox(),this.canvas.requestRenderAll())}attachTo(t){let e=t.meta.pattern;!e||this.proxies.has(t.id)||this.attach(t,e.config)}dispose(){this.canvas.off("object:modified",this.onObjectModified),this.canvas.off("text:changed",this.onSourceModified),this.events.off("layer:removed",this.onLayerRemoved),this.clearProxies()}clearProxies(){for(let t of this.proxies.values())t.dispose();this.proxies.clear()}attach(t,e){let i=new oe(t.fabricObject,e,this.area()),s=this.canvas.getActiveObject()===t.fabricObject;t.fabricObject.set({opacity:0,selectable:!1,evented:!1}),this.proxies.set(t.id,i),this.layers.setRenderProxy(t.id,i),s&&this.canvas.setActiveObject(i),this.canvas.requestRenderAll()}commitGesture(t){let e=this.layers.findByObject(t),i=e?.meta.pattern;if(!e||!i)return;let s=t.liveOrigin(),n=Yd(t.liveScale(),Xd,Wd),a=$d(t.liveAngle());e.fabricObject.setPositionByOrigin(s,"center","center"),e.fabricObject.setCoords();let o={...i.config,scale:n,angle:a};this.layers.setMeta(e.id,{pattern:{...i,config:o}}),t.setConfig(o),this.canvas.requestRenderAll(),this.history.save()}area(){return{width:this.canvas.getWidth(),height:this.canvas.getHeight()}}detach(t){let e=this.proxies.get(t);if(!e){this.layers.setRenderProxy(t,null);return}this.layers.setRenderProxy(t,null),e.dispose(),this.proxies.delete(t)}invalidateFor(t){if(!t)return;let e=this.layers.findByObject(t);e&&this.invalidate(e.id)}};function Yd(r,t,e){return Number.isFinite(r)?Math.max(t,Math.min(e,r)):t}function $d(r){if(!Number.isFinite(r))return 0;let t=(r%360+360)%360;return Math.round(t>180?t-360:t)}function Gd(r){return typeof r.originalSrc=="string"&&r.originalSrc.length>0}async function Hd(r,t){let e=r.fabricObject;typeof e.setSrc!="function"||!t.original||(await e.setSrc(t.originalSrc),e.set({left:t.original.left,top:t.original.top,scaleX:t.original.scaleX,scaleY:t.original.scaleY,width:t.original.width,height:t.original.height,cropX:t.original.cropX,cropY:t.original.cropY,angle:t.original.angle}),e.clipPath=t.originalClip?(await tt.enlivenObjects([t.originalClip]))[0]:void 0,si(e,t.originalLocks),e.setCoords())}function si(r,t){r.set(t??{lockMovementX:!1,lockMovementY:!1,lockScalingX:!1,lockScalingY:!1,lockRotation:!1,hasControls:!0})}var cs={shape:"arc",arc:0,wave:0,waveLength:4.1,offset:0,centerOffset:0},uh=.5,zd=99.5,Nd=.12,Vd=.9,Ud=1,qd=12,Kd=6,Jd=4e3;function ni(r){return Math.round(r*100)/100}function ke(r){let t=Y(r.arc??0,-100,100),e=Y(r.wave??0,0,100),i=Math.abs(t)<uh&&e>0?"wave":"arc";return{shape:r.shape??i,arc:t,wave:e,waveLength:Y(r.waveLength??cs.waveLength,Ud,qd),offset:Y(r.offset??0,-100,100),centerOffset:Y(r.centerOffset??0,-100,100)}}function us(r){return r.shape==="arc"?Math.abs(r.arc)>=uh:r.wave>0}function Zd(r,t){let e=Math.min(100,Math.abs(t.arc)),i=t.arc<0?-1:1,s=e>=zd?Math.PI*2:Math.max(Nd,e/100*Math.PI),n=r/s,a=n*Math.pow(2,t.centerOffset/100),o=a>=n?s:Math.min(Math.PI*2,r/Math.max(a,.001));return{radius:a,sweep:o,direction:i,baseRadius:n}}function Qd(r,t,e,i){let{sweep:s,direction:n,baseRadius:a}=t,o=s>=Math.PI*2-1e-6,l=r/2,h=y=>[l+e*Math.sin(y),n*(a-e*Math.cos(y))],c=n>0?1:0,u=([y,b])=>`${ni(y)} ${ni(b)}`,d=ni(e);if(o){let y=h(i-Math.PI),b=h(i);return{data:[`M ${u(y)}`,`A ${d} ${d} 0 0 ${c} ${u(b)}`,`A ${d} ${d} 0 0 ${c} ${u(y)}`].join(" "),length:e*Math.PI*2}}let g=h(i-s/2),p=h(i+s/2),f=s>Math.PI?1:0;return{data:`M ${u(g)} A ${d} ${d} 0 ${f} ${c} ${u(p)}`,length:e*s}}function tg(r,t,e,i){let s=e.wave/100*t*Vd,n=Math.max(1,t*e.waveLength),a=e.offset/100*Math.PI*2,o=Math.min(Kd,n/8),l=Math.min(Jd,Math.max(2,Math.ceil(r/o))),h=[],c=0,u=null;for(let d=0;d<=l;d++){let g=r*d/l,p=i+s*Math.sin(g/n*Math.PI*2+a);u&&(c+=Math.hypot(g-u[0],p-u[1])),u=[g,p],h.push(`${d===0?"M":"L"} ${ni(g)} ${ni(p)}`)}return{data:h.join(" "),length:c}}function or(r,t,e,i=1,s=0){let n=ke(r);if(!us(n))return null;let a=Math.max(1,Math.floor(i)),o=[];if(n.shape==="wave"){for(let c=0;c<a;c++)o.push(tg(t,e,n,(c-(a-1)/2)*s));return o}let l=Zd(t,n),h=n.offset/100*l.sweep;for(let c=0;c<a;c++){let u=Math.max(1,l.radius+(c-(a-1)/2)*s);o.push(Qd(t,l,u,h))}return o}function ia(r,t,e){return or(r,t,e)?.[0]??null}var eg=1e5,rg=.06,ig=1.16,sa=new WeakMap,ds=new WeakMap,gs=new WeakMap,sg=.7;function ng(r){let t=r._textLines?.length??0;for(let n=0;n<t;n+=1)r.getLineWidth?.(n);let e=r.__charBounds;if(!e?.length)return null;let i=0,s=0;for(let n of e)for(let a of n??[]){let{renderLeft:o,renderTop:l}=a;if(typeof o!="number"||typeof l!="number")continue;let h=(a.kernedWidth??a.width??0)/2,c=(a.height??r.fontSize)*sg,u=a.angle??0,d=Math.abs(Math.cos(u)),g=Math.abs(Math.sin(u));i=Math.max(i,Math.abs(o)+h*d+c*g),s=Math.max(s,Math.abs(l)+h*g+c*d)}return i===0&&s===0?null:{width:i*2,height:s*2}}function ag(r){let t=ng(r);t&&(t.width>(r.width??0)&&(r.width=t.width),t.height>(r.height??0)&&(r.height=t.height))}function dh(r){return!!r&&typeof r.text=="string"}function og(r){let t=r.width;try{return r.set({width:eg}),r.initDimensions?.(),Math.max(1,r.calcTextWidth?.()??r.width??1)}finally{t!==void 0&&r.set({width:t}),r.initDimensions?.()}}function lg(r){return Math.max(1,r._textLines?.length??1)}function hg(r){let t=r.getHeightOfLine?.(0);return typeof t=="number"&&Number.isFinite(t)&&t>0?t:r.fontSize*(r.lineHeight??1)*ig}function gh(r){return new Xt(r.data,{visible:!1,objectCaching:!1})}var lr=class{constructor(t,e,i,s){this.canvas=t;this.layers=e;this.history=i;this.events=s;this.canvas.on("text:changed",this.onTextChanged)}canvas;layers;history;events;onTextChanged=t=>{let e=t.target?this.layers.findByObject(t.target):void 0;e?.meta.curve&&this.refresh(e.id,!1)};dispose(){this.canvas.off("text:changed",this.onTextChanged)}get(t){let e=this.layers.get(t);return!e||!dh(e.fabricObject)?null:ke(e.meta.curve??{})}isCurved(t){let e=this.get(t);return!!e&&us(e)}apply(t,e,i=!0){let s=this.layers.get(t);if(!s||!dh(s.fabricObject))return!1;let n=ke(e),a=s.fabricObject,o=og(a);if(!us(n))this.detach(a,s.meta.curveWidth),delete s.meta.curveWidth,s.meta.curve=n;else{s.meta.curveWidth===void 0&&(s.meta.curveWidth=a.width??0),a.set({width:Math.max(s.meta.curveWidth,o+2)}),a.initDimensions?.();let l=or(n,o*(1+rg),a.fontSize,lg(a),hg(a));l&&this.attach(a,l),s.meta.curve=n}return a.initDimensions?.(),a.setCoords(),a.dirty=!0,this.canvas.requestRenderAll(),this.events.emit("layer:modified",{layerId:t}),i&&this.history.save(),!0}clear(t,e=!0){let s=this.layers.get(t)?.meta.curve?.shape;return this.apply(t,{shape:s},e)}refresh(t,e=!1){let i=this.layers.get(t)?.meta.curve;return i?this.apply(t,i,e):!1}refreshAll(){let t=e=>{for(let i of e)i.meta.curve&&this.refresh(i.id),i.children.length>0&&t(i.children)};t(this.layers.getAll())}attach(t,e){gs.has(t)||gs.set(t,t.objectCaching),t.set({objectCaching:!1});let i=e.map(gh),s=i.length===1?i[0]:gh({data:e.map(n=>n.data).join(" "),length:0});t.set({path:s,pathAlign:"center",pathSide:"left",pathStartOffset:0}),this.patchLineMeasure(t,i,s),this.patchDimensions(t)}patchDimensions(t){if(ds.has(t))return;let e=t.initDimensions;if(typeof e!="function")return;let i=function(){e.call(this),ag(this)},s=Object.prototype.hasOwnProperty.call(t,"initDimensions");t.initDimensions=i,ds.set(t,{original:e,installed:i,ownedOriginal:s})}unpatchDimensions(t){let e=ds.get(t);e&&(t.initDimensions===e.installed&&(e.ownedOriginal?t.initDimensions=e.original:delete t.initDimensions),ds.delete(t))}patchLineMeasure(t,e,i){this.unpatchLineMeasure(t);let s=t._measureLine;if(typeof s!="function")return;for(let o of e)o.pathOffset=i.pathOffset;let n=function(o){let l=e[o];if(!l)return s.call(this,o);let h=this.path,c=this.textAlign;this.path=l,this.textAlign="center",this.setPathInfo?.();try{return s.call(this,o)}finally{this.path=h,this.textAlign=c}},a=Object.prototype.hasOwnProperty.call(t,"_measureLine");t._measureLine=n,sa.set(t,{original:s,installed:n,ownedOriginal:a})}unpatchLineMeasure(t){let e=sa.get(t);e&&(t._measureLine===e.installed&&(e.ownedOriginal?t._measureLine=e.original:delete t._measureLine),sa.delete(t))}detach(t,e){this.unpatchLineMeasure(t),this.unpatchDimensions(t);let i=gs.get(t);i!==void 0&&(t.set({objectCaching:i}),gs.delete(t)),t.set({path:null,pathStartOffset:0}),e!==void 0&&e>0&&t.set({width:e})}};var ph=/[ \t\r]/;function ps(r){let t=[],e=0,i=!0;for(;e<r.length;){let s="";for(;e<r.length&&ph.test(r[e]);)s+=r[e],e+=1;let n="";for(;e<r.length&&!ph.test(r[e]);)n+=r[e],e+=1;t.push((i?s:s.slice(1))+n),i=!1}return t.length>0?t:[""]}function bt(r){return r.calcTransformMatrix()}function Oe(r,t){let e=tt.qrDecompose(t);r.set({flipX:!1,flipY:!1,originX:"center",originY:"center",left:e.translateX,top:e.translateY,scaleX:e.scaleX,scaleY:e.scaleY,angle:e.angle,skewX:e.skewX,skewY:0}),r.setCoords()}function Me(r,t){Oe(r,tt.multiplyTransformMatrices(bt(t),bt(r)))}function Ut(r,t){Oe(r,tt.multiplyTransformMatrices(tt.invertTransform(bt(t)),bt(r)))}function na(r,t){return tt.multiplyTransformMatrices(tt.invertTransform(bt(t)),bt(r))}function aa(r,t,e){Oe(r,tt.multiplyTransformMatrices(bt(t),e))}function oa(r){return!r||r.length!==6||r.some(t=>!Number.isFinite(t))?null:[r[0],r[1],r[2],r[3],r[4],r[5]]}function Pe(r,t,e=1){let i=Math.max(1,t.width)*e,s=Math.max(1,t.height)*e;r.set({originX:"center",originY:"center",angle:0,skewX:0,skewY:0,left:t.left+t.width/2,top:t.top+t.height/2,scaleX:i/Math.max(1,r.width??1),scaleY:s/Math.max(1,r.height??1)}),r.setCoords()}function ai(r){let t=r.removeAll();for(let e of t)e.setCoords();return t}function ug(r){Object.prototype.hasOwnProperty.call(r,"wordSplit")||Object.defineProperty(r,"wordSplit",{value:ps,configurable:!0,writable:!0})}function dg(r){Object.prototype.hasOwnProperty.call(r,"wordSplit")&&delete r.wordSplit}function oi(r){return{wrap:r?.wrap??"none",overflow:r?.overflow??"visible"}}function gg(r,t){return t({width:Math.max(1,r.width??1),height:Math.max(1,r.height??1),originX:"center",originY:"center",left:0,top:0,objectCaching:!1})}function pg(r){return!!r.maskPreset||(r.maskStack?.length??0)>0}function la(r,t,e=i=>new V(i)){let i=ut(r);if(!i)return;let s=oi(t);i.path||(i.set({splitByGrapheme:s.wrap==="break-all"}),s.wrap==="pre-wrap"?ug(i):dg(i),i.initDimensions?.());let n=s.overflow==="hidden"?gg(i,e):void 0;if(t&&pg(t)){let a=i.clipPath;a&&(n&&Ut(n,a),a.clipPath=n)}else i.clipPath=n}var hr=class{constructor(t,e,i,s){this.canvas=t;this.layers=e;this.history=i;this.events=s;this.canvas.on("text:changed",this.onTextChanged),this.events.on("masks:changed",this.onMasksChanged)}canvas;layers;history;events;onTextChanged=t=>{let e=t.target?this.layers.findByObject(t.target):void 0;e&&this.refresh(e.id,!1)};onMasksChanged=({target:t})=>{this.refresh(t)};dispose(){this.canvas.off("text:changed",this.onTextChanged),this.events.off("masks:changed",this.onMasksChanged)}get(t){let e=this.layers.get(t);return!e||!ut(e.fabricObject)?null:oi(e.meta)}apply(t,e,i=!0){let s=this.layers.get(t),n=s?ut(s.fabricObject):null;if(!s||!n)return!1;if(e==="none"){let a=!!n.path;s.meta.wrapWidth===void 0&&!a&&(s.meta.wrapWidth=n.width??0)}return s.meta.wrap=e,this.derive(t,i)}setOverflow(t,e,i=!0){let s=this.layers.get(t);return!s||!ut(s.fabricObject)?!1:(s.meta.overflow=e,this.derive(t,i))}clear(t,e=!0){let i=this.layers.get(t);return!i||!ut(i.fabricObject)?!1:(delete i.meta.overflow,this.apply(t,"none",e))}refresh(t,e=!1){let i=this.layers.get(t);return!i||!ut(i.fabricObject)?!1:this.derive(t,e)}refreshAll(){let t=e=>{for(let i of e)ut(i.fabricObject)&&this.refresh(i.id),i.children.length>0&&t(i.children)};t(this.layers.getAll())}derive(t,e){let i=this.layers.get(t),s=i?ut(i.fabricObject):null;if(!i||!s)return!1;let n=oi(i.meta);return s.path||(n.wrap==="none"?ls(s):i.meta.wrapWidth!==void 0&&(s.set({width:i.meta.wrapWidth}),delete i.meta.wrapWidth)),la(s,i.meta),s.dirty=!0,s.setCoords(),this.canvas.requestRenderAll(),e&&(this.events.emit("layer:modified",{layerId:t}),this.history.save()),!0}};var fs=["circle","square","triangle","star","heart","octagram","arch","zigzag"];function cr(r){return typeof r=="string"&&fs.includes(r)}function ha(r,t,e,i=-Math.PI/2){let s=Math.PI/r,n=[];for(let a=0;a<r*2;a++){let o=a%2===0?t:e,l=i+a*s,h=50+Math.cos(l)*o,c=50+Math.sin(l)*o;n.push(`${a===0?"M":"L"} ${fh(h)} ${fh(c)}`)}return`${n.join(" ")} Z`}function fh(r){return Math.round(r*100)/100}var fg={circle:"M 96 50 A 46 46 0 1 1 4 50 A 46 46 0 1 1 96 50 Z",square:"M 4 4 H 96 V 96 H 4 Z",triangle:"M 50 4 L 96 96 L 4 96 Z",star:ha(5,46,22),heart:"M 50 96 C -8 55 12 4 50 28 C 88 4 108 55 50 96 Z",octagram:ha(8,46,27),arch:"M 4 96 V 50 A 46 46 0 0 1 96 50 V 96 Z",zigzag:ha(16,46,39)};function li(r){return fg[r]}var ur=100;var ms=["vignette","halftone","spray","grunge","torn","band"];function hi(r){return typeof r=="string"&&ms.includes(r)}var It=320,ua=new Map;function ca(r){let t=r;return()=>(t=t*16807%2147483647,(t-1)/2147483646)}function mh(r,t,e,i){let s=It,n=[[i,i],[s-i,i],[s-i,s-i],[i,s-i]];r.beginPath();for(let a=0;a<n.length;a++){let[o,l]=n[a],[h,c]=n[(a+1)%n.length];for(let u=0;u<=26;u++){let d=u/26,g=o+(h-o)*d+(t()-.5)*e,p=l+(c-l)*d+(t()-.5)*e;a===0&&u===0?r.moveTo(g,p):r.lineTo(g,p)}}r.closePath(),r.fill()}function mg(r,t){let e=It,i=e/2;switch(t.fillStyle="#ffffff",r){case"vignette":{let s=t.createRadialGradient(i,i,e*.18,i,i,e*.52);s.addColorStop(0,"rgba(255,255,255,1)"),s.addColorStop(1,"rgba(255,255,255,0)"),t.fillStyle=s,t.fillRect(0,0,e,e);return}case"band":{let s=t.createLinearGradient(0,0,0,e);s.addColorStop(0,"rgba(255,255,255,0)"),s.addColorStop(.25,"rgba(255,255,255,1)"),s.addColorStop(.75,"rgba(255,255,255,1)"),s.addColorStop(1,"rgba(255,255,255,0)"),t.fillStyle=s,t.fillRect(0,0,e,e);return}case"halftone":{for(let n=16/2;n<e;n+=16)for(let a=16/2;a<e;a+=16){let o=Math.hypot(a-i,n-i)/(e*.52),l=Math.max(0,16/2*(1-o)*1.15);l<.4||(t.beginPath(),t.arc(a,n,l,0,Math.PI*2),t.fill())}return}case"spray":{let s=ca(42),n=t.createRadialGradient(i,i,10,i,i,e*.42);n.addColorStop(0,"rgba(255,255,255,1)"),n.addColorStop(1,"rgba(255,255,255,0.85)"),t.fillStyle=n,t.beginPath(),t.arc(i,i,e*.42,0,Math.PI*2),t.fill(),t.fillStyle="rgba(255,255,255,0.9)";for(let a=0;a<900;a++){let o=s()*Math.PI*2,l=e*(.3+s()*.24),h=i+Math.cos(o)*l,c=i+Math.sin(o)*l;t.globalAlpha=1-(l/e-.3)/.24,t.beginPath(),t.arc(h,c,s()*2.4,0,Math.PI*2),t.fill()}t.globalAlpha=1;return}case"grunge":{let s=ca(7);mh(t,s,14,e*.06),t.globalCompositeOperation="destination-out";for(let n=0;n<240;n++){let a=s()*e,o=s()*e;!(Math.min(a,o,e-a,e-o)<e*.12)&&s()>=.12||(t.beginPath(),t.arc(a,o,s()*6+1,0,Math.PI*2),t.fill())}t.globalCompositeOperation="source-over";return}case"torn":{mh(t,ca(99),10,e*.08);return}}}function ci(r){let t=ua.get(r);if(t)return t;if(typeof document>"u")throw new Error("Texture masks require a DOM canvas");let e=document.createElement("canvas");e.width=It,e.height=It;let i=e.getContext("2d");if(!i)throw new Error("Texture masks require a 2D canvas context");return mg(r,i),ua.set(r,e),e}function da(){ua.clear()}function ys(r){return cr(r)||hi(r)}var Ee=class{constructor(t,e,i,s){this.canvas=t;this.layers=e;this.history=i;this.events=s}canvas;layers;history;events;get(t){return this.layers.get(t)?.meta.maskPreset??null}apply(t,e,i=!0){let s=this.layers.get(t);if(!s)return!1;let n=s.fabricObject;if(e===null){if(!s.meta.maskPreset)return!1;n.clipPath=void 0,delete s.meta.maskPreset}else{if(!ys(e))return!1;n.clipPath=this.buildClip(e,n),s.meta.maskPreset=e}return n.dirty=!0,n.setCoords(),this.canvas.requestRenderAll(),this.events.emit("masks:changed",{target:t}),this.events.emit("layer:modified",{layerId:t}),i&&this.history.save(),!0}clear(t,e=!0){return this.apply(t,null,e)}refresh(t,e=!1){let i=this.get(t);return i?this.apply(t,i,e):!1}refreshAll(){for(let t of this.layers.getAll())t.meta.maskPreset&&this.refresh(t.id)}buildClip(t,e){let i=Math.max(1,e.width??1),s=Math.max(1,e.height??1),n={originX:"center",originY:"center",left:0,top:0,objectCaching:!1};return cr(t)?new Xt(li(t),{...n,scaleX:i/ur,scaleY:s/ur}):new U(ci(t),{...n,scaleX:i/It,scaleY:s/It})}};var yg=/^(?:#[\da-f]{3,8}|(?:rgb|hsl)a?\([\d.%+\-\s,/]+\)|[a-z]+)$/i;function Mt(r,t=!1){if(typeof r!="string")return!1;let e=r.trim();return e?yg.test(e):t}var le={enabled:!1,color:"#000000",blur:12,offsetX:6,offsetY:6};function ui(r){let t=r.shadow;return!t||typeof t=="string"?{...le}:{enabled:!0,color:typeof t.color=="string"?t.color:le.color,blur:t.blur??le.blur,offsetX:t.offsetX??le.offsetX,offsetY:t.offsetY??le.offsetY}}function vs(r,t){let e={...ui(r),...t};if(!e.enabled){r.set({shadow:null});return}let i=Mt(e.color)?e.color:le.color;r.set({shadow:new me({color:i,blur:Math.max(0,e.blur),offsetX:e.offsetX,offsetY:e.offsetY})})}var bs={borderColor:"#c9a96e",cornerColor:"#c9a96e",cornerStrokeColor:"#101010",cornerSize:11,cornerStyle:"circle",borderWidth:1,borderDashArray:null,padding:0,marqueeFill:"rgba(201, 169, 110, 0.12)"};function Ae(r,t,e){let i=e>0?1/e:1;r.set({cornerSize:t.cornerSize*i,cornerStyle:t.cornerStyle,cornerColor:t.cornerColor,cornerStrokeColor:t.cornerStrokeColor,transparentCorners:!1,borderColor:t.borderColor,borderScaleFactor:t.borderWidth*i,borderDashArray:t.borderDashArray?.map(s=>s*i)??null,padding:t.padding*i})}function xs(r,t,e){for(let s of r.getObjects())Ae(s,t,e);let i=r.getActiveObject();i&&Ae(i,t,e),r.selectionColor=t.marqueeFill,r.selectionBorderColor=t.borderColor,r.selectionLineWidth=t.borderWidth*(e>0?1/e:1),r.requestRenderAll()}var vg=["ml","mr","mt","mb"];function De(r,t){for(let e of vg)r.setControlVisible(e,!t)}function ws(r){r.set({scaleX:1,scaleY:1,angle:0,skewX:0,skewY:0,flipX:!1,flipY:!1}),r.setCoords()}var dr=class{unit;dpi;constructor(t="px",e=72){this.unit=t,this.dpi=72,this.setDpi(e)}setUnit(t){this.unit=t}setDpi(t){if(!Number.isFinite(t)||t<=0)throw new Error("DPI must be a positive number");this.dpi=t}getUnit(){return this.unit}getDpi(){return this.dpi}toPixels(t,e){switch(e??this.unit){case"px":return t;case"in":return t*this.dpi;case"mm":return t/25.4*this.dpi}}fromPixels(t,e){switch(e??this.unit){case"px":return t;case"in":return t/this.dpi;case"mm":return t/this.dpi*25.4}}};var bg="2.0.0";function Cs(r){return{version:bg,canvas:{width:r.canvas.getWidth(),height:r.canvas.getHeight(),unit:r.units.getUnit(),dpi:r.units.getDpi()},layers:r.layers.getAll().map(t=>t.serialize()),background:r.getDesignBackground(),backgroundImage:r.getDesignBackgroundImage()?r.getDesignBackgroundImage().toObject():null,backgroundImageOptions:r.getBackgroundImageOptions(),mockup:r.getMockup()}}async function Ss(r,t){if(!t||!t.canvas||!Array.isArray(t.layers))throw new Error("Invalid editor state");if(!Number.isFinite(t.canvas.width)||!Number.isFinite(t.canvas.height)||t.canvas.width<=0||t.canvas.height<=0||t.canvas.unit!==void 0&&!["px","mm","in"].includes(t.canvas.unit)||t.canvas.dpi!==void 0&&(!Number.isFinite(t.canvas.dpi)||t.canvas.dpi<=0))throw new Error("Invalid editor canvas settings");let e=Number.parseInt(t.version?.split(".")[0]??"1",10);if(!Number.isFinite(e)||e>2)throw new Error(`Unsupported editor state version: ${t.version}`);if(t.background!==void 0&&!Mt(t.background,!0))throw new Error("Invalid editor background color");let i=await Promise.all(t.layers.map(async n=>{let a=(await tt.enlivenObjects([n.fabricObject]))[0];if(!a){let o=n.fabricObject.src;throw typeof o=="string"&&o.startsWith("blob:")?new Error(`Failed to restore expired object URL: ${o}`):new Error(`Failed to restore layer: ${n.id}`)}return{serialized:n,fabricObject:a}})),s=t.backgroundImage?(await tt.enlivenObjects([t.backgroundImage]))[0]:null;if(t.backgroundImage&&!s){let n=t.backgroundImage.src;throw typeof n=="string"&&n.startsWith("blob:")?new Error(`Failed to restore expired background object URL: ${n}`):new Error("Failed to restore background image")}r.crop.cancel(),r.masks.detach(),r.layers.clear(),t.canvas.unit&&r.units.setUnit(t.canvas.unit),t.canvas.dpi!==void 0&&r.units.setDpi(t.canvas.dpi),r.canvas.setDimensions({width:t.canvas.width,height:t.canvas.height}),t.background!==void 0&&r.setBackground(t.background),r.setBackgroundImageObject(s??null,!1,t.backgroundImageOptions??null),r.setMockup(t.mockup??null);for(let n of i)xg(r,n.serialized,n.fabricObject);r.wrap.refreshAll(),r.canvas.requestRenderAll()}function xg(r,t,e){let i=r.layers.add(t.type,e,t.name,t.id);t.meta&&(i.meta=t.meta,i.meta.lockAspect&&De(e,!0)),t.visible||r.layers.setVisibility(i.id,!1),t.locked&&r.layers.setLocked(i.id,!0),t.opacity!==1&&r.layers.setOpacity(i.id,t.opacity);let s=t.children??t.meta?.groupChildren;return i.type==="group"&&Array.isArray(s)&&(r.layers.adoptGroupChildren(i,s),i.meta.groupChildren&&delete i.meta.groupChildren),i}var yh={red:0,green:1,blue:2,alpha:3};function vh(r,t,e){let i=r??t;if(!Number.isFinite(i))throw new Error(`${e} must be finite`);return i}function wg(r,t,e,i,s,n){let a=Math.max(0,Math.min(t-1,i)),o=Math.max(0,Math.min(e-1,s)),l=Math.floor(a),h=Math.floor(o),c=Math.min(t-1,l+1),u=Math.min(e-1,h+1),d=a-l,g=o-h,p=r[(h*t+l)*4+n]*(1-d)+r[(h*t+c)*4+n]*d,f=r[(u*t+l)*4+n]*(1-d)+r[(u*t+c)*4+n]*d;return p*(1-g)+f*g}function _s(r,t,e,i,s){if(!Number.isInteger(e)||!Number.isInteger(i)||e<=0||i<=0)throw new Error("Displacement dimensions must be positive integers");let n=e*i*4;if(r.length!==n||t.length!==n)throw new Error("Displacement source and map must match the requested dimensions");let a=vh(s.scaleX,10,"Displacement scaleX"),o=vh(s.scaleY,10,"Displacement scaleY"),l=yh[s.channelX??"red"],h=yh[s.channelY??"green"],c=new Uint8ClampedArray(n);for(let u=0;u<i;u+=1)for(let d=0;d<e;d+=1){let g=(u*e+d)*4,p=d+(t[g+l]-128)/127*a,f=u+(t[g+h]-128)/127*o;for(let y=0;y<4;y+=1)c[g+y]=Math.round(wg(r,e,i,p,f,y))}return c}function Ts(r,t,e,i,s){let n=Math.max(0,Math.min(i,r.left*t)),a=Math.max(0,Math.min(s,r.top*e)),o=Math.max(n,Math.min(i,(r.left+r.width)*t)),l=Math.max(a,Math.min(s,(r.top+r.height)*e));return{left:n,top:a,width:o-n,height:l-a}}function ga(r,t,e,i){if(r<=0||t<=0||e<=0||i<=0)throw new Error("Cover dimensions must be positive");let s=Math.max(e/r,i/t),n=r*s,a=t*s;return{left:(e-n)/2,top:(i-a)/2,width:n,height:a}}function pa(r,t,e){let i=t==="jpeg"?"image/jpeg":`image/${t}`;return new Promise((s,n)=>{r.toBlob(a=>a?s(a):n(new Error(`Failed to export ${t}`)),i,e)})}async function di(r,t={}){let{multiplier:e=1,format:i="png",quality:s=1}=t,n=r.toCanvasElement(e);return pa(n,i,s)}async function gi(r,t,e={}){let i=r.lowerCanvasEl.ownerDocument.createElement("canvas"),s=new Je(i,{width:e.width??r.getWidth(),height:e.height??r.getHeight(),backgroundColor:e.backgroundColor||void 0});try{let n=e.cloneObjects===!1?t:await Promise.all(t.map(a=>a.clone()));return n.length&&s.add(...n),e.backgroundImage&&(s.backgroundImage=await e.backgroundImage.clone()),s.requestRenderAll(),await di(s,e)}finally{s.dispose()}}async function ks(r,t,e={}){let{multiplier:i=1,format:s="png",quality:n=1}=e,a=r.getWidth(),o=r.getHeight(),l=Ts(t,i,i,a*i,o*i);if(l.width<=0||l.height<=0)throw new Error("Print area does not overlap the canvas");let h=r.lowerCanvasEl.ownerDocument.createElement("canvas"),c=new Je(h,{width:a,height:o});try{let u=await Promise.all(r.getObjects().map(f=>f.clone()));u.length&&c.add(...u),c.requestRenderAll();let d=c.toCanvasElement(i),g=d.ownerDocument.createElement("canvas");g.width=Math.max(1,Math.round(l.width)),g.height=Math.max(1,Math.round(l.height));let p=g.getContext("2d");if(!p)throw new Error("2D canvas context is unavailable");return p.drawImage(d,-l.left,-l.top),await pa(g,s,n)}finally{c.dispose()}}async function Os(r,t,e={}){let{multiplier:i=1,format:s="png",quality:n=1}=e,a=r.toCanvasElement(i),o=a.ownerDocument.createElement("canvas");o.width=a.width,o.height=a.height;let l=o.getContext("2d");if(!l)throw new Error("2D canvas context is unavailable");let h=d=>new Promise((g,p)=>{let f=new Image;f.crossOrigin="anonymous",f.onload=()=>g(f),f.onerror=()=>p(new Error(`Failed to load mockup image: ${d}`)),f.src=d}),c=(d,g=l)=>{let p=ga(d.naturalWidth||d.width,d.naturalHeight||d.height,o.width,o.height);g.drawImage(d,p.left,p.top,p.width,p.height)},u=[a];try{c(await h(t.image));let d=a;if(t.displacement){let g=a.getContext("2d");if(!g)throw new Error("2D design context is unavailable");let p=a.ownerDocument.createElement("canvas");u.push(p),p.width=a.width,p.height=a.height;let f=p.getContext("2d");if(!f)throw new Error("2D displacement-map context is unavailable");c(await h(t.displacement.image),f);let y=a.ownerDocument.createElement("canvas");u.push(y),y.width=a.width,y.height=a.height;let b=y.getContext("2d");if(!b)throw new Error("2D displaced-design context is unavailable");let x,w;try{x=g.getImageData(0,0,a.width,a.height).data,w=f.getImageData(0,0,a.width,a.height).data}catch(k){throw new Error("Failed to apply mockup displacement map; verify image CORS access",{cause:k})}let S=_s(x,w,a.width,a.height,{...t.displacement,scaleX:(t.displacement.scaleX??10)*i,scaleY:(t.displacement.scaleY??10)*i}),C=b.createImageData(a.width,a.height);C.data.set(S),b.putImageData(C,0,0),d=y}if(l.save(),t.printArea&&t.clipToPrintArea!==!1){let g=Ts(t.printArea,o.width/r.getWidth(),o.height/r.getHeight(),o.width,o.height);l.beginPath(),l.rect(g.left,g.top,g.width,g.height),l.clip()}return l.globalAlpha=Math.max(0,Math.min(1,t.designOpacity??1)),l.globalCompositeOperation=!t.designBlendMode||t.designBlendMode==="normal"?"source-over":t.designBlendMode,l.drawImage(d,0,0),l.restore(),t.overlay&&(l.save(),l.globalAlpha=Math.max(0,Math.min(1,t.overlay.opacity??1)),l.globalCompositeOperation=t.overlay.blendMode==="normal"?"source-over":t.overlay.blendMode??"multiply",c(await h(t.overlay.image)),l.restore()),await pa(o,s,n)}finally{for(let d of u)d.width=0,d.height=0}}function Ms(r){return r.toSVG()}function Ps(r,t="png",e=1){return r.toDataURL({format:t,multiplier:e})}function Es(r){return String(r).replaceAll("&","&").replaceAll("<","<").replaceAll(">",">").replaceAll('"',""").replaceAll("'","'")}function As(r){let t=new DOMParser().parseFromString(r,"image/svg+xml");if(t.querySelector("parsererror"))throw new Error("Invalid template SVG");return t.querySelectorAll("script, foreignObject, iframe, object, embed, link, style").forEach(e=>e.remove()),t.querySelectorAll("*").forEach(e=>{for(let i of[...e.attributes]){let s=i.name.toLowerCase(),n=i.value.trim().toLowerCase(),a=s==="href"||s==="xlink:href"||s==="src",o=n.startsWith("#")||/^data:image\/(?:png|jpeg|webp|gif);base64,/.test(n);(s.startsWith("on")||a&&!o||/url\s*\(/.test(n)&&!/url\s*\(\s*['"]?#/.test(n)||/(?:javascript:|expression\s*\()/.test(n))&&e.removeAttribute(i.name)}}),new XMLSerializer().serializeToString(t.documentElement)}function Cg(r){return/^(?:url|local)\(/.test(r.trim())?r:`url(${JSON.stringify(r)})`}function Sg(r){let t=r.split(/[?#]/)[0].toLowerCase();return t.endsWith(".woff2")?"font/woff2":t.endsWith(".woff")?"font/woff":t.endsWith(".otf")?"font/otf":"font/ttf"}function _g(r){let t=new Uint8Array(r),e="";for(let i=0;i<t.length;i+=32768)e+=String.fromCharCode(...t.subarray(i,i+32768));return btoa(e)}function Ds(r){return JSON.stringify(r).replace(/[<>&]/g,t=>`\\${t.charCodeAt(0).toString(16)} `)}var Tg=/^(?:normal|bold|bolder|lighter|[1-9]\d{0,2}(?:\s+[1-9]\d{0,2})?)$/i,kg=/^(?:normal|italic|oblique(?:\s+-?\d+(?:\.\d+)?deg)?)$/i,Og=/^(?:auto|block|swap|fallback|optional)$/i;function fa(r,t,e){let i=r?.trim();return i&&t.test(i)?i:e}function Mg(r){let t=r.trim();if(t.startsWith("data:"))return t;let e=t.match(/^url\(\s*(['"]?)(.*?)\1\s*\)/i);return e?e[2]:/^local\(/i.test(t)?null:t}function Pg(r){let t=r.trim().match(/^local\(\s*(['"]?)([^)"'{};]*)\1\s*\)$/i);return t&&t[2].trim()||null}var gr=class{definitions=new Map;loads=new Map;register(t){if(!t.family.trim()||!t.source.trim())throw new Error("Font family and source are required");this.definitions.set(t.family,{...t}),this.loads.delete(t.family)}unregister(t){return this.loads.delete(t),this.definitions.delete(t)}getAll(){return[...this.definitions.values()].map(t=>({...t}))}load(t){let e=this.loads.get(t);if(e)return e;let i=this.definitions.get(t);if(!i)return Promise.reject(new Error(`Font is not registered: ${t}`));if(typeof FontFace>"u"||typeof document>"u")return Promise.reject(new Error("Font loading requires a browser FontFace API"));let s=new FontFace(i.family,Cg(i.source),{weight:i.weight,style:i.style,display:i.display}).load().then(n=>(document.fonts.add(n),n));return s.catch(()=>{this.loads.get(t)===s&&this.loads.delete(t)}),this.loads.set(t,s),s}async ready(){this.definitions.size!==0&&(await Promise.all([...this.definitions.keys()].map(t=>this.load(t))),await document.fonts.ready)}async getEmbeddedCss(){return(await Promise.all(this.getAll().map(async e=>{let i=Mg(e.source),s;if(i&&!i.startsWith("data:")){let l=await fetch(i);if(!l.ok)throw new Error(`Failed to fetch font: ${i}`);let h=_g(await l.arrayBuffer()),c=l.headers.get("content-type")||Sg(i);s=`url(${Ds(`data:${c};base64,${h}`)})`}else if(i)s=`url(${Ds(i)})`;else{let l=Pg(e.source);if(!l)throw new Error(`Unsupported font source for embedding: ${e.family}`);s=`local(${Ds(l)})`}let n=fa(e.weight,Tg,"normal"),a=fa(e.style,kg,"normal"),o=fa(e.display,Og,"swap");return`@font-face{font-family:${Ds(e.family)};src:${s};font-weight:${n};font-style:${a};font-display:${o}}`}))).join(`
|
|
507
|
-
`)}};function Eg(r,t){let e=r.toLowerCase(),i=t.toLowerCase();if(i.startsWith("*.")){let s=i.slice(1);return e.endsWith(s)&&e.length>s.length}return e===i}function Ag(r){return r==="localhost"||r==="127.0.0.1"||r==="::1"||r.endsWith(".localhost")}var pr=class{constructor(t={}){this.config=t;let e=t.hostname??globalThis.location?.hostname??"localhost";(t.environment??"development")!=="production"||Ag(e)?(this.status={state:"exempt",payload:null},this.readyPromise=Promise.resolve(this.status)):t.key?(this.status={state:"checking",payload:null},this.readyPromise=this.validate(t.key,e)):(this.status={state:"community",payload:null},this.readyPromise=Promise.resolve(this.status))}config;status;readyPromise;getStatus(){return this.status}ready(){return this.readyPromise}hasFeature(t){return this.status.state==="valid"&&(this.status.payload.features??[]).includes(t)}track(t){this.config.onUsage?.({name:t,at:new Date().toISOString(),licenseId:this.status.state==="valid"?this.status.payload.id:void 0})}async validate(t,e){let i=await this.config.verifyOffline?.(t)??null;return i?i.expiresAt&&Date.parse(i.expiresAt)<Date.now()?this.status={state:"expired",payload:i}:i.domains.some(s=>Eg(e,s))?this.status={state:"valid",payload:i}:this.status={state:"domain-mismatch",payload:i}:this.status={state:"invalid",payload:null}}};var fr=class{constructor(t){this.editor=t;let e={id:mt(),name:"Page 1",state:t.toJSON()};this.pages=[e],this.activePageId=e.id}editor;pages;activePageId;getAll(){return this.pages.map(({id:t,name:e})=>({id:t,name:e}))}getActivePageId(){return this.activePageId}add(t=`Page ${this.pages.length+1}`,e=!1){this.saveCurrent();let i=structuredClone(this.editor.toJSON()),s=e?i:this.blankState(i),n={id:mt(),name:t,state:s};return this.pages.push(n),this.emitChanged(),n.id}async switchTo(t){if(t===this.activePageId)return!0;let e=this.pages.find(i=>i.id===t);return e?(this.saveCurrent(),await this.editor.fromJSON(structuredClone(e.state)),this.activePageId=t,this.emitChanged(),!0):!1}async duplicate(t){this.saveCurrent();let e=this.pages.find(n=>n.id===t);if(!e)return null;let i={id:mt(),name:`${e.name} copy`,state:structuredClone(e.state)},s=this.pages.indexOf(e);return this.pages.splice(s+1,0,i),this.emitChanged(),i.id}async remove(t){if(this.pages.length===1)return!1;let e=this.pages.findIndex(i=>i.id===t);if(e<0)return!1;if(t===this.activePageId){let i=this.pages[e+1]??this.pages[e-1];await this.editor.fromJSON(structuredClone(i.state)),this.activePageId=i.id}return this.pages.splice(e,1),this.emitChanged(),!0}rename(t,e){let i=this.pages.find(n=>n.id===t),s=e.trim();return!i||!s||i.name===s?!1:(i.name=s,this.emitChanged(),!0)}reorder(t,e){let i=this.pages.findIndex(a=>a.id===t);if(i<0||!Number.isFinite(e))return!1;let s=Math.max(0,Math.min(this.pages.length-1,Math.round(e)));if(s===i)return!1;let[n]=this.pages.splice(i,1);return this.pages.splice(s,0,n),this.emitChanged(),!0}toJSON(){return this.saveCurrent(),{version:"1.0.0",activePageId:this.activePageId,pages:structuredClone(this.pages)}}async fromJSON(t){if(t?.version!=="1.0.0"||!Array.isArray(t.pages)||t.pages.length===0||!t.pages.some(s=>s.id===t.activePageId))throw new Error("Invalid project state");let e=structuredClone(t.pages),i=e.find(s=>s.id===t.activePageId);await this.editor.fromJSON(structuredClone(i.state)),this.pages=e,this.activePageId=i.id,this.emitChanged()}saveCurrent(){let t=this.pages.find(e=>e.id===this.activePageId);t&&(t.state=structuredClone(this.editor.toJSON()))}blankState(t){return{...t,layers:[],mockup:null}}emitChanged(){this.editor.events.emit("project:changed",{activePageId:this.activePageId,pages:this.getAll()})}};var Rt=class extends Error{constructor(e,i,s){super(i);this.code=e;this.cause=s;this.name="MaskRefinementError"}code;cause},mr=class{constructor(t){this.editor=t}editor;backing=null;context=null;layerId=null;brush=null;previousPoint=null;strokeBackup=null;strokeStartedAt=null;lastInteractionLatencyMs=0;refinement=null;disposed=!1;async create(t=this.editor.canvas.getWidth(),e=this.editor.canvas.getHeight()){if(this.assertActive(),!Number.isInteger(t)||!Number.isInteger(e)||t<=0||e<=0)throw new Error("Mask dimensions must be positive integers");let i=this.makeCanvas(t,e),s=new U(i,{left:0,top:0,originX:"left",originY:"top",selectable:!1}),n=this.editor.layers.add("mask",s,"Mask");return n.meta.mask={width:t,height:e,revision:0},this.editor.history.saveImmediate(),this.attachBacking(n.id,i),n}attach(t){this.assertActive(),this.cancelStroke();let e=this.requireMask(t),i=e.fabricObject,s=e.meta.mask?.width??i.width??this.editor.canvas.getWidth(),n=e.meta.mask?.height??i.height??this.editor.canvas.getHeight(),a=this.makeCanvas(s,n),o=a.getContext("2d");if(!o)throw new Error("2D mask context is unavailable");let l=i.getElement();l&&o.drawImage(l,0,0,s,n),this.attachBacking(t,a)}beginStroke(t){if(this.assertActive(),!this.context||!this.backing||!this.layerId)throw new Error("Attach a mask first");if(this.brush)throw new Error("A mask stroke is already active");if(!Number.isFinite(t.size)||t.size<=0)throw new Error("Mask brush size must be positive");this.brush={...t,hardness:Y(t.hardness,0,1)},this.previousPoint=null,this.strokeBackup=this.context.getImageData(0,0,this.backing.width,this.backing.height),this.strokeStartedAt=performance.now()}addPoint(t){if(!this.brush||!this.context||!this.backing||!this.layerId)throw new Error("No active mask stroke");if(!Number.isFinite(t.x)||!Number.isFinite(t.y))return;let e=this.previousPoint??t,i=Math.hypot(t.x-e.x,t.y-e.y),s=Math.max(1,this.brush.size/4),n=Math.max(1,Math.ceil(i/s));for(let a=0;a<=n;a+=1){let o=a/n;this.drawDot({x:e.x+(t.x-e.x)*o,y:e.y+(t.y-e.y)*o})}this.previousPoint=t,this.requireMask(this.layerId).fabricObject.setElement(this.backing),this.editor.canvas.requestRenderAll()}async endStroke(){if(!this.brush||!this.backing||!this.layerId)return;let t=this.layerId;this.brush=null,this.previousPoint=null,this.strokeBackup=null;let e=this.backing.toDataURL("image/png");await this.editor.history.transaction(async()=>{await this.editor.replaceImageSource(t,e);let i=this.requireMask(t);i.meta.mask&&(i.meta.mask.revision+=1)}),this.attach(t),this.strokeStartedAt!==null&&(this.lastInteractionLatencyMs=performance.now()-this.strokeStartedAt,this.strokeStartedAt=null)}cancelStroke(){this.strokeBackup&&this.context&&this.backing&&this.layerId&&(this.context.putImageData(this.strokeBackup,0,0),this.requireMask(this.layerId).fabricObject.setElement(this.backing),this.editor.canvas.requestRenderAll()),this.brush=null,this.previousPoint=null,this.strokeBackup=null,this.strokeStartedAt=null}isStrokeActive(){return this.brush!==null}activeLayerId(){return this.layerId}detach(t){t&&this.layerId!==t||(this.cancelStroke(),this.cancelRefinement(),this.backing=null,this.context=null,this.layerId=null)}async refine(t,e,i,s={}){this.assertActive();let n=this.editor.layers.get(t);if(!n||n.type!=="mask")throw new Rt("not-found",`Mask layer not found: ${t}`);this.cancelRefinement();let a=new AbortController;this.refinement=a;let o=()=>a.abort(s.signal?.reason);s.signal?.addEventListener("abort",o,{once:!0}),s.signal?.aborted&&o();try{let l=n.fabricObject,h=await e.refine({mask:l.getSrc(),width:n.meta.mask?.width??l.width??1,height:n.meta.mask?.height??l.height??1,prompts:structuredClone(i)},{signal:a.signal,onProgress:s.onProgress});if(a.signal.aborted)throw new Rt("cancelled","Mask refinement cancelled");if(!/^data:image\/(?:png|jpeg|webp);base64,/i.test(h.dataUrl))throw new Rt("invalid-result","Mask refinement must return a base64 PNG, JPEG, or WebP data URL");return await this.editor.history.transaction(async()=>{await this.editor.replaceImageSource(t,h.dataUrl),n.meta.mask&&(n.meta.mask.revision+=1)}),this.attach(t),h}catch(l){throw l instanceof Rt?l:a.signal.aborted?new Rt("cancelled","Mask refinement cancelled",l):new Rt("provider","Mask refinement provider failed",l)}finally{s.signal?.removeEventListener("abort",o),this.refinement===a&&(this.refinement=null)}}cancelRefinement(){this.refinement?.abort(new DOMException("Cancelled","AbortError")),this.refinement=null}measure(){if(!this.backing)return null;let t=performance.now();this.context?.getImageData(0,0,1,1);let e=this.backing.width*this.backing.height*4,i=this.strokeBackup?e:0,s=performance;return{width:this.backing.width,height:this.backing.height,backingBytes:e,strokeBackupBytes:i,estimatedPeakBytes:e+i,historyBytes:this.editor.history.getSnapshotBytes(),interactionLatencyMs:this.lastInteractionLatencyMs,...typeof s.memory?.usedJSHeapSize=="number"?{usedJsHeapBytes:s.memory.usedJSHeapSize}:{},elapsedMs:performance.now()-t}}dispose(){this.detach(),this.disposed=!0}drawDot(t){let e=this.context,i=this.brush,s=i.size/2;e.save(),e.globalCompositeOperation=i.mode==="subtract"?"destination-out":"source-over";let n=e.createRadialGradient(t.x,t.y,s*i.hardness,t.x,t.y,s),a=i.mode==="subtract"?"rgba(0,0,0,1)":"rgba(255,255,255,1)";n.addColorStop(0,a),n.addColorStop(1,"rgba(255,255,255,0)"),e.fillStyle=n,e.beginPath(),e.arc(t.x,t.y,s,0,Math.PI*2),e.fill(),e.restore()}makeCanvas(t,e){let i=this.editor.canvas.lowerCanvasEl.ownerDocument.createElement("canvas");return i.width=t,i.height=e,i}attachBacking(t,e){let i=e.getContext("2d");if(!i)throw new Error("2D mask context is unavailable");this.layerId=t,this.backing=e,this.context=i}requireMask(t){let e=this.editor.layers.get(t);if(!e||e.type!=="mask")throw new Error(`Mask layer not found: ${t}`);return e}assertActive(){if(this.disposed)throw new Error("Mask controller has been disposed")}};var Dg={add:"source-over",subtract:"destination-out",intersect:"destination-in"};function jg(r){r.set({opacity:0,globalCompositeOperation:"source-over"})}function Lg(r){return new V({left:r.left,top:r.top,width:Math.max(1,r.width),height:Math.max(1,r.height),originX:"left",originY:"top",fill:"#000000",objectCaching:!1})}function pi(r,t,e){if(r.length===0)return;r.forEach((n,a)=>{let o=t[a];if(n.set({objectCaching:!1}),!o||!o.visible){jg(n);return}n.set({opacity:o.opacity,globalCompositeOperation:Dg[o.mode]??"source-over"})});let i=t.find(n=>n.visible),s=i&&i.mode!=="add"?[Lg(e.box),...r]:[...r];return new q(s,{absolutePositioned:e.absolute,objectCaching:!0,subTargetCheck:!1,interactive:!1})}function qt(r){return r.some(t=>!t.linked)}var js=class{constructor(t,e){this.canvas=t;this.onCommit=e}canvas;onCommit;handle=null;editing=null;child=null;group=null;active(){return this.editing}async begin(t,e,i){this.end();let s=await i.clone();return Oe(s,bt(i)),s.set({fill:"rgba(0,0,0,0.001)",stroke:"#e0b055",strokeWidth:2,strokeDashArray:[6,4],strokeUniform:!0,opacity:1,selectable:!0,evented:!0,hasControls:!0,hasBorders:!0,objectCaching:!1,excludeFromExport:!0}),this.handle=s,this.editing=t,this.child=i,this.group=e,this.canvas.add(s),this.canvas.setActiveObject(s),this.canvas.on("object:moving",this.onTransform),this.canvas.on("object:scaling",this.onTransform),this.canvas.on("object:rotating",this.onTransform),this.canvas.on("object:modified",this.onModified),this.canvas.requestRenderAll(),!0}end(){this.handle&&(this.canvas.off("object:moving",this.onTransform),this.canvas.off("object:scaling",this.onTransform),this.canvas.off("object:rotating",this.onTransform),this.canvas.off("object:modified",this.onModified),this.canvas.getActiveObject()===this.handle&&this.canvas.discardActiveObject(),this.canvas.remove(this.handle),this.handle=null,this.editing=null,this.child=null,this.group=null,this.canvas.requestRenderAll())}dispose(){this.end()}onTransform=t=>{!this.handle||t.target!==this.handle||this.write()};onModified=t=>{!this.handle||t.target!==this.handle||(this.write(),this.onCommit())};write(){!this.handle||!this.child||!this.group||(Oe(this.child,tt.multiplyTransformMatrices(tt.invertTransform(bt(this.group)),bt(this.handle))),this.group.dirty=!0,this.group.set({dirty:!0}),this.canvas.requestRenderAll())}};function ma(r){return r.getAll().find(t=>t.meta.canvasMask)}function ya(r,t){let e=new V({left:0,top:0,width:r.getWidth(),height:r.getHeight(),originX:"left",originY:"top",fill:"#000000",globalCompositeOperation:"destination-in",selectable:!1,evented:!1,hasControls:!1,hasBorders:!1,objectCaching:!1}),i=t.add("mask",e,"Design mask");return i.meta.canvasMask=!0,t.setLocked(i.id,!0),i}function va(r){let t=r.getAll(),e=t.findIndex(s=>s.meta.canvasMask);if(e===-1)return!1;let i=-1;return t.forEach((s,n)=>{s.type!=="mask"&&(i=n)}),e>=i?!1:(r.reorder(t[e].id,t.length-1),!0)}function ba(r,t,e){if(!t)return{left:0,top:0,width:r.getWidth(),height:r.getHeight()};if(e){t.setCoords();let n=t.getBoundingRect();return{left:n.left,top:n.top,width:n.width,height:n.height}}let i=Math.max(1,t.width??1),s=Math.max(1,t.height??1);return{left:-i/2,top:-s/2,width:i,height:s}}function bh(r,t,e){let i=r.clipPath instanceof q?r.clipPath.absolutePositioned:e;if(e!==i)for(let s of t)e?Me(s,r):Ut(s,r)}function xh(r,t,e,i){return r.map((s,n)=>{let a=t[n];if(i&&s.linked&&a)return{...s,rel:[...na(a,e)]};if(!s.rel)return s;let o={...s};return delete o.rel,o})}function wh(r,t,e,i,s){r.clipPath=pi(e,t,{box:i,absolute:s}),r.dirty=!0,r.setCoords()}var rt="canvas",yr=10,Ls={mode:"add",linked:!0,visible:!0,opacity:1},fi=class{constructor(t,e,i,s){this.canvas=t;this.layers=e;this.history=i;this.events=s}canvas;layers;history;events;selected=null;pinning=!1;list(t){return this.hostLayer(t)?.meta.maskStack??[]}get(t,e){return this.list(t).find(i=>i.id===e)}targets(){return this.layers.getAll().filter(t=>(t.meta.maskStack??[]).length>0).map(t=>t.meta.canvasMask?rt:t.id)}hostBox(t,e=t===rt||qt(this.list(t))){return ba(this.canvas,this.host(t),e)}hostLayer(t,e=!1){if(t!==rt)return this.layers.get(t);let i=ma(this.layers);return i||!e?i:ya(this.canvas,this.layers)}host(t,e=!1){return this.hostLayer(t,e)?.fabricObject??null}pin(){if(!this.pinning){this.pinning=!0;try{va(this.layers)}finally{this.pinning=!1}}}holdsBoxClip(t){return t?.overflow==="hidden"&&!t.maskPreset}unwrap(t,e){let i=e.clipPath;if(!i)return[];let s=this.list(t),n=this.hostLayer(t)?.meta;if(s.length===0&&this.holdsBoxClip(n))return[];if(s.length===0||!(i instanceof q)){let l=i;return n?.overflow==="hidden"&&(l.clipPath=void 0),[l]}let a=ai(i),o=a.length-s.length;return o>0?a.slice(o):a}entriesFor(t,e){let i=this.list(t);if(i.length>0||e.length!==1)return[...i];let s=this.hostLayer(t),n=s?.meta.maskPreset;return s&&delete s.meta.maskPreset,[{...Ls,id:mt(),name:typeof n=="string"?n:"Mask",linked:t===rt?!1:!e[0].absolutePositioned}]}commit(t,e,i,s,n=!0,a=!1){let o=this.hostLayer(t);if(!o)return;let l=a||t===rt||qt(i);bh(e,s,l);let h=xh(i,s,e,l);wh(e,h,s,this.hostBox(t,l),l),h.length===0?(delete o.meta.maskStack,o.meta.canvasMask&&this.layers.remove(o.id)):o.meta.maskStack=h,this.canvas.requestRenderAll(),this.events.emit("masks:changed",{target:t}),this.events.emit("layer:modified",{layerId:o.id}),n&&this.history.save()}};var je=class extends fi{edits=new js(this.canvas,()=>this.history.save());onLayersChanged=()=>this.pin();onLayerSelected=({layerId:t})=>{t&&this.selected&&this.select(null,null)};onObjectModified=t=>{let e=t.target;if(!e)return;let i=this.layers.findByObject(e);i&&this.reflow(i.id)};constructor(t,e,i,s){super(t,e,i,s),this.events.on("layers:changed",this.onLayersChanged),this.events.on("layer:selected",this.onLayerSelected),this.canvas.on("object:modified",this.onObjectModified)}dispose(){this.edits.dispose(),this.events.off("layers:changed",this.onLayersChanged),this.events.off("layer:selected",this.onLayerSelected),this.canvas.off("object:modified",this.onObjectModified),this.selected=null}editing(){return this.edits.active()}async beginEdit(t,e){let i=this.host(t);if(!i)return!1;let s=this.list(t),n=s.findIndex(h=>h.id===e);if(n===-1)return!1;this.endEdit(!1),this.commit(t,i,[...s],this.unwrap(t,i),!1,!0);let a=i.clipPath instanceof q?i.clipPath:null;if(!a)return!1;let o=a.getObjects(),l=o[o.length-s.length+n];return l?(this.select(t,e),this.edits.begin({target:t,maskId:e},a,l)):!1}endEdit(t=!0){let e=this.edits.active();this.edits.end(),e&&this.rebuild(e.target,t)}getSelected(){return this.selected}select(t,e){this.selected=t&&e?{target:t,maskId:e}:null,this.selected&&this.layers.select(null),this.events.emit("mask:selected",{target:t,maskId:this.selected?e:null})}add(t,e,i={}){let s=this.host(t,!0);if(!s)return null;let n=this.unwrap(t,s),a=this.entriesFor(t,n);if(a.length>=yr)return null;let o={...Ls,id:mt(),name:i.name??"Mask",...i.mode?{mode:i.mode}:{},...i.linked===void 0?{}:{linked:i.linked},...i.meta?{meta:i.meta}:{},...i.sourceLayer?{sourceLayer:i.sourceLayer}:{},...i.sourceObject?{sourceObject:i.sourceObject}:{}};return t===rt&&(o.linked=!1),i.fit!==!1&&Pe(e,i.box??this.hostBox(t),i.fit??1),n.push(e),a.push(o),this.commit(t,s,a,n),o}replaceGeometry(t,e,i,s={}){let n=this.host(t);if(!n)return!1;let a=[...this.list(t)],o=a.findIndex(h=>h.id===e);if(o===-1)return!1;let l=this.unwrap(t,n);return s.fit!==!1&&Pe(i,s.box??this.hostBox(t),s.fit??1),l[o]=i,a[o]={...a[o],...s.name?{name:s.name}:{},...s.meta?{meta:s.meta}:{}},this.commit(t,n,a,l),!0}refit(t,e,i={}){let s=this.host(t);if(!s)return!1;let n=[...this.list(t)],a=n.findIndex(h=>h.id===e);if(a===-1)return!1;let o=this.unwrap(t,s),l=o[a];return l?(Pe(l,i.box??this.hostBox(t),i.fit??1),this.commit(t,s,n,o,i.save??!0),!0):!1}remove(t,e){let i=this.host(t);if(!i)return!1;let s=[...this.list(t)],n=s.findIndex(o=>o.id===e);if(n===-1)return!1;let a=this.unwrap(t,i);return s.splice(n,1),a.splice(n,1),this.selected?.maskId===e&&this.select(null,null),this.commit(t,i,s,a),!0}clear(t){let e=this.host(t);return!e||this.list(t).length===0?!1:(this.selected?.target===t&&this.select(null,null),this.commit(t,e,[],[]),!0)}unmask(t,e){let i=this.host(t);if(!i)return null;let s=[...this.list(t)],n=s.findIndex(h=>h.id===e);if(n===-1)return null;let a=this.unwrap(t,i),o=a[n];if(!o)return null;let l=s[n];this.history.beginTransaction();try{this.endEdit(!1),s.splice(n,1),a.splice(n,1),!o.absolutePositioned&&t!==rt&&Me(o,i),o.set({absolutePositioned:!1,opacity:l.sourceObject?.opacity??1,globalCompositeOperation:l.sourceObject?.globalCompositeOperation??"source-over",objectCaching:l.sourceObject?.objectCaching??!0}),this.selected?.maskId===e&&this.select(null,null),this.commit(t,i,s,a,!1);let h=l.sourceLayer,c=this.layers.add(h?.type??Fg(o),o,h?.name??l.name);return c.meta=h?.meta?structuredClone(h.meta):{},this.layers.setVisibility(c.id,h?.visible??!0),this.layers.setLocked(c.id,h?.locked??!1),this.layers.setOpacity(c.id,h?.opacity??1),this.layers.select(c.id),this.history.save(),c}finally{this.history.endTransaction()}}reorder(t,e,i){let s=this.host(t);if(!s)return!1;let n=[...this.list(t)],a=n.findIndex(u=>u.id===e);if(a===-1)return!1;let o=Math.max(0,Math.min(n.length-1,Math.round(i)));if(a===o)return!1;let l=this.unwrap(t,s),[h]=n.splice(a,1),[c]=l.splice(a,1);return n.splice(o,0,h),l.splice(o,0,c),this.commit(t,s,n,l),!0}setMeta(t,e,i){return this.patch(t,e,()=>({meta:i}))}setMode(t,e,i){return this.patch(t,e,s=>s.mode===i?null:{mode:i})}setVisible(t,e,i){return this.patch(t,e,s=>s.visible===i?null:{visible:i})}setOpacity(t,e,i){if(!Number.isFinite(i))return!1;let s=Math.max(0,Math.min(1,i));return this.patch(t,e,n=>n.opacity===s?null:{opacity:s})}setName(t,e,i){let s=i.trim();return s?this.patch(t,e,n=>n.name===s?null:{name:s}):!1}setLinked(t,e,i){if(t===rt)return!1;let s=this.host(t);if(!s)return!1;let n=[...this.list(t)],a=n.findIndex(l=>l.id===e);if(a===-1||n[a].linked===i)return!1;let o=this.unwrap(t,s);return n[a]={...n[a],linked:i},this.commit(t,s,n,o),!0}convertLayer(t,e){let i=this.layers.get(t);if(!i||i.meta.canvasMask)return null;let s=this.layers.getAll(),n=s.findIndex(g=>g.id===t),a=n>0?s[n-1]:void 0,o=e??(a&&!a.meta.canvasMask?a.id:rt);if(o===t||this.list(o).length>=yr)return null;let l=i.fabricObject,h={type:i.type,name:i.name,visible:i.visible,locked:i.locked,opacity:i.opacity,...Object.keys(i.meta).length>0?{meta:structuredClone(i.meta)}:{}},c={opacity:l.opacity??1,globalCompositeOperation:l.globalCompositeOperation??"source-over",objectCaching:l.objectCaching};!l.fill&&l.type!=="image"&&l.set({fill:"#000000"});let u=this.host(o);!(o===rt||qt(this.list(o)))&&u&&Ut(l,u),this.history.beginTransaction();try{this.canvas.getActiveObject()===l&&this.canvas.discardActiveObject(),this.canvas.remove(l),this.layers.remove(t);let g=this.add(o,l,{name:i.name,fit:!1,sourceLayer:h,sourceObject:c});return g?{target:o,entry:g}:null}finally{this.history.endTransaction()}}rebuild(t,e=!1){let i=this.host(t);if(!i)return;let s=this.unwrap(t,i);s.length!==0&&this.commit(t,i,this.entriesFor(t,s),s,e)}reflow(t){let e=this.host(t);if(!e)return;let i=this.list(t);if(i.length===0||!qt(i)||!i.some(n=>n.linked&&n.rel))return;let s=this.unwrap(t,e);i.forEach((n,a)=>{let o=s[a],l=oa(n.rel);!o||!n.linked||!l||aa(o,e,l)}),this.commit(t,e,[...i],s)}adopt(t,e){let i=this.hostLayer(t),s=i?.fabricObject.clipPath;if(!i||!s||i.meta.pattern||(i.meta.maskStack??[]).length>0||this.holdsBoxClip(i.meta))return null;let n={...Ls,id:mt(),name:e??"Mask",linked:t===rt?!1:!s.absolutePositioned};return i.meta.maskStack=[n],delete i.meta.maskPreset,this.rebuild(t),n}refreshAll(){this.selected=null,this.pin();for(let t of this.layers.getAll())(t.meta.maskStack??[]).length!==0&&this.rebuild(t.meta.canvasMask?rt:t.id)}patch(t,e,i){let s=this.host(t);if(!s)return!1;let n=[...this.list(t)],a=n.findIndex(h=>h.id===e);if(a===-1)return!1;let o=i(n[a]);if(!o)return!1;let l=this.unwrap(t,s);return n[a]={...n[a],...o},this.commit(t,s,n,l),!0}};function Fg(r){return r.type==="image"?"image":r.type==="text"||r.type==="textbox"||r.type==="i-text"?"text":"shape"}var he={kind:"linear",angle:90,center:{x:.5,y:.5},radius:.5,stops:[{color:"#ffffff",opacity:1,position:0},{color:"#000000",opacity:1,position:1}]},Ig=.001,Rg=256,Ch=he.stops[0].color;function xa(r,t){let e=r*Math.PI/180,i=Math.sin(e),s=Math.cos(e),n=t.width*i,a=-t.height*s,l=(Math.abs(t.width*i)+Math.abs(t.height*s))/(n*n+a*a||1);return{x1:.5-l*n/2,y1:.5-l*a/2,x2:.5+l*n/2,y2:.5+l*a/2}}function wa(r,t){let e=(r.x2-r.x1)/(t.width||1),i=(r.y2-r.y1)/(t.height||1);return(Math.atan2(e,-i)*180/Math.PI+360)%360}function Bg(r){let t=Mt(r.color)?r.color:Ch,e=new Q(t),i=Number.isFinite(r.opacity)?r.opacity:1;return e.setAlpha(Y(i,0,1)),e.toRgba()}function mi(r,t){let e=[...r.stops].sort((i,s)=>i.position-s.position).slice(0,Rg).map(i=>{let s=Number.isFinite(i.position)?i.position:0;return{offset:Y(s,0,1),color:Bg(i)}});if(r.kind==="radial"){let i=Math.max(Ig,r.radius);return new Wt({type:"radial",gradientUnits:"percentage",coords:{x1:r.center.x,y1:r.center.y,r1:0,x2:r.center.x,y2:r.center.y,r2:i},colorStops:e})}return new Wt({type:"linear",gradientUnits:"percentage",coords:xa(r.angle,t),colorStops:e})}function Sh(r){let t=r.fill;if(!t||typeof t=="string"||!(t instanceof Wt))return null;let e=t.colorStops.map(s=>{let n=Mt(s.color)?s.color:Ch,a=new Q(n),o=Number.isFinite(s.offset)?s.offset:0;return{color:`#${a.toHex().toLowerCase()}`,opacity:a.getAlpha(),position:Y(o,0,1)}});if(t.type==="radial"){let{x1:s,y1:n,r2:a}=t.coords;return{kind:"radial",angle:he.angle,center:{x:s,y:n},radius:a,stops:e}}let i={width:r.width||1,height:r.height||1};return{kind:"linear",angle:wa(t.coords,i),center:{...he.center},radius:he.radius,stops:e}}var Xg=.1,Wg=8;function Yg(r){return r instanceof DOMException&&r.name==="SecurityError"||r instanceof Error&&/taint|cross-origin|insecure/i.test(r.message)}var Fs=class{canvas;layers;history;events;units;snapping;crop;patterns;curves;wrap;maskPresets;layerMasks;fonts;licensing;pages;masks;fileAdapter;imageProvider;zoomLevel=1;selectionStyle={...bs};mockup=null;designBackground;designBackgroundImage=null;backgroundImageOptions=null;constructor(t,e){this.events=new Ze,this.fonts=new gr,e.fonts?.forEach(n=>this.fonts.register(n)),this.licensing=new pr(e.license),this.units=new dr(e.unit??"px",e.dpi??72);let i=this.units.toPixels(e.width),s=this.units.toPixels(e.height);this.designBackground=e.backgroundColor??"#ffffff",this.canvas=new $i(t,{width:i,height:s,backgroundColor:this.designBackground,preserveObjectStacking:e.preserveObjectStacking??!0,selection:!0}),this.layers=new er(this.canvas,this.events),this.fileAdapter=e.fileAdapter,this.imageProvider=e.imageProvider,this.history=new rr({getState:()=>JSON.stringify(this.toJSON()),restoreState:async n=>{let a=JSON.parse(n);await this.fromJSON(a)},events:this.events}),this.layers.setHistoryCallback(()=>this.history.save()),this.snapping=new ir(this.canvas,this.events),this.crop=new sr(this.canvas,this.history,this.events),this.patterns=new Te(this.canvas,this.layers,this.history,this.events),this.curves=new lr(this.canvas,this.layers,this.history,this.events),this.wrap=new hr(this.canvas,this.layers,this.history,this.events),this.maskPresets=new Ee(this.canvas,this.layers,this.history,this.events),this.layerMasks=new je(this.canvas,this.layers,this.history,this.events),this.setupCanvasEvents(),this.refreshSelectionStyle(),this.history.saveImmediate(),this.pages=new fr(this),this.masks=new mr(this)}async addImage(t,e){try{let i=await U.fromURL(t,{},{originX:"left",originY:"top",...e}),s=this.layers.add("image",i);return this.layers.select(s.id),this.history.save(),s}catch(i){throw this.events.emit("error",{message:"Failed to add image",error:i}),i}}async replaceImageSource(t,e){let i=this.layers.get(t);if(!i||i.type!=="image"&&i.type!=="mask")throw new Error(`Image or mask layer not found: ${t}`);if(i.meta.pattern)throw new Error("Clear the pattern before replacing the image source");this.crop.activeLayerId()===t&&this.crop.cancel();let s=i.fabricObject;try{let n=await U.fromURL(e,{},{originX:"left",originY:"top"});return n.set({left:s.left,top:s.top,originX:s.originX,originY:s.originY,width:s.width,height:s.height,cropX:s.cropX,cropY:s.cropY,scaleX:s.scaleX,scaleY:s.scaleY,angle:s.angle,skewX:s.skewX,skewY:s.skewY,flipX:s.flipX,flipY:s.flipY}),n.filters=[...s.filters],n.applyFilters(),n.setCoords(),this.layers.replaceObject(t,n),i}catch(n){throw this.events.emit("error",{message:"Failed to replace image source",error:n}),n}}addText(t,e){let i=new Yt(t,{fontSize:32,fontFamily:"Arial",fill:"#000000",width:200,originX:"left",originY:"top",...e}),s=this.layers.add("text",i);return this.layers.select(s.id),this.history.save(),s}addShape(t,e){let i=t.create(e),s=this.layers.add("shape",i,t.name);return this.layers.select(s.id),this.history.save(),s}addGradient(t=he,e){let i=e?.width??this.canvas.getWidth(),s=e?.height??this.canvas.getHeight(),n=new V({left:e?.left??0,top:e?.top??0,originX:"left",originY:"top",width:i,height:s,strokeWidth:0,fill:mi(t,{width:i,height:s})}),a=this.layers.add("gradient",n,"Gradient");return this.layers.select(a.id),this.history.save(),a}setGradient(t,e,i=!0){let s=this.layers.get(t);if(!s)return;let n=s.fabricObject;n.set({fill:mi(e,{width:n.width||1,height:n.height||1})}),n.dirty=!0,this.canvas.requestRenderAll(),this.events.emit("layer:modified",{layerId:t}),i&&this.history.save()}setBlend(t,e){let i=this.layers.get(t);if(!i)return;let s=ii(e);i.fabricObject.set({globalCompositeOperation:s}),i.fabricObject.dirty=!0,i.renderProxy&&(i.renderProxy.set({globalCompositeOperation:s}),i.renderProxy.dirty=!0),this.canvas.requestRenderAll(),this.events.emit("layer:modified",{layerId:t}),this.history.save()}async addTemplate(t,e){let i={};for(let a of t.parameters){let o=e[a.key]??a.default;if(o===void 0)throw new Error(`Missing template parameter: ${a.key}`);if(a.type==="number"&&!Number.isFinite(Number(o)))throw new Error(`Invalid number for template parameter: ${a.key}`);if(a.type==="color"&&!Mt(o))throw new Error(`Invalid color for template parameter: ${a.key}`);i[a.key]=o}let s=As(t.svg.replace(/\{\{(\w+)(?:[|:]([^}]*))?\}\}/g,(a,o,l)=>{let h=i[o]??l;return h===void 0?a:Es(h)})),n=s.includes("<textPath")?[as(t,i)]:await os(t,s,i);if(n.length===0)throw new Error("Template SVG contains no renderable objects");return this.history.transaction(async()=>{let a=n.map(l=>{let h=this.layers.add(l.type,l.object,l.name);return l.curve&&this.curves.apply(h.id,l.curve,!1),h}),o=a.length===1?a[0]:await this.groupLayers(a.map(l=>l.id),t.name)??a[0];return o.fabricObject.set({left:this.canvas.getWidth()/2,top:this.canvas.getHeight()/2,originX:"center",originY:"center"}),o.fabricObject.setCoords(),this.layers.select(o.id),this.canvas.requestRenderAll(),this.history.save(),o})}removeLayer(t){this.crop.activeLayerId()===t&&this.crop.cancel(),this.masks.activeLayerId()===t&&this.masks.detach(t),this.layers.remove(t)&&this.history.save()}selectLayer(t){this.layers.select(t)}selectLayers(t){this.layers.selectMany(t)}getSelectedLayer(){let t=this.canvas.getActiveObject();return t?this.layers.findByObject(t)??null:null}flipLayer(t,e){let i=this.layers.get(t);if(!i)return;let s=i.fabricObject;e==="horizontal"?s.set("flipX",!s.flipX):s.set("flipY",!s.flipY),s.setCoords(),this.canvas.requestRenderAll(),this.history.save()}async duplicateLayer(t){let e=this.layers.get(t);if(!e)return null;let i=await e.fabricObject.clone();i.set({left:(i.left??0)+15,top:(i.top??0)+15}),i.setCoords();let s=this.layers.add(e.type,i,`${e.name} copy`);return s.meta=structuredClone(e.meta),s.visible=e.visible,s.locked=e.locked,s.opacity=e.opacity,i.set({visible:e.visible,selectable:!e.locked,evented:!e.locked,opacity:e.opacity}),this.patterns.attachTo(s),this.layers.select(s.id),this.canvas.requestRenderAll(),this.history.save(),s}applyImageAdjustments(t,e){let i=this.layers.get(t);if(!i||i.type!=="image")return!1;let s=i.fabricObject,a={...i.meta.imageAdjustments??{},...e},o=(l,h=-1)=>Y(l??0,h,1);return s.filters=[new ri.Brightness({brightness:o(a.brightness)}),new ri.Contrast({contrast:o(a.contrast)}),new ri.Saturation({saturation:o(a.saturation)}),new ri.Blur({blur:o(a.blur,0)})],i.meta.imageAdjustments=a,s.applyFilters(),this.canvas.requestRenderAll(),this.history.save(),!0}async groupLayers(t,e="Group"){let i=[...new Set(t)],s=i.map(l=>this.layers.get(l)).filter(l=>l!==void 0&&l.parentId===null);if(s.length<2||s.length!==i.length)return null;let n=this.layers.getAll(),a=Math.max(...s.map(l=>n.indexOf(l))),o=n.slice(0,a).filter(l=>!s.includes(l)).length;return this.history.transaction(()=>{let l=[],h=[];for(let d of s)if(d.type==="group"&&d.children.length>0){let g=d.fabricObject.removeAll();for(let[p,f]of g.entries()){f.setCoords();let y=d.children[p];y&&(l.push(y),h.push(f))}d.children=[],this.layers.detach(d.id)}else l.push(d),h.push(d.fabricObject),this.layers.detach(d.id);let c=new q(h),u=this.layers.add("group",c,e);return this.layers.adoptChildren(u,l),this.layers.reorder(u.id,o),this.layers.select(u.id),this.history.save(),u})}async ungroupLayer(t){let e=this.layers.get(t);return!e||e.type!=="group"||e.children.length===0?[]:this.history.transaction(()=>{let i=this.layers.explode(e);return this.history.save(),this.layers.select(i[0]?.id??null),i})}toJSON(){return Cs(this)}async fromJSON(t){let e=this.history.isRestoring();e||(this.history.saveImmediate(),this.history.pause());try{await Ss(this,t),await this.patterns.rehydrateAll(),this.layerMasks.refreshAll()}catch(i){throw e||this.events.emit("error",{message:"Failed to load editor state",error:i}),i}finally{e||this.history.resume()}e||(this.history.clear(),this.history.saveImmediate())}async toPNG(t){return this.toRaster(t?.format??"png",t)}async toJPEG(t){return this.toRaster("jpeg",t)}async toWebP(t){return this.toRaster("webp",t)}async exportLayer(t,e={}){let i=this.layers.get(t);if(!i)throw new Error(`Layer not found: ${t}`);try{if(e.resolution==="source"&&i.fabricObject instanceof U){let s=await i.fabricObject.clone();return s.set({left:0,top:0,originX:"left",originY:"top",scaleX:1,scaleY:1,angle:0,flipX:!1,flipY:!1}),await gi(this.canvas,[s],{...e,width:s.width||1,height:s.height||1,cloneObjects:!1})}return await gi(this.canvas,[i.renderProxy??i.fabricObject],e)}catch(s){throw this.events.emit("error",{message:`Failed to export layer: ${t}`,error:s}),s}}async exportBackground(t={}){try{return await gi(this.canvas,[],{...t,backgroundColor:this.designBackground,backgroundImage:this.designBackgroundImage})}catch(e){throw this.events.emit("error",{message:"Failed to export background",error:e}),e}}async toRaster(t,e){this.events.emit("export:start",{format:t});try{await this.fonts.ready();let i=await this.withDesignBackground(()=>di(this.canvas,{...e,format:t}));return this.events.emit("export:complete",{format:t}),this.licensing.track(`export:${t}`),i}catch(i){throw this.events.emit("error",{message:Yg(i)?"Canvas export was blocked by cross-origin image data; load remote images with CORS enabled":`Failed to export ${t.toUpperCase()}`,error:i}),i}}toSVG(){this.events.emit("export:start",{format:"svg"});try{let t=this.withDesignBackground(()=>Ms(this.canvas));return this.events.emit("export:complete",{format:"svg"}),this.licensing.track("export:svg"),t}catch(t){throw this.events.emit("error",{message:"Failed to export SVG",error:t}),t}}async toSVGAsync(t={}){await this.fonts.ready();let e=this.toSVG();if(t.embedFonts===!1||this.fonts.getAll().length===0)return e;try{let i=await this.fonts.getEmbeddedCss();return e.replace(/(<svg\b[^>]*>)/i,`$1<defs><style>${i}</style></defs>`)}catch(i){throw this.events.emit("error",{message:"Failed to embed fonts in SVG",error:i}),i}}toDataURL(t="png",e=1){return this.withDesignBackground(()=>Ps(this.canvas,t,e))}async toPrintFile(t={}){await this.fonts.ready();try{let e=this.mockup?.printArea,i=e?await ks(this.canvas,e,t):await gi(this.canvas,this.canvas.getObjects(),t);return this.licensing.track(`export:print:${t.format??"png"}`),i}catch(e){throw this.events.emit("error",{message:"Failed to export print file",error:e}),e}}async toMockupImage(t={}){if(!this.mockup)throw new Error("No mockup is configured");await this.fonts.ready();try{let e=await Os(this.canvas,this.mockup,t);return this.licensing.track(`export:mockup:${t.format??"png"}`),e}catch(e){throw this.events.emit("error",{message:"Failed to export mockup",error:e}),e}}withDesignBackground(t){if(!this.mockup)return t();let e=this.canvas.backgroundColor,i=this.canvas.backgroundImage;this.canvas.backgroundColor=this.designBackground,this.canvas.backgroundImage=this.designBackgroundImage??void 0;try{return t()}finally{this.canvas.backgroundColor=e,this.canvas.backgroundImage=i}}toPrintifyPositioning(){let t={},e=this.canvas.getWidth(),i=this.canvas.getHeight(),s=this.layers.getAll().filter(n=>n.type==="image");if(s.length===0)return t.front={x:.5,y:.5,scale:1,angle:0},t;for(let n of s){let a=n.fabricObject,o=a.getCenterPoint(),l=t[n.name]?`${n.name}-${n.id}`:n.name;t[l]={x:et(o.x/e),y:et(o.y/i),scale:et(a.scaleX??1),angle:et(a.angle??0)}}return t}toNormalizedPositioning(){let t=this.canvas.getWidth(),e=this.canvas.getHeight();return this.layers.getAll().map(i=>{let s=i.fabricObject,n=s.getCenterPoint(),a=s.getBoundingRect();return{layerId:i.id,name:i.name,type:i.type,centerX:et(n.x/t),centerY:et(n.y/e),width:et(a.width/t),height:et(a.height/e),scaleX:et(s.scaleX??1),scaleY:et(s.scaleY??1),angle:et(s.angle??0)}})}toProviderPositioning(t){return t.map(this.toNormalizedPositioning(),{width:this.canvas.getWidth(),height:this.canvas.getHeight()})}async save(t,e){if(!this.fileAdapter)return;let i;e==="png"?i=await this.toPNG():e==="jpeg"?i=await this.toJPEG():e==="webp"?i=await this.toWebP():e==="svg"?i=await this.toSVGAsync():i=JSON.stringify(this.toJSON(),null,2);try{return await this.fileAdapter.save(i,t,e)}catch(s){throw this.events.emit("error",{message:`Failed to save ${e}`,error:s}),s}}async uploadImage(t){if(this.imageProvider?.upload)try{return await this.imageProvider.upload(t)}catch(e){throw this.events.emit("error",{message:"Failed to upload image",error:e}),e}}async browseImages(){if(!this.imageProvider?.browse)return null;try{return await this.imageProvider.browse()}catch(t){throw this.events.emit("error",{message:"Failed to browse images",error:t}),t}}async searchImages(t,e){if(!this.imageProvider?.search)return null;try{return await this.imageProvider.search(t,e)}catch(i){throw this.events.emit("error",{message:"Failed to search images",error:i}),i}}async addProviderImage(t,e){try{await this.imageProvider?.trackUse?.(t)}catch(i){throw this.events.emit("error",{message:"Failed to record image use",error:i}),i}return this.addImage(t.url,e)}setFileAdapter(t){this.fileAdapter=t}setImageProvider(t){this.imageProvider=t}setBackground(t){this.designBackground=t,this.mockup||(this.canvas.backgroundColor=t,this.canvas.requestRenderAll()),this.history.save(),this.events.emit("canvas:modified",{})}getDesignBackground(){return this.designBackground}getDesignBackgroundImage(){return this.designBackgroundImage}getBackgroundImageOptions(){return this.backgroundImageOptions?{...this.backgroundImageOptions}:null}async setBackgroundImage(t,e={}){if(t===null){this.setBackgroundImageObject(null);return}try{let i=await U.fromURL(t,{crossOrigin:e.crossOrigin??null,signal:e.signal},{originX:"left",originY:"top"}),s=i.width||1,n=i.height||1,a=this.canvas.getWidth(),o=this.canvas.getHeight(),l=e.fit??"cover",h=a/s,c=o/n,u=l==="stretch"?h:l==="contain"?Math.min(h,c):Math.max(h,c),d=l==="stretch"?c:u;i.set({left:(a-s*u)/2,top:(o-n*d)/2,scaleX:u,scaleY:d,opacity:Y(e.opacity??1,0,1),selectable:!1,evented:!1});let g={...e};delete g.signal,this.setBackgroundImageObject(i,!0,g)}catch(i){throw this.events.emit("error",{message:"Failed to set background image",error:i}),i}}setBackgroundImageObject(t,e=!0,i=null){this.designBackgroundImage=t,this.backgroundImageOptions=t?i:null,this.canvas.backgroundImage=this.mockup?void 0:t??void 0,this.canvas.requestRenderAll(),e&&this.history.save(),this.events.emit("canvas:modified",{})}setTransparentBackground(){this.setBackground("")}resize(t,e,i={}){let s=this.units.toPixels(t),n=this.units.toPixels(e),a=this.canvas.getWidth(),o=this.canvas.getHeight();if((i.scaleContent??!0)&&a>0&&o>0){let h=s/a,c=n/o;for(let u of this.layers.getAll()){let d=u.fabricObject;d.set({left:(d.left??0)*h,top:(d.top??0)*c,scaleX:(d.scaleX??1)*h,scaleY:(d.scaleY??1)*c}),d.setCoords()}this.designBackgroundImage&&(this.designBackgroundImage.set({left:(this.designBackgroundImage.left??0)*h,top:(this.designBackgroundImage.top??0)*c,scaleX:(this.designBackgroundImage.scaleX??1)*h,scaleY:(this.designBackgroundImage.scaleY??1)*c}),this.designBackgroundImage.setCoords())}this.canvas.setDimensions({width:s,height:n}),this.patterns.syncArea(),this.canvas.requestRenderAll(),this.history.save(),this.events.emit("canvas:modified",{})}getImageDpi(t){let e=this.layers.get(t);if(!e||e.type!=="image")return null;let i=e.fabricObject,s=i.width??0,n=i.getScaledWidth();return s<=0||n<=0?null:et(s/(n/this.units.getDpi()))}validateImageDpi(t=300){return this.layers.getAll().filter(e=>e.type==="image"&&!e.meta.pattern).flatMap(e=>{let i=this.getImageDpi(e.id);return i!==null&&i<t?[{layerId:e.id,layerName:e.name,effectiveDpi:i,minimumDpi:t}]:[]})}toThumbnail(t=320,e=320,i="png"){let s=Math.min(1,t/this.canvas.getWidth(),e/this.canvas.getHeight());return this.toDataURL(i,s)}bringToFront(t){return this.layers.reorder(t,this.layers.count()-1)}sendToBack(t){return this.layers.reorder(t,0)}bringForward(t){let e=this.layers.getAll().findIndex(i=>i.id===t);return e>=0&&this.layers.reorder(t,e+1)}sendBackward(t){let e=this.layers.getAll().findIndex(i=>i.id===t);return e>=0&&this.layers.reorder(t,e-1)}setZoom(t){let e=Y(et(t),Xg,Wg);e!==this.zoomLevel&&(this.zoomLevel=e,this.refreshSelectionStyle(),this.events.emit("zoom:changed",{zoom:e}))}zoom(t){this.setZoom(t)}getZoom(){return this.zoomLevel}zoomIn(t=.1){this.setZoom(this.zoomLevel+t)}zoomOut(t=.1){this.setZoom(this.zoomLevel-t)}resetZoom(){this.setZoom(1)}zoomToFit(t,e,i=0){let s=this.canvas.getWidth(),n=this.canvas.getHeight();if(s<=0||n<=0)return;let a=(t-i*2)/s,o=(e-i*2)/n;this.setZoom(Math.min(a,o))}zoomToSelection(t=24){let e=this.canvas.getActiveObject();if(!e)return;e.setCoords();let i=e.getBoundingRect();i.width<=0||i.height<=0||this.setZoom(Math.min((this.canvas.getWidth()-t*2)/i.width,(this.canvas.getHeight()-t*2)/i.height))}applyPattern(t,e){return this.patterns.apply(t,e)}clearPattern(t){return this.patterns.disable(t)}applyTextCurve(t,e){let i=this.curves.apply(t,e);return i&&this.wrap.refresh(t),i}clearTextCurve(t){let e=this.curves.clear(t);return e&&this.wrap.refresh(t),e}getTextCurve(t){return this.curves.get(t)}applyTextWrap(t,e){return this.wrap.apply(t,e)}setTextOverflow(t,e){return this.wrap.setOverflow(t,e)}getTextWrap(t){return this.wrap.get(t)}applyMaskPreset(t,e){return this.maskPresets.apply(t,e)}clearMaskPreset(t){return this.maskPresets.clear(t)}getMaskPreset(t){return this.maskPresets.get(t)}setLayerAspectLock(t,e){let i=this.layers.get(t);return i?(De(i.fabricObject,e),e?i.meta.lockAspect=!0:delete i.meta.lockAspect,this.canvas.requestRenderAll(),this.events.emit("layer:modified",{layerId:t}),this.history.save(),!0):!1}getLayerAspectLock(t){return this.layers.get(t)?.meta.lockAspect===!0}restoreAspectLocks(){for(let t of this.layers.getAll())t.meta.lockAspect&&De(t.fabricObject,!0)}resetLayerTransform(t){let e=this.layers.get(t);return e?(ws(e.fabricObject),this.canvas.requestRenderAll(),this.events.emit("layer:modified",{layerId:t}),this.history.save(),!0):!1}setLayerShadow(t,e){let i=this.layers.get(t);return i?(vs(i.fabricObject,e),i.fabricObject.dirty=!0,this.canvas.requestRenderAll(),this.events.emit("layer:modified",{layerId:t}),this.history.save(),!0):!1}getLayerShadow(t){let e=this.layers.get(t);return e?ui(e.fabricObject):null}setMockup(t,e={}){this.mockup=t,this.canvas.backgroundColor=t?"":this.designBackground,this.canvas.backgroundImage=t?void 0:this.designBackgroundImage??void 0,this.canvas.requestRenderAll(),this.events.emit("mockup:changed",{mockup:t}),e.history!==!1&&this.history.save()}clearMockup(){this.setMockup(null)}getMockup(){return this.mockup}dispose(){this.masks.dispose(),this.layerMasks.dispose(),this.snapping.dispose(),this.crop.dispose(),this.history.dispose(),this.patterns.dispose(),this.curves.dispose(),this.wrap.dispose(),this.events.removeAllListeners(),this.canvas.dispose()}getSelectionStyle(){return{...this.selectionStyle}}setSelectionStyle(t){this.selectionStyle={...this.selectionStyle,...t},this.refreshSelectionStyle()}refreshSelectionStyle(){xs(this.canvas,this.selectionStyle,this.zoomLevel)}setupCanvasEvents(){this.canvas.on("object:added",e=>{e.target&&Ae(e.target,this.selectionStyle,this.zoomLevel)});let t=()=>{let e=this.canvas.getActiveObject();e&&Ae(e,this.selectionStyle,this.zoomLevel)};this.canvas.on("object:modified",e=>{if(!e.target)return;let i=this.layers.findByObject(e.target);i&&(this.events.emit("layer:modified",{layerId:i.id}),this.history.save())}),this.canvas.on("selection:created",e=>{t();let i=(e.selected??[]).map(s=>this.layers.findByObject(s)?.id).filter(s=>s!==void 0);this.events.emit("selection:changed",{selected:i})}),this.canvas.on("selection:updated",e=>{t();let i=(e.selected??[]).map(s=>this.layers.findByObject(s)?.id).filter(s=>s!==void 0);this.events.emit("selection:changed",{selected:i})}),this.canvas.on("selection:cleared",()=>{this.events.emit("selection:changed",{selected:[]})})}};var _h={mode:"grid",scale:100,horizontalSpacing:0,verticalSpacing:0,angle:0,horizontalOffset:50,offsetX:0,offsetY:0,rotationStepH:0,rotationStepV:0,horizontalLimit:0,verticalLimit:0};var Th=[{id:"a4-portrait",name:"A4 portrait",width:210,height:297,unit:"mm",dpi:300},{id:"a4-landscape",name:"A4 landscape",width:297,height:210,unit:"mm",dpi:300},{id:"us-letter",name:"US Letter",width:8.5,height:11,unit:"in",dpi:300},{id:"shirt-front",name:"Garment front",width:12,height:16,unit:"in",dpi:300},{id:"instagram-square",name:"Social square",width:1080,height:1080,unit:"px",dpi:72},{id:"story",name:"Story",width:1080,height:1920,unit:"px",dpi:72}];var Is=class{items=new Map;transform={zoom:1,panX:0,panY:0,devicePixelRatio:1};set(t){this.items.set(t.id,structuredClone(t))}remove(t){return this.items.delete(t)}clear(){this.items.clear()}getAll(){return[...this.items.values()].map(t=>structuredClone(t))}setTransform(t){if(!Number.isFinite(t.zoom)||t.zoom<=0)throw new Error("Annotation zoom must be positive");this.transform={...t,devicePixelRatio:t.devicePixelRatio??1}}documentToViewport(t){return{x:t.x*this.transform.zoom+this.transform.panX,y:t.y*this.transform.zoom+this.transform.panY}}viewportToDocument(t){return{x:(t.x-this.transform.panX)/this.transform.zoom,y:(t.y-this.transform.panY)/this.transform.zoom}}documentToDevice(t){let e=this.documentToViewport(t),i=this.transform.devicePixelRatio??1;return{x:e.x*i,y:e.y*i}}};return jh($g);})();
|
|
507
|
+
`)}};function Eg(r,t){let e=r.toLowerCase(),i=t.toLowerCase();if(i.startsWith("*.")){let s=i.slice(1);return e.endsWith(s)&&e.length>s.length}return e===i}function Ag(r){return r==="localhost"||r==="127.0.0.1"||r==="::1"||r.endsWith(".localhost")}var pr=class{constructor(t={}){this.config=t;let e=t.hostname??globalThis.location?.hostname??"localhost";(t.environment??"development")!=="production"||Ag(e)?(this.status={state:"exempt",payload:null},this.readyPromise=Promise.resolve(this.status)):t.key?(this.status={state:"checking",payload:null},this.readyPromise=this.validate(t.key,e)):(this.status={state:"community",payload:null},this.readyPromise=Promise.resolve(this.status))}config;status;readyPromise;getStatus(){return this.status}ready(){return this.readyPromise}hasFeature(t){return this.status.state==="valid"&&(this.status.payload.features??[]).includes(t)}track(t){this.config.onUsage?.({name:t,at:new Date().toISOString(),licenseId:this.status.state==="valid"?this.status.payload.id:void 0})}async validate(t,e){let i=await this.config.verifyOffline?.(t)??null;return i?i.expiresAt&&Date.parse(i.expiresAt)<Date.now()?this.status={state:"expired",payload:i}:i.domains.some(s=>Eg(e,s))?this.status={state:"valid",payload:i}:this.status={state:"domain-mismatch",payload:i}:this.status={state:"invalid",payload:null}}};var fr=class{constructor(t){this.editor=t;let e={id:mt(),name:"Page 1",state:t.toJSON()};this.pages=[e],this.activePageId=e.id}editor;pages;activePageId;getAll(){return this.pages.map(({id:t,name:e})=>({id:t,name:e}))}getActivePageId(){return this.activePageId}add(t=`Page ${this.pages.length+1}`,e=!1){this.saveCurrent();let i=structuredClone(this.editor.toJSON()),s=e?i:this.blankState(i),n={id:mt(),name:t,state:s};return this.pages.push(n),this.emitChanged(),n.id}async switchTo(t){if(t===this.activePageId)return!0;let e=this.pages.find(i=>i.id===t);return e?(this.saveCurrent(),await this.editor.fromJSON(structuredClone(e.state)),this.activePageId=t,this.emitChanged(),!0):!1}async duplicate(t){this.saveCurrent();let e=this.pages.find(n=>n.id===t);if(!e)return null;let i={id:mt(),name:`${e.name} copy`,state:structuredClone(e.state)},s=this.pages.indexOf(e);return this.pages.splice(s+1,0,i),this.emitChanged(),i.id}async remove(t){if(this.pages.length===1)return!1;let e=this.pages.findIndex(i=>i.id===t);if(e<0)return!1;if(t===this.activePageId){let i=this.pages[e+1]??this.pages[e-1];await this.editor.fromJSON(structuredClone(i.state)),this.activePageId=i.id}return this.pages.splice(e,1),this.emitChanged(),!0}rename(t,e){let i=this.pages.find(n=>n.id===t),s=e.trim();return!i||!s||i.name===s?!1:(i.name=s,this.emitChanged(),!0)}reorder(t,e){let i=this.pages.findIndex(a=>a.id===t);if(i<0||!Number.isFinite(e))return!1;let s=Math.max(0,Math.min(this.pages.length-1,Math.round(e)));if(s===i)return!1;let[n]=this.pages.splice(i,1);return this.pages.splice(s,0,n),this.emitChanged(),!0}toJSON(){return this.saveCurrent(),{version:"1.0.0",activePageId:this.activePageId,pages:structuredClone(this.pages)}}async fromJSON(t){if(t?.version!=="1.0.0"||!Array.isArray(t.pages)||t.pages.length===0||!t.pages.some(s=>s.id===t.activePageId))throw new Error("Invalid project state");let e=structuredClone(t.pages),i=e.find(s=>s.id===t.activePageId);await this.editor.fromJSON(structuredClone(i.state)),this.pages=e,this.activePageId=i.id,this.emitChanged()}saveCurrent(){let t=this.pages.find(e=>e.id===this.activePageId);t&&(t.state=structuredClone(this.editor.toJSON()))}blankState(t){return{...t,layers:[],mockup:null}}emitChanged(){this.editor.events.emit("project:changed",{activePageId:this.activePageId,pages:this.getAll()})}};var Rt=class extends Error{constructor(e,i,s){super(i);this.code=e;this.cause=s;this.name="MaskRefinementError"}code;cause},mr=class{constructor(t){this.editor=t}editor;backing=null;context=null;layerId=null;brush=null;previousPoint=null;strokeBackup=null;strokeStartedAt=null;lastInteractionLatencyMs=0;refinement=null;disposed=!1;async create(t=this.editor.canvas.getWidth(),e=this.editor.canvas.getHeight()){if(this.assertActive(),!Number.isInteger(t)||!Number.isInteger(e)||t<=0||e<=0)throw new Error("Mask dimensions must be positive integers");let i=this.makeCanvas(t,e),s=new U(i,{left:0,top:0,originX:"left",originY:"top",selectable:!1}),n=this.editor.layers.add("mask",s,"Mask");return n.meta.mask={width:t,height:e,revision:0},this.editor.history.saveImmediate(),this.attachBacking(n.id,i),n}attach(t){this.assertActive(),this.cancelStroke();let e=this.requireMask(t),i=e.fabricObject,s=e.meta.mask?.width??i.width??this.editor.canvas.getWidth(),n=e.meta.mask?.height??i.height??this.editor.canvas.getHeight(),a=this.makeCanvas(s,n),o=a.getContext("2d");if(!o)throw new Error("2D mask context is unavailable");let l=i.getElement();l&&o.drawImage(l,0,0,s,n),this.attachBacking(t,a)}beginStroke(t){if(this.assertActive(),!this.context||!this.backing||!this.layerId)throw new Error("Attach a mask first");if(this.brush)throw new Error("A mask stroke is already active");if(!Number.isFinite(t.size)||t.size<=0)throw new Error("Mask brush size must be positive");this.brush={...t,hardness:Y(t.hardness,0,1)},this.previousPoint=null,this.strokeBackup=this.context.getImageData(0,0,this.backing.width,this.backing.height),this.strokeStartedAt=performance.now()}addPoint(t){if(!this.brush||!this.context||!this.backing||!this.layerId)throw new Error("No active mask stroke");if(!Number.isFinite(t.x)||!Number.isFinite(t.y))return;let e=this.previousPoint??t,i=Math.hypot(t.x-e.x,t.y-e.y),s=Math.max(1,this.brush.size/4),n=Math.max(1,Math.ceil(i/s));for(let a=0;a<=n;a+=1){let o=a/n;this.drawDot({x:e.x+(t.x-e.x)*o,y:e.y+(t.y-e.y)*o})}this.previousPoint=t,this.requireMask(this.layerId).fabricObject.setElement(this.backing),this.editor.canvas.requestRenderAll()}async endStroke(){if(!this.brush||!this.backing||!this.layerId)return;let t=this.layerId;this.brush=null,this.previousPoint=null,this.strokeBackup=null;let e=this.backing.toDataURL("image/png");await this.editor.history.transaction(async()=>{await this.editor.replaceImageSource(t,e);let i=this.requireMask(t);i.meta.mask&&(i.meta.mask.revision+=1)}),this.attach(t),this.strokeStartedAt!==null&&(this.lastInteractionLatencyMs=performance.now()-this.strokeStartedAt,this.strokeStartedAt=null)}cancelStroke(){this.strokeBackup&&this.context&&this.backing&&this.layerId&&(this.context.putImageData(this.strokeBackup,0,0),this.requireMask(this.layerId).fabricObject.setElement(this.backing),this.editor.canvas.requestRenderAll()),this.brush=null,this.previousPoint=null,this.strokeBackup=null,this.strokeStartedAt=null}isStrokeActive(){return this.brush!==null}activeLayerId(){return this.layerId}detach(t){t&&this.layerId!==t||(this.cancelStroke(),this.cancelRefinement(),this.backing=null,this.context=null,this.layerId=null)}async refine(t,e,i,s={}){this.assertActive();let n=this.editor.layers.get(t);if(!n||n.type!=="mask")throw new Rt("not-found",`Mask layer not found: ${t}`);this.cancelRefinement();let a=new AbortController;this.refinement=a;let o=()=>a.abort(s.signal?.reason);s.signal?.addEventListener("abort",o,{once:!0}),s.signal?.aborted&&o();try{let l=n.fabricObject,h=await e.refine({mask:l.getSrc(),width:n.meta.mask?.width??l.width??1,height:n.meta.mask?.height??l.height??1,prompts:structuredClone(i)},{signal:a.signal,onProgress:s.onProgress});if(a.signal.aborted)throw new Rt("cancelled","Mask refinement cancelled");if(!/^data:image\/(?:png|jpeg|webp);base64,/i.test(h.dataUrl))throw new Rt("invalid-result","Mask refinement must return a base64 PNG, JPEG, or WebP data URL");return await this.editor.history.transaction(async()=>{await this.editor.replaceImageSource(t,h.dataUrl),n.meta.mask&&(n.meta.mask.revision+=1)}),this.attach(t),h}catch(l){throw l instanceof Rt?l:a.signal.aborted?new Rt("cancelled","Mask refinement cancelled",l):new Rt("provider","Mask refinement provider failed",l)}finally{s.signal?.removeEventListener("abort",o),this.refinement===a&&(this.refinement=null)}}cancelRefinement(){this.refinement?.abort(new DOMException("Cancelled","AbortError")),this.refinement=null}measure(){if(!this.backing)return null;let t=performance.now();this.context?.getImageData(0,0,1,1);let e=this.backing.width*this.backing.height*4,i=this.strokeBackup?e:0,s=performance;return{width:this.backing.width,height:this.backing.height,backingBytes:e,strokeBackupBytes:i,estimatedPeakBytes:e+i,historyBytes:this.editor.history.getSnapshotBytes(),interactionLatencyMs:this.lastInteractionLatencyMs,...typeof s.memory?.usedJSHeapSize=="number"?{usedJsHeapBytes:s.memory.usedJSHeapSize}:{},elapsedMs:performance.now()-t}}dispose(){this.detach(),this.disposed=!0}drawDot(t){let e=this.context,i=this.brush,s=i.size/2;e.save(),e.globalCompositeOperation=i.mode==="subtract"?"destination-out":"source-over";let n=e.createRadialGradient(t.x,t.y,s*i.hardness,t.x,t.y,s),a=i.mode==="subtract"?"rgba(0,0,0,1)":"rgba(255,255,255,1)";n.addColorStop(0,a),n.addColorStop(1,"rgba(255,255,255,0)"),e.fillStyle=n,e.beginPath(),e.arc(t.x,t.y,s,0,Math.PI*2),e.fill(),e.restore()}makeCanvas(t,e){let i=this.editor.canvas.lowerCanvasEl.ownerDocument.createElement("canvas");return i.width=t,i.height=e,i}attachBacking(t,e){let i=e.getContext("2d");if(!i)throw new Error("2D mask context is unavailable");this.layerId=t,this.backing=e,this.context=i}requireMask(t){let e=this.editor.layers.get(t);if(!e||e.type!=="mask")throw new Error(`Mask layer not found: ${t}`);return e}assertActive(){if(this.disposed)throw new Error("Mask controller has been disposed")}};var Dg={add:"source-over",subtract:"destination-out",intersect:"destination-in"};function jg(r){r.set({opacity:0,globalCompositeOperation:"source-over"})}function Lg(r){return new V({left:r.left,top:r.top,width:Math.max(1,r.width),height:Math.max(1,r.height),originX:"left",originY:"top",fill:"#000000",objectCaching:!1})}function pi(r,t,e){if(r.length===0)return;r.forEach((n,a)=>{let o=t[a];if(n.set({objectCaching:!1}),!o||!o.visible){jg(n);return}n.set({opacity:o.opacity,globalCompositeOperation:Dg[o.mode]??"source-over"})});let i=t.find(n=>n.visible),s=i&&i.mode!=="add"?[Lg(e.box),...r]:[...r];return new q(s,{absolutePositioned:e.absolute,objectCaching:!0,subTargetCheck:!1,interactive:!1})}function qt(r){return r.some(t=>!t.linked)}var js=class{constructor(t,e){this.canvas=t;this.onCommit=e}canvas;onCommit;handle=null;editing=null;child=null;group=null;active(){return this.editing}async begin(t,e,i){this.end();let s=await i.clone();return Oe(s,bt(i)),s.set({fill:"rgba(0,0,0,0.001)",stroke:"#e0b055",strokeWidth:2,strokeDashArray:[6,4],strokeUniform:!0,opacity:1,selectable:!0,evented:!0,hasControls:!0,hasBorders:!0,objectCaching:!1,excludeFromExport:!0}),this.handle=s,this.editing=t,this.child=i,this.group=e,this.canvas.add(s),this.canvas.setActiveObject(s),this.canvas.on("object:moving",this.onTransform),this.canvas.on("object:scaling",this.onTransform),this.canvas.on("object:rotating",this.onTransform),this.canvas.on("object:modified",this.onModified),this.canvas.requestRenderAll(),!0}end(){this.handle&&(this.canvas.off("object:moving",this.onTransform),this.canvas.off("object:scaling",this.onTransform),this.canvas.off("object:rotating",this.onTransform),this.canvas.off("object:modified",this.onModified),this.canvas.getActiveObject()===this.handle&&this.canvas.discardActiveObject(),this.canvas.remove(this.handle),this.handle=null,this.editing=null,this.child=null,this.group=null,this.canvas.requestRenderAll())}dispose(){this.end()}onTransform=t=>{!this.handle||t.target!==this.handle||this.write()};onModified=t=>{!this.handle||t.target!==this.handle||(this.write(),this.onCommit())};write(){!this.handle||!this.child||!this.group||(Oe(this.child,tt.multiplyTransformMatrices(tt.invertTransform(bt(this.group)),bt(this.handle))),this.group.dirty=!0,this.group.set({dirty:!0}),this.canvas.requestRenderAll())}};function ma(r){return r.getAll().find(t=>t.meta.canvasMask)}function ya(r,t){let e=new V({left:0,top:0,width:r.getWidth(),height:r.getHeight(),originX:"left",originY:"top",fill:"#000000",globalCompositeOperation:"destination-in",selectable:!1,evented:!1,hasControls:!1,hasBorders:!1,objectCaching:!1}),i=t.add("mask",e,"Design mask");return i.meta.canvasMask=!0,t.setLocked(i.id,!0),i}function va(r){let t=r.getAll(),e=t.findIndex(s=>s.meta.canvasMask);if(e===-1)return!1;let i=-1;return t.forEach((s,n)=>{s.type!=="mask"&&(i=n)}),e>=i?!1:(r.reorder(t[e].id,t.length-1),!0)}function ba(r,t,e){if(!t)return{left:0,top:0,width:r.getWidth(),height:r.getHeight()};if(e){t.setCoords();let n=t.getBoundingRect();return{left:n.left,top:n.top,width:n.width,height:n.height}}let i=Math.max(1,t.width??1),s=Math.max(1,t.height??1);return{left:-i/2,top:-s/2,width:i,height:s}}function bh(r,t,e){let i=r.clipPath instanceof q?r.clipPath.absolutePositioned:e;if(e!==i)for(let s of t)e?Me(s,r):Ut(s,r)}function xh(r,t,e,i){return r.map((s,n)=>{let a=t[n];if(i&&s.linked&&a)return{...s,rel:[...na(a,e)]};if(!s.rel)return s;let o={...s};return delete o.rel,o})}function wh(r,t,e,i,s){r.clipPath=pi(e,t,{box:i,absolute:s}),r.dirty=!0,r.setCoords()}var rt="canvas",yr=10,Ls={mode:"add",linked:!0,visible:!0,opacity:1},fi=class{constructor(t,e,i,s){this.canvas=t;this.layers=e;this.history=i;this.events=s}canvas;layers;history;events;selected=null;pinning=!1;list(t){return this.hostLayer(t)?.meta.maskStack??[]}get(t,e){return this.list(t).find(i=>i.id===e)}targets(){return this.layers.getAll().filter(t=>(t.meta.maskStack??[]).length>0).map(t=>t.meta.canvasMask?rt:t.id)}hostBox(t,e=t===rt||qt(this.list(t))){return ba(this.canvas,this.host(t),e)}hostLayer(t,e=!1){if(t!==rt)return this.layers.get(t);let i=ma(this.layers);return i||!e?i:ya(this.canvas,this.layers)}host(t,e=!1){return this.hostLayer(t,e)?.fabricObject??null}pin(){if(!this.pinning){this.pinning=!0;try{va(this.layers)}finally{this.pinning=!1}}}holdsBoxClip(t){return t?.overflow==="hidden"&&!t.maskPreset}unwrap(t,e){let i=e.clipPath;if(!i)return[];let s=this.list(t),n=this.hostLayer(t)?.meta;if(s.length===0&&this.holdsBoxClip(n))return[];if(s.length===0||!(i instanceof q)){let l=i;return n?.overflow==="hidden"&&(l.clipPath=void 0),[l]}let a=ai(i),o=a.length-s.length;return o>0?a.slice(o):a}entriesFor(t,e){let i=this.list(t);if(i.length>0||e.length!==1)return[...i];let s=this.hostLayer(t),n=s?.meta.maskPreset;return s&&delete s.meta.maskPreset,[{...Ls,id:mt(),name:typeof n=="string"?n:"Mask",linked:t===rt?!1:!e[0].absolutePositioned}]}commit(t,e,i,s,n=!0,a=!1){let o=this.hostLayer(t);if(!o)return;let l=a||t===rt||qt(i);bh(e,s,l);let h=xh(i,s,e,l);wh(e,h,s,this.hostBox(t,l),l),h.length===0?(delete o.meta.maskStack,o.meta.canvasMask&&this.layers.remove(o.id)):o.meta.maskStack=h,this.canvas.requestRenderAll(),this.events.emit("masks:changed",{target:t}),this.events.emit("layer:modified",{layerId:o.id}),n&&this.history.save()}};var je=class extends fi{edits=new js(this.canvas,()=>this.history.save());onLayersChanged=()=>this.pin();onLayerSelected=({layerId:t})=>{t&&this.selected&&this.select(null,null)};onObjectModified=t=>{let e=t.target;if(!e)return;let i=this.layers.findByObject(e);i&&this.reflow(i.id)};constructor(t,e,i,s){super(t,e,i,s),this.events.on("layers:changed",this.onLayersChanged),this.events.on("layer:selected",this.onLayerSelected),this.canvas.on("object:modified",this.onObjectModified)}dispose(){this.edits.dispose(),this.events.off("layers:changed",this.onLayersChanged),this.events.off("layer:selected",this.onLayerSelected),this.canvas.off("object:modified",this.onObjectModified),this.selected=null}editing(){return this.edits.active()}async beginEdit(t,e){let i=this.host(t);if(!i)return!1;let s=this.list(t),n=s.findIndex(h=>h.id===e);if(n===-1)return!1;this.endEdit(!1),this.commit(t,i,[...s],this.unwrap(t,i),!1,!0);let a=i.clipPath instanceof q?i.clipPath:null;if(!a)return!1;let o=a.getObjects(),l=o[o.length-s.length+n];return l?(this.select(t,e),this.edits.begin({target:t,maskId:e},a,l)):!1}endEdit(t=!0){let e=this.edits.active();this.edits.end(),e&&this.rebuild(e.target,t)}getSelected(){return this.selected}select(t,e){this.selected=t&&e?{target:t,maskId:e}:null,this.selected&&this.layers.select(null),this.events.emit("mask:selected",{target:t,maskId:this.selected?e:null})}add(t,e,i={}){let s=this.host(t,!0);if(!s)return null;let n=this.unwrap(t,s),a=this.entriesFor(t,n);if(a.length>=yr)return null;let o={...Ls,id:mt(),name:i.name??"Mask",...i.mode?{mode:i.mode}:{},...i.linked===void 0?{}:{linked:i.linked},...i.meta?{meta:i.meta}:{},...i.sourceLayer?{sourceLayer:i.sourceLayer}:{},...i.sourceObject?{sourceObject:i.sourceObject}:{}};return t===rt&&(o.linked=!1),i.fit!==!1&&Pe(e,i.box??this.hostBox(t),i.fit??1),n.push(e),a.push(o),this.commit(t,s,a,n),o}replaceGeometry(t,e,i,s={}){let n=this.host(t);if(!n)return!1;let a=[...this.list(t)],o=a.findIndex(h=>h.id===e);if(o===-1)return!1;let l=this.unwrap(t,n);return s.fit!==!1&&Pe(i,s.box??this.hostBox(t),s.fit??1),l[o]=i,a[o]={...a[o],...s.name?{name:s.name}:{},...s.meta?{meta:s.meta}:{}},this.commit(t,n,a,l),!0}refit(t,e,i={}){let s=this.host(t);if(!s)return!1;let n=[...this.list(t)],a=n.findIndex(h=>h.id===e);if(a===-1)return!1;let o=this.unwrap(t,s),l=o[a];return l?(Pe(l,i.box??this.hostBox(t),i.fit??1),this.commit(t,s,n,o,i.save??!0),!0):!1}remove(t,e){let i=this.host(t);if(!i)return!1;let s=[...this.list(t)],n=s.findIndex(o=>o.id===e);if(n===-1)return!1;let a=this.unwrap(t,i);return s.splice(n,1),a.splice(n,1),this.selected?.maskId===e&&this.select(null,null),this.commit(t,i,s,a),!0}clear(t){let e=this.host(t);return!e||this.list(t).length===0?!1:(this.selected?.target===t&&this.select(null,null),this.commit(t,e,[],[]),!0)}unmask(t,e){let i=this.host(t);if(!i)return null;let s=[...this.list(t)],n=s.findIndex(h=>h.id===e);if(n===-1)return null;let a=this.unwrap(t,i),o=a[n];if(!o)return null;let l=s[n];this.history.beginTransaction();try{this.endEdit(!1),s.splice(n,1),a.splice(n,1),!o.absolutePositioned&&t!==rt&&Me(o,i),o.set({absolutePositioned:!1,opacity:l.sourceObject?.opacity??1,globalCompositeOperation:l.sourceObject?.globalCompositeOperation??"source-over",objectCaching:l.sourceObject?.objectCaching??!0}),this.selected?.maskId===e&&this.select(null,null),this.commit(t,i,s,a,!1);let h=l.sourceLayer,c=this.layers.add(h?.type??Fg(o),o,h?.name??l.name);return c.meta=h?.meta?structuredClone(h.meta):{},this.layers.setVisibility(c.id,h?.visible??!0),this.layers.setLocked(c.id,h?.locked??!1),this.layers.setOpacity(c.id,h?.opacity??1),this.layers.select(c.id),this.history.save(),c}finally{this.history.endTransaction()}}reorder(t,e,i){let s=this.host(t);if(!s)return!1;let n=[...this.list(t)],a=n.findIndex(u=>u.id===e);if(a===-1)return!1;let o=Math.max(0,Math.min(n.length-1,Math.round(i)));if(a===o)return!1;let l=this.unwrap(t,s),[h]=n.splice(a,1),[c]=l.splice(a,1);return n.splice(o,0,h),l.splice(o,0,c),this.commit(t,s,n,l),!0}setMeta(t,e,i){return this.patch(t,e,()=>({meta:i}))}setMode(t,e,i){return this.patch(t,e,s=>s.mode===i?null:{mode:i})}setVisible(t,e,i){return this.patch(t,e,s=>s.visible===i?null:{visible:i})}setOpacity(t,e,i){if(!Number.isFinite(i))return!1;let s=Math.max(0,Math.min(1,i));return this.patch(t,e,n=>n.opacity===s?null:{opacity:s})}setName(t,e,i){let s=i.trim();return s?this.patch(t,e,n=>n.name===s?null:{name:s}):!1}setLinked(t,e,i){if(t===rt)return!1;let s=this.host(t);if(!s)return!1;let n=[...this.list(t)],a=n.findIndex(l=>l.id===e);if(a===-1||n[a].linked===i)return!1;let o=this.unwrap(t,s);return n[a]={...n[a],linked:i},this.commit(t,s,n,o),!0}convertLayer(t,e){let i=this.layers.get(t);if(!i||i.meta.canvasMask)return null;let s=this.layers.getAll(),n=s.findIndex(g=>g.id===t),a=n>0?s[n-1]:void 0,o=e??(a&&!a.meta.canvasMask?a.id:rt);if(o===t||this.list(o).length>=yr)return null;let l=i.fabricObject,h={type:i.type,name:i.name,visible:i.visible,locked:i.locked,opacity:i.opacity,...Object.keys(i.meta).length>0?{meta:structuredClone(i.meta)}:{}},c={opacity:l.opacity??1,globalCompositeOperation:l.globalCompositeOperation??"source-over",objectCaching:l.objectCaching};!l.fill&&l.type!=="image"&&l.set({fill:"#000000"});let u=this.host(o);!(o===rt||qt(this.list(o)))&&u&&Ut(l,u),this.history.beginTransaction();try{this.canvas.getActiveObject()===l&&this.canvas.discardActiveObject(),this.canvas.remove(l),this.layers.remove(t);let g=this.add(o,l,{name:i.name,fit:!1,sourceLayer:h,sourceObject:c});return g?{target:o,entry:g}:null}finally{this.history.endTransaction()}}rebuild(t,e=!1){let i=this.host(t);if(!i)return;let s=this.unwrap(t,i);s.length!==0&&this.commit(t,i,this.entriesFor(t,s),s,e)}reflow(t){let e=this.host(t);if(!e)return;let i=this.list(t);if(i.length===0||!qt(i)||!i.some(n=>n.linked&&n.rel))return;let s=this.unwrap(t,e);i.forEach((n,a)=>{let o=s[a],l=oa(n.rel);!o||!n.linked||!l||aa(o,e,l)}),this.commit(t,e,[...i],s)}adopt(t,e){let i=this.hostLayer(t),s=i?.fabricObject.clipPath;if(!i||!s||i.meta.pattern||(i.meta.maskStack??[]).length>0||this.holdsBoxClip(i.meta))return null;let n={...Ls,id:mt(),name:e??"Mask",linked:t===rt?!1:!s.absolutePositioned};return i.meta.maskStack=[n],delete i.meta.maskPreset,this.rebuild(t),n}refreshAll(){this.selected=null,this.pin();for(let t of this.layers.getAll())(t.meta.maskStack??[]).length!==0&&this.rebuild(t.meta.canvasMask?rt:t.id)}patch(t,e,i){let s=this.host(t);if(!s)return!1;let n=[...this.list(t)],a=n.findIndex(h=>h.id===e);if(a===-1)return!1;let o=i(n[a]);if(!o)return!1;let l=this.unwrap(t,s);return n[a]={...n[a],...o},this.commit(t,s,n,l),!0}};function Fg(r){return r.type==="image"?"image":r.type==="text"||r.type==="textbox"||r.type==="i-text"?"text":"shape"}var he={kind:"linear",angle:90,center:{x:.5,y:.5},radius:.5,stops:[{color:"#ffffff",opacity:1,position:0},{color:"#000000",opacity:1,position:1}]},Ig=.001,Rg=256,Ch=he.stops[0].color;function xa(r,t){let e=r*Math.PI/180,i=Math.sin(e),s=Math.cos(e),n=t.width*i,a=-t.height*s,l=(Math.abs(t.width*i)+Math.abs(t.height*s))/(n*n+a*a||1);return{x1:.5-l*n/2,y1:.5-l*a/2,x2:.5+l*n/2,y2:.5+l*a/2}}function wa(r,t){let e=(r.x2-r.x1)/(t.width||1),i=(r.y2-r.y1)/(t.height||1);return(Math.atan2(e,-i)*180/Math.PI+360)%360}function Bg(r){let t=Mt(r.color)?r.color:Ch,e=new Q(t),i=Number.isFinite(r.opacity)?r.opacity:1;return e.setAlpha(Y(i,0,1)),e.toRgba()}function mi(r,t){let e=[...r.stops].sort((i,s)=>i.position-s.position).slice(0,Rg).map(i=>{let s=Number.isFinite(i.position)?i.position:0;return{offset:Y(s,0,1),color:Bg(i)}});if(r.kind==="radial"){let i=Math.max(Ig,r.radius);return new Wt({type:"radial",gradientUnits:"percentage",coords:{x1:r.center.x,y1:r.center.y,r1:0,x2:r.center.x,y2:r.center.y,r2:i},colorStops:e})}return new Wt({type:"linear",gradientUnits:"percentage",coords:xa(r.angle,t),colorStops:e})}function Sh(r){let t=r.fill;if(!t||typeof t=="string"||!(t instanceof Wt))return null;let e=t.colorStops.map(s=>{let n=Mt(s.color)?s.color:Ch,a=new Q(n),o=Number.isFinite(s.offset)?s.offset:0;return{color:`#${a.toHex().toLowerCase()}`,opacity:a.getAlpha(),position:Y(o,0,1)}});if(t.type==="radial"){let{x1:s,y1:n,r2:a}=t.coords;return{kind:"radial",angle:he.angle,center:{x:s,y:n},radius:a,stops:e}}let i={width:r.width||1,height:r.height||1};return{kind:"linear",angle:wa(t.coords,i),center:{...he.center},radius:he.radius,stops:e}}var Xg=.01,Wg=8;function Yg(r){return r instanceof DOMException&&r.name==="SecurityError"||r instanceof Error&&/taint|cross-origin|insecure/i.test(r.message)}var Fs=class{canvas;layers;history;events;units;snapping;crop;patterns;curves;wrap;maskPresets;layerMasks;fonts;licensing;pages;masks;fileAdapter;imageProvider;zoomLevel=1;selectionStyle={...bs};mockup=null;designBackground;designBackgroundImage=null;backgroundImageOptions=null;constructor(t,e){this.events=new Ze,this.fonts=new gr,e.fonts?.forEach(n=>this.fonts.register(n)),this.licensing=new pr(e.license),this.units=new dr(e.unit??"px",e.dpi??72);let i=this.units.toPixels(e.width),s=this.units.toPixels(e.height);this.designBackground=e.backgroundColor??"#ffffff",this.canvas=new $i(t,{width:i,height:s,backgroundColor:this.designBackground,preserveObjectStacking:e.preserveObjectStacking??!0,selection:!0}),this.layers=new er(this.canvas,this.events),this.fileAdapter=e.fileAdapter,this.imageProvider=e.imageProvider,this.history=new rr({getState:()=>JSON.stringify(this.toJSON()),restoreState:async n=>{let a=JSON.parse(n);await this.fromJSON(a)},events:this.events}),this.layers.setHistoryCallback(()=>this.history.save()),this.snapping=new ir(this.canvas,this.events),this.crop=new sr(this.canvas,this.history,this.events),this.patterns=new Te(this.canvas,this.layers,this.history,this.events),this.curves=new lr(this.canvas,this.layers,this.history,this.events),this.wrap=new hr(this.canvas,this.layers,this.history,this.events),this.maskPresets=new Ee(this.canvas,this.layers,this.history,this.events),this.layerMasks=new je(this.canvas,this.layers,this.history,this.events),this.setupCanvasEvents(),this.refreshSelectionStyle(),this.history.saveImmediate(),this.pages=new fr(this),this.masks=new mr(this)}async addImage(t,e){try{let i=await U.fromURL(t,{},{originX:"left",originY:"top",...e}),s=this.layers.add("image",i);return this.layers.select(s.id),this.history.save(),s}catch(i){throw this.events.emit("error",{message:"Failed to add image",error:i}),i}}async replaceImageSource(t,e){let i=this.layers.get(t);if(!i||i.type!=="image"&&i.type!=="mask")throw new Error(`Image or mask layer not found: ${t}`);if(i.meta.pattern)throw new Error("Clear the pattern before replacing the image source");this.crop.activeLayerId()===t&&this.crop.cancel();let s=i.fabricObject;try{let n=await U.fromURL(e,{},{originX:"left",originY:"top"});return n.set({left:s.left,top:s.top,originX:s.originX,originY:s.originY,width:s.width,height:s.height,cropX:s.cropX,cropY:s.cropY,scaleX:s.scaleX,scaleY:s.scaleY,angle:s.angle,skewX:s.skewX,skewY:s.skewY,flipX:s.flipX,flipY:s.flipY}),n.filters=[...s.filters],n.applyFilters(),n.setCoords(),this.layers.replaceObject(t,n),i}catch(n){throw this.events.emit("error",{message:"Failed to replace image source",error:n}),n}}addText(t,e){let i=new Yt(t,{fontSize:32,fontFamily:"Arial",fill:"#000000",width:200,originX:"left",originY:"top",...e}),s=this.layers.add("text",i);return this.layers.select(s.id),this.history.save(),s}addShape(t,e){let i=t.create(e),s=this.layers.add("shape",i,t.name);return this.layers.select(s.id),this.history.save(),s}addGradient(t=he,e){let i=e?.width??this.canvas.getWidth(),s=e?.height??this.canvas.getHeight(),n=new V({left:e?.left??0,top:e?.top??0,originX:"left",originY:"top",width:i,height:s,strokeWidth:0,fill:mi(t,{width:i,height:s})}),a=this.layers.add("gradient",n,"Gradient");return this.layers.select(a.id),this.history.save(),a}setGradient(t,e,i=!0){let s=this.layers.get(t);if(!s)return;let n=s.fabricObject;n.set({fill:mi(e,{width:n.width||1,height:n.height||1})}),n.dirty=!0,this.canvas.requestRenderAll(),this.events.emit("layer:modified",{layerId:t}),i&&this.history.save()}setBlend(t,e){let i=this.layers.get(t);if(!i)return;let s=ii(e);i.fabricObject.set({globalCompositeOperation:s}),i.fabricObject.dirty=!0,i.renderProxy&&(i.renderProxy.set({globalCompositeOperation:s}),i.renderProxy.dirty=!0),this.canvas.requestRenderAll(),this.events.emit("layer:modified",{layerId:t}),this.history.save()}async addTemplate(t,e){let i={};for(let a of t.parameters){let o=e[a.key]??a.default;if(o===void 0)throw new Error(`Missing template parameter: ${a.key}`);if(a.type==="number"&&!Number.isFinite(Number(o)))throw new Error(`Invalid number for template parameter: ${a.key}`);if(a.type==="color"&&!Mt(o))throw new Error(`Invalid color for template parameter: ${a.key}`);i[a.key]=o}let s=As(t.svg.replace(/\{\{(\w+)(?:[|:]([^}]*))?\}\}/g,(a,o,l)=>{let h=i[o]??l;return h===void 0?a:Es(h)})),n=s.includes("<textPath")?[as(t,i)]:await os(t,s,i);if(n.length===0)throw new Error("Template SVG contains no renderable objects");return this.history.transaction(async()=>{let a=n.map(l=>{let h=this.layers.add(l.type,l.object,l.name);return l.curve&&this.curves.apply(h.id,l.curve,!1),h}),o=a.length===1?a[0]:await this.groupLayers(a.map(l=>l.id),t.name)??a[0];return o.fabricObject.set({left:this.canvas.getWidth()/2,top:this.canvas.getHeight()/2,originX:"center",originY:"center"}),o.fabricObject.setCoords(),this.layers.select(o.id),this.canvas.requestRenderAll(),this.history.save(),o})}removeLayer(t){this.crop.activeLayerId()===t&&this.crop.cancel(),this.masks.activeLayerId()===t&&this.masks.detach(t),this.layers.remove(t)&&this.history.save()}selectLayer(t){this.layers.select(t)}selectLayers(t){this.layers.selectMany(t)}getSelectedLayer(){let t=this.canvas.getActiveObject();return t?this.layers.findByObject(t)??null:null}flipLayer(t,e){let i=this.layers.get(t);if(!i)return;let s=i.fabricObject;e==="horizontal"?s.set("flipX",!s.flipX):s.set("flipY",!s.flipY),s.setCoords(),this.canvas.requestRenderAll(),this.history.save()}async duplicateLayer(t){let e=this.layers.get(t);if(!e)return null;let i=await e.fabricObject.clone();i.set({left:(i.left??0)+15,top:(i.top??0)+15}),i.setCoords();let s=this.layers.add(e.type,i,`${e.name} copy`);return s.meta=structuredClone(e.meta),s.visible=e.visible,s.locked=e.locked,s.opacity=e.opacity,i.set({visible:e.visible,selectable:!e.locked,evented:!e.locked,opacity:e.opacity}),this.patterns.attachTo(s),this.layers.select(s.id),this.canvas.requestRenderAll(),this.history.save(),s}applyImageAdjustments(t,e){let i=this.layers.get(t);if(!i||i.type!=="image")return!1;let s=i.fabricObject,a={...i.meta.imageAdjustments??{},...e},o=(l,h=-1)=>Y(l??0,h,1);return s.filters=[new ri.Brightness({brightness:o(a.brightness)}),new ri.Contrast({contrast:o(a.contrast)}),new ri.Saturation({saturation:o(a.saturation)}),new ri.Blur({blur:o(a.blur,0)})],i.meta.imageAdjustments=a,s.applyFilters(),this.canvas.requestRenderAll(),this.history.save(),!0}async groupLayers(t,e="Group"){let i=[...new Set(t)],s=i.map(l=>this.layers.get(l)).filter(l=>l!==void 0&&l.parentId===null);if(s.length<2||s.length!==i.length)return null;let n=this.layers.getAll(),a=Math.max(...s.map(l=>n.indexOf(l))),o=n.slice(0,a).filter(l=>!s.includes(l)).length;return this.history.transaction(()=>{let l=[],h=[];for(let d of s)if(d.type==="group"&&d.children.length>0){let g=d.fabricObject.removeAll();for(let[p,f]of g.entries()){f.setCoords();let y=d.children[p];y&&(l.push(y),h.push(f))}d.children=[],this.layers.detach(d.id)}else l.push(d),h.push(d.fabricObject),this.layers.detach(d.id);let c=new q(h),u=this.layers.add("group",c,e);return this.layers.adoptChildren(u,l),this.layers.reorder(u.id,o),this.layers.select(u.id),this.history.save(),u})}async ungroupLayer(t){let e=this.layers.get(t);return!e||e.type!=="group"||e.children.length===0?[]:this.history.transaction(()=>{let i=this.layers.explode(e);return this.history.save(),this.layers.select(i[0]?.id??null),i})}toJSON(){return Cs(this)}async fromJSON(t){let e=this.history.isRestoring();e||(this.history.saveImmediate(),this.history.pause());try{await Ss(this,t),await this.patterns.rehydrateAll(),this.layerMasks.refreshAll()}catch(i){throw e||this.events.emit("error",{message:"Failed to load editor state",error:i}),i}finally{e||this.history.resume()}e||(this.history.clear(),this.history.saveImmediate())}async toPNG(t){return this.toRaster(t?.format??"png",t)}async toJPEG(t){return this.toRaster("jpeg",t)}async toWebP(t){return this.toRaster("webp",t)}async exportLayer(t,e={}){let i=this.layers.get(t);if(!i)throw new Error(`Layer not found: ${t}`);try{if(e.resolution==="source"&&i.fabricObject instanceof U){let s=await i.fabricObject.clone();return s.set({left:0,top:0,originX:"left",originY:"top",scaleX:1,scaleY:1,angle:0,flipX:!1,flipY:!1}),await gi(this.canvas,[s],{...e,width:s.width||1,height:s.height||1,cloneObjects:!1})}return await gi(this.canvas,[i.renderProxy??i.fabricObject],e)}catch(s){throw this.events.emit("error",{message:`Failed to export layer: ${t}`,error:s}),s}}async exportBackground(t={}){try{return await gi(this.canvas,[],{...t,backgroundColor:this.designBackground,backgroundImage:this.designBackgroundImage})}catch(e){throw this.events.emit("error",{message:"Failed to export background",error:e}),e}}async toRaster(t,e){this.events.emit("export:start",{format:t});try{await this.fonts.ready();let i=await this.withDesignBackground(()=>di(this.canvas,{...e,format:t}));return this.events.emit("export:complete",{format:t}),this.licensing.track(`export:${t}`),i}catch(i){throw this.events.emit("error",{message:Yg(i)?"Canvas export was blocked by cross-origin image data; load remote images with CORS enabled":`Failed to export ${t.toUpperCase()}`,error:i}),i}}toSVG(){this.events.emit("export:start",{format:"svg"});try{let t=this.withDesignBackground(()=>Ms(this.canvas));return this.events.emit("export:complete",{format:"svg"}),this.licensing.track("export:svg"),t}catch(t){throw this.events.emit("error",{message:"Failed to export SVG",error:t}),t}}async toSVGAsync(t={}){await this.fonts.ready();let e=this.toSVG();if(t.embedFonts===!1||this.fonts.getAll().length===0)return e;try{let i=await this.fonts.getEmbeddedCss();return e.replace(/(<svg\b[^>]*>)/i,`$1<defs><style>${i}</style></defs>`)}catch(i){throw this.events.emit("error",{message:"Failed to embed fonts in SVG",error:i}),i}}toDataURL(t="png",e=1){return this.withDesignBackground(()=>Ps(this.canvas,t,e))}async toPrintFile(t={}){await this.fonts.ready();try{let e=this.mockup?.printArea,i=e?await ks(this.canvas,e,t):await gi(this.canvas,this.canvas.getObjects(),t);return this.licensing.track(`export:print:${t.format??"png"}`),i}catch(e){throw this.events.emit("error",{message:"Failed to export print file",error:e}),e}}async toMockupImage(t={}){if(!this.mockup)throw new Error("No mockup is configured");await this.fonts.ready();try{let e=await Os(this.canvas,this.mockup,t);return this.licensing.track(`export:mockup:${t.format??"png"}`),e}catch(e){throw this.events.emit("error",{message:"Failed to export mockup",error:e}),e}}withDesignBackground(t){if(!this.mockup)return t();let e=this.canvas.backgroundColor,i=this.canvas.backgroundImage;this.canvas.backgroundColor=this.designBackground,this.canvas.backgroundImage=this.designBackgroundImage??void 0;try{return t()}finally{this.canvas.backgroundColor=e,this.canvas.backgroundImage=i}}toPrintifyPositioning(){let t={},e=this.canvas.getWidth(),i=this.canvas.getHeight(),s=this.layers.getAll().filter(n=>n.type==="image");if(s.length===0)return t.front={x:.5,y:.5,scale:1,angle:0},t;for(let n of s){let a=n.fabricObject,o=a.getCenterPoint(),l=t[n.name]?`${n.name}-${n.id}`:n.name;t[l]={x:et(o.x/e),y:et(o.y/i),scale:et(a.scaleX??1),angle:et(a.angle??0)}}return t}toNormalizedPositioning(){let t=this.canvas.getWidth(),e=this.canvas.getHeight();return this.layers.getAll().map(i=>{let s=i.fabricObject,n=s.getCenterPoint(),a=s.getBoundingRect();return{layerId:i.id,name:i.name,type:i.type,centerX:et(n.x/t),centerY:et(n.y/e),width:et(a.width/t),height:et(a.height/e),scaleX:et(s.scaleX??1),scaleY:et(s.scaleY??1),angle:et(s.angle??0)}})}toProviderPositioning(t){return t.map(this.toNormalizedPositioning(),{width:this.canvas.getWidth(),height:this.canvas.getHeight()})}async save(t,e){if(!this.fileAdapter)return;let i;e==="png"?i=await this.toPNG():e==="jpeg"?i=await this.toJPEG():e==="webp"?i=await this.toWebP():e==="svg"?i=await this.toSVGAsync():i=JSON.stringify(this.toJSON(),null,2);try{return await this.fileAdapter.save(i,t,e)}catch(s){throw this.events.emit("error",{message:`Failed to save ${e}`,error:s}),s}}async uploadImage(t){if(this.imageProvider?.upload)try{return await this.imageProvider.upload(t)}catch(e){throw this.events.emit("error",{message:"Failed to upload image",error:e}),e}}async browseImages(){if(!this.imageProvider?.browse)return null;try{return await this.imageProvider.browse()}catch(t){throw this.events.emit("error",{message:"Failed to browse images",error:t}),t}}async searchImages(t,e){if(!this.imageProvider?.search)return null;try{return await this.imageProvider.search(t,e)}catch(i){throw this.events.emit("error",{message:"Failed to search images",error:i}),i}}async addProviderImage(t,e){try{await this.imageProvider?.trackUse?.(t)}catch(i){throw this.events.emit("error",{message:"Failed to record image use",error:i}),i}return this.addImage(t.url,e)}setFileAdapter(t){this.fileAdapter=t}setImageProvider(t){this.imageProvider=t}setBackground(t){this.designBackground=t,this.mockup||(this.canvas.backgroundColor=t,this.canvas.requestRenderAll()),this.history.save(),this.events.emit("canvas:modified",{})}getDesignBackground(){return this.designBackground}getDesignBackgroundImage(){return this.designBackgroundImage}getBackgroundImageOptions(){return this.backgroundImageOptions?{...this.backgroundImageOptions}:null}async setBackgroundImage(t,e={}){if(t===null){this.setBackgroundImageObject(null);return}try{let i=await U.fromURL(t,{crossOrigin:e.crossOrigin??null,signal:e.signal},{originX:"left",originY:"top"}),s=i.width||1,n=i.height||1,a=this.canvas.getWidth(),o=this.canvas.getHeight(),l=e.fit??"cover",h=a/s,c=o/n,u=l==="stretch"?h:l==="contain"?Math.min(h,c):Math.max(h,c),d=l==="stretch"?c:u;i.set({left:(a-s*u)/2,top:(o-n*d)/2,scaleX:u,scaleY:d,opacity:Y(e.opacity??1,0,1),selectable:!1,evented:!1});let g={...e};delete g.signal,this.setBackgroundImageObject(i,!0,g)}catch(i){throw this.events.emit("error",{message:"Failed to set background image",error:i}),i}}setBackgroundImageObject(t,e=!0,i=null){this.designBackgroundImage=t,this.backgroundImageOptions=t?i:null,this.canvas.backgroundImage=this.mockup?void 0:t??void 0,this.canvas.requestRenderAll(),e&&this.history.save(),this.events.emit("canvas:modified",{})}setTransparentBackground(){this.setBackground("")}resize(t,e,i={}){let s=this.units.toPixels(t),n=this.units.toPixels(e),a=this.canvas.getWidth(),o=this.canvas.getHeight();if((i.scaleContent??!0)&&a>0&&o>0){let h=s/a,c=n/o;for(let u of this.layers.getAll()){let d=u.fabricObject;d.set({left:(d.left??0)*h,top:(d.top??0)*c,scaleX:(d.scaleX??1)*h,scaleY:(d.scaleY??1)*c}),d.setCoords()}this.designBackgroundImage&&(this.designBackgroundImage.set({left:(this.designBackgroundImage.left??0)*h,top:(this.designBackgroundImage.top??0)*c,scaleX:(this.designBackgroundImage.scaleX??1)*h,scaleY:(this.designBackgroundImage.scaleY??1)*c}),this.designBackgroundImage.setCoords())}this.canvas.setDimensions({width:s,height:n}),this.patterns.syncArea(),this.canvas.requestRenderAll(),this.history.save(),this.events.emit("canvas:modified",{})}getImageDpi(t){let e=this.layers.get(t);if(!e||e.type!=="image")return null;let i=e.fabricObject,s=i.width??0,n=i.getScaledWidth();return s<=0||n<=0?null:et(s/(n/this.units.getDpi()))}validateImageDpi(t=300){return this.layers.getAll().filter(e=>e.type==="image"&&!e.meta.pattern).flatMap(e=>{let i=this.getImageDpi(e.id);return i!==null&&i<t?[{layerId:e.id,layerName:e.name,effectiveDpi:i,minimumDpi:t}]:[]})}toThumbnail(t=320,e=320,i="png"){let s=Math.min(1,t/this.canvas.getWidth(),e/this.canvas.getHeight());return this.toDataURL(i,s)}bringToFront(t){return this.layers.reorder(t,this.layers.count()-1)}sendToBack(t){return this.layers.reorder(t,0)}bringForward(t){let e=this.layers.getAll().findIndex(i=>i.id===t);return e>=0&&this.layers.reorder(t,e+1)}sendBackward(t){let e=this.layers.getAll().findIndex(i=>i.id===t);return e>=0&&this.layers.reorder(t,e-1)}setZoom(t){let e=Y(et(t),Xg,Wg);e!==this.zoomLevel&&(this.zoomLevel=e,this.refreshSelectionStyle(),this.events.emit("zoom:changed",{zoom:e}))}zoom(t){this.setZoom(t)}getZoom(){return this.zoomLevel}zoomIn(t=.1){this.setZoom(this.zoomLevel+t)}zoomOut(t=.1){this.setZoom(this.zoomLevel-t)}resetZoom(){this.setZoom(1)}zoomToFit(t,e,i=0){let s=this.canvas.getWidth(),n=this.canvas.getHeight();if(s<=0||n<=0)return;let a=(t-i*2)/s,o=(e-i*2)/n;this.setZoom(Math.min(a,o))}zoomToSelection(t=24){let e=this.canvas.getActiveObject();if(!e)return;e.setCoords();let i=e.getBoundingRect();i.width<=0||i.height<=0||this.setZoom(Math.min((this.canvas.getWidth()-t*2)/i.width,(this.canvas.getHeight()-t*2)/i.height))}applyPattern(t,e){return this.patterns.apply(t,e)}clearPattern(t){return this.patterns.disable(t)}applyTextCurve(t,e){let i=this.curves.apply(t,e);return i&&this.wrap.refresh(t),i}clearTextCurve(t){let e=this.curves.clear(t);return e&&this.wrap.refresh(t),e}getTextCurve(t){return this.curves.get(t)}applyTextWrap(t,e){return this.wrap.apply(t,e)}setTextOverflow(t,e){return this.wrap.setOverflow(t,e)}getTextWrap(t){return this.wrap.get(t)}applyMaskPreset(t,e){return this.maskPresets.apply(t,e)}clearMaskPreset(t){return this.maskPresets.clear(t)}getMaskPreset(t){return this.maskPresets.get(t)}setLayerAspectLock(t,e){let i=this.layers.get(t);return i?(De(i.fabricObject,e),e?i.meta.lockAspect=!0:delete i.meta.lockAspect,this.canvas.requestRenderAll(),this.events.emit("layer:modified",{layerId:t}),this.history.save(),!0):!1}getLayerAspectLock(t){return this.layers.get(t)?.meta.lockAspect===!0}restoreAspectLocks(){for(let t of this.layers.getAll())t.meta.lockAspect&&De(t.fabricObject,!0)}resetLayerTransform(t){let e=this.layers.get(t);return e?(ws(e.fabricObject),this.canvas.requestRenderAll(),this.events.emit("layer:modified",{layerId:t}),this.history.save(),!0):!1}setLayerShadow(t,e){let i=this.layers.get(t);return i?(vs(i.fabricObject,e),i.fabricObject.dirty=!0,this.canvas.requestRenderAll(),this.events.emit("layer:modified",{layerId:t}),this.history.save(),!0):!1}getLayerShadow(t){let e=this.layers.get(t);return e?ui(e.fabricObject):null}setMockup(t,e={}){this.mockup=t,this.canvas.backgroundColor=t?"":this.designBackground,this.canvas.backgroundImage=t?void 0:this.designBackgroundImage??void 0,this.canvas.requestRenderAll(),this.events.emit("mockup:changed",{mockup:t}),e.history!==!1&&this.history.save()}clearMockup(){this.setMockup(null)}getMockup(){return this.mockup}dispose(){this.masks.dispose(),this.layerMasks.dispose(),this.snapping.dispose(),this.crop.dispose(),this.history.dispose(),this.patterns.dispose(),this.curves.dispose(),this.wrap.dispose(),this.events.removeAllListeners(),this.canvas.dispose()}getSelectionStyle(){return{...this.selectionStyle}}setSelectionStyle(t){this.selectionStyle={...this.selectionStyle,...t},this.refreshSelectionStyle()}refreshSelectionStyle(){xs(this.canvas,this.selectionStyle,this.zoomLevel)}setupCanvasEvents(){this.canvas.on("object:added",e=>{e.target&&Ae(e.target,this.selectionStyle,this.zoomLevel)});let t=()=>{let e=this.canvas.getActiveObject();e&&Ae(e,this.selectionStyle,this.zoomLevel)};this.canvas.on("object:modified",e=>{if(!e.target)return;let i=this.layers.findByObject(e.target);i&&(this.events.emit("layer:modified",{layerId:i.id}),this.history.save())}),this.canvas.on("selection:created",e=>{t();let i=(e.selected??[]).map(s=>this.layers.findByObject(s)?.id).filter(s=>s!==void 0);this.events.emit("selection:changed",{selected:i})}),this.canvas.on("selection:updated",e=>{t();let i=(e.selected??[]).map(s=>this.layers.findByObject(s)?.id).filter(s=>s!==void 0);this.events.emit("selection:changed",{selected:i})}),this.canvas.on("selection:cleared",()=>{this.events.emit("selection:changed",{selected:[]})})}};var _h={mode:"grid",scale:100,horizontalSpacing:0,verticalSpacing:0,angle:0,horizontalOffset:50,offsetX:0,offsetY:0,rotationStepH:0,rotationStepV:0,horizontalLimit:0,verticalLimit:0};var Th=[{id:"a4-portrait",name:"A4 portrait",width:210,height:297,unit:"mm",dpi:300},{id:"a4-landscape",name:"A4 landscape",width:297,height:210,unit:"mm",dpi:300},{id:"us-letter",name:"US Letter",width:8.5,height:11,unit:"in",dpi:300},{id:"shirt-front",name:"Garment front",width:12,height:16,unit:"in",dpi:300},{id:"instagram-square",name:"Social square",width:1080,height:1080,unit:"px",dpi:72},{id:"story",name:"Story",width:1080,height:1920,unit:"px",dpi:72}];var Is=class{items=new Map;transform={zoom:1,panX:0,panY:0,devicePixelRatio:1};set(t){this.items.set(t.id,structuredClone(t))}remove(t){return this.items.delete(t)}clear(){this.items.clear()}getAll(){return[...this.items.values()].map(t=>structuredClone(t))}setTransform(t){if(!Number.isFinite(t.zoom)||t.zoom<=0)throw new Error("Annotation zoom must be positive");this.transform={...t,devicePixelRatio:t.devicePixelRatio??1}}documentToViewport(t){return{x:t.x*this.transform.zoom+this.transform.panX,y:t.y*this.transform.zoom+this.transform.panY}}viewportToDocument(t){return{x:(t.x-this.transform.panX)/this.transform.zoom,y:(t.y-this.transform.panY)/this.transform.zoom}}documentToDevice(t){let e=this.documentToViewport(t),i=this.transform.devicePixelRatio??1;return{x:e.x*i,y:e.y*i}}};return jh($g);})();
|
|
508
508
|
//# sourceMappingURL=index.global.js.map
|