vuedit-image-editor 0.2.1 → 0.3.0
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/LICENSE +21 -0
- package/dist/index.d.ts +724 -0
- package/dist/vuedit-image-editor.css +1 -0
- package/dist/vuedit-image-editor.es.js +3887 -8873
- package/dist/vuedit-image-editor.es.js.map +1 -1
- package/dist/vuedit-image-editor.umd.js +41 -504
- package/dist/vuedit-image-editor.umd.js.map +1 -1
- package/package.json +31 -50
- package/README.md +0 -222
- package/dist/style.css +0 -1
- package/dist/types/components/VueditImageEditor.vue.d.ts +0 -91
- package/dist/types/components/VueditImageEditorModal.vue.d.ts +0 -71
- package/dist/types/components/canvas/FabricCanvas.vue.d.ts +0 -5
- package/dist/types/components/panels/CropPanel.vue.d.ts +0 -32
- package/dist/types/components/panels/DrawPanel.vue.d.ts +0 -24
- package/dist/types/components/panels/FilterPanel.vue.d.ts +0 -28
- package/dist/types/components/panels/ResizePanel.vue.d.ts +0 -35
- package/dist/types/components/panels/RotateFlipPanel.vue.d.ts +0 -31
- package/dist/types/components/panels/ShapePanel.vue.d.ts +0 -26
- package/dist/types/components/panels/TextPanel.vue.d.ts +0 -26
- package/dist/types/components/shared/ColorPicker.vue.d.ts +0 -21
- package/dist/types/components/shared/ConfirmBar.vue.d.ts +0 -23
- package/dist/types/components/shared/RangeSlider.vue.d.ts +0 -27
- package/dist/types/components/toolbar/EditorToolbar.vue.d.ts +0 -26
- package/dist/types/components/toolbar/ToolButton.vue.d.ts +0 -30
- package/dist/types/composables/useCrop.d.ts +0 -18
- package/dist/types/composables/useDraw.d.ts +0 -12
- package/dist/types/composables/useEditorState.d.ts +0 -7
- package/dist/types/composables/useFabricCanvas.d.ts +0 -16
- package/dist/types/composables/useFilters.d.ts +0 -18
- package/dist/types/composables/useHistory.d.ts +0 -11
- package/dist/types/composables/useResize.d.ts +0 -16
- package/dist/types/composables/useRotateFlip.d.ts +0 -12
- package/dist/types/composables/useShapes.d.ts +0 -12
- package/dist/types/composables/useText.d.ts +0 -16
- package/dist/types/composables/useZoom.d.ts +0 -11
- package/dist/types/i18n/ar.d.ts +0 -54
- package/dist/types/i18n/en.d.ts +0 -55
- package/dist/types/i18n/index.d.ts +0 -7
- package/dist/types/icons/CropIcon.vue.d.ts +0 -2
- package/dist/types/icons/DrawIcon.vue.d.ts +0 -2
- package/dist/types/icons/FilterIcon.vue.d.ts +0 -2
- package/dist/types/icons/FlipHIcon.vue.d.ts +0 -2
- package/dist/types/icons/FlipVIcon.vue.d.ts +0 -2
- package/dist/types/icons/RedoIcon.vue.d.ts +0 -2
- package/dist/types/icons/ResizeIcon.vue.d.ts +0 -2
- package/dist/types/icons/RotateIcon.vue.d.ts +0 -2
- package/dist/types/icons/RotateLeftIcon.vue.d.ts +0 -2
- package/dist/types/icons/RotateRightIcon.vue.d.ts +0 -2
- package/dist/types/icons/ShapeIcon.vue.d.ts +0 -2
- package/dist/types/icons/TextIcon.vue.d.ts +0 -2
- package/dist/types/icons/UndoIcon.vue.d.ts +0 -2
- package/dist/types/icons/ZoomInIcon.vue.d.ts +0 -2
- package/dist/types/icons/ZoomOutIcon.vue.d.ts +0 -2
- package/dist/types/icons/index.d.ts +0 -15
- package/dist/types/index.d.ts +0 -9
- package/dist/types/types/index.d.ts +0 -43
|
@@ -1,505 +1,42 @@
|
|
|
1
|
-
(function(ht,u){typeof exports=="object"&&typeof module<"u"?u(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],u):(ht=typeof globalThis<"u"?globalThis:ht||self,u(ht.VueditImageEditor={},ht.Vue))})(this,function(ht,u){"use strict";const Ee={crop:"Crop",rotate:"Rotate",filter:"Filter",text:"Text",draw:"Draw",shape:"Shape",resize:"Resize",save:"Save",cancel:"Cancel",apply:"Apply",reset:"Reset",undo:"Undo",redo:"Redo",zoomIn:"Zoom In",zoomOut:"Zoom Out",resetZoom:"Reset Zoom",freeform:"Freeform",original:"Original",rotateLeft:"Rotate Left",rotateRight:"Rotate Right",flipHorizontal:"Flip Horizontal",flipVertical:"Flip Vertical",degrees:"Degrees",brightness:"Brightness",contrast:"Contrast",saturation:"Saturation",exposure:"Exposure",blur:"Blur",grayscale:"Grayscale",sepia:"Sepia",invert:"Invert",addText:"Add Text",fontFamily:"Font",fontSize:"Size",fontColor:"Color",bold:"Bold",italic:"Italic",brushSize:"Brush Size",brushColor:"Color",opacity:"Opacity",rectangle:"Rectangle",circle:"Circle",arrow:"Arrow",line:"Line",strokeColor:"Stroke",fillColor:"Fill",strokeWidth:"Stroke Width",width:"Width",height:"Height",lockAspectRatio:"Lock aspect ratio",pixels:"px"},kn={en:Ee,ar:{crop:"قص",rotate:"تدوير",filter:"فلتر",text:"نص",draw:"رسم",shape:"شكل",resize:"تغيير الحجم",save:"حفظ",cancel:"إلغاء",apply:"تطبيق",reset:"إعادة تعيين",undo:"تراجع",redo:"إعادة",zoomIn:"تكبير",zoomOut:"تصغير",resetZoom:"إعادة تعيين التكبير",freeform:"حر",original:"أصلي",rotateLeft:"تدوير لليسار",rotateRight:"تدوير لليمين",flipHorizontal:"قلب أفقي",flipVertical:"قلب عمودي",degrees:"درجة",brightness:"السطوع",contrast:"التباين",saturation:"التشبع",exposure:"التعريض",blur:"ضبابية",grayscale:"رمادي",sepia:"بني داكن",invert:"عكس",addText:"إضافة نص",fontFamily:"الخط",fontSize:"الحجم",fontColor:"اللون",bold:"غامق",italic:"مائل",brushSize:"حجم الفرشاة",brushColor:"اللون",opacity:"الشفافية",rectangle:"مستطيل",circle:"دائرة",arrow:"سهم",line:"خط",strokeColor:"لون الحد",fillColor:"لون التعبئة",strokeWidth:"عرض الحد",width:"العرض",height:"الارتفاع",lockAspectRatio:"قفل نسبة العرض للارتفاع",pixels:"بكسل"}};function Ii(o){const t=typeof o=="string"?kn[o]||Ee:o;return e=>t[e]||Ee[e]||e}function On(o,t){return{...Ee,...o,...t}}const Dn=u.defineComponent({__name:"FabricCanvas",setup(o,{expose:t}){const e=u.ref(null),s=u.ref(null);return t({canvasEl:e,containerEl:s}),(i,r)=>(u.openBlock(),u.createElementBlock("div",{ref_key:"containerEl",ref:s,class:"vuedit-canvas-area"},[u.createElementVNode("canvas",{ref_key:"canvasEl",ref:e},null,512)],512))}}),En={class:"vuedit-tool-btn__icon"},Mn={class:"vuedit-tool-btn__label"},An=u.defineComponent({__name:"ToolButton",props:{label:{},active:{type:Boolean}},emits:["click"],setup(o,{emit:t}){const e=t;return(s,i)=>(u.openBlock(),u.createElementBlock("button",{class:u.normalizeClass(["vuedit-tool-btn",{"vuedit-tool-btn--active":o.active}]),onClick:i[0]||(i[0]=r=>e("click"))},[u.createElementVNode("span",En,[u.renderSlot(s.$slots,"default")]),u.createElementVNode("span",Mn,u.toDisplayString(o.label),1)],2))}}),tt=(o,t)=>{const e=o.__vccOpts||o;for(const[s,i]of t)e[s]=i;return e},Pn={},Fn={xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"};function jn(o,t){return u.openBlock(),u.createElementBlock("svg",Fn,[...t[0]||(t[0]=[u.createElementVNode("path",{d:"M6 2v14a2 2 0 0 0 2 2h14"},null,-1),u.createElementVNode("path",{d:"M18 22V8a2 2 0 0 0-2-2H2"},null,-1)])])}const Ln=tt(Pn,[["render",jn]]),Bn={},Rn={xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"};function $n(o,t){return u.openBlock(),u.createElementBlock("svg",Rn,[...t[0]||(t[0]=[u.createElementVNode("path",{d:"M21 12a9 9 0 1 1-9-9c2.52 0 4.93 1 6.74 2.74L21 8"},null,-1),u.createElementVNode("path",{d:"M21 3v5h-5"},null,-1)])])}const Vn=tt(Bn,[["render",$n]]),In={},Nn={xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"};function Wn(o,t){return u.openBlock(),u.createElementBlock("svg",Nn,[...t[0]||(t[0]=[u.createElementVNode("circle",{cx:"12",cy:"12",r:"10"},null,-1),u.createElementVNode("path",{d:"M12 2a14.5 14.5 0 0 0 0 20 14.5 14.5 0 0 0 0-20"},null,-1),u.createElementVNode("path",{d:"M2 12h20"},null,-1)])])}const Xn=tt(In,[["render",Wn]]),zn={},Yn={xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"};function Hn(o,t){return u.openBlock(),u.createElementBlock("svg",Yn,[...t[0]||(t[0]=[u.createElementVNode("polyline",{points:"4 7 4 4 20 4 20 7"},null,-1),u.createElementVNode("line",{x1:"9",y1:"20",x2:"15",y2:"20"},null,-1),u.createElementVNode("line",{x1:"12",y1:"4",x2:"12",y2:"20"},null,-1)])])}const Gn=tt(zn,[["render",Hn]]),Un={},qn={xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"};function Kn(o,t){return u.openBlock(),u.createElementBlock("svg",qn,[...t[0]||(t[0]=[u.createElementVNode("path",{d:"M12 19l7-7 3 3-7 7-3-3z"},null,-1),u.createElementVNode("path",{d:"M18 13l-1.5-7.5L2 2l3.5 14.5L13 18l5-5z"},null,-1),u.createElementVNode("path",{d:"M2 2l7.586 7.586"},null,-1),u.createElementVNode("circle",{cx:"11",cy:"11",r:"2"},null,-1)])])}const Zn=tt(Un,[["render",Kn]]),Jn={},Qn={xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"};function to(o,t){return u.openBlock(),u.createElementBlock("svg",Qn,[...t[0]||(t[0]=[u.createElementVNode("rect",{x:"3",y:"3",width:"18",height:"18",rx:"2",ry:"2"},null,-1)])])}const eo=tt(Jn,[["render",to]]),so={},io={xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"};function ro(o,t){return u.openBlock(),u.createElementBlock("svg",io,[...t[0]||(t[0]=[u.createElementVNode("polyline",{points:"15 3 21 3 21 9"},null,-1),u.createElementVNode("polyline",{points:"9 21 3 21 3 15"},null,-1),u.createElementVNode("line",{x1:"21",y1:"3",x2:"14",y2:"10"},null,-1),u.createElementVNode("line",{x1:"3",y1:"21",x2:"10",y2:"14"},null,-1)])])}const no=tt(so,[["render",ro]]),oo={},ao={xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"};function lo(o,t){return u.openBlock(),u.createElementBlock("svg",ao,[...t[0]||(t[0]=[u.createElementVNode("polyline",{points:"1 4 1 10 7 10"},null,-1),u.createElementVNode("path",{d:"M3.51 15a9 9 0 1 0 2.13-9.36L1 10"},null,-1)])])}const ho=tt(oo,[["render",lo]]),co={},uo={xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"};function go(o,t){return u.openBlock(),u.createElementBlock("svg",uo,[...t[0]||(t[0]=[u.createElementVNode("polyline",{points:"23 4 23 10 17 10"},null,-1),u.createElementVNode("path",{d:"M20.49 15a9 9 0 1 1-2.12-9.36L23 10"},null,-1)])])}const fo=tt(co,[["render",go]]),po={},mo={xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"};function yo(o,t){return u.openBlock(),u.createElementBlock("svg",mo,[...t[0]||(t[0]=[u.createElementVNode("circle",{cx:"11",cy:"11",r:"8"},null,-1),u.createElementVNode("line",{x1:"21",y1:"21",x2:"16.65",y2:"16.65"},null,-1),u.createElementVNode("line",{x1:"11",y1:"8",x2:"11",y2:"14"},null,-1),u.createElementVNode("line",{x1:"8",y1:"11",x2:"14",y2:"11"},null,-1)])])}const vo=tt(po,[["render",yo]]),_o={},xo={xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"};function bo(o,t){return u.openBlock(),u.createElementBlock("svg",xo,[...t[0]||(t[0]=[u.createElementVNode("circle",{cx:"11",cy:"11",r:"8"},null,-1),u.createElementVNode("line",{x1:"21",y1:"21",x2:"16.65",y2:"16.65"},null,-1),u.createElementVNode("line",{x1:"8",y1:"11",x2:"14",y2:"11"},null,-1)])])}const Co=tt(_o,[["render",bo]]),wo={},So={xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"};function To(o,t){return u.openBlock(),u.createElementBlock("svg",So,[...t[0]||(t[0]=[u.createElementVNode("path",{d:"M8 3H5a2 2 0 0 0-2 2v14c0 1.1.9 2 2 2h3"},null,-1),u.createElementVNode("path",{d:"M16 3h3a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2h-3"},null,-1),u.createElementVNode("line",{x1:"12",y1:"20",x2:"12",y2:"4","stroke-dasharray":"2 2"},null,-1)])])}const ko=tt(wo,[["render",To]]),Oo={},Do={xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"};function Eo(o,t){return u.openBlock(),u.createElementBlock("svg",Do,[...t[0]||(t[0]=[u.createElementVNode("path",{d:"M21 8V5a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v3"},null,-1),u.createElementVNode("path",{d:"M21 16v3a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-3"},null,-1),u.createElementVNode("line",{x1:"4",y1:"12",x2:"20",y2:"12","stroke-dasharray":"2 2"},null,-1)])])}const Mo=tt(Oo,[["render",Eo]]),Ao={},Po={xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"};function Fo(o,t){return u.openBlock(),u.createElementBlock("svg",Po,[...t[0]||(t[0]=[u.createElementVNode("polyline",{points:"1 4 1 10 7 10"},null,-1),u.createElementVNode("path",{d:"M3.51 15a9 9 0 1 0 2.13-9.36L1 10"},null,-1)])])}const jo=tt(Ao,[["render",Fo]]),Lo={},Bo={xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"};function Ro(o,t){return u.openBlock(),u.createElementBlock("svg",Bo,[...t[0]||(t[0]=[u.createElementVNode("polyline",{points:"23 4 23 10 17 10"},null,-1),u.createElementVNode("path",{d:"M20.49 15a9 9 0 1 1-2.12-9.36L23 10"},null,-1)])])}const $o=tt(Lo,[["render",Ro]]),Vo={class:"vuedit-toolbar"},Io=u.defineComponent({__name:"EditorToolbar",props:{tools:{},activeTool:{},t:{type:Function}},emits:["selectTool"],setup(o,{emit:t}){const e=t,s={crop:Ln,rotate:Vn,filter:Xn,text:Gn,draw:Zn,shape:eo,resize:no},i={crop:"crop",rotate:"rotate",filter:"filter",text:"text",draw:"draw",shape:"shape",resize:"resize"};return(r,n)=>(u.openBlock(),u.createElementBlock("div",Vo,[(u.openBlock(!0),u.createElementBlock(u.Fragment,null,u.renderList(o.tools,a=>(u.openBlock(),u.createBlock(An,{key:a,label:o.t(i[a]),active:o.activeTool===a,onClick:l=>e("selectTool",a)},{default:u.withCtx(()=>[(u.openBlock(),u.createBlock(u.resolveDynamicComponent(s[a])))]),_:2},1032,["label","active","onClick"]))),128))]))}}),No={class:"vuedit-confirm-bar"},Ni=u.defineComponent({__name:"ConfirmBar",props:{applyLabel:{},cancelLabel:{}},emits:["apply","cancel"],setup(o,{emit:t}){const e=t;return(s,i)=>(u.openBlock(),u.createElementBlock("div",No,[u.createElementVNode("button",{class:"vuedit-btn vuedit-btn--secondary",onClick:i[0]||(i[0]=r=>e("cancel"))},u.toDisplayString(o.cancelLabel||"Cancel"),1),u.createElementVNode("button",{class:"vuedit-btn vuedit-btn--primary",onClick:i[1]||(i[1]=r=>e("apply"))},u.toDisplayString(o.applyLabel||"Apply"),1)]))}}),Wo={class:"vuedit-panel__title"},Xo={class:"vuedit-panel__section"},zo={class:"vuedit-aspect-ratios"},Yo=["onClick"],Ho=u.defineComponent({__name:"CropPanel",props:{aspectRatios:{},selectedRatio:{},isCropping:{type:Boolean},t:{type:Function}},emits:["selectRatio","apply","cancel"],setup(o,{emit:t}){const e=t;return(s,i)=>(u.openBlock(),u.createElementBlock("div",null,[u.createElementVNode("div",Wo,u.toDisplayString(o.t("crop")),1),u.createElementVNode("div",Xo,[u.createElementVNode("div",zo,[(u.openBlock(!0),u.createElementBlock(u.Fragment,null,u.renderList(o.aspectRatios,r=>{var n;return u.openBlock(),u.createElementBlock("button",{key:r.label,class:u.normalizeClass(["vuedit-aspect-chip",{"vuedit-aspect-chip--active":((n=o.selectedRatio)==null?void 0:n.label)===r.label}]),onClick:a=>e("selectRatio",r)},u.toDisplayString(r.label),11,Yo)}),128))])]),o.isCropping?(u.openBlock(),u.createBlock(Ni,{key:0,"apply-label":o.t("apply"),"cancel-label":o.t("cancel"),onApply:i[0]||(i[0]=r=>e("apply")),onCancel:i[1]||(i[1]=r=>e("cancel"))},null,8,["apply-label","cancel-label"])):u.createCommentVNode("",!0)]))}}),Go={class:"vuedit-range"},Uo={class:"vuedit-range__header"},qo={class:"vuedit-range__label"},Ko={class:"vuedit-range__value"},Zo=["value","min","max","step"],Ft=u.defineComponent({__name:"RangeSlider",props:{label:{},modelValue:{},min:{},max:{},step:{}},emits:["update:modelValue"],setup(o,{emit:t}){const e=t;function s(i){e("update:modelValue",parseFloat(i.target.value))}return(i,r)=>(u.openBlock(),u.createElementBlock("div",Go,[u.createElementVNode("div",Uo,[u.createElementVNode("span",qo,u.toDisplayString(o.label),1),u.createElementVNode("span",Ko,u.toDisplayString(o.modelValue),1)]),u.createElementVNode("input",{type:"range",value:o.modelValue,min:o.min??-1,max:o.max??1,step:o.step??.01,onInput:s},null,40,Zo)]))}}),Jo={class:"vuedit-panel__title"},Qo={class:"vuedit-panel__section"},ta={class:"vuedit-toggle-group"},ea=["title"],sa=["title"],ia=["title"],ra=["title"],na={class:"vuedit-panel__section"},oa=u.defineComponent({__name:"RotateFlipPanel",props:{rotation:{},t:{type:Function}},emits:["rotateLeft","rotateRight","flipH","flipV","setRotation"],setup(o,{emit:t}){const e=t;return(s,i)=>(u.openBlock(),u.createElementBlock("div",null,[u.createElementVNode("div",Jo,u.toDisplayString(o.t("rotate")),1),u.createElementVNode("div",Qo,[u.createElementVNode("div",ta,[u.createElementVNode("button",{class:"vuedit-toggle",title:o.t("rotateLeft"),onClick:i[0]||(i[0]=r=>e("rotateLeft"))},[u.createVNode(u.unref(jo),{style:{width:"16px",height:"16px"}})],8,ea),u.createElementVNode("button",{class:"vuedit-toggle",title:o.t("rotateRight"),onClick:i[1]||(i[1]=r=>e("rotateRight"))},[u.createVNode(u.unref($o),{style:{width:"16px",height:"16px"}})],8,sa),u.createElementVNode("button",{class:"vuedit-toggle",title:o.t("flipHorizontal"),onClick:i[2]||(i[2]=r=>e("flipH"))},[u.createVNode(u.unref(ko),{style:{width:"16px",height:"16px"}})],8,ia),u.createElementVNode("button",{class:"vuedit-toggle",title:o.t("flipVertical"),onClick:i[3]||(i[3]=r=>e("flipV"))},[u.createVNode(u.unref(Mo),{style:{width:"16px",height:"16px"}})],8,ra)])]),u.createElementVNode("div",na,[u.createVNode(Ft,{label:o.t("degrees"),"model-value":o.rotation,min:-180,max:180,step:1,"onUpdate:modelValue":i[4]||(i[4]=r=>e("setRotation",r))},null,8,["label","model-value"])])]))}}),aa={class:"vuedit-panel__title"},la={class:"vuedit-panel__section"},ha={class:"vuedit-panel__section"},ca={class:"vuedit-panel__section"},ua={class:"vuedit-panel__section"},da={class:"vuedit-panel__section"},ga={class:"vuedit-panel__section"},fa={class:"vuedit-toggle-group"},pa={class:"vuedit-confirm-bar"},ma=u.defineComponent({__name:"FilterPanel",props:{state:{},t:{type:Function}},emits:["update","reset","commit"],setup(o,{emit:t}){const e=t;return(s,i)=>(u.openBlock(),u.createElementBlock("div",null,[u.createElementVNode("div",aa,u.toDisplayString(o.t("filter")),1),u.createElementVNode("div",la,[u.createVNode(Ft,{label:o.t("brightness"),"model-value":o.state.brightness,min:-1,max:1,step:.01,"onUpdate:modelValue":i[0]||(i[0]=r=>e("update","brightness",r))},null,8,["label","model-value"])]),u.createElementVNode("div",ha,[u.createVNode(Ft,{label:o.t("contrast"),"model-value":o.state.contrast,min:-1,max:1,step:.01,"onUpdate:modelValue":i[1]||(i[1]=r=>e("update","contrast",r))},null,8,["label","model-value"])]),u.createElementVNode("div",ca,[u.createVNode(Ft,{label:o.t("saturation"),"model-value":o.state.saturation,min:-1,max:1,step:.01,"onUpdate:modelValue":i[2]||(i[2]=r=>e("update","saturation",r))},null,8,["label","model-value"])]),u.createElementVNode("div",ua,[u.createVNode(Ft,{label:o.t("exposure"),"model-value":o.state.exposure,min:-1,max:1,step:.01,"onUpdate:modelValue":i[3]||(i[3]=r=>e("update","exposure",r))},null,8,["label","model-value"])]),u.createElementVNode("div",da,[u.createVNode(Ft,{label:o.t("blur"),"model-value":o.state.blur,min:0,max:1,step:.01,"onUpdate:modelValue":i[4]||(i[4]=r=>e("update","blur",r))},null,8,["label","model-value"])]),u.createElementVNode("div",ga,[u.createElementVNode("div",fa,[u.createElementVNode("button",{class:u.normalizeClass(["vuedit-toggle",{"vuedit-toggle--active":o.state.grayscale}]),onClick:i[5]||(i[5]=r=>e("update","grayscale",!o.state.grayscale))},u.toDisplayString(o.t("grayscale")),3),u.createElementVNode("button",{class:u.normalizeClass(["vuedit-toggle",{"vuedit-toggle--active":o.state.sepia}]),onClick:i[6]||(i[6]=r=>e("update","sepia",!o.state.sepia))},u.toDisplayString(o.t("sepia")),3),u.createElementVNode("button",{class:u.normalizeClass(["vuedit-toggle",{"vuedit-toggle--active":o.state.invert}]),onClick:i[7]||(i[7]=r=>e("update","invert",!o.state.invert))},u.toDisplayString(o.t("invert")),3)])]),u.createElementVNode("div",pa,[u.createElementVNode("button",{class:"vuedit-btn vuedit-btn--secondary",onClick:i[8]||(i[8]=r=>e("reset"))},u.toDisplayString(o.t("reset")),1),u.createElementVNode("button",{class:"vuedit-btn vuedit-btn--primary",onClick:i[9]||(i[9]=r=>e("commit"))},u.toDisplayString(o.t("apply")),1)])]))}}),ya={class:"vuedit-panel__section"},va={key:0,class:"vuedit-panel__label"},_a={class:"vuedit-colors"},xa=["onClick"],ba=["value"],ls=u.defineComponent({__name:"ColorPicker",props:{modelValue:{},label:{}},emits:["update:modelValue"],setup(o,{emit:t}){const e=t,s=["#ffffff","#000000","#ff0000","#ff6600","#ffcc00","#33cc33","#0099ff","#6633cc","#ff3399","#999999"];return(i,r)=>(u.openBlock(),u.createElementBlock("div",ya,[o.label?(u.openBlock(),u.createElementBlock("label",va,u.toDisplayString(o.label),1)):u.createCommentVNode("",!0),u.createElementVNode("div",_a,[(u.openBlock(),u.createElementBlock(u.Fragment,null,u.renderList(s,n=>u.createElementVNode("button",{key:n,class:u.normalizeClass(["vuedit-color-swatch",{"vuedit-color-swatch--active":o.modelValue===n}]),style:u.normalizeStyle({background:n}),onClick:a=>e("update:modelValue",n)},null,14,xa)),64)),u.createElementVNode("input",{type:"color",value:o.modelValue,class:"vuedit-color-swatch",style:{padding:"0",cursor:"pointer"},onInput:r[0]||(r[0]=n=>e("update:modelValue",n.target.value))},null,40,ba)])]))}}),Ca={class:"vuedit-panel__title"},wa={class:"vuedit-panel__section"},Sa={class:"vuedit-panel__label"},Ta=["value"],ka=["value"],Oa={class:"vuedit-panel__section"},Da={class:"vuedit-panel__label"},Ea=["value"],Ma={class:"vuedit-panel__section"},Aa={class:"vuedit-toggle-group"},Pa={class:"vuedit-panel__section"},Fa=u.defineComponent({__name:"TextPanel",props:{config:{},t:{type:Function}},emits:["update","addText"],setup(o,{emit:t}){const e=t,s=["Arial","Helvetica","Times New Roman","Georgia","Courier New","Verdana","Impact","Comic Sans MS"];return(i,r)=>(u.openBlock(),u.createElementBlock("div",null,[u.createElementVNode("div",Ca,u.toDisplayString(o.t("text")),1),u.createElementVNode("div",wa,[u.createElementVNode("label",Sa,u.toDisplayString(o.t("fontFamily")),1),u.createElementVNode("select",{class:"vuedit-select",value:o.config.fontFamily,onChange:r[0]||(r[0]=n=>e("update","fontFamily",n.target.value))},[(u.openBlock(),u.createElementBlock(u.Fragment,null,u.renderList(s,n=>u.createElementVNode("option",{key:n,value:n},u.toDisplayString(n),9,ka)),64))],40,Ta)]),u.createElementVNode("div",Oa,[u.createElementVNode("label",Da,u.toDisplayString(o.t("fontSize")),1),u.createElementVNode("input",{type:"number",class:"vuedit-input",value:o.config.fontSize,min:"8",max:"200",onInput:r[1]||(r[1]=n=>e("update","fontSize",parseInt(n.target.value)||24))},null,40,Ea)]),u.createVNode(ls,{label:o.t("fontColor"),"model-value":o.config.fill,"onUpdate:modelValue":r[2]||(r[2]=n=>e("update","fill",n))},null,8,["label","model-value"]),u.createElementVNode("div",Ma,[u.createElementVNode("div",Aa,[u.createElementVNode("button",{class:u.normalizeClass(["vuedit-toggle",{"vuedit-toggle--active":o.config.fontWeight==="bold"}]),onClick:r[3]||(r[3]=n=>e("update","fontWeight",o.config.fontWeight==="bold"?"normal":"bold"))},[...r[6]||(r[6]=[u.createElementVNode("strong",null,"B",-1)])],2),u.createElementVNode("button",{class:u.normalizeClass(["vuedit-toggle",{"vuedit-toggle--active":o.config.fontStyle==="italic"}]),onClick:r[4]||(r[4]=n=>e("update","fontStyle",o.config.fontStyle==="italic"?"normal":"italic"))},[...r[7]||(r[7]=[u.createElementVNode("em",null,"I",-1)])],2)])]),u.createElementVNode("div",Pa,[u.createElementVNode("button",{class:"vuedit-btn vuedit-btn--primary",style:{width:"100%"},onClick:r[5]||(r[5]=n=>e("addText"))},u.toDisplayString(o.t("addText")),1)])]))}}),ja={class:"vuedit-panel__title"},La={class:"vuedit-panel__section"},Ba={class:"vuedit-panel__section"},Ra=u.defineComponent({__name:"DrawPanel",props:{config:{},t:{type:Function}},emits:["update"],setup(o,{emit:t}){const e=t;return(s,i)=>(u.openBlock(),u.createElementBlock("div",null,[u.createElementVNode("div",ja,u.toDisplayString(o.t("draw")),1),u.createElementVNode("div",La,[u.createVNode(Ft,{label:o.t("brushSize"),"model-value":o.config.width,min:1,max:50,step:1,"onUpdate:modelValue":i[0]||(i[0]=r=>e("update","width",r))},null,8,["label","model-value"])]),u.createElementVNode("div",Ba,[u.createVNode(Ft,{label:o.t("opacity"),"model-value":o.config.opacity,min:0,max:1,step:.05,"onUpdate:modelValue":i[1]||(i[1]=r=>e("update","opacity",r))},null,8,["label","model-value"])]),u.createVNode(ls,{label:o.t("brushColor"),"model-value":o.config.color,"onUpdate:modelValue":i[2]||(i[2]=r=>e("update","color",r))},null,8,["label","model-value"])]))}}),$a={class:"vuedit-panel__title"},Va={class:"vuedit-panel__section"},Ia={class:"vuedit-toggle-group"},Na=["onClick"],Wa={class:"vuedit-panel__section"},Xa={class:"vuedit-panel__section"},za=u.defineComponent({__name:"ShapePanel",props:{config:{},t:{type:Function}},emits:["update","addShape"],setup(o,{emit:t}){const e=t,s=[{type:"rect",label:"rectangle"},{type:"circle",label:"circle"},{type:"line",label:"line"},{type:"arrow",label:"arrow"}];return(i,r)=>(u.openBlock(),u.createElementBlock("div",null,[u.createElementVNode("div",$a,u.toDisplayString(o.t("shape")),1),u.createElementVNode("div",Va,[u.createElementVNode("div",Ia,[(u.openBlock(),u.createElementBlock(u.Fragment,null,u.renderList(s,n=>u.createElementVNode("button",{key:n.type,class:u.normalizeClass(["vuedit-toggle",{"vuedit-toggle--active":o.config.type===n.type}]),onClick:a=>e("update","type",n.type)},u.toDisplayString(o.t(n.label)),11,Na)),64))])]),u.createVNode(ls,{label:o.t("strokeColor"),"model-value":o.config.strokeColor,"onUpdate:modelValue":r[0]||(r[0]=n=>e("update","strokeColor",n))},null,8,["label","model-value"]),u.createVNode(ls,{label:o.t("fillColor"),"model-value":o.config.fillColor,"onUpdate:modelValue":r[1]||(r[1]=n=>e("update","fillColor",n))},null,8,["label","model-value"]),u.createElementVNode("div",Wa,[u.createVNode(Ft,{label:o.t("strokeWidth"),"model-value":o.config.strokeWidth,min:1,max:20,step:1,"onUpdate:modelValue":r[2]||(r[2]=n=>e("update","strokeWidth",n))},null,8,["label","model-value"])]),u.createElementVNode("div",Xa,[u.createElementVNode("button",{class:"vuedit-btn vuedit-btn--primary",style:{width:"100%"},onClick:r[3]||(r[3]=n=>e("addShape"))},u.toDisplayString(o.t("shape")),1)])]))}}),Ya={class:"vuedit-panel__title"},Ha={class:"vuedit-panel__section"},Ga={class:"vuedit-panel__label"},Ua=["value"],qa={class:"vuedit-panel__section"},Ka={class:"vuedit-panel__label"},Za=["value"],Ja={class:"vuedit-panel__section"},Qa={style:{display:"flex","align-items":"center",gap:"8px",cursor:"pointer"}},tl=["checked"],el={class:"vuedit-panel__label",style:{margin:"0"}},sl=u.defineComponent({__name:"ResizePanel",props:{width:{},height:{},lockRatio:{type:Boolean},t:{type:Function}},emits:["setWidth","setHeight","toggleLock","apply","cancel"],setup(o,{emit:t}){const e=t;return(s,i)=>(u.openBlock(),u.createElementBlock("div",null,[u.createElementVNode("div",Ya,u.toDisplayString(o.t("resize")),1),u.createElementVNode("div",Ha,[u.createElementVNode("label",Ga,u.toDisplayString(o.t("width"))+" ("+u.toDisplayString(o.t("pixels"))+")",1),u.createElementVNode("input",{type:"number",class:"vuedit-input",value:o.width,min:"1",max:"10000",onInput:i[0]||(i[0]=r=>e("setWidth",parseInt(r.target.value)||1))},null,40,Ua)]),u.createElementVNode("div",qa,[u.createElementVNode("label",Ka,u.toDisplayString(o.t("height"))+" ("+u.toDisplayString(o.t("pixels"))+")",1),u.createElementVNode("input",{type:"number",class:"vuedit-input",value:o.height,min:"1",max:"10000",onInput:i[1]||(i[1]=r=>e("setHeight",parseInt(r.target.value)||1))},null,40,Za)]),u.createElementVNode("div",Ja,[u.createElementVNode("label",Qa,[u.createElementVNode("input",{type:"checkbox",checked:o.lockRatio,onChange:i[2]||(i[2]=r=>e("toggleLock"))},null,40,tl),u.createElementVNode("span",el,u.toDisplayString(o.t("lockAspectRatio")),1)])]),u.createVNode(Ni,{"apply-label":o.t("apply"),"cancel-label":o.t("cancel"),onApply:i[3]||(i[3]=r=>e("apply")),onCancel:i[4]||(i[4]=r=>e("cancel"))},null,8,["apply-label","cancel-label"])]))}});function m(o,t,e){return(t=function(s){var i=function(r,n){if(typeof r!="object"||!r)return r;var a=r[Symbol.toPrimitive];if(a!==void 0){var l=a.call(r,n);if(typeof l!="object")return l;throw new TypeError("@@toPrimitive must return a primitive value.")}return(n==="string"?String:Number)(r)}(s,"string");return typeof i=="symbol"?i:i+""}(t))in o?Object.defineProperty(o,t,{value:e,enumerable:!0,configurable:!0,writable:!0}):o[t]=e,o}class Wi{constructor(){m(this,"browserShadowBlurConstant",1),m(this,"DPI",96),m(this,"devicePixelRatio",typeof window<"u"?window.devicePixelRatio:1),m(this,"perfLimitSizeTotal",2097152),m(this,"maxCacheSideLimit",4096),m(this,"minCacheSideLimit",256),m(this,"disableStyleCopyPaste",!1),m(this,"enableGLFiltering",!0),m(this,"textureSize",4096),m(this,"forceGLPutImageData",!1),m(this,"cachesBoundsOfCurve",!1),m(this,"fontPaths",{}),m(this,"NUM_FRACTION_DIGITS",4)}}const L=new class extends Wi{constructor(o){super(),this.configure(o)}configure(){let o=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{};Object.assign(this,o)}addFonts(){let o=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{};this.fontPaths={...this.fontPaths,...o}}removeFonts(){(arguments.length>0&&arguments[0]!==void 0?arguments[0]:[]).forEach(o=>{delete this.fontPaths[o]})}clearFonts(){this.fontPaths={}}restoreDefaults(o){const t=new Wi,e=(o==null?void 0:o.reduce((s,i)=>(s[i]=t[i],s),{}))||t;this.configure(e)}},Yt=function(o){for(var t=arguments.length,e=new Array(t>1?t-1:0),s=1;s<t;s++)e[s-1]=arguments[s];return console[o]("fabric",...e)};class Ot extends Error{constructor(t,e){super(`fabric: ${t}`,e)}}class il extends Ot{constructor(t){super(`${t} 'options.signal' is in 'aborted' state`)}}class rl{}class nl extends rl{testPrecision(t,e){const s=`precision ${e} float;
|
|
2
|
-
void main(){}`,i=t.createShader(t.FRAGMENT_SHADER);return!!i&&(t.shaderSource(i,s),t.compileShader(i),!!t.getShaderParameter(i,t.COMPILE_STATUS))}queryWebGL(t){const e=t.getContext("webgl");e&&(this.maxTextureSize=e.getParameter(e.MAX_TEXTURE_SIZE),this.GLPrecision=["highp","mediump","lowp"].find(s=>this.testPrecision(e,s)),e.getExtension("WEBGL_lose_context").loseContext(),Yt("log",`WebGL: max texture size ${this.maxTextureSize}`))}isSupported(t){return!!this.maxTextureSize&&this.maxTextureSize>=t}}const ol={};let Xi;const Dt=()=>Xi||(Xi={document,window,isTouchSupported:"ontouchstart"in window||"ontouchstart"in document||window&&window.navigator&&window.navigator.maxTouchPoints>0,WebGLProbe:new nl,dispose(){},copyPasteData:ol}),de=()=>Dt().document,hs=()=>Dt().window,zi=()=>{var o;return Math.max((o=L.devicePixelRatio)!==null&&o!==void 0?o:hs().devicePixelRatio,1)},Me=new class{constructor(){m(this,"boundsOfCurveCache",{}),this.charWidthsCache=new Map}getFontCache(o){let{fontFamily:t,fontStyle:e,fontWeight:s}=o;t=t.toLowerCase();const i=this.charWidthsCache;i.has(t)||i.set(t,new Map);const r=i.get(t),n=`${e.toLowerCase()}_${(s+"").toLowerCase()}`;return r.has(n)||r.set(n,new Map),r.get(n)}clearFontCache(o){o?this.charWidthsCache.delete((o||"").toLowerCase()):this.charWidthsCache=new Map}limitDimsByArea(o){const{perfLimitSizeTotal:t}=L,e=Math.sqrt(t*o);return[Math.floor(e),Math.floor(t/e)]}},qs="7.1.0";function cs(){}const Ae=Math.PI/2,al=Math.PI/4,ge=2*Math.PI,Ks=Math.PI/180,et=Object.freeze([1,0,0,1,0,0]),Zs=16,Ht=.4477152502,A="center",V="left",nt="top",Js="bottom",G="right",ot="none",Qs=/\r?\n/,Yi="moving",us="scaling",Hi="rotating",ti="rotate",Gi="skewing",Pe="resizing",ll="modifyPoly",hl="modifyPath",ds="changed",gs="scale",at="scaleX",ft="scaleY",fe="skewX",pe="skewY",Z="fill",ct="stroke",fs="modified",te="ltr",jt="rtl",ei="normal",me="json",si="svg",T=new class{constructor(){this[me]=new Map,this[si]=new Map}has(o){return this[me].has(o)}getClass(o){const t=this[me].get(o);if(!t)throw new Ot(`No class registered for ${o}`);return t}setClass(o,t){t?this[me].set(t,o):(this[me].set(o.type,o),this[me].set(o.type.toLowerCase(),o))}getSVGClass(o){return this[si].get(o)}setSVGClass(o,t){this[si].set(t??o.type.toLowerCase(),o)}},ps=new class extends Array{remove(o){const t=this.indexOf(o);t>-1&&this.splice(t,1)}cancelAll(){const o=this.splice(0);return o.forEach(t=>t.abort()),o}cancelByCanvas(o){if(!o)return[];const t=this.filter(e=>{var s;return e.target===o||typeof e.target=="object"&&((s=e.target)===null||s===void 0?void 0:s.canvas)===o});return t.forEach(e=>e.abort()),t}cancelByTarget(o){if(!o)return[];const t=this.filter(e=>e.target===o);return t.forEach(e=>e.abort()),t}};class cl{constructor(){m(this,"__eventListeners",{})}on(t,e){if(this.__eventListeners||(this.__eventListeners={}),typeof t=="object")return Object.entries(t).forEach(s=>{let[i,r]=s;this.on(i,r)}),()=>this.off(t);if(e){const s=t;return this.__eventListeners[s]||(this.__eventListeners[s]=[]),this.__eventListeners[s].push(e),()=>this.off(s,e)}return()=>!1}once(t,e){if(typeof t=="object"){const s=[];return Object.entries(t).forEach(i=>{let[r,n]=i;s.push(this.once(r,n))}),()=>s.forEach(i=>i())}if(e){const s=this.on(t,function(){for(var i=arguments.length,r=new Array(i),n=0;n<i;n++)r[n]=arguments[n];e.call(this,...r),s()});return s}return()=>!1}_removeEventListener(t,e){if(this.__eventListeners[t])if(e){const s=this.__eventListeners[t],i=s.indexOf(e);i>-1&&s.splice(i,1)}else this.__eventListeners[t]=[]}off(t,e){if(this.__eventListeners)if(t===void 0)for(const s in this.__eventListeners)this._removeEventListener(s);else typeof t=="object"?Object.entries(t).forEach(s=>{let[i,r]=s;this._removeEventListener(i,r)}):this._removeEventListener(t,e)}fire(t,e){var s;if(!this.__eventListeners)return;const i=(s=this.__eventListeners[t])===null||s===void 0?void 0:s.concat();if(i)for(let r=0;r<i.length;r++)i[r].call(this,e||{})}}const ye=(o,t)=>{const e=o.indexOf(t);return e!==-1&&o.splice(e,1),o},Lt=o=>{if(o===0)return 1;switch(Math.abs(o)/Ae){case 1:case 3:return 0;case 2:return-1}return Math.cos(o)},Bt=o=>{if(o===0)return 0;const t=o/Ae,e=Math.sign(o);switch(t){case 1:return e;case 2:return 0;case 3:return-e}return Math.sin(o)};class _{constructor(){let t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:0,e=arguments.length>1&&arguments[1]!==void 0?arguments[1]:0;typeof t=="object"?(this.x=t.x,this.y=t.y):(this.x=t,this.y=e)}add(t){return new _(this.x+t.x,this.y+t.y)}addEquals(t){return this.x+=t.x,this.y+=t.y,this}scalarAdd(t){return new _(this.x+t,this.y+t)}scalarAddEquals(t){return this.x+=t,this.y+=t,this}subtract(t){return new _(this.x-t.x,this.y-t.y)}subtractEquals(t){return this.x-=t.x,this.y-=t.y,this}scalarSubtract(t){return new _(this.x-t,this.y-t)}scalarSubtractEquals(t){return this.x-=t,this.y-=t,this}multiply(t){return new _(this.x*t.x,this.y*t.y)}scalarMultiply(t){return new _(this.x*t,this.y*t)}scalarMultiplyEquals(t){return this.x*=t,this.y*=t,this}divide(t){return new _(this.x/t.x,this.y/t.y)}scalarDivide(t){return new _(this.x/t,this.y/t)}scalarDivideEquals(t){return this.x/=t,this.y/=t,this}eq(t){return this.x===t.x&&this.y===t.y}lt(t){return this.x<t.x&&this.y<t.y}lte(t){return this.x<=t.x&&this.y<=t.y}gt(t){return this.x>t.x&&this.y>t.y}gte(t){return this.x>=t.x&&this.y>=t.y}lerp(t){let e=arguments.length>1&&arguments[1]!==void 0?arguments[1]:.5;return e=Math.max(Math.min(1,e),0),new _(this.x+(t.x-this.x)*e,this.y+(t.y-this.y)*e)}distanceFrom(t){const e=this.x-t.x,s=this.y-t.y;return Math.sqrt(e*e+s*s)}midPointFrom(t){return this.lerp(t)}min(t){return new _(Math.min(this.x,t.x),Math.min(this.y,t.y))}max(t){return new _(Math.max(this.x,t.x),Math.max(this.y,t.y))}toString(){return`${this.x},${this.y}`}setXY(t,e){return this.x=t,this.y=e,this}setX(t){return this.x=t,this}setY(t){return this.y=t,this}setFromPoint(t){return this.x=t.x,this.y=t.y,this}swap(t){const e=this.x,s=this.y;this.x=t.x,this.y=t.y,t.x=e,t.y=s}clone(){return new _(this.x,this.y)}rotate(t){let e=arguments.length>1&&arguments[1]!==void 0?arguments[1]:ii;const s=Bt(t),i=Lt(t),r=this.subtract(e);return new _(r.x*i-r.y*s,r.x*s+r.y*i).add(e)}transform(t){let e=arguments.length>1&&arguments[1]!==void 0&&arguments[1];return new _(t[0]*this.x+t[2]*this.y+(e?0:t[4]),t[1]*this.x+t[3]*this.y+(e?0:t[5]))}}const ii=new _(0,0),ms=o=>!!o&&Array.isArray(o._objects);function Ui(o){class t extends o{constructor(){super(...arguments),m(this,"_objects",[])}_onObjectAdded(s){}_onObjectRemoved(s){}_onStackOrderChanged(s){}add(){for(var s=arguments.length,i=new Array(s),r=0;r<s;r++)i[r]=arguments[r];const n=this._objects.push(...i);return i.forEach(a=>this._onObjectAdded(a)),n}insertAt(s){for(var i=arguments.length,r=new Array(i>1?i-1:0),n=1;n<i;n++)r[n-1]=arguments[n];return this._objects.splice(s,0,...r),r.forEach(a=>this._onObjectAdded(a)),this._objects.length}remove(){const s=this._objects,i=[];for(var r=arguments.length,n=new Array(r),a=0;a<r;a++)n[a]=arguments[a];return n.forEach(l=>{const h=s.indexOf(l);h!==-1&&(s.splice(h,1),i.push(l),this._onObjectRemoved(l))}),i}forEachObject(s){this.getObjects().forEach((i,r,n)=>s(i,r,n))}getObjects(){for(var s=arguments.length,i=new Array(s),r=0;r<s;r++)i[r]=arguments[r];return i.length===0?[...this._objects]:this._objects.filter(n=>n.isType(...i))}item(s){return this._objects[s]}isEmpty(){return this._objects.length===0}size(){return this._objects.length}contains(s,i){return!!this._objects.includes(s)||!!i&&this._objects.some(r=>r instanceof t&&r.contains(s,!0))}complexity(){return this._objects.reduce((s,i)=>s+=i.complexity?i.complexity():0,0)}sendObjectToBack(s){return!(!s||s===this._objects[0])&&(ye(this._objects,s),this._objects.unshift(s),this._onStackOrderChanged(s),!0)}bringObjectToFront(s){return!(!s||s===this._objects[this._objects.length-1])&&(ye(this._objects,s),this._objects.push(s),this._onStackOrderChanged(s),!0)}sendObjectBackwards(s,i){if(!s)return!1;const r=this._objects.indexOf(s);if(r!==0){const n=this.findNewLowerIndex(s,r,i);return ye(this._objects,s),this._objects.splice(n,0,s),this._onStackOrderChanged(s),!0}return!1}bringObjectForward(s,i){if(!s)return!1;const r=this._objects.indexOf(s);if(r!==this._objects.length-1){const n=this.findNewUpperIndex(s,r,i);return ye(this._objects,s),this._objects.splice(n,0,s),this._onStackOrderChanged(s),!0}return!1}moveObjectTo(s,i){return s!==this._objects[i]&&(ye(this._objects,s),this._objects.splice(i,0,s),this._onStackOrderChanged(s),!0)}findNewLowerIndex(s,i,r){let n;if(r){n=i;for(let a=i-1;a>=0;--a)if(s.isOverlapping(this._objects[a])){n=a;break}}else n=i-1;return n}findNewUpperIndex(s,i,r){let n;if(r){n=i;for(let a=i+1;a<this._objects.length;++a)if(s.isOverlapping(this._objects[a])){n=a;break}}else n=i+1;return n}collectObjects(s){let{left:i,top:r,width:n,height:a}=s,{includeIntersecting:l=!0}=arguments.length>1&&arguments[1]!==void 0?arguments[1]:{};const h=[],c=new _(i,r),d=c.add(new _(n,a));for(let g=this._objects.length-1;g>=0;g--){const f=this._objects[g];f.selectable&&f.visible&&(l&&f.intersectsWithRect(c,d)||f.isContainedWithinRect(c,d)||l&&f.containsPoint(c)||l&&f.containsPoint(d))&&h.push(f)}return h}}return t}class qi extends cl{_setOptions(){let t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{};for(const e in t)this.set(e,t[e])}_setObject(t){for(const e in t)this._set(e,t[e])}set(t,e){return typeof t=="object"?this._setObject(t):this._set(t,e),this}_set(t,e){this[t]=e}toggle(t){const e=this.get(t);return typeof e=="boolean"&&this.set(t,!e),this}get(t){return this[t]}}function ys(o){return hs().requestAnimationFrame(o)}function ul(o){return hs().cancelAnimationFrame(o)}let dl=0;const Gt=()=>dl++,Rt=()=>{const o=de().createElement("canvas");if(!o||o.getContext===void 0)throw new Ot("Failed to create `canvas` element");return o},gl=()=>de().createElement("img"),pt=o=>{const t=Rt();return t.width=o.width,t.height=o.height,t},Ki=(o,t,e)=>o.toDataURL(`image/${t}`,e),Zi=(o,t,e)=>new Promise((s,i)=>{o.toBlob(s,`image/${t}`,e)}),U=o=>o*Ks,Ut=o=>o/Ks,fl=o=>o.every((t,e)=>t===et[e]),lt=(o,t,e)=>new _(o).transform(t,e),_t=o=>{const t=1/(o[0]*o[3]-o[1]*o[2]),e=[t*o[3],-t*o[1],-t*o[2],t*o[0],0,0],{x:s,y:i}=new _(o[4],o[5]).transform(e,!0);return e[4]=-s,e[5]=-i,e},J=(o,t,e)=>[o[0]*t[0]+o[2]*t[1],o[1]*t[0]+o[3]*t[1],o[0]*t[2]+o[2]*t[3],o[1]*t[2]+o[3]*t[3],e?0:o[0]*t[4]+o[2]*t[5]+o[4],e?0:o[1]*t[4]+o[3]*t[5]+o[5]],ri=(o,t)=>o.reduceRight((e,s)=>s&&e?J(s,e,t):s||e,void 0)||et.concat(),Ji=o=>{let[t,e]=o;return Math.atan2(e,t)},vs=o=>{const t=Ji(o),e=Math.pow(o[0],2)+Math.pow(o[1],2),s=Math.sqrt(e),i=(o[0]*o[3]-o[2]*o[1])/s,r=Math.atan2(o[0]*o[2]+o[1]*o[3],e);return{angle:Ut(t),scaleX:s,scaleY:i,skewX:Ut(r),skewY:0,translateX:o[4]||0,translateY:o[5]||0}},Fe=function(o){return[1,0,0,1,o,arguments.length>1&&arguments[1]!==void 0?arguments[1]:0]};function ve(){let{angle:o=0}=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{},{x:t=0,y:e=0}=arguments.length>1&&arguments[1]!==void 0?arguments[1]:{};const s=U(o),i=Lt(s),r=Bt(s);return[i,r,-r,i,t?t-(i*t-r*e):0,e?e-(r*t+i*e):0]}const ni=function(o){return[o,0,0,arguments.length>1&&arguments[1]!==void 0?arguments[1]:o,0,0]},Qi=o=>Math.tan(U(o)),tr=o=>[1,0,Qi(o),1,0,0],er=o=>[1,Qi(o),0,1,0,0],_s=o=>{let{scaleX:t=1,scaleY:e=1,flipX:s=!1,flipY:i=!1,skewX:r=0,skewY:n=0}=o,a=ni(s?-t:t,i?-e:e);return r&&(a=J(a,tr(r),!0)),n&&(a=J(a,er(n),!0)),a},pl=o=>{const{translateX:t=0,translateY:e=0,angle:s=0}=o;let i=Fe(t,e);s&&(i=J(i,ve({angle:s})));const r=_s(o);return fl(r)||(i=J(i,r)),i},xs=function(o){let{signal:t,crossOrigin:e=null}=arguments.length>1&&arguments[1]!==void 0?arguments[1]:{};return new Promise(function(s,i){if(t&&t.aborted)return i(new il("loadImage"));const r=gl();let n;t&&(n=function(l){r.src="",i(l)},t.addEventListener("abort",n,{once:!0}));const a=function(){r.onload=r.onerror=null,n&&(t==null||t.removeEventListener("abort",n)),s(r)};o?(r.onload=a,r.onerror=function(){n&&(t==null||t.removeEventListener("abort",n)),i(new Ot(`Error loading ${r.src}`))},e&&(r.crossOrigin=e),r.src=o):a()})},je=function(o){let{signal:t,reviver:e=cs}=arguments.length>1&&arguments[1]!==void 0?arguments[1]:{};return new Promise((s,i)=>{const r=[];t&&t.addEventListener("abort",i,{once:!0}),Promise.all(o.map(n=>T.getClass(n.type).fromObject(n,{signal:t}).then(a=>(e(n,a),r.push(a),a)))).then(s).catch(n=>{r.forEach(a=>{a.dispose&&a.dispose()}),i(n)}).finally(()=>{t&&t.removeEventListener("abort",i)})})},bs=function(o){let{signal:t}=arguments.length>1&&arguments[1]!==void 0?arguments[1]:{};return new Promise((e,s)=>{const i=[];t&&t.addEventListener("abort",s,{once:!0});const r=Object.values(o).map(a=>a&&a.type&&T.has(a.type)?je([a],{signal:t}).then(l=>{let[h]=l;return i.push(h),h}):a),n=Object.keys(o);Promise.all(r).then(a=>a.reduce((l,h,c)=>(l[n[c]]=h,l),{})).then(e).catch(a=>{i.forEach(l=>{l.dispose&&l.dispose()}),s(a)}).finally(()=>{t&&t.removeEventListener("abort",s)})})},_e=function(o){return(arguments.length>1&&arguments[1]!==void 0?arguments[1]:[]).reduce((t,e)=>(e in o&&(t[e]=o[e]),t),{})},oi=(o,t)=>Object.keys(o).reduce((e,s)=>(t(o[s],s,o)&&(e[s]=o[s]),e),{}),X=(o,t)=>parseFloat(Number(o).toFixed(t)),Le=o=>"matrix("+o.map(t=>X(t,L.NUM_FRACTION_DIGITS)).join(" ")+")",mt=o=>!!o&&o.toLive!==void 0,sr=o=>!!o&&typeof o.toObject=="function",ir=o=>!!o&&o.offsetX!==void 0&&"source"in o,ee=o=>!!o&&"multiSelectionStacking"in o;function rr(o){const t=o&&xt(o);let e=0,s=0;if(!o||!t)return{left:e,top:s};let i=o;const r=t.documentElement,n=t.body||{scrollLeft:0,scrollTop:0};for(;i&&(i.parentNode||i.host)&&(i=i.parentNode||i.host,i===t?(e=n.scrollLeft||r.scrollLeft||0,s=n.scrollTop||r.scrollTop||0):(e+=i.scrollLeft||0,s+=i.scrollTop||0),i.nodeType!==1||i.style.position!=="fixed"););return{left:e,top:s}}const xt=o=>o.ownerDocument||null,nr=o=>{var t;return((t=o.ownerDocument)===null||t===void 0?void 0:t.defaultView)||null},or=function(o,t,e){let{width:s,height:i}=e,r=arguments.length>3&&arguments[3]!==void 0?arguments[3]:1;o.width=s,o.height=i,r>1&&(o.setAttribute("width",(s*r).toString()),o.setAttribute("height",(i*r).toString()),t.scale(r,r))},ai=(o,t)=>{let{width:e,height:s}=t;e&&(o.style.width=typeof e=="number"?`${e}px`:e),s&&(o.style.height=typeof s=="number"?`${s}px`:s)};function ar(o){return o.onselectstart!==void 0&&(o.onselectstart=()=>!1),o.style.userSelect=ot,o}class lr{constructor(t){m(this,"_originalCanvasStyle",void 0),m(this,"lower",void 0);const e=this.createLowerCanvas(t);this.lower={el:e,ctx:e.getContext("2d")}}createLowerCanvas(t){const e=(s=t)&&s.getContext!==void 0?t:t&&de().getElementById(t)||Rt();var s;if(e.hasAttribute("data-fabric"))throw new Ot("Trying to initialize a canvas that has already been initialized. Did you forget to dispose the canvas?");return this._originalCanvasStyle=e.style.cssText,e.setAttribute("data-fabric","main"),e.classList.add("lower-canvas"),e}cleanupDOM(t){let{width:e,height:s}=t;const{el:i}=this.lower;i.classList.remove("lower-canvas"),i.removeAttribute("data-fabric"),i.setAttribute("width",`${e}`),i.setAttribute("height",`${s}`),i.style.cssText=this._originalCanvasStyle||"",this._originalCanvasStyle=void 0}setDimensions(t,e){const{el:s,ctx:i}=this.lower;or(s,i,t,e)}setCSSDimensions(t){ai(this.lower.el,t)}calcOffset(){return function(t){var e;const s=t&&xt(t),i={left:0,top:0};if(!s)return i;const r=((e=nr(t))===null||e===void 0?void 0:e.getComputedStyle(t,null))||{};i.left+=parseInt(r.borderLeftWidth,10)||0,i.top+=parseInt(r.borderTopWidth,10)||0,i.left+=parseInt(r.paddingLeft,10)||0,i.top+=parseInt(r.paddingTop,10)||0;let n={left:0,top:0};const a=s.documentElement;t.getBoundingClientRect!==void 0&&(n=t.getBoundingClientRect());const l=rr(t);return{left:n.left+l.left-(a.clientLeft||0)+i.left,top:n.top+l.top-(a.clientTop||0)+i.top}}(this.lower.el)}dispose(){Dt().dispose(this.lower.el),delete this.lower}}const ml={backgroundVpt:!0,backgroundColor:"",overlayVpt:!0,overlayColor:"",includeDefaultValues:!0,svgViewportTransformation:!0,renderOnAddRemove:!0,skipOffscreen:!0,enableRetinaScaling:!0,imageSmoothingEnabled:!0,controlsAboveOverlay:!1,allowTouchScrolling:!1,viewportTransform:[...et],patternQuality:"best"};class Be extends Ui(qi){get lowerCanvasEl(){var t;return(t=this.elements.lower)===null||t===void 0?void 0:t.el}get contextContainer(){var t;return(t=this.elements.lower)===null||t===void 0?void 0:t.ctx}static getDefaults(){return Be.ownDefaults}constructor(t){let e=arguments.length>1&&arguments[1]!==void 0?arguments[1]:{};super(),Object.assign(this,this.constructor.getDefaults()),this.set(e),this.initElements(t),this._setDimensionsImpl({width:this.width||this.elements.lower.el.width||0,height:this.height||this.elements.lower.el.height||0}),this.skipControlsDrawing=!1,this.viewportTransform=[...this.viewportTransform],this.calcViewportBoundaries()}initElements(t){this.elements=new lr(t)}add(){const t=super.add(...arguments);return arguments.length>0&&this.renderOnAddRemove&&this.requestRenderAll(),t}insertAt(t){for(var e=arguments.length,s=new Array(e>1?e-1:0),i=1;i<e;i++)s[i-1]=arguments[i];const r=super.insertAt(t,...s);return s.length>0&&this.renderOnAddRemove&&this.requestRenderAll(),r}remove(){const t=super.remove(...arguments);return t.length>0&&this.renderOnAddRemove&&this.requestRenderAll(),t}_onObjectAdded(t){t.canvas&&t.canvas!==this&&(Yt("warn",`Canvas is trying to add an object that belongs to a different canvas.
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
`)}loadFromJSON(t,e){let{signal:s}=arguments.length>2&&arguments[2]!==void 0?arguments[2]:{};if(!t)return Promise.reject(new Ot("`json` is undefined"));const{objects:i=[],...r}=typeof t=="string"?JSON.parse(t):t,{backgroundImage:n,background:a,overlayImage:l,overlay:h,clipPath:c}=r,d=this.renderOnAddRemove;return this.renderOnAddRemove=!1,Promise.all([je(i,{reviver:e,signal:s}),bs({backgroundImage:n,backgroundColor:a,overlayImage:l,overlayColor:h,clipPath:c},{signal:s})]).then(g=>{let[f,p]=g;return this.clear(),this.add(...f),this.set(r),this.set(p),this.renderOnAddRemove=d,this})}clone(t){const e=this.toObject(t);return this.cloneWithoutData().loadFromJSON(e)}cloneWithoutData(){const t=pt(this);return new this.constructor(t)}toDataURL(){let t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{};const{format:e="png",quality:s=1,multiplier:i=1,enableRetinaScaling:r=!1}=t,n=i*(r?this.getRetinaScaling():1);return Ki(this.toCanvasElement(n,t),e,s)}toBlob(){let t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{};const{format:e="png",quality:s=1,multiplier:i=1,enableRetinaScaling:r=!1}=t,n=i*(r?this.getRetinaScaling():1);return Zi(this.toCanvasElement(n,t),e,s)}toCanvasElement(){let t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:1,{width:e,height:s,left:i,top:r,filter:n}=arguments.length>1&&arguments[1]!==void 0?arguments[1]:{};const a=(e||this.width)*t,l=(s||this.height)*t,h=this.getZoom(),c=this.width,d=this.height,g=this.skipControlsDrawing,f=h*t,p=this.viewportTransform,y=[f,0,0,f,(p[4]-(i||0))*t,(p[5]-(r||0))*t],v=this.enableRetinaScaling,x=pt({width:a,height:l}),b=n?this._objects.filter(w=>n(w)):this._objects;return this.enableRetinaScaling=!1,this.viewportTransform=y,this.width=a,this.height=l,this.skipControlsDrawing=!0,this.calcViewportBoundaries(),this.renderCanvas(x.getContext("2d"),b),this.viewportTransform=p,this.width=c,this.height=d,this.calcViewportBoundaries(),this.enableRetinaScaling=v,this.skipControlsDrawing=g,x}dispose(){return!this.disposed&&this.elements.cleanupDOM({width:this.width,height:this.height}),ps.cancelByCanvas(this),this.disposed=!0,new Promise((t,e)=>{const s=()=>{this.destroy(),t(!0)};s.kill=e,this.__cleanupTask&&this.__cleanupTask.kill("aborted"),this.destroyed?t(!1):this.nextRenderHandle?this.__cleanupTask=s:s()})}destroy(){this.destroyed=!0,this.cancelRequestedRender(),this.forEachObject(t=>t.dispose()),this._objects=[],this.backgroundImage&&this.backgroundImage.dispose(),this.backgroundImage=void 0,this.overlayImage&&this.overlayImage.dispose(),this.overlayImage=void 0,this.elements.dispose()}toString(){return`#<Canvas (${this.complexity()}): { objects: ${this._objects.length} }>`}}m(Be,"ownDefaults",ml);const yl=["touchstart","touchmove","touchend"],vl=o=>{const t=rr(o.target),e=function(s){const i=s.changedTouches;return i&&i[0]?i[0]:s}(o);return new _(e.clientX+t.left,e.clientY+t.top)},li=o=>yl.includes(o.type)||o.pointerType==="touch",hr=o=>{o.preventDefault(),o.stopPropagation()},$t=o=>{let t=0,e=0,s=0,i=0;for(let r=0,n=o.length;r<n;r++){const{x:a,y:l}=o[r];(a>s||!r)&&(s=a),(a<t||!r)&&(t=a),(l>i||!r)&&(i=l),(l<e||!r)&&(e=l)}return{left:t,top:e,width:s-t,height:i-e}},_l=(o,t)=>Cs(o,J(t,o.calcOwnMatrix())),Cs=(o,t)=>{const{translateX:e,translateY:s,scaleX:i,scaleY:r,...n}=vs(t),a=new _(e,s);o.flipX=!1,o.flipY=!1,Object.assign(o,n),o.set({scaleX:i,scaleY:r}),o.setPositionByOrigin(a,A,A)},xl=o=>{o.scaleX=1,o.scaleY=1,o.skewX=0,o.skewY=0,o.flipX=!1,o.flipY=!1,o.rotate(0)},cr=o=>({scaleX:o.scaleX,scaleY:o.scaleY,skewX:o.skewX,skewY:o.skewY,angle:o.angle,left:o.left,flipX:o.flipX,flipY:o.flipY,top:o.top}),hi=(o,t,e)=>{const s=o/2,i=t/2,r=[new _(-s,-i),new _(s,-i),new _(-s,i),new _(s,i)].map(a=>a.transform(e)),n=$t(r);return new _(n.width,n.height)},ws=function(){let o=arguments.length>0&&arguments[0]!==void 0?arguments[0]:et;return J(_t(arguments.length>1&&arguments[1]!==void 0?arguments[1]:et),o)},xe=function(o){let t=arguments.length>1&&arguments[1]!==void 0?arguments[1]:et,e=arguments.length>2&&arguments[2]!==void 0?arguments[2]:et;return o.transform(ws(t,e))},bl=function(o){let t=arguments.length>1&&arguments[1]!==void 0?arguments[1]:et,e=arguments.length>2&&arguments[2]!==void 0?arguments[2]:et;return o.transform(ws(t,e),!0)},Cl=(o,t,e)=>{const s=ws(t,e);return Cs(o,J(s,o.calcOwnMatrix())),s},wl={left:-.5,top:-.5,center:0,bottom:.5,right:.5},st=o=>typeof o=="string"?wl[o]:o-.5,Sl=new _(1,0),ur=new _,dr=(o,t)=>o.rotate(t),Ss=(o,t)=>new _(t).subtract(o),ci=o=>o.distanceFrom(ur),ui=(o,t)=>Math.atan2(Re(o,t),Tl(o,t)),gr=o=>ui(Sl,o),di=o=>o.eq(ur)?o:o.scalarDivide(ci(o)),fr=function(o){let t=!(arguments.length>1&&arguments[1]!==void 0)||arguments[1];return di(new _(-o.y,o.x).scalarMultiply(t?1:-1))},Re=(o,t)=>o.x*t.y-o.y*t.x,Tl=(o,t)=>o.x*t.x+o.y*t.y,pr=(o,t,e)=>{if(o.eq(t)||o.eq(e))return!0;const s=Re(t,e),i=Re(t,o),r=Re(e,o);return s>=0?i>=0&&r<=0:!(i<=0&&r>=0)},Ts="not-allowed";function mr(o){return st(o.originX)===st(A)&&st(o.originY)===st(A)}function yr(o){return .5-st(o)}const bt=(o,t)=>o[t],vr=(o,t,e,s)=>({e:o,transform:t,pointer:new _(e,s)});function _r(o,t,e){const s=e,i=xe(o.getCenterPoint(),o.canvas.viewportTransform,void 0),r=gr(Ss(i,s))+ge;return Math.round(r%ge/al)}function gi(o,t,e,s,i){var r;let{target:n,corner:a}=o;const l=n.controls[a],h=((r=n.canvas)===null||r===void 0?void 0:r.getZoom())||1,c=n.padding/h,d=function(g,f,p,y){const v=g.getRelativeCenterPoint(),x=p!==void 0&&y!==void 0?g.translateToGivenOrigin(v,A,A,p,y):new _(g.left,g.top);return(g.angle?f.rotate(-U(g.angle),v):f).subtract(x)}(n,new _(s,i),t,e);return d.x>=c&&(d.x-=c),d.x<=-c&&(d.x+=c),d.y>=c&&(d.y-=c),d.y<=c&&(d.y+=c),d.x-=l.offsetX,d.y-=l.offsetY,d}const ks=o=>o.replace(/\s+/g," "),xr={aliceblue:"#F0F8FF",antiquewhite:"#FAEBD7",aqua:"#0FF",aquamarine:"#7FFFD4",azure:"#F0FFFF",beige:"#F5F5DC",bisque:"#FFE4C4",black:"#000",blanchedalmond:"#FFEBCD",blue:"#00F",blueviolet:"#8A2BE2",brown:"#A52A2A",burlywood:"#DEB887",cadetblue:"#5F9EA0",chartreuse:"#7FFF00",chocolate:"#D2691E",coral:"#FF7F50",cornflowerblue:"#6495ED",cornsilk:"#FFF8DC",crimson:"#DC143C",cyan:"#0FF",darkblue:"#00008B",darkcyan:"#008B8B",darkgoldenrod:"#B8860B",darkgray:"#A9A9A9",darkgrey:"#A9A9A9",darkgreen:"#006400",darkkhaki:"#BDB76B",darkmagenta:"#8B008B",darkolivegreen:"#556B2F",darkorange:"#FF8C00",darkorchid:"#9932CC",darkred:"#8B0000",darksalmon:"#E9967A",darkseagreen:"#8FBC8F",darkslateblue:"#483D8B",darkslategray:"#2F4F4F",darkslategrey:"#2F4F4F",darkturquoise:"#00CED1",darkviolet:"#9400D3",deeppink:"#FF1493",deepskyblue:"#00BFFF",dimgray:"#696969",dimgrey:"#696969",dodgerblue:"#1E90FF",firebrick:"#B22222",floralwhite:"#FFFAF0",forestgreen:"#228B22",fuchsia:"#F0F",gainsboro:"#DCDCDC",ghostwhite:"#F8F8FF",gold:"#FFD700",goldenrod:"#DAA520",gray:"#808080",grey:"#808080",green:"#008000",greenyellow:"#ADFF2F",honeydew:"#F0FFF0",hotpink:"#FF69B4",indianred:"#CD5C5C",indigo:"#4B0082",ivory:"#FFFFF0",khaki:"#F0E68C",lavender:"#E6E6FA",lavenderblush:"#FFF0F5",lawngreen:"#7CFC00",lemonchiffon:"#FFFACD",lightblue:"#ADD8E6",lightcoral:"#F08080",lightcyan:"#E0FFFF",lightgoldenrodyellow:"#FAFAD2",lightgray:"#D3D3D3",lightgrey:"#D3D3D3",lightgreen:"#90EE90",lightpink:"#FFB6C1",lightsalmon:"#FFA07A",lightseagreen:"#20B2AA",lightskyblue:"#87CEFA",lightslategray:"#789",lightslategrey:"#789",lightsteelblue:"#B0C4DE",lightyellow:"#FFFFE0",lime:"#0F0",limegreen:"#32CD32",linen:"#FAF0E6",magenta:"#F0F",maroon:"#800000",mediumaquamarine:"#66CDAA",mediumblue:"#0000CD",mediumorchid:"#BA55D3",mediumpurple:"#9370DB",mediumseagreen:"#3CB371",mediumslateblue:"#7B68EE",mediumspringgreen:"#00FA9A",mediumturquoise:"#48D1CC",mediumvioletred:"#C71585",midnightblue:"#191970",mintcream:"#F5FFFA",mistyrose:"#FFE4E1",moccasin:"#FFE4B5",navajowhite:"#FFDEAD",navy:"#000080",oldlace:"#FDF5E6",olive:"#808000",olivedrab:"#6B8E23",orange:"#FFA500",orangered:"#FF4500",orchid:"#DA70D6",palegoldenrod:"#EEE8AA",palegreen:"#98FB98",paleturquoise:"#AFEEEE",palevioletred:"#DB7093",papayawhip:"#FFEFD5",peachpuff:"#FFDAB9",peru:"#CD853F",pink:"#FFC0CB",plum:"#DDA0DD",powderblue:"#B0E0E6",purple:"#800080",rebeccapurple:"#639",red:"#F00",rosybrown:"#BC8F8F",royalblue:"#4169E1",saddlebrown:"#8B4513",salmon:"#FA8072",sandybrown:"#F4A460",seagreen:"#2E8B57",seashell:"#FFF5EE",sienna:"#A0522D",silver:"#C0C0C0",skyblue:"#87CEEB",slateblue:"#6A5ACD",slategray:"#708090",slategrey:"#708090",snow:"#FFFAFA",springgreen:"#00FF7F",steelblue:"#4682B4",tan:"#D2B48C",teal:"#008080",thistle:"#D8BFD8",tomato:"#FF6347",turquoise:"#40E0D0",violet:"#EE82EE",wheat:"#F5DEB3",white:"#FFF",whitesmoke:"#F5F5F5",yellow:"#FF0",yellowgreen:"#9ACD32"},fi=(o,t,e)=>(e<0&&(e+=1),e>1&&(e-=1),e<1/6?o+6*(t-o)*e:e<.5?t:e<2/3?o+(t-o)*(2/3-e)*6:o),br=(o,t,e,s)=>{o/=255,t/=255,e/=255;const i=Math.max(o,t,e),r=Math.min(o,t,e);let n,a;const l=(i+r)/2;if(i===r)n=a=0;else{const h=i-r;switch(a=l>.5?h/(2-i-r):h/(i+r),i){case o:n=(t-e)/h+(t<e?6:0);break;case t:n=(e-o)/h+2;break;case e:n=(o-t)/h+4}n/=6}return[Math.round(360*n),Math.round(100*a),Math.round(100*l),s]},Cr=function(){let o=arguments.length>0&&arguments[0]!==void 0?arguments[0]:"1";return parseFloat(o)/(o.endsWith("%")?100:1)},Os=o=>Math.min(Math.round(o),255).toString(16).toUpperCase().padStart(2,"0"),wr=o=>{let[t,e,s,i=1]=o;const r=Math.round(.3*t+.59*e+.11*s);return[r,r,r,i]};class I{constructor(t){if(m(this,"isUnrecognised",!1),t)if(t instanceof I)this.setSource([...t._source]);else if(Array.isArray(t)){const[e,s,i,r=1]=t;this.setSource([e,s,i,r])}else this.setSource(this._tryParsingColor(t));else this.setSource([0,0,0,1])}_tryParsingColor(t){return(t=t.toLowerCase())in xr&&(t=xr[t]),t==="transparent"?[255,255,255,0]:I.sourceFromHex(t)||I.sourceFromRgb(t)||I.sourceFromHsl(t)||(this.isUnrecognised=!0)&&[0,0,0,1]}getSource(){return this._source}setSource(t){this._source=t}toRgb(){const[t,e,s]=this.getSource();return`rgb(${t},${e},${s})`}toRgba(){return`rgba(${this.getSource().join(",")})`}toHsl(){const[t,e,s]=br(...this.getSource());return`hsl(${t},${e}%,${s}%)`}toHsla(){const[t,e,s,i]=br(...this.getSource());return`hsla(${t},${e}%,${s}%,${i})`}toHex(){return this.toHexa().slice(0,6)}toHexa(){const[t,e,s,i]=this.getSource();return`${Os(t)}${Os(e)}${Os(s)}${Os(Math.round(255*i))}`}getAlpha(){return this.getSource()[3]}setAlpha(t){return this._source[3]=t,this}toGrayscale(){return this.setSource(wr(this.getSource())),this}toBlackWhite(t){const[e,,,s]=wr(this.getSource()),i=e<(t||127)?0:255;return this.setSource([i,i,i,s]),this}overlayWith(t){t instanceof I||(t=new I(t));const e=this.getSource(),s=t.getSource(),[i,r,n]=e.map((a,l)=>Math.round(.5*a+.5*s[l]));return this.setSource([i,r,n,e[3]]),this}static fromRgb(t){return I.fromRgba(t)}static fromRgba(t){return new I(I.sourceFromRgb(t))}static sourceFromRgb(t){const e=ks(t).match(/^rgba?\(\s?(\d{0,3}(?:\.\d+)?%?)\s?[\s|,]\s?(\d{0,3}(?:\.\d+)?%?)\s?[\s|,]\s?(\d{0,3}(?:\.\d+)?%?)\s?(?:\s?[,/]\s?(\d{0,3}(?:\.\d+)?%?)\s?)?\)$/i);if(e){const[s,i,r]=e.slice(1,4).map(n=>{const a=parseFloat(n);return n.endsWith("%")?Math.round(2.55*a):a});return[s,i,r,Cr(e[4])]}}static fromHsl(t){return I.fromHsla(t)}static fromHsla(t){return new I(I.sourceFromHsl(t))}static sourceFromHsl(t){const e=ks(t).match(/^hsla?\(\s?([+-]?\d{0,3}(?:\.\d+)?(?:deg|turn|rad)?)\s?[\s|,]\s?(\d{0,3}(?:\.\d+)?%?)\s?[\s|,]\s?(\d{0,3}(?:\.\d+)?%?)\s?(?:\s?[,/]\s?(\d*(?:\.\d+)?%?)\s?)?\)$/i);if(!e)return;const s=(I.parseAngletoDegrees(e[1])%360+360)%360/360,i=parseFloat(e[2])/100,r=parseFloat(e[3])/100;let n,a,l;if(i===0)n=a=l=r;else{const h=r<=.5?r*(i+1):r+i-r*i,c=2*r-h;n=fi(c,h,s+1/3),a=fi(c,h,s),l=fi(c,h,s-1/3)}return[Math.round(255*n),Math.round(255*a),Math.round(255*l),Cr(e[4])]}static fromHex(t){return new I(I.sourceFromHex(t))}static sourceFromHex(t){if(t.match(/^#?(([0-9a-f]){3,4}|([0-9a-f]{2}){3,4})$/i)){const e=t.slice(t.indexOf("#")+1);let s;s=e.length<=4?e.split("").map(l=>l+l):e.match(/.{2}/g);const[i,r,n,a=255]=s.map(l=>parseInt(l,16));return[i,r,n,a/255]}}static parseAngletoDegrees(t){const e=t.toLowerCase(),s=parseFloat(e);return e.includes("rad")?Ut(s):e.includes("turn")?360*s:s}}const be=function(o){let t=arguments.length>1&&arguments[1]!==void 0?arguments[1]:Zs;const e=/\D{0,2}$/.exec(o),s=parseFloat(o),i=L.DPI;switch(e==null?void 0:e[0]){case"mm":return s*i/25.4;case"cm":return s*i/2.54;case"in":return s*i;case"pt":return s*i/72;case"pc":return s*i/72*12;case"em":return s*t;default:return s}},kl=o=>{const[t,e]=o.trim().split(" "),[s,i]=(r=t)&&r!==ot?[r.slice(1,4),r.slice(5,8)]:r===ot?[r,r]:["Mid","Mid"];var r;return{meetOrSlice:e||"meet",alignX:s,alignY:i}},$e=function(o,t){let e,s,i=!(arguments.length>2&&arguments[2]!==void 0)||arguments[2];if(t)if(t.toLive)e=`url(#SVGID_${t.id})`;else{const r=new I(t),n=r.getAlpha();e=r.toRgb(),n!==1&&(s=n.toString())}else e="none";return i?`${o}: ${e}; ${s?`${o}-opacity: ${s}; `:""}`:`${o}="${e}" ${s?`${o}-opacity="${s}" `:""}`};class Sr{getSvgStyles(t){const e=this.fillRule?this.fillRule:"nonzero",s=this.strokeWidth?this.strokeWidth:"0",i=this.strokeDashArray?this.strokeDashArray.join(" "):ot,r=this.strokeDashOffset?this.strokeDashOffset:"0",n=this.strokeLineCap?this.strokeLineCap:"butt",a=this.strokeLineJoin?this.strokeLineJoin:"miter",l=this.strokeMiterLimit?this.strokeMiterLimit:"4",h=this.opacity!==void 0?this.opacity:"1",c=this.visible?"":" visibility: hidden;",d=t?"":this.getSvgFilter(),g=$e(Z,this.fill);return[$e(ct,this.stroke),"stroke-width: ",s,"; ","stroke-dasharray: ",i,"; ","stroke-linecap: ",n,"; ","stroke-dashoffset: ",r,"; ","stroke-linejoin: ",a,"; ","stroke-miterlimit: ",l,"; ",g,"fill-rule: ",e,"; ","opacity: ",h,";",d,c].join("")}getSvgFilter(){return this.shadow?`filter: url(#SVGID_${this.shadow.id});`:""}getSvgCommons(){return[this.id?`id="${this.id}" `:"",this.clipPath?`clip-path="url(#${this.clipPath.clipPathId})" `:""].join("")}getSvgTransform(t){let e=arguments.length>1&&arguments[1]!==void 0?arguments[1]:"";const s=t?this.calcTransformMatrix():this.calcOwnMatrix();return`${`transform="${Le(s)}`}${e}" `}_toSVG(t){return[""]}toSVG(t){return this._createBaseSVGMarkup(this._toSVG(t),{reviver:t})}toClipPathSVG(t){return" "+this._createBaseClipPathSVGMarkup(this._toSVG(t),{reviver:t})}_createBaseClipPathSVGMarkup(t){let{reviver:e,additionalTransform:s=""}=arguments.length>1&&arguments[1]!==void 0?arguments[1]:{};const i=[this.getSvgTransform(!0,s),this.getSvgCommons()].join(""),r=t.indexOf("COMMON_PARTS");return t[r]=i,e?e(t.join("")):t.join("")}_createBaseSVGMarkup(t){let{noStyle:e,reviver:s,withShadow:i,additionalTransform:r}=arguments.length>1&&arguments[1]!==void 0?arguments[1]:{};const n=e?"":`style="${this.getSvgStyles()}" `,a=i?`style="${this.getSvgFilter()}" `:"",l=this.clipPath,h=this.strokeUniform?'vector-effect="non-scaling-stroke" ':"",c=l&&l.absolutePositioned,d=this.stroke,g=this.fill,f=this.shadow,p=[],y=t.indexOf("COMMON_PARTS");let v;l&&(l.clipPathId=`CLIPPATH_${Gt()}`,v=`<clipPath id="${l.clipPathId}" >
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
</
|
|
37
|
-
`}toObject(){const t={color:this.color,blur:this.blur,offsetX:this.offsetX,offsetY:this.offsetY,affectStroke:this.affectStroke,nonScaling:this.nonScaling,type:this.constructor.type},e=Mt.ownDefaults;return this.includeDefaultValues?t:oi(t,(s,i)=>s!==e[i])}static async fromObject(t){return new this(t)}}m(Mt,"ownDefaults",{color:"rgb(0,0,0)",blur:0,offsetX:0,offsetY:0,affectStroke:!1,includeDefaultValues:!0,nonScaling:!1}),m(Mt,"type","shadow"),T.setClass(Mt,"shadow");const Ce=(o,t,e)=>Math.max(o,Math.min(t,e)),Al=[nt,V,at,ft,"flipX","flipY","originX","originY","angle","opacity","globalCompositeOperation","shadow","visible",fe,pe],Vt=[Z,ct,"strokeWidth","strokeDashArray","width","height","paintFirst","strokeUniform","strokeLineCap","strokeDashOffset","strokeLineJoin","strokeMiterLimit","backgroundColor","clipPath"],Pl={top:0,left:0,width:0,height:0,angle:0,flipX:!1,flipY:!1,scaleX:1,scaleY:1,minScaleLimit:0,skewX:0,skewY:0,originX:A,originY:A,strokeWidth:1,strokeUniform:!1,padding:0,opacity:1,paintFirst:Z,fill:"rgb(0,0,0)",fillRule:"nonzero",stroke:null,strokeDashArray:null,strokeDashOffset:0,strokeLineCap:"butt",strokeLineJoin:"miter",strokeMiterLimit:4,globalCompositeOperation:"source-over",backgroundColor:"",shadow:null,visible:!0,includeDefaultValues:!0,excludeFromExport:!1,objectCaching:!0,clipPath:void 0,inverted:!1,absolutePositioned:!1,centeredRotation:!0,centeredScaling:!1,dirty:!0},Fl=(o,t,e,s)=>-e*Math.cos(o/s*Ae)+e+t,jl=()=>!1;class yi{constructor(t){let{startValue:e,byValue:s,duration:i=500,delay:r=0,easing:n=Fl,onStart:a=cs,onChange:l=cs,onComplete:h=cs,abort:c=jl,target:d}=t;m(this,"_state","pending"),m(this,"durationProgress",0),m(this,"valueProgress",0),this.tick=this.tick.bind(this),this.duration=i,this.delay=r,this.easing=n,this._onStart=a,this._onChange=l,this._onComplete=h,this._abort=c,this.target=d,this.startValue=e,this.byValue=s,this.value=this.startValue,this.endValue=Object.freeze(this.calculate(this.duration).value)}get state(){return this._state}isDone(){return this._state==="aborted"||this._state==="completed"}start(){const t=e=>{this._state==="pending"&&(this.startTime=e||+new Date,this._state="running",this._onStart(),this.tick(this.startTime))};this.register(),this.delay>0?setTimeout(()=>ys(t),this.delay):ys(t)}tick(t){const e=(t||+new Date)-this.startTime,s=Math.min(e,this.duration);this.durationProgress=s/this.duration;const{value:i,valueProgress:r}=this.calculate(s);this.value=Object.freeze(i),this.valueProgress=r,this._state!=="aborted"&&(this._abort(this.value,this.valueProgress,this.durationProgress)?(this._state="aborted",this.unregister()):e>=this.duration?(this.durationProgress=this.valueProgress=1,this._onChange(this.endValue,this.valueProgress,this.durationProgress),this._state="completed",this._onComplete(this.endValue,this.valueProgress,this.durationProgress),this.unregister()):(this._onChange(this.value,this.valueProgress,this.durationProgress),ys(this.tick)))}register(){ps.push(this)}unregister(){ps.remove(this)}abort(){this._state="aborted",this.unregister()}}class Ll extends yi{constructor(t){let{startValue:e=0,endValue:s=100,...i}=t;super({...i,startValue:e,byValue:s-e})}calculate(t){const e=this.easing(t,this.startValue,this.byValue,this.duration);return{value:e,valueProgress:Math.abs((e-this.startValue)/this.byValue)}}}class Bl extends yi{constructor(t){let{startValue:e=[0],endValue:s=[100],...i}=t;super({...i,startValue:e,byValue:s.map((r,n)=>r-e[n])})}calculate(t){const e=this.startValue.map((s,i)=>this.easing(t,s,this.byValue[i],this.duration,i));return{value:e,valueProgress:Math.abs((e[0]-this.startValue[0])/this.byValue[0])}}}const Rl=(o,t,e,s)=>t+e*(1-Math.cos(o/s*Ae)),vi=o=>o&&((t,e,s)=>o(new I(t).toRgba(),e,s));class $l extends yi{constructor(t){let{startValue:e,endValue:s,easing:i=Rl,onChange:r,onComplete:n,abort:a,...l}=t;const h=new I(e).getSource(),c=new I(s).getSource();super({...l,startValue:h,byValue:c.map((d,g)=>d-h[g]),easing:i,onChange:vi(r),onComplete:vi(n),abort:vi(a)})}calculate(t){const[e,s,i,r]=this.startValue.map((a,l)=>this.easing(t,a,this.byValue[l],this.duration,l)),n=[...[e,s,i].map(Math.round),Ce(0,r,1)];return{value:n,valueProgress:n.map((a,l)=>this.byValue[l]!==0?Math.abs((a-this.startValue[l])/this.byValue[l]):0).find(a=>a!==0)||0}}}function Pr(o){const t=(e=>Array.isArray(e.startValue)||Array.isArray(e.endValue))(o)?new Bl(o):new Ll(o);return t.start(),t}function Vl(o){const t=new $l(o);return t.start(),t}class Y{constructor(t){this.status=t,this.points=[]}includes(t){return this.points.some(e=>e.eq(t))}append(){for(var t=arguments.length,e=new Array(t),s=0;s<t;s++)e[s]=arguments[s];return this.points=this.points.concat(e.filter(i=>!this.includes(i))),this}static isPointContained(t,e,s){let i=arguments.length>3&&arguments[3]!==void 0&&arguments[3];if(e.eq(s))return t.eq(e);if(e.x===s.x)return t.x===e.x&&(i||t.y>=Math.min(e.y,s.y)&&t.y<=Math.max(e.y,s.y));if(e.y===s.y)return t.y===e.y&&(i||t.x>=Math.min(e.x,s.x)&&t.x<=Math.max(e.x,s.x));{const r=Ss(e,s),n=Ss(e,t).divide(r);return i?Math.abs(n.x)===Math.abs(n.y):n.x===n.y&&n.x>=0&&n.x<=1}}static isPointInPolygon(t,e){const s=new _(t).setX(Math.min(t.x-1,...e.map(r=>r.x)));let i=0;for(let r=0;r<e.length;r++){const n=this.intersectSegmentSegment(e[r],e[(r+1)%e.length],t,s);if(n.includes(t))return!0;i+=+(n.status==="Intersection")}return i%2==1}static intersectLineLine(t,e,s,i){let r=!(arguments.length>4&&arguments[4]!==void 0)||arguments[4],n=!(arguments.length>5&&arguments[5]!==void 0)||arguments[5];const a=e.x-t.x,l=e.y-t.y,h=i.x-s.x,c=i.y-s.y,d=t.x-s.x,g=t.y-s.y,f=h*g-c*d,p=a*g-l*d,y=c*a-h*l;if(y!==0){const v=f/y,x=p/y;return(r||0<=v&&v<=1)&&(n||0<=x&&x<=1)?new Y("Intersection").append(new _(t.x+v*a,t.y+v*l)):new Y}if(f===0||p===0){const v=r||n||Y.isPointContained(t,s,i)||Y.isPointContained(e,s,i)||Y.isPointContained(s,t,e)||Y.isPointContained(i,t,e);return new Y(v?"Coincident":void 0)}return new Y("Parallel")}static intersectSegmentLine(t,e,s,i){return Y.intersectLineLine(t,e,s,i,!1,!0)}static intersectSegmentSegment(t,e,s,i){return Y.intersectLineLine(t,e,s,i,!1,!1)}static intersectLinePolygon(t,e,s){let i=!(arguments.length>3&&arguments[3]!==void 0)||arguments[3];const r=new Y,n=s.length;for(let a,l,h,c=0;c<n;c++){if(a=s[c],l=s[(c+1)%n],h=Y.intersectLineLine(t,e,a,l,i,!1),h.status==="Coincident")return h;r.append(...h.points)}return r.points.length>0&&(r.status="Intersection"),r}static intersectSegmentPolygon(t,e,s){return Y.intersectLinePolygon(t,e,s,!1)}static intersectPolygonPolygon(t,e){const s=new Y,i=t.length,r=[];for(let n=0;n<i;n++){const a=t[n],l=t[(n+1)%i],h=Y.intersectSegmentPolygon(a,l,e);h.status==="Coincident"?(r.push(h),s.append(a,l)):s.append(...h.points)}return r.length>0&&r.length===t.length?new Y("Coincident"):(s.points.length>0&&(s.status="Intersection"),s)}static intersectPolygonRectangle(t,e,s){const i=e.min(s),r=e.max(s),n=new _(r.x,i.y),a=new _(i.x,r.y);return Y.intersectPolygonPolygon(t,[i,n,r,a])}}class Il extends qi{getX(){return this.getXY().x}setX(t){this.setXY(this.getXY().setX(t))}getY(){return this.getXY().y}setY(t){this.setXY(this.getXY().setY(t))}getRelativeX(){return this.left}setRelativeX(t){this.left=t}getRelativeY(){return this.top}setRelativeY(t){this.top=t}getXY(){const t=this.getRelativeXY();return this.group?lt(t,this.group.calcTransformMatrix()):t}setXY(t,e,s){this.group&&(t=lt(t,_t(this.group.calcTransformMatrix()))),this.setRelativeXY(t,e,s)}getRelativeXY(){return new _(this.left,this.top)}setRelativeXY(t){let e=arguments.length>1&&arguments[1]!==void 0?arguments[1]:this.originX,s=arguments.length>2&&arguments[2]!==void 0?arguments[2]:this.originY;this.setPositionByOrigin(t,e,s)}isStrokeAccountedForInDimensions(){return!1}getCoords(){const{tl:t,tr:e,br:s,bl:i}=this.aCoords||(this.aCoords=this.calcACoords()),r=[t,e,s,i];if(this.group){const n=this.group.calcTransformMatrix();return r.map(a=>lt(a,n))}return r}intersectsWithRect(t,e){return Y.intersectPolygonRectangle(this.getCoords(),t,e).status==="Intersection"}intersectsWithObject(t){const e=Y.intersectPolygonPolygon(this.getCoords(),t.getCoords());return e.status==="Intersection"||e.status==="Coincident"||t.isContainedWithinObject(this)||this.isContainedWithinObject(t)}isContainedWithinObject(t){return this.getCoords().every(e=>t.containsPoint(e))}isContainedWithinRect(t,e){const{left:s,top:i,width:r,height:n}=this.getBoundingRect();return s>=t.x&&s+r<=e.x&&i>=t.y&&i+n<=e.y}isOverlapping(t){return this.intersectsWithObject(t)||this.isContainedWithinObject(t)||t.isContainedWithinObject(this)}containsPoint(t){return Y.isPointInPolygon(t,this.getCoords())}isOnScreen(){if(!this.canvas)return!1;const{tl:t,br:e}=this.canvas.vptCoords;return!!this.getCoords().some(s=>s.x<=e.x&&s.x>=t.x&&s.y<=e.y&&s.y>=t.y)||!!this.intersectsWithRect(t,e)||this.containsPoint(t.midPointFrom(e))}isPartiallyOnScreen(){if(!this.canvas)return!1;const{tl:t,br:e}=this.canvas.vptCoords;return this.intersectsWithRect(t,e)?!0:this.getCoords().every(s=>(s.x>=e.x||s.x<=t.x)&&(s.y>=e.y||s.y<=t.y))&&this.containsPoint(t.midPointFrom(e))}getBoundingRect(){return $t(this.getCoords())}getScaledWidth(){return this._getTransformedDimensions().x}getScaledHeight(){return this._getTransformedDimensions().y}scale(t){this._set(at,t),this._set(ft,t),this.setCoords()}scaleToWidth(t){const e=this.getBoundingRect().width/this.getScaledWidth();return this.scale(t/this.width/e)}scaleToHeight(t){const e=this.getBoundingRect().height/this.getScaledHeight();return this.scale(t/this.height/e)}getCanvasRetinaScaling(){var t;return((t=this.canvas)===null||t===void 0?void 0:t.getRetinaScaling())||1}getTotalAngle(){return this.group?Ut(Ji(this.calcTransformMatrix())):this.angle}getViewportTransform(){var t;return((t=this.canvas)===null||t===void 0?void 0:t.viewportTransform)||et.concat()}calcACoords(){const t=ve({angle:this.angle}),{x:e,y:s}=this.getRelativeCenterPoint(),i=Fe(e,s),r=J(i,t),n=this._getTransformedDimensions(),a=n.x/2,l=n.y/2;return{tl:lt({x:-a,y:-l},r),tr:lt({x:a,y:-l},r),bl:lt({x:-a,y:l},r),br:lt({x:a,y:l},r)}}setCoords(){this.aCoords=this.calcACoords()}transformMatrixKey(){let t=arguments.length>0&&arguments[0]!==void 0&&arguments[0],e=[];return!t&&this.group&&(e=this.group.transformMatrixKey(t)),e.push(this.top,this.left,this.width,this.height,this.scaleX,this.scaleY,this.angle,this.strokeWidth,this.skewX,this.skewY,+this.flipX,+this.flipY,st(this.originX),st(this.originY)),e}calcTransformMatrix(){let t=arguments.length>0&&arguments[0]!==void 0&&arguments[0],e=this.calcOwnMatrix();if(t||!this.group)return e;const s=this.transformMatrixKey(t),i=this.matrixCache;return i&&i.key.every((r,n)=>r===s[n])?i.value:(this.group&&(e=J(this.group.calcTransformMatrix(!1),e)),this.matrixCache={key:s,value:e},e)}calcOwnMatrix(){const t=this.transformMatrixKey(!0),e=this.ownMatrixCache;if(e&&e.key.every((n,a)=>n===t[a]))return e.value;const s=this.getRelativeCenterPoint(),i={angle:this.angle,translateX:s.x,translateY:s.y,scaleX:this.scaleX,scaleY:this.scaleY,skewX:this.skewX,skewY:this.skewY,flipX:this.flipX,flipY:this.flipY},r=pl(i);return this.ownMatrixCache={key:t,value:r},r}_getNonTransformedDimensions(){return new _(this.width,this.height).scalarAdd(this.strokeWidth)}_calculateCurrentDimensions(t){return this._getTransformedDimensions(t).transform(this.getViewportTransform(),!0).scalarAdd(2*this.padding)}_getTransformedDimensions(){let t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{};const e={scaleX:this.scaleX,scaleY:this.scaleY,skewX:this.skewX,skewY:this.skewY,width:this.width,height:this.height,strokeWidth:this.strokeWidth,...t},s=e.strokeWidth;let i=s,r=0;this.strokeUniform&&(i=0,r=s);const n=e.width+i,a=e.height+i;let l;return l=e.skewX===0&&e.skewY===0?new _(n*e.scaleX,a*e.scaleY):hi(n,a,_s(e)),l.scalarAdd(r)}translateToGivenOrigin(t,e,s,i,r){let n=t.x,a=t.y;const l=st(i)-st(e),h=st(r)-st(s);if(l||h){const c=this._getTransformedDimensions();n+=l*c.x,a+=h*c.y}return new _(n,a)}translateToCenterPoint(t,e,s){if(e===A&&s===A)return t;const i=this.translateToGivenOrigin(t,e,s,A,A);return this.angle?i.rotate(U(this.angle),t):i}translateToOriginPoint(t,e,s){const i=this.translateToGivenOrigin(t,A,A,e,s);return this.angle?i.rotate(U(this.angle),t):i}getCenterPoint(){const t=this.getRelativeCenterPoint();return this.group?lt(t,this.group.calcTransformMatrix()):t}getRelativeCenterPoint(){return this.translateToCenterPoint(new _(this.left,this.top),this.originX,this.originY)}getPointByOrigin(t,e){return this.getPositionByOrigin(t,e)}getPositionByOrigin(t,e){return this.translateToOriginPoint(this.getRelativeCenterPoint(),t,e)}setPositionByOrigin(t,e,s){const i=this.translateToCenterPoint(t,e,s),r=this.translateToOriginPoint(i,this.originX,this.originY);this.set({left:r.x,top:r.y})}_getLeftTopCoords(){return this.getPositionByOrigin(V,nt)}positionByLeftTop(t){return this.setPositionByOrigin(t,V,nt)}}let It=class Us extends Il{static getDefaults(){return Us.ownDefaults}get type(){const t=this.constructor.type;return t==="FabricObject"?"object":t.toLowerCase()}set type(t){Yt("warn","Setting type has no effect",t)}constructor(t){super(),m(this,"_cacheContext",null),Object.assign(this,Us.ownDefaults),this.setOptions(t)}_createCacheCanvas(){this._cacheCanvas=Rt(),this._cacheContext=this._cacheCanvas.getContext("2d"),this._updateCacheCanvas(),this.dirty=!0}_limitCacheSize(t){const e=t.width,s=t.height,i=L.maxCacheSideLimit,r=L.minCacheSideLimit;if(e<=i&&s<=i&&e*s<=L.perfLimitSizeTotal)return e<r&&(t.width=r),s<r&&(t.height=r),t;const n=e/s,[a,l]=Me.limitDimsByArea(n),h=Ce(r,a,i),c=Ce(r,l,i);return e>h&&(t.zoomX/=e/h,t.width=h,t.capped=!0),s>c&&(t.zoomY/=s/c,t.height=c,t.capped=!0),t}_getCacheCanvasDimensions(){const t=this.getTotalObjectScaling(),e=this._getTransformedDimensions({skewX:0,skewY:0}),s=e.x*t.x/this.scaleX,i=e.y*t.y/this.scaleY;return{width:Math.ceil(s+2),height:Math.ceil(i+2),zoomX:t.x,zoomY:t.y,x:s,y:i}}_updateCacheCanvas(){const t=this._cacheCanvas,e=this._cacheContext,{width:s,height:i,zoomX:r,zoomY:n,x:a,y:l}=this._limitCacheSize(this._getCacheCanvasDimensions()),h=s!==t.width||i!==t.height,c=this.zoomX!==r||this.zoomY!==n;if(!t||!e)return!1;if(h||c){s!==t.width||i!==t.height?(t.width=s,t.height=i):(e.setTransform(1,0,0,1,0,0),e.clearRect(0,0,t.width,t.height));const d=a/2,g=l/2;return this.cacheTranslationX=Math.round(t.width/2-d)+d,this.cacheTranslationY=Math.round(t.height/2-g)+g,e.translate(this.cacheTranslationX,this.cacheTranslationY),e.scale(r,n),this.zoomX=r,this.zoomY=n,!0}return!1}setOptions(){let t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{};this._setOptions(t)}transform(t){const e=this.group&&!this.group._transformDone||this.group&&this.canvas&&t===this.canvas.contextTop,s=this.calcTransformMatrix(!e);t.transform(s[0],s[1],s[2],s[3],s[4],s[5])}getObjectScaling(){if(!this.group)return new _(Math.abs(this.scaleX),Math.abs(this.scaleY));const t=vs(this.calcTransformMatrix());return new _(Math.abs(t.scaleX),Math.abs(t.scaleY))}getTotalObjectScaling(){const t=this.getObjectScaling();if(this.canvas){const e=this.canvas.getZoom(),s=this.getCanvasRetinaScaling();return t.scalarMultiply(e*s)}return t}getObjectOpacity(){let t=this.opacity;return this.group&&(t*=this.group.getObjectOpacity()),t}_constrainScale(t){return Math.abs(t)<this.minScaleLimit?t<0?-this.minScaleLimit:this.minScaleLimit:t===0?1e-4:t}_set(t,e){t!==at&&t!==ft||(e=this._constrainScale(e)),t===at&&e<0?(this.flipX=!this.flipX,e*=-1):t==="scaleY"&&e<0?(this.flipY=!this.flipY,e*=-1):t!=="shadow"||!e||e instanceof Mt||(e=new Mt(e));const s=this[t]!==e;return this[t]=e,s&&this.constructor.cacheProperties.includes(t)&&(this.dirty=!0),this.parent&&(this.dirty||s&&this.constructor.stateProperties.includes(t))&&this.parent._set("dirty",!0),this}isNotVisible(){return this.opacity===0||!this.width&&!this.height&&this.strokeWidth===0||!this.visible}render(t){this.isNotVisible()||this.canvas&&this.canvas.skipOffscreen&&!this.group&&!this.isOnScreen()||(t.save(),this._setupCompositeOperation(t),this.drawSelectionBackground(t),this.transform(t),this._setOpacity(t),this._setShadow(t),this.shouldCache()?(this.renderCache(),this.drawCacheOnCanvas(t)):(this._removeCacheCanvas(),this.drawObject(t,!1,{}),this.dirty=!1),t.restore())}drawSelectionBackground(t){}renderCache(t){if(t=t||{},this._cacheCanvas&&this._cacheContext||this._createCacheCanvas(),this.isCacheDirty()&&this._cacheContext){const{zoomX:e,zoomY:s,cacheTranslationX:i,cacheTranslationY:r}=this,{width:n,height:a}=this._cacheCanvas;this.drawObject(this._cacheContext,t.forClipping,{zoomX:e,zoomY:s,cacheTranslationX:i,cacheTranslationY:r,width:n,height:a,parentClipPaths:[]}),this.dirty=!1}}_removeCacheCanvas(){this._cacheCanvas=void 0,this._cacheContext=null}hasStroke(){return!!this.stroke&&this.stroke!=="transparent"&&this.strokeWidth!==0}hasFill(){return!!this.fill&&this.fill!=="transparent"}needsItsOwnCache(){return!!(this.paintFirst===ct&&this.hasFill()&&this.hasStroke()&&this.shadow)||!!this.clipPath}shouldCache(){return this.ownCaching=this.objectCaching&&(!this.parent||!this.parent.isOnACache())||this.needsItsOwnCache(),this.ownCaching}willDrawShadow(){return!!this.shadow&&(this.shadow.offsetX!==0||this.shadow.offsetY!==0)}drawClipPathOnCache(t,e,s){t.save(),e.inverted?t.globalCompositeOperation="destination-out":t.globalCompositeOperation="destination-in",t.setTransform(1,0,0,1,0,0),t.drawImage(s,0,0),t.restore()}drawObject(t,e,s){const i=this.fill,r=this.stroke;e?(this.fill="black",this.stroke="",this._setClippingProperties(t)):this._renderBackground(t),this._render(t),this._drawClipPath(t,this.clipPath,s),this.fill=i,this.stroke=r}createClipPathLayer(t,e){const s=pt(e),i=s.getContext("2d");if(i.translate(e.cacheTranslationX,e.cacheTranslationY),i.scale(e.zoomX,e.zoomY),t._cacheCanvas=s,e.parentClipPaths.forEach(r=>{r.transform(i)}),e.parentClipPaths.push(t),t.absolutePositioned){const r=_t(this.calcTransformMatrix());i.transform(r[0],r[1],r[2],r[3],r[4],r[5])}return t.transform(i),t.drawObject(i,!0,e),s}_drawClipPath(t,e,s){if(!e)return;e._transformDone=!0;const i=this.createClipPathLayer(e,s);this.drawClipPathOnCache(t,e,i)}drawCacheOnCanvas(t){t.scale(1/this.zoomX,1/this.zoomY),t.drawImage(this._cacheCanvas,-this.cacheTranslationX,-this.cacheTranslationY)}isCacheDirty(){let t=arguments.length>0&&arguments[0]!==void 0&&arguments[0];if(this.isNotVisible())return!1;const e=this._cacheCanvas,s=this._cacheContext;return!(!e||!s||t||!this._updateCacheCanvas())||!!(this.dirty||this.clipPath&&this.clipPath.absolutePositioned)&&(e&&s&&!t&&(s.save(),s.setTransform(1,0,0,1,0,0),s.clearRect(0,0,e.width,e.height),s.restore()),!0)}_renderBackground(t){if(!this.backgroundColor)return;const e=this._getNonTransformedDimensions();t.fillStyle=this.backgroundColor,t.fillRect(-e.x/2,-e.y/2,e.x,e.y),this._removeShadow(t)}_setOpacity(t){this.group&&!this.group._transformDone?t.globalAlpha=this.getObjectOpacity():t.globalAlpha*=this.opacity}_setStrokeStyles(t,e){const s=e.stroke;s&&(t.lineWidth=e.strokeWidth,t.lineCap=e.strokeLineCap,t.lineDashOffset=e.strokeDashOffset,t.lineJoin=e.strokeLineJoin,t.miterLimit=e.strokeMiterLimit,mt(s)?s.gradientUnits==="percentage"||s.gradientTransform||s.patternTransform?this._applyPatternForTransformedGradient(t,s):(t.strokeStyle=s.toLive(t),this._applyPatternGradientTransform(t,s)):t.strokeStyle=e.stroke)}_setFillStyles(t,e){let{fill:s}=e;s&&(mt(s)?(t.fillStyle=s.toLive(t),this._applyPatternGradientTransform(t,s)):t.fillStyle=s)}_setClippingProperties(t){t.globalAlpha=1,t.strokeStyle="transparent",t.fillStyle="#000000"}_setLineDash(t,e){e&&e.length!==0&&t.setLineDash(e)}_setShadow(t){if(!this.shadow)return;const e=this.shadow,s=this.canvas,i=this.getCanvasRetinaScaling(),[r,,,n]=(s==null?void 0:s.viewportTransform)||et,a=r*i,l=n*i,h=e.nonScaling?new _(1,1):this.getObjectScaling();t.shadowColor=e.color,t.shadowBlur=e.blur*L.browserShadowBlurConstant*(a+l)*(h.x+h.y)/4,t.shadowOffsetX=e.offsetX*a*h.x,t.shadowOffsetY=e.offsetY*l*h.y}_removeShadow(t){this.shadow&&(t.shadowColor="",t.shadowBlur=t.shadowOffsetX=t.shadowOffsetY=0)}_applyPatternGradientTransform(t,e){if(!mt(e))return{offsetX:0,offsetY:0};const s=e.gradientTransform||e.patternTransform,i=-this.width/2+e.offsetX||0,r=-this.height/2+e.offsetY||0;return e.gradientUnits==="percentage"?t.transform(this.width,0,0,this.height,i,r):t.transform(1,0,0,1,i,r),s&&t.transform(s[0],s[1],s[2],s[3],s[4],s[5]),{offsetX:i,offsetY:r}}_renderPaintInOrder(t){this.paintFirst===ct?(this._renderStroke(t),this._renderFill(t)):(this._renderFill(t),this._renderStroke(t))}_render(t){}_renderFill(t){this.fill&&(t.save(),this._setFillStyles(t,this),this.fillRule==="evenodd"?t.fill("evenodd"):t.fill(),t.restore())}_renderStroke(t){if(this.stroke&&this.strokeWidth!==0){if(this.shadow&&!this.shadow.affectStroke&&this._removeShadow(t),t.save(),this.strokeUniform){const e=this.getObjectScaling();t.scale(1/e.x,1/e.y)}this._setLineDash(t,this.strokeDashArray),this._setStrokeStyles(t,this),t.stroke(),t.restore()}}_applyPatternForTransformedGradient(t,e){var s;const i=this._limitCacheSize(this._getCacheCanvasDimensions()),r=this.getCanvasRetinaScaling(),n=i.x/this.scaleX/r,a=i.y/this.scaleY/r,l=pt({width:Math.ceil(n),height:Math.ceil(a)}),h=l.getContext("2d");h&&(h.beginPath(),h.moveTo(0,0),h.lineTo(n,0),h.lineTo(n,a),h.lineTo(0,a),h.closePath(),h.translate(n/2,a/2),h.scale(i.zoomX/this.scaleX/r,i.zoomY/this.scaleY/r),this._applyPatternGradientTransform(h,e),h.fillStyle=e.toLive(t),h.fill(),t.translate(-this.width/2-this.strokeWidth/2,-this.height/2-this.strokeWidth/2),t.scale(r*this.scaleX/i.zoomX,r*this.scaleY/i.zoomY),t.strokeStyle=(s=h.createPattern(l,"no-repeat"))!==null&&s!==void 0?s:"")}_findCenterFromElement(){return new _(this.left+this.width/2,this.top+this.height/2)}clone(t){const e=this.toObject(t);return this.constructor.fromObject(e)}cloneAsImage(t){const e=this.toCanvasElement(t);return new(T.getClass("image"))(e)}toCanvasElement(){let t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{};const e=cr(this),s=this.group,i=this.shadow,r=Math.abs,n=t.enableRetinaScaling?zi():1,a=(t.multiplier||1)*n,l=t.canvasProvider||(b=>new Be(b,{enableRetinaScaling:!1,renderOnAddRemove:!1,skipOffscreen:!1}));delete this.group,t.withoutTransform&&xl(this),t.withoutShadow&&(this.shadow=null),t.viewportTransform&&Cl(this,this.getViewportTransform()),this.setCoords();const h=Rt(),c=this.getBoundingRect(),d=this.shadow,g=new _;if(d){const b=d.blur,w=d.nonScaling?new _(1,1):this.getObjectScaling();g.x=2*Math.round(r(d.offsetX)+b)*r(w.x),g.y=2*Math.round(r(d.offsetY)+b)*r(w.y)}const f=c.width+g.x,p=c.height+g.y;h.width=Math.ceil(f),h.height=Math.ceil(p);const y=l(h);t.format==="jpeg"&&(y.backgroundColor="#fff"),this.setPositionByOrigin(new _(y.width/2,y.height/2),A,A);const v=this.canvas;y._objects=[this],this.set("canvas",y),this.setCoords();const x=y.toCanvasElement(a||1,t);return this.set("canvas",v),this.shadow=i,s&&(this.group=s),this.set(e),this.setCoords(),y._objects=[],y.destroy(),x}toDataURL(){let t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{};return Ki(this.toCanvasElement(t),t.format||"png",t.quality||1)}toBlob(){let t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{};return Zi(this.toCanvasElement(t),t.format||"png",t.quality||1)}isType(){for(var t=arguments.length,e=new Array(t),s=0;s<t;s++)e[s]=arguments[s];return e.includes(this.constructor.type)||e.includes(this.type)}complexity(){return 1}toJSON(){return this.toObject()}rotate(t){const{centeredRotation:e,originX:s,originY:i}=this;if(e){const{x:r,y:n}=this.getRelativeCenterPoint();this.originX=A,this.originY=A,this.left=r,this.top=n}if(this.set("angle",t),e){const{x:r,y:n}=this.getPositionByOrigin(s,i);this.left=r,this.top=n,this.originX=s,this.originY=i}}setOnGroup(){}_setupCompositeOperation(t){this.globalCompositeOperation&&(t.globalCompositeOperation=this.globalCompositeOperation)}dispose(){ps.cancelByTarget(this),this.off(),this._set("canvas",void 0),this._cacheCanvas&&Dt().dispose(this._cacheCanvas),this._cacheCanvas=void 0,this._cacheContext=null}animate(t,e){return Object.entries(t).reduce((s,i)=>{let[r,n]=i;return s[r]=this._animate(r,n,e),s},{})}_animate(t,e){let s=arguments.length>2&&arguments[2]!==void 0?arguments[2]:{};const i=t.split("."),r=this.constructor.colorProperties.includes(i[i.length-1]),{abort:n,startValue:a,onChange:l,onComplete:h}=s,c={...s,target:this,startValue:a??i.reduce((d,g)=>d[g],this),endValue:e,abort:n==null?void 0:n.bind(this),onChange:(d,g,f)=>{i.reduce((p,y,v)=>(v===i.length-1&&(p[y]=d),p[y]),this),l&&l(d,g,f)},onComplete:(d,g,f)=>{this.setCoords(),h&&h(d,g,f)}};return r?Vl(c):Pr(c)}isDescendantOf(t){const{parent:e,group:s}=this;return e===t||s===t||!!e&&e.isDescendantOf(t)||!!s&&s!==e&&s.isDescendantOf(t)}getAncestors(){const t=[];let e=this;do e=e.parent,e&&t.push(e);while(e);return t}findCommonAncestors(t){if(this===t)return{fork:[],otherFork:[],common:[this,...this.getAncestors()]};const e=this.getAncestors(),s=t.getAncestors();if(e.length===0&&s.length>0&&this===s[s.length-1])return{fork:[],otherFork:[t,...s.slice(0,s.length-1)],common:[this]};for(let i,r=0;r<e.length;r++){if(i=e[r],i===t)return{fork:[this,...e.slice(0,r)],otherFork:[],common:e.slice(r)};for(let n=0;n<s.length;n++){if(this===s[n])return{fork:[],otherFork:[t,...s.slice(0,n)],common:[this,...e]};if(i===s[n])return{fork:[this,...e.slice(0,r)],otherFork:[t,...s.slice(0,n)],common:e.slice(r)}}}return{fork:[this,...e],otherFork:[t,...s],common:[]}}hasCommonAncestors(t){const e=this.findCommonAncestors(t);return e&&!!e.common.length}isInFrontOf(t){if(this===t)return;const e=this.findCommonAncestors(t);if(e.fork.includes(t))return!0;if(e.otherFork.includes(this))return!1;const s=e.common[0]||this.canvas;if(!s)return;const i=e.fork.pop(),r=e.otherFork.pop(),n=s._objects.indexOf(i),a=s._objects.indexOf(r);return n>-1&&n>a}toObject(){const t=(arguments.length>0&&arguments[0]!==void 0?arguments[0]:[]).concat(Us.customProperties,this.constructor.customProperties||[]);let e;const s=L.NUM_FRACTION_DIGITS,{clipPath:i,fill:r,stroke:n,shadow:a,strokeDashArray:l,left:h,top:c,originX:d,originY:g,width:f,height:p,strokeWidth:y,strokeLineCap:v,strokeDashOffset:x,strokeLineJoin:b,strokeUniform:w,strokeMiterLimit:C,scaleX:S,scaleY:O,angle:D,flipX:k,flipY:P,opacity:$,visible:N,backgroundColor:j,fillRule:B,paintFirst:F,globalCompositeOperation:q,skewX:W,skewY:H}=this;i&&!i.excludeFromExport&&(e=i.toObject(t.concat("inverted","absolutePositioned")));const R=kt=>X(kt,s),gt={..._e(this,t),type:this.constructor.type,version:qs,originX:d,originY:g,left:R(h),top:R(c),width:R(f),height:R(p),fill:sr(r)?r.toObject():r,stroke:sr(n)?n.toObject():n,strokeWidth:R(y),strokeDashArray:l&&l.concat(),strokeLineCap:v,strokeDashOffset:x,strokeLineJoin:b,strokeUniform:w,strokeMiterLimit:R(C),scaleX:R(S),scaleY:R(O),angle:R(D),flipX:k,flipY:P,opacity:R($),shadow:a&&a.toObject(),visible:N,backgroundColor:j,fillRule:B,paintFirst:F,globalCompositeOperation:q,skewX:R(W),skewY:R(H),...e?{clipPath:e}:null};return this.includeDefaultValues?gt:this._removeDefaultValues(gt)}toDatalessObject(t){return this.toObject(t)}_removeDefaultValues(t){const e=this.constructor.getDefaults(),s=Object.keys(e).length>0?e:Object.getPrototypeOf(this);return oi(t,(i,r)=>{if(r===V||r===nt||r==="type")return!0;const n=s[r];return i!==n&&!(Array.isArray(i)&&Array.isArray(n)&&i.length===0&&n.length===0)})}toString(){return`#<${this.constructor.type}>`}static _fromObject(t){let{type:e,...s}=t,{extraParam:i,...r}=arguments.length>1&&arguments[1]!==void 0?arguments[1]:{};return bs(s,r).then(n=>i?(delete n[i],new this(s[i],n)):new this(n))}static fromObject(t,e){return this._fromObject(t,e)}};m(It,"stateProperties",Al),m(It,"cacheProperties",Vt),m(It,"ownDefaults",Pl),m(It,"type","FabricObject"),m(It,"colorProperties",[Z,ct,"backgroundColor"]),m(It,"customProperties",[]),T.setClass(It),T.setClass(It,"object");const Fr=(o,t)=>{var e;const{transform:{target:s}}=t;(e=s.canvas)===null||e===void 0||e.fire(`object:${o}`,{...t,target:s}),s.fire(o,t)},we=(o,t,e)=>(s,i,r,n)=>{const a=t(s,i,r,n);return a&&Fr(o,{...vr(s,i,r,n),...e}),a};function Se(o){return(t,e,s,i)=>{const{target:r,originX:n,originY:a}=e,l=r.getPositionByOrigin(n,a),h=o(t,e,s,i);return r.setPositionByOrigin(l,e.originX,e.originY),h}}const Nl=(o,t,e,s)=>(i,r,n,a)=>{const l=gi(r,r.originX,r.originY,n,a)[e],h=st(r[t]);if(h===0||h>0&&l<0||h<0&&l>0){const{target:c}=r,d=c.strokeWidth/(c.strokeUniform?c[s]:1),g=mr(r)?2:1,f=c[o],p=Math.abs(l*g/c[s])-d;return c.set(o,Math.max(p,1)),f!==c[o]}return!1},Wl=Nl("width","originX","x","scaleX"),jr=we(Pe,Se(Wl));function Xl(o,t,e,s,i){o.save();const{stroke:r,xSize:n,ySize:a,opName:l}=this.commonRenderProps(o,t,e,i,s);let h=n;n>a?o.scale(1,a/n):a>n&&(h=a,o.scale(n/a,1)),o.beginPath(),o.arc(0,0,h/2,0,ge,!1),o[l](),r&&o.stroke(),o.restore()}function zl(o,t,e,s,i){o.save();const{stroke:r,xSize:n,ySize:a,opName:l}=this.commonRenderProps(o,t,e,i,s),h=n/2,c=a/2;o[`${l}Rect`](-h,-c,n,a),r&&o.strokeRect(-h,-c,n,a),o.restore()}class Ct{constructor(t){m(this,"visible",!0),m(this,"actionName",gs),m(this,"angle",0),m(this,"x",0),m(this,"y",0),m(this,"offsetX",0),m(this,"offsetY",0),m(this,"sizeX",0),m(this,"sizeY",0),m(this,"touchSizeX",0),m(this,"touchSizeY",0),m(this,"cursorStyle","crosshair"),m(this,"withConnection",!1),Object.assign(this,t)}shouldActivate(t,e,s,i){var r;let{tl:n,tr:a,br:l,bl:h}=i;return((r=e.canvas)===null||r===void 0?void 0:r.getActiveObject())===e&&e.isControlVisible(t)&&Y.isPointInPolygon(s,[n,a,l,h])}getActionHandler(t,e,s){return this.actionHandler}getMouseDownHandler(t,e,s){return this.mouseDownHandler}getMouseUpHandler(t,e,s){return this.mouseUpHandler}cursorStyleHandler(t,e,s,i){return e.cursorStyle}getActionName(t,e,s){return e.actionName}getVisibility(t,e){var s,i;return(s=(i=t._controlsVisibility)===null||i===void 0?void 0:i[e])!==null&&s!==void 0?s:this.visible}setVisibility(t,e,s){this.visible=t}positionHandler(t,e,s,i){return new _(this.x*t.x+this.offsetX,this.y*t.y+this.offsetY).transform(e)}calcCornerCoords(t,e,s,i,r,n){const a=ri([Fe(s,i),ve({angle:t}),ni((r?this.touchSizeX:this.sizeX)||e,(r?this.touchSizeY:this.sizeY)||e)]);return{tl:new _(-.5,-.5).transform(a),tr:new _(.5,-.5).transform(a),br:new _(.5,.5).transform(a),bl:new _(-.5,.5).transform(a)}}commonRenderProps(t,e,s,i){let r=arguments.length>4&&arguments[4]!==void 0?arguments[4]:{};const{cornerSize:n,cornerColor:a,transparentCorners:l,cornerStrokeColor:h}=r,c=n||i.cornerSize,d=this.sizeX||c,g=this.sizeY||c,f=l!==void 0?l:i.transparentCorners,p=f?ct:Z,y=h||i.cornerStrokeColor,v=!f&&!!y;return t.fillStyle=a||i.cornerColor||"",t.strokeStyle=y||"",t.translate(e,s),t.rotate(U(i.getTotalAngle())),{stroke:v,xSize:d,ySize:g,transparentCorners:f,opName:p}}render(t,e,s,i,r){((i=i||{}).cornerStyle||r.cornerStyle)==="circle"?Xl.call(this,t,e,s,i,r):zl.call(this,t,e,s,i,r)}}const Yl=(o,t,e)=>e.lockRotation?Ts:t.cursorStyle,Hl=we(Hi,Se((o,t,e,s)=>{let{target:i,ex:r,ey:n,theta:a,originX:l,originY:h}=t;const c=i.getPositionByOrigin(l,h);if(bt(i,"lockRotation"))return!1;const d=Math.atan2(n-c.y,r-c.x),g=Math.atan2(s-c.y,e-c.x);let f=Ut(g-d+a);if(i.snapAngle&&i.snapAngle>0){const y=i.snapAngle,v=i.snapThreshold||y,x=Math.ceil(f/y)*y,b=Math.floor(f/y)*y;Math.abs(f-b)<v?f=b:Math.abs(f-x)<v&&(f=x)}f<0&&(f=360+f),f%=360;const p=i.angle!==f;return i.angle=f,p}));function Lr(o,t){const e=t.canvas,s=o[e.uniScaleKey];return e.uniformScaling&&!s||!e.uniformScaling&&s}function Br(o,t,e){const s=bt(o,"lockScalingX"),i=bt(o,"lockScalingY");if(s&&i||!t&&(s||i)&&e||s&&t==="x"||i&&t==="y")return!0;const{width:r,height:n,strokeWidth:a}=o;return r===0&&a===0&&t!=="y"||n===0&&a===0&&t!=="x"}const Gl=["e","se","s","sw","w","nw","n","ne","e"],Ne=(o,t,e,s)=>{const i=Lr(o,e);if(Br(e,t.x!==0&&t.y===0?"x":t.x===0&&t.y!==0?"y":"",i))return Ts;const r=_r(e,0,s);return`${Gl[r]}-resize`};function _i(o,t,e,s){let i=arguments.length>4&&arguments[4]!==void 0?arguments[4]:{};const r=t.target,n=i.by,a=Lr(o,r);let l,h,c,d,g,f;if(Br(r,n,a))return!1;if(t.gestureScale)h=t.scaleX*t.gestureScale,c=t.scaleY*t.gestureScale;else{if(l=gi(t,t.originX,t.originY,e,s),g=n!=="y"?Math.sign(l.x||t.signX||1):1,f=n!=="x"?Math.sign(l.y||t.signY||1):1,t.signX||(t.signX=g),t.signY||(t.signY=f),bt(r,"lockScalingFlip")&&(t.signX!==g||t.signY!==f))return!1;if(d=r._getTransformedDimensions(),a&&!n){const v=Math.abs(l.x)+Math.abs(l.y),{original:x}=t,b=v/(Math.abs(d.x*x.scaleX/r.scaleX)+Math.abs(d.y*x.scaleY/r.scaleY));h=x.scaleX*b,c=x.scaleY*b}else h=Math.abs(l.x*r.scaleX/d.x),c=Math.abs(l.y*r.scaleY/d.y);mr(t)&&(h*=2,c*=2),t.signX!==g&&n!=="y"&&(t.originX=yr(t.originX),h*=-1,t.signX=g),t.signY!==f&&n!=="x"&&(t.originY=yr(t.originY),c*=-1,t.signY=f)}const p=r.scaleX,y=r.scaleY;return n?(n==="x"&&r.set(at,h),n==="y"&&r.set(ft,c)):(!bt(r,"lockScalingX")&&r.set(at,h),!bt(r,"lockScalingY")&&r.set(ft,c)),p!==r.scaleX||y!==r.scaleY}const Ms=we(us,Se((o,t,e,s)=>_i(o,t,e,s))),Ul=we(us,Se((o,t,e,s)=>_i(o,t,e,s,{by:"x"}))),ql=we(us,Se((o,t,e,s)=>_i(o,t,e,s,{by:"y"}))),xi={x:{counterAxis:"y",scale:at,skew:fe,lockSkewing:"lockSkewingX",origin:"originX",flip:"flipX"},y:{counterAxis:"x",scale:ft,skew:pe,lockSkewing:"lockSkewingY",origin:"originY",flip:"flipY"}},Kl=["ns","nesw","ew","nwse"],Zl=(o,t,e,s)=>{if(t.x!==0&&bt(e,"lockSkewingY")||t.y!==0&&bt(e,"lockSkewingX"))return Ts;const i=_r(e,0,s)%4;return`${Kl[i]}-resize`};function Rr(o,t,e,s,i){const{target:r}=e,{counterAxis:n,origin:a,lockSkewing:l,skew:h,flip:c}=xi[o];if(bt(r,l))return!1;const{origin:d,flip:g}=xi[n],f=st(e[d])*(r[g]?-1:1),p=-Math.sign(f)*(r[c]?-1:1),y=.5*-((r[h]===0&&gi(e,A,A,s,i)[o]>0||r[h]>0?1:-1)*p)+.5;return we(Gi,Se((x,b,w,C)=>function(S,O,D){let{target:k,ex:P,ey:$,skewingSide:N,...j}=O;const{skew:B}=xi[S],F=D.subtract(new _(P,$)).divide(new _(k.scaleX,k.scaleY))[S],q=k[B],W=j[B],H=Math.tan(U(W)),R=S==="y"?k._getTransformedDimensions({scaleX:1,scaleY:1,skewX:0}).x:k._getTransformedDimensions({scaleX:1,scaleY:1}).y,gt=2*F*N/Math.max(R,1)+H,kt=Ut(Math.atan(gt));k.set(B,kt);const De=q!==k[B];if(De&&S==="y"){const{skewX:as,scaleX:ue}=k,Pt=k._getTransformedDimensions({skewY:q}),M=k._getTransformedDimensions(),E=as!==0?Pt.x/M.x:1;E!==1&&k.set(at,E*ue)}return De}(o,b,new _(w,C))))(t,{...e,[a]:y,skewingSide:p},s,i)}const Jl=(o,t,e,s)=>Rr("x",o,t,e,s),Ql=(o,t,e,s)=>Rr("y",o,t,e,s);function As(o,t){return o[t.canvas.altActionKey]}const Ps=(o,t,e)=>{const s=As(o,e);return t.x===0?s?fe:ft:t.y===0?s?pe:at:""},Te=(o,t,e,s)=>As(o,e)?Zl(0,t,e,s):Ne(o,t,e,s),$r=(o,t,e,s)=>As(o,t.target)?Ql(o,t,e,s):Ul(o,t,e,s),Vr=(o,t,e,s)=>As(o,t.target)?Jl(o,t,e,s):ql(o,t,e,s),Ir=()=>({ml:new Ct({x:-.5,y:0,cursorStyleHandler:Te,actionHandler:$r,getActionName:Ps}),mr:new Ct({x:.5,y:0,cursorStyleHandler:Te,actionHandler:$r,getActionName:Ps}),mb:new Ct({x:0,y:.5,cursorStyleHandler:Te,actionHandler:Vr,getActionName:Ps}),mt:new Ct({x:0,y:-.5,cursorStyleHandler:Te,actionHandler:Vr,getActionName:Ps}),tl:new Ct({x:-.5,y:-.5,cursorStyleHandler:Ne,actionHandler:Ms}),tr:new Ct({x:.5,y:-.5,cursorStyleHandler:Ne,actionHandler:Ms}),bl:new Ct({x:-.5,y:.5,cursorStyleHandler:Ne,actionHandler:Ms}),br:new Ct({x:.5,y:.5,cursorStyleHandler:Ne,actionHandler:Ms}),mtr:new Ct({x:0,y:-.5,actionHandler:Hl,cursorStyleHandler:Yl,offsetY:-40,withConnection:!0,actionName:ti})}),th=()=>({mr:new Ct({x:.5,y:0,actionHandler:jr,cursorStyleHandler:Te,actionName:Pe}),ml:new Ct({x:-.5,y:0,actionHandler:jr,cursorStyleHandler:Te,actionName:Pe})}),eh=()=>({...Ir(),...th()});class We extends It{static getDefaults(){return{...super.getDefaults(),...We.ownDefaults}}constructor(t){super(),Object.assign(this,this.constructor.createControls(),We.ownDefaults),this.setOptions(t)}static createControls(){return{controls:Ir()}}_updateCacheCanvas(){const t=this.canvas;if(this.noScaleCache&&t&&t._currentTransform){const e=t._currentTransform,s=e.target,i=e.action;if(this===s&&i&&i.startsWith(gs))return!1}return super._updateCacheCanvas()}getActiveControl(){const t=this.__corner;return t?{key:t,control:this.controls[t],coord:this.oCoords[t]}:void 0}findControl(t){let e=arguments.length>1&&arguments[1]!==void 0&&arguments[1];if(!this.hasControls||!this.canvas)return;this.__corner=void 0;const s=Object.entries(this.oCoords);for(let i=s.length-1;i>=0;i--){const[r,n]=s[i],a=this.controls[r];if(a.shouldActivate(r,this,t,e?n.touchCorner:n.corner))return this.__corner=r,{key:r,control:a,coord:this.oCoords[r]}}}calcOCoords(){const t=this.getViewportTransform(),e=this.getCenterPoint(),s=Fe(e.x,e.y),i=ve({angle:this.getTotalAngle()-(this.group&&this.flipX?180:0)}),r=J(s,i),n=J(t,r),a=J(n,[1/t[0],0,0,1/t[3],0,0]),l=this.group?vs(this.calcTransformMatrix()):void 0;l&&(l.scaleX=Math.abs(l.scaleX),l.scaleY=Math.abs(l.scaleY));const h=this._calculateCurrentDimensions(l),c={};return this.forEachControl((d,g)=>{const f=d.positionHandler(h,a,this,d);c[g]=Object.assign(f,this._calcCornerCoords(d,f))}),c}_calcCornerCoords(t,e){const s=this.getTotalAngle();return{corner:t.calcCornerCoords(s,this.cornerSize,e.x,e.y,!1,this),touchCorner:t.calcCornerCoords(s,this.touchCornerSize,e.x,e.y,!0,this)}}setCoords(){super.setCoords(),this.canvas&&(this.oCoords=this.calcOCoords())}forEachControl(t){for(const e in this.controls)t(this.controls[e],e,this)}drawSelectionBackground(t){if(!this.selectionBackgroundColor||this.canvas&&this.canvas._activeObject!==this)return;t.save();const e=this.getRelativeCenterPoint(),s=this._calculateCurrentDimensions(),i=this.getViewportTransform();t.translate(e.x,e.y),t.scale(1/i[0],1/i[3]),t.rotate(U(this.angle)),t.fillStyle=this.selectionBackgroundColor,t.fillRect(-s.x/2,-s.y/2,s.x,s.y),t.restore()}strokeBorders(t,e){t.strokeRect(-e.x/2,-e.y/2,e.x,e.y)}_drawBorders(t,e){let s=arguments.length>2&&arguments[2]!==void 0?arguments[2]:{};const i={hasControls:this.hasControls,borderColor:this.borderColor,borderDashArray:this.borderDashArray,...s};t.save(),t.strokeStyle=i.borderColor,this._setLineDash(t,i.borderDashArray),this.strokeBorders(t,e),i.hasControls&&this.drawControlsConnectingLines(t,e),t.restore()}_renderControls(t){let e=arguments.length>1&&arguments[1]!==void 0?arguments[1]:{};const{hasBorders:s,hasControls:i}=this,r={hasBorders:s,hasControls:i,...e},n=this.getViewportTransform(),a=r.hasBorders,l=r.hasControls,h=J(n,this.calcTransformMatrix()),c=vs(h);t.save(),t.translate(c.translateX,c.translateY),t.lineWidth=this.borderScaleFactor,this.group===this.parent&&(t.globalAlpha=this.isMoving?this.borderOpacityWhenMoving:1),this.flipX&&(c.angle-=180),t.rotate(U(this.group?c.angle:this.angle)),a&&this.drawBorders(t,c,e),l&&this.drawControls(t,e),t.restore()}drawBorders(t,e,s){let i;if(s&&s.forActiveSelection||this.group){const r=hi(this.width,this.height,_s(e)),n=this.isStrokeAccountedForInDimensions()?ii:(this.strokeUniform?new _().scalarAdd(this.canvas?this.canvas.getZoom():1):new _(e.scaleX,e.scaleY)).scalarMultiply(this.strokeWidth);i=r.add(n).scalarAdd(this.borderScaleFactor).scalarAdd(2*this.padding)}else i=this._calculateCurrentDimensions().scalarAdd(this.borderScaleFactor);this._drawBorders(t,i,s)}drawControlsConnectingLines(t,e){let s=!1;t.beginPath(),this.forEachControl((i,r)=>{i.withConnection&&i.getVisibility(this,r)&&(s=!0,t.moveTo(i.x*e.x,i.y*e.y),t.lineTo(i.x*e.x+i.offsetX,i.y*e.y+i.offsetY))}),s&&t.stroke()}drawControls(t){let e=arguments.length>1&&arguments[1]!==void 0?arguments[1]:{};t.save();const s=this.getCanvasRetinaScaling(),{cornerStrokeColor:i,cornerDashArray:r,cornerColor:n}=this,a={cornerStrokeColor:i,cornerDashArray:r,cornerColor:n,...e};t.setTransform(s,0,0,s,0,0),t.strokeStyle=t.fillStyle=a.cornerColor,this.transparentCorners||(t.strokeStyle=a.cornerStrokeColor),this._setLineDash(t,a.cornerDashArray),this.forEachControl((l,h)=>{if(l.getVisibility(this,h)){const c=this.oCoords[h];l.render(t,c.x,c.y,a,this)}}),t.restore()}isControlVisible(t){return this.controls[t]&&this.controls[t].getVisibility(this,t)}setControlVisible(t,e){this._controlsVisibility||(this._controlsVisibility={}),this._controlsVisibility[t]=e}setControlsVisibility(){let t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{};Object.entries(t).forEach(e=>{let[s,i]=e;return this.setControlVisible(s,i)})}clearContextTop(t){if(!this.canvas)return;const e=this.canvas.contextTop;if(!e)return;const s=this.canvas.viewportTransform;e.save(),e.transform(s[0],s[1],s[2],s[3],s[4],s[5]),this.transform(e);const i=this.width+4,r=this.height+4;return e.clearRect(-i/2,-r/2,i,r),t||e.restore(),e}onDeselect(t){return!1}onSelect(t){return!1}shouldStartDragging(t){return!1}onDragStart(t){return!1}canDrop(t){return!1}renderDragSourceEffect(t){}renderDropTargetEffect(t){}}function Nr(o,t){return t.forEach(e=>{Object.getOwnPropertyNames(e.prototype).forEach(s=>{s!=="constructor"&&Object.defineProperty(o.prototype,s,Object.getOwnPropertyDescriptor(e.prototype,s)||Object.create(null))})}),o}m(We,"ownDefaults",{noScaleCache:!0,lockMovementX:!1,lockMovementY:!1,lockRotation:!1,lockScalingX:!1,lockScalingY:!1,lockSkewingX:!1,lockSkewingY:!1,lockScalingFlip:!1,cornerSize:13,touchCornerSize:24,transparentCorners:!0,cornerColor:"rgb(178,204,255)",cornerStrokeColor:"",cornerStyle:"rect",cornerDashArray:null,hasControls:!0,borderColor:"rgb(178,204,255)",borderDashArray:null,borderOpacityWhenMoving:.4,borderScaleFactor:1,hasBorders:!0,selectionBackgroundColor:"",selectable:!0,evented:!0,perPixelTargetFind:!1,activeOn:"down",hoverCursor:null,moveCursor:null});class Q extends We{}Nr(Q,[Sr]),T.setClass(Q),T.setClass(Q,"object");const sh=(o,t,e,s)=>{const i=2*(s=Math.round(s))+1,{data:r}=o.getImageData(t-s,e-s,i,i);for(let n=3;n<r.length;n+=4)if(r[n]>0)return!1;return!0};class Wr{constructor(t){this.options=t,this.strokeProjectionMagnitude=this.options.strokeWidth/2,this.scale=new _(this.options.scaleX,this.options.scaleY),this.strokeUniformScalar=this.options.strokeUniform?new _(1/this.options.scaleX,1/this.options.scaleY):new _(1,1)}createSideVector(t,e){const s=Ss(t,e);return this.options.strokeUniform?s.multiply(this.scale):s}projectOrthogonally(t,e,s){return this.applySkew(t.add(this.calcOrthogonalProjection(t,e,s)))}isSkewed(){return this.options.skewX!==0||this.options.skewY!==0}applySkew(t){const e=new _(t);return e.y+=e.x*Math.tan(U(this.options.skewY)),e.x+=e.y*Math.tan(U(this.options.skewX)),e}scaleUnitVector(t,e){return t.multiply(this.strokeUniformScalar).scalarMultiply(e)}}const ih=new _;class ke extends Wr{static getOrthogonalRotationFactor(t,e){const s=e?ui(t,e):gr(t);return Math.abs(s)<Ae?-1:1}constructor(t,e,s,i){super(i),m(this,"AB",void 0),m(this,"AC",void 0),m(this,"alpha",void 0),m(this,"bisector",void 0),this.A=new _(t),this.B=new _(e),this.C=new _(s),this.AB=this.createSideVector(this.A,this.B),this.AC=this.createSideVector(this.A,this.C),this.alpha=ui(this.AB,this.AC),this.bisector=di(dr(this.AB.eq(ih)?this.AC:this.AB,this.alpha/2))}calcOrthogonalProjection(t,e){let s=arguments.length>2&&arguments[2]!==void 0?arguments[2]:this.strokeProjectionMagnitude;const i=this.createSideVector(t,e),r=fr(i),n=ke.getOrthogonalRotationFactor(r,this.bisector);return this.scaleUnitVector(r,s*n)}projectBevel(){const t=[];return(this.alpha%ge===0?[this.B]:[this.B,this.C]).forEach(e=>{t.push(this.projectOrthogonally(this.A,e)),t.push(this.projectOrthogonally(this.A,e,-this.strokeProjectionMagnitude))}),t}projectMiter(){const t=[],e=Math.abs(this.alpha),s=1/Math.sin(e/2),i=this.scaleUnitVector(this.bisector,-this.strokeProjectionMagnitude*s),r=this.options.strokeUniform?ci(this.scaleUnitVector(this.bisector,this.options.strokeMiterLimit)):this.options.strokeMiterLimit;return ci(i)/this.strokeProjectionMagnitude<=r&&t.push(this.applySkew(this.A.add(i))),t.push(...this.projectBevel()),t}projectRoundNoSkew(t,e){const s=[],i=new _(ke.getOrthogonalRotationFactor(this.bisector),ke.getOrthogonalRotationFactor(new _(this.bisector.y,this.bisector.x)));return[new _(1,0).scalarMultiply(this.strokeProjectionMagnitude).multiply(this.strokeUniformScalar).multiply(i),new _(0,1).scalarMultiply(this.strokeProjectionMagnitude).multiply(this.strokeUniformScalar).multiply(i)].forEach(r=>{pr(r,t,e)&&s.push(this.A.add(r))}),s}projectRoundWithSkew(t,e){const s=[],{skewX:i,skewY:r,scaleX:n,scaleY:a,strokeUniform:l}=this.options,h=new _(Math.tan(U(i)),Math.tan(U(r))),c=this.strokeProjectionMagnitude,d=l?c/a/Math.sqrt(1/a**2+1/n**2*h.y**2):c/Math.sqrt(1+h.y**2),g=new _(Math.sqrt(Math.max(c**2-d**2,0)),d),f=l?c/Math.sqrt(1+h.x**2*(1/a)**2/(1/n+1/n*h.x*h.y)**2):c/Math.sqrt(1+h.x**2/(1+h.x*h.y)**2),p=new _(f,Math.sqrt(Math.max(c**2-f**2,0)));return[p,p.scalarMultiply(-1),g,g.scalarMultiply(-1)].map(y=>this.applySkew(l?y.multiply(this.strokeUniformScalar):y)).forEach(y=>{pr(y,t,e)&&s.push(this.applySkew(this.A).add(y))}),s}projectRound(){const t=[];t.push(...this.projectBevel());const e=this.alpha%ge===0,s=this.applySkew(this.A),i=t[e?0:2].subtract(s),r=t[e?1:0].subtract(s),n=e?this.applySkew(this.AB.scalarMultiply(-1)):this.applySkew(this.bisector.multiply(this.strokeUniformScalar).scalarMultiply(-1)),a=Re(i,n)>0,l=a?i:r,h=a?r:i;return this.isSkewed()?t.push(...this.projectRoundWithSkew(l,h)):t.push(...this.projectRoundNoSkew(l,h)),t}projectPoints(){switch(this.options.strokeLineJoin){case"miter":return this.projectMiter();case"round":return this.projectRound();default:return this.projectBevel()}}project(){return this.projectPoints().map(t=>({originPoint:this.A,projectedPoint:t,angle:this.alpha,bisector:this.bisector}))}}class Xr extends Wr{constructor(t,e,s){super(s),this.A=new _(t),this.T=new _(e)}calcOrthogonalProjection(t,e){let s=arguments.length>2&&arguments[2]!==void 0?arguments[2]:this.strokeProjectionMagnitude;const i=this.createSideVector(t,e);return this.scaleUnitVector(fr(i),s)}projectButt(){return[this.projectOrthogonally(this.A,this.T,this.strokeProjectionMagnitude),this.projectOrthogonally(this.A,this.T,-this.strokeProjectionMagnitude)]}projectRound(){const t=[];if(!this.isSkewed()&&this.A.eq(this.T)){const e=new _(1,1).scalarMultiply(this.strokeProjectionMagnitude).multiply(this.strokeUniformScalar);t.push(this.applySkew(this.A.add(e)),this.applySkew(this.A.subtract(e)))}else t.push(...new ke(this.A,this.T,this.T,this.options).projectRound());return t}projectSquare(){const t=[];if(this.A.eq(this.T)){const e=new _(1,1).scalarMultiply(this.strokeProjectionMagnitude).multiply(this.strokeUniformScalar);t.push(this.A.add(e),this.A.subtract(e))}else{const e=this.calcOrthogonalProjection(this.A,this.T,this.strokeProjectionMagnitude),s=this.scaleUnitVector(di(this.createSideVector(this.A,this.T)),-this.strokeProjectionMagnitude),i=this.A.add(s);t.push(i.add(e),i.subtract(e))}return t.map(e=>this.applySkew(e))}projectPoints(){switch(this.options.strokeLineCap){case"round":return this.projectRound();case"square":return this.projectSquare();default:return this.projectButt()}}project(){return this.projectPoints().map(t=>({originPoint:this.A,projectedPoint:t}))}}const rh=function(o,t){let e=arguments.length>2&&arguments[2]!==void 0&&arguments[2];const s=[];if(o.length===0)return s;const i=o.reduce((r,n)=>(r[r.length-1].eq(n)||r.push(new _(n)),r),[new _(o[0])]);if(i.length===1)e=!0;else if(!e){const r=i[0],n=((a,l)=>{for(let h=a.length-1;h>=0;h--)if(l(a[h],h,a))return h;return-1})(i,a=>!a.eq(r));i.splice(n+1)}return i.forEach((r,n,a)=>{let l,h;n===0?(h=a[1],l=e?r:a[a.length-1]):n===a.length-1?(l=a[n-1],h=e?r:a[0]):(l=a[n-1],h=a[n+1]),e&&a.length===1?s.push(...new Xr(r,r,t).project()):!e||n!==0&&n!==a.length-1?s.push(...new ke(r,l,h,t).project()):s.push(...new Xr(r,n===0?h:l,t).project())}),s},bi=o=>{const t={};return Object.keys(o).forEach(e=>{t[e]={},Object.keys(o[e]).forEach(s=>{t[e][s]={...o[e][s]}})}),t},nh=o=>o.replace(/&/g,"&").replace(/"/g,""").replace(/'/g,"'").replace(/</g,"<").replace(/>/g,">");let Xe;const Ci=o=>{if(Xe||Xe||(Xe="Intl"in hs()&&"Segmenter"in Intl&&new Intl.Segmenter(void 0,{granularity:"grapheme"})),Xe){const t=Xe.segment(o);return Array.from(t).map(e=>{let{segment:s}=e;return s})}return oh(o)},oh=o=>{const t=[];for(let e,s=0;s<o.length;s++)(e=ah(o,s))!==!1&&t.push(e);return t},ah=(o,t)=>{const e=o.charCodeAt(t);if(isNaN(e))return"";if(e<55296||e>57343)return o.charAt(t);if(55296<=e&&e<=56319){if(o.length<=t+1)throw"High surrogate without following low surrogate";const i=o.charCodeAt(t+1);if(56320>i||i>57343)throw"High surrogate without following low surrogate";return o.charAt(t)+o.charAt(t+1)}if(t===0)throw"Low surrogate without preceding high surrogate";const s=o.charCodeAt(t-1);if(55296>s||s>56319)throw"Low surrogate without preceding high surrogate";return!1},wi=function(o,t){let e=arguments.length>2&&arguments[2]!==void 0&&arguments[2];return o.fill!==t.fill||o.stroke!==t.stroke||o.strokeWidth!==t.strokeWidth||o.fontSize!==t.fontSize||o.fontFamily!==t.fontFamily||o.fontWeight!==t.fontWeight||o.fontStyle!==t.fontStyle||o.textDecorationThickness!==t.textDecorationThickness||o.textBackgroundColor!==t.textBackgroundColor||o.deltaY!==t.deltaY||e&&(o.overline!==t.overline||o.underline!==t.underline||o.linethrough!==t.linethrough)},lh=(o,t)=>{const e=t.split(`
|
|
38
|
-
|
|
39
|
-
`]}static async fromElement(t,e,s){const{left:i=0,top:r=0,width:n=0,height:a=0,visible:l=!0,...h}=Nt(t,this.ATTRIBUTE_NAMES,s);return new this({...e,...h,left:i,top:r,width:n,height:a,visible:!!(l&&n&&a)})}}m(yt,"type","Rect"),m(yt,"cacheProperties",[...Vt,...Yr]),m(yt,"ownDefaults",{rx:0,ry:0}),m(yt,"ATTRIBUTE_NAMES",[...qt,"x","y","rx","ry","width","height"]),T.setClass(yt),T.setSVGClass(yt);const Wt="initialization",Fs="added",ki="removed",js="imperative",Hr=(o,t)=>{const{strokeUniform:e,strokeWidth:s,width:i,height:r,group:n}=t,a=n&&n!==o?ws(n.calcTransformMatrix(),o.calcTransformMatrix()):null,l=a?t.getRelativeCenterPoint().transform(a):t.getRelativeCenterPoint(),h=!t.isStrokeAccountedForInDimensions(),c=e&&h?bl(new _(s,s),void 0,o.calcTransformMatrix()):ii,d=!e&&h?s:0,g=hi(i+d,r+d,ri([a,t.calcOwnMatrix()],!0)).add(c).scalarDivide(2);return[l.subtract(g),l.add(g)]};class Ls{calcLayoutResult(t,e){if(this.shouldPerformLayout(t))return this.calcBoundingBox(e,t)}shouldPerformLayout(t){let{type:e,prevStrategy:s,strategy:i}=t;return e===Wt||e===js||!!s&&i!==s}shouldLayoutClipPath(t){let{type:e,target:{clipPath:s}}=t;return e!==Wt&&s&&!s.absolutePositioned}getInitialSize(t,e){return e.size}calcBoundingBox(t,e){const{type:s,target:i}=e;if(s===js&&e.overrides)return e.overrides;if(t.length===0)return;const{left:r,top:n,width:a,height:l}=$t(t.map(d=>Hr(i,d)).reduce((d,g)=>d.concat(g),[])),h=new _(a,l),c=new _(r,n).add(h.scalarDivide(2));if(s===Wt){const d=this.getInitialSize(e,{size:h,center:c});return{center:c,relativeCorrection:new _(0,0),size:d}}return{center:c.transform(i.calcOwnMatrix()),size:h}}}m(Ls,"type","strategy");class Oi extends Ls{shouldPerformLayout(t){return!0}}m(Oi,"type","fit-content"),T.setClass(Oi);const Gr="layoutManager";class ze{constructor(){let t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:new Oi;m(this,"strategy",void 0),this.strategy=t,this._subscriptions=new Map}performLayout(t){const e={bubbles:!0,strategy:this.strategy,...t,prevStrategy:this._prevLayoutStrategy,stopPropagation(){this.bubbles=!1}};this.onBeforeLayout(e);const s=this.getLayoutResult(e);s&&this.commitLayout(e,s),this.onAfterLayout(e,s),this._prevLayoutStrategy=e.strategy}attachHandlers(t,e){const{target:s}=e;return[fs,Yi,Pe,Hi,us,Gi,ds,ll,hl].map(i=>t.on(i,r=>this.performLayout(i===fs?{type:"object_modified",trigger:i,e:r,target:s}:{type:"object_modifying",trigger:i,e:r,target:s})))}subscribe(t,e){this.unsubscribe(t,e);const s=this.attachHandlers(t,e);this._subscriptions.set(t,s)}unsubscribe(t,e){(this._subscriptions.get(t)||[]).forEach(s=>s()),this._subscriptions.delete(t)}unsubscribeTargets(t){t.targets.forEach(e=>this.unsubscribe(e,t))}subscribeTargets(t){t.targets.forEach(e=>this.subscribe(e,t))}onBeforeLayout(t){const{target:e,type:s}=t,{canvas:i}=e;if(s===Wt||s===Fs?this.subscribeTargets(t):s===ki&&this.unsubscribeTargets(t),e.fire("layout:before",{context:t}),i&&i.fire("object:layout:before",{target:e,context:t}),s===js&&t.deep){const{strategy:r,...n}=t;e.forEachObject(a=>a.layoutManager&&a.layoutManager.performLayout({...n,bubbles:!1,target:a}))}}getLayoutResult(t){const{target:e,strategy:s,type:i}=t,r=s.calcLayoutResult(t,e.getObjects());if(!r)return;const n=i===Wt?new _:e.getRelativeCenterPoint(),{center:a,correction:l=new _,relativeCorrection:h=new _}=r,c=n.subtract(a).add(l).transform(i===Wt?et:_t(e.calcOwnMatrix()),!0).add(h);return{result:r,prevCenter:n,nextCenter:a,offset:c}}commitLayout(t,e){const{target:s}=t,{result:{size:i},nextCenter:r}=e;var n,a;s.set({width:i.x,height:i.y}),this.layoutObjects(t,e),t.type===Wt?s.set({left:(n=t.x)!==null&&n!==void 0?n:r.x+i.x*st(s.originX),top:(a=t.y)!==null&&a!==void 0?a:r.y+i.y*st(s.originY)}):(s.setPositionByOrigin(r,A,A),s.setCoords(),s.set("dirty",!0))}layoutObjects(t,e){const{target:s}=t;s.forEachObject(i=>{i.group===s&&this.layoutObject(t,e,i)}),t.strategy.shouldLayoutClipPath(t)&&this.layoutObject(t,e,s.clipPath)}layoutObject(t,e,s){let{offset:i}=e;s.set({left:s.left+i.x,top:s.top+i.y})}onAfterLayout(t,e){const{target:s,strategy:i,bubbles:r,prevStrategy:n,...a}=t,{canvas:l}=s;s.fire("layout:after",{context:t,result:e}),l&&l.fire("object:layout:after",{context:t,result:e,target:s});const h=s.parent;r&&h!=null&&h.layoutManager&&((a.path||(a.path=[])).push(s),h.layoutManager.performLayout({...a,target:h})),s.set("dirty",!0)}dispose(){const{_subscriptions:t}=this;t.forEach(e=>e.forEach(s=>s())),t.clear()}toObject(){return{type:Gr,strategy:this.strategy.constructor.type}}toJSON(){return this.toObject()}}T.setClass(ze,Gr);class Dh extends ze{performLayout(){}}class re extends Ui(Q){static getDefaults(){return{...super.getDefaults(),...re.ownDefaults}}constructor(){let t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:[],e=arguments.length>1&&arguments[1]!==void 0?arguments[1]:{};super(),m(this,"_activeObjects",[]),m(this,"__objectSelectionTracker",void 0),m(this,"__objectSelectionDisposer",void 0),Object.assign(this,re.ownDefaults),this.setOptions(e),this.groupInit(t,e)}groupInit(t,e){var s;this._objects=[...t],this.__objectSelectionTracker=this.__objectSelectionMonitor.bind(this,!0),this.__objectSelectionDisposer=this.__objectSelectionMonitor.bind(this,!1),this.forEachObject(i=>{this.enterGroup(i,!1)}),this.layoutManager=(s=e.layoutManager)!==null&&s!==void 0?s:new ze,this.layoutManager.performLayout({type:Wt,target:this,targets:[...t],x:e.left,y:e.top})}canEnterGroup(t){return t===this||this.isDescendantOf(t)?(Yt("error","Group: circular object trees are not supported, this call has no effect"),!1):this._objects.indexOf(t)===-1||(Yt("error","Group: duplicate objects are not supported inside group, this call has no effect"),!1)}_filterObjectsBeforeEnteringGroup(t){return t.filter((e,s,i)=>this.canEnterGroup(e)&&i.indexOf(e)===s)}add(){for(var t=arguments.length,e=new Array(t),s=0;s<t;s++)e[s]=arguments[s];const i=this._filterObjectsBeforeEnteringGroup(e),r=super.add(...i);return this._onAfterObjectsChange(Fs,i),r}insertAt(t){for(var e=arguments.length,s=new Array(e>1?e-1:0),i=1;i<e;i++)s[i-1]=arguments[i];const r=this._filterObjectsBeforeEnteringGroup(s),n=super.insertAt(t,...r);return this._onAfterObjectsChange(Fs,r),n}remove(){const t=super.remove(...arguments);return this._onAfterObjectsChange(ki,t),t}_onObjectAdded(t){this.enterGroup(t,!0),this.fire("object:added",{target:t}),t.fire("added",{target:this})}_onObjectRemoved(t,e){this.exitGroup(t,e),this.fire("object:removed",{target:t}),t.fire("removed",{target:this})}_onAfterObjectsChange(t,e){this.layoutManager.performLayout({type:t,targets:e,target:this})}_onStackOrderChanged(){this._set("dirty",!0)}_set(t,e){const s=this[t];return super._set(t,e),t==="canvas"&&s!==e&&(this._objects||[]).forEach(i=>{i._set(t,e)}),this}_shouldSetNestedCoords(){return this.subTargetCheck}removeAll(){return this._activeObjects=[],this.remove(...this._objects)}__objectSelectionMonitor(t,e){let{target:s}=e;const i=this._activeObjects;if(t)i.push(s),this._set("dirty",!0);else if(i.length>0){const r=i.indexOf(s);r>-1&&(i.splice(r,1),this._set("dirty",!0))}}_watchObject(t,e){t&&this._watchObject(!1,e),t?(e.on("selected",this.__objectSelectionTracker),e.on("deselected",this.__objectSelectionDisposer)):(e.off("selected",this.__objectSelectionTracker),e.off("deselected",this.__objectSelectionDisposer))}enterGroup(t,e){t.group&&t.group.remove(t),t._set("parent",this),this._enterGroup(t,e)}_enterGroup(t,e){e&&Cs(t,J(_t(this.calcTransformMatrix()),t.calcTransformMatrix())),this._shouldSetNestedCoords()&&t.setCoords(),t._set("group",this),t._set("canvas",this.canvas),this._watchObject(!0,t);const s=this.canvas&&this.canvas.getActiveObject&&this.canvas.getActiveObject();s&&(s===t||t.isDescendantOf(s))&&this._activeObjects.push(t)}exitGroup(t,e){this._exitGroup(t,e),t._set("parent",void 0),t._set("canvas",void 0)}_exitGroup(t,e){t._set("group",void 0),e||(Cs(t,J(this.calcTransformMatrix(),t.calcTransformMatrix())),t.setCoords()),this._watchObject(!1,t);const s=this._activeObjects.length>0?this._activeObjects.indexOf(t):-1;s>-1&&this._activeObjects.splice(s,1)}shouldCache(){const t=Q.prototype.shouldCache.call(this);if(t){for(let e=0;e<this._objects.length;e++)if(this._objects[e].willDrawShadow())return this.ownCaching=!1,!1}return t}willDrawShadow(){if(super.willDrawShadow())return!0;for(let t=0;t<this._objects.length;t++)if(this._objects[t].willDrawShadow())return!0;return!1}isOnACache(){return this.ownCaching||!!this.parent&&this.parent.isOnACache()}drawObject(t,e,s){this._renderBackground(t);for(let r=0;r<this._objects.length;r++){var i;const n=this._objects[r];(i=this.canvas)!==null&&i!==void 0&&i.preserveObjectStacking&&n.group!==this?(t.save(),t.transform(..._t(this.calcTransformMatrix())),n.render(t),t.restore()):n.group===this&&n.render(t)}this._drawClipPath(t,this.clipPath,s)}setCoords(){super.setCoords(),this._shouldSetNestedCoords()&&this.forEachObject(t=>t.setCoords())}triggerLayout(){let t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{};this.layoutManager.performLayout({target:this,type:js,...t})}render(t){this._transformDone=!0,super.render(t),this._transformDone=!1}__serializeObjects(t,e){const s=this.includeDefaultValues;return this._objects.filter(function(i){return!i.excludeFromExport}).map(function(i){const r=i.includeDefaultValues;i.includeDefaultValues=s;const n=i[t||"toObject"](e);return i.includeDefaultValues=r,n})}toObject(){let t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:[];const e=this.layoutManager.toObject();return{...super.toObject(["subTargetCheck","interactive",...t]),...e.strategy!=="fit-content"||this.includeDefaultValues?{layoutManager:e}:{},objects:this.__serializeObjects("toObject",t)}}toString(){return`#<Group: (${this.complexity()})>`}dispose(){this.layoutManager.unsubscribeTargets({targets:this.getObjects(),target:this}),this._activeObjects=[],this.forEachObject(t=>{this._watchObject(!1,t),t.dispose()}),super.dispose()}_createSVGBgRect(t){if(!this.backgroundColor)return"";const e=yt.prototype._toSVG.call(this),s=e.indexOf("COMMON_PARTS");e[s]='for="group" ';const i=e.join("");return t?t(i):i}_toSVG(t){const e=["<g ","COMMON_PARTS",` >
|
|
40
|
-
|
|
41
|
-
`),e}getSvgStyles(){const t=this.opacity!==void 0&&this.opacity!==1?`opacity: ${this.opacity};`:"",e=this.visible?"":" visibility: hidden;";return[t,this.getSvgFilter(),e].join("")}toClipPathSVG(t){const e=[],s=this._createSVGBgRect(t);s&&e.push(" ",s);for(let i=0;i<this._objects.length;i++)e.push(" ",this._objects[i].toClipPathSVG(t));return this._createBaseClipPathSVGMarkup(e,{reviver:t})}static fromObject(t,e){let{type:s,objects:i=[],layoutManager:r,...n}=t;return Promise.all([je(i,e),bs(n,e)]).then(a=>{let[l,h]=a;const c=new this(l,{...n,...h,layoutManager:new Dh});if(r){const d=T.getClass(r.type),g=T.getClass(r.strategy);c.layoutManager=new d(new g)}else c.layoutManager=new ze;return c.layoutManager.subscribeTargets({type:Wt,target:c,targets:c.getObjects()}),c.setCoords(),c})}}m(re,"type","Group"),m(re,"ownDefaults",{strokeWidth:0,subTargetCheck:!1,interactive:!1}),T.setClass(re);const Eh=(o,t)=>Math.min(t.width/o.width,t.height/o.height),Mh=(o,t)=>Math.max(t.width/o.width,t.height/o.height),Di="\\s*,?\\s*",Ye=`${Di}(${ie})`,Ah=`${Ye}${Ye}${Ye}${Di}([01])${Di}([01])${Ye}${Ye}`,Ph={m:"l",M:"L"},Fh=(o,t,e,s,i,r,n,a,l,h,c)=>{const d=Lt(o),g=Bt(o),f=Lt(t),p=Bt(t),y=e*i*f-s*r*p+n,v=s*i*f+e*r*p+a;return["C",h+l*(-e*i*g-s*r*d),c+l*(-s*i*g+e*r*d),y+l*(e*i*p+s*r*f),v+l*(s*i*p-e*r*f),y,v]},Ur=(o,t,e,s)=>{const i=Math.atan2(t,o),r=Math.atan2(s,e);return r>=i?r-i:2*Math.PI-(i-r)};function qr(o,t,e,s,i,r,n,a){let l;if(L.cachesBoundsOfCurve&&(l=[...arguments].join(),Me.boundsOfCurveCache[l]))return Me.boundsOfCurveCache[l];const h=Math.sqrt,c=Math.abs,d=[],g=[[0,0],[0,0]];let f=6*o-12*e+6*i,p=-3*o+9*e-9*i+3*n,y=3*e-3*o;for(let C=0;C<2;++C){if(C>0&&(f=6*t-12*s+6*r,p=-3*t+9*s-9*r+3*a,y=3*s-3*t),c(p)<1e-12){if(c(f)<1e-12)continue;const P=-y/f;0<P&&P<1&&d.push(P);continue}const S=f*f-4*y*p;if(S<0)continue;const O=h(S),D=(-f+O)/(2*p);0<D&&D<1&&d.push(D);const k=(-f-O)/(2*p);0<k&&k<1&&d.push(k)}let v=d.length;const x=v,b=Kr(o,t,e,s,i,r,n,a);for(;v--;){const{x:C,y:S}=b(d[v]);g[0][v]=C,g[1][v]=S}g[0][x]=o,g[1][x]=t,g[0][x+1]=n,g[1][x+1]=a;const w=[new _(Math.min(...g[0]),Math.min(...g[1])),new _(Math.max(...g[0]),Math.max(...g[1]))];return L.cachesBoundsOfCurve&&(Me.boundsOfCurveCache[l]=w),w}const jh=(o,t,e)=>{let[s,i,r,n,a,l,h,c]=e;const d=((g,f,p,y,v,x,b)=>{if(p===0||y===0)return[];let w=0,C=0,S=0;const O=Math.PI,D=b*Ks,k=Bt(D),P=Lt(D),$=.5*(-P*g-k*f),N=.5*(-P*f+k*g),j=p**2,B=y**2,F=N**2,q=$**2,W=j*B-j*F-B*q;let H=Math.abs(p),R=Math.abs(y);if(W<0){const Qt=Math.sqrt(1-W/(j*B));H*=Qt,R*=Qt}else S=(v===x?-1:1)*Math.sqrt(W/(j*F+B*q));const gt=S*H*N/R,kt=-S*R*$/H,De=P*gt-k*kt+.5*g,as=k*gt+P*kt+.5*f;let ue=Ur(1,0,($-gt)/H,(N-kt)/R),Pt=Ur(($-gt)/H,(N-kt)/R,(-$-gt)/H,(-N-kt)/R);x===0&&Pt>0?Pt-=2*O:x===1&&Pt<0&&(Pt+=2*O);const M=Math.ceil(Math.abs(Pt/O*2)),E=[],z=Pt/M,Kc=8/3*Math.sin(z/4)*Math.sin(z/4)/Math.sin(z/2);let Vi=ue+z;for(let Qt=0;Qt<M;Qt++)E[Qt]=Fh(ue,Vi,P,k,H,R,De,as,Kc,w,C),w=E[Qt][5],C=E[Qt][6],ue=Vi,Vi+=z;return E})(h-o,c-t,i,r,a,l,n);for(let g=0,f=d.length;g<f;g++)d[g][1]+=o,d[g][2]+=t,d[g][3]+=o,d[g][4]+=t,d[g][5]+=o,d[g][6]+=t;return d},Lh=o=>{let t=0,e=0,s=0,i=0;const r=[];let n,a=0,l=0;for(const h of o){const c=[...h];let d;switch(c[0]){case"l":c[1]+=t,c[2]+=e;case"L":t=c[1],e=c[2],d=["L",t,e];break;case"h":c[1]+=t;case"H":t=c[1],d=["L",t,e];break;case"v":c[1]+=e;case"V":e=c[1],d=["L",t,e];break;case"m":c[1]+=t,c[2]+=e;case"M":t=c[1],e=c[2],s=c[1],i=c[2],d=["M",t,e];break;case"c":c[1]+=t,c[2]+=e,c[3]+=t,c[4]+=e,c[5]+=t,c[6]+=e;case"C":a=c[3],l=c[4],t=c[5],e=c[6],d=["C",c[1],c[2],a,l,t,e];break;case"s":c[1]+=t,c[2]+=e,c[3]+=t,c[4]+=e;case"S":n==="C"?(a=2*t-a,l=2*e-l):(a=t,l=e),t=c[3],e=c[4],d=["C",a,l,c[1],c[2],t,e],a=d[3],l=d[4];break;case"q":c[1]+=t,c[2]+=e,c[3]+=t,c[4]+=e;case"Q":a=c[1],l=c[2],t=c[3],e=c[4],d=["Q",a,l,t,e];break;case"t":c[1]+=t,c[2]+=e;case"T":n==="Q"?(a=2*t-a,l=2*e-l):(a=t,l=e),t=c[1],e=c[2],d=["Q",a,l,t,e];break;case"a":c[6]+=t,c[7]+=e;case"A":jh(t,e,c).forEach(g=>r.push(g)),t=c[6],e=c[7];break;case"z":case"Z":t=s,e=i,d=["Z"]}d?(r.push(d),n=d[0]):n=""}return r},Bs=(o,t,e,s)=>Math.sqrt((e-o)**2+(s-t)**2),Kr=(o,t,e,s,i,r,n,a)=>l=>{const h=l**3,c=(f=>3*f**2*(1-f))(l),d=(f=>3*f*(1-f)**2)(l),g=(f=>(1-f)**3)(l);return new _(n*h+i*c+e*d+o*g,a*h+r*c+s*d+t*g)},Zr=o=>o**2,Jr=o=>2*o*(1-o),Qr=o=>(1-o)**2,Bh=(o,t,e,s,i,r,n,a)=>l=>{const h=Zr(l),c=Jr(l),d=Qr(l),g=3*(d*(e-o)+c*(i-e)+h*(n-i)),f=3*(d*(s-t)+c*(r-s)+h*(a-r));return Math.atan2(f,g)},Rh=(o,t,e,s,i,r)=>n=>{const a=Zr(n),l=Jr(n),h=Qr(n);return new _(i*a+e*l+o*h,r*a+s*l+t*h)},$h=(o,t,e,s,i,r)=>n=>{const a=1-n,l=2*(a*(e-o)+n*(i-e)),h=2*(a*(s-t)+n*(r-s));return Math.atan2(h,l)},tn=(o,t,e)=>{let s=new _(t,e),i=0;for(let r=1;r<=100;r+=1){const n=o(r/100);i+=Bs(s.x,s.y,n.x,n.y),s=n}return i},Vh=(o,t)=>{let e,s=0,i=0,r={x:o.x,y:o.y},n={...r},a=.01,l=0;const h=o.iterator,c=o.angleFinder;for(;i<t&&a>1e-4;)n=h(s),l=s,e=Bs(r.x,r.y,n.x,n.y),e+i>t?(s-=a,a/=2):(r=n,s+=a,i+=e);return{...n,angle:c(l)}},en=o=>{let t,e,s=0,i=0,r=0,n=0,a=0;const l=[];for(const h of o){const c={x:i,y:r,command:h[0],length:0};switch(h[0]){case"M":e=c,e.x=n=i=h[1],e.y=a=r=h[2];break;case"L":e=c,e.length=Bs(i,r,h[1],h[2]),i=h[1],r=h[2];break;case"C":t=Kr(i,r,h[1],h[2],h[3],h[4],h[5],h[6]),e=c,e.iterator=t,e.angleFinder=Bh(i,r,h[1],h[2],h[3],h[4],h[5],h[6]),e.length=tn(t,i,r),i=h[5],r=h[6];break;case"Q":t=Rh(i,r,h[1],h[2],h[3],h[4]),e=c,e.iterator=t,e.angleFinder=$h(i,r,h[1],h[2],h[3],h[4]),e.length=tn(t,i,r),i=h[3],r=h[4];break;case"Z":e=c,e.destX=n,e.destY=a,e.length=Bs(i,r,n,a),i=n,r=a}s+=e.length,l.push(e)}return l.push({length:s,x:i,y:r}),l},Ih=function(o,t){let e=arguments.length>2&&arguments[2]!==void 0?arguments[2]:en(o),s=0;for(;t-e[s].length>0&&s<e.length-2;)t-=e[s].length,s++;const i=e[s],r=t/i.length,n=o[s];switch(i.command){case"M":return{x:i.x,y:i.y,angle:0};case"Z":return{...new _(i.x,i.y).lerp(new _(i.destX,i.destY),r),angle:Math.atan2(i.destY-i.y,i.destX-i.x)};case"L":return{...new _(i.x,i.y).lerp(new _(n[1],n[2]),r),angle:Math.atan2(n[2]-i.y,n[1]-i.x)};case"C":case"Q":return Vh(i,t)}},Nh=new RegExp("[mzlhvcsqta][^mzlhvcsqta]*","gi"),sn=new RegExp(Ah,"g"),Wh=new RegExp(ie,"gi"),Xh={m:2,l:2,h:1,v:1,c:6,s:4,q:4,t:2,a:7},zh=o=>{var t;const e=[],s=(t=o.match(Nh))!==null&&t!==void 0?t:[];for(const i of s){const r=i[0];if(r==="z"||r==="Z"){e.push([r]);continue}const n=Xh[r.toLowerCase()];let a=[];if(r==="a"||r==="A"){sn.lastIndex=0;for(let l=null;l=sn.exec(i);)a.push(...l.slice(1))}else a=i.match(Wh)||[];for(let l=0;l<a.length;l+=n){const h=new Array(n),c=Ph[r];h[0]=l>0&&c?c:r;for(let d=0;d<n;d++)h[d+1]=parseFloat(a[l+d]);e.push(h)}}return e},Yh=function(o){let t=arguments.length>1&&arguments[1]!==void 0?arguments[1]:0,e=new _(o[0]),s=new _(o[1]),i=1,r=0;const n=[],a=o.length,l=a>2;let h;for(l&&(i=o[2].x<s.x?-1:o[2].x===s.x?0:1,r=o[2].y<s.y?-1:o[2].y===s.y?0:1),n.push(["M",e.x-i*t,e.y-r*t]),h=1;h<a;h++){if(!e.eq(s)){const c=e.midPointFrom(s);n.push(["Q",e.x,e.y,c.x,c.y])}e=o[h],h+1<o.length&&(s=o[h+1])}return l&&(i=e.x>o[h-2].x?1:e.x===o[h-2].x?0:-1,r=e.y>o[h-2].y?1:e.y===o[h-2].y?0:-1),n.push(["L",e.x+i*t,e.y+r*t]),n},rn=(o,t)=>o.map(e=>e.map((s,i)=>i===0||t===void 0?s:X(s,t)).join(" ")).join(" ");function Ei(o,t){const e=o.style;e&&Object.entries(t).forEach(s=>{let[i,r]=s;return e.setProperty(i,r)})}class Hh extends lr{constructor(t){let{allowTouchScrolling:e=!1,containerClass:s=""}=arguments.length>1&&arguments[1]!==void 0?arguments[1]:{};super(t),m(this,"upper",void 0),m(this,"container",void 0);const{el:i}=this.lower,r=this.createUpperCanvas();this.upper={el:r,ctx:r.getContext("2d")},this.applyCanvasStyle(i,{allowTouchScrolling:e}),this.applyCanvasStyle(r,{allowTouchScrolling:e,styles:{position:"absolute",left:"0",top:"0"}});const n=this.createContainerElement();n.classList.add(s),i.parentNode&&i.parentNode.replaceChild(n,i),n.append(i,r),this.container=n}createUpperCanvas(){const{el:t}=this.lower,e=Rt();return e.className=t.className,e.classList.remove("lower-canvas"),e.classList.add("upper-canvas"),e.setAttribute("data-fabric","top"),e.style.cssText=t.style.cssText,e.setAttribute("draggable","true"),e}createContainerElement(){const t=de().createElement("div");return t.setAttribute("data-fabric","wrapper"),Ei(t,{position:"relative"}),ar(t),t}applyCanvasStyle(t,e){const{styles:s,allowTouchScrolling:i}=e;Ei(t,{...s,"touch-action":i?"manipulation":ot}),ar(t)}setDimensions(t,e){super.setDimensions(t,e);const{el:s,ctx:i}=this.upper;or(s,i,t,e)}setCSSDimensions(t){super.setCSSDimensions(t),ai(this.upper.el,t),ai(this.container,t)}cleanupDOM(t){const e=this.container,{el:s}=this.lower,{el:i}=this.upper;super.cleanupDOM(t),e.removeChild(i),e.removeChild(s),e.parentNode&&e.parentNode.replaceChild(s,e)}dispose(){super.dispose(),Dt().dispose(this.upper.el),delete this.upper,delete this.container}}const Gh=(o,t,e,s)=>{const{target:i,offsetX:r,offsetY:n}=t,a=e-r,l=s-n,h=!bt(i,"lockMovementX")&&i.left!==a,c=!bt(i,"lockMovementY")&&i.top!==l;return h&&i.set(V,a),c&&i.set(nt,l),(h||c)&&Fr(Yi,vr(o,t,e,s)),h||c};class Rs extends Be{constructor(){super(...arguments),m(this,"_hoveredTargets",[]),m(this,"_currentTransform",null),m(this,"_groupSelector",null),m(this,"contextTopDirty",!1)}static getDefaults(){return{...super.getDefaults(),...Rs.ownDefaults}}get upperCanvasEl(){var t;return(t=this.elements.upper)===null||t===void 0?void 0:t.el}get contextTop(){var t;return(t=this.elements.upper)===null||t===void 0?void 0:t.ctx}get wrapperEl(){return this.elements.container}initElements(t){this.elements=new Hh(t,{allowTouchScrolling:this.allowTouchScrolling,containerClass:this.containerClass}),this._createCacheCanvas()}_onObjectAdded(t){this._objectsToRender=void 0,super._onObjectAdded(t)}_onObjectRemoved(t){this._objectsToRender=void 0,t===this._activeObject&&(this.fire("before:selection:cleared",{deselected:[t]}),this._discardActiveObject(),this.fire("selection:cleared",{deselected:[t]}),t.fire("deselected",{target:t})),t===this._hoveredTarget&&(this._hoveredTarget=void 0,this._hoveredTargets=[]),super._onObjectRemoved(t)}_onStackOrderChanged(){this._objectsToRender=void 0,super._onStackOrderChanged()}_chooseObjectsToRender(){const t=this._activeObject;return!this.preserveObjectStacking&&t?this._objects.filter(e=>!e.group&&e!==t).concat(t):this._objects}renderAll(){this.cancelRequestedRender(),this.destroyed||(!this.contextTopDirty||this._groupSelector||this.isDrawingMode||(this.clearContext(this.contextTop),this.contextTopDirty=!1),this.hasLostContext&&(this.renderTopLayer(this.contextTop),this.hasLostContext=!1),!this._objectsToRender&&(this._objectsToRender=this._chooseObjectsToRender()),this.renderCanvas(this.getContext(),this._objectsToRender))}renderTopLayer(t){t.save(),this.isDrawingMode&&this._isCurrentlyDrawing&&(this.freeDrawingBrush&&this.freeDrawingBrush._render(),this.contextTopDirty=!0),this.selection&&this._groupSelector&&(this._drawSelection(t),this.contextTopDirty=!0),t.restore()}renderTop(){const t=this.contextTop;this.clearContext(t),this.renderTopLayer(t),this.fire("after:render",{ctx:t})}setTargetFindTolerance(t){t=Math.round(t),this.targetFindTolerance=t;const e=this.getRetinaScaling(),s=Math.ceil((2*t+1)*e);this.pixelFindCanvasEl.width=this.pixelFindCanvasEl.height=s,this.pixelFindContext.scale(e,e)}isTargetTransparent(t,e,s){const i=this.targetFindTolerance,r=this.pixelFindContext;this.clearContext(r),r.save(),r.translate(-e+i,-s+i),r.transform(...this.viewportTransform);const n=t.selectionBackgroundColor;t.selectionBackgroundColor="",t.render(r),t.selectionBackgroundColor=n,r.restore();const a=Math.round(i*this.getRetinaScaling());return sh(r,a,a,a)}_isSelectionKeyPressed(t){const e=this.selectionKey;return!!e&&(Array.isArray(e)?!!e.find(s=>!!s&&t[s]===!0):t[e])}_shouldClearSelection(t,e){const s=this.getActiveObjects(),i=this._activeObject;return!!(!e||e&&i&&s.length>1&&s.indexOf(e)===-1&&i!==e&&!this._isSelectionKeyPressed(t)||e&&!e.evented||e&&!e.selectable&&i&&i!==e)}_shouldCenterTransform(t,e,s){if(!t)return;let i;return e===gs||e===at||e===ft||e===Pe?i=this.centeredScaling||t.centeredScaling:e===ti&&(i=this.centeredRotation||t.centeredRotation),i?!s:s}_getOriginFromCorner(t,e){const s={x:t.originX,y:t.originY};return e&&(["ml","tl","bl"].includes(e)?s.x=G:["mr","tr","br"].includes(e)&&(s.x=V),["tl","mt","tr"].includes(e)?s.y=Js:["bl","mb","br"].includes(e)&&(s.y=nt)),s}_setupCurrentTransform(t,e,s){var i;const r=e.group?xe(this.getScenePoint(t),void 0,e.group.calcTransformMatrix()):this.getScenePoint(t),{key:n="",control:a}=e.getActiveControl()||{},l=s&&a?(i=a.getActionHandler(t,e,a))===null||i===void 0?void 0:i.bind(a):Gh,h=((k,P,$,N)=>{if(!P||!k)return"drag";const j=N.controls[P];return j.getActionName($,j,N)})(s,n,t,e),c=t[this.centeredKey],d=this._shouldCenterTransform(e,h,c)?{x:A,y:A}:this._getOriginFromCorner(e,n),{scaleX:g,scaleY:f,skewX:p,skewY:y,left:v,top:x,angle:b,width:w,height:C,cropX:S,cropY:O}=e,D={target:e,action:h,actionHandler:l,actionPerformed:!1,corner:n,scaleX:g,scaleY:f,skewX:p,skewY:y,offsetX:r.x-v,offsetY:r.y-x,originX:d.x,originY:d.y,ex:r.x,ey:r.y,lastX:r.x,lastY:r.y,theta:U(b),width:w,height:C,shiftKey:t.shiftKey,altKey:c,original:{...cr(e),originX:d.x,originY:d.y,cropX:S,cropY:O}};this._currentTransform=D,this.fire("before:transform",{e:t,transform:D})}setCursor(t){this.upperCanvasEl.style.cursor=t}_drawSelection(t){const{x:e,y:s,deltaX:i,deltaY:r}=this._groupSelector,n=new _(e,s).transform(this.viewportTransform),a=new _(e+i,s+r).transform(this.viewportTransform),l=this.selectionLineWidth/2;let h=Math.min(n.x,a.x),c=Math.min(n.y,a.y),d=Math.max(n.x,a.x),g=Math.max(n.y,a.y);this.selectionColor&&(t.fillStyle=this.selectionColor,t.fillRect(h,c,d-h,g-c)),this.selectionLineWidth&&this.selectionBorderColor&&(t.lineWidth=this.selectionLineWidth,t.strokeStyle=this.selectionBorderColor,h+=l,c+=l,d-=l,g-=l,Q.prototype._setLineDash.call(this,t,this.selectionDashArray),t.strokeRect(h,c,d-h,g-c))}findTarget(t){if(this._targetInfo)return this._targetInfo;if(this.skipTargetFind)return{subTargets:[],currentSubTargets:[]};const e=this.getScenePoint(t),s=this._activeObject,i=this.getActiveObjects(),r=this.searchPossibleTargets(this._objects,e),{subTargets:n,container:a,target:l}=r,h={...r,currentSubTargets:n,currentContainer:a,currentTarget:l};if(!s)return h;const c={...this.searchPossibleTargets([s],e),currentSubTargets:n,currentContainer:a,currentTarget:l};return s.findControl(this.getViewportPoint(t),li(t))?{...c,target:s}:c.target&&(i.length>1||!this.preserveObjectStacking||this.preserveObjectStacking&&t[this.altSelectionKey])?c:h}_pointIsInObjectSelectionArea(t,e){let s=t.getCoords();const i=this.getZoom(),r=t.padding/i;if(r){const[n,a,l,h]=s,c=Math.atan2(a.y-n.y,a.x-n.x),d=Lt(c)*r,g=Bt(c)*r,f=d+g,p=d-g;s=[new _(n.x-p,n.y-f),new _(a.x+f,a.y-p),new _(l.x+p,l.y+f),new _(h.x-f,h.y+p)]}return Y.isPointInPolygon(e,s)}_checkTarget(t,e){if(t&&t.visible&&t.evented&&this._pointIsInObjectSelectionArea(t,e)){if(!this.perPixelTargetFind&&!t.perPixelTargetFind||t.isEditing)return!0;{const s=e.transform(this.viewportTransform);if(!this.isTargetTransparent(t,s.x,s.y))return!0}}return!1}_searchPossibleTargets(t,e,s){let i=t.length;for(;i--;){const r=t[i];if(this._checkTarget(r,e)){if(ms(r)&&r.subTargetCheck){const{target:n}=this._searchPossibleTargets(r._objects,e,s);n&&s.push(n)}return{target:r,subTargets:s}}}return{subTargets:[]}}searchPossibleTargets(t,e){const s=this._searchPossibleTargets(t,e,[]);s.container=s.target;const{container:i,subTargets:r}=s;if(i&&ms(i)&&i.interactive&&r[0]){for(let n=r.length-1;n>0;n--){const a=r[n];if(!ms(a)||!a.interactive)return s.target=a,s}return s.target=r[0],s}return s}getViewportPoint(t){return this._viewportPoint?this._viewportPoint:this._getPointerImpl(t,!0)}getScenePoint(t){return this._scenePoint?this._scenePoint:this._getPointerImpl(t)}_getPointerImpl(t){let e=arguments.length>1&&arguments[1]!==void 0&&arguments[1];const s=this.upperCanvasEl,i=s.getBoundingClientRect();let r=vl(t),n=i.width||0,a=i.height||0;n&&a||(nt in i&&Js in i&&(a=Math.abs(i.top-i.bottom)),G in i&&V in i&&(n=Math.abs(i.right-i.left))),this.calcOffset(),r.x=r.x-this._offset.left,r.y=r.y-this._offset.top,e||(r=xe(r,void 0,this.viewportTransform));const l=this.getRetinaScaling();l!==1&&(r.x/=l,r.y/=l);const h=n===0||a===0?new _(1,1):new _(s.width/n,s.height/a);return r.multiply(h)}_setDimensionsImpl(t,e){this._resetTransformEventData(),super._setDimensionsImpl(t,e),this._isCurrentlyDrawing&&this.freeDrawingBrush&&this.freeDrawingBrush._setBrushStyles(this.contextTop)}_createCacheCanvas(){this.pixelFindCanvasEl=Rt(),this.pixelFindContext=this.pixelFindCanvasEl.getContext("2d",{willReadFrequently:!0}),this.setTargetFindTolerance(this.targetFindTolerance)}getTopContext(){return this.elements.upper.ctx}getSelectionContext(){return this.elements.upper.ctx}getSelectionElement(){return this.elements.upper.el}getActiveObject(){return this._activeObject}getActiveObjects(){const t=this._activeObject;return ee(t)?t.getObjects():t?[t]:[]}_fireSelectionEvents(t,e){let s=!1,i=!1;const r=this.getActiveObjects(),n=[],a=[];t.forEach(l=>{r.includes(l)||(s=!0,l.fire("deselected",{e,target:l}),a.push(l))}),r.forEach(l=>{t.includes(l)||(s=!0,l.fire("selected",{e,target:l}),n.push(l))}),t.length>0&&r.length>0?(i=!0,s&&this.fire("selection:updated",{e,selected:n,deselected:a})):r.length>0?(i=!0,this.fire("selection:created",{e,selected:n})):t.length>0&&(i=!0,this.fire("selection:cleared",{e,deselected:a})),i&&(this._objectsToRender=void 0)}setActiveObject(t,e){const s=this.getActiveObjects(),i=this._setActiveObject(t,e);return this._fireSelectionEvents(s,e),i}_setActiveObject(t,e){const s=this._activeObject;return s!==t&&!(!this._discardActiveObject(e,t)&&this._activeObject)&&!t.onSelect({e})&&(this._activeObject=t,ee(t)&&s!==t&&t.set("canvas",this),t.setCoords(),!0)}_discardActiveObject(t,e){const s=this._activeObject;return!!s&&!s.onDeselect({e:t,object:e})&&(this._currentTransform&&this._currentTransform.target===s&&this.endCurrentTransform(t),ee(s)&&s===this._hoveredTarget&&(this._hoveredTarget=void 0),this._activeObject=void 0,!0)}discardActiveObject(t){const e=this.getActiveObjects(),s=this.getActiveObject();e.length&&this.fire("before:selection:cleared",{e:t,deselected:[s]});const i=this._discardActiveObject(t);return this._fireSelectionEvents(e,t),i}endCurrentTransform(t){const e=this._currentTransform;this._finalizeCurrentTransform(t),e&&e.target&&(e.target.isMoving=!1),this._currentTransform=null}_finalizeCurrentTransform(t){const e=this._currentTransform,s=e.target,i={e:t,target:s,transform:e,action:e.action};s._scaling&&(s._scaling=!1),s.setCoords(),e.actionPerformed&&(this.fire("object:modified",i),s.fire(fs,i))}setViewportTransform(t){super.setViewportTransform(t);const e=this._activeObject;e&&e.setCoords()}destroy(){const t=this._activeObject;ee(t)&&(t.removeAll(),t.dispose()),delete this._activeObject,super.destroy(),this.pixelFindContext=null,this.pixelFindCanvasEl=void 0}clear(){this.discardActiveObject(),this._activeObject=void 0,this.clearContext(this.contextTop),super.clear()}drawControls(t){const e=this._activeObject;e&&e._renderControls(t)}_toObject(t,e,s){const i=this._realizeGroupTransformOnObject(t),r=super._toObject(t,e,s);return t.set(i),r}_realizeGroupTransformOnObject(t){const{group:e}=t;if(e&&ee(e)&&this._activeObject===e){const s=_e(t,["angle","flipX","flipY",V,at,ft,fe,pe,nt]);return _l(t,e.calcOwnMatrix()),s}return{}}_setSVGObject(t,e,s){const i=this._realizeGroupTransformOnObject(e);super._setSVGObject(t,e,s),e.set(i)}}m(Rs,"ownDefaults",{uniformScaling:!0,uniScaleKey:"shiftKey",centeredScaling:!1,centeredRotation:!1,centeredKey:"altKey",altActionKey:"shiftKey",selection:!0,selectionKey:"shiftKey",selectionColor:"rgba(100, 100, 255, 0.3)",selectionDashArray:[],selectionBorderColor:"rgba(255, 255, 255, 0.3)",selectionLineWidth:1,selectionFullyContained:!1,hoverCursor:"move",moveCursor:"move",defaultCursor:"default",freeDrawingCursor:"crosshair",notAllowedCursor:"not-allowed",perPixelTargetFind:!1,targetFindTolerance:0,skipTargetFind:!1,stopContextMenu:!0,fireRightClick:!0,fireMiddleClick:!0,enablePointerEvents:!1,containerClass:"canvas-container",preserveObjectStacking:!0});class Uh{constructor(t){m(this,"targets",[]),m(this,"__disposer",void 0);const e=()=>{const{hiddenTextarea:i}=t.getActiveObject()||{};i&&i.focus()},s=t.upperCanvasEl;s.addEventListener("click",e),this.__disposer=()=>s.removeEventListener("click",e)}exitTextEditing(){this.target=void 0,this.targets.forEach(t=>{t.isEditing&&t.exitEditing()})}add(t){this.targets.push(t)}remove(t){this.unregister(t),ye(this.targets,t)}register(t){this.target=t}unregister(t){t===this.target&&(this.target=void 0)}onMouseMove(t){var e;!((e=this.target)===null||e===void 0)&&e.isEditing&&this.target.updateSelectionOnMouseMove(t)}clear(){this.targets=[],this.target=void 0}dispose(){this.clear(),this.__disposer(),delete this.__disposer}}const ut={passive:!1},ne=(o,t)=>({viewportPoint:o.getViewportPoint(t),scenePoint:o.getScenePoint(t)}),Kt=function(o){for(var t=arguments.length,e=new Array(t>1?t-1:0),s=1;s<t;s++)e[s-1]=arguments[s];return o.addEventListener(...e)},vt=function(o){for(var t=arguments.length,e=new Array(t>1?t-1:0),s=1;s<t;s++)e[s-1]=arguments[s];return o.removeEventListener(...e)},qh={mouse:{in:"over",out:"out",targetIn:"mouseover",targetOut:"mouseout",canvasIn:"mouse:over",canvasOut:"mouse:out"},drag:{in:"enter",out:"leave",targetIn:"dragenter",targetOut:"dragleave",canvasIn:"drag:enter",canvasOut:"drag:leave"}};class Mi extends Rs{constructor(t){super(t,arguments.length>1&&arguments[1]!==void 0?arguments[1]:{}),m(this,"_isClick",void 0),m(this,"textEditingManager",new Uh(this)),["_onMouseDown","_onTouchStart","_onMouseMove","_onMouseUp","_onTouchEnd","_onResize","_onMouseWheel","_onMouseOut","_onMouseEnter","_onContextMenu","_onClick","_onDragStart","_onDragEnd","_onDragProgress","_onDragOver","_onDragEnter","_onDragLeave","_onDrop"].forEach(e=>{this[e]=this[e].bind(this)}),this.addOrRemove(Kt)}_getEventPrefix(){return this.enablePointerEvents?"pointer":"mouse"}addOrRemove(t){let e=arguments.length>1&&arguments[1]!==void 0&&arguments[1];const s=this.upperCanvasEl,i=this._getEventPrefix();t(nr(s),"resize",this._onResize),t(s,i+"down",this._onMouseDown),t(s,`${i}move`,this._onMouseMove,ut),t(s,`${i}out`,this._onMouseOut),t(s,`${i}enter`,this._onMouseEnter),t(s,"wheel",this._onMouseWheel,{passive:!1}),t(s,"contextmenu",this._onContextMenu),e||(t(s,"click",this._onClick),t(s,"dblclick",this._onClick)),t(s,"dragstart",this._onDragStart),t(s,"dragend",this._onDragEnd),t(s,"dragover",this._onDragOver),t(s,"dragenter",this._onDragEnter),t(s,"dragleave",this._onDragLeave),t(s,"drop",this._onDrop),this.enablePointerEvents||t(s,"touchstart",this._onTouchStart,ut)}removeListeners(){this.addOrRemove(vt);const t=this._getEventPrefix(),e=xt(this.upperCanvasEl);vt(e,`${t}up`,this._onMouseUp),vt(e,"touchend",this._onTouchEnd,ut),vt(e,`${t}move`,this._onMouseMove,ut),vt(e,"touchmove",this._onMouseMove,ut),clearTimeout(this._willAddMouseDown)}_onMouseWheel(t){this._cacheTransformEventData(t),this._handleEvent(t,"wheel"),this._resetTransformEventData()}_onMouseOut(t){const e=this._hoveredTarget,s={e:t,...ne(this,t)};this.fire("mouse:out",{...s,target:e}),this._hoveredTarget=void 0,e&&e.fire("mouseout",{...s}),this._hoveredTargets.forEach(i=>{this.fire("mouse:out",{...s,target:i}),i&&i.fire("mouseout",{...s})}),this._hoveredTargets=[]}_onMouseEnter(t){const{target:e}=this.findTarget(t);this._currentTransform||e||(this.fire("mouse:over",{e:t,...ne(this,t)}),this._hoveredTarget=void 0,this._hoveredTargets=[])}_onDragStart(t){this._isClick=!1;const e=this.getActiveObject();if(e&&e.onDragStart(t)){this._dragSource=e;const s={e:t,target:e};return this.fire("dragstart",s),e.fire("dragstart",s),void Kt(this.upperCanvasEl,"drag",this._onDragProgress)}hr(t)}_renderDragEffects(t,e,s){let i=!1;const r=this._dropTarget;r&&r!==e&&r!==s&&(r.clearContextTop(),i=!0),e==null||e.clearContextTop(),s!==e&&(s==null||s.clearContextTop());const n=this.contextTop;n.save(),n.transform(...this.viewportTransform),e&&(n.save(),e.transform(n),e.renderDragSourceEffect(t),n.restore(),i=!0),s&&(n.save(),s.transform(n),s.renderDropTargetEffect(t),n.restore(),i=!0),n.restore(),i&&(this.contextTopDirty=!0)}_onDragEnd(t){const{currentSubTargets:e}=this.findTarget(t),s=!!t.dataTransfer&&t.dataTransfer.dropEffect!==ot,i=s?this._activeObject:void 0,r={e:t,target:this._dragSource,subTargets:e,dragSource:this._dragSource,didDrop:s,dropTarget:i};vt(this.upperCanvasEl,"drag",this._onDragProgress),this.fire("dragend",r),this._dragSource&&this._dragSource.fire("dragend",r),delete this._dragSource,this._onMouseUp(t)}_onDragProgress(t){const e={e:t,target:this._dragSource,dragSource:this._dragSource,dropTarget:this._draggedoverTarget};this.fire("drag",e),this._dragSource&&this._dragSource.fire("drag",e)}_onDragOver(t){const e="dragover",{currentContainer:s,currentSubTargets:i}=this.findTarget(t),r=this._dragSource,n={e:t,target:s,subTargets:i,dragSource:r,canDrop:!1,dropTarget:void 0};let a;this.fire(e,n),this._fireEnterLeaveEvents(t,s,n),s&&(s.canDrop(t)&&(a=s),s.fire(e,n));for(let l=0;l<i.length;l++){const h=i[l];h.canDrop(t)&&(a=h),h.fire(e,n)}this._renderDragEffects(t,r,a),this._dropTarget=a}_onDragEnter(t){const{currentContainer:e,currentSubTargets:s}=this.findTarget(t),i={e:t,target:e,subTargets:s,dragSource:this._dragSource};this.fire("dragenter",i),this._fireEnterLeaveEvents(t,e,i)}_onDragLeave(t){const{currentSubTargets:e}=this.findTarget(t),s={e:t,target:this._draggedoverTarget,subTargets:e,dragSource:this._dragSource};this.fire("dragleave",s),this._fireEnterLeaveEvents(t,void 0,s),this._renderDragEffects(t,this._dragSource),this._dropTarget=void 0,this._hoveredTargets=[]}_onDrop(t){const{currentContainer:e,currentSubTargets:s}=this.findTarget(t),i=this._basicEventHandler("drop:before",{e:t,target:e,subTargets:s,dragSource:this._dragSource,...ne(this,t)});i.didDrop=!1,i.dropTarget=void 0,this._basicEventHandler("drop",i),this.fire("drop:after",i)}_onContextMenu(t){const{target:e,subTargets:s}=this.findTarget(t),i=this._basicEventHandler("contextmenu:before",{e:t,target:e,subTargets:s});return this.stopContextMenu&&hr(t),this._basicEventHandler("contextmenu",i),!1}_onClick(t){const e=t.detail;e>3||e<2||(this._cacheTransformEventData(t),e==2&&t.type==="dblclick"&&this._handleEvent(t,"dblclick"),e==3&&this._handleEvent(t,"tripleclick"),this._resetTransformEventData())}fireEventFromPointerEvent(t,e,s){let i=arguments.length>3&&arguments[3]!==void 0?arguments[3]:{};this._cacheTransformEventData(t);const{target:r,subTargets:n}=this.findTarget(t),a={e:t,target:r,subTargets:n,...ne(this,t),transform:this._currentTransform,...i};this.fire(e,a),r&&r.fire(s,a);for(let l=0;l<n.length;l++)n[l]!==r&&n[l].fire(s,a);this._resetTransformEventData()}getPointerId(t){const e=t.changedTouches;return e?e[0]&&e[0].identifier:this.enablePointerEvents?t.pointerId:-1}_isMainEvent(t){return t.isPrimary===!0||t.isPrimary!==!1&&(t.type==="touchend"&&t.touches.length===0||!t.changedTouches||t.changedTouches[0].identifier===this.mainTouchId)}_onTouchStart(t){this._cacheTransformEventData(t);let e=!this.allowTouchScrolling;const s=this._activeObject;this.mainTouchId===void 0&&(this.mainTouchId=this.getPointerId(t)),this.__onMouseDown(t);const{target:i}=this.findTarget(t);(this.isDrawingMode||s&&i===s)&&(e=!0),e&&t.preventDefault();const r=this.upperCanvasEl,n=this._getEventPrefix(),a=xt(r);Kt(a,"touchend",this._onTouchEnd,ut),e&&Kt(a,"touchmove",this._onMouseMove,ut),vt(r,`${n}down`,this._onMouseDown),this._resetTransformEventData()}_onMouseDown(t){this._cacheTransformEventData(t),this.__onMouseDown(t);const e=this.upperCanvasEl,s=this._getEventPrefix();vt(e,`${s}move`,this._onMouseMove,ut);const i=xt(e);Kt(i,`${s}up`,this._onMouseUp),Kt(i,`${s}move`,this._onMouseMove,ut),this._resetTransformEventData()}_onTouchEnd(t){if(t.touches.length>0)return;this._cacheTransformEventData(t),this.__onMouseUp(t),this._resetTransformEventData(),delete this.mainTouchId;const e=this._getEventPrefix(),s=xt(this.upperCanvasEl);vt(s,"touchend",this._onTouchEnd,ut),vt(s,"touchmove",this._onMouseMove,ut),this._willAddMouseDown&&clearTimeout(this._willAddMouseDown),this._willAddMouseDown=setTimeout(()=>{Kt(this.upperCanvasEl,`${e}down`,this._onMouseDown),this._willAddMouseDown=0},400)}_onMouseUp(t){this._cacheTransformEventData(t),this.__onMouseUp(t);const e=this.upperCanvasEl,s=this._getEventPrefix();if(this._isMainEvent(t)){const i=xt(this.upperCanvasEl);vt(i,`${s}up`,this._onMouseUp),vt(i,`${s}move`,this._onMouseMove,ut),Kt(e,`${s}move`,this._onMouseMove,ut)}this._resetTransformEventData()}_onMouseMove(t){this._cacheTransformEventData(t);const e=this.getActiveObject();!this.allowTouchScrolling&&(!e||!e.shouldStartDragging(t))&&t.preventDefault&&t.preventDefault(),this.__onMouseMove(t),this._resetTransformEventData()}_onResize(){this.calcOffset(),this._resetTransformEventData()}_shouldRender(t){const e=this.getActiveObject();return!!e!=!!t||e&&t&&e!==t}__onMouseUp(t){var e;this._handleEvent(t,"up:before");const s=this._currentTransform,i=this._isClick,{target:r}=this.findTarget(t),{button:n}=t;if(n)return void((this.fireMiddleClick&&n===1||this.fireRightClick&&n===2)&&this._handleEvent(t,"up"));if(this.isDrawingMode&&this._isCurrentlyDrawing)return void this._onMouseUpInDrawingMode(t);if(!this._isMainEvent(t))return;let a,l,h=!1;if(s&&(this._finalizeCurrentTransform(t),h=s.actionPerformed),!i){const c=r===this._activeObject;this.handleSelection(t),h||(h=this._shouldRender(r)||!c&&r===this._activeObject)}if(r){const c=r.findControl(this.getViewportPoint(t),li(t)),{key:d,control:g}=c||{};if(l=d,r.selectable&&r!==this._activeObject&&r.activeOn==="up")this.setActiveObject(r,t),h=!0;else if(g){const f=g.getMouseUpHandler(t,r,g);f&&(a=this.getScenePoint(t),f.call(g,t,s,a.x,a.y))}r.isMoving=!1}if(s&&(s.target!==r||s.corner!==l)){const c=s.target&&s.target.controls[s.corner],d=c&&c.getMouseUpHandler(t,s.target,c);a=a||this.getScenePoint(t),d&&d.call(c,t,s,a.x,a.y)}this._setCursorFromEvent(t,r),this._handleEvent(t,"up"),this._groupSelector=null,this._currentTransform=null,r&&(r.__corner=void 0),h?this.requestRenderAll():i||(e=this._activeObject)!==null&&e!==void 0&&e.isEditing||this.renderTop()}_basicEventHandler(t,e){const{target:s,subTargets:i=[]}=e;this.fire(t,e),s&&s.fire(t,e);for(let r=0;r<i.length;r++)i[r]!==s&&i[r].fire(t,e);return e}_handleEvent(t,e,s){const{target:i,subTargets:r}=this.findTarget(t),n={e:t,target:i,subTargets:r,...ne(this,t),transform:this._currentTransform,...e==="down:before"||e==="down"?s:{}};e!=="up:before"&&e!=="up"||(n.isClick=this._isClick),this.fire(`mouse:${e}`,n),i&&i.fire(`mouse${e}`,n);for(let a=0;a<r.length;a++)r[a]!==i&&r[a].fire(`mouse${e}`,n)}_onMouseDownInDrawingMode(t){this._isCurrentlyDrawing=!0,this.getActiveObject()&&(this.discardActiveObject(t),this.requestRenderAll());const e=this.getScenePoint(t);this.freeDrawingBrush&&this.freeDrawingBrush.onMouseDown(e,{e:t,pointer:e}),this._handleEvent(t,"down",{alreadySelected:!1})}_onMouseMoveInDrawingMode(t){if(this._isCurrentlyDrawing){const e=this.getScenePoint(t);this.freeDrawingBrush&&this.freeDrawingBrush.onMouseMove(e,{e:t,pointer:e})}this.setCursor(this.freeDrawingCursor),this._handleEvent(t,"move")}_onMouseUpInDrawingMode(t){const e=this.getScenePoint(t);this.freeDrawingBrush?this._isCurrentlyDrawing=!!this.freeDrawingBrush.onMouseUp({e:t,pointer:e}):this._isCurrentlyDrawing=!1,this._handleEvent(t,"up")}__onMouseDown(t){this._isClick=!0,this._handleEvent(t,"down:before");let{target:e}=this.findTarget(t),s=!!e&&e===this._activeObject;const{button:i}=t;if(i)return void((this.fireMiddleClick&&i===1||this.fireRightClick&&i===2)&&this._handleEvent(t,"down",{alreadySelected:s}));if(this.isDrawingMode)return void this._onMouseDownInDrawingMode(t);if(!this._isMainEvent(t)||this._currentTransform)return;let r=this._shouldRender(e),n=!1;if(this.handleMultiSelection(t,e)?(e=this._activeObject,n=!0,r=!0):this._shouldClearSelection(t,e)&&this.discardActiveObject(t),this.selection&&(!e||!e.selectable&&!e.isEditing&&e!==this._activeObject)){const a=this.getScenePoint(t);this._groupSelector={x:a.x,y:a.y,deltaY:0,deltaX:0}}if(s=!!e&&e===this._activeObject,e){e.selectable&&e.activeOn==="down"&&this.setActiveObject(e,t);const a=e.findControl(this.getViewportPoint(t),li(t));if(e===this._activeObject&&(a||!n)){this._setupCurrentTransform(t,e,s);const l=a?a.control:void 0,h=this.getScenePoint(t),c=l&&l.getMouseDownHandler(t,e,l);c&&c.call(l,t,this._currentTransform,h.x,h.y)}}r&&(this._objectsToRender=void 0),this._handleEvent(t,"down",{alreadySelected:s}),r&&this.requestRenderAll()}_resetTransformEventData(){this._targetInfo=this._viewportPoint=this._scenePoint=void 0}_cacheTransformEventData(t){this._resetTransformEventData(),this._viewportPoint=this.getViewportPoint(t),this._scenePoint=xe(this._viewportPoint,void 0,this.viewportTransform),this._targetInfo=this.findTarget(t),this._currentTransform&&(this._targetInfo.target=this._currentTransform.target)}__onMouseMove(t){if(this._isClick=!1,this._handleEvent(t,"move:before"),this.isDrawingMode)return void this._onMouseMoveInDrawingMode(t);if(!this._isMainEvent(t))return;const e=this._groupSelector;if(e){const s=this.getScenePoint(t);e.deltaX=s.x-e.x,e.deltaY=s.y-e.y,this.renderTop()}else if(this._currentTransform)this._transformObject(t);else{const{target:s}=this.findTarget(t);this._setCursorFromEvent(t,s),this._fireOverOutEvents(t,s)}this.textEditingManager.onMouseMove(t),this._handleEvent(t,"move")}_fireOverOutEvents(t,e){const{_hoveredTarget:s,_hoveredTargets:i}=this,{subTargets:r}=this.findTarget(t),n=Math.max(i.length,r.length);this.fireSyntheticInOutEvents("mouse",{e:t,target:e,oldTarget:s,fireCanvas:!0});for(let a=0;a<n;a++)r[a]===e||i[a]&&i[a]===s||this.fireSyntheticInOutEvents("mouse",{e:t,target:r[a],oldTarget:i[a]});this._hoveredTarget=e,this._hoveredTargets=r}_fireEnterLeaveEvents(t,e,s){const i=this._draggedoverTarget,r=this._hoveredTargets,{subTargets:n}=this.findTarget(t),a=Math.max(r.length,n.length);this.fireSyntheticInOutEvents("drag",{...s,target:e,oldTarget:i,fireCanvas:!0});for(let l=0;l<a;l++)this.fireSyntheticInOutEvents("drag",{...s,target:n[l],oldTarget:r[l]});this._draggedoverTarget=e}fireSyntheticInOutEvents(t,e){let{target:s,oldTarget:i,fireCanvas:r,e:n,...a}=e;const{targetIn:l,targetOut:h,canvasIn:c,canvasOut:d}=qh[t],g=i!==s;if(i&&g){const f={...a,e:n,target:i,nextTarget:s,...ne(this,n)};r&&this.fire(d,f),i.fire(h,f)}if(s&&g){const f={...a,e:n,target:s,previousTarget:i,...ne(this,n)};r&&this.fire(c,f),s.fire(l,f)}}_transformObject(t){const e=this.getScenePoint(t),s=this._currentTransform,i=s.target,r=i.group?xe(e,void 0,i.group.calcTransformMatrix()):e;s.shiftKey=t.shiftKey,s.altKey=!!this.centeredKey&&t[this.centeredKey],this._performTransformAction(t,s,r),s.actionPerformed&&this.requestRenderAll()}_performTransformAction(t,e,s){const{action:i,actionHandler:r,target:n}=e,a=!!r&&r(t,e,s.x,s.y);a&&n.setCoords(),i==="drag"&&a&&(e.target.isMoving=!0,this.setCursor(e.target.moveCursor||this.moveCursor)),e.actionPerformed=e.actionPerformed||a}_setCursorFromEvent(t,e){if(!e)return void this.setCursor(this.defaultCursor);let s=e.hoverCursor||this.hoverCursor;const i=ee(this._activeObject)?this._activeObject:null,r=(!i||e.group!==i)&&e.findControl(this.getViewportPoint(t));if(r){const{control:n,coord:a}=r;this.setCursor(n.cursorStyleHandler(t,n,e,a))}else{if(e.subTargetCheck){const{subTargets:n}=this.findTarget(t);n.concat().reverse().forEach(a=>{s=a.hoverCursor||s})}this.setCursor(s)}}handleMultiSelection(t,e){const s=this._activeObject,i=ee(s);if(s&&this._isSelectionKeyPressed(t)&&this.selection&&e&&e.selectable&&(s!==e||i)&&(i||!e.isDescendantOf(s)&&!s.isDescendantOf(e))&&!e.onSelect({e:t})&&!s.getActiveControl()){if(i){const r=s.getObjects();let n=[];if(e===s){const a=this.getScenePoint(t);let l=this.searchPossibleTargets(r,a);if(l.target?(e=l.target,n=l.subTargets):(l=this.searchPossibleTargets(this._objects,a),e=l.target,n=l.subTargets),!e||!e.selectable)return!1}e.group===s?(s.remove(e),this._hoveredTarget=e,this._hoveredTargets=n,s.size()===1&&this._setActiveObject(s.item(0),t)):(s.multiSelectAdd(e),this._hoveredTarget=s,this._hoveredTargets=n),this._fireSelectionEvents(r,t)}else{s.isEditing&&s.exitEditing();const r=new(T.getClass("ActiveSelection"))([],{canvas:this});r.multiSelectAdd(s,e),this._hoveredTarget=r,this._setActiveObject(r,t),this._fireSelectionEvents([s],t)}return!0}return!1}handleSelection(t){if(!this.selection||!this._groupSelector)return!1;const{x:e,y:s,deltaX:i,deltaY:r}=this._groupSelector,n=new _(e,s),a=n.add(new _(i,r)),l=n.min(a),h=n.max(a).subtract(l),c=this.collectObjects({left:l.x,top:l.y,width:h.x,height:h.y},{includeIntersecting:!this.selectionFullyContained}),d=n.eq(a)?c[0]?[c[0]]:[]:c.length>1?c.filter(g=>!g.onSelect({e:t})).reverse():c;if(d.length===1)this.setActiveObject(d[0],t);else if(d.length>1){const g=T.getClass("ActiveSelection");this.setActiveObject(new g(d,{canvas:this}),t)}return this._groupSelector=null,!0}toCanvasElement(){let t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:1,e=arguments.length>1?arguments[1]:void 0;const{upper:s}=this.elements;s.ctx=void 0;const i=super.toCanvasElement(t,e);return s.ctx=s.el.getContext("2d"),i}clear(){this.textEditingManager.clear(),super.clear()}destroy(){this.removeListeners(),this.textEditingManager.dispose(),super.destroy()}}const nn={x1:0,y1:0,x2:0,y2:0},Kh={...nn,r1:0,r2:0},Oe=(o,t)=>isNaN(o)&&typeof t=="number"?t:o;function on(o){return o&&/%$/.test(o)&&Number.isFinite(parseFloat(o))}function an(o,t){const e=typeof o=="number"?o:typeof o=="string"?parseFloat(o)/(on(o)?100:1):NaN;return Ce(0,Oe(e,t),1)}const Zh=/\s*;\s*/,Jh=/\s*:\s*/;function Qh(o,t){let e,s;const i=o.getAttribute("style");if(i){const n=i.split(Zh);n[n.length-1]===""&&n.pop();for(let a=n.length;a--;){const[l,h]=n[a].split(Jh).map(c=>c.trim());l==="stop-color"?e=h:l==="stop-opacity"&&(s=h)}}e=e||o.getAttribute("stop-color")||"rgb(0,0,0)",s=Oe(parseFloat(s||o.getAttribute("stop-opacity")||""),1);const r=new I(e);return r.setAlpha(r.getAlpha()*s*t),{offset:an(o.getAttribute("offset"),0),color:r.toRgba()}}function tc(o,t){const e=[],s=o.getElementsByTagName("stop"),i=an(t,1);for(let r=s.length;r--;)e.push(Qh(s[r],i));return e}function ln(o){return o.nodeName==="linearGradient"||o.nodeName==="LINEARGRADIENT"?"linear":"radial"}function hn(o){return o.getAttribute("gradientUnits")==="userSpaceOnUse"?"pixels":"percentage"}function wt(o,t){return o.getAttribute(t)}function ec(o,t){return function(e,s){let i,{width:r,height:n,gradientUnits:a}=s;return Object.entries(e).reduce((l,h)=>{let[c,d]=h;if(d==="Infinity")i=1;else if(d==="-Infinity")i=0;else{const g=typeof d=="string";i=g?parseFloat(d):d,g&&on(d)&&(i*=.01,a==="pixels"&&(c!=="x1"&&c!=="x2"&&c!=="r2"||(i*=r),c!=="y1"&&c!=="y2"||(i*=n)))}return l[c]=i,l},{})}(ln(o)==="linear"?function(e){return{x1:wt(e,"x1")||0,y1:wt(e,"y1")||0,x2:wt(e,"x2")||"100%",y2:wt(e,"y2")||0}}(o):function(e){return{x1:wt(e,"fx")||wt(e,"cx")||"50%",y1:wt(e,"fy")||wt(e,"cy")||"50%",r1:0,x2:wt(e,"cx")||"50%",y2:wt(e,"cy")||"50%",r2:wt(e,"r")||"50%"}}(o),{...t,gradientUnits:hn(o)})}class $s{constructor(t){const{type:e="linear",gradientUnits:s="pixels",coords:i={},colorStops:r=[],offsetX:n=0,offsetY:a=0,gradientTransform:l,id:h}=t||{};Object.assign(this,{type:e,gradientUnits:s,coords:{...e==="radial"?Kh:nn,...i},colorStops:r,offsetX:n,offsetY:a,gradientTransform:l,id:h?`${h}_${Gt()}`:Gt()})}addColorStop(t){for(const e in t)this.colorStops.push({offset:parseFloat(e),color:t[e]});return this}toObject(t){return{..._e(this,t),type:this.type,coords:{...this.coords},colorStops:this.colorStops.map(e=>({...e})),offsetX:this.offsetX,offsetY:this.offsetY,gradientUnits:this.gradientUnits,gradientTransform:this.gradientTransform?[...this.gradientTransform]:void 0}}toSVG(t){let{additionalTransform:e}=arguments.length>1&&arguments[1]!==void 0?arguments[1]:{};const s=[],i=this.gradientTransform?this.gradientTransform.concat():et.concat(),r=this.gradientUnits==="pixels"?"userSpaceOnUse":"objectBoundingBox",n=this.colorStops.map(d=>({...d})).sort((d,g)=>d.offset-g.offset);let a=-this.offsetX,l=-this.offsetY;var h;r==="objectBoundingBox"?(a/=t.width,l/=t.height):(a+=t.width/2,l+=t.height/2),(h=t)&&typeof h._renderPathCommands=="function"&&this.gradientUnits!=="percentage"&&(a-=t.pathOffset.x,l-=t.pathOffset.y),i[4]-=a,i[5]-=l;const c=[`id="SVGID_${this.id}"`,`gradientUnits="${r}"`,`gradientTransform="${e?e+" ":""}${Le(i)}"`,""].join(" ");if(this.type==="linear"){const{x1:d,y1:g,x2:f,y2:p}=this.coords;s.push("<linearGradient ",c,' x1="',d,'" y1="',g,'" x2="',f,'" y2="',p,`">
|
|
42
|
-
`)}else if(this.type==="radial"){const{x1:d,y1:g,x2:f,y2:p,r1:y,r2:v}=this.coords,x=y>v;s.push("<radialGradient ",c,' cx="',x?d:f,'" cy="',x?g:p,'" r="',x?y:v,'" fx="',x?f:d,'" fy="',x?p:g,`">
|
|
43
|
-
`),x&&(n.reverse(),n.forEach(w=>{w.offset=1-w.offset}));const b=Math.min(y,v);if(b>0){const w=b/Math.max(y,v);n.forEach(C=>{C.offset+=w*(1-C.offset)})}}return n.forEach(d=>{let{color:g,offset:f}=d;s.push(`<stop offset="${100*f}%" style="stop-color:${g};"/>
|
|
44
|
-
`)}),s.push(this.type==="linear"?"</linearGradient>":"</radialGradient>",`
|
|
45
|
-
`),s.join("")}toLive(t){const{x1:e,y1:s,x2:i,y2:r,r1:n,r2:a}=this.coords,l=this.type==="linear"?t.createLinearGradient(e,s,i,r):t.createRadialGradient(e,s,n,i,r,a);return this.colorStops.forEach(h=>{let{color:c,offset:d}=h;l.addColorStop(d,c)}),l}static async fromObject(t){const{colorStops:e,gradientTransform:s}=t;return new this({...t,colorStops:e?e.map(i=>({...i})):void 0,gradientTransform:s?[...s]:void 0})}static fromElement(t,e,s){const i=hn(t),r=e._findCenterFromElement();return new this({id:t.getAttribute("id")||void 0,type:ln(t),coords:ec(t,{width:s.viewBoxWidth||s.width,height:s.viewBoxHeight||s.height}),colorStops:tc(t,s.opacity),gradientUnits:i,gradientTransform:Ti(t.getAttribute("gradientTransform")||""),...i==="pixels"?{offsetX:e.width/2-r.x,offsetY:e.height/2-r.y}:{offsetX:0,offsetY:0}})}}m($s,"type","Gradient"),T.setClass($s,"gradient"),T.setClass($s,"linear"),T.setClass($s,"radial");class Ai{get type(){return"pattern"}set type(t){Yt("warn","Setting type has no effect",t)}constructor(t){m(this,"repeat","repeat"),m(this,"offsetX",0),m(this,"offsetY",0),m(this,"crossOrigin",""),this.id=Gt(),Object.assign(this,t)}isImageSource(){return!!this.source&&typeof this.source.src=="string"}isCanvasSource(){return!!this.source&&!!this.source.toDataURL}sourceToString(){return this.isImageSource()?this.source.src:this.isCanvasSource()?this.source.toDataURL():""}toLive(t){return this.source&&(!this.isImageSource()||this.source.complete&&this.source.naturalWidth!==0&&this.source.naturalHeight!==0)?t.createPattern(this.source,this.repeat):null}toObject(){let t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:[];const{repeat:e,crossOrigin:s}=this;return{..._e(this,t),type:"pattern",source:this.sourceToString(),repeat:e,crossOrigin:s,offsetX:X(this.offsetX,L.NUM_FRACTION_DIGITS),offsetY:X(this.offsetY,L.NUM_FRACTION_DIGITS),patternTransform:this.patternTransform?[...this.patternTransform]:null}}toSVG(t){let{width:e,height:s}=t;const{source:i,repeat:r,id:n}=this,a=Oe(this.offsetX/e,0),l=Oe(this.offsetY/s,0);return[`<pattern id="SVGID_${n}" x="${a}" y="${l}" width="${r==="repeat-y"||r==="no-repeat"?1+Math.abs(a||0):Oe(i.width/e,0)}" height="${r==="repeat-x"||r==="no-repeat"?1+Math.abs(l||0):Oe(i.height/s,0)}">`,`<image x="0" y="0" width="${i.width}" height="${i.height}" xlink:href="${this.sourceToString()}"></image>`,"</pattern>",""].join(`
|
|
46
|
-
`)}static async fromObject(t,e){let{type:s,source:i,patternTransform:r,...n}=t;const a=await xs(i,{...e,crossOrigin:n.crossOrigin});return new this({...n,patternTransform:r&&r.slice(0),source:a})}}m(Ai,"type","Pattern"),T.setClass(Ai),T.setClass(Ai,"pattern");class sc{constructor(t){m(this,"color","rgb(0, 0, 0)"),m(this,"width",1),m(this,"shadow",null),m(this,"strokeLineCap","round"),m(this,"strokeLineJoin","round"),m(this,"strokeMiterLimit",10),m(this,"strokeDashArray",null),m(this,"limitedToCanvasSize",!1),this.canvas=t}_setBrushStyles(t){t.strokeStyle=this.color,t.lineWidth=this.width,t.lineCap=this.strokeLineCap,t.miterLimit=this.strokeMiterLimit,t.lineJoin=this.strokeLineJoin,t.setLineDash(this.strokeDashArray||[])}_saveAndTransform(t){const e=this.canvas.viewportTransform;t.save(),t.transform(e[0],e[1],e[2],e[3],e[4],e[5])}needsFullRender(){return new I(this.color).getAlpha()<1||!!this.shadow}_setShadow(){if(!this.shadow||!this.canvas)return;const t=this.canvas,e=this.shadow,s=t.contextTop,i=t.getZoom()*t.getRetinaScaling();s.shadowColor=e.color,s.shadowBlur=e.blur*i,s.shadowOffsetX=e.offsetX*i,s.shadowOffsetY=e.offsetY*i}_resetShadow(){const t=this.canvas.contextTop;t.shadowColor="",t.shadowBlur=t.shadowOffsetX=t.shadowOffsetY=0}_isOutSideCanvas(t){return t.x<0||t.x>this.canvas.getWidth()||t.y<0||t.y>this.canvas.getHeight()}}class Xt extends Q{constructor(t){let{path:e,left:s,top:i,...r}=arguments.length>1&&arguments[1]!==void 0?arguments[1]:{};super(),Object.assign(this,Xt.ownDefaults),this.setOptions(r),this._setPath(t||[],!0),typeof s=="number"&&this.set(V,s),typeof i=="number"&&this.set(nt,i)}_setPath(t,e){this.path=Lh(Array.isArray(t)?t:zh(t)),this.setBoundingBox(e)}_findCenterFromElement(){const t=this._calcBoundsFromPath();return new _(t.left+t.width/2,t.top+t.height/2)}_renderPathCommands(t){const e=-this.pathOffset.x,s=-this.pathOffset.y;t.beginPath();for(const i of this.path)switch(i[0]){case"L":t.lineTo(i[1]+e,i[2]+s);break;case"M":t.moveTo(i[1]+e,i[2]+s);break;case"C":t.bezierCurveTo(i[1]+e,i[2]+s,i[3]+e,i[4]+s,i[5]+e,i[6]+s);break;case"Q":t.quadraticCurveTo(i[1]+e,i[2]+s,i[3]+e,i[4]+s);break;case"Z":t.closePath()}}_render(t){this._renderPathCommands(t),this._renderPaintInOrder(t)}toString(){return`#<Path (${this.complexity()}): { "top": ${this.top}, "left": ${this.left} }>`}toObject(){let t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:[];return{...super.toObject(t),path:this.path.map(e=>e.slice())}}toDatalessObject(){let t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:[];const e=this.toObject(t);return this.sourcePath&&(delete e.path,e.sourcePath=this.sourcePath),e}_toSVG(){return["<path ","COMMON_PARTS",`d="${rn(this.path,L.NUM_FRACTION_DIGITS)}" stroke-linecap="round" />
|
|
47
|
-
`]}_getOffsetTransform(){const t=L.NUM_FRACTION_DIGITS;return` translate(${X(-this.pathOffset.x,t)}, ${X(-this.pathOffset.y,t)})`}toClipPathSVG(t){const e=this._getOffsetTransform();return" "+this._createBaseClipPathSVGMarkup(this._toSVG(),{reviver:t,additionalTransform:e})}toSVG(t){const e=this._getOffsetTransform();return this._createBaseSVGMarkup(this._toSVG(),{reviver:t,additionalTransform:e})}complexity(){return this.path.length}setDimensions(){this.setBoundingBox()}setBoundingBox(t){const{width:e,height:s,pathOffset:i}=this._calcDimensions();this.set({width:e,height:s,pathOffset:i}),t&&this.setPositionByOrigin(i,A,A)}_calcBoundsFromPath(){const t=[];let e=0,s=0,i=0,r=0;for(const n of this.path)switch(n[0]){case"L":i=n[1],r=n[2],t.push({x:e,y:s},{x:i,y:r});break;case"M":i=n[1],r=n[2],e=i,s=r;break;case"C":t.push(...qr(i,r,n[1],n[2],n[3],n[4],n[5],n[6])),i=n[5],r=n[6];break;case"Q":t.push(...qr(i,r,n[1],n[2],n[1],n[2],n[3],n[4])),i=n[3],r=n[4];break;case"Z":i=e,r=s}return $t(t)}_calcDimensions(){const t=this._calcBoundsFromPath();return{...t,pathOffset:new _(t.left+t.width/2,t.top+t.height/2)}}static fromObject(t){return this._fromObject(t,{extraParam:"path"})}static async fromElement(t,e,s){const{d:i,...r}=Nt(t,this.ATTRIBUTE_NAMES,s);return new this(i,{...r,...e,left:void 0,top:void 0})}}m(Xt,"type","Path"),m(Xt,"cacheProperties",[...Vt,"path","fillRule"]),m(Xt,"ATTRIBUTE_NAMES",[...qt,"d"]),T.setClass(Xt),T.setSVGClass(Xt);class Vs extends sc{constructor(t){super(t),m(this,"decimate",.4),m(this,"drawStraightLine",!1),m(this,"straightLineKey","shiftKey"),this._points=[],this._hasStraightLine=!1}needsFullRender(){return super.needsFullRender()||this._hasStraightLine}static drawSegment(t,e,s){const i=e.midPointFrom(s);return t.quadraticCurveTo(e.x,e.y,i.x,i.y),i}onMouseDown(t,e){let{e:s}=e;this.canvas._isMainEvent(s)&&(this.drawStraightLine=!!this.straightLineKey&&s[this.straightLineKey],this._prepareForDrawing(t),this._addPoint(t),this._render())}onMouseMove(t,e){let{e:s}=e;if(this.canvas._isMainEvent(s)&&(this.drawStraightLine=!!this.straightLineKey&&s[this.straightLineKey],(this.limitedToCanvasSize!==!0||!this._isOutSideCanvas(t))&&this._addPoint(t)&&this._points.length>1))if(this.needsFullRender())this.canvas.clearContext(this.canvas.contextTop),this._render();else{const i=this._points,r=i.length,n=this.canvas.contextTop;this._saveAndTransform(n),this.oldEnd&&(n.beginPath(),n.moveTo(this.oldEnd.x,this.oldEnd.y)),this.oldEnd=Vs.drawSegment(n,i[r-2],i[r-1]),n.stroke(),n.restore()}}onMouseUp(t){let{e}=t;return!this.canvas._isMainEvent(e)||(this.drawStraightLine=!1,this.oldEnd=void 0,this._finalizeAndAddPath(),!1)}_prepareForDrawing(t){this._reset(),this._addPoint(t),this.canvas.contextTop.moveTo(t.x,t.y)}_addPoint(t){return!(this._points.length>1&&t.eq(this._points[this._points.length-1]))&&(this.drawStraightLine&&this._points.length>1&&(this._hasStraightLine=!0,this._points.pop()),this._points.push(t),!0)}_reset(){this._points=[],this._setBrushStyles(this.canvas.contextTop),this._setShadow(),this._hasStraightLine=!1}_render(){let t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:this.canvas.contextTop,e=this._points[0],s=this._points[1];if(this._saveAndTransform(t),t.beginPath(),this._points.length===2&&e.x===s.x&&e.y===s.y){const i=this.width/1e3;e.x-=i,s.x+=i}t.moveTo(e.x,e.y);for(let i=1;i<this._points.length;i++)Vs.drawSegment(t,e,s),e=this._points[i],s=this._points[i+1];t.lineTo(e.x,e.y),t.stroke(),t.restore()}convertPointsToSVGPath(t){const e=this.width/1e3;return Yh(t,e)}createPath(t){const e=new Xt(t,{fill:null,stroke:this.color,strokeWidth:this.width,strokeLineCap:this.strokeLineCap,strokeMiterLimit:this.strokeMiterLimit,strokeLineJoin:this.strokeLineJoin,strokeDashArray:this.strokeDashArray});return this.shadow&&(this.shadow.affectStroke=!0,e.shadow=new Mt(this.shadow)),e}decimatePoints(t,e){if(t.length<=2)return t;let s,i=t[0];const r=this.canvas.getZoom(),n=Math.pow(e/r,2),a=t.length-1,l=[i];for(let h=1;h<a-1;h++)s=Math.pow(i.x-t[h].x,2)+Math.pow(i.y-t[h].y,2),s>=n&&(i=t[h],l.push(i));return l.push(t[a]),l}_finalizeAndAddPath(){this.canvas.contextTop.closePath(),this.decimate&&(this._points=this.decimatePoints(this._points,this.decimate));const t=this.convertPointsToSVGPath(this._points);if(function(s){return rn(s)==="M 0 0 Q 0 0 0 0 L 0 0"}(t))return void this.canvas.requestRenderAll();const e=this.createPath(t);this.canvas.clearContext(this.canvas.contextTop),this.canvas.fire("before:path:created",{path:e}),this.canvas.add(e),this.canvas.requestRenderAll(),e.setCoords(),this._resetShadow(),this.canvas.fire("path:created",{path:e})}}const cn=["radius","startAngle","endAngle","counterClockwise"];class At extends Q{static getDefaults(){return{...super.getDefaults(),...At.ownDefaults}}constructor(t){super(),Object.assign(this,At.ownDefaults),this.setOptions(t)}_set(t,e){return super._set(t,e),t==="radius"&&this.setRadius(e),this}_render(t){t.beginPath(),t.arc(0,0,this.radius,U(this.startAngle),U(this.endAngle),this.counterClockwise),this._renderPaintInOrder(t)}getRadiusX(){return this.get("radius")*this.get(at)}getRadiusY(){return this.get("radius")*this.get(ft)}setRadius(t){this.radius=t,this.set({width:2*t,height:2*t})}toObject(){let t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:[];return super.toObject([...cn,...t])}_toSVG(){const t=(this.endAngle-this.startAngle)%360;if(t===0)return["<circle ","COMMON_PARTS",'cx="0" cy="0" ','r="',`${this.radius}`,`" />
|
|
48
|
-
`];{const{radius:e}=this,s=U(this.startAngle),i=U(this.endAngle),r=Lt(s)*e,n=Bt(s)*e,a=Lt(i)*e,l=Bt(i)*e;return[`<path d="M ${r} ${n} A ${e} ${e} 0 ${t>180?1:0} ${this.counterClockwise?0:1} ${a} ${l}" `,"COMMON_PARTS",` />
|
|
49
|
-
`]}}static async fromElement(t,e,s){const{left:i=0,top:r=0,radius:n=0,...a}=Nt(t,this.ATTRIBUTE_NAMES,s);return new this({...a,radius:n,left:i-n,top:r-n})}static fromObject(t){return super._fromObject(t)}}m(At,"type","Circle"),m(At,"cacheProperties",[...Vt,...cn]),m(At,"ownDefaults",{radius:0,startAngle:0,endAngle:360,counterClockwise:!1}),m(At,"ATTRIBUTE_NAMES",["cx","cy","r",...qt]),T.setClass(At),T.setSVGClass(At);const Pi=["x1","x2","y1","y2"];class Zt extends Q{constructor(){let[t,e,s,i]=arguments.length>0&&arguments[0]!==void 0?arguments[0]:[0,0,0,0],r=arguments.length>1&&arguments[1]!==void 0?arguments[1]:{};super(),Object.assign(this,Zt.ownDefaults),this.setOptions(r),this.x1=t,this.x2=s,this.y1=e,this.y2=i,this._setWidthHeight();const{left:n,top:a}=r;typeof n=="number"&&this.set(V,n),typeof a=="number"&&this.set(nt,a)}_setWidthHeight(){const{x1:t,y1:e,x2:s,y2:i}=this;this.width=Math.abs(s-t),this.height=Math.abs(i-e);const{left:r,top:n,width:a,height:l}=$t([{x:t,y:e},{x:s,y:i}]),h=new _(r+a/2,n+l/2);this.setPositionByOrigin(h,A,A)}_set(t,e){return super._set(t,e),Pi.includes(t)&&this._setWidthHeight(),this}_render(t){t.beginPath();const e=this.calcLinePoints();t.moveTo(e.x1,e.y1),t.lineTo(e.x2,e.y2),t.lineWidth=this.strokeWidth;const s=t.strokeStyle;var i;mt(this.stroke)?t.strokeStyle=this.stroke.toLive(t):t.strokeStyle=(i=this.stroke)!==null&&i!==void 0?i:t.fillStyle,this.stroke&&this._renderStroke(t),t.strokeStyle=s}_findCenterFromElement(){return new _((this.x1+this.x2)/2,(this.y1+this.y2)/2)}toObject(){let t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:[];return{...super.toObject(t),...this.calcLinePoints()}}_getNonTransformedDimensions(){const t=super._getNonTransformedDimensions();return this.strokeLineCap==="butt"&&(this.width===0&&(t.y-=this.strokeWidth),this.height===0&&(t.x-=this.strokeWidth)),t}calcLinePoints(){const{x1:t,x2:e,y1:s,y2:i,width:r,height:n}=this,a=t<=e?-1:1,l=s<=i?-1:1;return{x1:a*r/2,x2:a*-r/2,y1:l*n/2,y2:l*-n/2}}_toSVG(){const{x1:t,x2:e,y1:s,y2:i}=this.calcLinePoints();return["<line ","COMMON_PARTS",`x1="${t}" y1="${s}" x2="${e}" y2="${i}" />
|
|
50
|
-
`]}static async fromElement(t,e,s){const{x1:i=0,y1:r=0,x2:n=0,y2:a=0,...l}=Nt(t,this.ATTRIBUTE_NAMES,s);return new this([i,r,n,a],l)}static fromObject(t){let{x1:e,y1:s,x2:i,y2:r,...n}=t;return this._fromObject({...n,points:[e,s,i,r]},{extraParam:"points"})}}m(Zt,"type","Line"),m(Zt,"cacheProperties",[...Vt,...Pi]),m(Zt,"ATTRIBUTE_NAMES",qt.concat(Pi)),T.setClass(Zt),T.setSVGClass(Zt);class oe extends Q{static getDefaults(){return{...super.getDefaults(),...oe.ownDefaults}}constructor(t){super(),Object.assign(this,oe.ownDefaults),this.setOptions(t)}_render(t){const e=this.width/2,s=this.height/2;t.beginPath(),t.moveTo(-e,s),t.lineTo(0,-s),t.lineTo(e,s),t.closePath(),this._renderPaintInOrder(t)}_toSVG(){const t=this.width/2,e=this.height/2;return["<polygon ","COMMON_PARTS",'points="',`${-t} ${e},0 ${-e},${t} ${e}`,'" />']}}m(oe,"type","Triangle"),m(oe,"ownDefaults",{width:100,height:100}),T.setClass(oe),T.setSVGClass(oe);const un=["rx","ry"];class zt extends Q{static getDefaults(){return{...super.getDefaults(),...zt.ownDefaults}}constructor(t){super(),Object.assign(this,zt.ownDefaults),this.setOptions(t)}_set(t,e){switch(super._set(t,e),t){case"rx":this.rx=e,this.set("width",2*e);break;case"ry":this.ry=e,this.set("height",2*e)}return this}getRx(){return this.get("rx")*this.get(at)}getRy(){return this.get("ry")*this.get(ft)}toObject(){let t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:[];return super.toObject([...un,...t])}_toSVG(){return["<ellipse ","COMMON_PARTS",`cx="0" cy="0" rx="${this.rx}" ry="${this.ry}" />
|
|
51
|
-
`]}_render(t){t.beginPath(),t.save(),t.transform(1,0,0,this.ry/this.rx,0,0),t.arc(0,0,this.rx,0,ge,!1),t.restore(),this._renderPaintInOrder(t)}static async fromElement(t,e,s){const i=Nt(t,this.ATTRIBUTE_NAMES,s);return i.left=(i.left||0)-i.rx,i.top=(i.top||0)-i.ry,new this(i)}}m(zt,"type","Ellipse"),m(zt,"cacheProperties",[...Vt,...un]),m(zt,"ownDefaults",{rx:0,ry:0}),m(zt,"ATTRIBUTE_NAMES",[...qt,"cx","cy","rx","ry"]),T.setClass(zt),T.setSVGClass(zt);const dn={exactBoundingBox:!1};class St extends Q{static getDefaults(){return{...super.getDefaults(),...St.ownDefaults}}constructor(){let t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:[],e=arguments.length>1&&arguments[1]!==void 0?arguments[1]:{};super(),m(this,"strokeDiff",void 0),Object.assign(this,St.ownDefaults),this.setOptions(e),this.points=t;const{left:s,top:i}=e;this.initialized=!0,this.setBoundingBox(!0),typeof s=="number"&&this.set(V,s),typeof i=="number"&&this.set(nt,i)}isOpen(){return!0}_projectStrokeOnPoints(t){return rh(this.points,t,this.isOpen())}_calcDimensions(t){t={scaleX:this.scaleX,scaleY:this.scaleY,skewX:this.skewX,skewY:this.skewY,strokeLineCap:this.strokeLineCap,strokeLineJoin:this.strokeLineJoin,strokeMiterLimit:this.strokeMiterLimit,strokeUniform:this.strokeUniform,strokeWidth:this.strokeWidth,...t||{}};const e=this.exactBoundingBox?this._projectStrokeOnPoints(t).map(h=>h.projectedPoint):this.points;if(e.length===0)return{left:0,top:0,width:0,height:0,pathOffset:new _,strokeOffset:new _,strokeDiff:new _};const s=$t(e),i=_s({...t,scaleX:1,scaleY:1}),r=$t(this.points.map(h=>lt(h,i,!0))),n=new _(this.scaleX,this.scaleY);let a=s.left+s.width/2,l=s.top+s.height/2;return this.exactBoundingBox&&(a-=l*Math.tan(U(this.skewX)),l-=a*Math.tan(U(this.skewY))),{...s,pathOffset:new _(a,l),strokeOffset:new _(r.left,r.top).subtract(new _(s.left,s.top)).multiply(n),strokeDiff:new _(s.width,s.height).subtract(new _(r.width,r.height)).multiply(n)}}_findCenterFromElement(){const t=$t(this.points);return new _(t.left+t.width/2,t.top+t.height/2)}setDimensions(){this.setBoundingBox()}setBoundingBox(t){const{left:e,top:s,width:i,height:r,pathOffset:n,strokeOffset:a,strokeDiff:l}=this._calcDimensions();this.set({width:i,height:r,pathOffset:n,strokeOffset:a,strokeDiff:l}),t&&this.setPositionByOrigin(new _(e+i/2,s+r/2),A,A)}isStrokeAccountedForInDimensions(){return this.exactBoundingBox}_getNonTransformedDimensions(){return this.exactBoundingBox?new _(this.width,this.height):super._getNonTransformedDimensions()}_getTransformedDimensions(){let t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{};if(this.exactBoundingBox){let n;if(Object.keys(t).some(a=>this.strokeUniform||this.constructor.layoutProperties.includes(a))){var e,s;const{width:a,height:l}=this._calcDimensions(t);n=new _((e=t.width)!==null&&e!==void 0?e:a,(s=t.height)!==null&&s!==void 0?s:l)}else{var i,r;n=new _((i=t.width)!==null&&i!==void 0?i:this.width,(r=t.height)!==null&&r!==void 0?r:this.height)}return n.multiply(new _(t.scaleX||this.scaleX,t.scaleY||this.scaleY))}return super._getTransformedDimensions(t)}_set(t,e){const s=this.initialized&&this[t]!==e,i=super._set(t,e);return this.exactBoundingBox&&s&&((t===at||t===ft)&&this.strokeUniform&&this.constructor.layoutProperties.includes("strokeUniform")||this.constructor.layoutProperties.includes(t))&&this.setDimensions(),i}toObject(){let t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:[];return{...super.toObject(t),points:this.points.map(e=>{let{x:s,y:i}=e;return{x:s,y:i}})}}_toSVG(){const t=[],e=this.pathOffset.x,s=this.pathOffset.y,i=L.NUM_FRACTION_DIGITS;for(let r=0,n=this.points.length;r<n;r++)t.push(X(this.points[r].x-e,i),",",X(this.points[r].y-s,i)," ");return[`<${this.constructor.type.toLowerCase()} `,"COMMON_PARTS",`points="${t.join("")}" />
|
|
52
|
-
`]}_render(t){const e=this.points.length,s=this.pathOffset.x,i=this.pathOffset.y;if(e&&!isNaN(this.points[e-1].y)){t.beginPath(),t.moveTo(this.points[0].x-s,this.points[0].y-i);for(let r=0;r<e;r++){const n=this.points[r];t.lineTo(n.x-s,n.y-i)}!this.isOpen()&&t.closePath(),this._renderPaintInOrder(t)}}complexity(){return this.points.length}static async fromElement(t,e,s){const i=function(l){if(!l)return[];const h=l.replace(/,/g," ").trim().split(/\s+/),c=[];for(let d=0;d<h.length;d+=2)c.push({x:parseFloat(h[d]),y:parseFloat(h[d+1])});return c}(t.getAttribute("points")),{left:r,top:n,...a}=Nt(t,this.ATTRIBUTE_NAMES,s);return new this(i,{...a,...e})}static fromObject(t){return this._fromObject(t,{extraParam:"points"})}}m(St,"ownDefaults",dn),m(St,"type","Polyline"),m(St,"layoutProperties",[fe,pe,"strokeLineCap","strokeLineJoin","strokeMiterLimit","strokeWidth","strokeUniform","points"]),m(St,"cacheProperties",[...Vt,"points"]),m(St,"ATTRIBUTE_NAMES",[...qt]),T.setClass(St),T.setSVGClass(St);class Is extends St{isOpen(){return!1}}m(Is,"ownDefaults",dn),m(Is,"type","Polygon"),T.setClass(Is),T.setSVGClass(Is);class gn extends Q{isEmptyStyles(t){if(!this.styles||t!==void 0&&!this.styles[t])return!0;const e=t===void 0?this.styles:{line:this.styles[t]};for(const s in e)for(const i in e[s])for(const r in e[s][i])return!1;return!0}styleHas(t,e){if(!this.styles||e!==void 0&&!this.styles[e])return!1;const s=e===void 0?this.styles:{0:this.styles[e]};for(const i in s)for(const r in s[i])if(s[i][r][t]!==void 0)return!0;return!1}cleanStyle(t){if(!this.styles)return!1;const e=this.styles;let s,i,r=0,n=!0,a=0;for(const l in e){s=0;for(const h in e[l]){const c=e[l][h]||{};r++,c[t]!==void 0?(i?c[t]!==i&&(n=!1):i=c[t],c[t]===this[t]&&delete c[t]):n=!1,Object.keys(c).length!==0?s++:delete e[l][h]}s===0&&delete e[l]}for(let l=0;l<this._textLines.length;l++)a+=this._textLines[l].length;n&&r===a&&(this[t]=i,this.removeStyle(t))}removeStyle(t){if(!this.styles)return;const e=this.styles;let s,i,r;for(i in e){for(r in s=e[i],s)delete s[r][t],Object.keys(s[r]).length===0&&delete s[r];Object.keys(s).length===0&&delete e[i]}}_extendStyles(t,e){const{lineIndex:s,charIndex:i}=this.get2DCursorLocation(t);this._getLineStyle(s)||this._setLineStyle(s);const r=oi({...this._getStyleDeclaration(s,i),...e},n=>n!==void 0);this._setStyleDeclaration(s,i,r)}getSelectionStyles(t,e,s){const i=[];for(let r=t;r<(e||t);r++)i.push(this.getStyleAtPosition(r,s));return i}getStyleAtPosition(t,e){const{lineIndex:s,charIndex:i}=this.get2DCursorLocation(t);return e?this.getCompleteStyleDeclaration(s,i):this._getStyleDeclaration(s,i)}setSelectionStyles(t,e,s){for(let i=e;i<(s||e);i++)this._extendStyles(i,t);this._forceClearCache=!0}_getStyleDeclaration(t,e){var s;const i=this.styles&&this.styles[t];return i&&(s=i[e])!==null&&s!==void 0?s:{}}getCompleteStyleDeclaration(t,e){return{..._e(this,this.constructor._styleProperties),...this._getStyleDeclaration(t,e)}}_setStyleDeclaration(t,e,s){this.styles[t][e]=s}_deleteStyleDeclaration(t,e){delete this.styles[t][e]}_getLineStyle(t){return!!this.styles[t]}_setLineStyle(t){this.styles[t]={}}_deleteLineStyle(t){delete this.styles[t]}}m(gn,"_styleProperties",Ol);const ic=/ +/g,rc=/"/g;function Fi(o,t,e,s,i){return` ${function(r,n){let{left:a,top:l,width:h,height:c}=n,d=arguments.length>2&&arguments[2]!==void 0?arguments[2]:L.NUM_FRACTION_DIGITS;const g=$e(Z,r,!1),[f,p,y,v]=[a,l,h,c].map(x=>X(x,d));return`<rect ${g} x="${f}" y="${p}" width="${y}" height="${v}"></rect>`}(o,{left:t,top:e,width:s,height:i})}
|
|
53
|
-
`}let ji;class rt extends gn{static getDefaults(){return{...super.getDefaults(),...rt.ownDefaults}}constructor(t,e){super(),m(this,"__charBounds",[]),Object.assign(this,rt.ownDefaults),this.setOptions(e),this.styles||(this.styles={}),this.text=t,this.initialized=!0,this.path&&this.setPathInfo(),this.initDimensions(),this.setCoords()}setPathInfo(){const t=this.path;t&&(t.segmentsInfo=en(t.path))}_splitText(){const t=this._splitTextIntoLines(this.text);return this.textLines=t.lines,this._textLines=t.graphemeLines,this._unwrappedTextLines=t._unwrappedLines,this._text=t.graphemeText,t}initDimensions(){this._splitText(),this._clearCache(),this.dirty=!0,this.path?(this.width=this.path.width,this.height=this.path.height):(this.width=this.calcTextWidth()||this.cursorWidth||this.MIN_TEXT_WIDTH,this.height=this.calcTextHeight()),this.textAlign.includes(Et)&&this.enlargeSpaces()}enlargeSpaces(){let t,e,s,i,r,n,a;for(let l=0,h=this._textLines.length;l<h;l++)if((this.textAlign===Et||l!==h-1&&!this.isEndOfWrapping(l))&&(i=0,r=this._textLines[l],e=this.getLineWidth(l),e<this.width&&(a=this.textLines[l].match(this._reSpacesAndTabs)))){s=a.length,t=(this.width-e)/s;for(let c=0;c<=r.length;c++)n=this.__charBounds[l][c],this._reSpaceAndTab.test(r[c])?(n.width+=t,n.kernedWidth+=t,n.left+=i,i+=t):n.left+=i}}isEndOfWrapping(t){return t===this._textLines.length-1}missingNewlineOffset(t){return 1}get2DCursorLocation(t,e){const s=e?this._unwrappedTextLines:this._textLines;let i;for(i=0;i<s.length;i++){if(t<=s[i].length)return{lineIndex:i,charIndex:t};t-=s[i].length+this.missingNewlineOffset(i,e)}return{lineIndex:i-1,charIndex:s[i-1].length<t?s[i-1].length:t}}toString(){return`#<Text (${this.complexity()}): { "text": "${this.text}", "fontFamily": "${this.fontFamily}" }>`}_getCacheCanvasDimensions(){const t=super._getCacheCanvasDimensions(),e=this.fontSize;return t.width+=e*t.zoomX,t.height+=e*t.zoomY,t}_render(t){const e=this.path;e&&!e.isNotVisible()&&e._render(t),this._setTextStyles(t),this._renderTextLinesBackground(t),this._renderTextDecoration(t,"underline"),this._renderText(t),this._renderTextDecoration(t,"overline"),this._renderTextDecoration(t,"linethrough")}_renderText(t){this.paintFirst===ct?(this._renderTextStroke(t),this._renderTextFill(t)):(this._renderTextFill(t),this._renderTextStroke(t))}_setTextStyles(t,e,s){if(t.textBaseline="alphabetic",this.path)switch(this.pathAlign){case A:t.textBaseline="middle";break;case"ascender":t.textBaseline=nt;break;case"descender":t.textBaseline=Js}t.font=this._getFontDeclaration(e,s)}calcTextWidth(){let t=this.getLineWidth(0);for(let e=1,s=this._textLines.length;e<s;e++){const i=this.getLineWidth(e);i>t&&(t=i)}return t}_renderTextLine(t,e,s,i,r,n){this._renderChars(t,e,s,i,r,n)}_renderTextLinesBackground(t){if(!this.textBackgroundColor&&!this.styleHas("textBackgroundColor"))return;const e=t.fillStyle,s=this._getLeftOffset();let i=this._getTopOffset();for(let r=0,n=this._textLines.length;r<n;r++){const a=this.getHeightOfLine(r);if(!this.textBackgroundColor&&!this.styleHas("textBackgroundColor",r)){i+=a;continue}const l=this._textLines[r].length,h=this._getLineLeftOffset(r);let c,d,g=0,f=0,p=this.getValueOfPropertyAt(r,0,"textBackgroundColor");const y=this.getHeightOfLineImpl(r);for(let v=0;v<l;v++){const x=this.__charBounds[r][v];d=this.getValueOfPropertyAt(r,v,"textBackgroundColor"),this.path?(t.save(),t.translate(x.renderLeft,x.renderTop),t.rotate(x.angle),t.fillStyle=d,d&&t.fillRect(-x.width/2,-y*(1-this._fontSizeFraction),x.width,y),t.restore()):d!==p?(c=s+h+f,this.direction===jt&&(c=this.width-c-g),t.fillStyle=p,p&&t.fillRect(c,i,g,y),f=x.left,g=x.width,p=d):g+=x.kernedWidth}d&&!this.path&&(c=s+h+f,this.direction===jt&&(c=this.width-c-g),t.fillStyle=d,t.fillRect(c,i,g,y)),i+=a}t.fillStyle=e,this._removeShadow(t)}_measureChar(t,e,s,i){const r=Me.getFontCache(e),n=this._getFontDeclaration(e),a=s?s+t:t,l=s&&n===this._getFontDeclaration(i),h=e.fontSize/this.CACHE_FONT_SIZE;let c,d,g,f;if(s&&r.has(s)&&(g=r.get(s)),r.has(t)&&(f=c=r.get(t)),l&&r.has(a)&&(d=r.get(a),f=d-g),c===void 0||g===void 0||d===void 0){const p=function(){return ji||(ji=pt({width:0,height:0}).getContext("2d")),ji}();this._setTextStyles(p,e,!0),c===void 0&&(f=c=p.measureText(t).width,r.set(t,c)),g===void 0&&l&&s&&(g=p.measureText(s).width,r.set(s,g)),l&&d===void 0&&(d=p.measureText(a).width,r.set(a,d),f=d-g)}return{width:c*h,kernedWidth:f*h}}getHeightOfChar(t,e){return this.getValueOfPropertyAt(t,e,"fontSize")}measureLine(t){const e=this._measureLine(t);return this.charSpacing!==0&&(e.width-=this._getWidthOfCharSpacing()),e.width<0&&(e.width=0),e}_measureLine(t){let e,s,i=0;const r=this.pathSide===G,n=this.path,a=this._textLines[t],l=a.length,h=new Array(l);this.__charBounds[t]=h;for(let c=0;c<l;c++){const d=a[c];s=this._getGraphemeBox(d,t,c,e),h[c]=s,i+=s.kernedWidth,e=d}if(h[l]={left:s?s.left+s.width:0,width:0,kernedWidth:0,height:this.fontSize,deltaY:0},n&&n.segmentsInfo){let c=0;const d=n.segmentsInfo[n.segmentsInfo.length-1].length;switch(this.textAlign){case V:c=r?d-i:0;break;case A:c=(d-i)/2;break;case G:c=r?0:d-i}c+=this.pathStartOffset*(r?-1:1);for(let g=r?l-1:0;r?g>=0:g<l;r?g--:g++)s=h[g],c>d?c%=d:c<0&&(c+=d),this._setGraphemeOnPath(c,s),c+=s.kernedWidth}return{width:i,numOfSpaces:0}}_setGraphemeOnPath(t,e){const s=t+e.kernedWidth/2,i=this.path,r=Ih(i.path,s,i.segmentsInfo);e.renderLeft=r.x-i.pathOffset.x,e.renderTop=r.y-i.pathOffset.y,e.angle=r.angle+(this.pathSide===G?Math.PI:0)}_getGraphemeBox(t,e,s,i,r){const n=this.getCompleteStyleDeclaration(e,s),a=i?this.getCompleteStyleDeclaration(e,s-1):{},l=this._measureChar(t,n,i,a);let h,c=l.kernedWidth,d=l.width;this.charSpacing!==0&&(h=this._getWidthOfCharSpacing(),d+=h,c+=h);const g={width:d,left:0,height:n.fontSize,kernedWidth:c,deltaY:n.deltaY};if(s>0&&!r){const f=this.__charBounds[e][s-1];g.left=f.left+f.width+l.kernedWidth-l.width}return g}getHeightOfLineImpl(t){const e=this.__lineHeights;if(e[t])return e[t];let s=this.getHeightOfChar(t,0);for(let i=1,r=this._textLines[t].length;i<r;i++)s=Math.max(this.getHeightOfChar(t,i),s);return e[t]=s*this._fontSizeMult}getHeightOfLine(t){return this.getHeightOfLineImpl(t)*this.lineHeight}calcTextHeight(){let t=0;for(let e=0,s=this._textLines.length;e<s;e++)t+=e===s-1?this.getHeightOfLineImpl(e):this.getHeightOfLine(e);return t}_getLeftOffset(){return this.direction===te?-this.width/2:this.width/2}_getTopOffset(){return-this.height/2}_renderTextCommon(t,e){t.save();let s=0;const i=this._getLeftOffset(),r=this._getTopOffset();for(let n=0,a=this._textLines.length;n<a;n++)this._renderTextLine(e,t,this._textLines[n],i+this._getLineLeftOffset(n),r+s+this.getHeightOfLineImpl(n),n),s+=this.getHeightOfLine(n);t.restore()}_renderTextFill(t){(this.fill||this.styleHas(Z))&&this._renderTextCommon(t,"fillText")}_renderTextStroke(t){(this.stroke&&this.strokeWidth!==0||!this.isEmptyStyles())&&(this.shadow&&!this.shadow.affectStroke&&this._removeShadow(t),t.save(),this._setLineDash(t,this.strokeDashArray),t.beginPath(),this._renderTextCommon(t,"strokeText"),t.closePath(),t.restore())}_renderChars(t,e,s,i,r,n){const a=this.textAlign.includes(Et),l=this.path,h=!a&&this.charSpacing===0&&this.isEmptyStyles(n)&&!l,c=this.direction===te,d=this.direction===te?1:-1,g=e.direction;let f,p,y,v,x,b="",w=0;if(e.save(),g!==this.direction&&(e.canvas.setAttribute("dir",c?te:jt),e.direction=c?te:jt,e.textAlign=c?V:G),r-=this.getHeightOfLineImpl(n)*this._fontSizeFraction,h)return this._renderChar(t,e,n,0,s.join(""),i,r),void e.restore();for(let C=0,S=s.length-1;C<=S;C++)v=C===S||this.charSpacing||l,b+=s[C],y=this.__charBounds[n][C],w===0?(i+=d*(y.kernedWidth-y.width),w+=y.width):w+=y.kernedWidth,a&&!v&&this._reSpaceAndTab.test(s[C])&&(v=!0),v||(f=f||this.getCompleteStyleDeclaration(n,C),p=this.getCompleteStyleDeclaration(n,C+1),v=wi(f,p,!1)),v&&(l?(e.save(),e.translate(y.renderLeft,y.renderTop),e.rotate(y.angle),this._renderChar(t,e,n,C,b,-w/2,0),e.restore()):(x=i,this._renderChar(t,e,n,C,b,x,r)),b="",f=p,i+=d*w,w=0);e.restore()}_applyPatternGradientTransformText(t){const e=this.width+this.strokeWidth,s=this.height+this.strokeWidth,i=pt({width:e,height:s}),r=i.getContext("2d");return i.width=e,i.height=s,r.beginPath(),r.moveTo(0,0),r.lineTo(e,0),r.lineTo(e,s),r.lineTo(0,s),r.closePath(),r.translate(e/2,s/2),r.fillStyle=t.toLive(r),this._applyPatternGradientTransform(r,t),r.fill(),r.createPattern(i,"no-repeat")}handleFiller(t,e,s){let i,r;return mt(s)?s.gradientUnits==="percentage"||s.gradientTransform||s.patternTransform?(i=-this.width/2,r=-this.height/2,t.translate(i,r),t[e]=this._applyPatternGradientTransformText(s),{offsetX:i,offsetY:r}):(t[e]=s.toLive(t),this._applyPatternGradientTransform(t,s)):(t[e]=s,{offsetX:0,offsetY:0})}_setStrokeStyles(t,e){let{stroke:s,strokeWidth:i}=e;return t.lineWidth=i,t.lineCap=this.strokeLineCap,t.lineDashOffset=this.strokeDashOffset,t.lineJoin=this.strokeLineJoin,t.miterLimit=this.strokeMiterLimit,this.handleFiller(t,"strokeStyle",s)}_setFillStyles(t,e){let{fill:s}=e;return this.handleFiller(t,"fillStyle",s)}_renderChar(t,e,s,i,r,n,a){const l=this._getStyleDeclaration(s,i),h=this.getCompleteStyleDeclaration(s,i),c=t==="fillText"&&h.fill,d=t==="strokeText"&&h.stroke&&h.strokeWidth;if(d||c){if(e.save(),e.font=this._getFontDeclaration(h),l.textBackgroundColor&&this._removeShadow(e),l.deltaY&&(a+=l.deltaY),c){const g=this._setFillStyles(e,h);e.fillText(r,n-g.offsetX,a-g.offsetY)}if(d){const g=this._setStrokeStyles(e,h);e.strokeText(r,n-g.offsetX,a-g.offsetY)}e.restore()}}setSuperscript(t,e){this._setScript(t,e,this.superscript)}setSubscript(t,e){this._setScript(t,e,this.subscript)}_setScript(t,e,s){const i=this.get2DCursorLocation(t,!0),r=this.getValueOfPropertyAt(i.lineIndex,i.charIndex,"fontSize"),n=this.getValueOfPropertyAt(i.lineIndex,i.charIndex,"deltaY"),a={fontSize:r*s.size,deltaY:n+r*s.baseline};this.setSelectionStyles(a,t,e)}_getLineLeftOffset(t){const e=this.getLineWidth(t),s=this.width-e,i=this.textAlign,r=this.direction,n=this.isEndOfWrapping(t);let a=0;return i===Et||i===Ie&&!n||i===Ve&&!n||i===Es&&!n?0:(i===A&&(a=s/2),i===G&&(a=s),i===Ie&&(a=s/2),i===Ve&&(a=s),r===jt&&(i===G||i===Ve?a=0:i===V||i===Es?a=-s:i!==A&&i!==Ie||(a=-s/2)),a)}_clearCache(){this._forceClearCache=!1,this.__lineWidths=[],this.__lineHeights=[],this.__charBounds=[]}getLineWidth(t){if(this.__lineWidths[t]!==void 0)return this.__lineWidths[t];const{width:e}=this.measureLine(t);return this.__lineWidths[t]=e,e}_getWidthOfCharSpacing(){return this.charSpacing!==0?this.fontSize*this.charSpacing/1e3:0}getValueOfPropertyAt(t,e,s){var i;return(i=this._getStyleDeclaration(t,e)[s])!==null&&i!==void 0?i:this[s]}_renderTextDecoration(t,e){if(!this[e]&&!this.styleHas(e))return;let s=this._getTopOffset();const i=this._getLeftOffset(),r=this.path,n=this._getWidthOfCharSpacing(),a=e==="linethrough"?.5:e==="overline"?1:0,l=this.offsets[e];for(let h=0,c=this._textLines.length;h<c;h++){const d=this.getHeightOfLine(h);if(!this[e]&&!this.styleHas(e,h)){s+=d;continue}const g=this._textLines[h],f=d/this.lineHeight,p=this._getLineLeftOffset(h);let y=0,v=0,x=this.getValueOfPropertyAt(h,0,e),b=this.getValueOfPropertyAt(h,0,Z),w=this.getValueOfPropertyAt(h,0,se),C=x,S=b,O=w;const D=s+f*(1-this._fontSizeFraction);let k=this.getHeightOfChar(h,0),P=this.getValueOfPropertyAt(h,0,"deltaY");for(let j=0,B=g.length;j<B;j++){const F=this.__charBounds[h][j];C=this.getValueOfPropertyAt(h,j,e),S=this.getValueOfPropertyAt(h,j,Z),O=this.getValueOfPropertyAt(h,j,se);const q=this.getHeightOfChar(h,j),W=this.getValueOfPropertyAt(h,j,"deltaY");if(r&&C&&S){const H=this.fontSize*O/1e3;t.save(),t.fillStyle=b,t.translate(F.renderLeft,F.renderTop),t.rotate(F.angle),t.fillRect(-F.kernedWidth/2,l*q+W-a*H,F.kernedWidth,H),t.restore()}else if((C!==x||S!==b||q!==k||O!==w||W!==P)&&v>0){const H=this.fontSize*w/1e3;let R=i+p+y;this.direction===jt&&(R=this.width-R-v),x&&b&&w&&(t.fillStyle=b,t.fillRect(R,D+l*k+P-a*H,v,H)),y=F.left,v=F.width,x=C,w=O,b=S,k=q,P=W}else v+=F.kernedWidth}let $=i+p+y;this.direction===jt&&($=this.width-$-v),t.fillStyle=S;const N=this.fontSize*O/1e3;C&&S&&O&&t.fillRect($,D+l*k+P-a*N,v-n,N),s+=d}this._removeShadow(t)}_getFontDeclaration(){let{fontFamily:t=this.fontFamily,fontStyle:e=this.fontStyle,fontWeight:s=this.fontWeight,fontSize:i=this.fontSize}=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{},r=arguments.length>1?arguments[1]:void 0;const n=t.includes("'")||t.includes('"')||t.includes(",")||rt.genericFonts.includes(t.toLowerCase())?t:`"${t}"`;return[e,s,`${r?this.CACHE_FONT_SIZE:i}px`,n].join(" ")}render(t){this.visible&&(this.canvas&&this.canvas.skipOffscreen&&!this.group&&!this.isOnScreen()||(this._forceClearCache&&this.initDimensions(),super.render(t)))}graphemeSplit(t){return Ci(t)}_splitTextIntoLines(t){const e=t.split(this._reNewline),s=new Array(e.length),i=[`
|
|
54
|
-
`];let r=[];for(let n=0;n<e.length;n++)s[n]=this.graphemeSplit(e[n]),r=r.concat(s[n],i);return r.pop(),{_unwrappedLines:s,lines:e,graphemeText:r,graphemeLines:s}}toObject(){let t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:[];return{...super.toObject([...Dr,...t]),styles:lh(this.styles,this.text),...this.path?{path:this.path.toObject()}:{}}}set(t,e){const{textLayoutProperties:s}=this.constructor;super.set(t,e);let i=!1,r=!1;if(typeof t=="object")for(const n in t)n==="path"&&this.setPathInfo(),i=i||s.includes(n),r=r||n==="path";else i=s.includes(t),r=t==="path";return r&&this.setPathInfo(),i&&this.initialized&&(this.initDimensions(),this.setCoords()),this}complexity(){return 1}static async fromElement(t,e,s){const i=Nt(t,rt.ATTRIBUTE_NAMES,s),{textAnchor:r=V,textDecoration:n="",dx:a=0,dy:l=0,top:h=0,left:c=0,fontSize:d=Zs,strokeWidth:g=1,...f}={...e,...i},p=new this(ks(t.textContent||"").trim(),{left:c+a,top:h+l,underline:n.includes("underline"),overline:n.includes("overline"),linethrough:n.includes("line-through"),strokeWidth:0,fontSize:d,...f}),y=p.getScaledHeight()/p.height,v=((p.height+p.strokeWidth)*p.lineHeight-p.height)*y,x=p.getScaledHeight()+v;let b=0;return r===A&&(b=p.getScaledWidth()/2),r===G&&(b=p.getScaledWidth()),p.set({left:p.left-b,top:p.top-(x-p.fontSize*(.07+p._fontSizeFraction))/p.lineHeight,strokeWidth:g}),p}static fromObject(t){return this._fromObject({...t,styles:hh(t.styles||{},t.text)},{extraParam:"text"})}}m(rt,"textLayoutProperties",Or),m(rt,"cacheProperties",[...Vt,...Dr]),m(rt,"ownDefaults",Dl),m(rt,"type","Text"),m(rt,"genericFonts",["serif","sans-serif","monospace","cursive","fantasy","system-ui","ui-serif","ui-sans-serif","ui-monospace","ui-rounded","math","emoji","fangsong"]),m(rt,"ATTRIBUTE_NAMES",qt.concat("x","y","dx","dy","font-family","font-style","font-weight","font-size","letter-spacing","text-decoration","text-anchor")),Nr(rt,[class extends Sr{_toSVG(){const o=this._getSVGLeftTopOffsets(),t=this._getSVGTextAndBg(o.textTop,o.textLeft);return this._wrapSVGTextAndBg(t)}toSVG(o){const t=this._createBaseSVGMarkup(this._toSVG(),{reviver:o,noStyle:!0,withShadow:!0}),e=this.path;return e?t+e._createBaseSVGMarkup(e._toSVG(),{reviver:o,withShadow:!0,additionalTransform:Le(this.calcOwnMatrix())}):t}_getSVGLeftTopOffsets(){return{textLeft:-this.width/2,textTop:-this.height/2,lineTop:this.getHeightOfLine(0)}}_wrapSVGTextAndBg(o){let{textBgRects:t,textSpans:e}=o;const s=this.getSvgTextDecoration(this);return[t.join(""),' <text xml:space="preserve" ',`font-family="${this.fontFamily.replace(rc,"'")}" `,`font-size="${this.fontSize}" `,this.fontStyle?`font-style="${this.fontStyle}" `:"",this.fontWeight?`font-weight="${this.fontWeight}" `:"",s?`text-decoration="${s}" `:"",this.direction==="rtl"?`direction="${this.direction}" `:"",'style="',this.getSvgStyles(!0),'"',this.addPaintOrder()," >",e.join(""),`</text>
|
|
55
|
-
`]}_getSVGTextAndBg(o,t){const e=[],s=[];let i,r=o;this.backgroundColor&&s.push(...Fi(this.backgroundColor,-this.width/2,-this.height/2,this.width,this.height));for(let n=0,a=this._textLines.length;n<a;n++)i=this._getLineLeftOffset(n),this.direction==="rtl"&&(i+=this.width),(this.textBackgroundColor||this.styleHas("textBackgroundColor",n))&&this._setSVGTextLineBg(s,n,t+i,r),this._setSVGTextLineText(e,n,t+i,r),r+=this.getHeightOfLine(n);return{textSpans:e,textBgRects:s}}_createTextCharSpan(o,t,e,s,i){const r=L.NUM_FRACTION_DIGITS,n=this.getSvgSpanStyles(t,o!==o.trim()||!!o.match(ic)),a=n?`style="${n}"`:"",l=t.deltaY,h=l?` dy="${X(l,r)}" `:"",{angle:c,renderLeft:d,renderTop:g,width:f}=i;let p="";if(d!==void 0){const y=f/2;c&&(p=` rotate="${X(Ut(c),r)}"`);const v=ve({angle:Ut(c)});v[4]=d,v[5]=g;const x=new _(-y,0).transform(v);e=x.x,s=x.y}return`<tspan x="${X(e,r)}" y="${X(s,r)}" ${h}${p}${a}>${nh(o)}</tspan>`}_setSVGTextLineText(o,t,e,s){const i=this.getHeightOfLine(t),r=this.textAlign.includes(Et),n=this._textLines[t];let a,l,h,c,d,g="",f=0;s+=i*(1-this._fontSizeFraction)/this.lineHeight;for(let p=0,y=n.length-1;p<=y;p++)d=p===y||this.charSpacing||this.path,g+=n[p],h=this.__charBounds[t][p],f===0?(e+=h.kernedWidth-h.width,f+=h.width):f+=h.kernedWidth,r&&!d&&this._reSpaceAndTab.test(n[p])&&(d=!0),d||(a=a||this.getCompleteStyleDeclaration(t,p),l=this.getCompleteStyleDeclaration(t,p+1),d=wi(a,l,!0)),d&&(c=this._getStyleDeclaration(t,p),o.push(this._createTextCharSpan(g,c,e,s,h)),g="",a=l,this.direction==="rtl"?e-=f:e+=f,f=0)}_setSVGTextLineBg(o,t,e,s){const i=this._textLines[t],r=this.getHeightOfLine(t)/this.lineHeight;let n,a=0,l=0,h=this.getValueOfPropertyAt(t,0,"textBackgroundColor");for(let c=0;c<i.length;c++){const{left:d,width:g,kernedWidth:f}=this.__charBounds[t][c];n=this.getValueOfPropertyAt(t,c,"textBackgroundColor"),n!==h?(h&&o.push(...Fi(h,e+l,s,a,r)),l=d,a=g,h=n):a+=f}n&&o.push(...Fi(h,e+l,s,a,r))}getSvgStyles(o){return`${super.getSvgStyles(o)} text-decoration-thickness: ${X(this.textDecorationThickness*this.getObjectScaling().y/10,L.NUM_FRACTION_DIGITS)}%; white-space: pre;`}getSvgSpanStyles(o,t){const{fontFamily:e,strokeWidth:s,stroke:i,fill:r,fontSize:n,fontStyle:a,fontWeight:l,textDecorationThickness:h,linethrough:c,overline:d,underline:g}=o,f=this.getSvgTextDecoration({underline:g??this.underline,overline:d??this.overline,linethrough:c??this.linethrough}),p=h||this.textDecorationThickness;return[i?$e(ct,i):"",s?`stroke-width: ${s}; `:"",e?`font-family: ${e.includes("'")||e.includes('"')?e:`'${e}'`}; `:"",n?`font-size: ${n}px; `:"",a?`font-style: ${a}; `:"",l?`font-weight: ${l}; `:"",f?`text-decoration: ${f}; text-decoration-thickness: ${X(p*this.getObjectScaling().y/10,L.NUM_FRACTION_DIGITS)}%; `:"",r?$e(Z,r):"",t?"white-space: pre; ":""].join("")}getSvgTextDecoration(o){return["overline","underline","line-through"].filter(t=>o[t.replace("-","")]).join(" ")}}]),T.setClass(rt),T.setSVGClass(rt);class nc{constructor(t){m(this,"target",void 0),m(this,"__mouseDownInPlace",!1),m(this,"__dragStartFired",!1),m(this,"__isDraggingOver",!1),m(this,"__dragStartSelection",void 0),m(this,"__dragImageDisposer",void 0),m(this,"_dispose",void 0),this.target=t;const e=[this.target.on("dragenter",this.dragEnterHandler.bind(this)),this.target.on("dragover",this.dragOverHandler.bind(this)),this.target.on("dragleave",this.dragLeaveHandler.bind(this)),this.target.on("dragend",this.dragEndHandler.bind(this)),this.target.on("drop",this.dropHandler.bind(this))];this._dispose=()=>{e.forEach(s=>s()),this._dispose=void 0}}isPointerOverSelection(t){const e=this.target,s=e.getSelectionStartFromPointer(t);return e.isEditing&&s>=e.selectionStart&&s<=e.selectionEnd&&e.selectionStart<e.selectionEnd}start(t){return this.__mouseDownInPlace=this.isPointerOverSelection(t)}isActive(){return this.__mouseDownInPlace}end(t){const e=this.isActive();return e&&!this.__dragStartFired&&(this.target.setCursorByClick(t),this.target.initDelayedCursor(!0)),this.__mouseDownInPlace=!1,this.__dragStartFired=!1,this.__isDraggingOver=!1,e}getDragStartSelection(){return this.__dragStartSelection}setDragImage(t,e){var s;let{selectionStart:i,selectionEnd:r}=e;const n=this.target,a=n.canvas,l=new _(n.flipX?-1:1,n.flipY?-1:1),h=n._getCursorBoundaries(i),c=new _(h.left+h.leftOffset,h.top+h.topOffset).multiply(l).transform(n.calcTransformMatrix()),d=a.getScenePoint(t).subtract(c),g=n.getCanvasRetinaScaling(),f=n.getBoundingRect(),p=c.subtract(new _(f.left,f.top)),y=a.viewportTransform,v=p.add(d).transform(y,!0),x=n.backgroundColor,b=bi(n.styles);n.backgroundColor="";const w={stroke:"transparent",fill:"transparent",textBackgroundColor:"transparent"};n.setSelectionStyles(w,0,i),n.setSelectionStyles(w,r,n.text.length),n.dirty=!0;const C=n.toCanvasElement({enableRetinaScaling:a.enableRetinaScaling,viewportTransform:!0});n.backgroundColor=x,n.styles=b,n.dirty=!0,Ei(C,{position:"fixed",left:-C.width+"px",border:ot,width:C.width/g+"px",height:C.height/g+"px"}),this.__dragImageDisposer&&this.__dragImageDisposer(),this.__dragImageDisposer=()=>{C.remove()},xt(t.target||this.target.hiddenTextarea).body.appendChild(C),(s=t.dataTransfer)===null||s===void 0||s.setDragImage(C,v.x,v.y)}onDragStart(t){this.__dragStartFired=!0;const e=this.target,s=this.isActive();if(s&&t.dataTransfer){const i=this.__dragStartSelection={selectionStart:e.selectionStart,selectionEnd:e.selectionEnd},r=e._text.slice(i.selectionStart,i.selectionEnd).join(""),n={text:e.text,value:r,...i};t.dataTransfer.setData("text/plain",r),t.dataTransfer.setData("application/fabric",JSON.stringify({value:r,styles:e.getSelectionStyles(i.selectionStart,i.selectionEnd,!0)})),t.dataTransfer.effectAllowed="copyMove",this.setDragImage(t,n)}return e.abortCursorAnimation(),s}canDrop(t){if(this.target.editable&&!this.target.getActiveControl()&&!t.defaultPrevented){if(this.isActive()&&this.__dragStartSelection){const e=this.target.getSelectionStartFromPointer(t),s=this.__dragStartSelection;return e<s.selectionStart||e>s.selectionEnd}return!0}return!1}targetCanDrop(t){return this.target.canDrop(t)}dragEnterHandler(t){let{e}=t;const s=this.targetCanDrop(e);!this.__isDraggingOver&&s&&(this.__isDraggingOver=!0)}dragOverHandler(t){const{e}=t,s=this.targetCanDrop(e);!this.__isDraggingOver&&s?this.__isDraggingOver=!0:this.__isDraggingOver&&!s&&(this.__isDraggingOver=!1),this.__isDraggingOver&&(e.preventDefault(),t.canDrop=!0,t.dropTarget=this.target)}dragLeaveHandler(){(this.__isDraggingOver||this.isActive())&&(this.__isDraggingOver=!1)}dropHandler(t){var e;const{e:s}=t,i=s.defaultPrevented;this.__isDraggingOver=!1,s.preventDefault();let r=(e=s.dataTransfer)===null||e===void 0?void 0:e.getData("text/plain");if(r&&!i){const n=this.target,a=n.canvas;let l=n.getSelectionStartFromPointer(s);const{styles:h}=s.dataTransfer.types.includes("application/fabric")?JSON.parse(s.dataTransfer.getData("application/fabric")):{},c=r[Math.max(0,r.length-1)],d=0;if(this.__dragStartSelection){const g=this.__dragStartSelection.selectionStart,f=this.__dragStartSelection.selectionEnd;l>g&&l<=f?l=g:l>f&&(l-=f-g),n.removeChars(g,f),delete this.__dragStartSelection}n._reNewline.test(c)&&(n._reNewline.test(n._text[l])||l===n._text.length)&&(r=r.trimEnd()),t.didDrop=!0,t.dropTarget=n,n.insertChars(r,h,l),a.setActiveObject(n),n.enterEditing(s),n.selectionStart=Math.min(l+d,n._text.length),n.selectionEnd=Math.min(n.selectionStart+r.length,n._text.length),n.hiddenTextarea.value=n.text,n._updateTextarea(),n.hiddenTextarea.focus(),n.fire(ds,{index:l+d,action:"drop"}),a.fire("text:changed",{target:n}),a.contextTopDirty=!0,a.requestRenderAll()}}dragEndHandler(t){let{e}=t;if(this.isActive()&&this.__dragStartFired&&this.__dragStartSelection){var s;const i=this.target,r=this.target.canvas,{selectionStart:n,selectionEnd:a}=this.__dragStartSelection,l=((s=e.dataTransfer)===null||s===void 0?void 0:s.dropEffect)||ot;l===ot?(i.selectionStart=n,i.selectionEnd=a,i._updateTextarea(),i.hiddenTextarea.focus()):(i.clearContextTop(),l==="move"&&(i.removeChars(n,a),i.selectionStart=i.selectionEnd=n,i.hiddenTextarea&&(i.hiddenTextarea.value=i.text),i._updateTextarea(),i.fire(ds,{index:n,action:"dragend"}),r.fire("text:changed",{target:i}),r.requestRenderAll()),i.exitEditing())}this.__dragImageDisposer&&this.__dragImageDisposer(),delete this.__dragImageDisposer,delete this.__dragStartSelection,this.__isDraggingOver=!1}dispose(){this._dispose&&this._dispose()}}const fn=/[ \n\.,;!\?\-]/;class oc extends rt{constructor(){super(...arguments),m(this,"_currentCursorOpacity",1)}initBehavior(){this._tick=this._tick.bind(this),this._onTickComplete=this._onTickComplete.bind(this),this.updateSelectionOnMouseMove=this.updateSelectionOnMouseMove.bind(this)}onDeselect(t){return this.isEditing&&this.exitEditing(),this.selected=!1,super.onDeselect(t)}_animateCursor(t){let{toValue:e,duration:s,delay:i,onComplete:r}=t;return Pr({startValue:this._currentCursorOpacity,endValue:e,duration:s,delay:i,onComplete:r,abort:()=>!this.canvas||this.selectionStart!==this.selectionEnd,onChange:n=>{this._currentCursorOpacity=n,this.renderCursorOrSelection()}})}_tick(t){this._currentTickState=this._animateCursor({toValue:0,duration:this.cursorDuration/2,delay:Math.max(t||0,100),onComplete:this._onTickComplete})}_onTickComplete(){var t;(t=this._currentTickCompleteState)===null||t===void 0||t.abort(),this._currentTickCompleteState=this._animateCursor({toValue:1,duration:this.cursorDuration,onComplete:this._tick})}initDelayedCursor(t){this.abortCursorAnimation(),this._tick(t?0:this.cursorDelay)}abortCursorAnimation(){let t=!1;[this._currentTickState,this._currentTickCompleteState].forEach(e=>{e&&!e.isDone()&&(t=!0,e.abort())}),this._currentCursorOpacity=1,t&&this.clearContextTop()}restartCursorIfNeeded(){[this._currentTickState,this._currentTickCompleteState].some(t=>!t||t.isDone())&&this.initDelayedCursor()}selectAll(){return this.selectionStart=0,this.selectionEnd=this._text.length,this._fireSelectionChanged(),this._updateTextarea(),this}cmdAll(){this.selectAll(),this.renderCursorOrSelection()}getSelectedText(){return this._text.slice(this.selectionStart,this.selectionEnd).join("")}findWordBoundaryLeft(t){let e=0,s=t-1;if(this._reSpace.test(this._text[s]))for(;this._reSpace.test(this._text[s]);)e++,s--;for(;/\S/.test(this._text[s])&&s>-1;)e++,s--;return t-e}findWordBoundaryRight(t){let e=0,s=t;if(this._reSpace.test(this._text[s]))for(;this._reSpace.test(this._text[s]);)e++,s++;for(;/\S/.test(this._text[s])&&s<this._text.length;)e++,s++;return t+e}findLineBoundaryLeft(t){let e=0,s=t-1;for(;!/\n/.test(this._text[s])&&s>-1;)e++,s--;return t-e}findLineBoundaryRight(t){let e=0,s=t;for(;!/\n/.test(this._text[s])&&s<this._text.length;)e++,s++;return t+e}searchWordBoundary(t,e){const s=this._text;let i=t>0&&this._reSpace.test(s[t])&&(e===-1||!Qs.test(s[t-1]))?t-1:t,r=s[i];for(;i>0&&i<s.length&&!fn.test(r);)i+=e,r=s[i];return e===-1&&fn.test(r)&&i++,i}selectWord(t){t=t??this.selectionStart;const e=this.searchWordBoundary(t,-1),s=Math.max(e,this.searchWordBoundary(t,1));this.selectionStart=e,this.selectionEnd=s,this._fireSelectionChanged(),this._updateTextarea(),this.renderCursorOrSelection()}selectLine(t){t=t??this.selectionStart;const e=this.findLineBoundaryLeft(t),s=this.findLineBoundaryRight(t);this.selectionStart=e,this.selectionEnd=s,this._fireSelectionChanged(),this._updateTextarea()}enterEditing(t){!this.isEditing&&this.editable&&(this.enterEditingImpl(),this.fire("editing:entered",t?{e:t}:void 0),this._fireSelectionChanged(),this.canvas&&(this.canvas.fire("text:editing:entered",{target:this,e:t}),this.canvas.requestRenderAll()))}enterEditingImpl(){this.canvas&&(this.canvas.calcOffset(),this.canvas.textEditingManager.exitTextEditing()),this.isEditing=!0,this.initHiddenTextarea(),this.hiddenTextarea.focus(),this.hiddenTextarea.value=this.text,this._updateTextarea(),this._saveEditingProps(),this._setEditingProps(),this._textBeforeEdit=this.text,this._tick()}updateSelectionOnMouseMove(t){if(this.getActiveControl())return;const e=this.hiddenTextarea;xt(e).activeElement!==e&&e.focus();const s=this.getSelectionStartFromPointer(t),i=this.selectionStart,r=this.selectionEnd;(s===this.__selectionStartOnMouseDown&&i!==r||i!==s&&r!==s)&&(s>this.__selectionStartOnMouseDown?(this.selectionStart=this.__selectionStartOnMouseDown,this.selectionEnd=s):(this.selectionStart=s,this.selectionEnd=this.__selectionStartOnMouseDown),this.selectionStart===i&&this.selectionEnd===r||(this._fireSelectionChanged(),this._updateTextarea(),this.renderCursorOrSelection()))}_setEditingProps(){this.hoverCursor="text",this.canvas&&(this.canvas.defaultCursor=this.canvas.moveCursor="text"),this.borderColor=this.editingBorderColor,this.hasControls=this.selectable=!1,this.lockMovementX=this.lockMovementY=!0}fromStringToGraphemeSelection(t,e,s){const i=s.slice(0,t),r=this.graphemeSplit(i).length;if(t===e)return{selectionStart:r,selectionEnd:r};const n=s.slice(t,e);return{selectionStart:r,selectionEnd:r+this.graphemeSplit(n).length}}fromGraphemeToStringSelection(t,e,s){const i=s.slice(0,t).join("").length;return t===e?{selectionStart:i,selectionEnd:i}:{selectionStart:i,selectionEnd:i+s.slice(t,e).join("").length}}_updateTextarea(){if(this.cursorOffsetCache={},this.hiddenTextarea){if(!this.inCompositionMode){const t=this.fromGraphemeToStringSelection(this.selectionStart,this.selectionEnd,this._text);this.hiddenTextarea.selectionStart=t.selectionStart,this.hiddenTextarea.selectionEnd=t.selectionEnd}this.updateTextareaPosition()}}updateFromTextArea(){const{hiddenTextarea:t,direction:e,textAlign:s,inCompositionMode:i}=this;if(!t)return;const r=s!==Et?s.replace("justify-",""):e===te?V:G,n=this.getPositionByOrigin(r,"top");this.cursorOffsetCache={},this.text=t.value,this.set("dirty",!0),this.initDimensions(),this.setPositionByOrigin(n,r,"top"),this.setCoords();const a=this.fromStringToGraphemeSelection(t.selectionStart,t.selectionEnd,t.value);this.selectionEnd=this.selectionStart=a.selectionEnd,i||(this.selectionStart=a.selectionStart),this.updateTextareaPosition()}updateTextareaPosition(){if(this.selectionStart===this.selectionEnd){const t=this._calcTextareaPosition();this.hiddenTextarea.style.left=t.left,this.hiddenTextarea.style.top=t.top}}_calcTextareaPosition(){if(!this.canvas)return{left:"1px",top:"1px"};const t=this.inCompositionMode?this.compositionStart:this.selectionStart,e=this._getCursorBoundaries(t),s=this.get2DCursorLocation(t),i=s.lineIndex,r=s.charIndex,n=this.getValueOfPropertyAt(i,r,"fontSize")*this.lineHeight,a=e.leftOffset,l=this.getCanvasRetinaScaling(),h=this.canvas.upperCanvasEl,c=h.width/l,d=h.height/l,g=c-n,f=d-n,p=new _(e.left+a,e.top+e.topOffset+n).transform(this.calcTransformMatrix()).transform(this.canvas.viewportTransform).multiply(new _(h.clientWidth/c,h.clientHeight/d));return p.x<0&&(p.x=0),p.x>g&&(p.x=g),p.y<0&&(p.y=0),p.y>f&&(p.y=f),p.x+=this.canvas._offset.left,p.y+=this.canvas._offset.top,{left:`${p.x}px`,top:`${p.y}px`,fontSize:`${n}px`,charHeight:n}}_saveEditingProps(){this._savedProps={hasControls:this.hasControls,borderColor:this.borderColor,lockMovementX:this.lockMovementX,lockMovementY:this.lockMovementY,hoverCursor:this.hoverCursor,selectable:this.selectable,defaultCursor:this.canvas&&this.canvas.defaultCursor,moveCursor:this.canvas&&this.canvas.moveCursor}}_restoreEditingProps(){this._savedProps&&(this.hoverCursor=this._savedProps.hoverCursor,this.hasControls=this._savedProps.hasControls,this.borderColor=this._savedProps.borderColor,this.selectable=this._savedProps.selectable,this.lockMovementX=this._savedProps.lockMovementX,this.lockMovementY=this._savedProps.lockMovementY,this.canvas&&(this.canvas.defaultCursor=this._savedProps.defaultCursor||this.canvas.defaultCursor,this.canvas.moveCursor=this._savedProps.moveCursor||this.canvas.moveCursor),delete this._savedProps)}exitEditingImpl(){const t=this.hiddenTextarea;this.selected=!1,this.isEditing=!1,t&&(t.blur&&t.blur(),t.parentNode&&t.parentNode.removeChild(t)),this.hiddenTextarea=null,this.abortCursorAnimation(),this.selectionStart!==this.selectionEnd&&this.clearContextTop(),this.selectionEnd=this.selectionStart,this._restoreEditingProps(),this._forceClearCache&&(this.initDimensions(),this.setCoords())}exitEditing(){const t=this._textBeforeEdit!==this.text;return this.exitEditingImpl(),this.fire("editing:exited"),t&&this.fire(fs),this.canvas&&(this.canvas.fire("text:editing:exited",{target:this}),t&&this.canvas.fire("object:modified",{target:this})),this}_removeExtraneousStyles(){for(const t in this.styles)this._textLines[t]||delete this.styles[t]}removeStyleFromTo(t,e){const{lineIndex:s,charIndex:i}=this.get2DCursorLocation(t,!0),{lineIndex:r,charIndex:n}=this.get2DCursorLocation(e,!0);if(s!==r){if(this.styles[s])for(let a=i;a<this._unwrappedTextLines[s].length;a++)delete this.styles[s][a];if(this.styles[r])for(let a=n;a<this._unwrappedTextLines[r].length;a++){const l=this.styles[r][a];l&&(this.styles[s]||(this.styles[s]={}),this.styles[s][i+a-n]=l)}for(let a=s+1;a<=r;a++)delete this.styles[a];this.shiftLineStyles(r,s-r)}else if(this.styles[s]){const a=this.styles[s],l=n-i;for(let h=i;h<n;h++)delete a[h];for(const h in this.styles[s]){const c=parseInt(h,10);c>=n&&(a[c-l]=a[h],delete a[h])}}}shiftLineStyles(t,e){const s=Object.assign({},this.styles);for(const i in this.styles){const r=parseInt(i,10);r>t&&(this.styles[r+e]=s[r],s[r-e]||delete this.styles[r])}}insertNewlineStyleObject(t,e,s,i){const r={},n=this._unwrappedTextLines[t].length,a=n===e;let l=!1;s||(s=1),this.shiftLineStyles(t,s);const h=this.styles[t]?this.styles[t][e===0?e:e-1]:void 0;for(const d in this.styles[t]){const g=parseInt(d,10);g>=e&&(l=!0,r[g-e]=this.styles[t][d],a&&e===0||delete this.styles[t][d])}let c=!1;for(l&&!a&&(this.styles[t+s]=r,c=!0),(c||n>e)&&s--;s>0;)i&&i[s-1]?this.styles[t+s]={0:{...i[s-1]}}:h?this.styles[t+s]={0:{...h}}:delete this.styles[t+s],s--;this._forceClearCache=!0}insertCharStyleObject(t,e,s,i){this.styles||(this.styles={});const r=this.styles[t],n=r?{...r}:{};s||(s=1);for(const l in n){const h=parseInt(l,10);h>=e&&(r[h+s]=n[h],n[h-s]||delete r[h])}if(this._forceClearCache=!0,i){for(;s--;)Object.keys(i[s]).length&&(this.styles[t]||(this.styles[t]={}),this.styles[t][e+s]={...i[s]});return}if(!r)return;const a=r[e?e-1:1];for(;a&&s--;)this.styles[t][e+s]={...a}}insertNewStyleBlock(t,e,s){const i=this.get2DCursorLocation(e,!0),r=[0];let n,a=0;for(let l=0;l<t.length;l++)t[l]===`
|
|
56
|
-
`?(a++,r[a]=0):r[a]++;for(r[0]>0&&(this.insertCharStyleObject(i.lineIndex,i.charIndex,r[0],s),s=s&&s.slice(r[0]+1)),a&&this.insertNewlineStyleObject(i.lineIndex,i.charIndex+r[0],a),n=1;n<a;n++)r[n]>0?this.insertCharStyleObject(i.lineIndex+n,0,r[n],s):s&&this.styles[i.lineIndex+n]&&s[0]&&(this.styles[i.lineIndex+n][0]=s[0]),s=s&&s.slice(r[n]+1);r[n]>0&&this.insertCharStyleObject(i.lineIndex+n,0,r[n],s)}removeChars(t){let e=arguments.length>1&&arguments[1]!==void 0?arguments[1]:t+1;this.removeStyleFromTo(t,e),this._text.splice(t,e-t),this.text=this._text.join(""),this.set("dirty",!0),this.initDimensions(),this.setCoords(),this._removeExtraneousStyles()}insertChars(t,e,s){let i=arguments.length>3&&arguments[3]!==void 0?arguments[3]:s;i>s&&this.removeStyleFromTo(s,i);const r=this.graphemeSplit(t);this.insertNewStyleBlock(r,s,e),this._text=[...this._text.slice(0,s),...r,...this._text.slice(i)],this.text=this._text.join(""),this.set("dirty",!0),this.initDimensions(),this.setCoords(),this._removeExtraneousStyles()}setSelectionStartEndWithShift(t,e,s){s<=t?(e===t?this._selectionDirection=V:this._selectionDirection===G&&(this._selectionDirection=V,this.selectionEnd=t),this.selectionStart=s):s>t&&s<e?this._selectionDirection===G?this.selectionEnd=s:this.selectionStart=s:(e===t?this._selectionDirection=G:this._selectionDirection===V&&(this._selectionDirection=G,this.selectionStart=e),this.selectionEnd=s)}}class ac extends oc{initHiddenTextarea(){const t=this.canvas&&xt(this.canvas.getElement())||de(),e=t.createElement("textarea");Object.entries({autocapitalize:"off",autocorrect:"off",autocomplete:"off",spellcheck:"false","data-fabric":"textarea",wrap:"off",name:"fabricTextarea"}).map(n=>{let[a,l]=n;return e.setAttribute(a,l)});const{top:s,left:i,fontSize:r}=this._calcTextareaPosition();e.style.cssText=`position: absolute; top: ${s}; left: ${i}; z-index: -999; opacity: 0; width: 1px; height: 1px; font-size: 1px; padding-top: ${r};`,(this.hiddenTextareaContainer||t.body).appendChild(e),Object.entries({blur:"blur",keydown:"onKeyDown",keyup:"onKeyUp",input:"onInput",copy:"copy",cut:"copy",paste:"paste",compositionstart:"onCompositionStart",compositionupdate:"onCompositionUpdate",compositionend:"onCompositionEnd"}).map(n=>{let[a,l]=n;return e.addEventListener(a,this[l].bind(this))}),this.hiddenTextarea=e}blur(){this.abortCursorAnimation()}onKeyDown(t){if(!this.isEditing)return;const e=this.direction==="rtl"?this.keysMapRtl:this.keysMap;if(t.keyCode in e)this[e[t.keyCode]](t);else{if(!(t.keyCode in this.ctrlKeysMapDown)||!t.ctrlKey&&!t.metaKey)return;this[this.ctrlKeysMapDown[t.keyCode]](t)}t.stopImmediatePropagation(),t.preventDefault(),t.keyCode>=33&&t.keyCode<=40?(this.inCompositionMode=!1,this.clearContextTop(),this.renderCursorOrSelection()):this.canvas&&this.canvas.requestRenderAll()}onKeyUp(t){!this.isEditing||this._copyDone||this.inCompositionMode?this._copyDone=!1:t.keyCode in this.ctrlKeysMapUp&&(t.ctrlKey||t.metaKey)&&(this[this.ctrlKeysMapUp[t.keyCode]](t),t.stopImmediatePropagation(),t.preventDefault(),this.canvas&&this.canvas.requestRenderAll())}onInput(t){const e=this.fromPaste,{value:s,selectionStart:i,selectionEnd:r}=this.hiddenTextarea;if(this.fromPaste=!1,t&&t.stopPropagation(),!this.isEditing)return;const n=()=>{this.updateFromTextArea(),this.fire(ds),this.canvas&&(this.canvas.fire("text:changed",{target:this}),this.canvas.requestRenderAll())};if(this.hiddenTextarea.value==="")return this.styles={},void n();const a=this._splitTextIntoLines(s).graphemeText,l=this._text.length,h=a.length,c=this.selectionStart,d=this.selectionEnd,g=c!==d;let f,p,y,v,x=h-l;const b=this.fromStringToGraphemeSelection(i,r,s),w=c>b.selectionStart;g?(p=this._text.slice(c,d),x+=d-c):h<l&&(p=w?this._text.slice(d+x,d):this._text.slice(c,c-x));const C=a.slice(b.selectionEnd-x,b.selectionEnd);if(p&&p.length&&(C.length&&(f=this.getSelectionStyles(c,c+1,!1),f=C.map(()=>f[0])),g?(y=c,v=d):w?(y=d-p.length,v=d):(y=d,v=d+p.length),this.removeStyleFromTo(y,v)),C.length){const{copyPasteData:S}=Dt();e&&C.join("")===S.copiedText&&!L.disableStyleCopyPaste&&(f=S.copiedTextStyle),this.insertNewStyleBlock(C,c,f)}n()}onCompositionStart(){this.inCompositionMode=!0}onCompositionEnd(){this.inCompositionMode=!1}onCompositionUpdate(t){let{target:e}=t;const{selectionStart:s,selectionEnd:i}=e;this.compositionStart=s,this.compositionEnd=i,this.updateTextareaPosition()}copy(){if(this.selectionStart===this.selectionEnd)return;const{copyPasteData:t}=Dt();t.copiedText=this.getSelectedText(),L.disableStyleCopyPaste?t.copiedTextStyle=void 0:t.copiedTextStyle=this.getSelectionStyles(this.selectionStart,this.selectionEnd,!0),this._copyDone=!0}paste(){this.fromPaste=!0}_getWidthBeforeCursor(t,e){let s,i=this._getLineLeftOffset(t);return e>0&&(s=this.__charBounds[t][e-1],i+=s.left+s.width),i}getDownCursorOffset(t,e){const s=this._getSelectionForOffset(t,e),i=this.get2DCursorLocation(s),r=i.lineIndex;if(r===this._textLines.length-1||t.metaKey||t.keyCode===34)return this._text.length-s;const n=i.charIndex,a=this._getWidthBeforeCursor(r,n),l=this._getIndexOnLine(r+1,a);return this._textLines[r].slice(n).length+l+1+this.missingNewlineOffset(r)}_getSelectionForOffset(t,e){return t.shiftKey&&this.selectionStart!==this.selectionEnd&&e?this.selectionEnd:this.selectionStart}getUpCursorOffset(t,e){const s=this._getSelectionForOffset(t,e),i=this.get2DCursorLocation(s),r=i.lineIndex;if(r===0||t.metaKey||t.keyCode===33)return-s;const n=i.charIndex,a=this._getWidthBeforeCursor(r,n),l=this._getIndexOnLine(r-1,a),h=this._textLines[r].slice(0,n),c=this.missingNewlineOffset(r-1);return-this._textLines[r-1].length+l-h.length+(1-c)}_getIndexOnLine(t,e){const s=this._textLines[t];let i,r,n=this._getLineLeftOffset(t),a=0;for(let l=0,h=s.length;l<h;l++)if(i=this.__charBounds[t][l].width,n+=i,n>e){r=!0;const c=n-i,d=n,g=Math.abs(c-e);a=Math.abs(d-e)<g?l:l-1;break}return r||(a=s.length-1),a}moveCursorDown(t){this.selectionStart>=this._text.length&&this.selectionEnd>=this._text.length||this._moveCursorUpOrDown("Down",t)}moveCursorUp(t){this.selectionStart===0&&this.selectionEnd===0||this._moveCursorUpOrDown("Up",t)}_moveCursorUpOrDown(t,e){const s=this[`get${t}CursorOffset`](e,this._selectionDirection===G);if(e.shiftKey?this.moveCursorWithShift(s):this.moveCursorWithoutShift(s),s!==0){const i=this.text.length;this.selectionStart=Ce(0,this.selectionStart,i),this.selectionEnd=Ce(0,this.selectionEnd,i),this.abortCursorAnimation(),this.initDelayedCursor(),this._fireSelectionChanged(),this._updateTextarea()}}moveCursorWithShift(t){const e=this._selectionDirection===V?this.selectionStart+t:this.selectionEnd+t;return this.setSelectionStartEndWithShift(this.selectionStart,this.selectionEnd,e),t!==0}moveCursorWithoutShift(t){return t<0?(this.selectionStart+=t,this.selectionEnd=this.selectionStart):(this.selectionEnd+=t,this.selectionStart=this.selectionEnd),t!==0}moveCursorLeft(t){this.selectionStart===0&&this.selectionEnd===0||this._moveCursorLeftOrRight("Left",t)}_move(t,e,s){let i;if(t.altKey)i=this[`findWordBoundary${s}`](this[e]);else{if(!t.metaKey&&t.keyCode!==35&&t.keyCode!==36)return this[e]+=s==="Left"?-1:1,!0;i=this[`findLineBoundary${s}`](this[e])}return i!==void 0&&this[e]!==i&&(this[e]=i,!0)}_moveLeft(t,e){return this._move(t,e,"Left")}_moveRight(t,e){return this._move(t,e,"Right")}moveCursorLeftWithoutShift(t){let e=!0;return this._selectionDirection=V,this.selectionEnd===this.selectionStart&&this.selectionStart!==0&&(e=this._moveLeft(t,"selectionStart")),this.selectionEnd=this.selectionStart,e}moveCursorLeftWithShift(t){return this._selectionDirection===G&&this.selectionStart!==this.selectionEnd?this._moveLeft(t,"selectionEnd"):this.selectionStart!==0?(this._selectionDirection=V,this._moveLeft(t,"selectionStart")):void 0}moveCursorRight(t){this.selectionStart>=this._text.length&&this.selectionEnd>=this._text.length||this._moveCursorLeftOrRight("Right",t)}_moveCursorLeftOrRight(t,e){const s=`moveCursor${t}${e.shiftKey?"WithShift":"WithoutShift"}`;this._currentCursorOpacity=1,this[s](e)&&(this.abortCursorAnimation(),this.initDelayedCursor(),this._fireSelectionChanged(),this._updateTextarea())}moveCursorRightWithShift(t){return this._selectionDirection===V&&this.selectionStart!==this.selectionEnd?this._moveRight(t,"selectionStart"):this.selectionEnd!==this._text.length?(this._selectionDirection=G,this._moveRight(t,"selectionEnd")):void 0}moveCursorRightWithoutShift(t){let e=!0;return this._selectionDirection=G,this.selectionStart===this.selectionEnd?(e=this._moveRight(t,"selectionStart"),this.selectionEnd=this.selectionStart):this.selectionStart=this.selectionEnd,e}}const pn=o=>!!o.button;class lc extends ac{constructor(){super(...arguments),m(this,"draggableTextDelegate",void 0)}initBehavior(){this.on("mousedown",this._mouseDownHandler),this.on("mouseup",this.mouseUpHandler),this.on("mousedblclick",this.doubleClickHandler),this.on("mousetripleclick",this.tripleClickHandler),this.draggableTextDelegate=new nc(this),super.initBehavior()}shouldStartDragging(){return this.draggableTextDelegate.isActive()}onDragStart(t){return this.draggableTextDelegate.onDragStart(t)}canDrop(t){return this.draggableTextDelegate.canDrop(t)}doubleClickHandler(t){this.isEditing&&(this.selectWord(this.getSelectionStartFromPointer(t.e)),this.renderCursorOrSelection())}tripleClickHandler(t){this.isEditing&&(this.selectLine(this.getSelectionStartFromPointer(t.e)),this.renderCursorOrSelection())}_mouseDownHandler(t){let{e,alreadySelected:s}=t;this.canvas&&this.editable&&!pn(e)&&!this.getActiveControl()&&(this.draggableTextDelegate.start(e)||(this.canvas.textEditingManager.register(this),s&&(this.inCompositionMode=!1,this.setCursorByClick(e)),this.isEditing&&(this.__selectionStartOnMouseDown=this.selectionStart,this.selectionStart===this.selectionEnd&&this.abortCursorAnimation(),this.renderCursorOrSelection()),this.selected||(this.selected=s||this.isEditing)))}mouseUpHandler(t){let{e,transform:s}=t;const i=this.draggableTextDelegate.end(e);if(this.canvas){this.canvas.textEditingManager.unregister(this);const r=this.canvas._activeObject;if(r&&r!==this)return}!this.editable||this.group&&!this.group.interactive||s&&s.actionPerformed||pn(e)||i||this.selected&&!this.getActiveControl()&&(this.enterEditing(e),this.selectionStart===this.selectionEnd?this.initDelayedCursor(!0):this.renderCursorOrSelection())}setCursorByClick(t){const e=this.getSelectionStartFromPointer(t),s=this.selectionStart,i=this.selectionEnd;t.shiftKey?this.setSelectionStartEndWithShift(s,i,e):(this.selectionStart=e,this.selectionEnd=e),this.isEditing&&(this._fireSelectionChanged(),this._updateTextarea())}getSelectionStartFromPointer(t){const e=this.canvas.getScenePoint(t).transform(_t(this.calcTransformMatrix())).add(new _(-this._getLeftOffset(),-this._getTopOffset()));let s=0,i=0,r=0;for(let h=0;h<this._textLines.length&&s<=e.y;h++)s+=this.getHeightOfLine(h),r=h,h>0&&(i+=this._textLines[h-1].length+this.missingNewlineOffset(h-1));let n=Math.abs(this._getLineLeftOffset(r));const a=this._textLines[r].length,l=this.__charBounds[r];for(let h=0;h<a;h++){const c=n+l[h].kernedWidth;if(e.x<=c){Math.abs(e.x-c)<=Math.abs(e.x-n)&&i++;break}n=c,i++}return Math.min(this.flipX?a-i:i,this._text.length)}}const Ns="moveCursorUp",Ws="moveCursorDown",Xs="moveCursorLeft",zs="moveCursorRight",Ys="exitEditing",mn=(o,t)=>{const e=t.getRetinaScaling();o.setTransform(e,0,0,e,0,0);const s=t.viewportTransform;o.transform(s[0],s[1],s[2],s[3],s[4],s[5])},hc={selectionStart:0,selectionEnd:0,selectionColor:"rgba(17,119,255,0.3)",isEditing:!1,editable:!0,editingBorderColor:"rgba(102,153,255,0.25)",cursorWidth:2,cursorColor:"",cursorDelay:1e3,cursorDuration:600,caching:!0,hiddenTextareaContainer:null,keysMap:{9:Ys,27:Ys,33:Ns,34:Ws,35:zs,36:Xs,37:Xs,38:Ns,39:zs,40:Ws},keysMapRtl:{9:Ys,27:Ys,33:Ns,34:Ws,35:Xs,36:zs,37:zs,38:Ns,39:Xs,40:Ws},ctrlKeysMapDown:{65:"cmdAll"},ctrlKeysMapUp:{67:"copy",88:"cut"},_selectionDirection:null,_reSpace:/\s|\r?\n/,inCompositionMode:!1};class Tt extends lc{static getDefaults(){return{...super.getDefaults(),...Tt.ownDefaults}}get type(){const t=super.type;return t==="itext"?"i-text":t}constructor(t,e){super(t,{...Tt.ownDefaults,...e}),this.initBehavior()}_set(t,e){return this.isEditing&&this._savedProps&&t in this._savedProps?(this._savedProps[t]=e,this):(t==="canvas"&&(this.canvas instanceof Mi&&this.canvas.textEditingManager.remove(this),e instanceof Mi&&e.textEditingManager.add(this)),super._set(t,e))}setSelectionStart(t){t=Math.max(t,0),this._updateAndFire("selectionStart",t)}setSelectionEnd(t){t=Math.min(t,this.text.length),this._updateAndFire("selectionEnd",t)}_updateAndFire(t,e){this[t]!==e&&(this._fireSelectionChanged(),this[t]=e),this._updateTextarea()}_fireSelectionChanged(){this.fire("selection:changed"),this.canvas&&this.canvas.fire("text:selection:changed",{target:this})}initDimensions(){this.isEditing&&this.initDelayedCursor(),super.initDimensions()}getSelectionStyles(){let t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:this.selectionStart||0,e=arguments.length>1&&arguments[1]!==void 0?arguments[1]:this.selectionEnd,s=arguments.length>2?arguments[2]:void 0;return super.getSelectionStyles(t,e,s)}setSelectionStyles(t){let e=arguments.length>1&&arguments[1]!==void 0?arguments[1]:this.selectionStart||0,s=arguments.length>2&&arguments[2]!==void 0?arguments[2]:this.selectionEnd;return super.setSelectionStyles(t,e,s)}get2DCursorLocation(){let t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:this.selectionStart,e=arguments.length>1?arguments[1]:void 0;return super.get2DCursorLocation(t,e)}render(t){super.render(t),this.cursorOffsetCache={},this.renderCursorOrSelection()}toCanvasElement(t){const e=this.isEditing;this.isEditing=!1;const s=super.toCanvasElement(t);return this.isEditing=e,s}renderCursorOrSelection(){if(!this.isEditing||!this.canvas)return;const t=this.clearContextTop(!0);if(!t)return;const e=this._getCursorBoundaries(),s=this.findAncestorsWithClipPath(),i=s.length>0;let r,n=t;if(i){r=pt(t.canvas),n=r.getContext("2d"),mn(n,this.canvas);const a=this.calcTransformMatrix();n.transform(a[0],a[1],a[2],a[3],a[4],a[5])}if(this.selectionStart!==this.selectionEnd||this.inCompositionMode?this.renderSelection(n,e):this.renderCursor(n,e),i)for(const a of s){const l=a.clipPath,h=pt(t.canvas),c=h.getContext("2d");if(mn(c,this.canvas),!l.absolutePositioned){const d=a.calcTransformMatrix();c.transform(d[0],d[1],d[2],d[3],d[4],d[5])}l.transform(c),l.drawObject(c,!0,{}),this.drawClipPathOnCache(n,l,h)}i&&(t.setTransform(1,0,0,1,0,0),t.drawImage(r,0,0)),this.canvas.contextTopDirty=!0,t.restore()}findAncestorsWithClipPath(){const t=[];let e=this;for(;e;)e.clipPath&&t.push(e),e=e.parent;return t}_getCursorBoundaries(){let t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:this.selectionStart,e=arguments.length>1?arguments[1]:void 0;const s=this._getLeftOffset(),i=this._getTopOffset(),r=this._getCursorBoundariesOffsets(t,e);return{left:s,top:i,leftOffset:r.left,topOffset:r.top}}_getCursorBoundariesOffsets(t,e){return e?this.__getCursorBoundariesOffsets(t):this.cursorOffsetCache&&"top"in this.cursorOffsetCache?this.cursorOffsetCache:this.cursorOffsetCache=this.__getCursorBoundariesOffsets(t)}__getCursorBoundariesOffsets(t){let e=0,s=0;const{charIndex:i,lineIndex:r}=this.get2DCursorLocation(t),{textAlign:n,direction:a}=this;for(let d=0;d<r;d++)e+=this.getHeightOfLine(d);const l=this._getLineLeftOffset(r),h=this.__charBounds[r][i];h&&(s=h.left),this.charSpacing!==0&&i===this._textLines[r].length&&(s-=this._getWidthOfCharSpacing());let c=l+(s>0?s:0);return a===jt&&(n===G||n===Et||n===Ve?c*=-1:n===V||n===Es?c=l-(s>0?s:0):n!==A&&n!==Ie||(c=l-(s>0?s:0))),{top:e,left:c}}renderCursorAt(t){this._renderCursor(this.canvas.contextTop,this._getCursorBoundaries(t,!0),t)}renderCursor(t,e){this._renderCursor(t,e,this.selectionStart)}getCursorRenderingData(){let t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:this.selectionStart,e=arguments.length>1&&arguments[1]!==void 0?arguments[1]:this._getCursorBoundaries(t);const s=this.get2DCursorLocation(t),i=s.lineIndex,r=s.charIndex>0?s.charIndex-1:0,n=this.getValueOfPropertyAt(i,r,"fontSize"),a=this.getObjectScaling().x*this.canvas.getZoom(),l=this.cursorWidth/a,h=this.getValueOfPropertyAt(i,r,"deltaY"),c=e.topOffset+(1-this._fontSizeFraction)*this.getHeightOfLine(i)/this.lineHeight-n*(1-this._fontSizeFraction);return{color:this.cursorColor||this.getValueOfPropertyAt(i,r,"fill"),opacity:this._currentCursorOpacity,left:e.left+e.leftOffset-l/2,top:c+e.top+h,width:l,height:n}}_renderCursor(t,e,s){const{color:i,opacity:r,left:n,top:a,width:l,height:h}=this.getCursorRenderingData(s,e);t.fillStyle=i,t.globalAlpha=r,t.fillRect(n,a,l,h)}renderSelection(t,e){const s={selectionStart:this.inCompositionMode?this.hiddenTextarea.selectionStart:this.selectionStart,selectionEnd:this.inCompositionMode?this.hiddenTextarea.selectionEnd:this.selectionEnd};this._renderSelection(t,s,e)}renderDragSourceEffect(){const t=this.draggableTextDelegate.getDragStartSelection();this._renderSelection(this.canvas.contextTop,t,this._getCursorBoundaries(t.selectionStart,!0))}renderDropTargetEffect(t){const e=this.getSelectionStartFromPointer(t);this.renderCursorAt(e)}_renderSelection(t,e,s){const{textAlign:i,direction:r}=this,n=e.selectionStart,a=e.selectionEnd,l=i.includes(Et),h=this.get2DCursorLocation(n),c=this.get2DCursorLocation(a),d=h.lineIndex,g=c.lineIndex,f=h.charIndex<0?0:h.charIndex,p=c.charIndex<0?0:c.charIndex;for(let y=d;y<=g;y++){const v=this._getLineLeftOffset(y)||0;let x=this.getHeightOfLine(y),b=0,w=0,C=0;if(y===d&&(w=this.__charBounds[d][f].left),y>=d&&y<g)C=l&&!this.isEndOfWrapping(y)?this.width:this.getLineWidth(y)||5;else if(y===g)if(p===0)C=this.__charBounds[g][p].left;else{const P=this._getWidthOfCharSpacing();C=this.__charBounds[g][p-1].left+this.__charBounds[g][p-1].width-P}b=x,(this.lineHeight<1||y===g&&this.lineHeight>1)&&(x/=this.lineHeight);let S=s.left+v+w,O=x,D=0;const k=C-w;this.inCompositionMode?(t.fillStyle=this.compositionColor||"black",O=1,D=x):t.fillStyle=this.selectionColor,r===jt&&(i===G||i===Et||i===Ve?S=this.width-S-k:i===V||i===Es?S=s.left+v-C:i!==A&&i!==Ie||(S=s.left+v-C)),t.fillRect(S,s.top+s.topOffset+D,k,O),s.topOffset+=b}}getCurrentCharFontSize(){const t=this._getCurrentCharIndex();return this.getValueOfPropertyAt(t.l,t.c,"fontSize")}getCurrentCharColor(){const t=this._getCurrentCharIndex();return this.getValueOfPropertyAt(t.l,t.c,Z)}_getCurrentCharIndex(){const t=this.get2DCursorLocation(this.selectionStart,!0),e=t.charIndex>0?t.charIndex-1:0;return{l:t.lineIndex,c:e}}dispose(){this.exitEditingImpl(),this.draggableTextDelegate.dispose(),super.dispose()}}m(Tt,"ownDefaults",hc),m(Tt,"type","IText"),T.setClass(Tt),T.setClass(Tt,"i-text");class ae extends Tt{static getDefaults(){return{...super.getDefaults(),...ae.ownDefaults}}constructor(t,e){super(t,{...ae.ownDefaults,...e})}static createControls(){return{controls:eh()}}initDimensions(){this.initialized&&(this.isEditing&&this.initDelayedCursor(),this._clearCache(),this.dynamicMinWidth=0,this._styleMap=this._generateStyleMap(this._splitText()),this.dynamicMinWidth>this.width&&this._set("width",this.dynamicMinWidth),this.textAlign.includes(Et)&&this.enlargeSpaces(),this.height=this.calcTextHeight())}_generateStyleMap(t){let e=0,s=0,i=0;const r={};for(let n=0;n<t.graphemeLines.length;n++)t.graphemeText[i]===`
|
|
57
|
-
`&&n>0?(s=0,i++,e++):!this.splitByGrapheme&&this._reSpaceAndTab.test(t.graphemeText[i])&&n>0&&(s++,i++),r[n]={line:e,offset:s},i+=t.graphemeLines[n].length,s+=t.graphemeLines[n].length;return r}styleHas(t,e){if(this._styleMap&&!this.isWrapping){const s=this._styleMap[e];s&&(e=s.line)}return super.styleHas(t,e)}isEmptyStyles(t){if(!this.styles)return!0;let e,s=0,i=t+1,r=!1;const n=this._styleMap[t],a=this._styleMap[t+1];n&&(t=n.line,s=n.offset),a&&(i=a.line,r=i===t,e=a.offset);const l=t===void 0?this.styles:{line:this.styles[t]};for(const h in l)for(const c in l[h]){const d=parseInt(c,10);if(d>=s&&(!r||d<e))for(const g in l[h][c])return!1}return!0}_getStyleDeclaration(t,e){if(this._styleMap&&!this.isWrapping){const s=this._styleMap[t];if(!s)return{};t=s.line,e=s.offset+e}return super._getStyleDeclaration(t,e)}_setStyleDeclaration(t,e,s){const i=this._styleMap[t];super._setStyleDeclaration(i.line,i.offset+e,s)}_deleteStyleDeclaration(t,e){const s=this._styleMap[t];super._deleteStyleDeclaration(s.line,s.offset+e)}_getLineStyle(t){const e=this._styleMap[t];return!!this.styles[e.line]}_setLineStyle(t){const e=this._styleMap[t];super._setLineStyle(e.line)}_wrapText(t,e){this.isWrapping=!0;const s=this.getGraphemeDataForRender(t),i=[];for(let r=0;r<s.wordsData.length;r++)i.push(...this._wrapLine(r,e,s));return this.isWrapping=!1,i}getGraphemeDataForRender(t){const e=this.splitByGrapheme,s=e?"":" ";let i=0;return{wordsData:t.map((r,n)=>{let a=0;const l=e?this.graphemeSplit(r):this.wordSplit(r);return l.length===0?[{word:[],width:0}]:l.map(h=>{const c=e?[h]:this.graphemeSplit(h),d=this._measureWord(c,n,a);return i=Math.max(d,i),a+=c.length+s.length,{word:c,width:d}})}),largestWordWidth:i}}_measureWord(t,e){let s,i=arguments.length>2&&arguments[2]!==void 0?arguments[2]:0,r=0;for(let n=0,a=t.length;n<a;n++)r+=this._getGraphemeBox(t[n],e,n+i,s,!0).kernedWidth,s=t[n];return r}wordSplit(t){return t.split(this._wordJoiners)}_wrapLine(t,e,s){let{largestWordWidth:i,wordsData:r}=s,n=arguments.length>3&&arguments[3]!==void 0?arguments[3]:0;const a=this._getWidthOfCharSpacing(),l=this.splitByGrapheme,h=[],c=l?"":" ";let d=0,g=[],f=0,p=0,y=!0;e-=n;const v=Math.max(e,i,this.dynamicMinWidth),x=r[t];let b;for(f=0,b=0;b<x.length;b++){const{word:w,width:C}=x[b];f+=w.length,d+=p+C-a,d>v&&!y?(h.push(g),g=[],d=C,y=!0):d+=a,y||l||g.push(c),g=g.concat(w),p=l?0:this._measureWord([c],t,f),f++,y=!1}return b&&h.push(g),i+n>this.dynamicMinWidth&&(this.dynamicMinWidth=i-a+n),h}isEndOfWrapping(t){return!this._styleMap[t+1]||this._styleMap[t+1].line!==this._styleMap[t].line}missingNewlineOffset(t,e){return this.splitByGrapheme&&!e?this.isEndOfWrapping(t)?1:0:1}_splitTextIntoLines(t){const e=super._splitTextIntoLines(t),s=this._wrapText(e.lines,this.width),i=new Array(s.length);for(let r=0;r<s.length;r++)i[r]=s[r].join("");return e.lines=i,e.graphemeLines=s,e}getMinWidth(){return Math.max(this.minWidth,this.dynamicMinWidth)}_removeExtraneousStyles(){const t=new Map;for(const e in this._styleMap){const s=parseInt(e,10);if(this._textLines[s]){const i=this._styleMap[e].line;t.set(`${i}`,!0)}}for(const e in this.styles)t.has(e)||delete this.styles[e]}toObject(){let t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:[];return super.toObject(["minWidth","splitByGrapheme",...t])}}m(ae,"type","Textbox"),m(ae,"textLayoutProperties",[...Tt.textLayoutProperties,"width"]),m(ae,"ownDefaults",{minWidth:20,dynamicMinWidth:2,lockScalingFlip:!0,noScaleCache:!1,_wordJoiners:/[ \t\r]/,splitByGrapheme:!1}),T.setClass(ae);class yn extends Ls{shouldPerformLayout(t){return!!t.target.clipPath&&super.shouldPerformLayout(t)}shouldLayoutClipPath(){return!1}calcLayoutResult(t,e){const{target:s}=t,{clipPath:i,group:r}=s;if(!i||!this.shouldPerformLayout(t))return;const{width:n,height:a}=$t(Hr(s,i)),l=new _(n,a);if(i.absolutePositioned)return{center:xe(i.getRelativeCenterPoint(),void 0,r?r.calcTransformMatrix():void 0),size:l};{const h=i.getRelativeCenterPoint().transform(s.calcOwnMatrix(),!0);if(this.shouldPerformLayout(t)){const{center:c=new _,correction:d=new _}=this.calcBoundingBox(e,t)||{};return{center:c.add(h),correction:d.subtract(h),size:l}}return{center:s.getRelativeCenterPoint().add(h),size:l}}}}m(yn,"type","clip-path"),T.setClass(yn);class vn extends Ls{getInitialSize(t,e){let{target:s}=t,{size:i}=e;return new _(s.width||i.x,s.height||i.y)}}m(vn,"type","fixed"),T.setClass(vn);class cc extends ze{subscribeTargets(t){const e=t.target;t.targets.reduce((s,i)=>(i.parent&&s.add(i.parent),s),new Set).forEach(s=>{s.layoutManager.subscribeTargets({target:s,targets:[e]})})}unsubscribeTargets(t){const e=t.target,s=e.getObjects();t.targets.reduce((i,r)=>(r.parent&&i.add(r.parent),i),new Set).forEach(i=>{!s.some(r=>r.parent===i)&&i.layoutManager.unsubscribeTargets({target:i,targets:[e]})})}}class le extends re{static getDefaults(){return{...super.getDefaults(),...le.ownDefaults}}constructor(){let t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:[],e=arguments.length>1&&arguments[1]!==void 0?arguments[1]:{};super(),Object.assign(this,le.ownDefaults),this.setOptions(e);const{left:s,top:i,layoutManager:r}=e;this.groupInit(t,{left:s,top:i,layoutManager:r??new cc})}_shouldSetNestedCoords(){return!0}__objectSelectionMonitor(){}multiSelectAdd(){for(var t=arguments.length,e=new Array(t),s=0;s<t;s++)e[s]=arguments[s];this.multiSelectionStacking==="selection-order"?this.add(...e):e.forEach(i=>{const r=this._objects.findIndex(a=>a.isInFrontOf(i)),n=r===-1?this.size():r;this.insertAt(n,i)})}canEnterGroup(t){return this.getObjects().some(e=>e.isDescendantOf(t)||t.isDescendantOf(e))?(Yt("error","ActiveSelection: circular object trees are not supported, this call has no effect"),!1):super.canEnterGroup(t)}enterGroup(t,e){t.parent&&t.parent===t.group?t.parent._exitGroup(t):t.group&&t.parent!==t.group&&t.group.remove(t),this._enterGroup(t,e)}exitGroup(t,e){this._exitGroup(t,e),t.parent&&t.parent._enterGroup(t,!0)}_onAfterObjectsChange(t,e){super._onAfterObjectsChange(t,e);const s=new Set;e.forEach(i=>{const{parent:r}=i;r&&s.add(r)}),t===ki?s.forEach(i=>{i._onAfterObjectsChange(Fs,e)}):s.forEach(i=>{i._set("dirty",!0)})}onDeselect(){return this.removeAll(),!1}toString(){return`#<ActiveSelection: (${this.complexity()})>`}shouldCache(){return!1}isOnACache(){return!1}_renderControls(t,e,s){t.save(),t.globalAlpha=this.isMoving?this.borderOpacityWhenMoving:1;const i={hasControls:!1,...s,forActiveSelection:!0};for(let r=0;r<this._objects.length;r++)this._objects[r]._renderControls(t,i);super._renderControls(t,e),t.restore()}}m(le,"type","ActiveSelection"),m(le,"ownDefaults",{multiSelectionStacking:"canvas-stacking"}),T.setClass(le),T.setClass(le,"activeSelection");class uc{constructor(){m(this,"resources",{})}applyFilters(t,e,s,i,r){const n=r.getContext("2d",{willReadFrequently:!0,desynchronized:!0});if(!n)return;n.drawImage(e,0,0,s,i);const a={sourceWidth:s,sourceHeight:i,imageData:n.getImageData(0,0,s,i),originalEl:e,originalImageData:n.getImageData(0,0,s,i),canvasEl:r,ctx:n,filterBackend:this};t.forEach(h=>{h.applyTo(a)});const{imageData:l}=a;return l.width===s&&l.height===i||(r.width=l.width,r.height=l.height),n.putImageData(l,0,0),a}}class _n{constructor(){let{tileSize:t=L.textureSize}=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{};m(this,"aPosition",new Float32Array([0,0,0,1,1,0,1,1])),m(this,"resources",{}),this.tileSize=t,this.setupGLContext(t,t),this.captureGPUInfo()}setupGLContext(t,e){this.dispose(),this.createWebGLCanvas(t,e)}createWebGLCanvas(t,e){const s=pt({width:t,height:e}),i=s.getContext("webgl",{alpha:!0,premultipliedAlpha:!1,depth:!1,stencil:!1,antialias:!1});i&&(i.clearColor(0,0,0,0),this.canvas=s,this.gl=i)}applyFilters(t,e,s,i,r,n){const a=this.gl,l=r.getContext("2d");if(!a||!l)return;let h;n&&(h=this.getCachedTexture(n,e));const c={originalWidth:e.width||e.naturalWidth||0,originalHeight:e.height||e.naturalHeight||0,sourceWidth:s,sourceHeight:i,destinationWidth:s,destinationHeight:i,context:a,sourceTexture:this.createTexture(a,s,i,h?void 0:e),targetTexture:this.createTexture(a,s,i),originalTexture:h||this.createTexture(a,s,i,h?void 0:e),passes:t.length,webgl:!0,aPosition:this.aPosition,programCache:this.programCache,pass:0,filterBackend:this,targetCanvas:r},d=a.createFramebuffer();return a.bindFramebuffer(a.FRAMEBUFFER,d),t.forEach(g=>{g&&g.applyTo(c)}),function(g){const f=g.targetCanvas,p=f.width,y=f.height,v=g.destinationWidth,x=g.destinationHeight;p===v&&y===x||(f.width=v,f.height=x)}(c),this.copyGLTo2D(a,c),a.bindTexture(a.TEXTURE_2D,null),a.deleteTexture(c.sourceTexture),a.deleteTexture(c.targetTexture),a.deleteFramebuffer(d),l.setTransform(1,0,0,1,0,0),c}dispose(){this.canvas&&(this.canvas=null,this.gl=null),this.clearWebGLCaches()}clearWebGLCaches(){this.programCache={},this.textureCache={}}createTexture(t,e,s,i,r){const{NEAREST:n,TEXTURE_2D:a,RGBA:l,UNSIGNED_BYTE:h,CLAMP_TO_EDGE:c,TEXTURE_MAG_FILTER:d,TEXTURE_MIN_FILTER:g,TEXTURE_WRAP_S:f,TEXTURE_WRAP_T:p}=t,y=t.createTexture();return t.bindTexture(a,y),t.texParameteri(a,d,r||n),t.texParameteri(a,g,r||n),t.texParameteri(a,f,c),t.texParameteri(a,p,c),i?t.texImage2D(a,0,l,l,h,i):t.texImage2D(a,0,l,e,s,0,l,h,null),y}getCachedTexture(t,e,s){const{textureCache:i}=this;if(i[t])return i[t];{const r=this.createTexture(this.gl,e.width,e.height,e,s);return r&&(i[t]=r),r}}evictCachesForKey(t){this.textureCache[t]&&(this.gl.deleteTexture(this.textureCache[t]),delete this.textureCache[t])}copyGLTo2D(t,e){const s=t.canvas,i=e.targetCanvas,r=i.getContext("2d");if(!r)return;r.translate(0,i.height),r.scale(1,-1);const n=s.height-i.height;r.drawImage(s,0,n,i.width,i.height,0,0,i.width,i.height)}copyGLTo2DPutImageData(t,e){const s=e.targetCanvas.getContext("2d"),i=e.destinationWidth,r=e.destinationHeight,n=i*r*4;if(!s)return;const a=new Uint8Array(this.imageBuffer,0,n),l=new Uint8ClampedArray(this.imageBuffer,0,n);t.readPixels(0,0,i,r,t.RGBA,t.UNSIGNED_BYTE,a);const h=new ImageData(l,i,r);s.putImageData(h,0,0)}captureGPUInfo(){if(this.gpuInfo)return this.gpuInfo;const t=this.gl,e={renderer:"",vendor:""};if(!t)return e;const s=t.getExtension("WEBGL_debug_renderer_info");if(s){const i=t.getParameter(s.UNMASKED_RENDERER_WEBGL),r=t.getParameter(s.UNMASKED_VENDOR_WEBGL);i&&(e.renderer=i.toLowerCase()),r&&(e.vendor=r.toLowerCase())}return this.gpuInfo=e,e}}let Li;function dc(){const{WebGLProbe:o}=Dt();return o.queryWebGL(Rt()),L.enableGLFiltering&&o.isSupported(L.textureSize)?new _n({tileSize:L.textureSize}):new uc}function Bi(){return!Li&&(!(arguments.length>0&&arguments[0]!==void 0)||arguments[0])&&(Li=dc()),Li}const xn=["cropX","cropY"];class dt extends Q{static getDefaults(){return{...super.getDefaults(),...dt.ownDefaults}}constructor(t,e){super(),m(this,"_lastScaleX",1),m(this,"_lastScaleY",1),m(this,"_filterScalingX",1),m(this,"_filterScalingY",1),this.filters=[],Object.assign(this,dt.ownDefaults),this.setOptions(e),this.cacheKey=`texture${Gt()}`,this.setElement(typeof t=="string"?(this.canvas&&xt(this.canvas.getElement())||de()).getElementById(t):t,e)}getElement(){return this._element}setElement(t){let e=arguments.length>1&&arguments[1]!==void 0?arguments[1]:{};this.removeTexture(this.cacheKey),this.removeTexture(`${this.cacheKey}_filtered`),this._element=t,this._originalElement=t,this._setWidthHeight(e),this.filters.length!==0&&this.applyFilters(),this.resizeFilter&&this.applyResizeFilters()}removeTexture(t){const e=Bi(!1);e instanceof _n&&e.evictCachesForKey(t)}dispose(){super.dispose(),this.removeTexture(this.cacheKey),this.removeTexture(`${this.cacheKey}_filtered`),this._cacheContext=null,["_originalElement","_element","_filteredEl","_cacheCanvas"].forEach(t=>{const e=this[t];e&&Dt().dispose(e),this[t]=void 0})}getCrossOrigin(){return this._originalElement&&(this._originalElement.crossOrigin||null)}getOriginalSize(){const t=this.getElement();return t?{width:t.naturalWidth||t.width,height:t.naturalHeight||t.height}:{width:0,height:0}}_stroke(t){if(!this.stroke||this.strokeWidth===0)return;const e=this.width/2,s=this.height/2;t.beginPath(),t.moveTo(-e,-s),t.lineTo(e,-s),t.lineTo(e,s),t.lineTo(-e,s),t.lineTo(-e,-s),t.closePath()}toObject(){let t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:[];const e=[];return this.filters.forEach(s=>{s&&e.push(s.toObject())}),{...super.toObject([...xn,...t]),src:this.getSrc(),crossOrigin:this.getCrossOrigin(),filters:e,...this.resizeFilter?{resizeFilter:this.resizeFilter.toObject()}:{}}}hasCrop(){return!!this.cropX||!!this.cropY||this.width<this._element.width||this.height<this._element.height}_toSVG(){const t=[],e=this._element,s=-this.width/2,i=-this.height/2;let r=[],n=[],a="",l="";if(!e)return[];if(this.hasCrop()){const h=Gt();r.push('<clipPath id="imageCrop_'+h+`">
|
|
58
|
-
`,' <rect x="'+s+'" y="'+i+'" width="'+this.width+'" height="'+this.height+`" />
|
|
59
|
-
`,`</clipPath>
|
|
60
|
-
`),a=' clip-path="url(#imageCrop_'+h+')" '}if(this.imageSmoothing||(l=' image-rendering="optimizeSpeed"'),t.push(" <image ","COMMON_PARTS",`xlink:href="${this.getSvgSrc(!0)}" x="${s-this.cropX}" y="${i-this.cropY}" width="${e.width||e.naturalWidth}" height="${e.height||e.naturalHeight}"${l}${a}></image>
|
|
61
|
-
`),this.stroke||this.strokeDashArray){const h=this.fill;this.fill=null,n=[` <rect x="${s}" y="${i}" width="${this.width}" height="${this.height}" style="${this.getSvgStyles()}" />
|
|
62
|
-
`],this.fill=h}return r=this.paintFirst!==Z?r.concat(n,t):r.concat(t,n),r}getSrc(t){const e=t?this._element:this._originalElement;return e?e.toDataURL?e.toDataURL():this.srcFromAttribute?e.getAttribute("src")||"":e.src:this.src||""}getSvgSrc(t){return this.getSrc(t)}setSrc(t){let{crossOrigin:e,signal:s}=arguments.length>1&&arguments[1]!==void 0?arguments[1]:{};return xs(t,{crossOrigin:e,signal:s}).then(i=>{e!==void 0&&this.set({crossOrigin:e}),this.setElement(i)})}toString(){return`#<Image: { src: "${this.getSrc()}" }>`}applyResizeFilters(){const t=this.resizeFilter,e=this.minimumScaleTrigger,s=this.getTotalObjectScaling(),i=s.x,r=s.y,n=this._filteredEl||this._originalElement;if(this.group&&this.set("dirty",!0),!t||i>e&&r>e)return this._element=n,this._filterScalingX=1,this._filterScalingY=1,this._lastScaleX=i,void(this._lastScaleY=r);const a=pt(n),{width:l,height:h}=n;this._element=a,this._lastScaleX=t.scaleX=i,this._lastScaleY=t.scaleY=r,Bi().applyFilters([t],n,l,h,this._element),this._filterScalingX=a.width/this._originalElement.width,this._filterScalingY=a.height/this._originalElement.height}applyFilters(){let t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:this.filters||[];if(t=t.filter(r=>r&&!r.isNeutralState()),this.set("dirty",!0),this.removeTexture(`${this.cacheKey}_filtered`),t.length===0)return this._element=this._originalElement,this._filteredEl=void 0,this._filterScalingX=1,void(this._filterScalingY=1);const e=this._originalElement,s=e.naturalWidth||e.width,i=e.naturalHeight||e.height;if(this._element===this._originalElement){const r=pt({width:s,height:i});this._element=r,this._filteredEl=r}else this._filteredEl&&(this._element=this._filteredEl,this._filteredEl.getContext("2d").clearRect(0,0,s,i),this._lastScaleX=1,this._lastScaleY=1);Bi().applyFilters(t,this._originalElement,s,i,this._element,this.cacheKey),this._originalElement.width===this._element.width&&this._originalElement.height===this._element.height||(this._filterScalingX=this._element.width/this._originalElement.width,this._filterScalingY=this._element.height/this._originalElement.height)}_render(t){t.imageSmoothingEnabled=this.imageSmoothing,this.isMoving!==!0&&this.resizeFilter&&this._needsResize()&&this.applyResizeFilters(),this._stroke(t),this._renderPaintInOrder(t)}drawCacheOnCanvas(t){t.imageSmoothingEnabled=this.imageSmoothing,super.drawCacheOnCanvas(t)}shouldCache(){return this.needsItsOwnCache()}_renderFill(t){const e=this._element;if(!e)return;const s=this._filterScalingX,i=this._filterScalingY,r=this.width,n=this.height,a=Math.max(this.cropX,0),l=Math.max(this.cropY,0),h=e.naturalWidth||e.width,c=e.naturalHeight||e.height,d=a*s,g=l*i,f=Math.min(r*s,h-d),p=Math.min(n*i,c-g),y=-r/2,v=-n/2,x=Math.min(r,h/s-a),b=Math.min(n,c/i-l);e&&t.drawImage(e,d,g,f,p,y,v,x,b)}_needsResize(){const t=this.getTotalObjectScaling();return t.x!==this._lastScaleX||t.y!==this._lastScaleY}_resetWidthHeight(){this.set(this.getOriginalSize())}_setWidthHeight(){let{width:t,height:e}=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{};const s=this.getOriginalSize();this.width=t||s.width,this.height=e||s.height}parsePreserveAspectRatioAttribute(){const t=kl(this.preserveAspectRatio||""),e=this.width,s=this.height,i={width:e,height:s};let r,n=this._element.width,a=this._element.height,l=1,h=1,c=0,d=0,g=0,f=0;return!t||t.alignX===ot&&t.alignY===ot?(l=e/n,h=s/a):(t.meetOrSlice==="meet"&&(l=h=Eh(this._element,i),r=(e-n*l)/2,t.alignX==="Min"&&(c=-r),t.alignX==="Max"&&(c=r),r=(s-a*h)/2,t.alignY==="Min"&&(d=-r),t.alignY==="Max"&&(d=r)),t.meetOrSlice==="slice"&&(l=h=Mh(this._element,i),r=n-e/l,t.alignX==="Mid"&&(g=r/2),t.alignX==="Max"&&(g=r),r=a-s/h,t.alignY==="Mid"&&(f=r/2),t.alignY==="Max"&&(f=r),n=e/l,a=s/h)),{width:n,height:a,scaleX:l,scaleY:h,offsetLeft:c,offsetTop:d,cropX:g,cropY:f}}static fromObject(t,e){let{filters:s,resizeFilter:i,src:r,crossOrigin:n,type:a,...l}=t;return Promise.all([xs(r,{...e,crossOrigin:n}),s&&je(s,e),i?je([i],e):[],bs(l,e)]).then(h=>{let[c,d=[],[g],f={}]=h;return new this(c,{...l,src:r,filters:d,resizeFilter:g,...f})})}static fromURL(t){let{crossOrigin:e=null,signal:s}=arguments.length>1&&arguments[1]!==void 0?arguments[1]:{},i=arguments.length>2?arguments[2]:void 0;return xs(t,{crossOrigin:e,signal:s}).then(r=>new this(r,i))}static async fromElement(t){let e=arguments.length>1&&arguments[1]!==void 0?arguments[1]:{},s=arguments.length>2?arguments[2]:void 0;const i=Nt(t,this.ATTRIBUTE_NAMES,s);return this.fromURL(i["xlink:href"]||i.href,e,i).catch(r=>(Yt("log","Unable to parse Image",r),null))}}m(dt,"type","Image"),m(dt,"cacheProperties",[...Vt,...xn]),m(dt,"ownDefaults",{strokeWidth:0,srcFromAttribute:!1,minimumScaleTrigger:.5,cropX:0,cropY:0,imageSmoothing:!0}),m(dt,"ATTRIBUTE_NAMES",[...qt,"x","y","width","height","preserveAspectRatio","xlink:href","href","crossOrigin","image-rendering"]),T.setClass(dt),T.setSVGClass(dt),Ds(["pattern","defs","symbol","metadata","clipPath","mask","desc"]);const Hs=o=>o.webgl!==void 0,Ri="precision highp float",gc=`
|
|
63
|
-
${Ri};
|
|
64
|
-
varying vec2 vTexCoord;
|
|
65
|
-
uniform sampler2D uTexture;
|
|
66
|
-
void main() {
|
|
67
|
-
gl_FragColor = texture2D(uTexture, vTexCoord);
|
|
68
|
-
}`,fc=new RegExp(Ri,"g");class K{get type(){return this.constructor.type}constructor(){let{type:t,...e}=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{};Object.assign(this,this.constructor.defaults,e)}getFragmentSource(){return gc}getVertexSource(){return`
|
|
69
|
-
attribute vec2 aPosition;
|
|
70
|
-
varying vec2 vTexCoord;
|
|
71
|
-
void main() {
|
|
72
|
-
vTexCoord = aPosition;
|
|
73
|
-
gl_Position = vec4(aPosition * 2.0 - 1.0, 0.0, 1.0);
|
|
74
|
-
}`}createProgram(t){let e=arguments.length>1&&arguments[1]!==void 0?arguments[1]:this.getFragmentSource(),s=arguments.length>2&&arguments[2]!==void 0?arguments[2]:this.getVertexSource();const{WebGLProbe:{GLPrecision:i="highp"}}=Dt();i!=="highp"&&(e=e.replace(fc,Ri.replace("highp",i)));const r=t.createShader(t.VERTEX_SHADER),n=t.createShader(t.FRAGMENT_SHADER),a=t.createProgram();if(!r||!n||!a)throw new Ot("Vertex, fragment shader or program creation error");if(t.shaderSource(r,s),t.compileShader(r),!t.getShaderParameter(r,t.COMPILE_STATUS))throw new Ot(`Vertex shader compile error for ${this.type}: ${t.getShaderInfoLog(r)}`);if(t.shaderSource(n,e),t.compileShader(n),!t.getShaderParameter(n,t.COMPILE_STATUS))throw new Ot(`Fragment shader compile error for ${this.type}: ${t.getShaderInfoLog(n)}`);if(t.attachShader(a,r),t.attachShader(a,n),t.linkProgram(a),!t.getProgramParameter(a,t.LINK_STATUS))throw new Ot(`Shader link error for "${this.type}" ${t.getProgramInfoLog(a)}`);const l=this.getUniformLocations(t,a)||{};return l.uStepW=t.getUniformLocation(a,"uStepW"),l.uStepH=t.getUniformLocation(a,"uStepH"),{program:a,attributeLocations:this.getAttributeLocations(t,a),uniformLocations:l}}getAttributeLocations(t,e){return{aPosition:t.getAttribLocation(e,"aPosition")}}getUniformLocations(t,e){const s=this.constructor.uniformLocations,i={};for(let r=0;r<s.length;r++)i[s[r]]=t.getUniformLocation(e,s[r]);return i}sendAttributeData(t,e,s){const i=e.aPosition,r=t.createBuffer();t.bindBuffer(t.ARRAY_BUFFER,r),t.enableVertexAttribArray(i),t.vertexAttribPointer(i,2,t.FLOAT,!1,0,0),t.bufferData(t.ARRAY_BUFFER,s,t.STATIC_DRAW)}_setupFrameBuffer(t){const e=t.context;if(t.passes>1){const s=t.destinationWidth,i=t.destinationHeight;t.sourceWidth===s&&t.sourceHeight===i||(e.deleteTexture(t.targetTexture),t.targetTexture=t.filterBackend.createTexture(e,s,i)),e.framebufferTexture2D(e.FRAMEBUFFER,e.COLOR_ATTACHMENT0,e.TEXTURE_2D,t.targetTexture,0)}else e.bindFramebuffer(e.FRAMEBUFFER,null),e.finish()}_swapTextures(t){t.passes--,t.pass++;const e=t.targetTexture;t.targetTexture=t.sourceTexture,t.sourceTexture=e}isNeutralState(t){return!1}applyTo(t){Hs(t)?(this._setupFrameBuffer(t),this.applyToWebGL(t),this._swapTextures(t)):this.applyTo2d(t)}applyTo2d(t){}getCacheKey(){return this.type}retrieveShader(t){const e=this.getCacheKey();return t.programCache[e]||(t.programCache[e]=this.createProgram(t.context)),t.programCache[e]}applyToWebGL(t){const e=t.context,s=this.retrieveShader(t);t.pass===0&&t.originalTexture?e.bindTexture(e.TEXTURE_2D,t.originalTexture):e.bindTexture(e.TEXTURE_2D,t.sourceTexture),e.useProgram(s.program),this.sendAttributeData(e,s.attributeLocations,t.aPosition),e.uniform1f(s.uniformLocations.uStepW,1/t.sourceWidth),e.uniform1f(s.uniformLocations.uStepH,1/t.sourceHeight),this.sendUniformData(e,s.uniformLocations),e.viewport(0,0,t.destinationWidth,t.destinationHeight),e.drawArrays(e.TRIANGLE_STRIP,0,4)}bindAdditionalTexture(t,e,s){t.activeTexture(s),t.bindTexture(t.TEXTURE_2D,e),t.activeTexture(t.TEXTURE0)}unbindAdditionalTexture(t,e){t.activeTexture(e),t.bindTexture(t.TEXTURE_2D,null),t.activeTexture(t.TEXTURE0)}sendUniformData(t,e){}createHelpLayer(t){if(!t.helpLayer){const{sourceWidth:e,sourceHeight:s}=t,i=pt({width:e,height:s});t.helpLayer=i}}toObject(){const t=Object.keys(this.constructor.defaults||{});return{type:this.type,...t.reduce((e,s)=>(e[s]=this[s],e),{})}}toJSON(){return this.toObject()}static async fromObject(t,e){let{type:s,...i}=t;return new this(i)}}m(K,"type","BaseFilter"),m(K,"uniformLocations",[]);const pc={multiply:`gl_FragColor.rgb *= uColor.rgb;
|
|
75
|
-
`,screen:`gl_FragColor.rgb = 1.0 - (1.0 - gl_FragColor.rgb) * (1.0 - uColor.rgb);
|
|
76
|
-
`,add:`gl_FragColor.rgb += uColor.rgb;
|
|
77
|
-
`,difference:`gl_FragColor.rgb = abs(gl_FragColor.rgb - uColor.rgb);
|
|
78
|
-
`,subtract:`gl_FragColor.rgb -= uColor.rgb;
|
|
79
|
-
`,lighten:`gl_FragColor.rgb = max(gl_FragColor.rgb, uColor.rgb);
|
|
80
|
-
`,darken:`gl_FragColor.rgb = min(gl_FragColor.rgb, uColor.rgb);
|
|
81
|
-
`,exclusion:`gl_FragColor.rgb += uColor.rgb - 2.0 * (uColor.rgb * gl_FragColor.rgb);
|
|
82
|
-
`,overlay:`
|
|
83
|
-
if (uColor.r < 0.5) {
|
|
84
|
-
gl_FragColor.r *= 2.0 * uColor.r;
|
|
85
|
-
} else {
|
|
86
|
-
gl_FragColor.r = 1.0 - 2.0 * (1.0 - gl_FragColor.r) * (1.0 - uColor.r);
|
|
87
|
-
}
|
|
88
|
-
if (uColor.g < 0.5) {
|
|
89
|
-
gl_FragColor.g *= 2.0 * uColor.g;
|
|
90
|
-
} else {
|
|
91
|
-
gl_FragColor.g = 1.0 - 2.0 * (1.0 - gl_FragColor.g) * (1.0 - uColor.g);
|
|
92
|
-
}
|
|
93
|
-
if (uColor.b < 0.5) {
|
|
94
|
-
gl_FragColor.b *= 2.0 * uColor.b;
|
|
95
|
-
} else {
|
|
96
|
-
gl_FragColor.b = 1.0 - 2.0 * (1.0 - gl_FragColor.b) * (1.0 - uColor.b);
|
|
97
|
-
}
|
|
98
|
-
`,tint:`
|
|
99
|
-
gl_FragColor.rgb *= (1.0 - uColor.a);
|
|
100
|
-
gl_FragColor.rgb += uColor.rgb;
|
|
101
|
-
`};class He extends K{getCacheKey(){return`${this.type}_${this.mode}`}getFragmentSource(){return`
|
|
102
|
-
precision highp float;
|
|
103
|
-
uniform sampler2D uTexture;
|
|
104
|
-
uniform vec4 uColor;
|
|
105
|
-
varying vec2 vTexCoord;
|
|
106
|
-
void main() {
|
|
107
|
-
vec4 color = texture2D(uTexture, vTexCoord);
|
|
108
|
-
gl_FragColor = color;
|
|
109
|
-
if (color.a > 0.0) {
|
|
110
|
-
${pc[this.mode]}
|
|
111
|
-
}
|
|
112
|
-
}
|
|
113
|
-
`}applyTo2d(t){let{imageData:{data:e}}=t;const s=new I(this.color).getSource(),i=this.alpha,r=s[0]*i,n=s[1]*i,a=s[2]*i,l=1-i;for(let h=0;h<e.length;h+=4){const c=e[h],d=e[h+1],g=e[h+2];let f,p,y;switch(this.mode){case"multiply":f=c*r/255,p=d*n/255,y=g*a/255;break;case"screen":f=255-(255-c)*(255-r)/255,p=255-(255-d)*(255-n)/255,y=255-(255-g)*(255-a)/255;break;case"add":f=c+r,p=d+n,y=g+a;break;case"difference":f=Math.abs(c-r),p=Math.abs(d-n),y=Math.abs(g-a);break;case"subtract":f=c-r,p=d-n,y=g-a;break;case"darken":f=Math.min(c,r),p=Math.min(d,n),y=Math.min(g,a);break;case"lighten":f=Math.max(c,r),p=Math.max(d,n),y=Math.max(g,a);break;case"overlay":f=r<128?2*c*r/255:255-2*(255-c)*(255-r)/255,p=n<128?2*d*n/255:255-2*(255-d)*(255-n)/255,y=a<128?2*g*a/255:255-2*(255-g)*(255-a)/255;break;case"exclusion":f=r+c-2*r*c/255,p=n+d-2*n*d/255,y=a+g-2*a*g/255;break;case"tint":f=r+c*l,p=n+d*l,y=a+g*l}e[h]=f,e[h+1]=p,e[h+2]=y}}sendUniformData(t,e){const s=new I(this.color).getSource();s[0]=this.alpha*s[0]/255,s[1]=this.alpha*s[1]/255,s[2]=this.alpha*s[2]/255,s[3]=this.alpha,t.uniform4fv(e.uColor,s)}}m(He,"defaults",{color:"#F95C63",mode:"multiply",alpha:1}),m(He,"type","BlendColor"),m(He,"uniformLocations",["uColor"]),T.setClass(He);const mc={multiply:`
|
|
114
|
-
precision highp float;
|
|
115
|
-
uniform sampler2D uTexture;
|
|
116
|
-
uniform sampler2D uImage;
|
|
117
|
-
uniform vec4 uColor;
|
|
118
|
-
varying vec2 vTexCoord;
|
|
119
|
-
varying vec2 vTexCoord2;
|
|
120
|
-
void main() {
|
|
121
|
-
vec4 color = texture2D(uTexture, vTexCoord);
|
|
122
|
-
vec4 color2 = texture2D(uImage, vTexCoord2);
|
|
123
|
-
color.rgba *= color2.rgba;
|
|
124
|
-
gl_FragColor = color;
|
|
125
|
-
}
|
|
126
|
-
`,mask:`
|
|
127
|
-
precision highp float;
|
|
128
|
-
uniform sampler2D uTexture;
|
|
129
|
-
uniform sampler2D uImage;
|
|
130
|
-
uniform vec4 uColor;
|
|
131
|
-
varying vec2 vTexCoord;
|
|
132
|
-
varying vec2 vTexCoord2;
|
|
133
|
-
void main() {
|
|
134
|
-
vec4 color = texture2D(uTexture, vTexCoord);
|
|
135
|
-
vec4 color2 = texture2D(uImage, vTexCoord2);
|
|
136
|
-
color.a = color2.a;
|
|
137
|
-
gl_FragColor = color;
|
|
138
|
-
}
|
|
139
|
-
`};class Ge extends K{getCacheKey(){return`${this.type}_${this.mode}`}getFragmentSource(){return mc[this.mode]}getVertexSource(){return`
|
|
140
|
-
attribute vec2 aPosition;
|
|
141
|
-
varying vec2 vTexCoord;
|
|
142
|
-
varying vec2 vTexCoord2;
|
|
143
|
-
uniform mat3 uTransformMatrix;
|
|
144
|
-
void main() {
|
|
145
|
-
vTexCoord = aPosition;
|
|
146
|
-
vTexCoord2 = (uTransformMatrix * vec3(aPosition, 1.0)).xy;
|
|
147
|
-
gl_Position = vec4(aPosition * 2.0 - 1.0, 0.0, 1.0);
|
|
148
|
-
}
|
|
149
|
-
`}applyToWebGL(t){const e=t.context,s=this.createTexture(t.filterBackend,this.image);this.bindAdditionalTexture(e,s,e.TEXTURE1),super.applyToWebGL(t),this.unbindAdditionalTexture(e,e.TEXTURE1)}createTexture(t,e){return t.getCachedTexture(e.cacheKey,e.getElement())}calculateMatrix(){const t=this.image,{width:e,height:s}=t.getElement();return[1/t.scaleX,0,0,0,1/t.scaleY,0,-t.left/e,-t.top/s,1]}applyTo2d(t){let{imageData:{data:e,width:s,height:i},filterBackend:{resources:r}}=t;const n=this.image;r.blendImage||(r.blendImage=Rt());const a=r.blendImage,l=a.getContext("2d");a.width!==s||a.height!==i?(a.width=s,a.height=i):l.clearRect(0,0,s,i),l.setTransform(n.scaleX,0,0,n.scaleY,n.left,n.top),l.drawImage(n.getElement(),0,0,s,i);const h=l.getImageData(0,0,s,i).data;for(let c=0;c<e.length;c+=4){const d=e[c],g=e[c+1],f=e[c+2],p=e[c+3],y=h[c],v=h[c+1],x=h[c+2],b=h[c+3];switch(this.mode){case"multiply":e[c]=d*y/255,e[c+1]=g*v/255,e[c+2]=f*x/255,e[c+3]=p*b/255;break;case"mask":e[c+3]=b}}}sendUniformData(t,e){const s=this.calculateMatrix();t.uniform1i(e.uImage,1),t.uniformMatrix3fv(e.uTransformMatrix,!1,s)}toObject(){return{...super.toObject(),image:this.image&&this.image.toObject()}}static async fromObject(t,e){let{type:s,image:i,...r}=t;return dt.fromObject(i,e).then(n=>new this({...r,image:n}))}}m(Ge,"type","BlendImage"),m(Ge,"defaults",{mode:"multiply",alpha:1}),m(Ge,"uniformLocations",["uTransformMatrix","uImage"]),T.setClass(Ge);class Ue extends K{getFragmentSource(){return`
|
|
150
|
-
precision highp float;
|
|
151
|
-
uniform sampler2D uTexture;
|
|
152
|
-
uniform vec2 uDelta;
|
|
153
|
-
varying vec2 vTexCoord;
|
|
154
|
-
const float nSamples = 15.0;
|
|
155
|
-
vec3 v3offset = vec3(12.9898, 78.233, 151.7182);
|
|
156
|
-
float random(vec3 scale) {
|
|
157
|
-
/* use the fragment position for a different seed per-pixel */
|
|
158
|
-
return fract(sin(dot(gl_FragCoord.xyz, scale)) * 43758.5453);
|
|
159
|
-
}
|
|
160
|
-
void main() {
|
|
161
|
-
vec4 color = vec4(0.0);
|
|
162
|
-
float totalC = 0.0;
|
|
163
|
-
float totalA = 0.0;
|
|
164
|
-
float offset = random(v3offset);
|
|
165
|
-
for (float t = -nSamples; t <= nSamples; t++) {
|
|
166
|
-
float percent = (t + offset - 0.5) / nSamples;
|
|
167
|
-
vec4 sample = texture2D(uTexture, vTexCoord + uDelta * percent);
|
|
168
|
-
float weight = 1.0 - abs(percent);
|
|
169
|
-
float alpha = weight * sample.a;
|
|
170
|
-
color.rgb += sample.rgb * alpha;
|
|
171
|
-
color.a += alpha;
|
|
172
|
-
totalA += weight;
|
|
173
|
-
totalC += alpha;
|
|
174
|
-
}
|
|
175
|
-
gl_FragColor.rgb = color.rgb / totalC;
|
|
176
|
-
gl_FragColor.a = color.a / totalA;
|
|
177
|
-
}
|
|
178
|
-
`}applyTo(t){Hs(t)?(this.aspectRatio=t.sourceWidth/t.sourceHeight,t.passes++,this._setupFrameBuffer(t),this.horizontal=!0,this.applyToWebGL(t),this._swapTextures(t),this._setupFrameBuffer(t),this.horizontal=!1,this.applyToWebGL(t),this._swapTextures(t)):this.applyTo2d(t)}applyTo2d(t){let{imageData:{data:e,width:s,height:i}}=t;this.aspectRatio=s/i,this.horizontal=!0;let r=this.getBlurValue()*s;const n=new Uint8ClampedArray(e),a=15,l=4*s;for(let h=0;h<e.length;h+=4){let c=0,d=0,g=0,f=0,p=0;const y=h-h%l,v=y+l;for(let x=-14;x<a;x++){const b=x/a,w=4*Math.floor(r*b),C=1-Math.abs(b);let S=h+w;S<y?S=y:S>v&&(S=v);const O=e[S+3]*C;c+=e[S]*O,d+=e[S+1]*O,g+=e[S+2]*O,f+=O,p+=C}n[h]=c/f,n[h+1]=d/f,n[h+2]=g/f,n[h+3]=f/p}this.horizontal=!1,r=this.getBlurValue()*i;for(let h=0;h<n.length;h+=4){let c=0,d=0,g=0,f=0,p=0;const y=h%l,v=n.length-l+y;for(let x=-14;x<a;x++){const b=x/a,w=Math.floor(r*b)*l,C=1-Math.abs(b);let S=h+w;S<y?S=y:S>v&&(S=v);const O=n[S+3]*C;c+=n[S]*O,d+=n[S+1]*O,g+=n[S+2]*O,f+=O,p+=C}e[h]=c/f,e[h+1]=d/f,e[h+2]=g/f,e[h+3]=f/p}}sendUniformData(t,e){const s=this.chooseRightDelta();t.uniform2fv(e.uDelta,s)}isNeutralState(){return this.blur===0}getBlurValue(){let t=1;const{horizontal:e,aspectRatio:s}=this;return e?s>1&&(t=1/s):s<1&&(t=s),t*this.blur*.12}chooseRightDelta(){const t=this.getBlurValue();return this.horizontal?[t,0]:[0,t]}}m(Ue,"type","Blur"),m(Ue,"defaults",{blur:0}),m(Ue,"uniformLocations",["uDelta"]),T.setClass(Ue);class qe extends K{getFragmentSource(){return`
|
|
179
|
-
precision highp float;
|
|
180
|
-
uniform sampler2D uTexture;
|
|
181
|
-
uniform float uBrightness;
|
|
182
|
-
varying vec2 vTexCoord;
|
|
183
|
-
void main() {
|
|
184
|
-
vec4 color = texture2D(uTexture, vTexCoord);
|
|
185
|
-
color.rgb += uBrightness;
|
|
186
|
-
gl_FragColor = color;
|
|
187
|
-
}
|
|
188
|
-
`}applyTo2d(t){let{imageData:{data:e}}=t;const s=Math.round(255*this.brightness);for(let i=0;i<e.length;i+=4)e[i]+=s,e[i+1]+=s,e[i+2]+=s}isNeutralState(){return this.brightness===0}sendUniformData(t,e){t.uniform1f(e.uBrightness,this.brightness)}}m(qe,"type","Brightness"),m(qe,"defaults",{brightness:0}),m(qe,"uniformLocations",["uBrightness"]),T.setClass(qe);const bn={matrix:[1,0,0,0,0,0,1,0,0,0,0,0,1,0,0,0,0,0,1,0],colorsOnly:!0};class he extends K{getFragmentSource(){return`
|
|
189
|
-
precision highp float;
|
|
190
|
-
uniform sampler2D uTexture;
|
|
191
|
-
varying vec2 vTexCoord;
|
|
192
|
-
uniform mat4 uColorMatrix;
|
|
193
|
-
uniform vec4 uConstants;
|
|
194
|
-
void main() {
|
|
195
|
-
vec4 color = texture2D(uTexture, vTexCoord);
|
|
196
|
-
color *= uColorMatrix;
|
|
197
|
-
color += uConstants;
|
|
198
|
-
gl_FragColor = color;
|
|
199
|
-
}`}applyTo2d(t){const e=t.imageData.data,s=this.matrix,i=this.colorsOnly;for(let r=0;r<e.length;r+=4){const n=e[r],a=e[r+1],l=e[r+2];if(e[r]=n*s[0]+a*s[1]+l*s[2]+255*s[4],e[r+1]=n*s[5]+a*s[6]+l*s[7]+255*s[9],e[r+2]=n*s[10]+a*s[11]+l*s[12]+255*s[14],!i){const h=e[r+3];e[r]+=h*s[3],e[r+1]+=h*s[8],e[r+2]+=h*s[13],e[r+3]=n*s[15]+a*s[16]+l*s[17]+h*s[18]+255*s[19]}}}sendUniformData(t,e){const s=this.matrix,i=[s[0],s[1],s[2],s[3],s[5],s[6],s[7],s[8],s[10],s[11],s[12],s[13],s[15],s[16],s[17],s[18]],r=[s[4],s[9],s[14],s[19]];t.uniformMatrix4fv(e.uColorMatrix,!1,i),t.uniform4fv(e.uConstants,r)}toObject(){return{...super.toObject(),matrix:[...this.matrix]}}}function ce(o,t){var e;const s=(m(e=class extends he{toObject(){return{type:this.type,colorsOnly:this.colorsOnly}}},"type",o),m(e,"defaults",{colorsOnly:!1,matrix:t}),e);return T.setClass(s,o),s}m(he,"type","ColorMatrix"),m(he,"defaults",bn),m(he,"uniformLocations",["uColorMatrix","uConstants"]),T.setClass(he);const yc=ce("Brownie",[.5997,.34553,-.27082,0,.186,-.0377,.86095,.15059,0,-.1449,.24113,-.07441,.44972,0,-.02965,0,0,0,1,0]),vc=ce("Vintage",[.62793,.32021,-.03965,0,.03784,.02578,.64411,.03259,0,.02926,.0466,-.08512,.52416,0,.02023,0,0,0,1,0]),_c=ce("Kodachrome",[1.12855,-.39673,-.03992,0,.24991,-.16404,1.08352,-.05498,0,.09698,-.16786,-.56034,1.60148,0,.13972,0,0,0,1,0]),xc=ce("Technicolor",[1.91252,-.85453,-.09155,0,.04624,-.30878,1.76589,-.10601,0,-.27589,-.2311,-.75018,1.84759,0,.12137,0,0,0,1,0]),bc=ce("Polaroid",[1.438,-.062,-.062,0,0,-.122,1.378,-.122,0,0,-.016,-.016,1.483,0,0,0,0,0,1,0]),Cc=ce("Sepia",[.393,.769,.189,0,0,.349,.686,.168,0,0,.272,.534,.131,0,0,0,0,0,1,0]),wc=ce("BlackWhite",[1.5,1.5,1.5,0,-1,1.5,1.5,1.5,0,-1,1.5,1.5,1.5,0,-1,0,0,0,1,0]);class $i extends K{constructor(){let t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{};super(t),this.subFilters=t.subFilters||[]}applyTo(t){Hs(t)&&(t.passes+=this.subFilters.length-1),this.subFilters.forEach(e=>{e.applyTo(t)})}toObject(){return{type:this.type,subFilters:this.subFilters.map(t=>t.toObject())}}isNeutralState(){return!this.subFilters.some(t=>!t.isNeutralState())}static fromObject(t,e){return Promise.all((t.subFilters||[]).map(s=>T.getClass(s.type).fromObject(s,e))).then(s=>new this({subFilters:s}))}}m($i,"type","Composed"),T.setClass($i);class Ke extends K{getFragmentSource(){return`
|
|
200
|
-
precision highp float;
|
|
201
|
-
uniform sampler2D uTexture;
|
|
202
|
-
uniform float uContrast;
|
|
203
|
-
varying vec2 vTexCoord;
|
|
204
|
-
void main() {
|
|
205
|
-
vec4 color = texture2D(uTexture, vTexCoord);
|
|
206
|
-
float contrastF = 1.015 * (uContrast + 1.0) / (1.0 * (1.015 - uContrast));
|
|
207
|
-
color.rgb = contrastF * (color.rgb - 0.5) + 0.5;
|
|
208
|
-
gl_FragColor = color;
|
|
209
|
-
}`}isNeutralState(){return this.contrast===0}applyTo2d(t){let{imageData:{data:e}}=t;const s=Math.floor(255*this.contrast),i=259*(s+255)/(255*(259-s));for(let r=0;r<e.length;r+=4)e[r]=i*(e[r]-128)+128,e[r+1]=i*(e[r+1]-128)+128,e[r+2]=i*(e[r+2]-128)+128}sendUniformData(t,e){t.uniform1f(e.uContrast,this.contrast)}}m(Ke,"type","Contrast"),m(Ke,"defaults",{contrast:0}),m(Ke,"uniformLocations",["uContrast"]),T.setClass(Ke);const Sc={Convolute_3_1:`
|
|
210
|
-
precision highp float;
|
|
211
|
-
uniform sampler2D uTexture;
|
|
212
|
-
uniform float uMatrix[9];
|
|
213
|
-
uniform float uStepW;
|
|
214
|
-
uniform float uStepH;
|
|
215
|
-
varying vec2 vTexCoord;
|
|
216
|
-
void main() {
|
|
217
|
-
vec4 color = vec4(0, 0, 0, 0);
|
|
218
|
-
for (float h = 0.0; h < 3.0; h+=1.0) {
|
|
219
|
-
for (float w = 0.0; w < 3.0; w+=1.0) {
|
|
220
|
-
vec2 matrixPos = vec2(uStepW * (w - 1), uStepH * (h - 1));
|
|
221
|
-
color += texture2D(uTexture, vTexCoord + matrixPos) * uMatrix[int(h * 3.0 + w)];
|
|
222
|
-
}
|
|
223
|
-
}
|
|
224
|
-
gl_FragColor = color;
|
|
225
|
-
}
|
|
226
|
-
`,Convolute_3_0:`
|
|
227
|
-
precision highp float;
|
|
228
|
-
uniform sampler2D uTexture;
|
|
229
|
-
uniform float uMatrix[9];
|
|
230
|
-
uniform float uStepW;
|
|
231
|
-
uniform float uStepH;
|
|
232
|
-
varying vec2 vTexCoord;
|
|
233
|
-
void main() {
|
|
234
|
-
vec4 color = vec4(0, 0, 0, 1);
|
|
235
|
-
for (float h = 0.0; h < 3.0; h+=1.0) {
|
|
236
|
-
for (float w = 0.0; w < 3.0; w+=1.0) {
|
|
237
|
-
vec2 matrixPos = vec2(uStepW * (w - 1.0), uStepH * (h - 1.0));
|
|
238
|
-
color.rgb += texture2D(uTexture, vTexCoord + matrixPos).rgb * uMatrix[int(h * 3.0 + w)];
|
|
239
|
-
}
|
|
240
|
-
}
|
|
241
|
-
float alpha = texture2D(uTexture, vTexCoord).a;
|
|
242
|
-
gl_FragColor = color;
|
|
243
|
-
gl_FragColor.a = alpha;
|
|
244
|
-
}
|
|
245
|
-
`,Convolute_5_1:`
|
|
246
|
-
precision highp float;
|
|
247
|
-
uniform sampler2D uTexture;
|
|
248
|
-
uniform float uMatrix[25];
|
|
249
|
-
uniform float uStepW;
|
|
250
|
-
uniform float uStepH;
|
|
251
|
-
varying vec2 vTexCoord;
|
|
252
|
-
void main() {
|
|
253
|
-
vec4 color = vec4(0, 0, 0, 0);
|
|
254
|
-
for (float h = 0.0; h < 5.0; h+=1.0) {
|
|
255
|
-
for (float w = 0.0; w < 5.0; w+=1.0) {
|
|
256
|
-
vec2 matrixPos = vec2(uStepW * (w - 2.0), uStepH * (h - 2.0));
|
|
257
|
-
color += texture2D(uTexture, vTexCoord + matrixPos) * uMatrix[int(h * 5.0 + w)];
|
|
258
|
-
}
|
|
259
|
-
}
|
|
260
|
-
gl_FragColor = color;
|
|
261
|
-
}
|
|
262
|
-
`,Convolute_5_0:`
|
|
263
|
-
precision highp float;
|
|
264
|
-
uniform sampler2D uTexture;
|
|
265
|
-
uniform float uMatrix[25];
|
|
266
|
-
uniform float uStepW;
|
|
267
|
-
uniform float uStepH;
|
|
268
|
-
varying vec2 vTexCoord;
|
|
269
|
-
void main() {
|
|
270
|
-
vec4 color = vec4(0, 0, 0, 1);
|
|
271
|
-
for (float h = 0.0; h < 5.0; h+=1.0) {
|
|
272
|
-
for (float w = 0.0; w < 5.0; w+=1.0) {
|
|
273
|
-
vec2 matrixPos = vec2(uStepW * (w - 2.0), uStepH * (h - 2.0));
|
|
274
|
-
color.rgb += texture2D(uTexture, vTexCoord + matrixPos).rgb * uMatrix[int(h * 5.0 + w)];
|
|
275
|
-
}
|
|
276
|
-
}
|
|
277
|
-
float alpha = texture2D(uTexture, vTexCoord).a;
|
|
278
|
-
gl_FragColor = color;
|
|
279
|
-
gl_FragColor.a = alpha;
|
|
280
|
-
}
|
|
281
|
-
`,Convolute_7_1:`
|
|
282
|
-
precision highp float;
|
|
283
|
-
uniform sampler2D uTexture;
|
|
284
|
-
uniform float uMatrix[49];
|
|
285
|
-
uniform float uStepW;
|
|
286
|
-
uniform float uStepH;
|
|
287
|
-
varying vec2 vTexCoord;
|
|
288
|
-
void main() {
|
|
289
|
-
vec4 color = vec4(0, 0, 0, 0);
|
|
290
|
-
for (float h = 0.0; h < 7.0; h+=1.0) {
|
|
291
|
-
for (float w = 0.0; w < 7.0; w+=1.0) {
|
|
292
|
-
vec2 matrixPos = vec2(uStepW * (w - 3.0), uStepH * (h - 3.0));
|
|
293
|
-
color += texture2D(uTexture, vTexCoord + matrixPos) * uMatrix[int(h * 7.0 + w)];
|
|
294
|
-
}
|
|
295
|
-
}
|
|
296
|
-
gl_FragColor = color;
|
|
297
|
-
}
|
|
298
|
-
`,Convolute_7_0:`
|
|
299
|
-
precision highp float;
|
|
300
|
-
uniform sampler2D uTexture;
|
|
301
|
-
uniform float uMatrix[49];
|
|
302
|
-
uniform float uStepW;
|
|
303
|
-
uniform float uStepH;
|
|
304
|
-
varying vec2 vTexCoord;
|
|
305
|
-
void main() {
|
|
306
|
-
vec4 color = vec4(0, 0, 0, 1);
|
|
307
|
-
for (float h = 0.0; h < 7.0; h+=1.0) {
|
|
308
|
-
for (float w = 0.0; w < 7.0; w+=1.0) {
|
|
309
|
-
vec2 matrixPos = vec2(uStepW * (w - 3.0), uStepH * (h - 3.0));
|
|
310
|
-
color.rgb += texture2D(uTexture, vTexCoord + matrixPos).rgb * uMatrix[int(h * 7.0 + w)];
|
|
311
|
-
}
|
|
312
|
-
}
|
|
313
|
-
float alpha = texture2D(uTexture, vTexCoord).a;
|
|
314
|
-
gl_FragColor = color;
|
|
315
|
-
gl_FragColor.a = alpha;
|
|
316
|
-
}
|
|
317
|
-
`,Convolute_9_1:`
|
|
318
|
-
precision highp float;
|
|
319
|
-
uniform sampler2D uTexture;
|
|
320
|
-
uniform float uMatrix[81];
|
|
321
|
-
uniform float uStepW;
|
|
322
|
-
uniform float uStepH;
|
|
323
|
-
varying vec2 vTexCoord;
|
|
324
|
-
void main() {
|
|
325
|
-
vec4 color = vec4(0, 0, 0, 0);
|
|
326
|
-
for (float h = 0.0; h < 9.0; h+=1.0) {
|
|
327
|
-
for (float w = 0.0; w < 9.0; w+=1.0) {
|
|
328
|
-
vec2 matrixPos = vec2(uStepW * (w - 4.0), uStepH * (h - 4.0));
|
|
329
|
-
color += texture2D(uTexture, vTexCoord + matrixPos) * uMatrix[int(h * 9.0 + w)];
|
|
330
|
-
}
|
|
331
|
-
}
|
|
332
|
-
gl_FragColor = color;
|
|
333
|
-
}
|
|
334
|
-
`,Convolute_9_0:`
|
|
335
|
-
precision highp float;
|
|
336
|
-
uniform sampler2D uTexture;
|
|
337
|
-
uniform float uMatrix[81];
|
|
338
|
-
uniform float uStepW;
|
|
339
|
-
uniform float uStepH;
|
|
340
|
-
varying vec2 vTexCoord;
|
|
341
|
-
void main() {
|
|
342
|
-
vec4 color = vec4(0, 0, 0, 1);
|
|
343
|
-
for (float h = 0.0; h < 9.0; h+=1.0) {
|
|
344
|
-
for (float w = 0.0; w < 9.0; w+=1.0) {
|
|
345
|
-
vec2 matrixPos = vec2(uStepW * (w - 4.0), uStepH * (h - 4.0));
|
|
346
|
-
color.rgb += texture2D(uTexture, vTexCoord + matrixPos).rgb * uMatrix[int(h * 9.0 + w)];
|
|
347
|
-
}
|
|
348
|
-
}
|
|
349
|
-
float alpha = texture2D(uTexture, vTexCoord).a;
|
|
350
|
-
gl_FragColor = color;
|
|
351
|
-
gl_FragColor.a = alpha;
|
|
352
|
-
}
|
|
353
|
-
`};class Ze extends K{getCacheKey(){return`${this.type}_${Math.sqrt(this.matrix.length)}_${this.opaque?1:0}`}getFragmentSource(){return Sc[this.getCacheKey()]}applyTo2d(t){const e=t.imageData,s=e.data,i=this.matrix,r=Math.round(Math.sqrt(i.length)),n=Math.floor(r/2),a=e.width,l=e.height,h=t.ctx.createImageData(a,l),c=h.data,d=this.opaque?1:0;let g,f,p,y,v,x,b,w,C,S,O,D,k;for(O=0;O<l;O++)for(S=0;S<a;S++){for(v=4*(O*a+S),g=0,f=0,p=0,y=0,k=0;k<r;k++)for(D=0;D<r;D++)b=O+k-n,x=S+D-n,b<0||b>=l||x<0||x>=a||(w=4*(b*a+x),C=i[k*r+D],g+=s[w]*C,f+=s[w+1]*C,p+=s[w+2]*C,d||(y+=s[w+3]*C));c[v]=g,c[v+1]=f,c[v+2]=p,c[v+3]=d?s[v+3]:y}t.imageData=h}sendUniformData(t,e){t.uniform1fv(e.uMatrix,this.matrix)}toObject(){return{...super.toObject(),opaque:this.opaque,matrix:[...this.matrix]}}}m(Ze,"type","Convolute"),m(Ze,"defaults",{opaque:!1,matrix:[0,0,0,0,1,0,0,0,0]}),m(Ze,"uniformLocations",["uMatrix","uOpaque","uHalfSize","uSize"]),T.setClass(Ze);const Cn="Gamma";class Je extends K{getFragmentSource(){return`
|
|
354
|
-
precision highp float;
|
|
355
|
-
uniform sampler2D uTexture;
|
|
356
|
-
uniform vec3 uGamma;
|
|
357
|
-
varying vec2 vTexCoord;
|
|
358
|
-
void main() {
|
|
359
|
-
vec4 color = texture2D(uTexture, vTexCoord);
|
|
360
|
-
vec3 correction = (1.0 / uGamma);
|
|
361
|
-
color.r = pow(color.r, correction.r);
|
|
362
|
-
color.g = pow(color.g, correction.g);
|
|
363
|
-
color.b = pow(color.b, correction.b);
|
|
364
|
-
gl_FragColor = color;
|
|
365
|
-
gl_FragColor.rgb *= color.a;
|
|
366
|
-
}
|
|
367
|
-
`}constructor(){let t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{};super(t),this.gamma=t.gamma||this.constructor.defaults.gamma.concat()}applyTo2d(t){let{imageData:{data:e}}=t;const s=this.gamma,i=1/s[0],r=1/s[1],n=1/s[2];this.rgbValues||(this.rgbValues={r:new Uint8Array(256),g:new Uint8Array(256),b:new Uint8Array(256)});const a=this.rgbValues;for(let l=0;l<256;l++)a.r[l]=255*Math.pow(l/255,i),a.g[l]=255*Math.pow(l/255,r),a.b[l]=255*Math.pow(l/255,n);for(let l=0;l<e.length;l+=4)e[l]=a.r[e[l]],e[l+1]=a.g[e[l+1]],e[l+2]=a.b[e[l+2]]}sendUniformData(t,e){t.uniform3fv(e.uGamma,this.gamma)}isNeutralState(){const{gamma:t}=this;return t[0]===1&&t[1]===1&&t[2]===1}toObject(){return{type:Cn,gamma:this.gamma.concat()}}}m(Je,"type",Cn),m(Je,"defaults",{gamma:[1,1,1]}),m(Je,"uniformLocations",["uGamma"]),T.setClass(Je);const Tc={average:`
|
|
368
|
-
precision highp float;
|
|
369
|
-
uniform sampler2D uTexture;
|
|
370
|
-
varying vec2 vTexCoord;
|
|
371
|
-
void main() {
|
|
372
|
-
vec4 color = texture2D(uTexture, vTexCoord);
|
|
373
|
-
float average = (color.r + color.b + color.g) / 3.0;
|
|
374
|
-
gl_FragColor = vec4(average, average, average, color.a);
|
|
375
|
-
}
|
|
376
|
-
`,lightness:`
|
|
377
|
-
precision highp float;
|
|
378
|
-
uniform sampler2D uTexture;
|
|
379
|
-
uniform int uMode;
|
|
380
|
-
varying vec2 vTexCoord;
|
|
381
|
-
void main() {
|
|
382
|
-
vec4 col = texture2D(uTexture, vTexCoord);
|
|
383
|
-
float average = (max(max(col.r, col.g),col.b) + min(min(col.r, col.g),col.b)) / 2.0;
|
|
384
|
-
gl_FragColor = vec4(average, average, average, col.a);
|
|
385
|
-
}
|
|
386
|
-
`,luminosity:`
|
|
387
|
-
precision highp float;
|
|
388
|
-
uniform sampler2D uTexture;
|
|
389
|
-
uniform int uMode;
|
|
390
|
-
varying vec2 vTexCoord;
|
|
391
|
-
void main() {
|
|
392
|
-
vec4 col = texture2D(uTexture, vTexCoord);
|
|
393
|
-
float average = 0.21 * col.r + 0.72 * col.g + 0.07 * col.b;
|
|
394
|
-
gl_FragColor = vec4(average, average, average, col.a);
|
|
395
|
-
}
|
|
396
|
-
`};class Qe extends K{applyTo2d(t){let{imageData:{data:e}}=t;for(let s,i=0;i<e.length;i+=4){const r=e[i],n=e[i+1],a=e[i+2];switch(this.mode){case"average":s=(r+n+a)/3;break;case"lightness":s=(Math.min(r,n,a)+Math.max(r,n,a))/2;break;case"luminosity":s=.21*r+.72*n+.07*a}e[i+2]=e[i+1]=e[i]=s}}getCacheKey(){return`${this.type}_${this.mode}`}getFragmentSource(){return Tc[this.mode]}sendUniformData(t,e){t.uniform1i(e.uMode,1)}isNeutralState(){return!1}}m(Qe,"type","Grayscale"),m(Qe,"defaults",{mode:"average"}),m(Qe,"uniformLocations",["uMode"]),T.setClass(Qe);const kc={...bn,rotation:0};class Gs extends he{calculateMatrix(){const t=this.rotation*Math.PI,e=Lt(t),s=Bt(t),i=1/3,r=Math.sqrt(i)*s,n=1-e;this.matrix=[e+n/3,i*n-r,i*n+r,0,0,i*n+r,e+i*n,i*n-r,0,0,i*n-r,i*n+r,e+i*n,0,0,0,0,0,1,0]}isNeutralState(){return this.rotation===0}applyTo(t){this.calculateMatrix(),super.applyTo(t)}toObject(){return{type:this.type,rotation:this.rotation}}}m(Gs,"type","HueRotation"),m(Gs,"defaults",kc),T.setClass(Gs);class ts extends K{applyTo2d(t){let{imageData:{data:e}}=t;for(let s=0;s<e.length;s+=4)e[s]=255-e[s],e[s+1]=255-e[s+1],e[s+2]=255-e[s+2],this.alpha&&(e[s+3]=255-e[s+3])}getFragmentSource(){return`
|
|
397
|
-
precision highp float;
|
|
398
|
-
uniform sampler2D uTexture;
|
|
399
|
-
uniform int uInvert;
|
|
400
|
-
uniform int uAlpha;
|
|
401
|
-
varying vec2 vTexCoord;
|
|
402
|
-
void main() {
|
|
403
|
-
vec4 color = texture2D(uTexture, vTexCoord);
|
|
404
|
-
if (uInvert == 1) {
|
|
405
|
-
if (uAlpha == 1) {
|
|
406
|
-
gl_FragColor = vec4(1.0 - color.r,1.0 -color.g,1.0 -color.b,1.0 -color.a);
|
|
407
|
-
} else {
|
|
408
|
-
gl_FragColor = vec4(1.0 - color.r,1.0 -color.g,1.0 -color.b,color.a);
|
|
409
|
-
}
|
|
410
|
-
} else {
|
|
411
|
-
gl_FragColor = color;
|
|
412
|
-
}
|
|
413
|
-
}
|
|
414
|
-
`}isNeutralState(){return!this.invert}sendUniformData(t,e){t.uniform1i(e.uInvert,Number(this.invert)),t.uniform1i(e.uAlpha,Number(this.alpha))}}m(ts,"type","Invert"),m(ts,"defaults",{alpha:!1,invert:!0}),m(ts,"uniformLocations",["uInvert","uAlpha"]),T.setClass(ts);class es extends K{getFragmentSource(){return`
|
|
415
|
-
precision highp float;
|
|
416
|
-
uniform sampler2D uTexture;
|
|
417
|
-
uniform float uStepH;
|
|
418
|
-
uniform float uNoise;
|
|
419
|
-
uniform float uSeed;
|
|
420
|
-
varying vec2 vTexCoord;
|
|
421
|
-
float rand(vec2 co, float seed, float vScale) {
|
|
422
|
-
return fract(sin(dot(co.xy * vScale ,vec2(12.9898 , 78.233))) * 43758.5453 * (seed + 0.01) / 2.0);
|
|
423
|
-
}
|
|
424
|
-
void main() {
|
|
425
|
-
vec4 color = texture2D(uTexture, vTexCoord);
|
|
426
|
-
color.rgb += (0.5 - rand(vTexCoord, uSeed, 0.1 / uStepH)) * uNoise;
|
|
427
|
-
gl_FragColor = color;
|
|
428
|
-
}
|
|
429
|
-
`}applyTo2d(t){let{imageData:{data:e}}=t;const s=this.noise;for(let i=0;i<e.length;i+=4){const r=(.5-Math.random())*s;e[i]+=r,e[i+1]+=r,e[i+2]+=r}}sendUniformData(t,e){t.uniform1f(e.uNoise,this.noise/255),t.uniform1f(e.uSeed,Math.random())}isNeutralState(){return this.noise===0}}m(es,"type","Noise"),m(es,"defaults",{noise:0}),m(es,"uniformLocations",["uNoise","uSeed"]),T.setClass(es);class ss extends K{applyTo2d(t){let{imageData:{data:e,width:s,height:i}}=t;for(let r=0;r<i;r+=this.blocksize)for(let n=0;n<s;n+=this.blocksize){const a=4*r*s+4*n,l=e[a],h=e[a+1],c=e[a+2],d=e[a+3];for(let g=r;g<Math.min(r+this.blocksize,i);g++)for(let f=n;f<Math.min(n+this.blocksize,s);f++){const p=4*g*s+4*f;e[p]=l,e[p+1]=h,e[p+2]=c,e[p+3]=d}}}isNeutralState(){return this.blocksize===1}getFragmentSource(){return`
|
|
430
|
-
precision highp float;
|
|
431
|
-
uniform sampler2D uTexture;
|
|
432
|
-
uniform float uBlocksize;
|
|
433
|
-
uniform float uStepW;
|
|
434
|
-
uniform float uStepH;
|
|
435
|
-
varying vec2 vTexCoord;
|
|
436
|
-
void main() {
|
|
437
|
-
float blockW = uBlocksize * uStepW;
|
|
438
|
-
float blockH = uBlocksize * uStepH;
|
|
439
|
-
int posX = int(vTexCoord.x / blockW);
|
|
440
|
-
int posY = int(vTexCoord.y / blockH);
|
|
441
|
-
float fposX = float(posX);
|
|
442
|
-
float fposY = float(posY);
|
|
443
|
-
vec2 squareCoords = vec2(fposX * blockW, fposY * blockH);
|
|
444
|
-
vec4 color = texture2D(uTexture, squareCoords);
|
|
445
|
-
gl_FragColor = color;
|
|
446
|
-
}
|
|
447
|
-
`}sendUniformData(t,e){t.uniform1f(e.uBlocksize,this.blocksize)}}m(ss,"type","Pixelate"),m(ss,"defaults",{blocksize:4}),m(ss,"uniformLocations",["uBlocksize"]),T.setClass(ss);class is extends K{getFragmentSource(){return`
|
|
448
|
-
precision highp float;
|
|
449
|
-
uniform sampler2D uTexture;
|
|
450
|
-
uniform vec4 uLow;
|
|
451
|
-
uniform vec4 uHigh;
|
|
452
|
-
varying vec2 vTexCoord;
|
|
453
|
-
void main() {
|
|
454
|
-
gl_FragColor = texture2D(uTexture, vTexCoord);
|
|
455
|
-
if(all(greaterThan(gl_FragColor.rgb,uLow.rgb)) && all(greaterThan(uHigh.rgb,gl_FragColor.rgb))) {
|
|
456
|
-
gl_FragColor.a = 0.0;
|
|
457
|
-
}
|
|
458
|
-
}
|
|
459
|
-
`}applyTo2d(t){let{imageData:{data:e}}=t;const s=255*this.distance,i=new I(this.color).getSource(),r=[i[0]-s,i[1]-s,i[2]-s],n=[i[0]+s,i[1]+s,i[2]+s];for(let a=0;a<e.length;a+=4){const l=e[a],h=e[a+1],c=e[a+2];l>r[0]&&h>r[1]&&c>r[2]&&l<n[0]&&h<n[1]&&c<n[2]&&(e[a+3]=0)}}sendUniformData(t,e){const s=new I(this.color).getSource(),i=this.distance,r=[0+s[0]/255-i,0+s[1]/255-i,0+s[2]/255-i,1],n=[s[0]/255+i,s[1]/255+i,s[2]/255+i,1];t.uniform4fv(e.uLow,r),t.uniform4fv(e.uHigh,n)}}m(is,"type","RemoveColor"),m(is,"defaults",{color:"#FFFFFF",distance:.02,useAlpha:!1}),m(is,"uniformLocations",["uLow","uHigh"]),T.setClass(is);class rs extends K{sendUniformData(t,e){t.uniform2fv(e.uDelta,this.horizontal?[1/this.width,0]:[0,1/this.height]),t.uniform1fv(e.uTaps,this.taps)}getFilterWindow(){const t=this.tempScale;return Math.ceil(this.lanczosLobes/t)}getCacheKey(){const t=this.getFilterWindow();return`${this.type}_${t}`}getFragmentSource(){const t=this.getFilterWindow();return this.generateShader(t)}getTaps(){const t=this.lanczosCreate(this.lanczosLobes),e=this.tempScale,s=this.getFilterWindow(),i=new Array(s);for(let r=1;r<=s;r++)i[r-1]=t(r*e);return i}generateShader(t){const e=new Array(t);for(let s=1;s<=t;s++)e[s-1]=`${s}.0 * uDelta`;return`
|
|
460
|
-
precision highp float;
|
|
461
|
-
uniform sampler2D uTexture;
|
|
462
|
-
uniform vec2 uDelta;
|
|
463
|
-
varying vec2 vTexCoord;
|
|
464
|
-
uniform float uTaps[${t}];
|
|
465
|
-
void main() {
|
|
466
|
-
vec4 color = texture2D(uTexture, vTexCoord);
|
|
467
|
-
float sum = 1.0;
|
|
468
|
-
${e.map((s,i)=>`
|
|
469
|
-
color += texture2D(uTexture, vTexCoord + ${s}) * uTaps[${i}] + texture2D(uTexture, vTexCoord - ${s}) * uTaps[${i}];
|
|
470
|
-
sum += 2.0 * uTaps[${i}];
|
|
471
|
-
`).join(`
|
|
472
|
-
`)}
|
|
473
|
-
gl_FragColor = color / sum;
|
|
474
|
-
}
|
|
475
|
-
`}applyToForWebgl(t){t.passes++,this.width=t.sourceWidth,this.horizontal=!0,this.dW=Math.round(this.width*this.scaleX),this.dH=t.sourceHeight,this.tempScale=this.dW/this.width,this.taps=this.getTaps(),t.destinationWidth=this.dW,super.applyTo(t),t.sourceWidth=t.destinationWidth,this.height=t.sourceHeight,this.horizontal=!1,this.dH=Math.round(this.height*this.scaleY),this.tempScale=this.dH/this.height,this.taps=this.getTaps(),t.destinationHeight=this.dH,super.applyTo(t),t.sourceHeight=t.destinationHeight}applyTo(t){Hs(t)?this.applyToForWebgl(t):this.applyTo2d(t)}isNeutralState(){return this.scaleX===1&&this.scaleY===1}lanczosCreate(t){return e=>{if(e>=t||e<=-t)return 0;if(e<11920929e-14&&e>-11920929e-14)return 1;const s=(e*=Math.PI)/t;return Math.sin(e)/e*Math.sin(s)/s}}applyTo2d(t){const e=t.imageData,s=this.scaleX,i=this.scaleY;this.rcpScaleX=1/s,this.rcpScaleY=1/i;const r=e.width,n=e.height,a=Math.round(r*s),l=Math.round(n*i);let h;h=this.resizeType==="sliceHack"?this.sliceByTwo(t,r,n,a,l):this.resizeType==="hermite"?this.hermiteFastResize(t,r,n,a,l):this.resizeType==="bilinear"?this.bilinearFiltering(t,r,n,a,l):this.resizeType==="lanczos"?this.lanczosResize(t,r,n,a,l):new ImageData(a,l),t.imageData=h}sliceByTwo(t,e,s,i,r){const n=t.imageData,a=.5;let l=!1,h=!1,c=e*a,d=s*a;const g=t.filterBackend.resources;let f=0,p=0;const y=e;let v=0;g.sliceByTwo||(g.sliceByTwo=Rt());const x=g.sliceByTwo;(x.width<1.5*e||x.height<s)&&(x.width=1.5*e,x.height=s);const b=x.getContext("2d");for(b.clearRect(0,0,1.5*e,s),b.putImageData(n,0,0),i=Math.floor(i),r=Math.floor(r);!l||!h;)e=c,s=d,i<Math.floor(c*a)?c=Math.floor(c*a):(c=i,l=!0),r<Math.floor(d*a)?d=Math.floor(d*a):(d=r,h=!0),b.drawImage(x,f,p,e,s,y,v,c,d),f=y,p=v,v+=d;return b.getImageData(f,p,i,r)}lanczosResize(t,e,s,i,r){const n=t.imageData.data,a=t.ctx.createImageData(i,r),l=a.data,h=this.lanczosCreate(this.lanczosLobes),c=this.rcpScaleX,d=this.rcpScaleY,g=2/this.rcpScaleX,f=2/this.rcpScaleY,p=Math.ceil(c*this.lanczosLobes/2),y=Math.ceil(d*this.lanczosLobes/2),v={},x={x:0,y:0},b={x:0,y:0};return function w(C){let S,O,D,k,P,$,N,j,B,F,q;for(x.x=(C+.5)*c,b.x=Math.floor(x.x),S=0;S<r;S++){for(x.y=(S+.5)*d,b.y=Math.floor(x.y),P=0,$=0,N=0,j=0,B=0,O=b.x-p;O<=b.x+p;O++)if(!(O<0||O>=e)){F=Math.floor(1e3*Math.abs(O-x.x)),v[F]||(v[F]={});for(let W=b.y-y;W<=b.y+y;W++)W<0||W>=s||(q=Math.floor(1e3*Math.abs(W-x.y)),v[F][q]||(v[F][q]=h(Math.sqrt(Math.pow(F*g,2)+Math.pow(q*f,2))/1e3)),D=v[F][q],D>0&&(k=4*(W*e+O),P+=D,$+=D*n[k],N+=D*n[k+1],j+=D*n[k+2],B+=D*n[k+3]))}k=4*(S*i+C),l[k]=$/P,l[k+1]=N/P,l[k+2]=j/P,l[k+3]=B/P}return++C<i?w(C):a}(0)}bilinearFiltering(t,e,s,i,r){let n,a,l,h,c,d,g,f,p,y,v,x,b,w=0;const C=this.rcpScaleX,S=this.rcpScaleY,O=4*(e-1),D=t.imageData.data,k=t.ctx.createImageData(i,r),P=k.data;for(g=0;g<r;g++)for(f=0;f<i;f++)for(c=Math.floor(C*f),d=Math.floor(S*g),p=C*f-c,y=S*g-d,b=4*(d*e+c),v=0;v<4;v++)n=D[b+v],a=D[b+4+v],l=D[b+O+v],h=D[b+O+4+v],x=n*(1-p)*(1-y)+a*p*(1-y)+l*y*(1-p)+h*p*y,P[w++]=x;return k}hermiteFastResize(t,e,s,i,r){const n=this.rcpScaleX,a=this.rcpScaleY,l=Math.ceil(n/2),h=Math.ceil(a/2),c=t.imageData.data,d=t.ctx.createImageData(i,r),g=d.data;for(let f=0;f<r;f++)for(let p=0;p<i;p++){const y=4*(p+f*i);let v=0,x=0,b=0,w=0,C=0,S=0,O=0;const D=(f+.5)*a;for(let k=Math.floor(f*a);k<(f+1)*a;k++){const P=Math.abs(D-(k+.5))/h,$=(p+.5)*n,N=P*P;for(let j=Math.floor(p*n);j<(p+1)*n;j++){let B=Math.abs($-(j+.5))/l;const F=Math.sqrt(N+B*B);F>1&&F<-1||(v=2*F*F*F-3*F*F+1,v>0&&(B=4*(j+k*e),O+=v*c[B+3],b+=v,c[B+3]<255&&(v=v*c[B+3]/250),w+=v*c[B],C+=v*c[B+1],S+=v*c[B+2],x+=v))}}g[y]=w/x,g[y+1]=C/x,g[y+2]=S/x,g[y+3]=O/b}return d}}m(rs,"type","Resize"),m(rs,"defaults",{resizeType:"hermite",scaleX:1,scaleY:1,lanczosLobes:3}),m(rs,"uniformLocations",["uDelta","uTaps"]),T.setClass(rs);class ns extends K{getFragmentSource(){return`
|
|
476
|
-
precision highp float;
|
|
477
|
-
uniform sampler2D uTexture;
|
|
478
|
-
uniform float uSaturation;
|
|
479
|
-
varying vec2 vTexCoord;
|
|
480
|
-
void main() {
|
|
481
|
-
vec4 color = texture2D(uTexture, vTexCoord);
|
|
482
|
-
float rgMax = max(color.r, color.g);
|
|
483
|
-
float rgbMax = max(rgMax, color.b);
|
|
484
|
-
color.r += rgbMax != color.r ? (rgbMax - color.r) * uSaturation : 0.00;
|
|
485
|
-
color.g += rgbMax != color.g ? (rgbMax - color.g) * uSaturation : 0.00;
|
|
486
|
-
color.b += rgbMax != color.b ? (rgbMax - color.b) * uSaturation : 0.00;
|
|
487
|
-
gl_FragColor = color;
|
|
488
|
-
}
|
|
489
|
-
`}applyTo2d(t){let{imageData:{data:e}}=t;const s=-this.saturation;for(let i=0;i<e.length;i+=4){const r=e[i],n=e[i+1],a=e[i+2],l=Math.max(r,n,a);e[i]+=l!==r?(l-r)*s:0,e[i+1]+=l!==n?(l-n)*s:0,e[i+2]+=l!==a?(l-a)*s:0}}sendUniformData(t,e){t.uniform1f(e.uSaturation,-this.saturation)}isNeutralState(){return this.saturation===0}}m(ns,"type","Saturation"),m(ns,"defaults",{saturation:0}),m(ns,"uniformLocations",["uSaturation"]),T.setClass(ns);class os extends K{getFragmentSource(){return`
|
|
490
|
-
precision highp float;
|
|
491
|
-
uniform sampler2D uTexture;
|
|
492
|
-
uniform float uVibrance;
|
|
493
|
-
varying vec2 vTexCoord;
|
|
494
|
-
void main() {
|
|
495
|
-
vec4 color = texture2D(uTexture, vTexCoord);
|
|
496
|
-
float max = max(color.r, max(color.g, color.b));
|
|
497
|
-
float avg = (color.r + color.g + color.b) / 3.0;
|
|
498
|
-
float amt = (abs(max - avg) * 2.0) * uVibrance;
|
|
499
|
-
color.r += max != color.r ? (max - color.r) * amt : 0.00;
|
|
500
|
-
color.g += max != color.g ? (max - color.g) * amt : 0.00;
|
|
501
|
-
color.b += max != color.b ? (max - color.b) * amt : 0.00;
|
|
502
|
-
gl_FragColor = color;
|
|
503
|
-
}
|
|
504
|
-
`}applyTo2d(t){let{imageData:{data:e}}=t;const s=-this.vibrance;for(let i=0;i<e.length;i+=4){const r=e[i],n=e[i+1],a=e[i+2],l=Math.max(r,n,a),h=(r+n+a)/3,c=2*Math.abs(l-h)/255*s;e[i]+=l!==r?(l-r)*c:0,e[i+1]+=l!==n?(l-n)*c:0,e[i+2]+=l!==a?(l-a)*c:0}}sendUniformData(t,e){t.uniform1f(e.uVibrance,-this.vibrance)}isNeutralState(){return this.vibrance===0}}m(os,"type","Vibrance"),m(os,"defaults",{vibrance:0}),m(os,"uniformLocations",["uVibrance"]),T.setClass(os);var Jt=Object.freeze({__proto__:null,BaseFilter:K,BlackWhite:wc,BlendColor:He,BlendImage:Ge,Blur:Ue,Brightness:qe,Brownie:yc,ColorMatrix:he,Composed:$i,Contrast:Ke,Convolute:Ze,Gamma:Je,Grayscale:Qe,HueRotation:Gs,Invert:ts,Kodachrome:_c,Noise:es,Pixelate:ss,Polaroid:bc,RemoveColor:is,Resize:rs,Saturation:ns,Sepia:Cc,Technicolor:xc,Vibrance:os,Vintage:vc});function wn(){const o=u.shallowRef(null),t=u.shallowRef(null),e=u.ref(!1),s=u.ref(0),i=u.ref(0);function r(c,d){o.value=new Mi(c,{preserveObjectStacking:!0,selection:!0,backgroundColor:"#1a1a2e"}),n(d)}function n(c){if(!o.value)return;const d=c.clientWidth,g=c.clientHeight;o.value.setDimensions({width:d,height:g}),o.value.renderAll()}async function a(c){if(o.value){e.value=!0;try{let d,g=!1;c instanceof File||c instanceof Blob?(d=URL.createObjectURL(c),g=!0):d=c;const f=await dt.fromURL(d,{crossOrigin:"anonymous"}),p=o.value.getWidth(),y=o.value.getHeight(),v=Math.min(p/(f.width??1),y/(f.height??1),1);f.scale(v),f.set({left:(p-f.getScaledWidth())/2,top:(y-f.getScaledHeight())/2,selectable:!1,evented:!1}),o.value.clear(),o.value.backgroundColor="#1a1a2e",o.value.add(f),o.value.sendObjectToBack(f),t.value=f,s.value=f.width??0,i.value=f.height??0,o.value.renderAll(),g&&URL.revokeObjectURL(d)}finally{e.value=!1}}}async function l(c){if(!o.value)throw new Error("Canvas not initialized");const d=c.mimeType.split("/")[1]||"png",g=o.value.toDataURL({format:d,quality:c.quality,multiplier:1});switch(c.format){case"dataurl":return g;case"canvas":return o.value.toCanvasElement();case"blob":return(await fetch(g)).blob();case"file":default:{const p=await(await fetch(g)).blob(),y=d==="jpeg"?"jpg":d;return new File([p],`${c.fileName}.${y}`,{type:c.mimeType})}}}function h(){var c;(c=o.value)==null||c.dispose(),o.value=null,t.value=null}return{canvas:o,originalImage:t,isLoading:e,imageWidth:s,imageHeight:i,init:r,fitToContainer:n,loadImage:a,exportImage:l,dispose:h}}function Sn(o,t=50){const e=u.ref([]),s=u.ref(-1),i=u.ref(!1),r=u.computed(()=>s.value>0),n=u.computed(()=>s.value<e.value.length-1);function a(){if(i.value||!o.value)return;e.value=e.value.slice(0,s.value+1);const g=JSON.stringify(o.value.toJSON());e.value.push(g),e.value.length>t?e.value.shift():s.value++}async function l(g){!o.value||g<0||g>=e.value.length||(i.value=!0,s.value=g,await o.value.loadFromJSON(e.value[g]),o.value.renderAll(),i.value=!1)}function h(){r.value&&l(s.value-1)}function c(){n.value&&l(s.value+1)}function d(){e.value=[],s.value=-1}return{canUndo:r,canRedo:n,saveState:a,undo:h,redo:c,clearHistory:d}}function Oc(){const o=u.ref(null);function t(s){o.value=o.value===s?null:s}function e(){o.value=null}return{activeTool:o,setTool:t,clearTool:e}}function Dc(o,t,e){const s=u.ref(!1),i=u.ref(null),r=u.ref(null);function n(c){if(!o.value)return;h(),s.value=!0,r.value=c||null;const d=o.value.getWidth(),g=o.value.getHeight();let f=d*.7,p=g*.7;c!=null&&c.value&&(p=f/c.value,p>g*.7&&(p=g*.7,f=p*c.value));const y=new yt({left:(d-f)/2,top:(g-p)/2,width:f,height:p,fill:"rgba(255,255,255,0.1)",stroke:"#ffffff",strokeWidth:2,strokeDashArray:[8,4],cornerColor:"#ffffff",cornerStrokeColor:"#333333",cornerSize:10,transparentCorners:!1,lockRotation:!0,hasRotatingPoint:!1});c!=null&&c.value&&(y.setControlsVisibility({mt:!1,mb:!1,ml:!1,mr:!1}),y.on("scaling",()=>{const v=y.scaleX??1;y.scaleY;const x=(y.width??f)*v,b=x/(c.value??1);y.set({scaleX:1,scaleY:1,width:x,height:b}),y.setCoords()})),i.value=y,o.value.add(y),o.value.setActiveObject(y),o.value.renderAll()}function a(c){r.value=c,s.value&&(h(),n(c))}async function l(){if(!o.value||!i.value)return;const c=i.value,d=c.left??0,g=c.top??0,f=c.getScaledWidth(),p=c.getScaledHeight();o.value.remove(c),i.value=null,s.value=!1;const y=o.value.toDataURL({left:d,top:g,width:f,height:p,multiplier:1,format:"png"}),v=await dt.fromURL(y),x=o.value.getWidth(),b=o.value.getHeight(),w=Math.min(x/(v.width??1),b/(v.height??1),1);v.scale(w),v.set({left:(x-v.getScaledWidth())/2,top:(b-v.getScaledHeight())/2,selectable:!1,evented:!1}),o.value.clear(),o.value.backgroundColor="#1a1a2e",o.value.add(v),o.value.sendObjectToBack(v),t.value=v,o.value.renderAll(),e()}function h(){!o.value||!i.value||(o.value.remove(i.value),i.value=null,s.value=!1,o.value.renderAll())}return{isCropping:s,selectedRatio:r,startCrop:n,setAspectRatio:a,applyCrop:l,cancelCrop:h}}function Ec(o,t,e){const s=u.ref(0),i=u.ref(!1),r=u.ref(!1);function n(c){if(!o.value)return;const d=c==="right"?90:-90;s.value=(s.value+d+360)%360,o.value.getObjects().forEach(g=>{const f=o.value.getWidth()/2,p=o.value.getHeight()/2,y=(g.left??0)-f,v=(g.top??0)-p,x=d*Math.PI/180;g.set({left:f+y*Math.cos(x)-v*Math.sin(x),top:p+y*Math.sin(x)+v*Math.cos(x),angle:((g.angle??0)+d)%360}),g.setCoords()}),o.value.renderAll(),e()}function a(c){if(!o.value||!t.value)return;const d=t.value;d.set({angle:c}),d.setCoords(),s.value=c,o.value.renderAll()}function l(){o.value&&(i.value=!i.value,o.value.getObjects().forEach(c=>{c.set({flipX:!c.flipX}),c.setCoords()}),o.value.renderAll(),e())}function h(){o.value&&(r.value=!r.value,o.value.getObjects().forEach(c=>{c.set({flipY:!c.flipY}),c.setCoords()}),o.value.renderAll(),e())}return{rotation:s,flippedX:i,flippedY:r,rotate90:n,setRotation:a,flipHorizontal:l,flipVertical:h}}function Mc(o,t,e){const s=u.reactive({brightness:0,contrast:0,saturation:0,exposure:0,blur:0,grayscale:!1,sepia:!1,invert:!1});let i=null;function r(){if(!t.value||!o.value)return;const l=t.value,h=[];s.brightness!==0&&h.push(new Jt.Brightness({brightness:s.brightness})),s.contrast!==0&&h.push(new Jt.Contrast({contrast:s.contrast})),s.saturation!==0&&h.push(new Jt.Saturation({saturation:s.saturation})),s.exposure!==0&&h.push(new Jt.Gamma({gamma:[1+s.exposure,1+s.exposure,1+s.exposure]})),s.blur>0&&h.push(new Jt.Blur({blur:s.blur})),s.grayscale&&h.push(new Jt.Grayscale),s.sepia&&h.push(new Jt.Sepia),s.invert&&h.push(new Jt.Invert),l.filters=h,l.applyFilters(),o.value.renderAll()}function n(){Object.assign(s,{brightness:0,contrast:0,saturation:0,exposure:0,blur:0,grayscale:!1,sepia:!1,invert:!1}),r(),e()}u.watch(s,()=>{i&&clearTimeout(i),i=setTimeout(()=>{r()},50)});function a(){r(),e()}return{state:s,applyFilters:r,resetFilters:n,commitFilters:a}}function Ac(o,t){const e=u.reactive({text:"Text",fontFamily:"Arial",fontSize:24,fill:"#ffffff",fontWeight:"normal",fontStyle:"normal",textAlign:"left"});function s(){if(!o.value)return;const r=new Tt(e.text,{left:o.value.getWidth()/2-50,top:o.value.getHeight()/2-20,fontFamily:e.fontFamily,fontSize:e.fontSize,fill:e.fill,fontWeight:e.fontWeight,fontStyle:e.fontStyle,textAlign:e.textAlign,editable:!0});o.value.add(r),o.value.setActiveObject(r),o.value.renderAll(),t()}function i(){if(!o.value)return;const r=o.value.getActiveObject();r instanceof Tt&&(r.set({fontFamily:e.fontFamily,fontSize:e.fontSize,fill:e.fill,fontWeight:e.fontWeight,fontStyle:e.fontStyle,textAlign:e.textAlign}),o.value.renderAll())}return{config:e,addText:s,updateSelectedText:i}}function Pc(o,t){const e=u.reactive({width:4,color:"#ffffff",opacity:1});function s(){if(!o.value)return;o.value.isDrawingMode=!0;const r=new Vs(o.value);r.width=e.width,r.color=e.color,o.value.freeDrawingBrush=r,o.value.on("path:created",()=>{t()})}function i(){o.value&&(o.value.isDrawingMode=!1,o.value.off("path:created"))}return u.watch(e,()=>{var r;(r=o.value)!=null&&r.freeDrawingBrush&&(o.value.freeDrawingBrush.width=e.width,o.value.freeDrawingBrush.color=e.color)}),{config:e,enableDrawing:s,disableDrawing:i}}function Fc(o,t){const e=u.reactive({type:"rect",strokeColor:"#ffffff",fillColor:"transparent",strokeWidth:2});function s(){if(!o.value)return;const i=o.value.getWidth()/2,r=o.value.getHeight()/2;let n;switch(e.type){case"rect":n=new yt({left:i-50,top:r-40,width:100,height:80,fill:e.fillColor,stroke:e.strokeColor,strokeWidth:e.strokeWidth});break;case"circle":n=new At({left:i-40,top:r-40,radius:40,fill:e.fillColor,stroke:e.strokeColor,strokeWidth:e.strokeWidth});break;case"line":n=new Zt([i-60,r,i+60,r],{stroke:e.strokeColor,strokeWidth:e.strokeWidth});break;case"arrow":{const a=i-60,l=i+60,h=`M ${a} ${r} L ${l} ${r} M ${l-12} ${r-8} L ${l} ${r} L ${l-12} ${r+8}`;n=new Xt(h,{fill:"",stroke:e.strokeColor,strokeWidth:e.strokeWidth,strokeLineCap:"round",strokeLineJoin:"round"});break}}n&&(o.value.add(n),o.value.setActiveObject(n),o.value.renderAll(),t())}return{config:e,addShape:s}}function jc(o,t,e,s,i){const r=u.ref(0),n=u.ref(0),a=u.ref(!0),l=u.ref(1);function h(){r.value=e.value,n.value=s.value,l.value=s.value>0?e.value/s.value:1}function c(f){r.value=f,a.value&&(n.value=Math.round(f/l.value))}function d(f){n.value=f,a.value&&(r.value=Math.round(f*l.value))}async function g(){if(!o.value||!t.value)return;const f=o.value.toDataURL({format:"png",multiplier:1}),p=document.createElement("canvas");p.width=r.value,p.height=n.value;const y=p.getContext("2d"),v=new window.Image;await new Promise(O=>{v.onload=()=>{y.drawImage(v,0,0,r.value,n.value),O()},v.src=f});const x=p.toDataURL("image/png"),b=await dt.fromURL(x),w=o.value.getWidth(),C=o.value.getHeight(),S=Math.min(w/(b.width??1),C/(b.height??1),1);b.scale(S),b.set({left:(w-b.getScaledWidth())/2,top:(C-b.getScaledHeight())/2,selectable:!1,evented:!1}),o.value.clear(),o.value.backgroundColor="#1a1a2e",o.value.add(b),t.value=b,e.value=r.value,s.value=n.value,o.value.renderAll(),i()}return{newWidth:r,newHeight:n,lockRatio:a,initResize:h,setWidth:c,setHeight:d,applyResize:g}}const Lc=.1,Bc=5;function Rc(o){const t=u.ref(1);function e(a){if(!o.value)return;const l=Math.min(Bc,Math.max(Lc,a));t.value=l,o.value.setZoom(l),o.value.renderAll()}function s(){e(t.value*1.15)}function i(){e(t.value/1.15)}function r(){e(1)}function n(){var a;(a=o.value)==null||a.on("mouse:wheel",l=>{const h=l.e.deltaY;let c=o.value.getZoom();c*=.999**h,e(c),l.e.preventDefault(),l.e.stopPropagation()})}return{zoomLevel:t,setZoom:e,zoomIn:s,zoomOut:i,resetZoom:r,enableWheelZoom:n}}const $c=["dir"],Vc={class:"vuedit-header"},Ic={class:"vuedit-header__history"},Nc=["disabled","title"],Wc=["disabled","title"],Xc=["title"],zc=["title"],Yc={style:{"font-size":"12px",color:"var(--vuedit-color-text-muted)","min-width":"40px","text-align":"center"}},Hc={class:"vuedit-header__actions"},Gc={class:"vuedit-body"},Uc={key:0,class:"vuedit-panel"},Tn=u.defineComponent({__name:"VueditImageEditor",props:{src:{},outputFormat:{default:"file"},outputMimeType:{default:"image/png"},outputQuality:{default:.92},outputFileName:{default:"edited-image"},tools:{default:()=>["crop","rotate","filter","text","draw","shape","resize"]},cropAspectRatios:{default:()=>[{label:"Free",value:null},{label:"1:1",value:1},{label:"4:3",value:4/3},{label:"16:9",value:16/9},{label:"3:2",value:3/2}]},locale:{default:"en"},dir:{default:"auto"}},emits:["save","cancel","change","error"],setup(o,{emit:t}){const e=o,s=t,i=Ii(e.locale),r=u.computed(()=>e.dir!=="auto"?e.dir:typeof e.locale=="string"&&e.locale==="ar"?"rtl":"ltr"),n=u.ref(null),{canvas:a,originalImage:l,isLoading:h,imageWidth:c,imageHeight:d,init:g,fitToContainer:f,loadImage:p,exportImage:y,dispose:v}=wn(),{canUndo:x,canRedo:b,saveState:w,undo:C,redo:S,clearHistory:O}=Sn(a),{activeTool:D,setTool:k,clearTool:P}=Oc(),$=Dc(a,l,w),N=Ec(a,l,w),j=Mc(a,l,w),B=Ac(a,w),F=Pc(a,w),q=Fc(a,w),W=jc(a,l,c,d,w),H=Rc(a);u.watch(D,(M,E)=>{E==="draw"&&F.disableDrawing(),E==="crop"&&$.cancelCrop(),M==="draw"&&F.enableDrawing(),M==="crop"&&$.startCrop(e.cropAspectRatios[0]),M==="resize"&&W.initResize()}),u.onMounted(async()=>{var M,E;if(await u.nextTick(),(M=n.value)!=null&&M.canvasEl&&((E=n.value)!=null&&E.containerEl)){g(n.value.canvasEl,n.value.containerEl),H.enableWheelZoom();try{await p(e.src),O(),w()}catch(z){s("error",z)}}}),u.watch(()=>e.src,async M=>{if(M&&a.value)try{await p(M),O(),w()}catch(E){s("error",E)}});let R=null;u.onMounted(()=>{var M;(M=n.value)!=null&&M.containerEl&&(R=new ResizeObserver(()=>{var E;(E=n.value)!=null&&E.containerEl&&f(n.value.containerEl)}),R.observe(n.value.containerEl))});function gt(M){var E;if((M.ctrlKey||M.metaKey)&&(M.key==="z"&&!M.shiftKey?(M.preventDefault(),C()):(M.key==="z"&&M.shiftKey||M.key==="y")&&(M.preventDefault(),S())),(M.key==="Delete"||M.key==="Backspace")&&(E=a.value)!=null&&E.getActiveObject()){const z=a.value.getActiveObject();z&&z!==l.value&&(a.value.remove(z),a.value.renderAll(),w())}M.key==="Escape"&&P()}u.onMounted(()=>document.addEventListener("keydown",gt)),u.onBeforeUnmount(()=>{document.removeEventListener("keydown",gt),R==null||R.disconnect(),v()});async function kt(){try{D.value==="draw"&&F.disableDrawing(),D.value==="crop"&&$.cancelCrop(),P();const M=await y({format:e.outputFormat,mimeType:e.outputMimeType,quality:e.outputQuality,fileName:e.outputFileName});s("save",M)}catch(M){s("error",M)}}function De(M,E){j.state[M]=E}function as(M,E){B.config[M]=E,B.updateSelectedText()}function ue(M,E){F.config[M]=E}function Pt(M,E){q.config[M]=E}return(M,E)=>(u.openBlock(),u.createElementBlock("div",{class:"vuedit-editor",dir:r.value},[u.createElementVNode("div",Vc,[u.createElementVNode("div",Ic,[u.createElementVNode("button",{class:"vuedit-btn--icon",disabled:!u.unref(x),title:u.unref(i)("undo"),onClick:E[0]||(E[0]=(...z)=>u.unref(C)&&u.unref(C)(...z))},[u.createVNode(u.unref(ho),{style:{width:"18px",height:"18px"}})],8,Nc),u.createElementVNode("button",{class:"vuedit-btn--icon",disabled:!u.unref(b),title:u.unref(i)("redo"),onClick:E[1]||(E[1]=(...z)=>u.unref(S)&&u.unref(S)(...z))},[u.createVNode(u.unref(fo),{style:{width:"18px",height:"18px"}})],8,Wc),E[9]||(E[9]=u.createElementVNode("span",{style:{width:"1px",height:"24px",background:"var(--vuedit-color-border)",margin:"0 4px"}},null,-1)),u.createElementVNode("button",{class:"vuedit-btn--icon",title:u.unref(i)("zoomIn"),onClick:E[2]||(E[2]=z=>u.unref(H).zoomIn())},[u.createVNode(u.unref(vo),{style:{width:"18px",height:"18px"}})],8,Xc),u.createElementVNode("button",{class:"vuedit-btn--icon",title:u.unref(i)("zoomOut"),onClick:E[3]||(E[3]=z=>u.unref(H).zoomOut())},[u.createVNode(u.unref(Co),{style:{width:"18px",height:"18px"}})],8,zc),u.createElementVNode("span",Yc,u.toDisplayString(Math.round(u.unref(H).zoomLevel.value*100))+"% ",1)]),u.createElementVNode("div",Hc,[u.createElementVNode("button",{class:"vuedit-btn vuedit-btn--secondary",onClick:E[4]||(E[4]=z=>s("cancel"))},u.toDisplayString(u.unref(i)("cancel")),1),u.createElementVNode("button",{class:"vuedit-btn vuedit-btn--primary",onClick:kt},u.toDisplayString(u.unref(i)("save")),1)])]),u.createElementVNode("div",Gc,[u.unref(D)?(u.openBlock(),u.createElementBlock("div",Uc,[u.unref(D)==="crop"?(u.openBlock(),u.createBlock(Ho,{key:0,"aspect-ratios":o.cropAspectRatios,"selected-ratio":u.unref($).selectedRatio.value,"is-cropping":u.unref($).isCropping.value,t:u.unref(i),onSelectRatio:E[5]||(E[5]=z=>{u.unref($).setAspectRatio(z),u.unref($).startCrop(z)}),onApply:u.unref($).applyCrop,onCancel:u.unref($).cancelCrop},null,8,["aspect-ratios","selected-ratio","is-cropping","t","onApply","onCancel"])):u.unref(D)==="rotate"?(u.openBlock(),u.createBlock(oa,{key:1,rotation:u.unref(N).rotation.value,t:u.unref(i),onRotateLeft:E[6]||(E[6]=z=>u.unref(N).rotate90("left")),onRotateRight:E[7]||(E[7]=z=>u.unref(N).rotate90("right")),onFlipH:u.unref(N).flipHorizontal,onFlipV:u.unref(N).flipVertical,onSetRotation:u.unref(N).setRotation},null,8,["rotation","t","onFlipH","onFlipV","onSetRotation"])):u.unref(D)==="filter"?(u.openBlock(),u.createBlock(ma,{key:2,state:u.unref(j).state,t:u.unref(i),onUpdate:De,onReset:u.unref(j).resetFilters,onCommit:u.unref(j).commitFilters},null,8,["state","t","onReset","onCommit"])):u.unref(D)==="text"?(u.openBlock(),u.createBlock(Fa,{key:3,config:u.unref(B).config,t:u.unref(i),onUpdate:as,onAddText:u.unref(B).addText},null,8,["config","t","onAddText"])):u.unref(D)==="draw"?(u.openBlock(),u.createBlock(Ra,{key:4,config:u.unref(F).config,t:u.unref(i),onUpdate:ue},null,8,["config","t"])):u.unref(D)==="shape"?(u.openBlock(),u.createBlock(za,{key:5,config:u.unref(q).config,t:u.unref(i),onUpdate:Pt,onAddShape:u.unref(q).addShape},null,8,["config","t","onAddShape"])):u.unref(D)==="resize"?(u.openBlock(),u.createBlock(sl,{key:6,width:u.unref(W).newWidth.value,height:u.unref(W).newHeight.value,"lock-ratio":u.unref(W).lockRatio.value,t:u.unref(i),onSetWidth:u.unref(W).setWidth,onSetHeight:u.unref(W).setHeight,onToggleLock:E[8]||(E[8]=z=>u.unref(W).lockRatio.value=!u.unref(W).lockRatio.value),onApply:u.unref(W).applyResize,onCancel:u.unref(P)},null,8,["width","height","lock-ratio","t","onSetWidth","onSetHeight","onApply","onCancel"])):u.createCommentVNode("",!0)])):u.createCommentVNode("",!0),u.createVNode(Dn,{ref_key:"fabricCanvasRef",ref:n},null,512)]),u.createVNode(Io,{tools:o.tools,"active-tool":u.unref(D),t:u.unref(i),onSelectTool:u.unref(k)},null,8,["tools","active-tool","t","onSelectTool"])],8,$c))}}),qc=u.defineComponent({__name:"VueditImageEditorModal",props:{open:{type:Boolean},src:{},outputFormat:{default:"file"},outputMimeType:{default:"image/png"},outputQuality:{default:.92},outputFileName:{default:"edited-image"},tools:{},cropAspectRatios:{},locale:{default:"en"},dir:{default:"auto"}},emits:["save","close"],setup(o,{emit:t}){const e=o,s=t,i=u.ref(null);return u.watch(()=>e.open,r=>{var n,a;r?(n=i.value)==null||n.showModal():(a=i.value)==null||a.close()}),(r,n)=>(u.openBlock(),u.createBlock(u.Teleport,{to:"body"},[u.createElementVNode("dialog",{ref_key:"dialogRef",ref:i,class:"vuedit-modal",onClose:n[2]||(n[2]=a=>s("close"))},[o.open?(u.openBlock(),u.createBlock(Tn,{key:0,src:o.src,"output-format":o.outputFormat,"output-mime-type":o.outputMimeType,"output-quality":o.outputQuality,"output-file-name":o.outputFileName,tools:o.tools,"crop-aspect-ratios":o.cropAspectRatios,locale:o.locale,dir:o.dir,onSave:n[0]||(n[0]=a=>s("save",a)),onCancel:n[1]||(n[1]=a=>s("close"))},null,8,["src","output-format","output-mime-type","output-quality","output-file-name","tools","crop-aspect-ratios","locale","dir"])):u.createCommentVNode("",!0)],544)]))}});ht.VueditImageEditor=Tn,ht.VueditImageEditorModal=qc,ht.defaultTranslations=Ee,ht.mergeTranslations=On,ht.resolveTranslations=Ii,ht.useFabricCanvas=wn,ht.useHistory=Sn,Object.defineProperty(ht,Symbol.toStringTag,{value:"Module"})});
|
|
1
|
+
(function(T,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(T=typeof globalThis<"u"?globalThis:T||self,e(T.VueditImageEditor={},T.Vue))})(this,function(T,e){"use strict";function Q(){return{crop:{x:0,y:0,width:1,height:1,aspectRatio:null,rotation:0,flipX:!1,flipY:!1},finetune:{brightness:0,contrast:0,saturation:0,exposure:0,temperature:0,gamma:1,clarity:0,vignette:0},filter:{id:null,intensity:1},stickers:[],annotations:[],frame:{style:null,size:.025,color:[1,1,1,1],radius:0},resize:{fit:"contain",upscale:!1},backgroundColor:[0,0,0,1]}}function ee(a){return JSON.parse(JSON.stringify(a))}class ve{constructor(t=50){this.states=[],this.pointer=-1,this.maxSize=t}push(t){this.states=this.states.slice(0,this.pointer+1),this.states.push(ee(t)),this.states.length>this.maxSize&&this.states.shift(),this.pointer=this.states.length-1}undo(){return this.pointer<=0?null:(this.pointer--,ee(this.states[this.pointer]))}redo(){return this.pointer>=this.states.length-1?null:(this.pointer++,ee(this.states[this.pointer]))}reset(t){this.states=[ee(t)],this.pointer=0}get canUndo(){return this.pointer>0}get canRedo(){return this.pointer<this.states.length-1}get currentIndex(){return this.pointer}get length(){return this.states.length}}async function be(a){const t=await ot(a);return new Promise((o,n)=>{const l=new Image;l.crossOrigin="anonymous",l.onload=()=>{typeof a!="string"&&URL.revokeObjectURL(t),o(l)},l.onerror=()=>{typeof a!="string"&&URL.revokeObjectURL(t),n(new Error(`Failed to load image: ${typeof a=="string"?a:"Blob/File"}`))},l.src=t})}async function ot(a){return typeof a=="string"?a:URL.createObjectURL(a)}const xe=Symbol("vuedit-image-editor"),j=Symbol("vuedit-locale");function te(a){return JSON.parse(JSON.stringify(e.toRaw(a)))}function _e(a){const t=e.reactive(a.initialState?{...Q(),...JSON.parse(JSON.stringify(a.initialState))}:Q()),o=te(t),n=new ve(50);n.reset(te(t));const l=e.ref(null),f=e.ref(!1),c=e.ref(null);let r=0;const i=e.shallowRef([]),m=e.ref(null),s=e.ref(1),d=e.ref(null),y=e.ref({x:0,y:0}),u=e.ref(0),x=e.computed(()=>m.value&&i.value.find(B=>B.id===m.value)||null),_=e.computed(()=>(u.value,n.canUndo)),S=e.computed(()=>(u.value,n.canRedo)),k=e.computed(()=>(u.value,n.currentIndex>0));async function h(B){const W=++r;f.value=!0,c.value=null;try{const E=await be(B);if(W!==r)return;l.value=E,P()}catch(E){if(W!==r)return;c.value=E instanceof Error?E.message:"Failed to load image"}finally{W===r&&(f.value=!1)}}function w(B){if(!B.id||!B.controls){console.warn("[VueditImageEditor] Plugin missing required fields (id, controls):",B);return}i.value.some(W=>W.id===B.id)||(i.value=[...i.value,e.markRaw(B)],m.value||(m.value=B.id))}function v(B){var W;i.value=i.value.filter(E=>E.id!==B),m.value===B&&(m.value=((W=i.value[0])==null?void 0:W.id)||null)}function C(B){const W=x.value;W!=null&&W.onDeactivate&&W.onDeactivate(),m.value=B;const E=i.value.find(R=>R.id===B);E!=null&&E.onActivate&&E.onActivate(),P()}function V(B){B(t),n.push(te(t)),u.value++,P()}function D(){const B=n.undo();B&&(Object.assign(t,B),u.value++,P())}function N(){const B=n.redo();B&&(Object.assign(t,B),u.value++,P())}function I(){const B=x.value;B!=null&&B.onDeactivate&&B.onDeactivate(),Object.assign(t,JSON.parse(JSON.stringify(o))),n.reset(te(t)),u.value++,B!=null&&B.onActivate&&B.onActivate(),P()}function F(B){s.value=Math.max(.1,Math.min(10,B)),P()}function P(B=!1){d.value&&d.value(B)}return{state:t,readonlyState:e.readonly(t),sourceImage:l,loading:f,error:c,plugins:i,activePluginId:m,activePlugin:x,hasEdits:k,canUndo:_,canRedo:S,zoom:s,options:a,load:h,registerPlugin:w,unregisterPlugin:v,setActivePlugin:C,updateState:V,undo:D,redo:N,revert:I,setZoom:F,requestRender:P,onRender:d,cropDragPan:y}}function it(a){e.provide(xe,a)}function H(){const a=e.inject(xe);if(!a)throw new Error("[VueditImageEditor] useEditor() called outside of editor context. Make sure to use it inside <EditorShell> or <ImageEditorModal>.");return a}function Ce(a){return`rgba(${Math.round(a[0]*255)}, ${Math.round(a[1]*255)}, ${Math.round(a[2]*255)}, ${a[3]})`}function ce(a,t,o,n,l,f){const c=o+t.x*l,r=n+t.y*f,i=t.width*l,m=t.height*f,s=t.strokeWidth*Math.max(l,f);if(a.save(),a.globalAlpha=t.opacity,t.rotation!==0){const k=c+i/2,h=r+m/2;a.translate(k,h),a.rotate(t.rotation),a.translate(-k,-h)}const d=t.fontSize*f,y=t.fontStyle==="italic"?"italic ":"",u=t.fontWeight==="bold"?"bold ":"";a.font=`${y}${u}${d}px ${t.fontFamily}`,a.fillStyle=Ce(t.fillColor),a.textAlign=t.textAlign,a.textBaseline="top",a.save(),a.beginPath(),a.rect(c,r,i,m),a.clip();let x=c;t.textAlign==="center"?x=c+i/2:t.textAlign==="right"&&(x=c+i);const _=rt(a,t.text,i),S=d*1.2;for(let k=0;k<_.length;k++)a.fillText(_[k],x,r+k*S);a.restore(),t.strokeColor[3]>0&&s>.5&&(a.strokeStyle=Ce(t.strokeColor),a.lineWidth=s*.5,a.strokeRect(c,r,i,m)),a.restore()}function at(a,t,o,n,l,f,c){if(o.width<=0||o.height<=0)return;const r=lt(t,o);r&&ce(a,r,n,l,f,c)}function lt(a,t){const o=(a.x-t.x)/t.width,n=(a.y-t.y)/t.height,l=a.width/t.width,f=a.height/t.height;return o+l<0||o>1||n+f<0||n>1?null:{...a,x:o,y:n,width:l,height:f,strokeWidth:a.strokeWidth/Math.max(t.width,t.height),fontSize:a.fontSize/t.height}}function rt(a,t,o){if(!t)return[""];const n=t.split(`
|
|
2
|
+
`),l=[];for(const f of n){const c=f.split(" ");let r="";for(const i of c){const m=r?`${r} ${i}`:i;a.measureText(m).width>o&&r?(l.push(r),r=i):r=m}l.push(r)}return l}const ne=[1,0,0,0,0,0,1,0,0,0,0,0,1,0,0,0,0,0,1,0];function Ee(a,t){const o=new Array(20).fill(0);for(let n=0;n<4;n++)for(let l=0;l<5;l++){let f=0;for(let c=0;c<4;c++)f+=a[n*5+c]*t[c*5+l];l===4&&(f+=a[n*5+4]),o[n*5+l]=f}return o}function de(...a){if(a.length===0)return[...ne];let t=a[0];for(let o=1;o<a.length;o++)t=Ee(a[o],t);return t}function he(a){return[1,0,0,0,a,0,1,0,0,a,0,0,1,0,a,0,0,0,1,0]}function ue(a){const t=a+1,o=-.5*t+.5;return[t,0,0,0,o,0,t,0,0,o,0,0,t,0,o,0,0,0,1,0]}function fe(a){const t=a+1,o=1-t,n=.2126*o,l=.7152*o,f=.0722*o;return[n+t,l,f,0,0,n,l+t,f,0,0,n,l,f+t,0,0,0,0,0,1,0]}function me(a){const t=Math.pow(2,a);return[t,0,0,0,0,0,t,0,0,0,0,0,t,0,0,0,0,0,1,0]}function pe(a){return[1+a,0,0,0,0,0,1,0,0,0,0,0,1-a,0,0,0,0,0,1,0]}function oe(a,t){const o=a.data,n=o.length,l=t[0],f=t[1],c=t[2],r=t[3],i=t[4]*255,m=t[5],s=t[6],d=t[7],y=t[8],u=t[9]*255,x=t[10],_=t[11],S=t[12],k=t[13],h=t[14]*255,w=t[15],v=t[16],C=t[17],V=t[18],D=t[19]*255;for(let N=0;N<n;N+=4){const I=o[N],F=o[N+1],P=o[N+2],B=o[N+3];o[N]=U(I*l+F*f+P*c+B*r+i),o[N+1]=U(I*m+F*s+P*d+B*y+u),o[N+2]=U(I*x+F*_+P*S+B*k+h),o[N+3]=U(I*w+F*v+P*C+B*V+D)}}function ie(a,t){if(t===1)return;const o=a.data,n=1/t,l=new Uint8Array(256);for(let f=0;f<256;f++)l[f]=U(Math.pow(f/255,n)*255);for(let f=0;f<o.length;f+=4)o[f]=l[o[f]],o[f+1]=l[o[f+1]],o[f+2]=l[o[f+2]]}function ae(a,t,o,n){if(t===0)return;const l=a.data,f=o/2,c=n/2,r=Math.sqrt(f*f+c*c);for(let i=0;i<n;i++)for(let m=0;m<o;m++){const s=(i*o+m)*4,d=m-f,y=i-c,u=Math.sqrt(d*d+y*y)/r,x=1-t*u*u;l[s]=U(l[s]*x),l[s+1]=U(l[s+1]*x),l[s+2]=U(l[s+2]*x)}}function le(a,t){if(t===0)return;const{data:o,width:n,height:l}=a,f=t*4,c=new Uint8ClampedArray(o);for(let r=1;r<l-1;r++)for(let i=1;i<n-1;i++){const m=(r*n+i)*4;for(let s=0;s<3;s++){const d=c[m+s],y=d*4-c[((r-1)*n+i)*4+s]-c[((r+1)*n+i)*4+s]-c[(r*n+(i-1))*4+s]-c[(r*n+(i+1))*4+s],u=d+f*y;o[m+s]=u<0?0:u>255?255:u+.5|0}}}function U(a){return a<0?0:a>255?255:a+.5|0}const st=16777216;class Se{async process(t,o,n={}){const{mimeType:l="image/jpeg",quality:f=.92,maxCanvasPixels:c=st}=n,r=o.crop,i=o.finetune;let m=Math.round(r.x*t.naturalWidth),s=Math.round(r.y*t.naturalHeight),d=Math.round(r.width*t.naturalWidth),y=Math.round(r.height*t.naturalHeight);m=Math.max(0,Math.min(m,t.naturalWidth)),s=Math.max(0,Math.min(s,t.naturalHeight)),d=Math.min(d,t.naturalWidth-m),y=Math.min(y,t.naturalHeight-s);let u=d,x=y;if(o.resize.width||o.resize.height){const N=o.resize.width,I=o.resize.height,F=o.resize.fit;if(N&&I)if(F==="force")u=N,x=I;else if(F==="cover"){const P=Math.max(N/d,I/y);u=Math.round(d*P),x=Math.round(y*P)}else{const P=Math.min(N/d,I/y);u=Math.round(d*P),x=Math.round(y*P)}else if(N){const P=N/d;u=N,x=Math.round(y*P)}else if(I){const P=I/y;u=Math.round(d*P),x=I}o.resize.upscale||(u=Math.min(u,d),x=Math.min(x,y))}const _=u*x;if(_>c){const N=Math.sqrt(c/_);u=Math.floor(u*N),x=Math.floor(x*N)}u=Math.max(1,u),x=Math.max(1,x);const S=Math.abs(r.rotation);let k=u,h=x;if(S>.001){const N=Math.abs(Math.cos(r.rotation)),I=Math.abs(Math.sin(r.rotation));k=Math.ceil(u*N+x*I),h=Math.ceil(u*I+x*N)}const w=document.createElement("canvas");w.width=k,w.height=h;const v=w.getContext("2d"),C=o.backgroundColor;C[3]>0&&(v.fillStyle=`rgba(${Math.round(C[0]*255)}, ${Math.round(C[1]*255)}, ${Math.round(C[2]*255)}, ${C[3]})`,v.fillRect(0,0,k,h)),v.save(),v.translate(k/2,h/2),v.rotate(r.rotation),v.scale(r.flipX?-1:1,r.flipY?-1:1),v.drawImage(t,m,s,d,y,-u/2,-x/2,u,x),v.restore();const V=[];if(i.brightness!==0&&V.push(he(i.brightness)),i.contrast!==0&&V.push(ue(i.contrast)),i.saturation!==0&&V.push(fe(i.saturation)),i.exposure!==0&&V.push(me(i.exposure)),i.temperature!==0&&V.push(pe(i.temperature)),o.filter.matrix)if(o.filter.intensity<1){const N=o.filter.matrix,I=o.filter.intensity,F=ne.map((P,B)=>P*(1-I)+N[B]*I);V.push(F)}else V.push(o.filter.matrix);if(V.length>0){const N=de(...V),I=v.getImageData(0,0,k,h);oe(I,N),i.gamma!==1&&ie(I,i.gamma),i.clarity!==0&&le(I,i.clarity),i.vignette!==0&&ae(I,i.vignette,k,h),v.putImageData(I,0,0)}else if(i.gamma!==1||i.clarity!==0||i.vignette!==0){const N=v.getImageData(0,0,k,h);i.gamma!==1&&ie(N,i.gamma),i.clarity!==0&&le(N,i.clarity),i.vignette!==0&&ae(N,i.vignette,k,h),v.putImageData(N,0,0)}o.frame.style&&ct(v,o.frame.style,o.frame.size,o.frame.color,o.frame.radius,k,h);for(const N of o.stickers)await ht(v,N,k,h);for(const N of o.annotations)ce(v,N,0,0,k,h);return{blob:await new Promise((N,I)=>{w.toBlob(F=>F?N(F):I(new Error("Failed to encode image")),l,f)}),imageState:JSON.parse(JSON.stringify(o))}}}function ct(a,t,o,n,l,f,c){const r=Math.round(Math.max(f,c)*o),i=Math.round(l),m=`rgba(${Math.round(n[0]*255)}, ${Math.round(n[1]*255)}, ${Math.round(n[2]*255)}, ${n[3]})`;switch(a.strokeStyle=m,a.fillStyle=m,t){case"solidSharp":a.lineWidth=r,a.strokeRect(r/2,r/2,f-r,c-r);break;case"solidRound":a.lineWidth=r,dt(a,r/2,r/2,f-r,c-r,i+r/2),a.stroke();break;case"lineSingle":{const s=r*2;a.lineWidth=1,a.strokeRect(s,s,f-s*2,c-s*2);break}case"lineMultiple":{a.lineWidth=1;for(let s=1;s<=3;s++){const d=r*s;a.strokeRect(d,d,f-d*2,c-d*2)}break}case"hook":{const s=Math.min(f,c)*.1;a.lineWidth=r*.5;const d=r;a.beginPath(),a.moveTo(d,d+s),a.lineTo(d,d),a.lineTo(d+s,d),a.stroke(),a.beginPath(),a.moveTo(f-d-s,d),a.lineTo(f-d,d),a.lineTo(f-d,d+s),a.stroke(),a.beginPath(),a.moveTo(d,c-d-s),a.lineTo(d,c-d),a.lineTo(d+s,c-d),a.stroke(),a.beginPath(),a.moveTo(f-d-s,c-d),a.lineTo(f-d,c-d),a.lineTo(f-d,c-d-s),a.stroke();break}case"polaroid":{const s=r,d=r*4;a.fillRect(0,0,f,s),a.fillRect(0,0,s,c),a.fillRect(f-s,0,s,c),a.fillRect(0,c-d,f,d);break}default:a.lineWidth=r*.5,a.strokeRect(r,r,f-r*2,c-r*2);break}}function dt(a,t,o,n,l,f){a.beginPath(),a.moveTo(t+f,o),a.lineTo(t+n-f,o),a.arcTo(t+n,o,t+n,o+f,f),a.lineTo(t+n,o+l-f),a.arcTo(t+n,o+l,t+n-f,o+l,f),a.lineTo(t+f,o+l),a.arcTo(t,o+l,t,o+l-f,f),a.lineTo(t,o+f),a.arcTo(t,o,t+f,o,f),a.closePath()}async function ht(a,t,o,n){const l=t.x*o,f=t.y*n,c=t.width*o,r=t.height*n;if(a.save(),a.globalAlpha=t.opacity,a.translate(l+c/2,f+r/2),a.rotate(t.rotation),a.scale(t.flipX?-1:1,t.flipY?-1:1),!t.src.startsWith("http")&&!t.src.startsWith("data:")&&!t.src.startsWith("blob:")&&!t.src.startsWith("/")&&!t.src.startsWith(".")){const i=Math.min(c,r)*.8;a.font=`${i}px sans-serif`,a.textAlign="center",a.textBaseline="middle",a.fillText(t.src,0,0)}else try{const i=new Image;i.crossOrigin="anonymous",await new Promise((m,s)=>{i.onload=()=>m(),i.onerror=()=>s(),i.src=t.src}),a.drawImage(i,-c/2,-r/2,c,r)}catch{}a.restore()}const Me={undo:"Undo",redo:"Redo",revert:"Revert",zoomIn:"Zoom In",zoomOut:"Zoom Out",zoomToFit:"Zoom to Fit",done:"Done",cancel:"Cancel",export:"Export",close:"Close",crop:"Crop",filter:"Filter",finetune:"Finetune",sticker:"Sticker",frame:"Frame",resize:"Resize",aspectRatio:"Aspect Ratio",custom:"Custom",square:"Square",landscape:"Landscape",portrait:"Portrait",rotation:"Rotation",rotateLeft:"Rotate Left",rotateRight:"Rotate Right",flipHorizontal:"Flip Horizontal",flipVertical:"Flip Vertical",brightness:"Brightness",contrast:"Contrast",saturation:"Saturation",exposure:"Exposure",temperature:"Temperature",gamma:"Gamma",clarity:"Clarity",vignette:"Vignette",original:"Original",intensity:"Intensity",chrome:"Chrome",fade:"Fade",pastel:"Pastel",cold:"Cold",warm:"Warm",mono:"Mono",noir:"Noir",wash:"Wash",stark:"Stark",sepia:"Sepia",rust:"Rust",blues:"Blues",color:"Color",solidSharp:"Solid Sharp",solidRound:"Solid Round",lineSingle:"Line Single",lineMultiple:"Line Multiple",hook:"Hook",polaroid:"Polaroid",edgeSeparate:"Edge Separate",edgeCross:"Edge Cross",edgeOverlap:"Edge Overlap",fill:"Fill",transparent:"Transparent",emoji:"Emoji",shapes:"Shapes",none:"None",frameSize:"Frame Size",frameColor:"Frame Color",imageOutputSize:"Image output size",width:"Width",height:"Height",lockAspectRatio:"Lock Aspect Ratio",resizeHint:"Resize applies when exporting the image",loading:"Loading image...",loadError:"Failed to load image",processing:"Processing...",cropApply:"Apply",text:"Text",fillColor:"Fill Color",fontSize:"Font Size",fontFamily:"Font Family",bold:"Bold",italic:"Italic",textAlign:"Text Align",delete:"Delete",opacity:"Opacity",unsavedChanges:"You have unsaved changes. Are you sure you want to close?",confirm:"Confirm"},Ve={undo:"تراجع",redo:"إعادة",revert:"استعادة",zoomIn:"تكبير",zoomOut:"تصغير",zoomToFit:"ملاءمة العرض",done:"تم",cancel:"إلغاء",export:"تصدير",close:"إغلاق",crop:"قص",filter:"فلتر",finetune:"ضبط دقيق",sticker:"ملصق",frame:"إطار",resize:"تغيير الحجم",aspectRatio:"نسبة العرض إلى الارتفاع",custom:"مخصص",square:"مربع",landscape:"أفقي",portrait:"عمودي",rotation:"دوران",rotateLeft:"تدوير لليسار",rotateRight:"تدوير لليمين",flipHorizontal:"قلب أفقي",flipVertical:"قلب عمودي",brightness:"السطوع",contrast:"التباين",saturation:"التشبع",exposure:"التعريض",temperature:"درجة الحرارة",gamma:"جاما",clarity:"الوضوح",vignette:"تظليل الأطراف",original:"الأصلي",intensity:"الكثافة",chrome:"كروم",fade:"باهت",pastel:"باستيل",cold:"بارد",warm:"دافئ",mono:"أحادي",noir:"نوار",wash:"مغسول",stark:"حاد",sepia:"بني داكن",rust:"صدأ",blues:"أزرق",color:"ملون",solidSharp:"صلب حاد",solidRound:"صلب مستدير",lineSingle:"خط واحد",lineMultiple:"خطوط متعددة",hook:"خطاف",polaroid:"بولارويد",edgeSeparate:"حواف منفصلة",edgeCross:"حواف متقاطعة",edgeOverlap:"حواف متداخلة",fill:"تعبئة",transparent:"شفاف",emoji:"رموز تعبيرية",shapes:"أشكال",none:"بدون",frameSize:"حجم الإطار",frameColor:"لون الإطار",imageOutputSize:"حجم الصورة الناتجة",width:"العرض",height:"الارتفاع",lockAspectRatio:"قفل نسبة العرض إلى الارتفاع",resizeHint:"يتم تطبيق التغيير عند تصدير الصورة",loading:"جاري تحميل الصورة...",loadError:"فشل تحميل الصورة",processing:"جاري المعالجة...",cropApply:"تطبيق",text:"نص",fillColor:"لون التعبئة",fontSize:"حجم الخط",fontFamily:"نوع الخط",bold:"عريض",italic:"مائل",textAlign:"محاذاة النص",delete:"حذف",opacity:"الشفافية",unsavedChanges:"لديك تغييرات غير محفوظة. هل أنت متأكد أنك تريد الإغلاق؟",confirm:"تأكيد"},ut=["disabled","title"],ft={key:0,class:"vie-icon-btn__icon"},mt={key:1,class:"vie-icon-btn__label"},q=e.defineComponent({__name:"IconButton",props:{title:{},label:{},disabled:{type:Boolean},variant:{}},emits:["click"],setup(a){return(t,o)=>(e.openBlock(),e.createElementBlock("button",{class:e.normalizeClass(["vie-icon-btn",{"vie-icon-btn--accent":a.variant==="accent"}]),disabled:a.disabled,title:a.title,onClick:o[0]||(o[0]=n=>t.$emit("click",n))},[t.$slots.default?(e.openBlock(),e.createElementBlock("span",ft,[e.renderSlot(t.$slots,"default")])):e.createCommentVNode("",!0),a.label?(e.openBlock(),e.createElementBlock("span",mt,e.toDisplayString(a.label),1)):e.createCommentVNode("",!0)],10,ut))}}),pt={class:"vie-toolbar"},gt={class:"vie-toolbar-group"},yt={class:"vie-toolbar-group"},wt=["title"],kt={class:"vie-toolbar-group"},vt={key:0,class:"vie-spinner",style:{width:"16px",height:"16px","border-width":"2px"}},bt={key:1,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2.5","stroke-linecap":"round","stroke-linejoin":"round"},$e=e.defineComponent({__name:"EditorToolbar",props:{processing:{type:Boolean}},emits:["done"],setup(a){const t=e.inject(j,n=>n),o=H();return(n,l)=>(e.openBlock(),e.createElementBlock("div",pt,[e.createElementVNode("div",gt,[e.createVNode(q,{title:e.unref(t)("undo"),disabled:!e.unref(o).canUndo.value,onClick:l[0]||(l[0]=f=>e.unref(o).undo())},{default:e.withCtx(()=>[...l[7]||(l[7]=[e.createElementVNode("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"},[e.createElementVNode("path",{d:"M3 10h10a5 5 0 0 1 0 10H9"}),e.createElementVNode("path",{d:"M3 10l4-4"}),e.createElementVNode("path",{d:"M3 10l4 4"})],-1)])]),_:1},8,["title","disabled"]),e.createVNode(q,{title:e.unref(t)("redo"),disabled:!e.unref(o).canRedo.value,onClick:l[1]||(l[1]=f=>e.unref(o).redo())},{default:e.withCtx(()=>[...l[8]||(l[8]=[e.createElementVNode("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"},[e.createElementVNode("path",{d:"M21 10H11a5 5 0 0 0 0 10h4"}),e.createElementVNode("path",{d:"M21 10l-4-4"}),e.createElementVNode("path",{d:"M21 10l-4 4"})],-1)])]),_:1},8,["title","disabled"]),e.createVNode(q,{title:e.unref(t)("revert"),disabled:!e.unref(o).hasEdits.value,onClick:l[2]||(l[2]=f=>e.unref(o).revert())},{default:e.withCtx(()=>[...l[9]||(l[9]=[e.createElementVNode("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"},[e.createElementVNode("path",{d:"M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8"}),e.createElementVNode("path",{d:"M3 3v5h5"})],-1)])]),_:1},8,["title","disabled"])]),e.createElementVNode("div",yt,[e.createVNode(q,{title:e.unref(t)("zoomOut"),onClick:l[3]||(l[3]=f=>e.unref(o).setZoom(e.unref(o).zoom.value-.1))},{default:e.withCtx(()=>[...l[10]||(l[10]=[e.createElementVNode("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round"},[e.createElementVNode("circle",{cx:"11",cy:"11",r:"8"}),e.createElementVNode("path",{d:"M8 11h6"})],-1)])]),_:1},8,["title"]),e.createElementVNode("button",{class:"vie-zoom-label",title:e.unref(t)("zoomToFit"),onClick:l[4]||(l[4]=f=>e.unref(o).setZoom(1))},e.toDisplayString(Math.round(e.unref(o).zoom.value*100))+"% ",9,wt),e.createVNode(q,{title:e.unref(t)("zoomIn"),onClick:l[5]||(l[5]=f=>e.unref(o).setZoom(e.unref(o).zoom.value+.1))},{default:e.withCtx(()=>[...l[11]||(l[11]=[e.createElementVNode("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round"},[e.createElementVNode("circle",{cx:"11",cy:"11",r:"8"}),e.createElementVNode("path",{d:"M8 11h6"}),e.createElementVNode("path",{d:"M11 8v6"})],-1)])]),_:1},8,["title"])]),e.createElementVNode("div",kt,[e.createVNode(q,{variant:"accent",label:a.processing?e.unref(t)("processing"):e.unref(t)("done"),disabled:a.processing,onClick:l[6]||(l[6]=f=>n.$emit("done"))},{default:e.withCtx(()=>[a.processing?(e.openBlock(),e.createElementBlock("span",vt)):(e.openBlock(),e.createElementBlock("svg",bt,[...l[12]||(l[12]=[e.createElementVNode("polyline",{points:"20 6 9 17 4 12"},null,-1)])]))]),_:1},8,["label","disabled"])])]))}});class Be{constructor(t){this.sourceImage=null,this.animFrameId=null,this.needsRender=!0,this.viewport={zoom:1,panX:0,panY:0},this.activePluginId=null,this.fullImageRect={x:0,y:0,width:0,height:0},this.previewCanvas=null,this.previewCtx=null,this.previewCacheKey="",this.previewMaxSize=1024,this.stickerImageCache=new Map,this.afterRender=null,this.getState=null,this.canvas=t;const o=t.getContext("2d");if(!o)throw new Error("Failed to get 2D rendering context");this.ctx=o}setSource(t){this.sourceImage=t,this.previewCacheKey="",this.previewCanvas=null,this.previewCtx=null,this.needsRender=!0}resize(t,o){const n=window.devicePixelRatio||1;this.canvas.width=t*n,this.canvas.height=o*n,this.canvas.style.width=`${t}px`,this.canvas.style.height=`${o}px`,this.ctx.setTransform(n,0,0,n,0,0),this.needsRender=!0}requestRender(t=!1){this.needsRender=!0,t?this.renderNow():this.scheduleRender()}renderNow(){this.animFrameId!==null&&(cancelAnimationFrame(this.animFrameId),this.animFrameId=null),this.needsRender&&this.getState&&(this.render(this.getState()),this.needsRender=!1)}startRenderLoop(t){this.getState=t,this.scheduleRender()}scheduleRender(){this.animFrameId===null&&(this.animFrameId=requestAnimationFrame(()=>{this.animFrameId=null,this.needsRender&&this.getState&&(this.render(this.getState()),this.needsRender=!1)}))}stopRenderLoop(){this.animFrameId!==null&&(cancelAnimationFrame(this.animFrameId),this.animFrameId=null)}buildEffectsCacheKey(t,o){return`${t.brightness},${t.contrast},${t.saturation},${t.exposure},${t.temperature},${t.gamma},${t.clarity},${t.vignette},${o.id},${o.intensity},${o.matrix?"M":"N"}`}hasColorEffects(t,o){return t.brightness!==0||t.contrast!==0||t.saturation!==0||t.exposure!==0||t.temperature!==0||t.gamma!==1||t.clarity!==0||t.vignette!==0||o.matrix!=null}getPreviewSource(t){const o=this.sourceImage,{finetune:n,filter:l}=t;if(!this.hasColorEffects(n,l))return o;const f=this.buildEffectsCacheKey(n,l);if(f===this.previewCacheKey&&this.previewCanvas)return this.previewCanvas;const c=Math.min(this.previewMaxSize/o.naturalWidth,this.previewMaxSize/o.naturalHeight,1),r=Math.round(o.naturalWidth*c),i=Math.round(o.naturalHeight*c);(!this.previewCanvas||this.previewCanvas.width!==r||this.previewCanvas.height!==i)&&(this.previewCanvas=document.createElement("canvas"),this.previewCanvas.width=r,this.previewCanvas.height=i,this.previewCtx=this.previewCanvas.getContext("2d"));const m=this.previewCtx;m.drawImage(o,0,0,r,i);const s=[];if(n.brightness!==0&&s.push(he(n.brightness)),n.contrast!==0&&s.push(ue(n.contrast)),n.saturation!==0&&s.push(fe(n.saturation)),n.exposure!==0&&s.push(me(n.exposure)),n.temperature!==0&&s.push(pe(n.temperature)),l.matrix)if(l.intensity<1){const y=l.matrix,u=l.intensity;s.push(ne.map((x,_)=>x*(1-u)+y[_]*u))}else s.push(l.matrix);const d=m.getImageData(0,0,r,i);return s.length>0&&oe(d,de(...s)),n.gamma!==1&&ie(d,n.gamma),n.clarity!==0&&le(d,n.clarity),n.vignette!==0&&ae(d,n.vignette,r,i),m.putImageData(d,0,0),this.previewCacheKey=f,this.previewCanvas}isCropActive(t){return t.x>.001||t.y>.001||t.width<.999||t.height<.999}render(t){const o=this.ctx,n=this.canvas,l=window.devicePixelRatio||1,f=n.width/l,c=n.height/l;if(o.clearRect(0,0,f,c),!this.sourceImage)return;const r=this.sourceImage,i=t.crop,m=40,s=f-m*2,d=c-m*2,y=this.activePluginId!=="crop"&&this.isCropActive(i),u=this.getPreviewSource(t);y?this.renderCroppedView(o,t,u,f,c,s,d):this.renderFullView(o,t,u,r,f,c,s,d),this.afterRender&&this.afterRender(o,t,this.fullImageRect)}renderFullView(t,o,n,l,f,c,r,i){const m=o.crop,s=Math.min(r/l.naturalWidth,i/l.naturalHeight),d=l.naturalWidth*s,y=l.naturalHeight*s,u=(f-d)/2,x=(c-y)/2;this.fullImageRect={x:u,y:x,width:d,height:y},t.save();const _=this.viewport;t.translate(f/2+_.panX,c/2+_.panY),t.scale(_.zoom,_.zoom),t.translate(-f/2,-c/2);const S=u+d/2,k=x+y/2;t.translate(S,k),t.rotate(m.rotation),t.scale(m.flipX?-1:1,m.flipY?-1:1),t.translate(-S,-k);const h=o.backgroundColor;if(h[3]>0&&(t.fillStyle=`rgba(${Math.round(h[0]*255)}, ${Math.round(h[1]*255)}, ${Math.round(h[2]*255)}, ${h[3]})`,t.fillRect(u,x,d,y)),t.drawImage(n,u,x,d,y),o.frame.style&&this.renderFramePreview(t,o,u,x,d,y),o.stickers.length>0&&this.renderStickers(t,o.stickers,u,x,d,y),o.annotations.length>0)for(const w of o.annotations)ce(t,w,u,x,d,y);t.restore()}renderCroppedView(t,o,n,l,f,c,r){const i=this.sourceImage,m=o.crop,s=i.naturalWidth*m.width,d=i.naturalHeight*m.height,y=Math.min(c/s,r/d);let u=1;if(this.activePluginId==="resize"&&(o.resize.width||o.resize.height)){const I=o.resize.width||Math.round(s*(o.resize.height/d)),F=o.resize.height||Math.round(d*(o.resize.width/s));u=Math.min(I/s,F/d),!o.resize.upscale&&u>1&&(u=1),u>1&&(u=Math.min(u,c/(s*y),r/(d*y)))}const x=y*u,_=s*x,S=d*x,k=(l-_)/2,h=(f-S)/2;this.fullImageRect={x:k,y:h,width:_,height:S};const w=n instanceof HTMLImageElement?n.naturalWidth:n.width,v=n instanceof HTMLImageElement?n.naturalHeight:n.height;t.save();const C=this.viewport;t.translate(l/2+C.panX,f/2+C.panY),t.scale(C.zoom,C.zoom),t.translate(-l/2,-f/2);const V=k+_/2,D=h+S/2;t.translate(V,D),t.rotate(m.rotation),t.scale(m.flipX?-1:1,m.flipY?-1:1),t.translate(-V,-D);const N=o.backgroundColor;if(N[3]>0&&(t.fillStyle=`rgba(${Math.round(N[0]*255)}, ${Math.round(N[1]*255)}, ${Math.round(N[2]*255)}, ${N[3]})`,t.fillRect(k,h,_,S)),t.drawImage(n,m.x*w,m.y*v,m.width*w,m.height*v,k,h,_,S),o.frame.style&&this.renderFramePreview(t,o,k,h,_,S),o.stickers.length>0&&this.renderStickersInCrop(t,o.stickers,m,k,h,_,S),o.annotations.length>0)for(const I of o.annotations)at(t,I,m,k,h,_,S);if(t.restore(),this.activePluginId==="resize"&&(o.resize.width||o.resize.height)){const I=o.resize.width||Math.round(s*(o.resize.height/d)),F=o.resize.height||Math.round(d*(o.resize.width/s)),P=`${I} × ${F} px`;t.save(),t.font='12px -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',t.textAlign="center",t.textBaseline="top";const B=l/2,W=h+S+8,R=t.measureText(P).width+16,p=22;t.fillStyle="rgba(0, 0, 0, 0.6)",t.beginPath(),t.roundRect(B-R/2,W,R,p,4),t.fill(),t.fillStyle="#fff",t.fillText(P,B,W+4),t.restore()}}renderFramePreview(t,o,n,l,f,c){const r=o.frame,i=Math.round(Math.max(f,c)*r.size),m=r.color,s=`rgba(${Math.round(m[0]*255)}, ${Math.round(m[1]*255)}, ${Math.round(m[2]*255)}, ${m[3]})`,d=Math.round(r.radius);switch(t.strokeStyle=s,t.fillStyle=s,r.style){case"solidSharp":t.lineWidth=i,t.strokeRect(n+i/2,l+i/2,f-i,c-i);break;case"solidRound":t.lineWidth=i,t.beginPath(),t.roundRect(n+i/2,l+i/2,f-i,c-i,d+i/2),t.stroke();break;case"lineSingle":{const y=i*2;t.lineWidth=1,t.strokeRect(n+y,l+y,f-y*2,c-y*2);break}case"lineMultiple":t.lineWidth=1;for(let y=1;y<=3;y++){const u=i*y;t.strokeRect(n+u,l+u,f-u*2,c-u*2)}break;case"hook":{const y=Math.min(f,c)*.1;t.lineWidth=i*.5;const u=i;t.beginPath(),t.moveTo(n+u,l+u+y),t.lineTo(n+u,l+u),t.lineTo(n+u+y,l+u),t.stroke(),t.beginPath(),t.moveTo(n+f-u-y,l+u),t.lineTo(n+f-u,l+u),t.lineTo(n+f-u,l+u+y),t.stroke(),t.beginPath(),t.moveTo(n+u,l+c-u-y),t.lineTo(n+u,l+c-u),t.lineTo(n+u+y,l+c-u),t.stroke(),t.beginPath(),t.moveTo(n+f-u-y,l+c-u),t.lineTo(n+f-u,l+c-u),t.lineTo(n+f-u,l+c-u-y),t.stroke();break}case"polaroid":{const y=i,u=i*4;t.fillRect(n,l,f,y),t.fillRect(n,l,y,c),t.fillRect(n+f-y,l,y,c),t.fillRect(n,l+c-u,f,u);break}default:t.lineWidth=i*.5,t.strokeRect(n+i,l+i,f-i*2,c-i*2);break}}getImageRect(){return{...this.fullImageRect}}renderStickers(t,o,n,l,f,c){for(const r of o){const i=n+r.x*f,m=l+r.y*c,s=r.width*f,d=r.height*c;if(t.save(),t.globalAlpha=r.opacity,t.translate(i+s/2,m+d/2),t.rotate(r.rotation),t.scale(r.flipX?-1:1,r.flipY?-1:1),!r.src.startsWith("http")&&!r.src.startsWith("data:")&&!r.src.startsWith("blob:")&&!r.src.startsWith("/")&&!r.src.startsWith(".")){const u=Math.max(8,Math.min(s,d)*.8);t.font=`${u}px sans-serif`,t.textAlign="center",t.textBaseline="middle",t.fillText(r.src,0,0)}else{let u=this.stickerImageCache.get(r.src);if(!u){if(this.stickerImageCache.size>=50){const x=this.stickerImageCache.keys().next().value;x!==void 0&&this.stickerImageCache.delete(x)}u=new Image,u.crossOrigin="anonymous",u.src=r.src,this.stickerImageCache.set(r.src,u),u.onload=()=>{this.requestRender()},u.onerror=()=>{this.stickerImageCache.delete(r.src)}}u.complete&&u.naturalWidth>0&&t.drawImage(u,-s/2,-d/2,s,d)}t.restore()}}renderStickersInCrop(t,o,n,l,f,c,r){if(!(n.width<=0||n.height<=0))for(const i of o){const m=(i.x-n.x)/n.width,s=(i.y-n.y)/n.height,d=i.width/n.width,y=i.height/n.height;if(m+d<0||m>1||s+y<0||s>1)continue;const u=l+m*c,x=f+s*r,_=d*c,S=y*r;if(t.save(),t.globalAlpha=i.opacity,t.translate(u+_/2,x+S/2),t.rotate(i.rotation),t.scale(i.flipX?-1:1,i.flipY?-1:1),!i.src.startsWith("http")&&!i.src.startsWith("data:")&&!i.src.startsWith("blob:")&&!i.src.startsWith("/")&&!i.src.startsWith(".")){const h=Math.max(8,Math.min(_,S)*.8);t.font=`${h}px sans-serif`,t.textAlign="center",t.textBaseline="middle",t.fillText(i.src,0,0)}else{let h=this.stickerImageCache.get(i.src);if(!h){if(this.stickerImageCache.size>=50){const w=this.stickerImageCache.keys().next().value;w!==void 0&&this.stickerImageCache.delete(w)}h=new Image,h.crossOrigin="anonymous",h.src=i.src,this.stickerImageCache.set(i.src,h),h.onload=()=>{this.requestRender()},h.onerror=()=>{this.stickerImageCache.delete(i.src)}}h.complete&&h.naturalWidth>0&&t.drawImage(h,-_/2,-S/2,_,S)}t.restore()}}destroy(){this.stopRenderLoop(),this.sourceImage=null,this.previewCanvas=null,this.previewCtx=null,this.stickerImageCache.clear()}}const xt={key:0,class:"vie-canvas-overlay vie-canvas-overlay--interactive"},_t={key:1,class:"vie-canvas-loading"},Ct={key:2,class:"vie-canvas-loading",style:{color:"var(--vie-danger)"}},ze=e.defineComponent({__name:"EditorCanvas",setup(a,{expose:t}){const o=e.inject(j,p=>p),n=H(),l=e.ref(null),f=e.ref(null),c=e.ref({x:0,y:0,width:0,height:0}),r=e.ref({width:0,height:0});let i=null,m=null,s=null,d=null;function y(){i&&(c.value=i.getImageRect())}e.onMounted(()=>{if(!f.value||!l.value)return;i=new Be(f.value),m=new ResizeObserver(b=>{for(const M of b){const{width:$,height:z}=M.contentRect;$>0&&z>0&&(r.value={width:$,height:z},i==null||i.resize($,z),i==null||i.requestRender(),requestAnimationFrame(y))}}),m.observe(l.value);function p(){s==null||s.removeEventListener("change",d);const b=window.devicePixelRatio||1;s=window.matchMedia(`(resolution: ${b}dppx)`),d=()=>{const{width:M,height:$}=r.value;M>0&&$>0&&(i==null||i.resize(M,$),i==null||i.requestRender()),p()},s.addEventListener("change",d)}p();const g=l.value.getBoundingClientRect();r.value={width:g.width,height:g.height},i.resize(g.width,g.height),i.startRenderLoop(()=>n.state),i.afterRender=(b,M,$)=>{const z=n.activePlugin.value;z!=null&&z.onRender&&z.onRender({ctx:b,state:M,imageRect:$})},n.onRender.value=b=>{i==null||i.requestRender(b),requestAnimationFrame(y)},i.activePluginId=n.activePluginId.value,u=n.zoom.value,x=n.zoom.value,S=0,k=0,h=0,w=0,n.options.src&&n.load(n.options.src)}),e.watch(()=>n.sourceImage.value,p=>{i&&p&&(i.setSource(p),i.requestRender(),requestAnimationFrame(()=>requestAnimationFrame(y)))}),e.watch(()=>n.zoom.value,p=>{i&&(i.viewport.zoom=p,i.requestRender(),requestAnimationFrame(y)),_||(u=p,x=p,p<=1.005&&(S=0,k=0,h=0,w=0,v()))}),e.watch(()=>n.activePluginId.value,p=>{i&&(i.activePluginId=p,i.requestRender(),requestAnimationFrame(y))}),e.watch(()=>n.cropDragPan.value,p=>{i&&(i.viewport.panX=h+p.x,i.viewport.panY=w+p.y,i.requestRender())},{deep:!0});let u=1,x=1,_=!1,S=0,k=0,h=0,w=0;function v(){i&&(i.viewport.panX=h,i.viewport.panY=w,i.requestRender(),requestAnimationFrame(y))}function C(p){const g=p.deltaY>0?.95:1.05,b=Math.max(.1,Math.min(10,u*g)),M=l.value.getBoundingClientRect(),$=p.clientX-M.left-M.width/2,z=p.clientY-M.top-M.height/2,L=b/u;S=$-($-S)*L,k=z-(z-k)*L,u=b,u<=1.005&&(S=0,k=0),_||(_=!0,V())}function V(){const p=u-x,g=S-h,b=k-w;if(Math.abs(p)<.001&&Math.abs(g)<.5&&Math.abs(b)<.5){x=u,h=S,w=k,n.setZoom(x),v(),_=!1;return}const $=.15;x+=p*$,h+=g*$,w+=b*$,n.setZoom(x),v(),requestAnimationFrame(V)}const D=e.ref(!1),N=e.computed(()=>n.zoom.value>1.005&&n.activePluginId.value!=="crop");function I(p){if(p.button!==0||!N.value||p.target!==l.value&&p.target!==f.value)return;p.preventDefault(),D.value=!0;const g=p.clientX,b=p.clientY,M=S,$=k,z=A=>{S=M+(A.clientX-g),k=$+(A.clientY-b),h=S,w=k,v()},L=()=>{D.value=!1,window.removeEventListener("mousemove",z),window.removeEventListener("mouseup",L)};window.addEventListener("mousemove",z),window.addEventListener("mouseup",L)}let F=0,P=1;function B(p,g){const b=p.clientX-g.clientX,M=p.clientY-g.clientY;return Math.sqrt(b*b+M*M)}function W(p){p.touches.length===2&&(F=B(p.touches[0],p.touches[1]),P=n.zoom.value)}function E(p){if(p.touches.length===2){const g=B(p.touches[0],p.touches[1]);if(F>0){const b=g/F;n.setZoom(P*b)}}}function R(p){F=0}return e.onBeforeUnmount(()=>{m==null||m.disconnect(),s==null||s.removeEventListener("change",d),s=null,i==null||i.destroy(),i=null,n.onRender.value=null}),t({getRenderer:()=>i}),(p,g)=>{var b;return e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["vie-canvas-wrapper",{"vie-canvas-wrapper--grab":N.value,"vie-canvas-wrapper--grabbing":D.value}]),ref_key:"wrapperRef",ref:l,onWheel:e.withModifiers(C,["prevent"]),onMousedown:I,onTouchstartPassive:W,onTouchmove:e.withModifiers(E,["prevent"]),onTouchendPassive:R},[e.createElementVNode("canvas",{ref_key:"canvasRef",ref:f,class:"vie-canvas"},null,512),(b=e.unref(n).activePlugin.value)!=null&&b.overlay?(e.openBlock(),e.createElementBlock("div",xt,[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(e.unref(n).activePlugin.value.overlay),{"canvas-rect":c.value,"wrapper-size":r.value},null,8,["canvas-rect","wrapper-size"]))])):e.createCommentVNode("",!0),e.unref(n).loading.value?(e.openBlock(),e.createElementBlock("div",_t,[g[0]||(g[0]=e.createElementVNode("span",{class:"vie-spinner"},null,-1)),e.createElementVNode("span",null,e.toDisplayString(e.unref(o)("loading")),1)])):e.createCommentVNode("",!0),e.unref(n).error.value?(e.openBlock(),e.createElementBlock("div",Ct,e.toDisplayString(e.unref(o)("loadError")),1)):e.createCommentVNode("",!0)],34)}}}),Et={class:"vie-tab-bar",role:"tablist"},St=["aria-selected","onClick"],Mt={class:"vie-tab__label"},Ne=e.defineComponent({__name:"EditorTabs",setup(a){const t=e.inject(j,i=>i),o=H(),n=e.ref([]),l=new Set(["svg","path","circle","rect","line","polyline","polygon","ellipse","g","defs","clippath","mask","use","text","tspan"]),f=new Set(["viewbox","width","height","fill","stroke","stroke-width","stroke-linecap","stroke-linejoin","d","cx","cy","r","rx","ry","x","y","x1","y1","x2","y2","points","transform","opacity","class","id","clip-path","clip-rule","fill-rule","fill-opacity","stroke-opacity","stroke-dasharray","stroke-dashoffset"]);function c(i){const d=new DOMParser().parseFromString(i,"image/svg+xml").documentElement;function y(u){const x=Array.from(u.children);for(const _ of x)if(!l.has(_.tagName.toLowerCase()))_.remove();else{for(const S of Array.from(_.attributes))f.has(S.name.toLowerCase())||_.removeAttribute(S.name);y(_)}}return y(d),d.outerHTML}function r(){const i=o.plugins.value.filter(m=>typeof m.icon=="string");n.value.forEach((m,s)=>{m&&i[s]&&(m.innerHTML=c(i[s].icon))})}return e.onMounted(r),e.onUpdated(r),(i,m)=>(e.openBlock(),e.createElementBlock("div",Et,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(o).plugins.value,s=>(e.openBlock(),e.createElementBlock("button",{key:s.id,role:"tab","aria-selected":s.id===e.unref(o).activePluginId.value,class:e.normalizeClass(["vie-tab",{"vie-tab--active":s.id===e.unref(o).activePluginId.value}]),onClick:d=>e.unref(o).setActivePlugin(s.id)},[typeof s.icon=="string"?(e.openBlock(),e.createElementBlock("span",{key:0,class:"vie-tab__icon",ref_for:!0,ref_key:"iconRefs",ref:n},null,512)):(e.openBlock(),e.createBlock(e.resolveDynamicComponent(s.icon),{key:1,class:"vie-tab__icon"})),e.createElementVNode("span",Mt,e.toDisplayString(e.unref(t)(s.labelKey)),1)],10,St))),128))]))}}),Vt={key:0,class:"vie-control-panel"},Re=e.defineComponent({__name:"EditorControlPanel",setup(a){const t=H();return(o,n)=>{var l;return(l=e.unref(t).activePlugin.value)!=null&&l.controls?(e.openBlock(),e.createElementBlock("div",Vt,[e.createVNode(e.Transition,{name:"vie-panel",mode:"out-in"},{default:e.withCtx(()=>[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(e.unref(t).activePlugin.value.controls),{key:e.unref(t).activePluginId.value}))]),_:1})])):e.createCommentVNode("",!0)}}}),$t=["aria-valuemin","aria-valuemax","aria-valuenow","aria-labelledby"],Bt={class:"vie-slider__track"},zt={key:0,class:"vie-slider__tooltip"},Nt={class:"vie-slider__value"},J=e.defineComponent({__name:"Slider",props:{modelValue:{},min:{default:0},max:{default:1},step:{default:.01},base:{default:0},label:{},format:{default:"percent"},ticks:{}},emits:["update:modelValue"],setup(a,{emit:t}){const o=`vie-slider-${Math.random().toString(36).slice(2,9)}`,n=a,l=t,f=e.ref(null),c=e.ref(!1),r=e.computed(()=>(n.modelValue-n.min)/(n.max-n.min)),i=e.computed(()=>(n.base-n.min)/(n.max-n.min)),m=e.computed(()=>n.ticks?n.ticks.map(k=>(k-n.min)/(n.max-n.min)):[]),s=e.computed(()=>Math.max(0,Math.min(100,r.value*100))),d=e.computed(()=>{const k=Math.max(0,Math.min(1,Math.min(i.value,r.value))),h=Math.max(0,Math.min(1,Math.max(i.value,r.value)));return{insetInlineStart:k*100+"%",insetInlineEnd:(1-h)*100+"%"}}),y=e.computed(()=>n.format==="percent"?Math.round(n.modelValue*100)+"%":n.modelValue.toFixed(2));function u(k){if(!f.value)return n.modelValue;const h=f.value.getBoundingClientRect(),w=getComputedStyle(f.value).direction==="rtl";let v;w?v=(h.right-k.clientX)/h.width:v=(k.clientX-h.left)/h.width,v=Math.max(0,Math.min(1,v));let C=n.min+v*(n.max-n.min);return C=Math.round(C/n.step)*n.step,Math.max(n.min,Math.min(n.max,C))}function x(k){if(k.button!==0)return;c.value=!0,l("update:modelValue",u(k));const h=v=>{l("update:modelValue",u(v))},w=()=>{c.value=!1,window.removeEventListener("pointermove",h),window.removeEventListener("pointerup",w)};window.addEventListener("pointermove",h),window.addEventListener("pointerup",w)}function _(){l("update:modelValue",n.base)}function S(k){let h=n.modelValue;const v=(f.value?getComputedStyle(f.value).direction==="rtl":!1)?-n.step:n.step;switch(k.key){case"ArrowRight":h=n.modelValue+v;break;case"ArrowLeft":h=n.modelValue-v;break;case"ArrowUp":h=n.modelValue+n.step;break;case"ArrowDown":h=n.modelValue-n.step;break;case"Home":h=n.min;break;case"End":h=n.max;break;default:return}k.preventDefault(),h=Math.max(n.min,Math.min(n.max,h)),l("update:modelValue",Math.round(h/n.step)*n.step)}return(k,h)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["vie-slider",{"vie-slider--dragging":c.value}])},[a.label?(e.openBlock(),e.createElementBlock("span",{key:0,class:"vie-slider__label",id:o},e.toDisplayString(a.label),1)):e.createCommentVNode("",!0),e.createElementVNode("div",{ref_key:"trackRef",ref:f,class:"vie-slider__track-wrapper",role:"slider",tabindex:"0","aria-valuemin":a.min,"aria-valuemax":a.max,"aria-valuenow":a.modelValue,"aria-labelledby":a.label?o:void 0,onPointerdown:x,onDblclick:_,onKeydown:S},[e.createElementVNode("div",Bt,[e.createElementVNode("div",{class:"vie-slider__base-mark",style:e.normalizeStyle({insetInlineStart:i.value*100+"%"})},null,4),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(m.value,(w,v)=>(e.openBlock(),e.createElementBlock("div",{key:v,class:"vie-slider__tick",style:e.normalizeStyle({insetInlineStart:w*100+"%"})},null,4))),128)),e.createElementVNode("div",{class:"vie-slider__fill",style:e.normalizeStyle(d.value)},null,4),e.createElementVNode("div",{class:"vie-slider__thumb",style:e.normalizeStyle({insetInlineStart:s.value+"%"})},[h[0]||(h[0]=e.createElementVNode("span",{class:"vie-slider__thumb-dot"},null,-1)),c.value?(e.openBlock(),e.createElementBlock("span",zt,e.toDisplayString(y.value),1)):e.createCommentVNode("",!0)],4)])],40,$t),e.createElementVNode("span",Nt,e.toDisplayString(y.value),1)],2))}}),Rt=["aria-expanded"],It={key:0,class:"vie-dropdown__menu",role:"listbox"},Pt=["aria-selected","onClick"],Tt=e.defineComponent({__name:"Dropdown",props:{modelValue:{},options:{}},emits:["update:modelValue"],setup(a,{emit:t}){const o=a,n=t,l=e.ref(!1),f=e.ref(null),c=e.computed(()=>{const m=o.options.find(s=>s.value===o.modelValue);return m?m.label:""});function r(m){n("update:modelValue",m),l.value=!1}function i(m){f.value&&!f.value.contains(m.target)&&(l.value=!1)}return e.watch(l,m=>{m?document.addEventListener("click",i):document.removeEventListener("click",i)}),e.onBeforeUnmount(()=>{document.removeEventListener("click",i)}),(m,s)=>(e.openBlock(),e.createElementBlock("div",{class:"vie-dropdown",ref_key:"dropdownRef",ref:f},[e.createElementVNode("button",{class:"vie-dropdown__trigger",role:"combobox","aria-expanded":l.value,"aria-haspopup":"listbox",onClick:s[0]||(s[0]=d=>l.value=!l.value)},[e.createElementVNode("span",null,e.toDisplayString(c.value),1),s[1]||(s[1]=e.createElementVNode("svg",{class:"vie-dropdown__chevron",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2"},[e.createElementVNode("path",{d:"M6 9l6 6 6-6"})],-1))],8,Rt),e.createVNode(e.Transition,{name:"vie-dropdown"},{default:e.withCtx(()=>[l.value?(e.openBlock(),e.createElementBlock("div",It,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(a.options,d=>(e.openBlock(),e.createElementBlock("button",{key:d.value,role:"option","aria-selected":d.value===a.modelValue,class:e.normalizeClass(["vie-dropdown__item",{"vie-dropdown__item--active":d.value===a.modelValue}]),onClick:y=>r(d.value)},e.toDisplayString(d.label),11,Pt))),128))])):e.createCommentVNode("",!0)]),_:1})],512))}}),Ft=[{labelKey:"custom",value:null},{labelKey:"square",value:1},{labelKey:"landscape",value:4/3},{labelKey:"landscape",value:16/9},{labelKey:"portrait",value:3/4},{labelKey:"portrait",value:9/16}];function Dt(a,t){if(a.value===null)return t("custom");if(a.value===1)return t("square")+" 1:1";const n={[4/3]:"4:3",[16/9]:"16:9",[3/4]:"3:4",[9/16]:"9:16"}[a.value]||`${a.value.toFixed(2)}`,l=a.value>1?"landscape":"portrait";return`${t(l)} ${n}`}const Lt={class:"vie-crop-controls"},Wt={class:"vie-crop-controls__section"},At={class:"vie-crop-controls__section"},Kt={class:"vie-crop-controls__section"},Ht={class:"vie-crop-controls__rotation"},jt=e.defineComponent({__name:"CropControls",setup(a){const t=e.inject(j,k=>k),o=H();let n=!1;e.watch(()=>o.sourceImage.value,k=>{if(!k||n)return;const h=o.state.crop;if(!(h.x===0&&h.y===0&&h.width===1&&h.height===1&&h.aspectRatio===null&&h.rotation===0&&!h.flipX&&!h.flipY))return;n=!0;const v=k.naturalWidth/k.naturalHeight;if(v>=1){const C=1/v;o.updateState(V=>{V.crop.x=(1-C)/2,V.crop.y=0,V.crop.width=C,V.crop.height=1,V.crop.aspectRatio=1})}else{const C=v;o.updateState(V=>{V.crop.x=0,V.crop.y=(1-C)/2,V.crop.width=1,V.crop.height=C,V.crop.aspectRatio=1})}},{immediate:!0});const l=e.computed(()=>Ft.map(k=>({label:Dt(k,t),value:k.value==null?"custom":k.value}))),f=e.computed(()=>{const k=o.state.crop.aspectRatio;return k===null?"custom":k});function c(k){const h=k==="custom"?null:Number(k);o.updateState(w=>{if(w.crop.aspectRatio=h,h!==null){const v=w.crop.width,C=w.crop.height;if(v/C>h){const D=C*h;w.crop.x+=(v-D)/2,w.crop.width=D}else{const D=v/h;w.crop.y+=(C-D)/2,w.crop.height=D}}})}const r=e.ref(0),i=o.state.crop.rotation,m=Math.round(i/(Math.PI/2));r.value=(m%4+4)%4;function s(){return o.state.crop.rotation-r.value*(Math.PI/2)}const d=e.computed(()=>s()*180/Math.PI);function y(k){o.updateState(h=>{h.crop.rotation=r.value*(Math.PI/2)+k*Math.PI/180})}function u(){const k=s();r.value=((r.value-1)%4+4)%4,o.updateState(h=>{h.crop.rotation=r.value*(Math.PI/2)+k})}function x(){const k=s();r.value=(r.value+1)%4,o.updateState(h=>{h.crop.rotation=r.value*(Math.PI/2)+k})}function _(){o.updateState(k=>{k.crop.flipX=!k.crop.flipX})}function S(){o.updateState(k=>{k.crop.flipY=!k.crop.flipY})}return(k,h)=>(e.openBlock(),e.createElementBlock("div",Lt,[e.createElementVNode("div",Wt,[e.createVNode(Tt,{"model-value":f.value,options:l.value,"onUpdate:modelValue":c},null,8,["model-value","options"])]),h[4]||(h[4]=e.createElementVNode("div",{class:"vie-crop-controls__divider"},null,-1)),e.createElementVNode("div",At,[e.createVNode(q,{title:e.unref(t)("rotateLeft"),onClick:u},{default:e.withCtx(()=>[...h[0]||(h[0]=[e.createElementVNode("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"},[e.createElementVNode("path",{d:"M2.5 2v6h6"}),e.createElementVNode("path",{d:"M2.5 8C5 4 9 2 13 2a9 9 0 1 1-6 15.7"})],-1)])]),_:1},8,["title"]),e.createVNode(q,{title:e.unref(t)("rotateRight"),onClick:x},{default:e.withCtx(()=>[...h[1]||(h[1]=[e.createElementVNode("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"},[e.createElementVNode("path",{d:"M21.5 2v6h-6"}),e.createElementVNode("path",{d:"M21.5 8C19 4 15 2 11 2a9 9 0 1 0 6 15.7"})],-1)])]),_:1},8,["title"])]),h[5]||(h[5]=e.createElementVNode("div",{class:"vie-crop-controls__divider"},null,-1)),e.createElementVNode("div",Kt,[e.createVNode(q,{title:e.unref(t)("flipHorizontal"),onClick:_},{default:e.withCtx(()=>[...h[2]||(h[2]=[e.createElementVNode("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round"},[e.createElementVNode("path",{d:"M12 3v18"}),e.createElementVNode("path",{d:"M16 7l4 5-4 5"}),e.createElementVNode("path",{d:"M8 7L4 12l4 5"})],-1)])]),_:1},8,["title"]),e.createVNode(q,{title:e.unref(t)("flipVertical"),onClick:S},{default:e.withCtx(()=>[...h[3]||(h[3]=[e.createElementVNode("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round"},[e.createElementVNode("path",{d:"M3 12h18"}),e.createElementVNode("path",{d:"M7 8L12 4l5 4"}),e.createElementVNode("path",{d:"M7 16l5 4 5-4"})],-1)])]),_:1},8,["title"])]),h[6]||(h[6]=e.createElementVNode("div",{class:"vie-crop-controls__divider"},null,-1)),e.createElementVNode("div",Ht,[e.createVNode(J,{label:e.unref(t)("rotation"),"model-value":d.value,min:-45,max:45,step:.5,base:0,format:"number",ticks:[-45,-30,-15,0,15,30,45],"onUpdate:modelValue":y},null,8,["label","model-value"])])]))}}),Ot=["viewBox","width","height"],Xt=["width","height"],qt=["x","y","width","height"],Ut=["width","height","mask"],Yt=["x","y","width","height"],Zt={key:0,class:"vie-crop-grid"},Jt=["x1","y1","x2","y2"],Gt=["x1","y1","x2","y2"],Qt=["x","y","width","height"],en=["x","y","data-handle"],tn=["x","y","width","height","data-handle"],nn=["x","y"],on={xmlns:"http://www.w3.org/1999/xhtml",style:{display:"flex","justify-content":"center","pointer-events":"none"}},Y=12,an=8,ln=32,rn=e.defineComponent({__name:"CropOverlay",props:{canvasRect:{},wrapperSize:{}},setup(a){const t=`vie-crop-mask-${Math.random().toString(36).slice(2,9)}`,o=a,n=H(),l=e.inject(j,w=>w),f=e.computed(()=>o.wrapperSize.width||800),c=e.computed(()=>o.wrapperSize.height||600),r=e.computed(()=>{const w=o.canvasRect,v=n.state.crop;return{x:w.x+v.x*w.width,y:w.y+v.y*w.height,width:v.width*w.width,height:v.height*w.height}}),i=e.computed(()=>{const w=r.value,C=Y/2;return[{id:"nw",x:w.x-C,y:w.y-C},{id:"ne",x:w.x+w.width-C,y:w.y-C},{id:"sw",x:w.x-C,y:w.y+w.height-C},{id:"se",x:w.x+w.width-C,y:w.y+w.height-C}]}),m=e.computed(()=>{const w=r.value,v=Math.min(ln,w.width*.3,w.height*.3),C=an;return[{id:"n",x:w.x+(w.width-v)/2,y:w.y-C/2,w:v,h:C},{id:"s",x:w.x+(w.width-v)/2,y:w.y+w.height-C/2,w:v,h:C},{id:"w",x:w.x-C/2,y:w.y+(w.height-v)/2,w:C,h:v},{id:"e",x:w.x+w.width-C/2,y:w.y+(w.height-v)/2,w:C,h:v}]}),s=e.ref(null),d=e.ref({x:0,y:0}),y=e.ref({x:0,y:0,width:0,height:0}),u=e.ref(!1);let x=null;function _(w){const v=w.target,C=v.getAttribute("data-handle");if(!C)return;w.preventDefault();const V=v.ownerSVGElement||v;V.setPointerCapture(w.pointerId),s.value=C,d.value={x:w.clientX,y:w.clientY},y.value={...n.state.crop};const D=F=>{if(!s.value)return;const P=o.canvasRect;if(P.width===0||P.height===0)return;const B=(F.clientX-d.value.x)/P.width,W=(F.clientY-d.value.y)/P.height,E=y.value,R=n.state.crop,p=R.aspectRatio;switch(s.value){case"move":{const g=F.clientX-d.value.x,b=F.clientY-d.value.y,M=h(E.x-g/P.width,0,1-R.width),$=h(E.y-b/P.height,0,1-R.height),z=(E.x-M)*P.width,L=(E.y-$)*P.height;n.cropDragPan.value={x:z,y:L};break}case"nw":{let g=h(E.x+B),b=h(E.y+W),M=E.x+E.width-g,$=E.y+E.height-b;p&&($=M/p,b=E.y+E.height-$,b<0&&(b=0,$=E.y+E.height,M=$*p,g=E.x+E.width-M)),M>.02&&$>.02&&g>=0&&b>=0&&(R.x=g,R.y=b,R.width=M,R.height=$);break}case"ne":{let g=h(E.width+B,.02,1-E.x),b=E.y+W,M=E.y+E.height-b;p&&(M=g/p,b=E.y+E.height-M,b<0&&(b=0,M=E.y+E.height,g=M*p)),g>.02&&M>.02&&b>=0&&E.x+g<=1&&(R.y=b,R.width=g,R.height=M);break}case"sw":{let g=h(E.x+B),b=E.x+E.width-g,M=h(E.height+W,.02,1-E.y);p&&(b=M*p,g=E.x+E.width-b,g<0&&(g=0,b=E.x+E.width,M=b/p)),b>.02&&M>.02&&g>=0&&E.y+M<=1&&(R.x=g,R.width=b,R.height=M);break}case"se":{let g=h(E.width+B,.02,1-E.x),b=h(E.height+W,.02,1-E.y);p&&(b=g/p,E.y+b>1&&(b=1-E.y,g=b*p)),g>.02&&b>.02&&E.x+g<=1&&E.y+b<=1&&(R.width=g,R.height=b);break}case"n":{let g=h(E.y+W),b=E.y+E.height-g;if(p){const M=b*p,$=M-E.width,z=h(E.x-$/2,0,1-M);M>.02&&z>=0&&z+M<=1&&(R.x=z,R.width=M)}b>.02&&g>=0&&(R.y=g,R.height=b);break}case"s":{let g=h(E.height+W,.02,1-E.y);if(p){const b=g*p,M=b-E.width,$=h(E.x-M/2,0,1-b);b>.02&&$>=0&&$+b<=1&&(R.x=$,R.width=b)}g>.02&&E.y+g<=1&&(R.height=g);break}case"w":{let g=h(E.x+B),b=E.x+E.width-g;if(p){const M=b/p,$=M-E.height,z=h(E.y-$/2,0,1-M);M>.02&&z>=0&&z+M<=1&&(R.y=z,R.height=M)}b>.02&&g>=0&&(R.x=g,R.width=b);break}case"e":{let g=h(E.width+B,.02,1-E.x);if(p){const b=g/p,M=b-E.height,$=h(E.y-M/2,0,1-b);b>.02&&$>=0&&$+b<=1&&(R.y=$,R.height=b)}g>.02&&E.x+g<=1&&(R.width=g);break}}n.requestRender()},N=()=>{window.removeEventListener("pointermove",D),window.removeEventListener("pointerup",I),x=null},I=F=>{if(s.value==="move"){const P=F.clientX-d.value.x,B=F.clientY-d.value.y,W=o.canvasRect,E=y.value,R=n.state.crop;R.x=h(E.x-P/W.width,0,1-R.width),R.y=h(E.y-B/W.height,0,1-R.height),n.cropDragPan.value={x:0,y:0}}s.value&&(s.value!=="move"&&(u.value=!0),n.updateState(()=>{})),s.value=null;try{V.releasePointerCapture(F.pointerId)}catch{}N()};window.addEventListener("pointermove",D),window.addEventListener("pointerup",I),x=N}e.onBeforeUnmount(()=>{x==null||x(),n.cropDragPan.value={x:0,y:0}});const S=e.computed(()=>{const w=n.state.crop;return u.value&&!s.value&&r.value.width>60&&r.value.height>60&&(w.x>.001||w.y>.001||w.width<.999||w.height<.999)});e.watch(()=>n.state.crop.aspectRatio,()=>{u.value=!1});function k(){const w=n.plugins.value,v=w.findIndex(C=>C.id===n.activePluginId.value);v>=0&&v<w.length-1&&n.setActivePlugin(w[v+1].id)}function h(w,v=0,C=1){return Math.max(v,Math.min(C,w))}return(w,v)=>(e.openBlock(),e.createElementBlock("svg",{class:e.normalizeClass(["vie-crop-overlay",{"vie-crop-overlay--dragging":s.value}]),role:"application","aria-label":"Crop region",viewBox:`0 0 ${f.value} ${c.value}`,width:f.value,height:c.value,style:{"touch-action":"none"},onPointerdown:_},[e.createElementVNode("defs",null,[e.createElementVNode("mask",{id:t},[e.createElementVNode("rect",{x:"0",y:"0",width:f.value,height:c.value,fill:"white"},null,8,Xt),e.createElementVNode("rect",{x:r.value.x,y:r.value.y,width:Math.max(0,r.value.width),height:Math.max(0,r.value.height),fill:"black"},null,8,qt)])]),e.createElementVNode("rect",{x:"0",y:"0",width:f.value,height:c.value,class:"vie-crop-mask",mask:`url(#${t})`},null,8,Ut),e.createElementVNode("rect",{x:r.value.x,y:r.value.y,width:Math.max(0,r.value.width),height:Math.max(0,r.value.height),class:"vie-crop-border"},null,8,Yt),r.value.width>10&&r.value.height>10?(e.openBlock(),e.createElementBlock("g",Zt,[(e.openBlock(),e.createElementBlock(e.Fragment,null,e.renderList(2,C=>e.createElementVNode("line",{key:"h"+C,x1:r.value.x,y1:r.value.y+r.value.height*(C/3),x2:r.value.x+r.value.width,y2:r.value.y+r.value.height*(C/3)},null,8,Jt)),64)),(e.openBlock(),e.createElementBlock(e.Fragment,null,e.renderList(2,C=>e.createElementVNode("line",{key:"v"+C,x1:r.value.x+r.value.width*(C/3),y1:r.value.y,x2:r.value.x+r.value.width*(C/3),y2:r.value.y+r.value.height},null,8,Gt)),64))])):e.createCommentVNode("",!0),e.createElementVNode("rect",{x:r.value.x+Y,y:r.value.y+Y,width:Math.max(0,r.value.width-Y*2),height:Math.max(0,r.value.height-Y*2),class:"vie-crop-move","data-handle":"move"},null,8,Qt),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(i.value,C=>(e.openBlock(),e.createElementBlock("rect",{key:C.id,x:C.x,y:C.y,width:Y,height:Y,class:e.normalizeClass(["vie-crop-handle",`vie-crop-handle--${C.id}`]),"data-handle":C.id,rx:"2"},null,10,en))),128)),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(m.value,C=>(e.openBlock(),e.createElementBlock("rect",{key:C.id,x:C.x,y:C.y,width:C.w,height:C.h,class:e.normalizeClass(["vie-crop-handle",`vie-crop-handle--${C.id}`]),"data-handle":C.id,rx:"2"},null,10,tn))),128)),S.value?(e.openBlock(),e.createElementBlock("foreignObject",{key:1,x:r.value.x+(r.value.width-100)/2,y:r.value.y+r.value.height-14,width:"100",height:"36",style:{"pointer-events":"none",overflow:"visible"}},[e.createElementVNode("div",on,[e.createElementVNode("button",{class:"vie-crop-confirm-pill",onPointerdown:v[0]||(v[0]=e.withModifiers(()=>{},["stop"])),onClick:e.withModifiers(k,["stop"])},[v[1]||(v[1]=e.createElementVNode("svg",{viewBox:"0 0 24 24",width:"14",height:"14",fill:"none",stroke:"currentColor","stroke-width":"3","stroke-linecap":"round","stroke-linejoin":"round"},[e.createElementVNode("polyline",{points:"20 6 9 17 4 12"})],-1)),e.createElementVNode("span",null,e.toDisplayString(e.unref(l)("cropApply")),1)],32)])],8,nn)):e.createCommentVNode("",!0)],42,Ot))}}),sn=`<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
3
|
+
<path d="M6 2v4" />
|
|
4
|
+
<path d="M6 6h12a2 2 0 0 1 2 2v8" />
|
|
5
|
+
<path d="M18 22v-4" />
|
|
6
|
+
<path d="M18 18H6a2 2 0 0 1-2-2V8" />
|
|
7
|
+
</svg>`;function Ie(){return{id:"crop",icon:sn,labelKey:"crop",controls:jt,overlay:rn}}const Pe=[{key:"brightness",labelKey:"brightness",min:-.25,max:.25,base:0,step:.01},{key:"contrast",labelKey:"contrast",min:-.25,max:.25,base:0,step:.01},{key:"saturation",labelKey:"saturation",min:-.25,max:.25,base:0,step:.01},{key:"exposure",labelKey:"exposure",min:-.25,max:.25,base:0,step:.01},{key:"temperature",labelKey:"temperature",min:-.25,max:.25,base:0,step:.01},{key:"gamma",labelKey:"gamma",min:.2,max:5,base:1,step:.05},{key:"clarity",labelKey:"clarity",min:-.25,max:.25,base:0,step:.01},{key:"vignette",labelKey:"vignette",min:-1,max:1,base:0,step:.05}],cn={class:"vie-finetune-controls"},dn=e.defineComponent({__name:"FinetuneControls",setup(a){const t=H(),o=e.inject(j,l=>l);function n(l,f){t.updateState(c=>{c.finetune[l]=f})}return(l,f)=>(e.openBlock(),e.createElementBlock("div",cn,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(Pe),c=>(e.openBlock(),e.createBlock(J,{key:c.key,modelValue:e.unref(t).state.finetune[c.key],min:c.min,max:c.max,step:c.step,base:c.base,label:e.unref(o)(c.labelKey),format:c.key==="gamma"?"number":"percent","onUpdate:modelValue":r=>n(c.key,r)},null,8,["modelValue","min","max","step","base","label","format","onUpdate:modelValue"]))),128))]))}}),hn=`<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
8
|
+
<line x1="4" y1="21" x2="4" y2="14" />
|
|
9
|
+
<line x1="4" y1="10" x2="4" y2="3" />
|
|
10
|
+
<line x1="12" y1="21" x2="12" y2="12" />
|
|
11
|
+
<line x1="12" y1="8" x2="12" y2="3" />
|
|
12
|
+
<line x1="20" y1="21" x2="20" y2="16" />
|
|
13
|
+
<line x1="20" y1="12" x2="20" y2="3" />
|
|
14
|
+
<line x1="1" y1="14" x2="7" y2="14" />
|
|
15
|
+
<line x1="9" y1="8" x2="15" y2="8" />
|
|
16
|
+
<line x1="17" y1="16" x2="23" y2="16" />
|
|
17
|
+
</svg>`;function Te(){return{id:"finetune",icon:hn,labelKey:"finetune",controls:dn}}const re=[{id:"chrome",labelKey:"chrome",matrix:[1.2,.1,.1,0,-.05,.05,1.1,.05,0,-.02,.05,.1,1.2,0,-.05,0,0,0,1,0]},{id:"fade",labelKey:"fade",matrix:[1,.02,.04,0,.06,.02,.96,.04,0,.06,.04,.04,.92,0,.08,0,0,0,1,0]},{id:"pastel",labelKey:"pastel",matrix:[.9,.1,.05,0,.08,.05,.9,.1,0,.08,.1,.05,.85,0,.1,0,0,0,1,0]},{id:"cold",labelKey:"cold",matrix:[.9,0,.1,0,-.02,0,.95,.1,0,0,0,.1,1.1,0,.03,0,0,0,1,0]},{id:"warm",labelKey:"warm",matrix:[1.1,.1,0,0,.03,0,1,.05,0,.01,0,0,.9,0,-.02,0,0,0,1,0]},{id:"monoDefault",labelKey:"mono",matrix:[.2126,.7152,.0722,0,0,.2126,.7152,.0722,0,0,.2126,.7152,.0722,0,0,0,0,0,1,0]},{id:"monoNoir",labelKey:"noir",matrix:[.3,.8,.1,0,-.08,.3,.8,.1,0,-.08,.3,.8,.1,0,-.08,0,0,0,1,0]},{id:"monoWash",labelKey:"wash",matrix:[.2126,.7152,.0722,0,.06,.2126,.7152,.0722,0,.06,.2126,.7152,.0722,0,.06,0,0,0,1,0]},{id:"monoStark",labelKey:"stark",matrix:[.35,1,.15,0,-.15,.35,1,.15,0,-.15,.35,1,.15,0,-.15,0,0,0,1,0]},{id:"sepiaDefault",labelKey:"sepia",matrix:[.393,.769,.189,0,0,.349,.686,.168,0,0,.272,.534,.131,0,0,0,0,0,1,0]},{id:"sepiaRust",labelKey:"rust",matrix:[.45,.75,.15,0,.04,.3,.6,.15,0,-.01,.2,.4,.15,0,-.04,0,0,0,1,0]},{id:"sepiaBlues",labelKey:"blues",matrix:[.2126,.7152,.0722,0,-.04,.2126,.7152,.0722,0,0,.2126,.7152,.0722,0,.08,0,0,0,1,0]},{id:"sepiaColor",labelKey:"color",matrix:[.4,.6,.1,0,.02,.25,.7,.15,0,.01,.2,.5,.4,0,.01,0,0,0,1,0]}],un={class:"vie-filter-controls"},fn={class:"vie-filter-strip"},mn={class:"vie-filter-thumb__label"},pn=["onClick"],gn={class:"vie-filter-thumb__label"},yn=e.defineComponent({__name:"FilterControls",setup(a){const t=H(),o=e.inject(j,x=>x),n=e.ref(null),l=new Map,f=new Set;let c=null;function r(x,_){_&&(l.set(x,_),c==null||c.observe(_))}function i(x){t.updateState(_=>{x?(_.filter.id=x.id,_.filter.matrix=[...x.matrix]):(_.filter.id=null,_.filter.matrix=void 0)})}function m(x){t.updateState(_=>{_.filter.intensity=x})}function s(x,_){const S=t.sourceImage.value;if(!S)return;const k=96,h=x.getContext("2d");h.drawImage(S,0,0,k,k);const w=h.getImageData(0,0,k,k);oe(w,_.matrix),h.putImageData(w,0,0),f.add(_.id)}function d(){const x=t.sourceImage.value;if(!x||!n.value)return;n.value.getContext("2d").drawImage(x,0,0,96,96)}function y(){c=new IntersectionObserver(x=>{for(const _ of x){if(!_.isIntersecting)continue;const S=_.target,k=re.find(h=>l.get(h.id)===S);k&&!f.has(k.id)&&s(S,k)}},{threshold:.1});for(const x of l.values())c.observe(x)}function u(){f.clear(),d();for(const x of re){const _=l.get(x.id);_&&(c==null||c.unobserve(_))}for(const x of l.values())c==null||c.observe(x)}return e.watch(()=>t.sourceImage.value,()=>{setTimeout(u,50)}),e.onMounted(()=>{y(),setTimeout(()=>{d()},50)}),e.onUnmounted(()=>{c==null||c.disconnect(),c=null}),(x,_)=>(e.openBlock(),e.createElementBlock("div",un,[e.createElementVNode("div",fn,[e.createElementVNode("button",{class:e.normalizeClass(["vie-filter-thumb",{"vie-filter-thumb--active":!e.unref(t).state.filter.id}]),onClick:_[0]||(_[0]=S=>i(null))},[e.createElementVNode("canvas",{ref_key:"originalThumbRef",ref:n,width:"96",height:"96",class:"vie-filter-thumb__canvas"},null,512),e.createElementVNode("span",mn,e.toDisplayString(e.unref(o)("original")),1)],2),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(re),S=>(e.openBlock(),e.createElementBlock("button",{key:S.id,class:e.normalizeClass(["vie-filter-thumb",{"vie-filter-thumb--active":e.unref(t).state.filter.id===S.id}]),onClick:k=>i(S)},[e.createElementVNode("canvas",{ref_for:!0,ref:k=>r(S.id,k),width:"96",height:"96",class:"vie-filter-thumb__canvas"},null,512),e.createElementVNode("span",gn,e.toDisplayString(e.unref(o)(S.labelKey)||S.labelKey),1)],10,pn))),128))]),e.unref(t).state.filter.id?(e.openBlock(),e.createBlock(J,{key:0,modelValue:e.unref(t).state.filter.intensity,min:0,max:1,step:.01,base:1,label:e.unref(o)("intensity"),format:"percent","onUpdate:modelValue":m},null,8,["modelValue","label"])):e.createCommentVNode("",!0)]))}}),wn=`<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
18
|
+
<path d="M12 20a8 8 0 1 0 0-16 8 8 0 0 0 0 16Z" />
|
|
19
|
+
<path d="M12 20a8 8 0 1 0 0-16" fill="currentColor" opacity="0.3" />
|
|
20
|
+
<path d="M12 4v16" />
|
|
21
|
+
</svg>`;function Fe(){return{id:"filter",icon:wn,labelKey:"filter",controls:yn}}const se=[{id:"emoji",labelKey:"emoji",stickers:["😀","😂","❤️","🎉","👍","⭐","🔥","💯","🎨","📸","🎵","🌟","✅","❌","⚡","🎯","💡","🏆","🎲","🎪","🌈","🦋","🍀","💎"]},{id:"shapes",labelKey:"shapes",stickers:["⬛","⬜","🔴","🔵","🟢","🟡","🟠","🟣","▶️","◀️","🔺","🔻","💠","🔶","🔷","♦️"]}],De=new WeakMap;function Le(a){let t=De.get(a);return t||(t=e.ref(null),De.set(a,t)),t}const kn={class:"vie-sticker-controls"},vn={class:"vie-sticker-tabs"},bn=["onClick"],xn={class:"vie-sticker-grid"},_n=["onClick"],Cn=e.defineComponent({__name:"StickerControls",setup(a){var i;const t=H(),o=e.inject(j,m=>m),n=Le(t.state),l=e.ref(((i=se[0])==null?void 0:i.id)||"emoji"),f=e.computed(()=>{const m=se.find(s=>s.id===l.value);return(m==null?void 0:m.stickers)||[]});function c(m){const s=`sticker-${Date.now()}-${Math.random().toString(36).slice(2,6)}`,d=t.state.stickers.length%5*.03;t.updateState(y=>{y.stickers.push({id:s,src:m,x:.35+d,y:.35+d,width:.15,height:.15,rotation:0,flipX:!1,flipY:!1,opacity:1})}),n.value=s}function r(){if(!n.value)return;const m=n.value;t.updateState(s=>{const d=s.stickers.findIndex(y=>y.id===m);d>=0&&s.stickers.splice(d,1)}),n.value=null}return(m,s)=>(e.openBlock(),e.createElementBlock("div",kn,[e.createElementVNode("div",vn,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(se),d=>(e.openBlock(),e.createElementBlock("button",{key:d.id,class:e.normalizeClass(["vie-sticker-tab",{"vie-sticker-tab--active":l.value===d.id}]),onClick:y=>l.value=d.id},e.toDisplayString(e.unref(o)(d.labelKey)||d.labelKey),11,bn))),128)),e.unref(n)?(e.openBlock(),e.createElementBlock("button",{key:0,class:"vie-sticker-tab vie-sticker-tab--delete",onClick:r},e.toDisplayString(e.unref(o)("delete")||"Delete"),1)):e.createCommentVNode("",!0)]),e.createElementVNode("div",xn,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(f.value,d=>(e.openBlock(),e.createElementBlock("button",{key:d,class:"vie-sticker-item",onClick:y=>c(d)},e.toDisplayString(d),9,_n))),128))])]))}}),En=["viewBox","width","height"],Sn=["x","y","width","height","data-sticker-id"],Mn=["x","y","width","height"],Vn=["x","y","data-handle"],$n=["x1","y1","x2","y2"],Bn=["cx","cy"],ge=10,We=20,Ae=6,zn=e.defineComponent({__name:"StickerOverlay",props:{canvasRect:{},wrapperSize:{}},setup(a){const t=a,o=H(),n=e.ref(null),l=Le(o.state);e.onBeforeUnmount(()=>{i.value&&(o.updateState(()=>{}),i.value=null,m.value=null),window.removeEventListener("pointermove",x),window.removeEventListener("pointerup",_)});const f=e.computed(()=>{const h=t.canvasRect;return o.state.stickers.map(w=>({id:w.id,x:h.x+w.x*h.width,y:h.y+w.y*h.height,w:w.width*h.width,h:w.height*h.height}))}),c=e.computed(()=>l.value&&f.value.find(h=>h.id===l.value)||null),r=e.computed(()=>{if(!c.value)return[];const h=c.value,v=ge/2;return[{id:"nw",x:h.x-v,y:h.y-v},{id:"ne",x:h.x+h.w-v,y:h.y-v},{id:"sw",x:h.x-v,y:h.y+h.h-v},{id:"se",x:h.x+h.w-v,y:h.y+h.h-v}]}),i=e.ref(null),m=e.ref(null),s=e.ref({x:0,y:0}),d=e.ref({x:0,y:0,width:0,height:0,rotation:0});function y(h){var V;const w=h.target,v=w.getAttribute("data-handle");if(v==="rotate"&&l.value){h.preventDefault(),u(h,"rotate",v);return}if(v&&["nw","ne","sw","se"].includes(v)&&l.value){h.preventDefault(),u(h,"resize",v);return}const C=w.getAttribute("data-sticker-id");if(C){h.preventDefault(),l.value=C,u(h,"move",null),(V=n.value)==null||V.focus();return}l.value=null}function u(h,w,v){i.value=w,m.value=v,s.value={x:h.clientX,y:h.clientY};const C=o.state.stickers.find(V=>V.id===l.value);C&&(d.value={x:C.x,y:C.y,width:C.width,height:C.height,rotation:C.rotation}),window.addEventListener("pointermove",x),window.addEventListener("pointerup",_)}function x(h){if(!i.value||!l.value)return;const w=t.canvasRect;if(w.width===0||w.height===0)return;const v=(h.clientX-s.value.x)/w.width,C=(h.clientY-s.value.y)/w.height,V=d.value,D=o.state.stickers.find(N=>N.id===l.value);if(D){switch(i.value){case"move":{D.x=k(V.x+v,0,1-D.width),D.y=k(V.y+C,0,1-D.height);break}case"resize":{switch(m.value){case"se":{D.width=k(V.width+v,.03,1-V.x),D.height=k(V.height+C,.03,1-V.y);break}case"ne":{const I=k(V.width+v,.03,1-V.x),F=k(V.height-C,.03,V.y+V.height),P=V.y+V.height-F;D.width=I,D.height=F,D.y=P;break}case"sw":{const I=k(V.width-v,.03,V.x+V.width),F=k(V.height+C,.03,1-V.y),P=V.x+V.width-I;D.width=I,D.height=F,D.x=P;break}case"nw":{const I=k(V.width-v,.03,V.x+V.width),F=k(V.height-C,.03,V.y+V.height),P=V.x+V.width-I,B=V.y+V.height-F;D.width=I,D.height=F,D.x=P,D.y=B;break}}break}case"rotate":{const N=w.x+D.x*w.width+D.width*w.width/2,I=w.y+D.y*w.height+D.height*w.height/2,F=Math.atan2(h.clientX-N,-(h.clientY-I));D.rotation=F;break}}o.requestRender()}}function _(){i.value&&o.updateState(()=>{}),i.value=null,m.value=null,window.removeEventListener("pointermove",x),window.removeEventListener("pointerup",_)}function S(h){if((h.key==="Delete"||h.key==="Backspace")&&l.value){h.preventDefault();const w=l.value;o.updateState(v=>{const C=v.stickers.findIndex(V=>V.id===w);C>=0&&v.stickers.splice(C,1)}),l.value=null}}function k(h,w,v){return Math.max(w,Math.min(v,h))}return(h,w)=>(e.openBlock(),e.createElementBlock("svg",{ref_key:"svgRef",ref:n,class:"vie-sticker-overlay",viewBox:`0 0 ${a.wrapperSize.width} ${a.wrapperSize.height}`,width:a.wrapperSize.width,height:a.wrapperSize.height,onPointerdown:y,onKeydown:S,tabindex:"0"},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(f.value,v=>(e.openBlock(),e.createElementBlock("rect",{key:v.id,x:v.x,y:v.y,width:v.w,height:v.h,fill:"transparent",class:"vie-sticker-hitarea","data-sticker-id":v.id},null,8,Sn))),128)),c.value?(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[e.createElementVNode("rect",{x:c.value.x,y:c.value.y,width:c.value.w,height:c.value.h,class:"vie-sticker-selection"},null,8,Mn),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(r.value,v=>(e.openBlock(),e.createElementBlock("rect",{key:v.id,x:v.x,y:v.y,width:ge,height:ge,class:"vie-sticker-handle","data-handle":v.id},null,8,Vn))),128)),e.createElementVNode("line",{x1:c.value.x+c.value.w/2,y1:c.value.y-We,x2:c.value.x+c.value.w/2,y2:c.value.y,class:"vie-sticker-rotate-line"},null,8,$n),e.createElementVNode("circle",{cx:c.value.x+c.value.w/2,cy:c.value.y-We-Ae,r:Ae,class:"vie-sticker-rotate-handle","data-handle":"rotate"},null,8,Bn)],64)):e.createCommentVNode("",!0)],40,En))}}),Nn=`<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
22
|
+
<circle cx="12" cy="12" r="10" />
|
|
23
|
+
<path d="M8 14s1.5 2 4 2 4-2 4-2" />
|
|
24
|
+
<line x1="9" y1="9" x2="9.01" y2="9" />
|
|
25
|
+
<line x1="15" y1="9" x2="15.01" y2="9" />
|
|
26
|
+
</svg>`;function Ke(){return{id:"sticker",icon:Nn,labelKey:"sticker",controls:Cn,overlay:zn}}const He=[{id:"solidSharp",labelKey:"solidSharp"},{id:"solidRound",labelKey:"solidRound"},{id:"lineSingle",labelKey:"lineSingle"},{id:"lineMultiple",labelKey:"lineMultiple"},{id:"hook",labelKey:"hook"},{id:"polaroid",labelKey:"polaroid"},{id:"edgeSeparate",labelKey:"edgeSeparate"},{id:"edgeCross",labelKey:"edgeCross"},{id:"edgeOverlap",labelKey:"edgeOverlap"}],Rn=[[1,1,1,1],[0,0,0,1],[.85,.75,.6,1],[.6,.4,.2,1],[.2,.4,.6,1],[.8,.2,.2,1]],In={class:"vie-frame-controls"},Pn={class:"vie-frame-strip"},Tn={class:"vie-frame-style__label"},Fn=["onClick"],Dn={class:"vie-frame-style__label"},Ln={class:"vie-frame-colors"},Wn={class:"vie-frame-colors__label"},An={class:"vie-frame-colors__swatches"},Kn=["onClick"],Hn=e.defineComponent({__name:"FrameControls",setup(a){const t=H(),o=e.inject(j,i=>i);function n(i){t.updateState(m=>{m.frame.style=i})}function l(i){t.updateState(m=>{m.frame.size=i})}function f(i){t.updateState(m=>{m.frame.color=[...i]})}function c(i){const m=t.state.frame.color;return m[0]===i[0]&&m[1]===i[1]&&m[2]===i[2]&&m[3]===i[3]}function r(i){return`rgba(${Math.round(i[0]*255)}, ${Math.round(i[1]*255)}, ${Math.round(i[2]*255)}, ${i[3]})`}return(i,m)=>(e.openBlock(),e.createElementBlock("div",In,[e.createElementVNode("div",Pn,[e.createElementVNode("button",{class:e.normalizeClass(["vie-frame-style",{"vie-frame-style--active":!e.unref(t).state.frame.style}]),onClick:m[0]||(m[0]=s=>n(null))},[e.createElementVNode("span",Tn,e.toDisplayString(e.unref(o)("none")),1)],2),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(He),s=>(e.openBlock(),e.createElementBlock("button",{key:s.id,class:e.normalizeClass(["vie-frame-style",{"vie-frame-style--active":e.unref(t).state.frame.style===s.id}]),onClick:d=>n(s.id)},[e.createElementVNode("span",Dn,e.toDisplayString(e.unref(o)(s.labelKey)),1)],10,Fn))),128))]),e.unref(t).state.frame.style?(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[e.createVNode(J,{modelValue:e.unref(t).state.frame.size,min:.005,max:.15,step:.005,base:.025,label:e.unref(o)("frameSize"),format:"percent","onUpdate:modelValue":l},null,8,["modelValue","label"]),e.createElementVNode("div",Ln,[e.createElementVNode("span",Wn,e.toDisplayString(e.unref(o)("frameColor")),1),e.createElementVNode("div",An,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(Rn),(s,d)=>(e.openBlock(),e.createElementBlock("button",{key:d,class:e.normalizeClass(["vie-frame-color-swatch",{"vie-frame-color-swatch--active":c(s)}]),style:e.normalizeStyle({backgroundColor:r(s)}),onClick:y=>f(s)},null,14,Kn))),128))])])],64)):e.createCommentVNode("",!0)]))}}),jn=`<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
27
|
+
<rect x="3" y="3" width="18" height="18" rx="2" ry="2" />
|
|
28
|
+
<rect x="7" y="7" width="10" height="10" />
|
|
29
|
+
</svg>`;function je(){return{id:"frame",icon:jn,labelKey:"frame",controls:Hn}}const On={class:"vie-fill-controls"},Xn={class:"vie-fill-strip"},qn=["title","onClick"],Un=e.defineComponent({__name:"FillControls",setup(a){const t=H(),o=e.inject(j,r=>r),n=[[0,0,0,0],[1,1,1,1],[.8,.8,.8,1],[.2,.2,.2,1],[0,0,0,1],[.1,.14,.49,1],[.13,.59,.95,1],[0,.74,.83,1],[0,.59,.53,1],[.3,.69,.31,1],[.55,.76,.29,1],[1,.92,.23,1],[1,.6,0,1],[1,.34,.13,1],[.96,.26,.21,1],[.91,.12,.39,1],[.61,.15,.69,1]];function l(r){t.updateState(i=>{i.backgroundColor=[...r]})}function f(r){const i=t.state.backgroundColor;return i[0]===r[0]&&i[1]===r[1]&&i[2]===r[2]&&i[3]===r[3]}function c(r){return`rgba(${Math.round(r[0]*255)}, ${Math.round(r[1]*255)}, ${Math.round(r[2]*255)}, ${r[3]})`}return(r,i)=>(e.openBlock(),e.createElementBlock("div",On,[e.createElementVNode("div",Xn,[(e.openBlock(),e.createElementBlock(e.Fragment,null,e.renderList(n,(m,s)=>e.createElementVNode("button",{key:s,class:e.normalizeClass(["vie-fill-swatch",{"vie-fill-swatch--active":f(m),"vie-fill-swatch--transparent":m[3]===0}]),style:e.normalizeStyle(m[3]>0?{backgroundColor:c(m)}:void 0),title:s===0?e.unref(o)("transparent"):void 0,onClick:d=>l(m)},null,14,qn)),64))])]))}}),Yn=`<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
30
|
+
<path d="M12 2.69l5.66 5.66a8 8 0 1 1-11.31 0z" />
|
|
31
|
+
</svg>`;function Oe(){return{id:"fill",icon:Yn,labelKey:"fill",controls:Un}}const Zn={class:"vie-resize-controls"},Jn={class:"vie-resize-title"},Gn={class:"vie-resize-dimensions"},Qn={class:"vie-resize-input"},eo={class:"vie-resize-input__label"},to={class:"vie-resize-input__field-wrapper"},no=["value"],oo=["title"],io={viewBox:"0 0 24 24",width:"16",height:"16",fill:"none",stroke:"currentColor","stroke-width":"2"},ao={key:0,d:"M7 11V7a5 5 0 0 1 10 0v4"},lo={key:1,d:"M7 11V7a5 5 0 0 1 9.9-1"},ro={class:"vie-resize-input"},so={class:"vie-resize-input__label"},co={class:"vie-resize-input__field-wrapper"},ho=["value"],uo={class:"vie-resize-hint"},fo=e.defineComponent({__name:"ResizeControls",setup(a){const t=H(),o=e.inject(j,m=>m),n=e.ref(!0),l=e.computed(()=>{const m=t.sourceImage.value;if(!m)return 1;const s=t.state.crop;return m.naturalWidth*s.width/(m.naturalHeight*s.height)}),f=e.computed(()=>{if(t.state.resize.width)return t.state.resize.width;const m=t.sourceImage.value;return m?Math.round(m.naturalWidth*t.state.crop.width):0}),c=e.computed(()=>{if(t.state.resize.height)return t.state.resize.height;const m=t.sourceImage.value;return m?Math.round(m.naturalHeight*t.state.crop.height):0});function r(m){const s=parseInt(m,10);!s||s<1||t.updateState(d=>{d.resize.width=s,n.value&&(d.resize.height=Math.round(s/l.value))})}function i(m){const s=parseInt(m,10);!s||s<1||t.updateState(d=>{d.resize.height=s,n.value&&(d.resize.width=Math.round(s*l.value))})}return(m,s)=>(e.openBlock(),e.createElementBlock("div",Zn,[e.createElementVNode("p",Jn,e.toDisplayString(e.unref(o)("imageOutputSize")),1),e.createElementVNode("div",Gn,[e.createElementVNode("div",Qn,[e.createElementVNode("label",eo,e.toDisplayString(e.unref(o)("width")),1),e.createElementVNode("div",to,[e.createElementVNode("input",{type:"number",class:"vie-resize-input__field",value:f.value,min:"1",onInput:s[0]||(s[0]=d=>r(d.target.value))},null,40,no),s[3]||(s[3]=e.createElementVNode("span",{class:"vie-resize-input__unit"},"px",-1))])]),e.createElementVNode("button",{class:e.normalizeClass(["vie-resize-lock",{"vie-resize-lock--active":n.value}]),onClick:s[1]||(s[1]=d=>n.value=!n.value),title:e.unref(o)("lockAspectRatio")},[(e.openBlock(),e.createElementBlock("svg",io,[s[4]||(s[4]=e.createElementVNode("rect",{x:"3",y:"11",width:"18",height:"11",rx:"2",ry:"2"},null,-1)),n.value?(e.openBlock(),e.createElementBlock("path",ao)):(e.openBlock(),e.createElementBlock("path",lo))]))],10,oo),e.createElementVNode("div",ro,[e.createElementVNode("label",so,e.toDisplayString(e.unref(o)("height")),1),e.createElementVNode("div",co,[e.createElementVNode("input",{type:"number",class:"vie-resize-input__field",value:c.value,min:"1",onInput:s[2]||(s[2]=d=>i(d.target.value))},null,40,ho),s[5]||(s[5]=e.createElementVNode("span",{class:"vie-resize-input__unit"},"px",-1))])])]),e.createElementVNode("p",uo,e.toDisplayString(e.unref(o)("resizeHint")),1)]))}}),mo=`<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
32
|
+
<polyline points="15 3 21 3 21 9" />
|
|
33
|
+
<polyline points="9 21 3 21 3 15" />
|
|
34
|
+
<line x1="21" y1="3" x2="14" y2="10" />
|
|
35
|
+
<line x1="3" y1="21" x2="10" y2="14" />
|
|
36
|
+
</svg>`;function Xe(){return{id:"resize",icon:mo,labelKey:"resize",controls:fo}}const qe=new WeakMap;function Ue(a){let t=qe.get(a);return t||(t=e.ref(null),qe.set(a,t)),t}const po={class:"vie-annotate-controls"},go={key:0,class:"vie-annotate-toolbar"},yo=["title"],wo={key:1,class:"vie-annotate-props"},ko={class:"vie-annotate-prop-row"},vo={class:"vie-annotate-prop-label"},bo={class:"vie-annotate-color-picker"},xo=["title","onClick"],_o={class:"vie-annotate-prop-row"},Co={class:"vie-annotate-prop-label"},Eo={class:"vie-annotate-font-buttons"},So=["onClick"],Mo={class:"vie-annotate-prop-row"},Vo=e.defineComponent({__name:"AnnotateControls",setup(a){const t=H(),o=e.inject(j,d=>d),n=Ue(t.state),l=e.computed(()=>n.value&&t.state.annotations.find(d=>d.id===n.value)||null),f=[{label:"Black",value:[0,0,0,1]},{label:"White",value:[1,1,1,1]},{label:"Red",value:[.9,.15,.15,1]},{label:"Orange",value:[.95,.55,.1,1]},{label:"Yellow",value:[.95,.85,.1,1]},{label:"Green",value:[.2,.75,.3,1]},{label:"Blue",value:[.2,.45,.85,1]},{label:"Purple",value:[.55,.25,.8,1]},{label:"Accent",value:[.106,.286,.396,1]}],c=[{label:"Sans",value:"sans-serif"},{label:"Serif",value:"serif"},{label:"Mono",value:"monospace"}];function r(d){return`rgba(${Math.round(d[0]*255)}, ${Math.round(d[1]*255)}, ${Math.round(d[2]*255)}, ${d[3]})`}function i(d,y){return Math.abs(d[0]-y[0])<.01&&Math.abs(d[1]-y[1])<.01&&Math.abs(d[2]-y[2])<.01&&Math.abs(d[3]-y[3])<.01}function m(d,y){if(!n.value)return;const u=n.value;t.updateState(x=>{const _=x.annotations.find(S=>S.id===u);_&&(_[d]=y)})}function s(){if(!n.value)return;const d=n.value;t.updateState(y=>{const u=y.annotations.findIndex(x=>x.id===d);u>=0&&y.annotations.splice(u,1)}),n.value=null}return(d,y)=>(e.openBlock(),e.createElementBlock("div",po,[e.unref(n)?(e.openBlock(),e.createElementBlock("div",go,[e.createElementVNode("button",{class:"vie-annotate-tool vie-annotate-tool--delete",title:e.unref(o)("delete"),onClick:s},[...y[4]||(y[4]=[e.createElementVNode("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"},[e.createElementVNode("polyline",{points:"3 6 5 6 21 6"}),e.createElementVNode("path",{d:"M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"})],-1)])],8,yo)])):e.createCommentVNode("",!0),l.value?(e.openBlock(),e.createElementBlock("div",wo,[e.createElementVNode("div",ko,[e.createElementVNode("span",vo,e.toDisplayString(e.unref(o)("fillColor")),1),e.createElementVNode("div",bo,[(e.openBlock(),e.createElementBlock(e.Fragment,null,e.renderList(f,u=>e.createElementVNode("button",{key:"text-"+u.label,class:e.normalizeClass(["vie-annotate-color-swatch",{"vie-annotate-color-swatch--active":i(l.value.fillColor,u.value)}]),style:e.normalizeStyle({backgroundColor:r(u.value)}),title:u.label,onClick:x=>m("fillColor",[...u.value])},null,14,xo)),64))])]),e.createVNode(J,{label:e.unref(o)("fontSize"),modelValue:l.value.fontSize*1e3,min:15,max:120,step:1,base:40,format:"number","onUpdate:modelValue":y[0]||(y[0]=u=>m("fontSize",u/1e3))},null,8,["label","modelValue"]),e.createElementVNode("div",_o,[e.createElementVNode("span",Co,e.toDisplayString(e.unref(o)("fontFamily")),1),e.createElementVNode("div",Eo,[(e.openBlock(),e.createElementBlock(e.Fragment,null,e.renderList(c,u=>e.createElementVNode("button",{key:u.value,class:e.normalizeClass(["vie-annotate-font-btn",{"vie-annotate-font-btn--active":l.value.fontFamily===u.value}]),style:e.normalizeStyle({fontFamily:u.value}),onClick:x=>m("fontFamily",u.value)},e.toDisplayString(u.label),15,So)),64))])]),e.createElementVNode("div",Mo,[e.createElementVNode("button",{class:e.normalizeClass(["vie-annotate-toggle",{"vie-annotate-toggle--active":l.value.fontWeight==="bold"}]),onClick:y[1]||(y[1]=u=>m("fontWeight",l.value.fontWeight==="bold"?"normal":"bold"))},[...y[5]||(y[5]=[e.createElementVNode("strong",null,"B",-1)])],2),e.createElementVNode("button",{class:e.normalizeClass(["vie-annotate-toggle",{"vie-annotate-toggle--active":l.value.fontStyle==="italic"}]),onClick:y[2]||(y[2]=u=>m("fontStyle",l.value.fontStyle==="italic"?"normal":"italic"))},[...y[6]||(y[6]=[e.createElementVNode("em",null,"I",-1)])],2)]),e.createVNode(J,{label:e.unref(o)("opacity"),modelValue:l.value.opacity,min:.1,max:1,step:.05,base:1,format:"percent","onUpdate:modelValue":y[3]||(y[3]=u=>m("opacity",u))},null,8,["label","modelValue"])])):e.createCommentVNode("",!0)]))}});let $o=0;function Bo(){return`ann-${Date.now()}-${++$o}-${Math.random().toString(36).slice(2,6)}`}const zo=[1,1,1,1];function No(a,t,o,n){return{id:Bo(),x:a,y:t,width:o,height:n,rotation:0,strokeColor:[0,0,0,0],strokeWidth:0,opacity:1,type:"text",text:"",fontSize:.04,fontFamily:"sans-serif",fontWeight:"normal",fontStyle:"normal",fillColor:[...zo],textAlign:"left"}}const Ro=["viewBox","width","height"],Io=["x","y","width","height","data-annotation-id"],Po=["transform"],To=["x","y","width","height"],Fo=["x","y","data-handle"],Do=["x1","y1","x2","y2"],Lo=["cx","cy"],Wo=["x","y","width","height"],Ao=["value","onKeydown"],ye=10,Ye=20,Ze=6,Je=6,Ge=4,Ko=e.defineComponent({__name:"AnnotateOverlay",props:{canvasRect:{},wrapperSize:{}},setup(a){function t(p,g,b,M,$,z){const A=document.createElement("canvas").getContext("2d");A.font=`${$} ${M} ${g}px ${b}`;const K=g*1.2,O=p.split(`
|
|
37
|
+
`);let X=0,G=0;for(const Jo of O){const Go=Jo.split(" ");let Z="";for(const ke of Go){const nt=Z?`${Z} ${ke}`:ke;A.measureText(nt).width>z&&Z?(X=Math.max(X,A.measureText(Z).width),G++,Z=ke):Z=nt}X=Math.max(X,A.measureText(Z).width),G++}return{width:X,height:G*K}}const o=a,n=H(),l=e.ref(null),f=e.ref(null),c=Ue(n.state),r=e.ref(!1),i=e.ref(""),m=e.ref(null),s=e.ref({size:14,family:"sans-serif",weight:"normal",style:"normal",color:"#ffffff"}),d=e.computed(()=>({fontSize:s.value.size+"px",fontFamily:s.value.family,fontWeight:s.value.weight,fontStyle:s.value.style,color:s.value.color}));e.onBeforeUnmount(()=>{S.value&&(n.updateState(()=>{}),S.value=null,k.value=null),window.removeEventListener("pointermove",B),window.removeEventListener("pointerup",W)});const y=e.computed(()=>{const p=o.canvasRect;return n.state.annotations.map(g=>({id:g.id,dx:p.x+g.x*p.width,dy:p.y+g.y*p.height,dw:g.width*p.width,dh:g.height*p.height}))}),u=e.computed(()=>c.value&&y.value.find(p=>p.id===c.value)||null),x=e.computed(()=>{if(!c.value||!u.value)return"";const p=n.state.annotations.find($=>$.id===c.value);if(!p||p.rotation===0)return"";const g=u.value.dx+u.value.dw/2,b=u.value.dy+u.value.dh/2;return`rotate(${p.rotation*180/Math.PI} ${g} ${b})`}),_=e.computed(()=>{if(!u.value)return[];const p=u.value,g=ye/2;return[{id:"nw",x:p.dx-g,y:p.dy-g},{id:"ne",x:p.dx+p.dw-g,y:p.dy-g},{id:"sw",x:p.dx-g,y:p.dy+p.dh-g},{id:"se",x:p.dx+p.dw-g,y:p.dy+p.dh-g}]}),S=e.ref(null),k=e.ref(null),h=e.ref({x:0,y:0}),w=e.ref({x:0,y:0,width:0,height:0,rotation:0});function v(p){var b;const g=(b=l.value)==null?void 0:b.getBoundingClientRect();return g?{x:p.clientX-g.left,y:p.clientY-g.top}:{x:p.clientX,y:p.clientY}}function C(p){var O;const g=p.target,b=g.getAttribute("data-handle");if(b==="rotate"&&c.value){p.preventDefault(),P(p,"rotate",b);return}if(b&&["nw","ne","sw","se"].includes(b)&&c.value){p.preventDefault(),P(p,"resize",b);return}const M=g.getAttribute("data-annotation-id");if(M){p.preventDefault(),c.value=M,r.value=!1;const X=n.state.annotations.find(G=>G.id===M);if(X&&p.detail>=2){D(X);return}P(p,"move",null),(O=l.value)==null||O.focus();return}if(p.preventDefault(),r.value){F(),c.value=null;return}c.value=null;const $=o.canvasRect,z=v(p),L=(z.x-$.x)/$.width,A=(z.y-$.y)/$.height,K=No(R(L,0,.9),R(A,0,.9),.25,.06);n.updateState(X=>X.annotations.push(K)),c.value=K.id,e.nextTick(()=>D(K))}function V(p){return`rgba(${Math.round(p[0]*255)}, ${Math.round(p[1]*255)}, ${Math.round(p[2]*255)}, ${p[3]})`}function D(p){r.value=!0,i.value=p.text;const g=o.canvasRect,b=p.fontSize*g.height;m.value={x:g.x+p.x*g.width-Je,y:g.y+p.y*g.height-Ge,w:Math.max(120,p.width*g.width+Je*2),h:Math.max(b*1.6,p.height*g.height+Ge*2)},s.value={size:b,family:p.fontFamily,weight:p.fontWeight,style:p.fontStyle,color:V(p.fillColor)},e.nextTick(()=>{f.value&&(f.value.focus(),I())})}function N(p){i.value=p.target.value,I()}function I(){const p=f.value;if(!p||!m.value)return;p.style.height="0";const g=p.scrollHeight+4;p.style.height="100%",g>m.value.h&&(m.value.h=g)}function F(){if(c.value){const p=n.state.annotations.find(g=>g.id===c.value);p&&(p.text=i.value)}if(c.value){const p=o.canvasRect,g=n.state.annotations.find(b=>b.id===c.value);if(g&&g.text.trim()&&p.width>0&&p.height>0){const b=g.fontSize*p.height,M=g.width*p.width,$=t(g.text,b,g.fontFamily,g.fontWeight,g.fontStyle,M);g.width=$.width/p.width,g.height=$.height/p.height}}if(r.value=!1,m.value=null,c.value){const p=n.state.annotations.find(g=>g.id===c.value);if(p&&!p.text.trim()){const g=c.value;n.updateState(b=>{const M=b.annotations.findIndex($=>$.id===g);M>=0&&b.annotations.splice(M,1)}),c.value=null}else p&&n.updateState(()=>{})}}function P(p,g,b){S.value=g,k.value=b;const M=v(p);h.value={x:M.x,y:M.y};const $=n.state.annotations.find(z=>z.id===c.value);$&&(w.value={x:$.x,y:$.y,width:$.width,height:$.height,rotation:$.rotation}),window.addEventListener("pointermove",B),window.addEventListener("pointerup",W)}function B(p){if(!S.value)return;const g=o.canvasRect;if(g.width===0||g.height===0)return;const b=v(p),M=(b.x-h.value.x)/g.width,$=(b.y-h.value.y)/g.height,z=w.value;switch(S.value){case"move":{if(!c.value)break;const L=n.state.annotations.find(A=>A.id===c.value);if(!L)break;L.x=R(z.x+M,0,1-L.width),L.y=R(z.y+$,0,1-L.height),n.requestRender(!0);break}case"resize":{if(!c.value)break;const L=n.state.annotations.find(K=>K.id===c.value);if(!L)break;const A=.01;switch(k.value){case"se":L.width=R(z.width+M,A,1-z.x),L.height=R(z.height+$,A,1-z.y);break;case"ne":{const K=R(z.width+M,A,1-z.x),O=R(z.height-$,A,z.y+z.height);L.width=K,L.height=O,L.y=z.y+z.height-O;break}case"sw":{const K=R(z.width-M,A,z.x+z.width),O=R(z.height+$,A,1-z.y);L.width=K,L.height=O,L.x=z.x+z.width-K;break}case"nw":{const K=R(z.width-M,A,z.x+z.width),O=R(z.height-$,A,z.y+z.height);L.width=K,L.height=O,L.x=z.x+z.width-K,L.y=z.y+z.height-O;break}}n.requestRender(!0);break}case"rotate":{if(!c.value)break;const L=n.state.annotations.find(X=>X.id===c.value);if(!L)break;const A=g.x+L.x*g.width+L.width*g.width/2,K=g.y+L.y*g.height+L.height*g.height/2,O=Math.atan2(b.x-A,-(b.y-K));L.rotation=O,n.requestRender(!0);break}}}function W(){S.value&&n.updateState(()=>{}),S.value=null,k.value=null,window.removeEventListener("pointermove",B),window.removeEventListener("pointerup",W)}function E(p){if((p.key==="Delete"||p.key==="Backspace")&&c.value&&!r.value){p.preventDefault();const g=c.value;n.updateState(b=>{const M=b.annotations.findIndex($=>$.id===g);M>=0&&b.annotations.splice(M,1)}),c.value=null}p.key==="Escape"&&(r.value?F():c.value=null)}function R(p,g,b){return Math.max(g,Math.min(b,p))}return(p,g)=>(e.openBlock(),e.createElementBlock("svg",{ref_key:"svgRef",ref:l,class:"vie-annotate-overlay",viewBox:`0 0 ${a.wrapperSize.width} ${a.wrapperSize.height}`,width:a.wrapperSize.width,height:a.wrapperSize.height,onPointerdown:C,onKeydown:E,tabindex:"0"},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(y.value,b=>(e.openBlock(),e.createElementBlock("rect",{key:b.id,x:b.dx,y:b.dy,width:b.dw,height:b.dh,fill:"transparent",class:"vie-annotate-hitarea","data-annotation-id":b.id},null,8,Io))),128)),u.value?(e.openBlock(),e.createElementBlock("g",{key:0,transform:x.value},[e.createElementVNode("rect",{x:u.value.dx,y:u.value.dy,width:u.value.dw,height:u.value.dh,class:"vie-annotate-selection"},null,8,To),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(_.value,b=>(e.openBlock(),e.createElementBlock("rect",{key:b.id,x:b.x,y:b.y,width:ye,height:ye,class:"vie-annotate-handle","data-handle":b.id},null,8,Fo))),128)),e.createElementVNode("line",{x1:u.value.dx+u.value.dw/2,y1:u.value.dy-Ye,x2:u.value.dx+u.value.dw/2,y2:u.value.dy,class:"vie-annotate-rotate-line"},null,8,Do),e.createElementVNode("circle",{cx:u.value.dx+u.value.dw/2,cy:u.value.dy-Ye-Ze,r:Ze,class:"vie-annotate-rotate-handle","data-handle":"rotate"},null,8,Lo)],8,Po)):e.createCommentVNode("",!0),r.value&&m.value?(e.openBlock(),e.createElementBlock("foreignObject",{key:1,x:m.value.x,y:m.value.y,width:m.value.w,height:m.value.h},[e.createElementVNode("textarea",{ref_key:"textareaRef",ref:f,class:"vie-annotate-text-input",style:e.normalizeStyle(d.value),value:i.value,onInput:N,onBlur:F,onKeydown:e.withKeys(e.withModifiers(F,["prevent"]),["escape"])},null,44,Ao)],8,Wo)):e.createCommentVNode("",!0)],40,Ro))}}),Ho=`<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
38
|
+
<polyline points="4 7 4 4 20 4 20 7"/>
|
|
39
|
+
<line x1="9.5" y1="20" x2="14.5" y2="20"/>
|
|
40
|
+
<line x1="12" y1="4" x2="12" y2="20"/>
|
|
41
|
+
</svg>`;function we(){return{id:"text",icon:Ho,labelKey:"text",controls:Vo,overlay:Ko}}const jo=["dir"],Oo={class:"vie-main"},Qe=e.defineComponent({__name:"EditorShell",props:{options:{}},emits:["process","close"],setup(a,{emit:t}){const o=a,n=t,l=_e(o.options);it(l);const f={en:Me,ar:Ve},c=e.computed(()=>{const _=o.options.locale||"en";return S=>{var k;return((k=f[_])==null?void 0:k[S])||f.en[S]||S}});e.provide(j,_=>c.value(_));const r={crop:()=>l.registerPlugin(Ie()),finetune:()=>l.registerPlugin(Te()),filter:()=>l.registerPlugin(Fe()),sticker:()=>l.registerPlugin(Ke()),frame:()=>l.registerPlugin(je()),fill:()=>l.registerPlugin(Oe()),resize:()=>l.registerPlugin(Xe()),text:()=>l.registerPlugin(we())},i=o.options.plugins||["crop","finetune","filter","text","sticker","frame","resize"];for(const _ of i)r[_]&&r[_]();if(o.options.customPlugins)for(const _ of o.options.customPlugins)l.registerPlugin(_);const m=e.ref(null),s=e.ref(!1);let d=null;e.onMounted(()=>{m.value&&(d=new ResizeObserver(_=>{for(const S of _){const{width:k,height:h}=S.contentRect;s.value=k>h&&k>700}}),d.observe(m.value),m.value.focus())}),e.onBeforeUnmount(()=>{d==null||d.disconnect()});function y(_){_.ctrlKey||_.metaKey?_.key==="z"&&!_.shiftKey?(_.preventDefault(),l.undo()):(_.key==="z"&&_.shiftKey||_.key==="y")&&(_.preventDefault(),l.redo()):_.key==="Escape"&&n("close")}const u=e.ref(!1);async function x(){if(!(!l.sourceImage.value||u.value)){u.value=!0;try{const S=await new Se().process(l.sourceImage.value,l.state,{mimeType:o.options.outputMimeType||"image/jpeg",quality:o.options.outputQuality??.92,maxCanvasPixels:o.options.maxCanvasPixels});n("process",S)}finally{u.value=!1}}}return(_,S)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"shellRef",ref:m,class:e.normalizeClass(["vie-editor","vie-shell",s.value?"vie-shell--horizontal":"",a.options.theme==="dark"?"vie-theme-dark":""]),dir:a.options.dir||"ltr",onKeydown:y,tabindex:"0"},[s.value?(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[e.createVNode(Ne),e.createElementVNode("div",Oo,[e.createVNode($e,{onDone:x,processing:u.value},null,8,["processing"]),e.createVNode(ze),e.createVNode(Re)])],64)):(e.openBlock(),e.createElementBlock(e.Fragment,{key:1},[e.createVNode($e,{onDone:x,processing:u.value},null,8,["processing"]),e.createVNode(ze),e.createVNode(Re),e.createVNode(Ne)],64))],42,jo))}}),Xo={class:"vie-modal-container"},et=e.defineComponent({__name:"EditorModal",props:{src:{},plugins:{default:()=>["crop","finetune","filter","sticker","frame","resize"]},locale:{default:"en"},dir:{default:"ltr"},theme:{default:"light"},outputMimeType:{},outputQuality:{default:.92},maxCanvasPixels:{},initialState:{}},emits:["process","close"],setup(a,{emit:t}){const o=a,n=t,l=e.ref(null),f=e.computed(()=>({src:o.src,plugins:o.plugins,locale:o.locale,dir:o.dir,theme:o.theme,outputMimeType:o.outputMimeType,outputQuality:o.outputQuality,maxCanvasPixels:o.maxCanvasPixels,initialState:o.initialState}));function c(){n("close")}function r(){window.confirm("Close editor? Unsaved changes will be lost.")&&c()}function i(s){const d=l.value;if(!d)return;const y=d.querySelectorAll('button:not([disabled]), [href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"])');if(y.length===0)return;const u=y[0],x=y[y.length-1];s.shiftKey?document.activeElement===u&&(s.preventDefault(),x.focus()):document.activeElement===x&&(s.preventDefault(),u.focus())}let m="";return e.onMounted(async()=>{var s,d;m=document.body.style.overflow,document.body.style.overflow="hidden",await e.nextTick(),(d=(s=l.value)==null?void 0:s.querySelector('[tabindex="0"]'))==null||d.focus()}),e.onBeforeUnmount(()=>{document.body.style.overflow=m}),(s,d)=>(e.openBlock(),e.createBlock(e.Teleport,{to:"body"},[e.createVNode(e.Transition,{name:"vie-modal"},{default:e.withCtx(()=>[e.createElementVNode("div",{class:"vie-modal-backdrop",role:"dialog","aria-modal":"true",onClick:e.withModifiers(r,["self"]),onKeydown:[e.withKeys(c,["esc"]),e.withKeys(i,["tab"])],ref_key:"backdropRef",ref:l},[e.createElementVNode("div",Xo,[e.createVNode(Qe,{options:f.value,onProcess:d[0]||(d[0]=y=>s.$emit("process",y)),onClose:c},null,8,["options"])])],544)]),_:1})]))}});function qo(a){return JSON.stringify(a)}function Uo(a){const t=JSON.parse(a);if(typeof t!="object"||t===null||Array.isArray(t))throw new Error("Invalid state: expected an object");if(Array.isArray(t.stickers)){for(const o of t.stickers)if(typeof o.src=="string"){const n=o.src.toLowerCase().trim();(n.startsWith("javascript:")||n.startsWith("vbscript:"))&&(o.src="")}}return t}function Yo(a){const t=Q();return{...t,...a,crop:{...t.crop,...a.crop||{}},finetune:{...t.finetune,...a.finetune||{}},filter:{...t.filter,...a.filter||{}},frame:{...t.frame,...a.frame||{}},resize:{...t.resize,...a.resize||{}},stickers:a.stickers||t.stickers,backgroundColor:a.backgroundColor||t.backgroundColor}}function tt(a){a.component("ImageEditorModal",et)}const Zo={install:tt};T.AnnotatePlugin=we,T.CanvasRenderer=Be,T.CropPlugin=Ie,T.FillPlugin=Oe,T.FilterPlugin=Fe,T.FinetunePlugin=Te,T.FramePlugin=je,T.History=ve,T.IDENTITY_MATRIX=ne,T.ImageEditorModal=et,T.ImageEditorShell=Qe,T.ImageProcessor=Se,T.LOCALE_KEY=j,T.ResizePlugin=Xe,T.StickerPlugin=Ke,T.TextPlugin=we,T.applyClarity=le,T.applyColorMatrix=oe,T.applyGamma=ie,T.applyVignette=ae,T.ar=Ve,T.brightnessMatrix=he,T.composeMatrices=de,T.contrastMatrix=ue,T.createDefaultImageState=Q,T.createEditorEngine=_e,T.default=Zo,T.defaultStickerCategories=se,T.deserializeState=Uo,T.en=Me,T.exposureMatrix=me,T.filterPresets=re,T.finetuneEffects=Pe,T.frameStyles=He,T.install=tt,T.loadImage=be,T.mergeWithDefaults=Yo,T.multiplyMatrices=Ee,T.saturationMatrix=fe,T.serializeState=qo,T.temperatureMatrix=pe,T.useEditor=H,Object.defineProperties(T,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
|
|
505
42
|
//# sourceMappingURL=vuedit-image-editor.umd.js.map
|