@yorab/react-paint 0.15.1 → 0.16.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/dist/canvas/constants/shapes.d.ts +2 -0
- package/dist/canvas/hooks/useReactPaint.d.ts +32 -0
- package/dist/canvas/hooks/useShapes.d.ts +24 -0
- package/dist/canvas/utils/file.d.ts +4 -0
- package/dist/canvas/utils/selection/groupSelection.d.ts +3 -2
- package/dist/canvas/utils/selection/rectSelection.d.ts +3 -1
- package/dist/canvas/utils/shapes/brush.d.ts +6 -2
- package/dist/canvas/utils/shapes/circle.d.ts +5 -2
- package/dist/canvas/utils/shapes/curve.d.ts +0 -1
- package/dist/canvas/utils/shapes/ellipse.d.ts +5 -2
- package/dist/canvas/utils/shapes/group.d.ts +33 -0
- package/dist/canvas/utils/shapes/index.d.ts +6 -12
- package/dist/canvas/utils/shapes/line.d.ts +5 -2
- package/dist/canvas/utils/shapes/path.d.ts +2 -2
- package/dist/canvas/utils/shapes/picture.d.ts +5 -2
- package/dist/canvas/utils/shapes/polygon.d.ts +0 -1
- package/dist/canvas/utils/shapes/rectangle.d.ts +7 -44
- package/dist/canvas/utils/shapes/text.d.ts +5 -2
- package/dist/common/types/Shapes.d.ts +4 -0
- package/dist/common/utils/object.d.ts +1 -1
- package/dist/react-paint.js +1342 -1348
- package/dist/react-paint.umd.cjs +1 -1
- package/package.json +13 -13
package/dist/react-paint.umd.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
(function(Ae,v){typeof exports=="object"&&typeof module<"u"?v(exports,require("react"),require("react/jsx-runtime")):typeof define=="function"&&define.amd?define(["exports","react","react/jsx-runtime"],v):v((Ae=typeof globalThis<"u"?globalThis:Ae||self)["react-paint"]={},Ae.React,Ae.jsxRuntime)})(this,function(Ae,v,h){"use strict";const Sn='<svg><path d="M5.146 17.5Q4.146 17.5 3.208 17Q2.271 16.5 1.667 15.708Q2.208 15.75 2.802 15.344Q3.396 14.938 3.396 14.104Q3.396 13.042 4.135 12.292Q4.875 11.542 5.958 11.542Q7.021 11.542 7.76 12.292Q8.5 13.042 8.5 14.104Q8.5 15.5 7.51 16.5Q6.521 17.5 5.146 17.5ZM9.917 12.5 7.562 10.146 14.917 2.729Q15.146 2.5 15.469 2.5Q15.792 2.5 16.021 2.729L17.271 3.958Q17.5 4.188 17.5 4.531Q17.5 4.875 17.271 5.125Z"/></svg>',Et='<svg><path d="M2.5 17.5V2.5H17.5V17.5ZM4.25 15.75H15.75V4.25H4.25ZM4.25 15.75V4.25V15.75Z"/></svg>',Rt='<svg><path d="M10 18.333Q8.271 18.333 6.75 17.677Q5.229 17.021 4.104 15.896Q2.979 14.771 2.323 13.25Q1.667 11.729 1.667 10Q1.667 8.271 2.323 6.75Q2.979 5.229 4.104 4.104Q5.229 2.979 6.75 2.323Q8.271 1.667 10 1.667Q11.729 1.667 13.25 2.323Q14.771 2.979 15.896 4.104Q17.021 5.229 17.677 6.75Q18.333 8.271 18.333 10Q18.333 11.729 17.677 13.25Q17.021 14.771 15.896 15.896Q14.771 17.021 13.25 17.677Q11.729 18.333 10 18.333ZM10 16.583Q12.75 16.583 14.667 14.667Q16.583 12.75 16.583 10Q16.583 7.25 14.667 5.333Q12.75 3.417 10 3.417Q7.25 3.417 5.333 5.333Q3.417 7.25 3.417 10Q3.417 12.75 5.333 14.667Q7.25 16.583 10 16.583ZM10 10Q10 10 10 10Q10 10 10 10Q10 10 10 10Q10 10 10 10Q10 10 10 10Q10 10 10 10Q10 10 10 10Q10 10 10 10Z"/></svg>',It='<svg><path d="M12.25 18.333V16.167L6.833 13.458H2.5V8.208H6.25L8.25 5.917V1.667H13.5V6.917H9.708L7.75 9.146V11.958L12.25 14.208V13.083H17.5V18.333Z"/></svg>',xn='<svg><path d="M4.125 5.083V3.333H7.062L7.896 2.5H12.104L12.938 3.333H15.875V5.083ZM6.75 17.5Q6.021 17.5 5.51 16.99Q5 16.479 5 15.75V5.958H15V15.75Q15 16.479 14.49 16.99Q13.979 17.5 13.25 17.5Z"/></svg>',bn='<svg><path d="M10 17.5Q7.208 17.5 5.271 15.594Q3.333 13.688 3.333 10.958Q3.333 9.583 3.854 8.396Q4.375 7.208 5.292 6.292L10 1.667L14.688 6.292Q15.604 7.208 16.135 8.396Q16.667 9.583 16.667 10.958Q16.667 13.688 14.719 15.594Q12.771 17.5 10 17.5ZM5.146 11.667H14.854Q15.083 10.188 14.552 9.146Q14.021 8.104 13.479 7.562L10 4.125L6.521 7.562Q5.979 8.104 5.448 9.146Q4.917 10.188 5.146 11.667Z"/></svg>',Dt='<svg><path d="M4.792 15.083 8.333 11.542 9.833 13.021 11.667 10.708 15.167 15.083ZM6.667 8.417Q5.938 8.417 5.427 7.906Q4.917 7.396 4.917 6.667Q4.917 5.938 5.427 5.427Q5.938 4.917 6.667 4.917Q7.396 4.917 7.906 5.427Q8.417 5.938 8.417 6.667Q8.417 7.396 7.906 7.906Q7.396 8.417 6.667 8.417ZM4.167 18.333Q3.125 18.333 2.396 17.604Q1.667 16.875 1.667 15.833V4.167Q1.667 3.125 2.396 2.396Q3.125 1.667 4.167 1.667H15.833Q16.875 1.667 17.604 2.396Q18.333 3.125 18.333 4.167V15.833Q18.333 16.875 17.604 17.604Q16.875 18.333 15.833 18.333ZM4.167 16.583H15.833Q16.146 16.583 16.365 16.365Q16.583 16.146 16.583 15.833V4.167Q16.583 3.854 16.365 3.635Q16.146 3.417 15.833 3.417H4.167Q3.854 3.417 3.635 3.635Q3.417 3.854 3.417 4.167V15.833Q3.417 16.146 3.635 16.365Q3.854 16.583 4.167 16.583Z"/></svg>',Qn='<svg><path d="M8.708 16.667V5.917H4.167V3.333H15.833V5.917H11.292V16.667Z"/></svg>',Cn='<svg><path d="M7.5 15.833V14.083H12.833L3.333 4.583L4.583 3.333L14.083 12.833V7.5H15.833V15.833Z"/></svg>',wn='<svg><path d="M7.521 17.5Q6.125 17.5 5.146 16.51Q4.167 15.521 4.167 14.125V7.417Q3.438 7.125 2.969 6.49Q2.5 5.854 2.5 5.042Q2.5 3.979 3.24 3.24Q3.979 2.5 5.042 2.5Q6.104 2.5 6.844 3.24Q7.583 3.979 7.583 5.042Q7.583 5.854 7.115 6.49Q6.646 7.125 5.917 7.417V14.125Q5.917 14.792 6.385 15.271Q6.854 15.75 7.521 15.75Q8.188 15.75 8.656 15.271Q9.125 14.792 9.125 14.125V5.875Q9.125 4.479 10.104 3.49Q11.083 2.5 12.479 2.5Q13.875 2.5 14.854 3.49Q15.833 4.479 15.833 5.875V12.583Q16.562 12.875 17.031 13.51Q17.5 14.146 17.5 14.958Q17.5 16.021 16.76 16.76Q16.021 17.5 14.958 17.5Q13.896 17.5 13.156 16.76Q12.417 16.021 12.417 14.958Q12.417 14.146 12.885 13.5Q13.354 12.854 14.083 12.583V5.875Q14.083 5.208 13.615 4.729Q13.146 4.25 12.479 4.25Q11.812 4.25 11.344 4.729Q10.875 5.208 10.875 5.875V14.125Q10.875 15.521 9.896 16.51Q8.917 17.5 7.521 17.5Z"/></svg>',Mn='<svg><path d="M5.833 15V3.333H10.375Q11.812 3.333 12.885 4.156Q13.958 4.979 13.958 6.375Q13.958 7.375 13.49 7.969Q13.021 8.562 12.396 8.875V9.042Q13.312 9.354 13.844 10.021Q14.375 10.688 14.375 11.75Q14.375 13.312 13.229 14.156Q12.083 15 10.5 15ZM8.125 8.042H10.188Q10.854 8.042 11.302 7.656Q11.75 7.271 11.75 6.708Q11.75 6.167 11.302 5.771Q10.854 5.375 10.188 5.375H8.125ZM8.125 12.917H10.354Q11.167 12.917 11.625 12.51Q12.083 12.104 12.083 11.458Q12.083 10.812 11.625 10.406Q11.167 10 10.354 10H8.125Z"/></svg>',kn='<svg><path d="M4.167 16.667V14.083H6.979L10.229 5.917H7.5V3.333H15.833V5.917H13.021L9.771 14.083H12.5V16.667Z"/></svg>',Pn='<svg><path d="M3.021 16V15H17V16ZM3.021 13.5V12H17V13.5ZM3 10.5V8.5H16.979V10.5ZM3.021 7V4H17V7Z"/></svg>',jn='<svg><path d="M16.354 18.833 14.521 17Q13.542 17.646 12.396 17.99Q11.25 18.333 10 18.333Q8.271 18.333 6.75 17.677Q5.229 17.021 4.104 15.896Q2.979 14.771 2.323 13.25Q1.667 11.729 1.667 10Q1.667 8.729 2.01 7.594Q2.354 6.458 3 5.458L1.167 3.625L2.396 2.396L17.583 17.604ZM10 16.583Q10.896 16.583 11.708 16.365Q12.521 16.146 13.25 15.729L4.292 6.75Q3.875 7.479 3.646 8.292Q3.417 9.104 3.417 10Q3.417 12.729 5.344 14.656Q7.271 16.583 10 16.583ZM17 14.562 15.708 13.271Q16.125 12.542 16.354 11.719Q16.583 10.896 16.583 10Q16.583 7.271 14.656 5.344Q12.729 3.417 10 3.417Q9.104 3.417 8.292 3.646Q7.479 3.875 6.75 4.292L5.458 3Q6.458 2.354 7.594 2.01Q8.729 1.667 10 1.667Q11.729 1.667 13.25 2.323Q14.771 2.979 15.896 4.104Q17.021 5.229 17.677 6.75Q18.333 8.271 18.333 10Q18.333 11.271 17.979 12.417Q17.625 13.562 17 14.562ZM11.229 8.771Q11.229 8.771 11.229 8.771Q11.229 8.771 11.229 8.771Q11.229 8.771 11.229 8.771Q11.229 8.771 11.229 8.771Q11.229 8.771 11.229 8.771Q11.229 8.771 11.229 8.771ZM8.771 11.229Q8.771 11.229 8.771 11.229Q8.771 11.229 8.771 11.229Q8.771 11.229 8.771 11.229Q8.771 11.229 8.771 11.229Q8.771 11.229 8.771 11.229Q8.771 11.229 8.771 11.229Z"/></svg>',Ln='<svg><path d="M16.354 18.833 14.521 17Q13.542 17.646 12.396 17.99Q11.25 18.333 10 18.333Q8.271 18.333 6.75 17.677Q5.229 17.021 4.104 15.896Q2.979 14.771 2.323 13.25Q1.667 11.729 1.667 10Q1.667 8.729 2.01 7.594Q2.354 6.458 3 5.458L1.167 3.625L2.396 2.396L17.583 17.604ZM17 14.562 5.458 3Q6.458 2.354 7.594 2.01Q8.729 1.667 10 1.667Q11.729 1.667 13.25 2.323Q14.771 2.979 15.896 4.104Q17.021 5.229 17.677 6.75Q18.333 8.271 18.333 10Q18.333 11.271 17.979 12.417Q17.625 13.562 17 14.562Z"/></svg>',Vn='<svg viewBox="0 -960 960 960" width="24px"><path d="M784-120 532-372q-30 24-69 38t-83 14q-109 0-184.5-75.5T120-580q0-109 75.5-184.5T380-840q109 0 184.5 75.5T640-580q0 44-14 83t-38 69l252 252-56 56ZM380-400q75 0 127.5-52.5T560-580q0-75-52.5-127.5T380-760q-75 0-127.5 52.5T200-580q0 75 52.5 127.5T380-400Zm-40-60v-80h-80v-80h80v-80h80v80h80v80h-80v80h-80Z"/></svg>',me=["transparent","black","white","red","green","blue","yellow"],Ne=[0,1,2],Zn=[[1,0],[1,2],[4,6]],pt="serif",fi=2,Tn=3,vi=4,oe="react-paint-",Hn={strokeColor:{values:me,default:"black"},fillColor:{values:me,default:"transparent"},opacity:{min:0,max:100,step:1,default:100},lineWidth:{min:1,max:20,step:1,default:1},lineDash:{values:Ne,default:0}},Nt={type:"picture",id:`${oe}picture`,icon:Dt,label:"Image",settings:{opacity:{min:0,max:100,step:1,default:100}}},zn={type:"brush",id:`${oe}brush`,icon:Sn,label:"Brosse",settings:{strokeColor:{values:me,default:"black"},opacity:{min:0,max:100,step:1,default:100},lineWidth:{min:6,max:20,step:2,default:10},lineDash:{values:Ne,default:0}}},An={type:"line",id:`${oe}line`,icon:Cn,label:"Ligne",settings:{strokeColor:{values:me,default:"black"},opacity:{min:0,max:100,step:1,default:100},lineWidth:{min:1,max:20,step:1,default:1},lineDash:{values:Ne,default:0},lineArrow:{values:[0,1,2,3],default:0}}},En={type:"polygon",id:`${oe}polygon`,icon:It,label:"Polygone",settings:{strokeColor:{values:me,default:"black"},fillColor:{values:me,default:"transparent"},opacity:{min:0,max:100,step:1,default:100},lineWidth:{min:1,max:20,step:1,default:1},lineDash:{values:Ne,default:0},closedPoints:{default:0}}},Rn={type:"curve",id:`${oe}curve`,icon:wn,label:"Courbe",settings:{strokeColor:{values:me,default:"black"},fillColor:{values:me,default:"transparent"},opacity:{min:0,max:100,step:1,default:100},lineWidth:{min:1,max:20,step:1,default:1},lineDash:{values:Ne,default:0},closedPoints:{default:0}}},In={type:"rect",id:`${oe}rect`,icon:Et,label:"Rectangle",settings:Hn},Dn={type:"square",id:`${oe}square`,icon:Et,label:"Carré",settings:{strokeColor:{values:me,default:"black"},fillColor:{values:me,default:"transparent"},opacity:{min:0,max:100,step:1,default:100},lineWidth:{min:1,max:20,step:1,default:1},lineDash:{values:Ne,default:0}}},Nn={type:"circle",id:`${oe}circle`,icon:Rt,label:"Cercle",settings:{strokeColor:{values:me,default:"black"},fillColor:{values:me,default:"transparent"},opacity:{min:0,max:100,step:1,default:100},lineWidth:{min:1,max:20,step:1,default:1},lineDash:{values:Ne,default:0}}},Wn={type:"ellipse",id:`${oe}ellipse`,icon:Rt,label:"Ellipse",settings:{strokeColor:{values:me,default:"black"},fillColor:{values:me,default:"transparent"},opacity:{min:0,max:100,step:1,default:100},lineWidth:{min:1,max:20,step:1,default:1},lineDash:{values:Ne,default:0}}},Fn={type:"text",id:`${oe}text`,icon:Qn,label:"Texte",settings:{strokeColor:{values:me,default:"black"},opacity:{min:0,max:100,step:1,default:100},fontFamily:{values:["arial","serif","monospace"],default:pt},fontBold:{values:[!1,!0],default:!1},fontItalic:{values:[!1,!0],default:!1}}},Ee={id:`${oe}selection`,type:"selection",icon:'<svg><path d="M8.0145 11.1707C8.38484 10.9914 8.82183 11.1558 8.99959 11.5295L10.7031 15.2591L12.0363 14.6238L10.3254 10.9017C10.1476 10.528 10.3106 10.0795 10.6809 9.90761L10.8883 9.84782L12.5918 9.51148L6.48133 4.33192V12.389L7.82934 11.2903L8.0145 11.1707ZM10.6587 16.9258C10.2883 17.1052 9.84395 16.9482 9.67359 16.5745L8.05894 13.0318L6.19988 14.5416C6.07396 14.6462 5.91842 14.706 5.74066 14.706C5.54423 14.706 5.35584 14.6272 5.21694 14.4871C5.07803 14.3469 5 14.1568 5 13.9586V2.74741C5 2.54919 5.07803 2.35908 5.21694 2.21891C5.35584 2.07874 5.54423 2 5.74066 2C5.91842 2 6.08878 2.06727 6.21469 2.1719L6.2221 2.16443L14.7323 9.36947C15.0508 9.63854 15.0879 10.1094 14.8286 10.4233C14.7175 10.5579 14.562 10.6475 14.4064 10.6774L12.0659 11.1408L13.6954 14.6761C13.888 15.0498 13.7102 15.4908 13.3399 15.6627L10.6587 16.9258Z"/></svg>',label:"Sélection"},Je={id:`${oe}undo`,type:"undo",icon:'<svg><path d="M11.708 15.833H5.854V14.083H11.708Q13 14.083 13.958 13.292Q14.917 12.5 14.917 11.271Q14.917 10.042 13.958 9.24Q13 8.438 11.708 8.438H6.667L8.792 10.562L7.562 11.792L3.333 7.562L7.562 3.333L8.792 4.562L6.667 6.688H11.708Q13.729 6.688 15.198 7.99Q16.667 9.292 16.667 11.25Q16.667 13.208 15.198 14.521Q13.729 15.833 11.708 15.833Z"/></svg>',label:"Undo"},et={id:`${oe}redo`,type:"redo",icon:'<svg><path d="M8.292 15.833Q6.271 15.833 4.802 14.521Q3.333 13.208 3.333 11.25Q3.333 9.292 4.802 7.99Q6.271 6.688 8.292 6.688H13.333L11.208 4.562L12.438 3.333L16.667 7.562L12.438 11.792L11.208 10.562L13.333 8.438H8.292Q7 8.438 6.042 9.229Q5.083 10.021 5.083 11.25Q5.083 12.5 6.042 13.292Q7 14.083 8.292 14.083H14.146V15.833Z"/></svg>',label:"Redo"},tt={id:`${oe}clear`,type:"clear",icon:'<svg><path d="M7.854 13.812 10 11.688 12.125 13.812 13.354 12.604 11.208 10.458 13.354 8.312 12.125 7.104 10 9.229 7.854 7.104 6.625 8.312 8.771 10.458 6.625 12.604ZM5.896 17.5Q5.167 17.5 4.656 16.99Q4.146 16.479 4.146 15.75V5.125H3.333V3.375H7.542V2.5H12.458V3.375H16.667V5.125H15.833V15.75Q15.833 16.479 15.323 16.99Q14.812 17.5 14.083 17.5Z"/></svg>',label:"Clear"},Wt={id:`${oe}export`,type:"export",icon:'<svg><path d="M10 13.271 5.708 8.979 6.958 7.729 9.125 9.896V3.333H10.875V9.896L13.042 7.729L14.292 8.979ZM5.083 16.667Q4.354 16.667 3.844 16.156Q3.333 15.646 3.333 14.917V12.5H5.083V14.917Q5.083 14.917 5.083 14.917Q5.083 14.917 5.083 14.917H14.917Q14.917 14.917 14.917 14.917Q14.917 14.917 14.917 14.917V12.5H16.667V14.917Q16.667 15.646 16.156 16.156Q15.646 16.667 14.917 16.667Z"/></svg>',label:"Export PNG"},On={id:`${oe}load`,type:"loadfile",icon:'<svg><path d="M3.417 16.667Q2.729 16.667 2.198 16.135Q1.667 15.604 1.667 14.917V5.083Q1.667 4.396 2.198 3.865Q2.729 3.333 3.417 3.333H8.25L9.917 5H16.667Q17.354 5 17.844 5.531Q18.333 6.062 18.333 6.75H3.417V14.917Q3.417 14.917 3.417 14.917Q3.417 14.917 3.417 14.917L5.438 8.5H19.583L17.396 15.479Q17.229 16.021 16.802 16.344Q16.375 16.667 15.833 16.667Z"/></svg>',label:"Load project"},Ft={id:`${oe}save`,type:"savefile",icon:'<svg><path d="M17.5 5.833V15.75Q17.5 16.479 16.99 16.99Q16.479 17.5 15.75 17.5H4.25Q3.521 17.5 3.01 16.99Q2.5 16.479 2.5 15.75V4.25Q2.5 3.521 3.01 3.01Q3.521 2.5 4.25 2.5H14.167ZM10 14.917Q11.062 14.917 11.823 14.156Q12.583 13.396 12.583 12.333Q12.583 11.271 11.823 10.51Q11.062 9.75 10 9.75Q8.938 9.75 8.177 10.51Q7.417 11.271 7.417 12.333Q7.417 13.396 8.177 14.156Q8.938 14.917 10 14.917ZM5.021 8.396H12.521V5.021H5.021Z"/></svg>',label:"Save project"},Ot={id:`${oe}move`,type:"move",icon:'<svg viewBox="0 -960 960 960"><path d="M412-48q-21.95 0-40.98-9Q352-66 338-83L48-434l27-28q17-17 41.5-20.5T162-473l126 74v-381q0-15.3 10.29-25.65Q308.58-816 323.79-816t25.71 10.35Q360-795.3 360-780v300h80v-396q0-15.3 10.29-25.65Q460.58-912 475.79-912t25.71 10.35Q512-891.3 512-876v396h80v-348q0-15.3 10.29-25.65Q612.58-864 627.79-864t25.71 10.35Q664-843.3 664-828v348h80v-252q0-15.3 10.29-25.65Q764.58-768 779.79-768t25.71 10.35Q816-747.3 816-732v540q0 60-42 102T672-48H412Z"/></svg>',label:"Move"},Bn={id:`${oe}upload-picture`,type:"uploadpicture",icon:Dt,label:"Upload picture"},$n=2,Yn="blue",Ye=14,Un=[[0,0],[.5,0],[1,0],[1,.5],[1,1],[.5,1],[0,1],[0,.5]],Xn=["brush","rect","square","line","polygon","circle","curve","ellipse","picture","text","triangle","group"],Gn="react-paint-canvas-drawcanvas",qn="react-paint-canvas-selectioncanvas",_n={layersManipulation:!0,grid:0,canGrow:!1,canShrink:!0,withExport:!0,withLoadAndSave:!0,withUploadPicture:!0,withUrlPicture:!1,availableTools:[zn,An,En,Rn,In,Dn,Nn,Wn,Nt,Fn],clearCallback:"empty",brushAlgo:"simple",isBrushShapeDoneOnMouseUp:!0,withFrameSelection:!0,withSkeleton:!0,canvasSelectionPadding:0,size:"fixed",canZoom:"never",debug:!1},mi={canvasBackgroundColor:"white",canvasSelectionColor:Yn,canvasSelectionWidth:$n},Kn=300,Bt=(e,t)=>{const n={...t};for(const s of e)delete n[s];return n},be=(e,t,n)=>{const s=Array.isArray(n)?[...n]:{...n},i=Array.isArray(e)?e:typeof e=="string"?e.split("."):[e];return i.reduce((a,c,r)=>(a[c]=$t(a[c])?{...a[c]}:Array.isArray(a[c])?[...a[c]]:a[c]===void 0||a[c]===null?{}:a[c],r===i.length-1&&(a[c]=t),a[c]),s),s},$t=e=>typeof e=="object"&&!Array.isArray(e)&&e!==null,Ze=(e,t,n)=>{if(!$t(t)||!$t(n))return n;const s={...t};for(const i in n)n.hasOwnProperty(i)&&(s.hasOwnProperty(i)?s[i]=e(s[i],n[i],i)??Ze(e,s[i],n[i]):s[i]=n[i]);return s},Jn=(e,t)=>{if(e===t)return!0;if(typeof e!="object"||typeof t!="object"||e===null||t===null)return!1;const n=Object.keys(e),s=Object.keys(t);if(n.length!==s.length)return!1;for(const i of n)if(!s.includes(i)||!Jn(e[i],t[i]))return!1;return!0},Yt={},le=(e="")=>(Yt[e]||(Yt[e]=0),`${e}${++Yt[e]}`),Te=(e,t,n)=>Math.max(t,Math.min(e,n)),es=()=>typeof navigator<"u"&&navigator.userAgent.includes("Macintosh"),ts=e=>{e.reset(),e.lineCap="round",e.lineJoin="round"},ye=(e,t={})=>{const{lineCap:n="round",fillColor:s="transparent",opacity:i=100,strokeColor:a=Yn,lineWidth:c=$n,lineDash:r=0,shadowColor:o="transparent",shadowBlur:l=0}=t;e.lineCap=n,e.globalAlpha=i/100,e.fillStyle=s,e.strokeStyle=a,e.lineWidth=c,e.setLineDash(r===0?[]:[Zn[r][0]*c,Zn[r][1]*c]),e.shadowColor=o,e.shadowBlur=l},vt=(e,t,n,s)=>{e.save(),e.scale(t.canvasSize.scaleRatio,t.canvasSize.scaleRatio),e.translate(t.canvasOffset[0],t.canvasOffset[1]),n&&s&&(e.translate(s[0],s[1]),e.rotate(n),e.translate(-s[0],-s[1]))},ns=(e,{selectionPadding:t})=>{const n=e.points.flat(),s=Math.min(...n.map(o=>o[0])),i=Math.min(...n.map(o=>o[1])),a=n.map(o=>je(o,s,i,e.scaleX,e.scaleY)),c=Math.max(...a.map(o=>o[0]))+t,r=Math.max(...a.map(o=>o[1]))+t;return{x:s-t,width:c-s+t,y:i-t,height:r-i+t}},ss=(e,t)=>He(e,ns,t),nt=(e,t)=>{const n=bi(e,t),s=ss(e,t);return{...e,path:n,selection:st(n,s,t),computed:s}},yi=nt,Ut=e=>180*e/Math.PI,is=(e,t)=>{const n=t.x-Math.min(Math.max(t.x,e.x),e.x+e.width),s=t.y-Math.min(Math.max(t.y,e.y),e.y+e.height);return Math.sqrt(n*n+s*s)<=t.radius},Se=({origin:e=[0,0],point:t,rotation:n=0})=>{const s=[t[0]-e[0],t[1]-e[1]],i=s[1]*Math.cos(n)-s[0]*Math.sin(n);return[s[1]*Math.sin(n)+s[0]*Math.cos(n)+e[0],i+e[1]]},as=e=>(e+2*Math.PI)%(2*Math.PI),os=({targetVector:[e,t],radian:n=!0,originVector:s})=>{const i=as(Math.atan2(t[1]-e[1],t[0]-e[0]));if(s){const[a,c]=s,r=Math.atan2(c[1]-a[1],c[0]-a[0]),o=as(i-r);return n?o:Ut(o)}return n?i:Ut(i)},rs=(e,t)=>Math.sqrt((e[0]-t[0])**2+(e[1]-t[1])**2),We=(e,t=2)=>Math.round(e*10**t)/10**t,je=(e,t,n,s=1,i=1)=>[t+(e[0]-t)*s,n+(e[1]-n)*i],U=(e,t,n=0)=>{if(!t.gridGap)return We(e);const s=e+n,i=s>=0?t.gridGap:-t.gridGap;return s+i/2-(s+i/2)%i-n},Si=(e,t,n)=>t.gridGap||n?e+Math.PI/18/2-(e+Math.PI/18/2)%(Math.PI/18):We(e,3),Re=(e,t)=>t?[Math.abs(e[0])>Math.abs(e[1])?e[0]:0,Math.abs(e[1])>Math.abs(e[0])?e[1]:0]:e,xi=(e,t,n,s,i,a,c)=>xe(X(t).map(r=>{switch(s.mode){case"brush":return((o,l,p)=>{const d={...o,points:be(o.points.length-1,[...o.points[o.points.length-1],[Math.round(l[0]),Math.round(l[1])]],o.points)};return nt(d,p)})(r,n,i);case"translate":return ln(n,X(s.originalShape).find(o=>o.id===r.id),s.cursorStartPosition,i,a);case"rotate":return Xi(r,n,X(s.originalShape).find(o=>o.id===r.id),s.cursorStartPosition,s.center,i,a);case"resize":return Gi(e,r,n,X(s.originalShape).find(o=>o.id===r.id),s,i,a,c);default:return r}}),i),Xt=e=>{const t=new Path2D;return t.rect(e.x,e.y,e.width,e.height),t},mt=e=>{const t=new Path2D;return t.arc(e.x,e.y,e.radius,0,2*Math.PI),t},yt=e=>{const t=new Path2D;return t.moveTo(...e.points[0]),t.lineTo(...e.points[1]),t},bi=(e,{brushAlgo:t})=>{if(e.points.length<1||e.style?.strokeColor==="transparent")return;const n=e.points.flat(),s=n.map(o=>o[0]),i=n.map(o=>o[1]),a=Math.min(...s),c=Math.min(...i),r=new Path2D;for(const o of e.points){if(!o.length)return;if(o.length===1)r.rect(...je(o[0],a,c,e.scaleX,e.scaleY),1,1);else if(r.moveTo(...je(o[0],a,c,e.scaleX,e.scaleY)),t==="quadratic"){for(let l=0;l<o.slice(1).length-2;l++){const p=je(o[l],a,c,e.scaleX,e.scaleY),d=je(o[l+1],a,c,e.scaleX,e.scaleY),u=(p[0]+d[0])/2,y=(p[1]+d[1])/2;r.quadraticCurveTo(...p,u,y)}r.quadraticCurveTo(...je(o[o.length-2],a,c,e.scaleX,e.scaleY),...je(o[o.length-1],a,c,e.scaleX,e.scaleY))}else for(const l of o.slice(1))r.lineTo(...je(l,a,c,e.scaleX,e.scaleY))}return r},Qi=(e,t,n,s)=>{const i=x=>(1-x)**3*e[0]+3*(1-x)**2*x*t[0]+3*(1-x)*x**2*n[0]+x**3*s[0],a=x=>(1-x)**3*e[1]+3*(1-x)**2*x*t[1]+3*(1-x)*x**2*n[1]+x**3*s[1],c=(x,Z,R)=>{const T=x-2*Z+R,S=-2*x+2*Z,j=x;if(Math.abs(T)<1e-10){if(Math.abs(S)<1e-10)return[];const $=-j/S;return $>0&&$<1?[$]:[]}const I=S*S-4*T*j;if(I<0)return[];const A=Math.sqrt(I),E=(-S-A)/(2*T),W=(-S+A)/(2*T),B=[];return E>0&&E<1&&B.push(E),W>0&&W<1&&W!==E&&B.push(W),B},r=e[0],o=t[0],l=n[0],p=s[0],d=e[1],u=t[1],y=n[1],g=s[1],b=c(o-r,l-o,p-l),P=c(u-d,y-u,g-y);let L=Math.min(e[0],s[0]),w=Math.max(e[0],s[0]),k=Math.min(e[1],s[1]),f=Math.max(e[1],s[1]);for(const x of b){const Z=i(x);L=Math.min(L,Z),w=Math.max(w,Z)}for(const x of P){const Z=a(x);k=Math.min(k,Z),f=Math.max(f,Z)}return{minX:L,maxX:w,minY:k,maxY:f}},Gt=(e,t)=>e.style?.closedPoints===1&&t.length>2?[t[t.length-2],...t,t[0],t[1]]:[t[0],...t,t[t.length-1]],qt=(e,t,n,s)=>({cp1:[t[0]+(n[0]-e[0])/6,t[1]+(n[1]-e[1])/6],cp2:[n[0]-(s[0]-t[0])/6,n[1]-(s[1]-t[1])/6]}),ls=e=>{const t=e.tempPoint?[...e.points,e.tempPoint]:e.points;if(t.length<2)return;const n=new Path2D;n.moveTo(...t[0]);for(const s of t.slice(1))n.lineTo(...s);return t.length>2&&e.style?.closedPoints===1&&n.lineTo(...t[0]),n},Ci=e=>{const t=new Path2D;return t.moveTo(...e.points[0]),t.lineTo(...e.points[1]),t.lineTo(...e.points[2]),t.lineTo(...e.points[0]),t},wi=(e,t)=>({x:e.x-(t?.lineWidth??0)/2,y:e.y-(t?.lineWidth??0)/2,width:e.width+(t?.lineWidth??0),height:e.height+(t?.lineWidth??0)}),He=(e,t,n,s=wi)=>{const i=t(e,n),a=s(i,e.style),c=[i.x+i.width/2,i.y+i.height/2],r=((o,l,p=0)=>{if(p===0)return o;const d=[[o.x,o.y],[o.x+o.width,o.y],[o.x+o.width,o.y+o.height],[o.x,o.y+o.height]].map(g=>Se({point:g,origin:l,rotation:p})),u=Math.min(...d.map(g=>g[0])),y=Math.min(...d.map(g=>g[1]));return{x:u,y,width:Math.max(...d.map(g=>g[0]))-u,height:Math.max(...d.map(g=>g[1]))-y}})(a,c,e.rotation);return{borders:i,outerBorders:a,center:c,boundingBox:r}},st=(e,t,n,s=!1)=>{const{borders:i}=t;return{border:Xt(i),shapePath:e,line:s?void 0:yt({points:[[i.x+i.width/2,i.y],[i.x+i.width/2,i.y-23/n.canvasSize.scaleRatio]]}),anchors:s?[]:[mt({x:i.x+i.width/2,y:i.y-23/n.canvasSize.scaleRatio,radius:7/n.canvasSize.scaleRatio}),...Un.map(a=>mt({x:i.x+i.width*a[0],y:i.y+i.height*a[1],radius:7/n.canvasSize.scaleRatio}))]}},cs=({borderStart:e,borderSize:t,vector:n,settings:s,invertedAxe:i,anchor:a})=>{switch(a){case 0:{if(i){const r=t-2*s.selectionPadding;return[e+r,n-r]}const c=Math.max(2*s.selectionPadding,t-n);return[e+t-c,c]}case .5:return[e,t];case 1:if(i){const c=t+n;return[e+c,2*s.selectionPadding-c]}return[e,Math.max(2*s.selectionPadding,t+n)];default:return[0,0]}},it=(e,t,n,s,i=!1,a=!1)=>{const{center:c,borders:r}=t.computed,o=Se({origin:c,point:e,rotation:t.rotation}),l=n.anchor[0]===0&&o[0]>=r.x+r.width||n.anchor[0]===1&&o[0]<=r.x,p=n.anchor[1]===0&&o[1]>=r.y+r.height||n.anchor[1]===1&&o[1]<=r.y,d=[U(o[0],s,n.anchor[0]===0&&!l||n.anchor[0]===1&&l?s.selectionPadding:-s.selectionPadding),U(o[1],s,n.anchor[1]===0&&!p||n.anchor[1]===1&&p?s.selectionPadding:-s.selectionPadding)],u=s.gridGap?[n.anchor[0]===0?r.x:n.anchor[0]===.5?r.x+r.width/2:r.x+r.width,n.anchor[1]===0?r.y:n.anchor[1]===.5?r.y+r.height/2:r.y+r.height]:Se({origin:c,point:n.cursorStartPosition,rotation:t.rotation}),y=[d[0]-u[0],d[1]-u[1]],[g,b]=cs({borderStart:r.x,borderSize:r.width,vector:y[0],settings:s,invertedAxe:l,anchor:n.anchor[0]}),[P,L]=cs({borderStart:r.y,borderSize:r.height,vector:y[1],settings:s,invertedAxe:p,anchor:n.anchor[1]}),w=i?((k,f,x,Z,R,T,S,j,I,A)=>{const{selectionPadding:E}=A,W=(f.width-2*E||1)/(f.height-2*E||1),B=(R-2*E)/(S-2*E);let $,G,V,m;return I.anchor[0]!==.5&&I.anchor[1]!==.5?B<W?(G=T,m=S,V=(S-2*E)*W+2*E,$=I.anchor[0]===0?f.width-k[0]>E?f.x+(f.width-V):f.x+f.width-2*E:f.width+k[0]>E?f.x:f.x-V+2*E):($=Z,V=R,m=(R-2*E)/W+2*E,G=I.anchor[1]===0?f.height-k[1]>E?f.y+(f.height-m):f.y+f.height-2*E:f.height+k[1]>E?f.y:f.y-m+2*E):I.anchor[0]!==.5?($=Z,V=R,m=(R-2*E)/W+2*E,G=f.y+(f.height-m)/2):(G=T,m=S,V=(S-2*E)*W+2*E,$=f.x+(f.width-V)/2),{borderX:$,borderWidth:V,borderY:G,borderHeight:m,center:x,originalShape:j}})(y,r,c,g,b,P,L,t,n,s):{borderX:g,borderWidth:b,borderY:P,borderHeight:L,center:c,originalShape:t};return(({borderX:k,borderWidth:f,borderY:x,borderHeight:Z,center:R,originalShape:T})=>{const S=[k+f/2-R[0],x+Z/2-R[1]],[j,I]=Se({point:S,rotation:-(T.rotation??0)});return{borderX:We(k+j-S[0]),borderWidth:We(f),borderY:We(x+I-S[1]),borderHeight:We(Z)}})(a?((k,f,x,Z)=>{const R=f.x+f.width/2,T=f.y+f.height/2,S=x?2*k.borderWidth+f.width:Math.abs(f.width+2*(k.borderWidth-f.width)),j=Z?2*k.borderHeight+f.height:Math.abs(f.height+2*(k.borderHeight-f.height));return{...k,borderHeight:j,borderWidth:S,borderX:R-S/2,borderY:T-j/2}})(w,r,l,p):w)},ds=(e,t)=>He(e,_t,t),St=(e,t,n=!1)=>{const s=Xt(e),i=ds(e,t);return{...e,path:s,computed:i,selection:st(s,i,t,n)}},Mi=St,us=(e,t,n,s=!1,i=0,a=0)=>{const c={toolId:e.id,type:e.type,id:le(`${e.type}_`),x:t[0],y:t[1],width:i,height:a,style:{opacity:e.settings.opacity.default,fillColor:e.settings.fillColor.default,strokeColor:e.settings.strokeColor.default,lineWidth:e.settings.lineWidth.default,lineDash:e.settings.lineDash.default}};return St(c,n,s)},ki=(e,t)=>{e.globalAlpha!==0&&t.path&&(t.style?.fillColor!=="transparent"&&e.fill(t.path),t.style?.strokeColor!=="transparent"&&e.stroke(t.path))},_t=(e,t)=>({x:e.x-t.selectionPadding,width:e.width+2*t.selectionPadding,y:e.y-t.selectionPadding,height:e.height+2*t.selectionPadding}),hs=(e,t,n,[s,i]=[!1,!1])=>{const a=e[0]===.5?n.x+n.width/2:e[0]===0?n.x+(s?0:n.width):n.x+(s?n.width:0),c=e[1]===.5?n.y+n.height/2:e[1]===0?n.y+(i?0:n.height):n.y+(i?n.height:0);return Li([a,c],n.rotation??0,t)},ps=(e,t,n,s,i,a,c,r)=>{let o=!1;if(i){o=rt(e,i,n,s,!0,a?20:void 0);const p=((d,u,y)=>{if(d.mode==="translate")return{mode:"translate",cursorStartPosition:y,originalShape:u,hasBeenDuplicated:!1,dateStart:Date.now()};if(d.mode==="rotate"){const{center:g}=u.computed;return{mode:"rotate",cursorStartPosition:y,originalShape:u,center:[g[0],g[1]]}}return d.mode==="resize"?{mode:"resize",cursorStartPosition:y,originalShape:u,anchor:d.anchor}:void 0})(o||{mode:"default"},i,n);if(p?.mode==="resize"||p?.mode==="rotate")return{shape:i,mode:p}}const l=t.find(p=>X(i).find(d=>p.id===d?.id)?o&&r?rt(e,p,n,s,!0,a?20:void 0):!!o:!!Ss(e,p,n,s));if(l){if(r){const d=X(i).find(u=>u.id===l?.id)?xe(ji(i,l),s):xe(fs(i,[l]),s);return{shape:d,mode:{mode:"translate",cursorStartPosition:n,hasBeenDuplicated:!1,dateStart:Date.now(),originalShape:d}}}const p=X(i).find(d=>d.id===l?.id)?i:xe([l],s);return{shape:p,mode:{mode:"translate",cursorStartPosition:n,hasBeenDuplicated:!1,dateStart:Date.now(),originalShape:p}}}return r?{shape:i,mode:{mode:c?"selectionFrame":"default"}}:{shape:void 0,mode:{mode:c?"selectionFrame":"default"}}},Pi=(e,t,n=!0)=>{const s=[[e.x,e.y],[e.x+e.width,e.y],[e.x+e.width,e.y+e.height],[e.x,e.y+e.height]];if(!n)return s;const i=[e.x+e.width/2,e.y+e.height/2];return s.map(a=>Se({point:[a[0],a[1]],origin:i,rotation:t}))},xe=(e,t)=>{if(!e.length)return;if(e.length===1)return e[0];let n=Number.POSITIVE_INFINITY,s=Number.POSITIVE_INFINITY,i=Number.NEGATIVE_INFINITY,a=Number.NEGATIVE_INFINITY;const c=e.some(p=>p.rotation!==e[0].rotation),r=c?0:e[0]?.rotation??0;for(const p of e){const{borders:d}=p.computed,u=Pi(d,p.rotation??0,c);n=Math.min(u[0][0],u[1][0],u[2][0],u[3][0],n),i=Math.max(u[0][0],u[1][0],u[2][0],u[3][0],i),s=Math.min(u[0][1],u[1][1],u[2][1],u[3][1],s),a=Math.max(u[0][1],u[1][1],u[2][1],u[3][1],a)}const o=us({id:"test",type:"rect",settings:Hn},[n,s],t,!0,i-n,a-s),l=e.slice(1).reduce((p,d)=>{const u=d.style??{},y={};for(const g in u)p[g]!==void 0&&u[g]!==void 0&&p[g]===u[g]&&(y[g]=p[g]);return y},e[0].style??{});return{id:e.map(p=>p.id).join("-"),type:"group",shapes:e,rotation:r,visible:!0,locked:!1,selection:o.selection,x:o.x,y:o.y,width:o.width,height:o.height,style:l,computed:o.computed}},gs=(e,t)=>n=>{if(!n)return;const s=n.type==="group"?n.shapes.map(i=>e(i,t)):[e(n,t)];return xe(s,t)},X=e=>e?e.type==="group"?e.shapes:[e]:[],fs=(e,t)=>{const n=X(e);return[...new Set([...n,...t])]},ji=(e,t)=>X(e).filter(n=>n.id!==t.id),vs=e=>{const{clientX:t=0,clientY:n=0}="touches"in e&&e.touches[0]?e.touches[0]:"changedTouches"in e&&e.changedTouches[0]?e.changedTouches[0]:"clientX"in e?e:{};return{clientX:t,clientY:n}},ms=(e,t,n)=>{const{clientX:s,clientY:i}=vs(e),a=t.getBoundingClientRect();return[(s-a.left)/n.scaleRatio,(i-a.top)/n.scaleRatio]},at=(e,t,n)=>{const{clientX:s,clientY:i}=vs(e),a=t?.getBoundingClientRect()??{left:0,top:0,width:n.canvasSize.width,height:n.canvasSize.height};return[(s-a.left)*(n.canvasSize.width/a.width)/n.canvasSize.scaleRatio-n.canvasOffset[0],(i-a.top)*(n.canvasSize.height/a.height)/n.canvasSize.scaleRatio-n.canvasOffset[1]]},ot=e=>"touches"in e,Le=(e,t,[n,s])=>Se({origin:[n,s],point:e,rotation:t}),Li=(e,t,[n,s])=>Se({origin:[n,s],point:e,rotation:-t}),xt=(e,t,n)=>n?is(e,{x:t[0],y:t[1],radius:n}):((s,i)=>i[0]>=s.x&&i[0]<=s.x+s.width&&i[1]>=s.y&&i[1]<=s.y+s.height)(e,t),rt=(e,t,n,s,i=!1,a=0)=>{if(t.locked)return!1;const{canvasSize:{scaleRatio:c}}=s,{borders:r,center:o}=t.computed,l=Le(n,t.rotation??0,o),p=X(t);if(i){if(p.length!==1||p[0]?.type!=="line"&&p[0]?.type!=="polygon"&&p[0]?.type!=="curve"){if(p.length===1){if(xt({x:r.x+r.width/2-7/c,y:r.y-Ye/c-16/c,width:Ye/c,height:Ye/c},l,a))return{mode:"rotate"};for(const d of Un)if(xt({x:r.x+r.width*d[0]-7/c,y:r.y+r.height*d[1]-7/c,width:Ye/c,height:Ye/c},l,a))return{mode:"resize",anchor:d}}}else for(let d=0;d<p[0].points.length;d++)if(xt({x:p[0].points[d][0]-7/c,y:p[0].points[d][1]-7/c,width:Ye/c,height:Ye/c},l,a))return{mode:"resize",anchor:d}}return(xt(r,l,a)||!!(t.type==="curve"&&"path"in t&&t.path&&e.isPointInPath(t.path,l[0],l[1])))&&{mode:"translate"}},ys=(e,t,n,s,i=50)=>{if(t.locked||t.points.length<2)return!1;const{center:a}=t.computed,c=Le(n,t.rotation??0,a);e.lineWidth=(t.style?.lineWidth??0)+i/s.canvasZoom;const r=t.style?.closedPoints?[...t.points,t.points[0]]:t.points;for(let o=0;o<r.length-1;o++){const l=yt({points:[r[o],r[o+1]]});if(e.isPointInStroke(l,c[0],c[1]))return{lineIndex:o}}return!1},Ss=(e,t,n,s)=>{if(t.locked)return!1;const{center:i}=t.computed,a=Le(n,t.rotation??0,i);return"path"in t&&t.path?t.style?.fillColor&&t.style?.fillColor!=="transparent"?!!e.isPointInPath(t.path,a[0],a[1])&&{mode:"translate"}:(e.lineWidth=(t.style?.lineWidth??0)+15/s.canvasZoom,!!e.isPointInStroke(t.path,a[0],a[1])&&{mode:"translate"}):rt(e,t,n,s,!1)};function Kt(e,t){const n=Math.max(e.x,t.x),s=Math.max(e.y,t.y),i=Math.min(e.x+(e.width||1),t.x+(t.width||1)),a=Math.min(e.y+(e.height||1),t.y+(t.height||1));if(n<i&&s<a)return{x:n,y:s,width:i-n,height:a-s}}const xs=({ctx:e,path:t,rect:n,offset:s,checkFill:i})=>{for(let a=0;a<s;a+=s/2)for(let c=0;c<s;c+=s/2)for(let r=a+n.x;r<n.x+n.width;r+=s)for(let o=c+n.y;o<n.y+n.height;o+=s)if(i?e.isPointInPath(t,r,o):e.isPointInStroke(t,r,o))return!0;return!1},Jt=(e,t,n,s)=>({border:Xt(n.borders),shapePath:e,anchors:[...t.points.map(i=>mt({x:i[0],y:i[1],radius:7/s.canvasSize.scaleRatio}))]}),Qe=[.05,.1,.25,.5,1,2,4,8],en=({size:e,zoom:t,newOffset:[n,s],canvasSize:i})=>e==="infinite"?{zoom:t,offset:[n,s]}:t<1?{zoom:t,offset:[-(i.realWidth-i.realWidth/t)/2,-(i.realHeight-i.realHeight/t)/2]}:{zoom:t,offset:[Te(n,i.realWidth/t-i.realWidth,0),Te(s,i.realHeight/t-i.realHeight,0)]},tn=({size:e,canvasSize:t,currentOffset:n,currentZoom:s,zoom:i,centerPoint:a})=>{const c=e==="fixed"&&i<1?[t.realWidth/2,t.realHeight/2]:a,r=n[0]-(c[0]/s-c[0]/i),o=n[1]-(c[1]/s-c[1]/i);return{offset:e==="infinite"?[r,o]:i<1?[-(t.realWidth-t.realWidth/i)/2,-(t.realHeight-t.realHeight/i)/2]:[Te(r,t.realWidth/i-t.realWidth,0),Te(o,t.realHeight/i-t.realHeight,0)],zoom:i}},bs=e=>{const{canvasSize:{width:t,height:n,scaleRatioWithNoZoom:s},canvasZoom:i,canvasOffset:a}=e;return{x:a[0]*i*s,y:a[1]*i*s,width:t*i,height:n*i}},Qs=(e,t)=>{const{canvasZoom:n,size:s}=t;if(s!=="fixed"||n>=1)return;const i=bs(t);e.beginPath(),e.rect(i.x,i.y,i.width,i.height),e.closePath(),e.clip()},gt=(e,t)=>t.size!=="fixed"||e[0]>0&&e[0]<t.canvasSize.realWidth&&e[1]>0&&e[1]<t.canvasSize.realHeight,Vi=(e,t)=>({x:e.x-e.radius-t.selectionPadding,width:2*(e.radius+t.selectionPadding),y:e.y-e.radius-t.selectionPadding,height:2*(e.radius+t.selectionPadding)}),Cs=(e,t)=>He(e,Vi,t),bt=(e,t)=>{const n=mt(e),s=Cs(e,t);return{...e,path:n,selection:st(n,s,t),computed:s}},Zi=bt,ws=(e,t)=>He(e,nn,t),lt=(e,t)=>{const n=ls(e),s=ws(e,t);return{...e,path:n,selection:Jt(n,e,s,t),computed:s}},Ti=lt,nn=(e,t)=>{const n=Math.min(...e.points.map(a=>a[0]))-t.selectionPadding,s=Math.max(...e.points.map(a=>a[0]))+t.selectionPadding,i=Math.min(...e.points.map(a=>a[1]))-t.selectionPadding;return{x:n,width:s-n,y:i,height:Math.max(...e.points.map(a=>a[1]))+t.selectionPadding-i}},Hi=(e,t,n,s)=>{if(t<0||t>e.points.length-1)return e;const i=[...e.points.slice(0,t+1),n,...e.points.slice(t+1)];return lt({...e,points:i},s)},Ms=(e,t,n,s=!1)=>{const i=[U(t[0],n),U(t[1],n)],a=Le(i,e.rotation??0,e.computed.center),c={...e,points:s?e.points:[...e.points,a],tempPoint:s?a:void 0};return lt(c,n)},zi=(e,t)=>{const n=e.tempPoint?[...e.points,e.tempPoint]:e.points;if(n.length<2){const o=n[0]??[0,0],l=t.selectionPadding;return{x:o[0]-l,y:o[1]-l,width:2*l,height:2*l}}if(n.length<3)return nn({...e,points:n},t);const s=Gt(e,n);let i=Number.POSITIVE_INFINITY,a=Number.NEGATIVE_INFINITY,c=Number.POSITIVE_INFINITY,r=Number.NEGATIVE_INFINITY;for(let o=1;o<s.length-2;o++){const l=s[o-1],p=s[o],d=s[o+1],u=s[o+2],{cp1:y,cp2:g}=qt(l,p,d,u),b=Qi(p,y,g,d);i=Math.min(i,b.minX),a=Math.max(a,b.maxX),c=Math.min(c,b.minY),r=Math.max(r,b.maxY)}return _t({x:i,y:c,width:a-i,height:r-c},t)},ks=(e,t)=>He(e,zi,t),ct=(e,t)=>{const n=(i=>{const a=i.tempPoint?[...i.points,i.tempPoint]:i.points;if(a.length<2)return;if(a.length<3)return ls(i);const c=i.style?.closedPoints===1&&a.length>2,r=new Path2D;r.moveTo(...a[0]);const o=Gt(i,a);for(let l=1;l<o.length-2;l++){const p=o[l-1],d=o[l],u=o[l+1],y=o[l+2],{cp1:g,cp2:b}=qt(p,d,u,y);r.bezierCurveTo(g[0],g[1],b[0],b[1],u[0],u[1])}return c&&r.closePath(),r})(e),s=ks(e,t);return{...e,path:n,selection:Jt(n,e,s,t),computed:s}},Ai=ct,Ei=(e,t,n,s)=>{if(t<0||t>e.points.length-1)return e;const i=[...e.points.slice(0,t+1),n,...e.points.slice(t+1)];return ct({...e,points:i},s)},Ps=(e,t,n,s=!1)=>{const i=[U(t[0],n),U(t[1],n)],a=e.computed.center,c=Le(i,e.rotation??0,a),r={...e,points:s?e.points:[...e.points,c],tempPoint:s?c:void 0};return ct(r,n)},Ri=(e,t)=>({x:e.x-e.radiusX-t.selectionPadding,width:2*(e.radiusX+t.selectionPadding),y:e.y-e.radiusY-t.selectionPadding,height:2*(e.radiusY+t.selectionPadding)}),js=(e,t)=>He(e,Ri,t),Qt=(e,t)=>{const n=(i=>{const a=new Path2D;return a.ellipse(i.x,i.y,i.radiusX,i.radiusY,0,0,2*Math.PI),a})(e),s=js(e,t);return{...e,path:n,selection:st(n,s,t),computed:s}},Ii=Qt,Di=(e,t)=>He(e,nn,t),Ls=(e,t)=>((n,s)=>({...n,path:Ci(n),computed:Di(n,s)}))({...e,id:le("triangle_"),type:"triangle"},t),Ni=(e,t)=>{e.globalAlpha!==0&&t.path&&(t.style?.fillColor!=="transparent"&&e.fill(t.path),t.style?.strokeColor!=="transparent"&&e.stroke(t.path))},Wi=(e,t)=>({x:Math.min(e.points[0][0],e.points[1][0])-t.selectionPadding,width:Math.abs(e.points[0][0]-e.points[1][0])+2*t.selectionPadding,y:Math.min(e.points[0][1],e.points[1][1])-t.selectionPadding,height:Math.abs(e.points[0][1]-e.points[1][1])+2*t.selectionPadding}),Vs=(e,t)=>He(e,Wi,t),Ct=(e,t)=>{const n=[];let s;if(e.style?.lineArrow===1||e.style?.lineArrow===2||e.style?.lineArrow===3){const a=Math.PI/2-os({targetVector:[e.points[0],e.points[1]]});e.style?.lineArrow!==1&&e.style?.lineArrow!==3||n.push(Ls(Zs(e.points[0],a,e.style),t)),e.style?.lineArrow!==2&&e.style?.lineArrow!==3||n.push(Ls(Zs(e.points[1],a+Math.PI,e.style),t));const c=(({line:r,size:o,direction:l})=>{const p=Math.PI/2-os({targetVector:[r.points[0],r.points[1]]}),d=[r.points[0][0]+(r.points[1][0]-r.points[0][0])/2,r.points[0][1]+(r.points[1][1]-r.points[0][1])/2];let u,y;if(["start","both"].includes(l)){const g=Se({point:r.points[0],origin:d,rotation:-p});u=Se({point:[g[0],g[1]+o],origin:d,rotation:p})}else u=[...r.points[0]];if(["end","both"].includes(l)){const g=Se({point:r.points[1],origin:d,rotation:-p});y=Se({point:[g[0],g[1]-o],origin:d,rotation:p})}else y=[...r.points[1]];return{points:[u,y]}})({line:e,size:10+2*(e.style?.lineWidth??0),direction:e.style?.lineArrow===1?"start":e.style?.lineArrow===2?"end":"both"});s=yt(c)}else s=yt(e);const i=Vs(e,t);return{...e,path:s,selection:Jt(s,e,i,t),arrows:n,style:{...e.style,lineCap:e.style?.lineArrow?"butt":"round"},computed:i}},Fi=Ct,Zs=(e,t,n)=>{const s=[Se({point:[0,0],rotation:t}),Se({point:[-(5+(n.lineWidth??0)),10+2*(n.lineWidth??0)],rotation:t}),Se({point:[5+(n.lineWidth??0),10+2*(n.lineWidth??0)],rotation:t})];return{points:[[e[0]+s[0][0],e[1]+s[0][1]],[e[0]+s[1][0],e[1]+s[1][1]],[e[0]+s[2][0],e[1]+s[2][1]]],style:{...n,fillColor:n.strokeColor,strokeColor:"transparent"}}},Ts=(e,t)=>He(e,_t,t),wt=(e,t)=>{const n=Ts(e,t);return{...e,selection:st(void 0,n,t),computed:n}},Oi=wt,sn=(e,t,n,s,i)=>{const[a,c]=((r,o,l,p,d=!1)=>{if(!(r&&o&&p&&l))return[Kn,Kn];const u=r/o;if(u>l/p){const g=d?l:Math.min(r,l);return[g,g/u]}const y=d?p:Math.min(o,p);return[y*u,y]})(e.width,e.height,n,s,!0);return wt({toolId:Nt.id,type:"picture",id:le("picture_"),x:-i.canvasOffset[0]+i.canvasSize.realWidth/i.canvasZoom/2-a/2,y:-i.canvasOffset[1]+i.canvasSize.realHeight/i.canvasZoom/2-c/2,width:a,height:c,src:t,img:e},i)},Bi=(e,t,n,s)=>new Promise((i,a)=>{const c=new Image;c.onerror=()=>{a(new Error("Some images could not be loaded"))},setTimeout(()=>{a(new Error("Timeout while loading images"))},4e3),e instanceof File?((r,o,l,p,d,u)=>{Is(l)?l.text().then(y=>{const g=Rs(y);r.onload=async()=>{URL.revokeObjectURL(r.src);const b=sn(r,y,p,d,u);o(b)},r.src=g}):(r.onload=async()=>{URL.revokeObjectURL(r.src);const y=sn(r,r.src,p,d,u);o(y)},r.src=URL.createObjectURL(l))})(c,i,e,t,n,s):((r,o,l,p,d,u)=>{r.onload=()=>{URL.revokeObjectURL(r.src);const y=sn(r,l,p,d,u);o(y)},Ds(l).then(y=>{r.src=y}).catch(()=>{r.src=""})})(c,i,e,t,n,s)}),an=["Texte"],on=(e,t)=>He(e,Yi,t),Mt=(e,t)=>{const n=on(e,t);return{...e,selection:st(void 0,n,t),computed:n}},$i=Mt,rn=(e,t,n,s,i,a=pt)=>{e.font=`${i?"italic":""} ${s?"bold":""} 1px ${a}`;const c=t.map(r=>n/e.measureText(r).width);return Math.min(...c)||36},Yi=(e,t)=>({x:e.x-t.selectionPadding,width:e.width+2*t.selectionPadding,y:e.y-t.selectionPadding,height:e.height+2*t.selectionPadding}),Ui=(e,t,n,s)=>{const i={...t,value:n},a=((y,g,b,P,L,w=pt)=>{y.font=`${L?"italic":""} ${P?"bold":""} ${b}px ${w}`;const k=g.map(f=>y.measureText(f).width);return Math.max(...k)||20})(e,i.value,i.fontSize,i.style?.fontBold??!1,i.style?.fontItalic??!1,i.style?.fontFamily),c=i.fontSize*i.value.length,r={...i,width:a,height:c},{center:o}=on(r,s),[l,p]=hs([1,1],t.computed.center,t),[d,u]=hs([1,1],o,r,[!1,!1]);return{...r,x:r.x-(d-l),y:r.y-(u-p)}},Hs=(e,t,n,s)=>{const i=[U(n[0],s),U(n[1],s)];switch(t.type){case"brush":return((a,c,r)=>nt({toolId:a.id,type:a.type,id:le(`${a.type}_`),points:[[c]],scaleX:1,scaleY:1,style:{opacity:a.settings.opacity.default,strokeColor:a.settings.strokeColor.default,lineWidth:a.settings.lineWidth.default,lineDash:a.settings.lineDash.default}},r))(t,i,s);case"line":return((a,c,r)=>{const o={toolId:a.id,type:a.type,id:le(`${a.type}_`),points:[c,c],style:{opacity:a.settings.opacity.default,strokeColor:a.settings.strokeColor.default,lineWidth:a.settings.lineWidth.default,lineDash:a.settings.lineDash.default,lineArrow:a.settings.lineArrow.default}};return Ct(o,r)})(t,i,s);case"polygon":return((a,c,r)=>lt({toolId:a.id,type:a.type,id:le(`${a.type}_`),points:[c],style:{opacity:a.settings.opacity.default,fillColor:a.settings.fillColor.default,strokeColor:a.settings.strokeColor.default,lineWidth:a.settings.lineWidth.default,lineDash:a.settings.lineDash.default,closedPoints:a.settings.closedPoints.default}},r))(t,i,s);case"curve":return((a,c,r)=>ct({toolId:a.id,type:a.type,id:le(`${a.type}_`),points:[c],style:{opacity:a.settings.opacity.default,fillColor:a.settings.fillColor.default,strokeColor:a.settings.strokeColor.default,lineWidth:a.settings.lineWidth.default,lineDash:a.settings.lineDash.default,closedPoints:a.settings.closedPoints.default}},r))(t,i,s);case"rect":case"square":return us(t,i,s);case"text":return((a,c,r,o)=>{const l=rn(a,an,150,c.settings?.fontBold.default??!1,c.settings?.fontItalic.default??!1,c.settings.fontFamily.default),p=l*(an.length||1);return Mt({toolId:c.id,type:c.type,id:le(`${c.type}_`),x:r[0]-150,y:r[1]-p,value:an,fontSize:l,width:150,height:p,style:{opacity:c.settings.opacity.default,strokeColor:c.settings.strokeColor.default,fontFamily:c.settings.fontFamily.default,fontItalic:c.settings.fontItalic.default,fontBold:c.settings.fontBold.default}},o)})(e,t,i,s);case"ellipse":return((a,c,r)=>Qt({toolId:a.id,type:a.type,id:le(`${a.type}_`),x:c[0],y:c[1],radiusX:0,radiusY:0,style:{opacity:a.settings.opacity.default,fillColor:a.settings.fillColor.default,strokeColor:a.settings.strokeColor.default,lineWidth:a.settings.lineWidth.default,lineDash:a.settings.lineDash.default}},r))(t,i,s);case"circle":return((a,c,r)=>bt({toolId:a.id,type:a.type,id:le(`${a.type}_`),x:c[0],y:c[1],radius:0,style:{opacity:a.settings.opacity.default,fillColor:a.settings.fillColor.default,strokeColor:a.settings.strokeColor.default,lineWidth:a.settings.lineWidth.default,lineDash:a.settings.lineDash.default}},r))(t,i,s)}},zs=(e,t)=>{switch(t.type){case"brush":((n,s)=>{s.points.length<1||!s.path||n.globalAlpha!==0&&s.style?.strokeColor!=="transparent"&&n.globalAlpha!==0&&n.stroke(s.path)})(e,t);break;case"text":((n,s)=>{if(n.globalAlpha!==0&&s.style?.strokeColor&&s.style.strokeColor!=="transparent"){n.font=`${s.style?.fontItalic?"italic":""} ${s.style?.fontBold?"bold":""} ${s.fontSize}px ${s.style?.fontFamily??pt}`,n.textBaseline="top",n.fillStyle=s.style.strokeColor;for(let i=0;i<s.value.length;i++)n.fillText(s.value[i],s.x,s.y+i*s.fontSize,s.width)}})(e,t);break;case"line":((n,s)=>{if(n.globalAlpha!==0&&s.path){s.style?.fillColor!=="transparent"&&n.fill(s.path),s.style?.strokeColor!=="transparent"&&n.stroke(s.path);for(const i of s.arrows??[])ye(n,i.style),Ni(n,i)}})(e,t);break;case"polygon":((n,s)=>{s.path&&n.globalAlpha!==0&&(s.style?.fillColor!=="transparent"&&n.fill(s.path),s.style?.strokeColor!=="transparent"&&n.stroke(s.path))})(e,t);break;case"curve":((n,s)=>{s.path&&n.globalAlpha!==0&&(s.style?.fillColor!=="transparent"&&n.fill(s.path),s.style?.strokeColor!=="transparent"&&n.stroke(s.path))})(e,t);break;case"circle":((n,s)=>{n.globalAlpha!==0&&s.path&&(s.style?.fillColor!=="transparent"&&n.fill(s.path),s.style?.strokeColor!=="transparent"&&n.stroke(s.path))})(e,t);break;case"ellipse":((n,s)=>{n.globalAlpha!==0&&s.path&&(s.style?.fillColor!=="transparent"&&n.fill(s.path),s.style?.strokeColor!=="transparent"&&n.stroke(s.path))})(e,t);break;case"rect":case"square":ki(e,t);break;case"picture":((n,s)=>{n.globalAlpha!==0&&(n.beginPath(),n.drawImage(s.img,s.x,s.y,s.width,s.height))})(e,t)}},As=(e,t,n)=>{if(t.visible===!1)return;if(((i,a)=>{const c=(r=>{const{canvasSize:{width:o,height:l,scaleRatioWithNoZoom:p},canvasZoom:d,canvasOffset:u}=r;return{x:-u[0],y:-u[1],width:o/d/p,height:l/d/p}})(a);return!!Kt(i.computed.boundingBox,c)})(t,n)){if(vt(e,n,t.rotation,t.computed.center),ye(e,t.style),e.globalAlpha!==1)return((i,a)=>{const c=document.createElement("canvas"),r=c.getContext("2d");if(!r)throw new Error("No context found for canvas");const{outerBorders:o}=a.computed,l={width:2*o.width,height:2*o.height};c.width=l.width,c.height=l.height,r.translate(l.width/4-o.x,l.height/4-o.y),ye(r,{...a.style,opacity:100}),zs(r,a),i.drawImage(c,o.x-l.width/4,o.y-l.height/4)})(e,t),void e.restore();zs(e,t),e.restore()}},Xi=(e,t,n,s,i,a,c)=>{const r=i[0]-s[0],o=i[1]-s[1],l=i[0]-t[0],p=i[1]-t[1],d={...e,rotation:Si((n.rotation??0)+Math.atan2(p,l)-Math.atan2(o,r),a,c)};return{...d,computed:qi(d,a)}},Gi=(e,t,n,s,i,a,c,r)=>{switch(s.type){case"line":return((o,l,p,d)=>{const u=[U(o[0],d),U(o[1],d)],y=Le(u,l.rotation??0,l.computed.center),g=be(["points",p.anchor],y,l);return Ct(g,d)})(n,s,i,a);case"polygon":return((o,l,p,d)=>{const u=[U(o[0],d),U(o[1],d)],y=Le(u,l.rotation??0,l.computed.center),g=be(["points",p.anchor],y,l);return lt(g,d)})(n,s,i,a);case"curve":return((o,l,p,d)=>{const u=[U(o[0],d),U(o[1],d)],y=l.computed.center,g=Le(u,l.rotation??0,y),b=be(["points",p.anchor],g,l);return ct(b,d)})(n,s,i,a);case"brush":return((o,l,p,d,u,y)=>{const g=ns({...l,scaleX:1,scaleY:1},d),b=l.computed.borders,{borderX:P,borderHeight:L,borderY:w,borderWidth:k}=it(o,l,p,d,u,y),f=Math.max(0,g.width-2*d.selectionPadding),x=Math.max(0,g.height-2*d.selectionPadding),Z=Math.max(0,k-2*d.selectionPadding),R=Math.max(0,L-2*d.selectionPadding),T=f?Z/f:1,S=x?R/x:1;if(!f||!x)return l;const j=We(P-b.x),I=We(w-b.y);return nt({...l,points:l.points.map(A=>A.map(([E,W])=>[E+j,W+I])),scaleX:T,scaleY:S},d)})(n,s,i,a,c,r);case"circle":return((o,l,p,d,u)=>{const{borderX:y,borderHeight:g,borderY:b,borderWidth:P}=it(o,l,p,d,!0,u);return bt({...l,radius:Math.max(0,P/2-d.selectionPadding),x:y+P/2,y:b+g/2},d)})(n,s,i,a,r);case"ellipse":return((o,l,p,d,u=!1,y=!1)=>{const{borderX:g,borderHeight:b,borderY:P,borderWidth:L}=it(o,l,p,d,u,y);return Qt({...l,radiusX:Math.max(0,L/2-d.selectionPadding),radiusY:Math.max(0,b/2-d.selectionPadding),x:g+L/2,y:P+b/2},d)})(n,s,i,a,c,r);case"rect":case"square":return((o,l,p,d,u=!1,y=!1)=>{const{borderX:g,borderHeight:b,borderY:P,borderWidth:L}=it(o,l,p,d,u,y);return St({...l,width:Math.max(0,L-2*d.selectionPadding),height:Math.max(0,b-2*d.selectionPadding),x:g+d.selectionPadding,y:P+d.selectionPadding},d)})(n,s,i,a,t.type==="square"||c,r);case"text":return((o,l,p,d,u,y)=>{const{borderX:g,borderHeight:b,borderY:P,borderWidth:L}=it(l,p,d,u,!0,y),w=Mt({...p,width:Math.max(0,L-2*u.selectionPadding),height:Math.max(0,b-2*u.selectionPadding),x:g+u.selectionPadding,y:P+u.selectionPadding},u);return{...w,fontSize:rn(o,w.value,w.width,w.style?.fontBold??!1,w.style?.fontItalic??!1,w.style?.fontFamily)}})(e,n,s,i,a,r);case"picture":return((o,l,p,d,u)=>{const{borderX:y,borderHeight:g,borderY:b,borderWidth:P}=it(o,l,p,d,!0,u);return wt({...l,width:Math.max(0,P-2*d.selectionPadding),height:Math.max(0,g-2*d.selectionPadding),x:y+d.selectionPadding,y:b+d.selectionPadding},d)})(n,s,i,a,r);default:return s}},ln=(e,t,n,s,i)=>{switch(t.type){case"rect":case"square":return((a,c,r,o,l)=>{const p=Re([a[0]-r[0],a[1]-r[1]],l);return St({...c,x:U(c.x+p[0],o),y:U(c.y+p[1],o)},o)})(e,t,n,s,i);case"ellipse":return((a,c,r,o,l)=>{const p=Re([a[0]-r[0],a[1]-r[1]],l);return Qt({...c,x:U(c.x+p[0],o),y:U(c.y+p[1],o)},o)})(e,t,n,s,i);case"circle":return((a,c,r,o,l)=>{const p=Re([a[0]-r[0],a[1]-r[1]],l);return bt({...c,x:U(c.x+p[0],o),y:U(c.y+p[1],o)},o)})(e,t,n,s,i);case"picture":return((a,c,r,o,l)=>{const p=Re([a[0]-r[0],a[1]-r[1]],l);return wt({...c,x:U(c.x+p[0],o),y:U(c.y+p[1],o)},o)})(e,t,n,s,i);case"text":return((a,c,r,o,l)=>{const p=Re([a[0]-r[0],a[1]-r[1]],l);return Mt({...c,x:U(c.x+p[0],o),y:U(c.y+p[1],o)},o)})(e,t,n,s,i);case"line":return((a,c,r,o,l)=>{const p=Re([a[0]-r[0],a[1]-r[1]],l);return Ct({...c,points:c.points.map(([d,u])=>[U(d+p[0],o),U(u+p[1],o)])},o)})(e,t,n,s,i);case"polygon":return((a,c,r,o,l)=>{const p=Re([a[0]-r[0],a[1]-r[1]],l),d=c.computed.borders;return lt({...c,points:c.points.map(([u,y])=>o.gridGap?[u+U(d.x+p[0],o)-d.x,y+U(d.y+p[1],o)-d.y]:[U(u+a[0]-r[0],o),U(y+a[1]-r[1],o)])},o)})(e,t,n,s,i);case"curve":return((a,c,r,o,l)=>{const p=c.computed.borders,d=Re([a[0]-r[0],a[1]-r[1]],l);return ct({...c,points:c.points.map(([u,y])=>o.gridGap?[u+U(p.x+d[0],o)-p.x,y+U(p.y+d[1],o)-p.y]:[U(u+d[0],o),U(y+d[1],o)])},o)})(e,t,n,s,i);case"brush":return((a,c,r,o,l)=>{const p=c.computed.borders,d=Re([a[0]-r[0],a[1]-r[1]],l),u=o.gridGap?U(p.x+d[0],o)-p.x:d[0],y=o.gridGap?U(p.y+d[1],o)-p.y:d[1];return nt({...c,points:c.points.map(g=>g.map(([b,P])=>[b+u,P+y]))},o)})(e,t,n,s,i);default:return t}},dt=(e,t)=>{switch(e.type){case"rect":case"square":return Mi(e,t);case"ellipse":return Ii(e,t);case"circle":return Zi(e,t);case"picture":return Oi(e,t);case"text":return $i(e,t);case"line":return Fi(e,t);case"polygon":return Ti(e,t);case"curve":return Ai(e,t);case"brush":return yi(e,t);default:return e}},qi=(e,t)=>{switch(e.type){case"rect":case"square":return ds(e,t);case"ellipse":return js(e,t);case"circle":return Cs(e,t);case"picture":return Ts(e,t);case"text":return on(e,t);case"line":return Vs(e,t);case"polygon":return ws(e,t);case"curve":return ks(e,t);case"brush":return ss(e,t)}},Es=({ctx:e,shape:t,settings:n,selectionWidth:s,selectionColor:i,hoverMode:a,withAnchors:c=!0})=>{const{center:r}=t.computed;switch(n.debug&&((o,l,p,d)=>{l.selection&&d.debug&&(o.save(),o.scale(d.canvasSize.scaleRatio,d.canvasSize.scaleRatio),o.translate(d.canvasOffset[0],d.canvasOffset[1]),ye(o,{fillColor:"transparent",strokeColor:"green",lineWidth:p/d.canvasSize.scaleRatio}),o.strokeRect(l.computed.boundingBox.x,l.computed.boundingBox.y,l.computed.boundingBox.width,l.computed.boundingBox.height),o.restore())})(e,t,s,n),vt(e,n,t.rotation,r),t.type){case"rect":case"square":case"circle":case"ellipse":case"picture":case"text":case"brush":((o,l,p,d,u,y)=>{if(l.selection&&(u.debug&&(ye(o,{fillColor:"transparent",strokeColor:"red",lineWidth:d/u.canvasSize.scaleRatio}),o.strokeRect(l.computed.outerBorders.x,l.computed.outerBorders.y,l.computed.outerBorders.width,l.computed.outerBorders.height)),ye(o,{fillColor:"transparent",strokeColor:p,lineWidth:d/u.canvasSize.scaleRatio}),l.selection.shapePath?o.stroke(l.selection.shapePath):o.stroke(l.selection.border),y&&!l.locked)){l.selection.shapePath&&o.stroke(l.selection.border),l.selection.line&&o.stroke(l.selection.line),ye(o,{fillColor:"rgb(255,255,255)",strokeColor:"rgb(150,150,150)",lineWidth:2/u.canvasSize.scaleRatio,shadowColor:p,shadowBlur:0});for(const g of l.selection.anchors)o.fill(g),o.stroke(g)}})(e,t,i,s,n,c);break;case"group":((o,l,p,d,u,y)=>{if(l.selection){if(u.debug&&(ye(o,{fillColor:"transparent",strokeColor:"red",lineWidth:d/u.canvasSize.scaleRatio}),o.strokeRect(l.computed.outerBorders.x,l.computed.outerBorders.y,l.computed.outerBorders.width,l.computed.outerBorders.height)),ye(o,{fillColor:"transparent",strokeColor:p,lineWidth:d/u.canvasSize.scaleRatio}),y&&!l.locked){o.stroke(l.selection.border),l.selection.line&&o.stroke(l.selection.line),ye(o,{fillColor:"rgb(255,255,255)",strokeColor:"rgb(150,150,150)",lineWidth:2/u.canvasSize.scaleRatio});for(const g of l.selection.anchors)o.fill(g),o.stroke(g)}l.shapes.forEach(g=>{o.restore(),ye(o,{fillColor:"transparent",strokeColor:p,lineWidth:d/u.canvasSize.scaleRatio}),vt(o,u,g.rotation,g.computed.center),g.selection?.shapePath&&o.stroke(g.selection.shapePath)})}})(e,t,i,s,n,c);break;case"polygon":case"line":case"curve":(({ctx:o,shape:l,withAnchors:p,selectionWidth:d,selectionColor:u,hoverMode:y,settings:g})=>{if(l.selection&&(g.debug&&(ye(o,{fillColor:"transparent",strokeColor:"red",lineWidth:d/g.canvasSize.scaleRatio}),o.strokeRect(l.computed.outerBorders.x,l.computed.outerBorders.y,l.computed.outerBorders.width,l.computed.outerBorders.height)),ye(o,{fillColor:"transparent",strokeColor:u,lineWidth:d/g.canvasSize.scaleRatio}),l.selection.shapePath&&o.stroke(l.selection.shapePath),p&&!l.locked)){ye(o,{fillColor:"rgb(255,255,255)",strokeColor:"rgb(150,150,150)",lineWidth:2/g.canvasSize.scaleRatio,shadowColor:u,shadowBlur:0});for(let b=0;b<l.selection.anchors.length;b++){const P=l.selection.anchors[b];y.mode==="resize"&&y.anchor===b?(o.shadowBlur=10,o.fill(P),o.shadowBlur=0):o.fill(P),o.stroke(P)}}})({ctx:e,shape:t,withAnchors:c,selectionWidth:s,selectionColor:i,hoverMode:a,settings:n})}e.restore()},_i=({ctx:e,selectionFrame:t,settings:n})=>{vt(e,n),((s,i,a)=>{ye(s,{fillColor:"rgba(170,170,170, 0.1)",strokeColor:"rgb(170,170,170)",lineWidth:1/a.canvasSize.scaleRatio}),s.fillRect(i[0][0],i[0][1],i[1][0]-i[0][0],i[1][1]-i[0][1]),s.strokeRect(i[0][0],i[0][1],i[1][0]-i[0][0],i[1][1]-i[0][1])})(e,t.frame,n),e.restore()},cn=e=>e.filter(t=>t!=null),Rs=e=>{const t=new DOMParser().parseFromString(e,"text/xml").getElementsByTagName("svg")[0];if(!t)return"";const n=t.getAttribute("width"),s=t.getAttribute("height");let i;if(n||s)i=e;else{const c=t.getAttribute("viewBox")??"0 0 300 300",[,,r,o]=c.split(" ");t.setAttribute("width",r??"300"),t.setAttribute("height",o??"300"),i=new XMLSerializer().serializeToString(t)}const a=new Blob([i],{type:"image/svg+xml"});return URL.createObjectURL(a)},Is=e=>(e instanceof File?e.name:e).includes(".svg"),Ds=e=>Is(e)?fetch(e).then(t=>t.text()).then(t=>Rs(t)):fetch(e).then(t=>t.blob()).then(t=>URL.createObjectURL(t)),Ns=(e,t)=>{const n=document.createElement("a");n.href=e,n.download=t,document.body.appendChild(n),n.click(),document.body.removeChild(n)},Ki=e=>e.src.includes("<svg")?e.src:(t=>{const n=document.createElement("canvas");n.width=t.width,n.height=t.height;const s=n.getContext("2d");return s?(s.drawImage(t,0,0),n.toDataURL("image/png")):""})(e.img),dn=({shapes:e,settings:t})=>{const n=document.createElement("canvas"),s=n.getContext("2d");if(!s)throw new Error("No context found for canvas");const{realHeight:i,realWidth:a}=t.canvasSize;n.width=a,n.height=i,s.clearRect(0,0,a,i),ts(s);for(let c=e.length-1;c>=0;c--)As(s,e[c],t);return n.toDataURL("image/png")},Ws=({shapes:e,settings:t,view:n})=>{if(n==="fitToShapes"&&!e.length)throw new Error("No image found to export");if(n==="fitToShapes"){const i=Math.min(...e.map(l=>l.computed.boundingBox.x)),a=Math.max(...e.map(l=>l.computed.boundingBox.x+l.computed.boundingBox.width)),c=Math.min(...e.map(l=>l.computed.boundingBox.y)),r=Math.max(...e.map(l=>l.computed.boundingBox.y+l.computed.boundingBox.height)),o={...t,canvasOffset:[-i,-c],canvasZoom:1,canvasSize:{realWidth:a-i,realHeight:r-c,width:a-i,height:r-c,scaleRatio:1,scaleRatioWithNoZoom:1}};return dn({shapes:e,settings:o})}if(n==="defaultView"){const i={...t,canvasOffset:[0,0],canvasZoom:1,canvasSize:{...t.canvasSize,width:t.canvasSize.realWidth,height:t.canvasSize.realHeight,scaleRatio:1,scaleRatioWithNoZoom:1}};return dn({shapes:e,settings:i})}const s={...t,canvasSize:{...t.canvasSize,width:t.canvasSize.realWidth,height:t.canvasSize.realHeight,scaleRatio:t.canvasZoom,scaleRatioWithNoZoom:1}};return dn({shapes:e,settings:s})},Ji=(e,t,n)=>{return i=un(e,t,n),`data:text/plain;charset=utf-8,${encodeURIComponent(JSON.stringify(i))}`;var i},ea=e=>{const t=["img","id","selection","path","arrows","tempPoint","computed"];return e.map(n=>n.type!=="picture"||n.src.startsWith("http")?Bt(t,n):Bt(t,{...n,src:Ki(n)}))},un=(e,t,n)=>({shapes:ea(e),config:{width:t,height:n}}),Fs=(e,t)=>dt({...e,id:le(`${e.type}_`)},t),ta=(e,t,n,s)=>{const i=v.useRef([]),a=v.useRef({dataChanged:[]}),[c,r]=v.useState(void 0),[o,l]=v.useState(void 0),[p,d]=v.useState(void 0),[u,y]=v.useState({states:[{shapes:[],selectedShape:void 0,source:"remote"}],cursor:0}),g=u.cursor>0,b=u.cursor<u.states.length-1,P=i.current.length>0,L=v.useCallback(()=>{y(m=>Jn(m.states[m.cursor]?.shapes,i.current)?m:{states:[...m.states.slice(0,m.cursor+1),{shapes:i.current,selectedShape:o,source:"user"}],cursor:m.cursor+1})},[o]),w=v.useCallback(m=>{i.current=[...m,...i.current]},[]),k=v.useCallback(m=>{i.current=i.current.flatMap(C=>{const Q=m.find(H=>H.id===C.id);return Q?[{...Q,id:le(`${C.type}_`)},C]:C})},[]),f=v.useCallback((m,C,Q,H)=>{if(m.target&&"className"in m.target&&![Gn,qn].includes(m.target.className)||!H)return void d(void 0);const M=i.current.find(F=>X(o)?.map(D=>D.id).includes(F.id)?!!rt(C,F,Q,e):!!Ss(C,F,Q,e));d(M)},[e,o]),x=v.useCallback(async(m,C=300,Q=300)=>{const H=await Bi(m,C,Q,e);return w([H]),L(),H},[w,L,e]),Z=v.useCallback((m,C=!1)=>{i.current=i.current.map(Q=>m.find(H=>H.id===Q.id)??Q),l(Q=>Q&&xe(X(Q).map(H=>m.find(M=>M.id===H.id)??H),e)),C&&L()},[L,e]),R=v.useCallback(m=>{const C=m.map(Q=>Bt(["chosen"],Q));i.current=C,L()},[L]),T=v.useCallback(m=>{const C=new Set(m.map(Q=>Q.id));l(Q=>{const H=X(Q).map(M=>M.id);return H&&C.size&&H.find(M=>C.has(M))?void 0:Q}),i.current=i.current.filter(Q=>!C?.has(Q.id)),L()},[L]),S=v.useCallback(m=>{y(C=>{const Q=m(C);return i.current=C.states[Q]?.shapes??[],l(C.states[Q]?.selectedShape),be("cursor",Q,C)})},[]),j=v.useCallback(()=>{S(m=>Math.max(0,m.cursor-1))},[S]),I=v.useCallback(()=>{S(m=>Math.min(m.states.length-1,m.cursor+1))},[S]),A=v.useCallback((m,C)=>{l(void 0),i.current=m,y(Q=>C.clearHistory?{states:[{shapes:m,selectedShape:void 0,source:C.source}],cursor:0}:{states:[...Q.states.slice(0,Q.cursor+1),{shapes:m,selectedShape:void 0,source:C.source}],cursor:Q.cursor+1})},[]),E=v.useCallback((m,C)=>{const Q=i.current,H=Q.findIndex(z=>z.id===m),M=Q.findIndex(z=>z.id===C);var F,D,O;R((F=Q,O=M,(D=H)<0||O<0||D>F.length-1||O>F.length-1?F:D<O?[...F.slice(0,D),...F.slice(D+1,O+1),F[D],...F.slice(O+1,F.length)]:[...F.slice(0,O),F[D],...F.slice(O,D),...F.slice(D+1,F.length)]))},[R]),W=v.useCallback(m=>{const C=i.current,Q=new Set(m.map(M=>M.id)),H=C.map(M=>Q.has(M.id)?be("visible",M.visible===!1,M):M);l(gs(M=>be("visible",M.visible===!1,M),e)),R(H)},[R,e]),B=v.useCallback(m=>{const C=i.current,Q=new Set(m.map(M=>M.id)),H=C.map(M=>Q.has(M.id)?be("locked",!M.locked,M):M);l(gs(M=>be("locked",!M.locked,M),e)),R(H)},[R,e]),$=v.useCallback((m,C)=>{a.current.hasOwnProperty(m)&&(a.current[m]=[...a.current[m],C])},[]),G=v.useCallback((m,C)=>{if(a.current.hasOwnProperty(m))if(C){const Q=a.current[m].indexOf(C);a.current[m]=[...a.current[m].slice(0,Q),...a.current[m].slice(Q+1)]}else a.current[m]=[]},[]);v.useEffect(()=>{const m=u.states[u.cursor],C=un(m.shapes,t,n);for(const Q of a.current.dataChanged)Q(C,m.source)},[t,n,u]),v.useEffect(()=>{i.current=i.current.map(m=>dt(m,e)),l(m=>m===void 0?void 0:xe(X(m).map(C=>dt(C,e)),e))},[e]);const V=v.useCallback((m,C)=>{r(Q=>{const H=[Q?.frame[0]??[C[0],C[1]],[C[0],C[1]]],M=i.current.filter(D=>((O,z,te,re)=>{const{selectionPadding:se}=re,{center:q,borders:N}=z.computed,ie=Le(te[0],z.rotation??0,q),ne=Le(te[1],z.rotation??0,q),ge=Math.round(Math.min(ie[0],ne[0])-se/2),we=Math.round(Math.max(ie[0],ne[0])+se),ce=Math.round(Math.min(ie[1],ne[1])-se/2),K={x:ge,y:ce,width:we-ge,height:Math.round(Math.max(ie[1],ne[1])+se)-ce},de=Kt(N,K);if(!de)return!1;if(N.width<=1||N.height<=1||!("path"in z)||!z.path)return!0;if(O.lineWidth=(z.style?.lineWidth??0)+10,z.type==="brush"){const fe=z.points.flat(),ze=Math.min(...fe.map(ee=>ee[0])),Ve=Math.min(...fe.map(ee=>ee[1]));for(const ee of z.points){if(ee.length<1)break;if(ee.length<2){const ue=je(ee[0],ze,Ve,z.scaleX,z.scaleY);if(is(de,{x:ue[0],y:ue[1],radius:(z.style?.lineWidth??1)/2}))return!0}for(let ue=0;ue<ee.length-1;ue++){const Ie=je(ee[ue],ze,Ve,z.scaleX,z.scaleY),De=je(ee[ue+1],ze,Ve,z.scaleX,z.scaleY),Me=Kt({x:Math.min(Ie[0],De[0]),y:Math.min(Ie[1],De[1]),width:Math.abs(Ie[0]-De[0]),height:Math.abs(Ie[1]-De[1])},K);if(Me){const Xe=new Path2D;if(Xe.moveTo(...Ie),Xe.lineTo(...De),xs({ctx:O,path:Xe,rect:Me,offset:10,checkFill:!1}))return!0}}}return!1}const Y=!(!z.style?.fillColor||z.style?.fillColor==="transparent");return xs({ctx:O,path:z.path,rect:de,offset:10,checkFill:Y})})(m,D,H,e)),F=xe(M,e);return l(s?xe(fs(Q?.oldSelection,M),e):F),{oldSelection:Q?.oldSelection,frame:H}})},[e,s]);return{registerEvent:$,unregisterEvent:G,shapesRef:i,selectedShape:o,hoveredShape:p,selectionFrame:c,setSelectionFrame:r,refreshSelectedShapes:V,addShapes:w,duplicateShapes:k,addPictureShape:x,moveShapes:E,saveShapes:L,setSelectedShape:l,refreshHoveredShape:f,toggleShapeVisibility:W,toggleShapeLock:B,removeShape:T,updateShape:Z,backwardShape:j,forwardShape:I,clearShapes:A,canGoBackward:g,canGoForward:b,canClear:P}},Os=e=>{const t=[e[0].clientX,e[0].clientY],n=[e[1].clientX,e[1].clientY];var s,i;return{diff:rs(t,n),center:(i=n,[((s=t)[0]+i[0])/2,(s[1]+i[1])/2])}},na=({canvasElt:e,canvasTransformation:t,canvasSize:n,size:s,setCanvasTransformation:i})=>{const a=v.useRef([]),[c,r]=v.useState(a.current.length>0),o=v.useRef(null),l=v.useRef(t);l.current=t;const p=v.useCallback(({startDiff:d,startZoom:u,startCenter:y,startOffset:g,currentDiff:b,currentCenter:P,isMoving:L,isZooming:w})=>{if(!e||!b||!d)return;const k=(({canvasBoundingRect:f,canvasSize:x,size:Z,startDiff:R,startZoom:T,startCenter:S,startOffset:j,currentDiff:I,currentCenter:A,isMoving:E,isZooming:W})=>{const B=W?Te(I/R*T,Qe[0],Qe[Qe.length-1]):T,$=E?[j[0]+(A[0]-S[0])*(x.width/f.width)/x.scaleRatio/T,j[1]+(A[1]-S[1])*(x.height/f.height)/x.scaleRatio/T]:[j[0],j[1]],G=[(A[0]-f.left)/x.scaleRatio,(A[1]-f.top)/x.scaleRatio];return tn({size:Z,canvasSize:x,currentOffset:$,currentZoom:T,zoom:B,centerPoint:G})})({canvasBoundingRect:e.getBoundingClientRect(),canvasSize:n,size:s,startDiff:d,startZoom:u,startCenter:y,startOffset:g,currentDiff:b,currentCenter:P,isMoving:L,isZooming:w});i(k)},[e,n,s,i]);v.useEffect(()=>{if(!e)return;const d=u=>{if(a.current=[...a.current,u],r(a.current.length>0),a.current.length===2){u.stopPropagation();const{diff:y,center:g}=Os(a.current);o.current={startDiff:y,startCenter:g,startZoom:l.current.zoom,startOffset:l.current.offset,isMoving:!1,isZooming:!1}}};return e.addEventListener("pointerdown",d),()=>{e.removeEventListener("pointerdown",d)}},[e]),v.useEffect(()=>{if(!c)return;const d=y=>{const g=a.current.findIndex(b=>b.pointerId===y.pointerId);if(g>-1&&(a.current[g]=y),a.current.length===2&&o.current){const{diff:b,center:P}=Os(a.current),L=o.current.isZooming||((k,f)=>Math.abs(k-f.startDiff)>30)(b,o.current),w=o.current.isMoving||L||((k,f)=>Math.abs(rs(k,f.startCenter))>10)(P,o.current);o.current={...o.current,isMoving:w,isZooming:L},p({...o.current,currentDiff:b,currentCenter:P})}},u=y=>{a.current=a.current.filter(g=>g.pointerId!==y.pointerId),r(a.current.length>0)};return document.addEventListener("pointermove",d),document.addEventListener("pointerup",u),document.addEventListener("pointerout",u),document.addEventListener("pointercancel",u),document.addEventListener("pointerleave",u),()=>{document.removeEventListener("pointermove",d),document.removeEventListener("pointerup",u),document.removeEventListener("pointerout",u),document.removeEventListener("pointercancel",u),document.removeEventListener("pointerleave",u)}},[c,p])},Bs={offset:[0,0],zoom:1},sa=({canvasSize:e,size:t,zoomEnabled:n,canvasElt:s})=>{const[i,a]=v.useState(Bs),c=v.useRef(0),r=v.useCallback(p=>{a(({zoom:d})=>en({zoom:d,size:t,canvasSize:e,newOffset:p}))},[e,t]),o=v.useCallback(p=>{a(({offset:d,zoom:u})=>(({size:y,canvasSize:g,currentOffset:b,currentZoom:P,action:L})=>{const w=L==="default"?Qe[4]:L==="zoom"?Qe[Te(Qe.length-1-Qe.slice(0).reverse().findIndex(f=>f<=P)+1,0,Qe.length-1)]:Qe[Te(Qe.findIndex(f=>f>=P)-1,0,Qe.length-1)],k=[g.realWidth/2,g.realHeight/2];return tn({size:y,canvasSize:g,currentOffset:b,currentZoom:P,zoom:w,centerPoint:k})})({size:t,canvasSize:e,currentOffset:d,currentZoom:u,action:p}))},[e,t]);na({canvasElt:s,canvasTransformation:i,canvasSize:e,size:t,setCanvasTransformation:a});const l=v.useCallback(()=>{a(Bs)},[]);return v.useEffect(()=>{if(!n||!s)return;const p=d=>{const u=d.ctrlKey,{deltaX:y,deltaY:g}=((w,k)=>{const f=Math.abs(w.deltaY)<50&&k<50,x=w.ctrlKey,Z=es()&&f&&x;switch(w.deltaMode){case WheelEvent.DOM_DELTA_LINE:return{deltaX:16*w.deltaX,deltaY:16*w.deltaY};case WheelEvent.DOM_DELTA_PAGE:return{deltaX:w.deltaX*window.innerHeight,deltaY:w.deltaY*window.innerHeight};default:return Z?{deltaX:5*w.deltaX,deltaY:5*w.deltaY}:{deltaX:w.deltaX,deltaY:w.deltaY}}})(d,d.timeStamp-c.current);if(c.current=d.timeStamp,u){d.preventDefault();const w=ms(d,s,e);return void a(({offset:k,zoom:f})=>(({size:x,canvasSize:Z,currentOffset:R,currentZoom:T,delta:S,centerPoint:j})=>{const I=Te(T*(1-S/1e3),Qe[0],Qe[Qe.length-1]);return tn({size:x,canvasSize:Z,currentOffset:R,currentZoom:T,zoom:I,centerPoint:j})})({size:t,canvasSize:e,currentOffset:k,currentZoom:f,delta:g,centerPoint:w}))}const b=d.shiftKey,[P,L]=b?[g,y]:[y,g];a(({offset:w,zoom:k})=>{const f=[w[0]-P/k,w[1]-L/k],x=en({zoom:k,size:t,canvasSize:e,newOffset:f});return x.offset[0]===w[0]&&x.offset[1]===w[1]||d.preventDefault(),x})};return s.addEventListener("wheel",p,{passive:!1}),()=>{s.removeEventListener("wheel",p)}},[s,t,e,n]),{setCanvasTransformation:a,setCanvasOffset:r,setCanvasZoom:o,resetZoom:l,canvasTransformation:i}},$s=(e,t=!1)=>{const n=(i,a)=>{if(Array.isArray(i))return a},s=e.map(i=>{if(typeof i!="object")return null;switch(i.type){case"brush":return Ze(n,zn,i);case"circle":return Ze(n,Nn,i);case"curve":return Ze(n,Rn,i);case"ellipse":return Ze(n,Wn,i);case"line":return Ze(n,An,i);case"polygon":return Ze(n,En,i);case"rect":return Ze(n,In,i);case"square":return Ze(n,Dn,i);case"text":return Ze(n,Fn,i)}return null});return cn(t?[...s,Nt]:s)},ia=({addShapes:e,drawCanvasRef:t,setActiveTool:n,refreshHoveredShape:s,shapes:i,selectionMode:a,activeTool:c,isInsideComponent:r,setCanvasOffset:o,selectedShape:l,canvasOffsetStartData:p,refreshSelectedShapes:d,setSelectedShape:u,setSelectionFrame:y,setCanvasOffsetStartData:g,updateSingleShape:b,duplicateShapes:P,saveShapes:L,setSelectionMode:w,setCanvasMoveAcceleration:k,settings:f,isShiftPressed:x,isAltPressed:Z,withFrameSelection:R,isSpacePressed:T})=>{const[S,j]=v.useState({mode:"default"}),{registerDoubleClickEvent:I,unRegisterDoubleClickEvent:A}=(()=>{const m=v.useRef(void 0),C=v.useRef(void 0),Q=H=>{const M=Date.now();m.current&&M<m.current+300&&C.current?.(H),m.current=Date.now()};return{registerDoubleClickEvent:(H,M)=>{C.current=M,H.addEventListener("click",Q),H.addEventListener("touchend",Q)},unRegisterDoubleClickEvent:H=>{H.removeEventListener("click",Q),H.removeEventListener("touchend",Q)}}})(),E=v.useRef(null);E.current=m=>((C,Q,H,M,F,D,O,z,te,re,se,q,N,ie,ne,ge,we)=>{if(ot(C)&&C.touches.length>1)return;const ce=Q.current?.getContext("2d");if(!ce)return;const K=at(C,Q.current,N);if(M.mode==="selectionFrame"){q(ce,K,N);const Y=ms(C,Q.current,N.canvasSize);return void we([Math.ceil(Te(Y[0]*N.canvasZoom<50?Y[0]*N.canvasZoom-50:Y[0]*N.canvasZoom>N.canvasSize.width/N.canvasSize.scaleRatioWithNoZoom-50?Y[0]*N.canvasZoom-(N.canvasSize.width/N.canvasSize.scaleRatioWithNoZoom-50):0,-100,100)/5/N.canvasZoom),Math.ceil(Te(Y[1]*N.canvasZoom<50?Y[1]*N.canvasZoom-50:Y[1]*N.canvasZoom>N.canvasSize.height/N.canvasSize.scaleRatioWithNoZoom-50?Y[1]*N.canvasZoom-(N.canvasSize.height/N.canvasSize.scaleRatioWithNoZoom-50):0,-100,100)/5/N.canvasZoom)])}if(D!==void 0)return void se([K[0]+N.canvasOffset[0]-D.start[0],K[1]+N.canvasOffset[1]-D.start[1]]);if(M.mode==="preview"){const Y=X(H)[0];if(Y?.type==="curve"){const fe=Ps(Y,K,N,!0);return void ge(xe([fe],N))}if(Y?.type==="polygon"){const fe=Ms(Y,K,N,!0);return void ge(xe([fe],N))}}const de=gt(K,N);if(ot(C)||z(C,ce,K,de),H===void 0||H.locked)O({mode:"default",outOfView:!de});else{if(M.mode==="default"||M.mode==="textedition"){if(!de)return void O({mode:"default"});O(rt(ce,H,K,N,!0)||{mode:"default"})}else{const Y=Q.current?.getContext("2d");if(!Y)return;const fe=xi(Y,H,K,M,N,ie,ne);te(X(fe))}M.mode==="translate"&&ne&&!M.hasBeenDuplicated&&(F({...M,hasBeenDuplicated:!0}),re(X(M.originalShape)))}})(m,t,l,a,w,p,j,s,b,P,o,d,f,x,Z,u,k),v.useEffect(()=>{if(r){const m=C=>E.current?.(C);return document.addEventListener("mousemove",m),document.addEventListener("touchmove",m),()=>{document.removeEventListener("mousemove",m),document.removeEventListener("touchmove",m)}}},[r]);const{isBrushShapeDoneOnMouseUp:W}=f,B=v.useRef(null);B.current=m=>{if(ot(m)&&m.touches.length>1)return;const C=t.current?.getContext("2d");if(!C)return;if("button"in m&&m.button===2)return u(void 0),n(Ee),w({mode:"default"}),void y(void 0);if(p)return void g(void 0);if(a.mode==="textedition"||a.mode==="preview")return;const Q=at(m,t.current,f);if(a.mode==="translate"&&Date.now()-a.dateStart<=500&&Q[0]===a.cursorStartPosition[0]&&Q[1]===a.cursorStartPosition[1]){if(!(m.ctrlKey||m.shiftKey||m.metaKey)){const{shape:H}=ps(C,i,Q,f,void 0,ot(m),R,!1);u(H)}return w({mode:"default"}),y(void 0),void L()}a.mode!=="default"&&(a.mode==="brush"&&W&&u(void 0),w({mode:"default"}),y(void 0),L())},v.useEffect(()=>{if(r){const m=C=>B.current?.(C);return document.addEventListener("mouseup",m),document.addEventListener("touchend",m),()=>{document.removeEventListener("mouseup",m),document.removeEventListener("touchend",m)}}},[r]);const $=!f.features.edition&&f.features.zoom,G=!f.features.edition&&!f.features.zoom,V=v.useRef(null);return V.current=(m,C,Q)=>{if(m.preventDefault(),ot(m)&&m.touches.length>1)return;const H=C?.getContext("2d");if(!H)return;C.focus();const M=at(m,t.current,f),F="button"in m&&m.button===1;if(!("button"in m&&m.button===2)){if(F||Q||c.type==="move")g({start:M,originalOffset:f.canvasOffset});else if(!$){if(!gt(M,f))return u(void 0),void w({mode:"default"});if(c.type==="selection"){const D=m.ctrlKey||m.shiftKey||m.metaKey,{shape:O,mode:z}=ps(H,i,M,f,l,ot(m),R,D);u(O),w(z),z.mode==="selectionFrame"&&y({oldSelection:O,frame:[[M[0],M[1]],[M[0],M[1]]]})}else if(Xn.some(D=>D===c.type)){const D=X(l)[0],O=t.current?.getContext("2d");if(!O)return;if(c.type==="brush"){if(D?.type==="brush"){const z=((te,re,se)=>{const q={...te,points:be(te.points.length,[[Math.round(re[0]),Math.round(re[1])]],te.points)};return nt(q,se)})(D,M,f);b([z])}else{const z=Hs(O,c,M,f);if(!z)return;e([z]),u(xe([z],f))}w({mode:"brush"})}else if(a.mode!=="preview"||D?.type!=="polygon"&&D?.type!=="curve"){if(c.type!=="picture"){const z=Hs(O,c,M,f);if(!z)return;e([z]);const te=xe([z],f);u(te),z.type==="polygon"||z.type==="curve"?w({mode:"preview"}):(n(Ee),w({mode:"resize",cursorStartPosition:[M[0]+f.selectionPadding,M[1]+f.selectionPadding],originalShape:te,anchor:z.type==="line"?0:[1,1]}))}}else{const z=D.type==="polygon"?Ms(D,M,f):Ps(D,M,f);u(xe([z],f)),b([z],!0)}}}}},v.useEffect(()=>{if(G)return;const m=t.current;if(!m)return;const C=Q=>V.current?.(Q,m,T);return m.addEventListener("mousedown",C,{passive:!1}),m.addEventListener("touchstart",C,{passive:!1}),()=>{m.removeEventListener("mousedown",C),m.removeEventListener("touchstart",C)}},[G,t,T]),v.useEffect(()=>{const m=t.current,C=t.current?.getContext("2d");if(!(!m||!C))return r?(I(m,Q=>{if(c.type==="selection"){if(X(l).length!==1)return;const H=X(l)[0];if(H?.type==="text"){const M=at(Q,t.current,f);return gt(M,f)?void(rt(C,l,M,f)&&w({mode:"textedition",defaultValue:H.value})):void 0}if(H?.type==="polygon"){const M=at(Q,t.current,f);if(!gt(M,f))return;const F=ys(C,H,M,f);return void(F&&b([Hi(H,F.lineIndex,M,f)]))}if(H?.type==="curve"){const M=at(Q,t.current,f);if(!gt(M,f))return;const F=((D,O,z,te,re=50)=>{if(O.locked||O.points.length<2)return!1;if(O.points.length<3)return ys(D,O,z,te,re);const{center:se}=O.computed,q=Le(z,O.rotation??0,se);D.lineWidth=(O.style?.lineWidth??0)+re/te.canvasZoom;const N=Gt(O,O.points),ie=new Path2D;ie.moveTo(...N[0]);for(let ne=1;ne<N.length-2;ne++){const ge=N[ne-1],we=N[ne],ce=N[ne+1],K=N[ne+2],{cp1:de,cp2:Y}=qt(ge,we,ce,K);if(ie.bezierCurveTo(de[0],de[1],Y[0],Y[1],ce[0],ce[1]),D.isPointInStroke(ie,q[0],q[1]))return{lineIndex:ne-1}}return!1})(C,H,M,f);return void(F&&b([Ei(H,F.lineIndex,M,f)]))}}}),()=>{A(m)}):void 0},[b,I,A,r,t,c,l,w,f]),{hoverMode:S}},Ys=e=>e.childNodes.length?Array.from(e.childNodes).map(t=>Ys(t)).join(""):e.nodeValue??"",aa=({disabled:e=!1,shape:t,defaultValue:n,updateValue:s,saveShapes:i,settings:a})=>{const c=v.useRef(null),r=v.useRef(i);v.useEffect(()=>{if(!c.current)return;const l=c.current,p=d=>{d.preventDefault();const u=d.clipboardData?.getData("text/plain");document.execCommand("insertText",!1,u)};l.addEventListener("paste",p),l.innerText="";for(const d of n){const u=document.createElement("div");d===""?u.innerHTML="<br/>":u.innerText=d,l.appendChild(u)}return l.focus(),()=>{l.removeEventListener("paste",p)}},[n]),v.useEffect(()=>{const l=r.current;return()=>{l()}},[]);const o=v.useMemo(()=>{const{borders:l,center:p}=t.computed;return Se({point:[l.x,l.y],rotation:-(t.rotation??0),origin:p})},[t]);return h.jsx("div",{className:"react-paint-editor-toolbox-edittextbox",ref:c,"data-fontbold":t.style?.fontBold??!1,"data-fontitalic":t.style?.fontItalic??!1,contentEditable:!e,onInput:l=>{const p=Array.from(l.target.childNodes).map(d=>Ys(d));s(p)},style:{"--react-paint-editor-toolbox-edittextbox-transform":`translate3D(${(o[0]+a.canvasOffset[0])*a.canvasSize.scaleRatio}px, ${(o[1]+a.canvasOffset[1])*a.canvasSize.scaleRatio}px, 0) rotate(${Ut(t.rotation??0)}deg)`,"--react-paint-editor-toolbox-edittextbox-fontsize":t.fontSize*a.canvasSize.scaleRatio+"px","--react-paint-editor-toolbox-edittextbox-padding":a.selectionPadding*a.canvasSize.scaleRatio+"px","--react-paint-editor-toolbox-edittextbox-color":t.style?.strokeColor??"inherit","--react-paint-editor-toolbox-edittextbox-opacity":(t.style?.opacity??100)/100,"--react-paint-editor-toolbox-edittextbox-fontfamily":t.style?.fontFamily??pt}})},oa=(e,t,n,s,i)=>{ts(e),((a,c)=>{const{canvasZoom:r,size:o,canvasSize:{width:l,height:p}}=c;if(o!=="fixed"||r>=1)return;a.fillStyle="#f5f5f5",a.fillRect(0,0,l,p);const d=bs(c);a.clearRect(d.x,d.y,d.width,d.height),Qs(a,c)})(e,n),((a,c)=>{const{canvasSize:{width:r,height:o},gridGap:l,canvasOffset:p,canvasSize:{scaleRatio:d}}=c;if(!l)return;a.strokeStyle="rgb(220,220,220)",a.lineWidth=1,a.save(),a.scale(d,d),a.beginPath();const u=p[0]%l,y=p[1]%l,g=Math.ceil(r/d/l)+2,b=Math.ceil(o/d/l)+2;for(let P=-5;P<g;P++)a.moveTo(u+(P+1)*l,y-l),a.lineTo(u+(P+1)*l,y+o/d+l);for(let P=-5;P<b;P++)a.moveTo(u-l,y+(P+1)*l),a.lineTo(u+r/d+l,y+(P+1)*l);a.stroke(),a.restore()})(e,n);for(let a=s.length-1;a>=0;a--)t.mode==="textedition"&&s[a]===i||As(e,X(i).find(c=>c.id===s[a].id)??s[a],n)},ra=v.forwardRef(({canGrow:e,shapes:t,duplicateShapes:n,addShapes:s,updateSingleShape:i,selectedShape:a,setSelectedShape:c,setSelectionFrame:r,hoveredShape:o,selectionFrame:l,refreshHoveredShape:p,refreshSelectedShapes:d,saveShapes:u,activeTool:y,setActiveTool:g,canvasOffsetStartData:b,setCanvasOffsetStartData:P,setCanvasOffset:L,setCanvasMoveAcceleration:w,isInsideComponent:k,selectionMode:f,setSelectionMode:x,selectionWidth:Z,selectionColor:R,settings:T,isEditMode:S,isShiftPressed:j,isAltPressed:I,isSpacePressed:A,withFrameSelection:E,withSkeleton:W},B)=>{const $=v.useRef(null),G=v.useRef(null),V=T.canvasSize,m=S,C=S?0:-1;v.useImperativeHandle(B,()=>$.current);const{hoverMode:Q}=ia({addShapes:s,drawCanvasRef:$,setActiveTool:g,shapes:t,selectionMode:f,activeTool:y,isInsideComponent:k,setCanvasOffset:L,selectedShape:a,canvasOffsetStartData:b,setCanvasOffsetStartData:P,setSelectedShape:c,setSelectionFrame:r,refreshHoveredShape:p,refreshSelectedShapes:d,updateSingleShape:i,duplicateShapes:n,saveShapes:u,setSelectionMode:x,setCanvasMoveAcceleration:w,isShiftPressed:j,isAltPressed:I,withFrameSelection:E,settings:T,isSpacePressed:A}),H=v.useCallback(F=>{const D=X(a)[0];if(D?.type!=="text")return;const O=$.current?.getContext("2d");if(!O)return;const z=dt(Ui(O,D,F,T),T);i([z])},[i,a,T]),M=F=>{if(S)return F.preventDefault(),F.stopPropagation(),!1};return v.useEffect(()=>{const F=$.current?.getContext("2d");F&&window.requestAnimationFrame(()=>oa(F,f,T,t,a))},[t,f,a,T]),v.useEffect(()=>{const F=G.current?.getContext("2d");F&&window.requestAnimationFrame(()=>((D,O,z,te,re,se,q,N,ie,ne,ge)=>{D.reset(),Qs(D,z),ge&&N&&!X(q).find(we=>we.id===N.id)&&te.type==="selection"&&O.mode==="default"&&Es({ctx:D,shape:N,settings:z,selectionWidth:re,selectionColor:se,hoverMode:ie,withAnchors:!1}),q&&te.type!=="brush"&&Es({ctx:D,shape:q,settings:z,selectionWidth:re,selectionColor:se,hoverMode:ie,withAnchors:O.mode!=="textedition"}),ne&&_i({ctx:D,selectionFrame:ne,settings:z})})(F,f,T,y,Z,R,a,o,Q,l,W))},[o,Q,l,f,a,y,T,Z,R,W]),h.jsx("div",{className:"react-paint-canvas-box",style:{"--react-paint-canvas-cursor":b?"grabbing":Q.outOfView?"default":Q.mode==="resize"?"pointer":y.type!=="selection"&&y.type!=="move"?"crosshair":Q.mode==="translate"?"move":Q.mode==="rotate"||y.type==="move"||A?"grab":"default"},children:h.jsxs("div",{className:"react-paint-canvas-container","data-grow":e,children:[h.jsx("canvas",{className:Gn,ref:$,"data-grow":e,width:V.width,height:V.height,onContextMenu:M,tabIndex:C}),m&&h.jsx("canvas",{className:qn,ref:G,width:V.width,height:V.height,"data-grow":e,onContextMenu:M}),S&&f.mode==="textedition"&&X(a)[0]?.type==="text"&&h.jsx(aa,{disabled:!T.features.edition,shape:X(a)[0],defaultValue:f.defaultValue,updateValue:H,saveShapes:u,settings:T})]})})}),Us="ArrowUp",Xs="ArrowDown",Gs="ArrowLeft",qs="ArrowRight",la="Delete",ca="Backspace",da="Escape",_s="Shift",Ks="Alt",Js="Option",kt=" ",ua="z",ha="Z",pa="y",ga="Y",fa="+",va="-",ma="0",ei="copy",ti="paste",ya=({isInsideComponent:e,isInsideCanvas:t,selectedShape:n,isEditingText:s,settings:i,setSelectedShape:a,setActiveTool:c,setCanvasZoom:r,resetZoom:o,setSelectionMode:l,setSelectionFrame:p,removeShape:d,pasteShapes:u,updateShapes:y,backwardShape:g,forwardShape:b,setShiftPressed:P,setAltPressed:L,setIsSpacePressed:w})=>{const[k,f]=v.useState(void 0);return v.useEffect(()=>{const x=S=>{n&&(s||(S.preventDefault(),f({...n})))},Z=S=>{k&&(s||(S.preventDefault(),u(((j,I)=>X(j).map(A=>({...ln([20,20],A,[0,0],I,!1),id:le(`${A.type}_`)})))(k,i))))},R=S=>{switch(S.key){case _s:P(!1);break;case Ks:case Js:L(!1);break;case kt:w(!1)}},T=S=>{if(S.metaKey||S.ctrlKey){if(S.key===ha||S.key===ua)return S.preventDefault(),S.stopPropagation(),void(S.shiftKey?b():g());if(!es()&&(S.key===ga||S.key===pa))return S.preventDefault(),S.stopPropagation(),void b();if(S.key===fa)return S.preventDefault(),S.stopPropagation(),void r("zoom");if(S.key===va)return S.preventDefault(),S.stopPropagation(),void r("unzoom");if(S.key===ma)return S.preventDefault(),S.stopPropagation(),void o()}if(S.key===_s)return S.preventDefault(),S.stopPropagation(),void P(!0);if(S.key===kt&&t)return S.preventDefault(),S.stopPropagation(),void w(!0);if(S.key===Ks||S.key===Js)return S.preventDefault(),S.stopPropagation(),void L(!0);if(!n)return;if(S.key===da)return a(void 0),c(Ee),l({mode:"default"}),void p(void 0);if(s)return;const j={[Gs]:[i.gridGap?-i.gridGap:-1,0],[qs]:[i.gridGap?i.gridGap:1,0],[Xs]:[0,i.gridGap?i.gridGap:1],[Us]:[0,i.gridGap?-i.gridGap:-1]};switch(S.key){case Gs:case qs:case Xs:case Us:S.preventDefault(),S.stopPropagation(),y(((I,A,E,W,B)=>X(A).map($=>ln(I,$,E,W,B)))(j[S.key],n,[0,0],i,!1));break;case la:case ca:S.preventDefault(),S.stopPropagation(),d(X(n))}};if(e)return document.addEventListener("keydown",T),document.addEventListener("keyup",R),document.addEventListener(ei,x),document.addEventListener(ti,Z),()=>{document.removeEventListener("keydown",T),document.removeEventListener("keyup",R),document.removeEventListener(ei,x),document.removeEventListener(ti,Z)}},[e,t,k,s,n,i,y,d,a,u,g,b,P,L,c,l,p,r,o,w]),{}},Sa=({isLoading:e=!1})=>{const[t,n]=v.useState("hidden");return v.useEffect(()=>{if(!e){n("fadeOut");const s=setTimeout(()=>n("hidden"),300);return()=>{clearTimeout(s)}}n("visible")},[e]),t==="hidden"?null:h.jsx("div",{className:"react-paint-editor-loading","data-loading":t,style:{"--react-paint-editor-loading-zindex":fi,"--react-paint-editor-loading-transition-duration":"300ms"},children:h.jsxs("div",{className:"react-paint-editor-loader",children:[h.jsx("div",{}),h.jsx("div",{}),h.jsx("div",{}),h.jsx("div",{})]})})},xa="infos",ba=4e3,Qa=({type:e,text:t,duration:n})=>{const[s,i]=v.useState(!1);return v.useEffect(()=>{const a=setTimeout(()=>{i(!0)},100),c=setTimeout(()=>{i(!1)},n-500-100);return()=>{clearTimeout(a),clearTimeout(c)}},[n]),h.jsx("div",{className:"react-paint-editor-snackbar","data-is-shown":+s,"data-type":e,style:{"--react-paint-editor-panel-transition-duration":"500ms"},children:t})},Ca=({snackbarList:e})=>h.jsx("div",{className:"react-paint-editor-snackbar-container",style:{"--react-paint-editor-snackbar-zindex":vi},children:e.map(t=>h.jsx(Qa,{...t},t.id))}),wa=v.forwardRef((e,t)=>{const{hidden:n=!1,disabled:s=!1,selected:i=!1,icon:a,children:c,className:r="",title:o,onClick:l,...p}=e,d=s?-1:0,u=v.useRef(null);return v.useImperativeHandle(t,()=>u.current),h.jsxs("label",{className:`react-paint-editor-button ${r}`,title:o,onClick:l,"data-disabled":+s,"data-selected":+i,"data-hidden":+n,tabIndex:d,onKeyDown:y=>{y.key===kt&&(y.preventDefault(),y.stopPropagation())},onKeyUp:y=>{y.preventDefault(),y.stopPropagation(),y.key===kt&&u.current?.click()},children:[h.jsx("input",{ref:u,disabled:s,...p}),h.jsxs("span",{className:"react-paint-editor-button-content",children:[c&&h.jsx("span",{className:"react-paint-editor-button-children",children:c}),a&&h.jsx("span",{className:"react-paint-editor-button-icon",dangerouslySetInnerHTML:{__html:a}})]})]})}),_=v.forwardRef((e,t)=>{if(e.type==="file"||e.type==="color")return h.jsx(wa,{...e,ref:t});const{hidden:n=!1,disabled:s=!1,selected:i=!1,icon:a,children:c,type:r="button",className:o="",...l}=e;return h.jsx("button",{className:`react-paint-editor-button ${o}`,ref:t,disabled:s,"data-disabled":+s,"data-selected":+i,"data-hidden":+n,type:r,...l,children:h.jsxs("span",{className:"react-paint-editor-button-content",children:[c&&h.jsx("span",{className:"react-paint-editor-button-children",children:c}),a&&h.jsx("span",{className:"react-paint-editor-button-icon",dangerouslySetInnerHTML:{__html:a}})]})})}),Ue=({children:e,title:t="",className:n="",position:s="bottom",fitContainer:i=!1,alignment:a="center",style:c,...r})=>h.jsxs("div",{className:`react-paint-editor-panel ${n}`,"data-fitcontainer":i,"data-position":s,"data-alignment":a,style:{...c,"--react-paint-editor-panel-zindex":Tn},...r,children:[t&&h.jsx("h3",{className:"react-paint-editor-panel-title",children:t}),e]}),Ma=e=>{switch(e){case"brush":return Sn;case"line":return Cn;case"polygon":return It;case"curve":return wn;case"rect":case"square":return Et;case"circle":case"ellipse":return Rt;case"text":return Qn;case"picture":return Dt;case"group":return'<svg><path d="M3.333 17.5V16.667H7.5V17.5ZM3.333 14.167V13.333H9.167V14.167ZM3.333 10.833V10H10.833V10.833ZM3.333 7.5V6.667H12.5V7.5ZM3.333 4.167V3.333H13.333V4.167ZM3.333 0.833V0H16.667V0.833Z"/></svg>';case"triangle":return""}},ka=({disabled:e=!1,shape:t,selected:n,layoutDragging:s,toggleShapeVisibility:i,toggleShapeLock:a,setLayoutDragging:c,handleRemove:r,handleSelect:o,onMoveShapes:l})=>{const p=v.useRef(null),{isOver:d}=(({disabled:u=!1,ref:y,shape:g,layoutDragging:b,setLayoutDragging:P,handleSelect:L,onMoveShapes:w})=>{const[k,f]=v.useState(!1);return v.useEffect(()=>{b||f(!1)},[b]),v.useEffect(()=>{const x=y.current;if(!x)return;const Z=()=>{P(void 0)},R=A=>(A.preventDefault&&A.preventDefault(),!1),T=A=>{L([g]),A.dataTransfer&&(A.dataTransfer.effectAllowed="move",A.dataTransfer.setData("draggableShapeId",g.id),P(g.id))},S=()=>{b!==g.id&&f(!0)},j=()=>{f(!1)},I=A=>(A.stopPropagation(),A.dataTransfer&&w(A.dataTransfer.getData("draggableShapeId"),g.id),!1);return u||(x.addEventListener("dragstart",T),x.addEventListener("dragend",Z),x.addEventListener("dragover",R),x.addEventListener("dragenter",S),x.addEventListener("dragleave",j),x.addEventListener("drop",I)),()=>{u||(x.removeEventListener("dragstart",T),x.removeEventListener("dragend",Z),x.removeEventListener("dragover",R),x.removeEventListener("dragenter",S),x.removeEventListener("dragleave",j),x.removeEventListener("drop",I))}},[u,y,g,P,L,w,b]),{isOver:k}})({disabled:e,ref:p,shape:t,layoutDragging:s,setLayoutDragging:c,handleSelect:o,onMoveShapes:l});return h.jsxs("div",{className:"react-paint-editor-layout","data-disabled":+e,draggable:!e,"data-is-dragging":+(s===t.id),"data-is-over":+d,onClick:u=>{e||(u.preventDefault(),u.stopPropagation(),o([t]))},"data-selected":+n,ref:p,tabIndex:-1,children:[h.jsx("span",{dangerouslySetInnerHTML:{__html:Ma(t.type)}}),h.jsx("span",{children:t.id}),h.jsx("div",{className:"react-paint-editor-layouts-separator"}),h.jsx(_,{className:"react-paint-editor-layouts-visible-button",title:t.visible?"Hide":"Show","data-visible":t.visible!==!1,disabled:e,selected:n,onClick:u=>{e||(u.preventDefault(),u.stopPropagation(),i([t]))},icon:t.visible===!1?'<svg><path d="M13.521 11.021 12.25 9.75Q12.333 8.75 11.604 7.979Q10.875 7.208 9.812 7.312L8.542 6.042Q8.896 5.896 9.26 5.833Q9.625 5.771 10 5.771Q11.583 5.771 12.688 6.875Q13.792 7.979 13.792 9.562Q13.792 9.979 13.719 10.354Q13.646 10.729 13.521 11.021ZM16.167 13.646 14.917 12.417Q15.667 11.833 16.25 11.146Q16.833 10.458 17.25 9.562Q16.229 7.479 14.292 6.281Q12.354 5.083 10 5.083Q9.396 5.083 8.885 5.156Q8.375 5.229 7.875 5.375L6.5 4Q7.354 3.646 8.208 3.49Q9.062 3.333 10 3.333Q13.146 3.333 15.615 5.052Q18.083 6.771 19.167 9.562Q18.688 10.792 17.917 11.823Q17.146 12.854 16.167 13.646ZM16.396 18.854 12.938 15.396Q12.208 15.625 11.479 15.729Q10.75 15.833 10 15.833Q6.833 15.833 4.375 14.094Q1.917 12.354 0.833 9.562Q1.25 8.479 1.917 7.552Q2.583 6.625 3.417 5.875L1.125 3.562L2.375 2.354L17.625 17.625ZM4.604 7.062Q4.021 7.604 3.542 8.219Q3.062 8.833 2.729 9.562Q3.75 11.646 5.688 12.865Q7.625 14.083 10 14.083Q10.354 14.083 10.74 14.052Q11.125 14.021 11.479 13.938L10.812 13.271Q10.625 13.312 10.417 13.333Q10.208 13.354 10 13.354Q8.417 13.354 7.312 12.25Q6.208 11.146 6.208 9.562Q6.208 9.354 6.24 9.167Q6.271 8.979 6.312 8.771ZM11.375 8.875Q11.375 8.875 11.375 8.875Q11.375 8.875 11.375 8.875Q11.375 8.875 11.375 8.875Q11.375 8.875 11.375 8.875Q11.375 8.875 11.375 8.875Q11.375 8.875 11.375 8.875ZM8.042 10.5Q8.042 10.5 8.042 10.5Q8.042 10.5 8.042 10.5Q8.042 10.5 8.042 10.5Q8.042 10.5 8.042 10.5Q8.042 10.5 8.042 10.5Q8.042 10.5 8.042 10.5Z"/></svg>':'<svg><path d="M10 13.354Q11.583 13.354 12.688 12.25Q13.792 11.146 13.792 9.562Q13.792 7.979 12.688 6.875Q11.583 5.771 10 5.771Q8.417 5.771 7.312 6.875Q6.208 7.979 6.208 9.562Q6.208 11.146 7.312 12.25Q8.417 13.354 10 13.354ZM10 11.812Q9.062 11.812 8.406 11.156Q7.75 10.5 7.75 9.562Q7.75 8.625 8.406 7.969Q9.062 7.312 10 7.312Q10.938 7.312 11.594 7.969Q12.25 8.625 12.25 9.562Q12.25 10.5 11.594 11.156Q10.938 11.812 10 11.812ZM10 15.833Q6.938 15.833 4.448 14.125Q1.958 12.417 0.833 9.562Q1.958 6.708 4.458 5.021Q6.958 3.333 10 3.333Q13.042 3.333 15.542 5.021Q18.042 6.708 19.167 9.562Q18.042 12.417 15.552 14.125Q13.062 15.833 10 15.833ZM10 9.562Q10 9.562 10 9.562Q10 9.562 10 9.562Q10 9.562 10 9.562Q10 9.562 10 9.562Q10 9.562 10 9.562Q10 9.562 10 9.562Q10 9.562 10 9.562Q10 9.562 10 9.562ZM10 14.083Q12.333 14.083 14.281 12.865Q16.229 11.646 17.25 9.562Q16.229 7.479 14.281 6.281Q12.333 5.083 10 5.083Q7.667 5.083 5.708 6.281Q3.75 7.479 2.729 9.562Q3.75 11.646 5.708 12.865Q7.667 14.083 10 14.083Z"/></svg>'}),h.jsx(_,{className:"react-paint-editor-layouts-locked-button",title:t.locked?"Locked":"Unlocked","data-locked":!!t.locked,disabled:e,selected:n,onClick:u=>{e||(u.preventDefault(),u.stopPropagation(),a([t]))},icon:t.locked?'<svg><path d="M10 0.833Q11.771 0.833 12.99 2.052Q14.208 3.271 14.208 5.042V6.667H14.917Q15.646 6.667 16.156 7.177Q16.667 7.688 16.667 8.417V16.562Q16.667 17.292 16.156 17.812Q15.646 18.333 14.917 18.333H5.083Q4.354 18.333 3.844 17.812Q3.333 17.292 3.333 16.562V8.417Q3.333 7.688 3.844 7.177Q4.354 6.667 5.083 6.667H5.792V5.042Q5.792 3.271 7.01 2.052Q8.229 0.833 10 0.833ZM10 2.583Q8.979 2.583 8.26 3.302Q7.542 4.021 7.542 5.042V6.667H12.458V5.042Q12.458 4.021 11.74 3.302Q11.021 2.583 10 2.583ZM5.083 16.583H14.917Q14.917 16.583 14.917 16.583Q14.917 16.583 14.917 16.583V8.417Q14.917 8.417 14.917 8.417Q14.917 8.417 14.917 8.417H5.083Q5.083 8.417 5.083 8.417Q5.083 8.417 5.083 8.417V16.583Q5.083 16.583 5.083 16.583Q5.083 16.583 5.083 16.583ZM10 10.812Q9.292 10.812 8.802 11.302Q8.312 11.792 8.312 12.5Q8.312 13.208 8.802 13.698Q9.292 14.188 10 14.188Q10.708 14.188 11.198 13.698Q11.688 13.208 11.688 12.5Q11.688 11.792 11.198 11.302Q10.708 10.812 10 10.812ZM5.083 8.417Q5.083 8.417 5.083 8.417Q5.083 8.417 5.083 8.417V16.583Q5.083 16.583 5.083 16.583Q5.083 16.583 5.083 16.583Q5.083 16.583 5.083 16.583Q5.083 16.583 5.083 16.583V8.417Q5.083 8.417 5.083 8.417Q5.083 8.417 5.083 8.417Z"/></svg>':'<svg><path d="M5.792 5.042Q5.792 3.271 7.01 2.052Q8.229 0.833 10 0.833Q11.771 0.833 12.99 2.052Q14.208 3.271 14.208 5.042V6.667H14.917Q15.646 6.667 16.156 7.177Q16.667 7.688 16.667 8.417V16.562Q16.667 17.292 16.156 17.812Q15.646 18.333 14.917 18.333H5.083Q4.354 18.333 3.844 17.812Q3.333 17.292 3.333 16.562V8.417Q3.333 7.688 3.844 7.177Q4.354 6.667 5.083 6.667H12.458V5.042Q12.458 4.021 11.74 3.302Q11.021 2.583 10 2.583Q8.979 2.583 8.26 3.302Q7.542 4.021 7.542 5.042ZM5.083 16.583H14.917Q14.917 16.583 14.917 16.583Q14.917 16.583 14.917 16.583V8.417Q14.917 8.417 14.917 8.417Q14.917 8.417 14.917 8.417H5.083Q5.083 8.417 5.083 8.417Q5.083 8.417 5.083 8.417V16.583Q5.083 16.583 5.083 16.583Q5.083 16.583 5.083 16.583ZM10 10.812Q9.292 10.812 8.802 11.302Q8.312 11.792 8.312 12.5Q8.312 13.208 8.802 13.698Q9.292 14.188 10 14.188Q10.708 14.188 11.198 13.698Q11.688 13.208 11.688 12.5Q11.688 11.792 11.198 11.302Q10.708 10.812 10 10.812ZM5.083 8.417Q5.083 8.417 5.083 8.417Q5.083 8.417 5.083 8.417V16.583Q5.083 16.583 5.083 16.583Q5.083 16.583 5.083 16.583Q5.083 16.583 5.083 16.583Q5.083 16.583 5.083 16.583V8.417Q5.083 8.417 5.083 8.417Q5.083 8.417 5.083 8.417Z"/></svg>'}),h.jsx(_,{className:"react-paint-editor-layouts-remove-button",title:"Remove",disabled:e,onClick:u=>{e||(u.preventDefault(),u.stopPropagation(),r([t]))},icon:xn})]})},Pa=({gridFormat:e,setGridFormat:t,settings:n,shapes:s,removeShape:i,toggleShapeVisibility:a,toggleShapeLock:c,selectedShapes:r,moveShapes:o,selectShapes:l,isLayoutPanelShown:p})=>{const[d,u]=v.useState(void 0),y=!n.features.edition;return p?h.jsx(Ue,{alignment:"right",className:"react-paint-editor-layouts-panel",children:h.jsx("div",{className:"react-paint-editor-layouts-panel-content",children:h.jsxs("div",{className:"react-paint-editor-layouts-scrolling-content",children:[h.jsxs("div",{className:"react-paint-editor-layouts-row",children:[h.jsx("span",{className:"react-paint-editor-layouts-subtitle",children:"Grid"}),h.jsx(_,{icon:'<svg><path d="M18.333 15.854 16.583 14.104V13.354H15.833L14.083 11.604H16.583V8.375H13.375V10.896L11.625 9.146V8.375H10.875L9.125 6.625H11.625V3.417H8.396V5.896L6.646 4.146V3.417H5.896L4.146 1.667H16.583Q17.312 1.667 17.823 2.177Q18.333 2.688 18.333 3.417ZM13.375 6.625H16.583V3.417Q16.583 3.417 16.583 3.417Q16.583 3.417 16.583 3.417H13.375ZM16.771 19.229 15.854 18.333H3.417Q2.688 18.333 2.177 17.823Q1.667 17.312 1.667 16.583V4.125L0.812 3.271L2.042 2.021L18 18ZM13.375 16.583H14.104L13.375 15.833ZM8.396 11.604H9.125L8.396 10.854ZM8.396 16.583H11.625V14.083L10.875 13.354H8.396ZM3.417 6.625H4.167L3.417 5.875ZM3.417 11.604H6.646V9.104L5.917 8.375H3.417ZM6.646 16.583V13.354H3.417V16.583Q3.417 16.583 3.417 16.583Q3.417 16.583 3.417 16.583Z"/></svg>',className:"react-paint-editor-layouts-grid-button",selected:e==="none",disabled:y,onClick:()=>t("none")}),["small","medium","large"].map(g=>h.jsx(_,{className:"react-paint-editor-layouts-grid-button",selected:e===g,disabled:y,onClick:()=>t(g),children:g.charAt(0).toUpperCase()},g))]}),h.jsx("hr",{}),h.jsx("div",{className:"react-paint-editor-layouts",children:s.length===0?h.jsx("div",{className:"react-paint-editor-layouts-placeholder",children:"No layer yet"}):s.map(g=>h.jsx(ka,{shape:g,disabled:y,layoutDragging:d,setLayoutDragging:u,selected:X(r).some(b=>b.id===g.id)??!1,handleSelect:l,handleRemove:i,onMoveShapes:o,toggleShapeVisibility:a,toggleShapeLock:c},g.id))})]})})}):null},Pt=({children:e,onClose:t,position:n="center",title:s,className:i=""})=>h.jsxs("div",{className:"react-paint-editor-modal","data-position":n,style:{"--react-paint-editor-modal-zindex":Tn},role:"dialog","aria-modal":"true","aria-labelledby":s,children:[h.jsx("div",{className:"react-paint-editor-modal-mask",onClick:t}),h.jsx("div",{className:`react-paint-editor-modal-panel ${i}`,children:e})]}),jt=({selectedSettings:e,setSelectedSettings:t,title:n="Choisissez une couleur",mode:s="fill",disabled:i=!1,values:a,field:c,value:r="",valueChanged:o})=>{const[l]=v.useState(le("settings_")),p=e===l;return a.length?h.jsxs(h.Fragment,{children:[h.jsx(_,{selected:p,title:n,disabled:i,onClick:()=>{t(d=>d===l?void 0:l)},icon:r==="transparent"?s==="fill"?Ln:jn:void 0,children:r!=="transparent"&&h.jsx("div",{className:"react-paint-editor-colorfield-color","data-mode":s,style:{"--react-paint-editor-colorfield-color-value":r}})}),p&&h.jsx(Ue,{title:n,alignment:"left",children:h.jsxs("div",{className:"react-paint-editor-colorfield-wrapper",children:[a.map(d=>h.jsx(_,{title:d,selected:d===r,color:d,icon:d==="transparent"?s==="fill"?Ln:jn:void 0,onClick:()=>{o(c,d)},children:d!=="transparent"&&h.jsx("div",{className:"react-paint-editor-colorfield-color",color:d,"data-mode":s,style:{"--react-paint-editor-colorfield-color-value":d}})},d)),h.jsx(_,{type:"color",title:"Custom color",selected:r!==""&&!a.includes(r),value:r,onChange:d=>{const u=+d.target.value;o(c,Number.isNaN(u)?d.target.value:u)},children:h.jsx("div",{className:"react-paint-editor-colorfield-customcolor",style:{"--react-paint-editor-colorfield-color-value":a.includes(r)?"var(--react-paint-editor-app-font-color)":r},children:h.jsx("span",{dangerouslySetInnerHTML:{__html:'<svg><path d="M9.958 18.333Q8.25 18.333 6.74 17.677Q5.229 17.021 4.104 15.885Q2.979 14.75 2.323 13.229Q1.667 11.708 1.667 10Q1.667 8.271 2.333 6.75Q3 5.229 4.156 4.104Q5.312 2.979 6.854 2.323Q8.396 1.667 10.125 1.667Q11.771 1.667 13.26 2.25Q14.75 2.833 15.875 3.854Q17 4.875 17.667 6.26Q18.333 7.646 18.333 9.25Q18.333 11.688 16.792 12.948Q15.25 14.208 13.188 14.208H11.75Q11.625 14.208 11.562 14.281Q11.5 14.354 11.5 14.458Q11.5 14.688 11.812 15.219Q12.125 15.75 12.125 16.458Q12.125 17.458 11.51 17.896Q10.896 18.333 9.958 18.333ZM5.458 10.875Q6 10.875 6.375 10.5Q6.75 10.125 6.75 9.583Q6.75 9.042 6.375 8.667Q6 8.292 5.458 8.292Q4.917 8.292 4.542 8.667Q4.167 9.042 4.167 9.583Q4.167 10.125 4.542 10.5Q4.917 10.875 5.458 10.875ZM7.917 7.583Q8.458 7.583 8.833 7.208Q9.208 6.833 9.208 6.292Q9.208 5.75 8.833 5.375Q8.458 5 7.917 5Q7.375 5 7 5.375Q6.625 5.75 6.625 6.292Q6.625 6.833 7 7.208Q7.375 7.583 7.917 7.583ZM12.021 7.583Q12.562 7.583 12.938 7.208Q13.312 6.833 13.312 6.292Q13.312 5.75 12.938 5.375Q12.562 5 12.021 5Q11.479 5 11.104 5.375Q10.729 5.75 10.729 6.292Q10.729 6.833 11.104 7.208Q11.479 7.583 12.021 7.583ZM14.479 10.875Q15.021 10.875 15.396 10.5Q15.771 10.125 15.771 9.583Q15.771 9.042 15.396 8.667Q15.021 8.292 14.479 8.292Q13.938 8.292 13.562 8.667Q13.188 9.042 13.188 9.583Q13.188 10.125 13.562 10.5Q13.938 10.875 14.479 10.875Z"/></svg>'}})})})]})})]}):null},ja=({disabled:e=!1,selectedShape:t,removeShape:n})=>h.jsx(_,{title:"Delete",disabled:e,"data-disabled":+e,onClick:()=>{n(X(t))},icon:xn}),Lt=({CustomOption:e,selectedSettings:t,setSelectedSettings:n,title:s="Choisissez l'option",disabled:i=!1,field:a,icon:c,values:r,defaultValue:o,valueChanged:l})=>{const[p]=v.useState(le("settings_")),d=t===p;return r.length?h.jsxs(h.Fragment,{children:[h.jsx(_,{selected:d,title:s,icon:c,disabled:i,onClick:()=>{n(u=>u===p?void 0:p)}}),d&&h.jsx(Ue,{title:s,alignment:"left",fitContainer:!0,children:h.jsx("div",{className:"react-paint-editor-selectfield-wrapper",children:r.map(u=>h.jsx(_,{title:`${u}`,onClick:()=>(y=>{l(a,y)})(u),selected:o===u,style:{"--react-paint-editor-button-padding":"16px"},children:h.jsx(e,{children:u})},u))})})]}):null},La=({children:e})=>h.jsx("span",{className:"react-paint-editor-fontfamily-option",style:{"--react-paint-editor-fontfamily-family":e},children:e}),ni=({selectedSettings:e,setSelectedSettings:t,disabled:n=!1,values:s,defaultValue:i,valueChanged:a})=>s.length?h.jsx(Lt,{selectedSettings:e,setSelectedSettings:t,CustomOption:La,title:"Police",icon:'<svg><path d="M5.312 14.979H7.125L8.042 12.479H11.979L12.896 14.979H14.708L10.917 5H9.083ZM8.542 10.958 9.958 6.958H10.042L11.458 10.958ZM3.417 18.333Q2.688 18.333 2.177 17.823Q1.667 17.312 1.667 16.583V3.417Q1.667 2.688 2.177 2.177Q2.688 1.667 3.417 1.667H16.583Q17.312 1.667 17.823 2.177Q18.333 2.688 18.333 3.417V16.583Q18.333 17.312 17.823 17.823Q17.312 18.333 16.583 18.333ZM3.417 16.583H16.583Q16.583 16.583 16.583 16.583Q16.583 16.583 16.583 16.583V3.417Q16.583 3.417 16.583 3.417Q16.583 3.417 16.583 3.417H3.417Q3.417 3.417 3.417 3.417Q3.417 3.417 3.417 3.417V16.583Q3.417 16.583 3.417 16.583Q3.417 16.583 3.417 16.583ZM3.417 3.417Q3.417 3.417 3.417 3.417Q3.417 3.417 3.417 3.417V16.583Q3.417 16.583 3.417 16.583Q3.417 16.583 3.417 16.583Q3.417 16.583 3.417 16.583Q3.417 16.583 3.417 16.583V3.417Q3.417 3.417 3.417 3.417Q3.417 3.417 3.417 3.417Z"/></svg>',disabled:n,field:"fontFamily",values:s,defaultValue:i,valueChanged:a}):null,Va=({disabled:e,toggleLayoutPanel:t})=>h.jsx(_,{title:"Toggle layers panel",disabled:e,onClick:t,icon:'<svg><path d="M10 17.646 2.438 11.75 3.875 10.646 10 15.396 16.125 10.646 17.562 11.75ZM10 13.188 2.5 7.354 10 1.521 17.5 7.354Z"/></svg>',className:"react-paint-editor-layout-button"}),Za=({children:e})=>h.jsxs("span",{className:"react-paint-editor-linearrow-option","data-type":e,children:[h.jsx("span",{className:"react-paint-editor-linearrow-left"}),h.jsx("span",{className:"react-paint-editor-linearrow-right"})]}),si=({selectedSettings:e,setSelectedSettings:t,disabled:n=!1,values:s,defaultValue:i,valueChanged:a})=>s.length?h.jsx(Lt,{selectedSettings:e,setSelectedSettings:t,CustomOption:Za,title:"Flèches",icon:'<svg><path d="M6 17 2 13 6 9 7.062 10.062 4.875 12.25H17V13.75H4.875L7.062 15.938ZM14 11 12.938 9.938 15.125 7.75H3V6.25H15.125L12.938 4.062L14 3L18 7Z"/></svg>',disabled:n,field:"lineArrow",values:s,defaultValue:i,valueChanged:a}):null,Ta=({children:e})=>h.jsxs("span",{className:"react-paint-editor-linetype-option","data-type":e,children:[h.jsx("span",{}),h.jsx("span",{}),h.jsx("span",{}),h.jsx("span",{}),h.jsx("span",{}),h.jsx("span",{}),h.jsx("span",{})]}),ii=({selectedSettings:e,setSelectedSettings:t,disabled:n=!1,values:s,defaultValue:i,valueChanged:a})=>s.length?h.jsx(Lt,{selectedSettings:e,setSelectedSettings:t,CustomOption:Ta,icon:'<svg><path d="M3 16V14.5H4.5V16ZM6.125 16V14.5H7.625V16ZM9.25 16V14.5H10.75V16ZM12.375 16V14.5H13.875V16ZM15.5 16V14.5H17V16ZM3 13V11.5H6.5V13ZM8.25 13V11.5H11.75V13ZM13.5 13V11.5H17V13ZM3 10V8.5H9.25V10ZM10.75 10V8.5H17V10ZM3 7V4H17V7Z"/></svg>',title:"Type de traits",disabled:n,field:"lineDash",values:s,defaultValue:i,valueChanged:a}):null,Vt=({selectedSettings:e,setSelectedSettings:t,title:n="Choisissez l'intervalle",icon:s,disabled:i=!1,field:a,value:c,min:r=1,max:o=20,step:l=1,unity:p="",valueChanged:d,saveShapes:u})=>{const y=c===void 0,g=y?"N/A":`${Math.round(c)}${p}`,[b]=v.useState(le("settings_")),P=((w,k=500)=>{const f=v.useRef(null),x=v.useCallback((...Z)=>{f.current&&clearTimeout(f.current),f.current=setTimeout(()=>w(...Z),k)},[w,k]);return v.useEffect(()=>()=>{f.current&&clearTimeout(f.current)},[]),x})(u),L=e===b;return r===o?null:h.jsxs(h.Fragment,{children:[h.jsx(_,{selected:L,title:n,disabled:i,icon:s,onClick:()=>{t(w=>w===b?void 0:b)}}),L&&h.jsx(Ue,{title:n,alignment:"left",fitContainer:!0,children:h.jsx("div",{children:h.jsxs("label",{className:"react-paint-editor-rangefield",children:[h.jsx("input",{type:"range",min:r,max:o,step:l,value:c??(o+r)/2,"data-indeterminate":+y,onChange:w=>{const k=+w.target.value,f=Number.isNaN(k)?w.target.value:k;d(a,f,!1),P()}}),h.jsx("span",{children:g})]})})})]})},Ha=({children:e})=>h.jsx("span",{children:e===0?"Non":"Oui"}),za=[0,1],ai=({selectedSettings:e,setSelectedSettings:t,disabled:n=!1,defaultValue:s,valueChanged:i})=>h.jsx(Lt,{selectedSettings:e,setSelectedSettings:t,CustomOption:Ha,title:"Fermer les points",icon:It,disabled:n,field:"closedPoints",values:za,defaultValue:s,valueChanged:i}),Aa=({disabled:e=!1,className:t,toggleZoomPanel:n})=>h.jsx(_,{title:"Toggle zoom panel",disabled:e,onClick:n,icon:Vn,className:t?` ${t}`:""}),Zt=({setSelectedSettings:e,disabled:t=!1,field:n,icon:s,values:i,value:a=!1,valueChanged:c})=>{const[r]=v.useState(le("settings_"));return i.length!==2?null:h.jsx(_,{onClick:()=>{e(o=>o===r?void 0:r),c(n,!a)},selected:a,disabled:t,icon:s})},hn=({activeTool:e,selectedShape:t,selectedShapeTool:n,disabled:s,selectedSettings:i,setSelectedSettings:a,saveShapes:c,handleShapeStyleChange:r,handleShapeFontFamilyChange:o})=>t?n&&h.jsxs(h.Fragment,{children:["strokeColor"in n.settings&&!n.settings.strokeColor.hidden&&h.jsx(jt,{selectedSettings:i,setSelectedSettings:a,title:"Couleur du trait",mode:"stroke",disabled:s,field:"strokeColor",value:t.style?.strokeColor,valueChanged:r,values:n.settings.strokeColor.values}),"fillColor"in n.settings&&!n.settings.fillColor.hidden&&h.jsx(jt,{selectedSettings:i,setSelectedSettings:a,title:"Couleur de fond",disabled:s,field:"fillColor",value:t.style?.fillColor,valueChanged:r,values:n.settings.fillColor.values}),"lineWidth"in n.settings&&!n.settings.lineWidth.hidden&&h.jsx(Vt,{saveShapes:c,selectedSettings:i,setSelectedSettings:a,title:"Epaisseur du trait",icon:Pn,disabled:s,field:"lineWidth",value:t.style?.lineWidth,valueChanged:r,unity:"px",min:n.settings.lineWidth.min,max:n.settings.lineWidth.max,step:n.settings.lineWidth.step}),"lineDash"in n.settings&&!n.settings.lineDash.hidden&&h.jsx(ii,{selectedSettings:i,setSelectedSettings:a,disabled:s,defaultValue:t.style?.lineDash,valueChanged:r,values:n.settings.lineDash.values}),"lineArrow"in n.settings&&!n.settings.lineArrow.hidden&&h.jsx(si,{selectedSettings:i,setSelectedSettings:a,disabled:s,defaultValue:t.style?.lineArrow,valueChanged:r,values:n.settings.lineArrow.values}),"closedPoints"in n.settings&&!n.settings.closedPoints.hidden&&h.jsx(ai,{selectedSettings:i,setSelectedSettings:a,disabled:s,valueChanged:r,defaultValue:t.style?.closedPoints}),"fontFamily"in n.settings&&!n.settings.fontFamily.hidden&&h.jsx(ni,{selectedSettings:i,setSelectedSettings:a,disabled:s,valueChanged:o,values:n.settings.fontFamily.values,defaultValue:t.style?.fontFamily}),"fontBold"in n.settings&&!n.settings.fontBold.hidden&&h.jsx(Zt,{setSelectedSettings:a,disabled:s,field:"fontBold",icon:Mn,valueChanged:o,values:n.settings.fontBold.values,value:t.style?.fontBold}),"fontItalic"in n.settings&&!n.settings.fontItalic.hidden&&h.jsx(Zt,{setSelectedSettings:a,disabled:s,field:"fontItalic",icon:kn,valueChanged:o,values:n.settings.fontItalic.values,value:t.style?.fontItalic}),"opacity"in n.settings&&!n.settings.opacity.hidden&&h.jsx(Vt,{saveShapes:c,selectedSettings:i,setSelectedSettings:a,title:"Opacité",icon:bn,min:n.settings.opacity.min,max:n.settings.opacity.max,step:n.settings.opacity.step,unity:"%",disabled:s,field:"opacity",value:t.style?.opacity,valueChanged:r})]}):"settings"in e?h.jsxs(h.Fragment,{children:["strokeColor"in e.settings&&!e.settings.strokeColor.hidden&&h.jsx(jt,{selectedSettings:i,setSelectedSettings:a,title:"Couleur du trait",mode:"stroke",disabled:s,field:"strokeColor",value:e.settings.strokeColor.default,valueChanged:r,values:e.settings.strokeColor.values}),"fillColor"in e.settings&&!e.settings.fillColor.hidden&&h.jsx(jt,{selectedSettings:i,setSelectedSettings:a,title:"Couleur de fond",disabled:s,field:"fillColor",value:e.settings.fillColor.default,valueChanged:r,values:e.settings.fillColor.values}),"lineWidth"in e.settings&&!e.settings.lineWidth.hidden&&h.jsx(Vt,{saveShapes:c,selectedSettings:i,setSelectedSettings:a,title:"Epaisseur du trait",disabled:s,field:"lineWidth",icon:Pn,value:e.settings.lineWidth.default,valueChanged:r,unity:"px",min:e.settings.lineWidth.min,max:e.settings.lineWidth.max,step:e.settings.lineWidth.step}),"lineDash"in e.settings&&!e.settings.lineDash.hidden&&h.jsx(ii,{selectedSettings:i,setSelectedSettings:a,disabled:s,defaultValue:e.settings.lineDash.default,valueChanged:r,values:e.settings.lineDash.values}),"lineArrow"in e.settings&&!e.settings.lineArrow.hidden&&h.jsx(si,{selectedSettings:i,setSelectedSettings:a,disabled:s,defaultValue:e.settings.lineArrow.default,valueChanged:r,values:e.settings.lineArrow.values}),"closedPoints"in e.settings&&!e.settings.closedPoints.hidden&&h.jsx(ai,{selectedSettings:i,setSelectedSettings:a,disabled:s,valueChanged:r,defaultValue:e.settings?.closedPoints.default}),"fontFamily"in e.settings&&!e.settings.fontFamily.hidden&&h.jsx(ni,{selectedSettings:i,setSelectedSettings:a,disabled:s,valueChanged:o,values:e.settings.fontFamily.values,defaultValue:e.settings.fontFamily.default}),"fontBold"in e.settings&&!e.settings.fontBold.hidden&&h.jsx(Zt,{setSelectedSettings:a,disabled:s,field:"fontBold",icon:Mn,valueChanged:o,values:e.settings.fontBold.values,value:e.settings.fontBold.default}),"fontItalic"in e.settings&&!e.settings.fontItalic.hidden&&h.jsx(Zt,{setSelectedSettings:a,disabled:s,field:"fontItalic",icon:kn,valueChanged:o,values:e.settings.fontItalic.values,value:e.settings.fontItalic.default}),"opacity"in e.settings&&!e.settings.opacity.hidden&&h.jsx(Vt,{saveShapes:c,selectedSettings:i,setSelectedSettings:a,title:"Opacité",icon:bn,min:e.settings.opacity.min,max:e.settings.opacity.max,step:e.settings.opacity.step,unity:"%",disabled:s,field:"opacity",value:e.settings.opacity.default,valueChanged:r})]}):null,Ea=({width:e,availableTools:t,updateToolSettings:n,layersManipulation:s=!1,toggleLayoutPanel:i,activeTool:a,saveShapes:c,selectedShape:r,canvas:o,settings:l,updateShape:p,removeShape:d,isZoomPanelShown:u,setIsZoomPanelShown:y})=>{const[g,b]=v.useState(void 0),[P,L]=v.useState(!1),w=l.size==="infinite"||l.features.zoom,k=!l.features.edition,f=()=>{L(j=>!j)},x=((j,I)=>{const A=X(j).map(W=>I.find(B=>B.id===W?.toolId)||I.find(B=>B.type===W?.type)).filter(W=>W!==void 0);if(!A.length)return;if(A.length===1)return A[0];const E=A.slice(1).reduce((W,B)=>{const $={};for(const G in B.settings){if(W[G]===void 0||B.settings[G]?.hidden||W[G]?.hidden)continue;const V=W[G],m=B.settings[G],C={};"min"in m&&"min"in V&&m.min===V.min&&"max"in m&&"max"in V&&m.max===V.max&&"step"in m&&"step"in V&&m.step===V.step&&(C.min=m.min,C.max=m.max,C.step=m.step),"values"in m&&"values"in V&&m.values?.join(",")===V.values?.join(",")&&(C.values=m.values),(Object.keys(C).length>0||G==="closedPoints")&&($[G]=C)}return $},A[0].settings);return{id:A.map(W=>W.id).join("-"),icon:"",label:"group",type:"group",settings:E}})(r,t),Z=(x?Object.keys(x.settings).length+1:"settings"in a?Object.keys(a.settings).length:0)+ +s+ +w,R=e<40*Z,T=(j,I,A=!0)=>{if(X(r).length){const E=X(r).map(W=>dt(be(["style",j],I,W),l));p(E,A),x&&n(x.id,j,I)}else n(a.id,j,I)},S=(j,I)=>{if(X(r).length){const A=X(r).map(E=>{if(E.type!=="text")return E;const W=o?.getContext("2d");if(!W)return E;const B=be(["style",j],I,E),$=rn(W,B.value,B.width,B.style?.fontBold??!1,B.style?.fontItalic??!1,B.style?.fontFamily);return dt({...B,fontSize:$,height:$*B.value.length},l)});p(A,!0),x&&n(x.id,j,I)}else n(a.id,j,I)};return h.jsxs(h.Fragment,{children:[h.jsxs("div",{className:"react-paint-editor-settings-bar",children:[h.jsxs("div",{className:"react-paint-editor-settings-shrinkable",children:[w&&h.jsx(Aa,{className:u?"react-paint-editor-bar-zoom-button-opened":void 0,toggleZoomPanel:()=>{y(j=>!j)}}),R&&Z>2&&h.jsx(_,{disabled:k,onClick:f,title:"Toggle settings",icon:'<svg><path d="M2.5 15.833V14.083H7.667V15.833ZM2.5 5.917V4.167H10.771V5.917ZM9.208 17.5V12.438H10.958V14.083H17.5V15.833H10.958V17.5ZM5.917 12.542V10.875H2.5V9.125H5.917V7.479H7.667V12.542ZM9.208 10.875V9.125H17.5V10.875ZM12.333 7.562V2.5H14.083V4.167H17.5V5.917H14.083V7.562Z"/></svg>'}),r?x&&h.jsxs(h.Fragment,{children:[!R&&h.jsx(hn,{saveShapes:c,activeTool:a,selectedShape:r,selectedShapeTool:x,disabled:k,selectedSettings:g,setSelectedSettings:b,handleShapeStyleChange:T,handleShapeFontFamilyChange:S}),a.type==="selection"&&h.jsx(ja,{disabled:k,selectedShape:r,removeShape:d})]}):!R&&h.jsx(hn,{saveShapes:c,activeTool:a,selectedShape:r,selectedShapeTool:x,disabled:k,selectedSettings:g,setSelectedSettings:b,handleShapeStyleChange:T,handleShapeFontFamilyChange:S})]}),h.jsx("div",{className:"react-paint-editor-settings-separator"}),s&&h.jsx(Va,{disabled:k,toggleLayoutPanel:i})]}),P&&h.jsx(Pt,{className:"react-paint-editor-settings-modal",onClose:f,position:"bottom",title:"Settings",children:h.jsx(hn,{saveShapes:c,activeTool:a,selectedShape:r,selectedShapeTool:x,disabled:k,selectedSettings:g,setSelectedSettings:b,handleShapeStyleChange:T,handleShapeFontFamilyChange:S})})]})},oi=({disabled:e=!1,withText:t=!1,loadFile:n,type:s,img:i,accept:a})=>{const c=v.useRef(null);return h.jsx(_,{ref:c,type:"file",onClick:r=>{r.stopPropagation(),c.current&&(c.current.value="")},onChange:r=>{const o=r.target.files?.item(0);o&&n(o)},accept:a,title:s.label??s.type,icon:i,disabled:e,children:t?s.label:void 0})},Ce=({type:e,img:t,isActive:n,withText:s=!1,disabled:i=!1,setActive:a})=>h.jsx(_,{disabled:i,selected:n,onClick:()=>{a(e)},title:e.label??e.type,icon:t,children:s?e.label:void 0}),Ra=({activeTool:e,withActionsInMenu:t,hasActionToUndo:n=!1,hasActionToRedo:s=!1,hasActionToClear:i=!1,undoAction:a,redoAction:c,clearCanvas:r,alignment:o,group:l,vertical:p=!1,disabled:d=!1,withLoadAndSave:u,withExport:y,addPicture:g,loadFile:b,togglePictureUrlModal:P,saveFile:L,toggleExportModal:w,withUploadPicture:k,withUrlPicture:f})=>{const[x,Z]=v.useState(!1),[,R]=v.useTransition(),T=l?.tools?.some(j=>j===e.type),S=(T?e.icon:l.img)??l.title;return v.useEffect(()=>{if(!x)return;const j=()=>{Z(!1)};return document.addEventListener("click",j),()=>{document.removeEventListener("click",j)}},[x]),t||k||f||u||y?h.jsxs("div",{className:"react-paint-editor-toolbox-relative",children:[h.jsx(_,{selected:T,title:l.title,disabled:d,onClick:()=>{R(()=>{Z(!0)})},icon:S}),x&&h.jsx(Ue,{alignment:o,position:"top",children:h.jsxs("div",{className:"react-paint-editor-toolbox-panel-content","data-vertical":+p,children:[t&&h.jsxs(h.Fragment,{children:[h.jsx(Ce,{withText:!0,type:Je,disabled:d||!n,img:Je.icon,isActive:e.id===Je.id,setActive:a}),h.jsx(Ce,{withText:!0,type:et,disabled:d||!s,img:et.icon,isActive:e.id===et.id,setActive:c}),h.jsx(Ce,{withText:!0,type:tt,disabled:d||!i,img:tt.icon,isActive:e.id===tt.id,setActive:r}),(k||f||u)&&h.jsx("hr",{})]}),k&&h.jsx(oi,{withText:!0,type:Bn,disabled:d,loadFile:async j=>{Z(!1),await g(j)},img:Bn.icon,accept:"image/png, image/gif, image/jpeg, image/svg+xml, image/webp"}),f&&h.jsx(_,{disabled:d,selected:!1,onClick:P,title:"Add picture from URL",icon:'<svg><path d="M9.188 16.542V14.938Q8.5 14.938 8.021 14.458Q7.542 13.979 7.542 13.292V12.458L3.583 8.5Q3.5 8.875 3.458 9.25Q3.417 9.625 3.417 10Q3.417 12.5 5.062 14.365Q6.708 16.229 9.188 16.542ZM14.854 14.438Q15.708 13.521 16.146 12.385Q16.583 11.25 16.583 10Q16.583 7.979 15.469 6.313Q14.354 4.646 12.479 3.917V4.229Q12.479 4.917 12 5.396Q11.521 5.875 10.833 5.875H9.188V7.521Q9.188 7.875 8.948 8.115Q8.708 8.354 8.354 8.354H6.708V10H11.646Q12 10 12.24 10.229Q12.479 10.458 12.479 10.812V13.292H13.292Q13.833 13.292 14.26 13.604Q14.688 13.917 14.854 14.438ZM10 18.333Q8.271 18.333 6.75 17.677Q5.229 17.021 4.104 15.896Q2.979 14.771 2.323 13.25Q1.667 11.729 1.667 10Q1.667 8.271 2.323 6.75Q2.979 5.229 4.104 4.104Q5.229 2.979 6.75 2.323Q8.271 1.667 10 1.667Q11.729 1.667 13.25 2.323Q14.771 2.979 15.896 4.104Q17.021 5.229 17.677 6.75Q18.333 8.271 18.333 10Q18.333 11.729 17.677 13.25Q17.021 14.771 15.896 15.896Q14.771 17.021 13.25 17.677Q11.729 18.333 10 18.333Z"/></svg>',children:"Add picture from URL"}),(k||f)&&u&&h.jsx("hr",{}),u&&h.jsxs(h.Fragment,{children:[h.jsx(oi,{withText:!0,type:On,disabled:d,loadFile:j=>{Z(!1),b(j)},img:On.icon,accept:"application/JSON"}),h.jsx(Ce,{withText:!0,disabled:d,type:Ft,img:Ft.icon,isActive:e.id===Ft.id,setActive:L})]}),y&&h.jsx(Ce,{withText:!0,disabled:d,type:Wt,img:Wt.icon,isActive:e.id===Wt.id,setActive:w})]})})]}):null},Ia=({togglePictureUrlModal:e,addPicture:t})=>{const n=v.useRef(null);return v.useEffect(()=>{n.current&&n.current.focus()},[]),h.jsx(Pt,{className:"react-paint-editor-toolbox-pictureinput-modal",onClose:e,title:"Add picture from URL",children:h.jsxs("form",{onSubmit:async s=>{s.preventDefault();const i=n.current?.value;i&&(await t(i),e())},children:[h.jsxs("label",{children:["URL ",h.jsx("input",{type:"text",ref:n})]}),h.jsx(_,{onClick:e,children:"Annuler"}),h.jsx(_,{type:"submit",selected:!0,children:"Ajouter"})]})})},ri="Choose export settings",Da=({toggleExportModal:e,exportCanvasInFile:t})=>{const n=async s=>{t(s),e()};return h.jsxs(Pt,{className:"react-paint-editor-toolbox-export-modal",onClose:e,title:ri,children:[h.jsx("h3",{children:ri}),h.jsx("hr",{}),h.jsx(_,{onClick:()=>n("currentZoom"),children:"Exporter la vue actuelle"}),h.jsx(_,{onClick:()=>n("defaultView"),children:"Exporter le canevas par défaut"}),h.jsx(_,{onClick:()=>n("fitToShapes"),children:"Exporter le dessin entier"}),h.jsx(_,{selected:!0,onClick:e,children:"Annuler"})]})},Na=({activeTool:e,alignment:t,group:n,disabled:s=!1,setActiveToolFromId:i})=>{const a=v.useRef(null),[c,r]=v.useState(!1),[,o]=v.useTransition(),[l,p]=v.useState(void 0),d=g=>{p(g),i(g.id)};if(v.useEffect(()=>{if(!c)return;const g=b=>{!((L,w)=>!!(L.target instanceof Node&&w)&&w.contains(L.target))(b,a.current)&&r(!1)};return document.addEventListener("mousedown",g,{passive:!1}),document.addEventListener("touchstart",g,{passive:!1}),()=>{document.removeEventListener("mousedown",g),document.removeEventListener("touchstart",g)}},[c]),"type"in n)return h.jsx(Ce,{disabled:s,type:n,img:n.icon,isActive:e.id===n.id,setActive:d});if(!n.toolsType.length)return null;if(n.toolsType?.length===1)return h.jsx(Ce,{disabled:s,type:n.toolsType[0],img:n.toolsType[0].icon,isActive:e.id===n.toolsType[0].id,setActive:d});const u=n?.toolsType.find(g=>g.type===e.type)!==void 0,y=(l?l.icon:n.toolsType?.[0]?.icon)??n.title;return h.jsxs("div",{className:"react-paint-editor-toolbargroup-relative",children:[h.jsx(_,{selected:u,title:n.title,disabled:s,onClick:()=>{l?i(l.id):n.toolsType?.[0]&&d(n.toolsType[0]),o(()=>{r(!0)})},icon:y}),c&&h.jsx(Ue,{alignment:t,position:"top",children:h.jsx("div",{className:"react-paint-editor-toolbargroup-panel-content","data-vertical":+n.vertical,ref:a,children:n.toolsType.map(g=>h.jsx(Ce,{disabled:s,type:g,img:g.icon,isActive:e.id===g.id,setActive:d},g.id))})})]})},Wa=[{title:"brush",toolsType:["brush"],vertical:!1},{title:"lines",toolsType:["line","curve","polygon"],vertical:!1},{title:"shapes",toolsType:["rect","square","circle","ellipse"],vertical:!1},"text"],Fa=({settings:e,width:t,activeTool:n,hasActionToUndo:s=!1,hasActionToRedo:i=!1,hasActionToClear:a=!1,withLoadAndSave:c,withExport:r,clearCanvas:o,setActiveTool:l,undoAction:p,redoAction:d,addPicture:u,loadFile:y,saveFile:g,exportCanvasInFile:b,availableTools:P,withUrlPicture:L,withUploadPicture:w})=>{const k=((V,m)=>{const C=m.flatMap(Q=>{if(typeof Q!="object")return V.filter(M=>M.type===Q);const H=V.filter(M=>Q.toolsType.includes(M.type));return H?{...Q,toolsType:H}:null});return cn(C)})(P,Wa),f=!e.features.edition,x=t<40*(6+k.length),Z=t<40*(3+k.length),[R,T]=v.useState(!1),[S,j]=v.useState(!1),[I,A]=v.useState(!1),E=()=>{T(V=>!V)},W=()=>{A(V=>!V)},B=V=>{l(V),T(!1)},$=V=>{B(P.find(m=>m.id===V)??n)},G=P.find(V=>V.type===n.type)!==void 0;return h.jsxs(h.Fragment,{children:[h.jsxs("div",{className:"react-paint-editor-toolbar-toolbox",style:{"--react-paint-editor-toolbar-minwidth":"160px"},children:[h.jsxs("div",{className:"react-paint-editor-toolbar-shrinkable",children:[h.jsx(Ce,{type:Ee,disabled:f,img:Ee.icon,isActive:n.id===Ee.id,setActive:B}),(e.size==="infinite"||e.features.zoom)&&h.jsx(Ce,{type:Ot,disabled:f,img:Ot.icon,isActive:n.id===Ot.id,setActive:B}),Z?h.jsx(_,{disabled:f,onClick:E,title:"Toggle tools",icon:'<svg><path d="M5.333 9.292 10.021 1.646 14.708 9.292ZM14.562 18.333Q13 18.333 11.896 17.229Q10.792 16.125 10.792 14.562Q10.792 13 11.896 11.896Q13 10.792 14.562 10.792Q16.125 10.792 17.229 11.896Q18.333 13 18.333 14.562Q18.333 16.125 17.229 17.229Q16.125 18.333 14.562 18.333ZM2.5 17.917V11.188H9.229V17.917ZM14.562 16.583Q15.438 16.583 16.01 16.01Q16.583 15.438 16.583 14.562Q16.583 13.688 16.01 13.115Q15.438 12.542 14.562 12.542Q13.688 12.542 13.115 13.115Q12.542 13.688 12.542 14.562Q12.542 15.438 13.115 16.01Q13.688 16.583 14.562 16.583ZM4.25 16.167H7.479V12.938H4.25ZM8.458 7.542H11.583L10.021 5ZM10.021 7.542ZM7.479 12.938ZM14.562 14.562Q14.562 14.562 14.562 14.562Q14.562 14.562 14.562 14.562Q14.562 14.562 14.562 14.562Q14.562 14.562 14.562 14.562Q14.562 14.562 14.562 14.562Q14.562 14.562 14.562 14.562Q14.562 14.562 14.562 14.562Q14.562 14.562 14.562 14.562Z"/></svg>',selected:G}):k.map(V=>h.jsx(Na,{disabled:f,activeTool:n,group:V,setActiveToolFromId:$},"id"in V?V.id:V.title))]}),!x&&h.jsxs(h.Fragment,{children:[h.jsx(Ce,{type:Je,disabled:f||!s,img:Je.icon,isActive:n.id===Je.id,setActive:p}),h.jsx(Ce,{type:et,disabled:f||!i,img:et.icon,isActive:n.id===et.id,setActive:d}),h.jsx(Ce,{type:tt,disabled:f||!a,img:tt.icon,isActive:n.id===tt.id,setActive:o})]}),h.jsx(Ra,{withActionsInMenu:x,disabled:f,vertical:!0,alignment:"right",group:{title:"Menu",img:'<svg><path d="M2.5 15V13.25H17.5V15ZM2.5 10.875V9.125H17.5V10.875ZM2.5 6.75V5H17.5V6.75Z"/></svg>'},activeTool:n,addPicture:u,loadFile:y,saveFile:g,togglePictureUrlModal:()=>{j(!0)},toggleExportModal:W,withUploadPicture:w,withUrlPicture:L,withLoadAndSave:c,withExport:r,hasActionToUndo:s,hasActionToRedo:i,hasActionToClear:a,undoAction:p,redoAction:d,clearCanvas:o})]}),R&&h.jsx(Pt,{className:"react-paint-editor-toolbar-modal",onClose:E,title:"Outils",children:P.map(V=>V.type==="picture"?null:h.jsx(Ce,{disabled:f,type:V,img:V.icon,withText:!1,isActive:n.id===V.id,setActive:B},V.id))}),S&&h.jsx(Ia,{togglePictureUrlModal:()=>{j(V=>!V)},addPicture:u}),I&&h.jsx(Da,{toggleExportModal:W,exportCanvasInFile:b})]})},Tt={none:0,small:10,medium:20,large:40},Oa={toolbarBackgroundColor:"white",dividerColor:"#36418129",fontRadius:8,fontDisabledColor:"#3641812b",fontDisabledBackgroundColor:"transparent",fontColor:"#364181",fontBackgroundColor:"transparent",fontSelectedColor:"white",fontSelectedBackgroundColor:"#364181",fontHoverColor:"#364181",fontHoverBackgroundColor:"#afd8d8"},Ba=()=>{const e=v.useRef([]),[t,n]=v.useState([]);return v.useEffect(()=>()=>{for(const s of e.current)clearTimeout(s)},[]),{snackbarList:t,addSnackbar:({type:s=xa,duration:i=ba,text:a})=>{const c={id:le("snackbar_"),duration:i,type:s,text:a};n(r=>[...r,c]),e.current=[...e.current,setTimeout(()=>{return r=c.id,void n(o=>o.filter(l=>l.id!==r));var r},i)]}}};Ae.Canvas=({options:e,className:t,style:n,canvasProps:s})=>{const{shapesRef:i,selectedShape:a,selectionFrame:c,hoveredShape:r,addShape:o,setSelectedShape:l,setSelectionFrame:p,refreshSelectedShapes:d,refreshHoveredShape:u,duplicateShapes:y,removeShape:g,updateShape:b,backwardShape:P,forwardShape:L,saveShapes:w,refs:k,width:f,height:x,settings:Z,setCanvasSize:R,setCanvasOffset:T,selectShapes:S,activeTool:j,setActiveTool:I,isInsideComponent:A,isInsideCanvas:E,isEditMode:W,canvas:{withSkeleton:B,withFrameSelection:$,canGrow:G,canShrink:V},canvasOffsetStartData:m,setCanvasOffsetStartData:C,selectionMode:Q,setSelectionMode:H,setCanvasMoveAcceleration:M,isShiftPressed:F,isAltPressed:D,isSpacePressed:O,setShiftPressed:z,setAltPressed:te,setCanvasZoom:re,resetZoom:se,setIsSpacePressed:q}=s,{canvasBackgroundColor:N,canvasSelectionColor:ie,canvasSelectionWidth:ne}={...mi,...e},ge=v.useRef(null),we=v.useCallback(K=>{o(K),S(K)},[o,S]),ce=v.useCallback(K=>{R({realWidth:f,realHeight:x,width:K,height:x*K/f,scaleRatio:K/f})},[f,x,R]);return ya({isInsideComponent:A,isInsideCanvas:E,isEditingText:Q.mode==="textedition",settings:Z,selectedShape:a,setSelectedShape:l,removeShape:g,pasteShapes:we,updateShapes:b,backwardShape:P,forwardShape:L,setShiftPressed:z,setAltPressed:te,setActiveTool:I,setSelectionMode:H,setSelectionFrame:p,setCanvasZoom:re,resetZoom:se,setIsSpacePressed:q}),(({onResized:K,element:de})=>{v.useEffect(()=>{const Y=de.current;if(!Y)return;const fe=new ResizeObserver(ze=>{const Ve=ze?.[0]?.borderBoxSize?.[0],{width:ee,height:ue}=Ve?{width:Ve.inlineSize,height:Ve.blockSize}:ze?.[0]?.contentRect??{};ee!==void 0&&ue!==void 0&&K(ee,ue)});return fe.observe(Y),()=>{fe.unobserve(Y)}},[de,K])})({element:ge,onResized:ce}),h.jsx("div",{ref:ge,className:"react-paint-app-row"+(t?` ${t}`:""),"data-grow":G,"data-shrink":V,style:{"--react-paint-app-row-width":Z.canvasSize.width,"--react-paint-app-canvaswidth":f,"--react-paint-app-canvasheight":x,"--react-paint-app-row-aspectratio":`calc(${Z.canvasSize.width} / ${Z.canvasSize.height})`,"--react-paint-app-canvas-bg":N,...n},children:h.jsx(ra,{duplicateShapes:y,isSpacePressed:O,ref:k.canvas,canGrow:G,isInsideComponent:A,activeTool:j,setActiveTool:I,canvasOffsetStartData:m,setCanvasOffsetStartData:C,shapes:i.current,addShapes:o,updateSingleShape:b,selectedShape:a,selectionFrame:c,setSelectedShape:l,setSelectionFrame:p,hoveredShape:r,refreshHoveredShape:u,refreshSelectedShapes:d,settings:Z,setCanvasOffset:T,saveShapes:w,selectionMode:Q,setSelectionMode:H,setCanvasMoveAcceleration:M,selectionColor:ie,selectionWidth:ne,isEditMode:W,isShiftPressed:F,isAltPressed:D,withFrameSelection:$,withSkeleton:B})})},Ae.Editor=({editorProps:e,className:t,style:n,options:s,children:i})=>{const{shapesRef:a,addPictureShape:c,moveShapes:r,toggleShapeVisibility:o,toggleShapeLock:l,canGoBackward:p,canGoForward:d,canClear:u,selectedShape:y,removeShape:g,updateShape:b,backwardShape:P,forwardShape:L,refs:w,width:k,height:f,selectTool:x,selectShapes:Z,activeTool:R,setActiveTool:T,setAvailableTools:S,isEditMode:j,availableTools:I,gridGap:A,setGridGap:E,loadFile:W,exportPicture:B,exportData:$,clearCanvas:G,settings:V,setCanvasZoom:m,saveShapes:C,canvas:{canGrow:Q,layersManipulation:H,withExport:M,withLoadAndSave:F,withUploadPicture:D,withUrlPicture:O}}=e,{toolbarBackgroundColor:z,dividerColor:te,fontRadius:re,fontDisabledColor:se,fontDisabledBackgroundColor:q,fontColor:N,fontBackgroundColor:ie,fontSelectedColor:ne,fontSelectedBackgroundColor:ge,fontHoverColor:we,fontHoverBackgroundColor:ce}={...Oa,...s},K=V.size==="infinite"||V.features.zoom,[de,Y]=v.useState(!1),[fe,ze]=v.useState(!1),[Ve,ee]=v.useState(K),ue=K&&Ve,Ie=A>=Tt.large?"large":A>=Tt.medium?"medium":A>=Tt.small?"small":"none",{snackbarList:De,addSnackbar:Me}=Ba(),Xe=v.useCallback((he,pe,ft)=>{S(Fe=>Fe.map(ut=>ut.id===he?be(["settings",pe,"default"],ft,ut):ut)),T(Fe=>Fe.id===he?be(["settings",pe,"default"],ft,Fe):Fe)},[T,S]),pn=v.useCallback(he=>{Y(!0);try{B(he)}catch(pe){pe instanceof Error&&Me({type:"error",text:`L'export a échoué : ${pe.message}`}),console.warn(pe)}finally{Y(!1)}},[B,Me]),Ge=v.useCallback(()=>{Y(!0);try{$(),Y(!1)}catch(he){he instanceof Error&&Me({type:"error",text:"L'enregistrement a échoué"}),console.warn(he)}finally{Y(!1)}},[$,Me]),gn=v.useCallback(async he=>{Y(!0);try{await W(he),Me({type:"success",text:"Fichier chargé !"})}catch(pe){pe instanceof Error&&Me({type:"error",text:"Le chargement a échoué"}),console.warn(pe)}finally{Y(!1)}},[W,Me]),fn=v.useCallback(async he=>{Y(!0);try{const pe=await c(he,k,f);Z([pe])}catch(pe){pe instanceof Error&&Me({type:"error",text:"Le chargement a échoué"}),console.warn(pe)}finally{Y(!1)}},[c,Z,Me,k,f]),vn=`${t?`${t} `:""}${fe?"react-paint-editor-layout-opened ":""}react-paint-editor-app`;return h.jsxs("div",{ref:w.setEditor,className:vn,style:{"--react-paint-editor-app-maxWidth":Q?"100%":`${k}px`,"--react-paint-editor-app-toolbar-bg":z,"--react-paint-editor-app-divider-color":te,"--react-paint-editor-app-font-radius":re,"--react-paint-editor-app-font-disabled-color":se,"--react-paint-editor-app-font-disabled-bg":q,"--react-paint-editor-app-font-color":N,"--react-paint-editor-app-font-bg":ie,"--react-paint-editor-app-font-selected-color":ne,"--react-paint-editor-app-font-selected-bg":ge,"--react-paint-editor-app-font-hover-color":we,"--react-paint-editor-app-font-hover-bg":ce,...n},children:[j&&h.jsx(Fa,{settings:V,width:V.canvasSize.width,activeTool:R,clearCanvas:G,setActiveTool:x,exportCanvasInFile:pn,saveFile:Ge,loadFile:gn,addPicture:fn,hasActionToUndo:p,hasActionToRedo:d,hasActionToClear:u,undoAction:P,redoAction:L,availableTools:I,withExport:M,withLoadAndSave:F,withUploadPicture:D,withUrlPicture:O}),i,j&&H&&h.jsx(Pa,{gridFormat:Ie,setGridFormat:he=>{E(Tt[he])},shapes:a.current,moveShapes:r,selectedShapes:y,removeShape:g,selectShapes:Z,toggleShapeVisibility:o,toggleShapeLock:l,isLayoutPanelShown:fe,settings:V}),ue&&h.jsxs(Ue,{alignment:"left",className:"react-paint-editor-layouts-panel","data-edit":+j,children:[h.jsx(_,{className:"react-paint-editor-zoom-button",icon:'<svg viewBox="0 -960 960 960" width="24px"><path d="M784-120 532-372q-30 24-69 38t-83 14q-109 0-184.5-75.5T120-580q0-109 75.5-184.5T380-840q109 0 184.5 75.5T640-580q0 44-14 83t-38 69l252 252-56 56ZM380-400q75 0 127.5-52.5T560-580q0-75-52.5-127.5T380-760q-75 0-127.5 52.5T200-580q0 75 52.5 127.5T380-400ZM280-540v-80h200v80H280Z"/></svg>',onClick:()=>m("unzoom")}),h.jsxs(_,{className:"react-paint-editor-zoom-button react-paint-editor-zoom-button-value",onClick:()=>m("default"),children:[Math.round(100*V.canvasZoom),"%"]}),h.jsx(_,{className:"react-paint-editor-zoom-button",icon:Vn,onClick:()=>m("zoom")})]}),j&&h.jsxs(h.Fragment,{children:[h.jsx(Ea,{saveShapes:C,setCanvasZoom:m,width:V.canvasSize.width,activeTool:R,availableTools:I,selectedShape:y,settings:V,removeShape:g,updateShape:b,canvas:w.canvas.current,layersManipulation:H,toggleLayoutPanel:()=>{ze(he=>!he)},isZoomPanelShown:ue,setIsZoomPanelShown:ee,updateToolSettings:Xe}),h.jsx(Sa,{isLoading:de}),h.jsx(Ca,{snackbarList:De})]})]})},Ae.useReactPaint=({width:e=1e3,height:t=600,shapes:n,mode:s="editor",disabled:i=!1,options:a=_n}={})=>{const{layersManipulation:c,brushAlgo:r,isBrushShapeDoneOnMouseUp:o,debug:l,grid:p,canGrow:d,canShrink:u,withExport:y,withLoadAndSave:g,withUploadPicture:b,withUrlPicture:P,withSkeleton:L,withFrameSelection:w,clearCallback:k,availableTools:f,canvasSelectionPadding:x,size:Z,canZoom:R}={..._n,...a},T=s!=="viewer",S=v.useRef(null),j=v.useRef(null),I=v.useRef(!1),A=v.useCallback(J=>{S.current=J},[]),[E,W]=v.useState(void 0),[B,$]=v.useState(Ee),[G,V]=v.useState({mode:"default"}),[m,C]=v.useState(p),[Q,H]=v.useState({realWidth:e,realHeight:t,width:e,height:t,scaleRatio:1}),M=R==="always"&&!i,{canvasTransformation:F,setCanvasTransformation:D,setCanvasOffset:O,setCanvasZoom:z,resetZoom:te}=sa({canvasSize:Q,size:Z,canvasElt:j.current,zoomEnabled:M}),{offset:re,zoom:se}=F,q=v.useMemo(()=>({brushAlgo:r,isBrushShapeDoneOnMouseUp:o,debug:l,canvasSize:{realWidth:Q.realWidth,realHeight:Q.realHeight,width:Q.width,height:Q.height,scaleRatioWithNoZoom:Q.scaleRatio,scaleRatio:Q.scaleRatio*se},size:Z,canvasOffset:re,canvasZoom:se,gridGap:m,selectionPadding:x,features:{edition:T&&!i,zoom:M}}),[x,m,r,o,l,se,re,Q,Z,i,M,T]),[N,ie]=v.useState($s(f,b||P)),{isInsideComponent:ne,isInsideCanvas:ge}=(({settings:J,componentRef:ae,canvasRef:ke})=>{const[Oe,Be]=v.useState(!1),[_e,Ke]=v.useState(!1),ve=!J.features.edition&&!J.features.zoom;return v.useEffect(()=>{if(!ve){const Pe=()=>Be(!0),zt=()=>Be(!1),$e=()=>Ke(!0),At=()=>Ke(!1);return ae.current?.addEventListener("focusin",Pe),ae.current?.addEventListener("focusout",zt),ke.current?.addEventListener("focusin",$e),ke.current?.addEventListener("focusout",At),()=>{ae.current?.removeEventListener("focusin",Pe),ae.current?.removeEventListener("focusout",zt),ke.current?.removeEventListener("focusin",$e),ke.current?.removeEventListener("focusout",At)}}Be(!1),Ke(!1)},[ve,ae,ke]),{isInsideComponent:Oe,isInsideCanvas:_e}})({settings:q,componentRef:S,canvasRef:j}),[we,ce]=v.useState(!1),[K,de]=v.useState(!1),[Y,fe]=v.useState(!1),{registerEvent:ze,unregisterEvent:Ve,shapesRef:ee,selectedShape:ue,selectionFrame:Ie,hoveredShape:De,addShapes:Me,addPictureShape:Xe,moveShapes:pn,setSelectedShape:Ge,setSelectionFrame:gn,refreshSelectedShapes:fn,refreshHoveredShape:vn,duplicateShapes:he,removeShape:pe,updateShape:ft,backwardShape:Fe,forwardShape:ut,clearShapes:li,saveShapes:ci,toggleShapeVisibility:$a,toggleShapeLock:Ya,canGoBackward:Ua,canGoForward:Xa,canClear:Ga}=ta(q,e,t,we),mn=v.useCallback(J=>{Ge(void 0),$(J)},[Ge]),[ht,di]=v.useState([0,0]),ui=G.mode==="preview";v.useEffect(()=>{if(ui)return()=>V(J=>J.mode==="preview"?{mode:"default"}:J)},[ue?.id,ui]);const hi=G.mode==="selectionFrame";v.useEffect(()=>{if(hi)return()=>di([0,0])},[hi]),v.useEffect(()=>{if(ht[0]!==0||ht[1]!==0){const J=setInterval(()=>{D(({offset:ae,zoom:ke})=>{const Oe=[ae[0]-ht[0],ae[1]-ht[1]];return en({zoom:ke,size:Z,canvasSize:Q,newOffset:Oe})})},20);return()=>clearInterval(J)}},[ht[0],ht[1],D,Z,Q]);const Ht=v.useCallback((J,ae)=>{li(J,ae),mn(Ee),D({offset:[0,0],zoom:1})},[mn,li,D]),pi=v.useCallback(J=>{Ge(ae=>(ae?.id!==J.map(ke=>ke.id).join("-")&&$(Ee),xe(J,q)))},[Ge,q]),qa=v.useCallback(()=>{const J=Ji(ee.current,e,t);if(!J)throw new Error("L'encodage a échoué");Ns(J,"drawing.json")},[ee,e,t]),_a=v.useCallback(J=>{const ae=Ws({shapes:ee.current,settings:q,view:J});Ns(ae,"drawing.png")},[ee,q]),Ka=v.useCallback(J=>Ws({shapes:ee.current,settings:q,view:J}),[ee,q]),Ja=v.useCallback(()=>un(ee.current,e,t),[ee,e,t]),qe=v.useCallback(async(J,ae)=>{const ke=await(async(Oe,Be)=>{if(!Oe)return[];const _e=[],Ke=cn(Oe.map(ve=>{if(!ve||!Xn.includes(ve.type))return null;if(ve.type==="picture"){const Pe=new Image,zt=new Promise(($e,At)=>{Pe.onload=()=>{URL.revokeObjectURL(Pe.src),$e()},Pe.onerror=()=>{At(new Error("Some images could not be loaded"))}});if(_e.push(zt),ve.src.startsWith("http"))Ds(ve.src).then($e=>{Pe.src=$e}).catch(()=>{Pe.src=""});else if(ve.src.includes("<svg")){const $e=new Blob([ve.src],{type:"image/svg+xml"});Pe.src=URL.createObjectURL($e)}else Pe.src=ve.src;return Fs({...ve,img:Pe},Be)}return Fs(ve,Be)}));return await Promise.all(_e),Ke})(J,q);Ht(ke,ae)},[Ht,q]),yn=v.useRef(qe);yn.current=qe;const eo=v.useCallback((J=[],ae=!0)=>{yn.current?.(J,{clearHistory:ae,source:"remote"})},[]);v.useEffect(()=>{I.current||(I.current=!0,n&&yn.current?.(n,{clearHistory:!0,source:"remote"}))},[n]);const to=v.useCallback(async J=>{const ae=await(async ke=>new Promise((Oe,Be)=>{const _e=new FileReader;_e.onload=Ke=>{const ve=Ke.target?.result;if(!ve)return Be("Impossible de récupérer les données du fichier");const Pe=JSON.parse(ve);Oe(Pe)},_e.readAsText(ke)}))(J);await qe(ae.shapes??[],{clearHistory:!0,source:"remote"})},[qe]),no=v.useCallback(()=>{typeof k!="string"?qe(k(),{clearHistory:!1,source:"user"}):k==="defaultShapes"&&n!==void 0?qe(n,{clearHistory:!1,source:"user"}):Ht([],{clearHistory:!1,source:"user"})},[Ht,qe,n,k]);v.useEffect(()=>{ie($s(f,b||P))},[f,b,P]);const gi={canvas:j,editor:S,setEditor:A};return{annotationsProps:{style:{userSelect:"none",touchAction:"none",transformOrigin:"left top",transform:"scale(var(--react-paint-canvas-zoom)) translate(calc(var(--react-paint-canvas-offset-x) * 100% / var(--react-paint-app-canvaswidth)), calc(var(--react-paint-canvas-offset-y) * 100% / var(--react-paint-app-canvasheight)))","--react-paint-canvas-zoom":q.canvasZoom,"--react-paint-canvas-offset-x":q.canvasOffset[0],"--react-paint-canvas-offset-y":q.canvasOffset[1],"--react-paint-app-canvaswidth":e,"--react-paint-app-canvasheight":t}},editorProps:{shapesRef:ee,addPictureShape:Xe,moveShapes:pn,toggleShapeVisibility:$a,toggleShapeLock:Ya,canGoBackward:Ua,canGoForward:Xa,canClear:Ga,selectedShape:ue,saveShapes:ci,removeShape:pe,updateShape:ft,backwardShape:Fe,forwardShape:ut,refs:gi,width:e,height:t,selectTool:mn,selectShapes:pi,activeTool:B,setActiveTool:$,setAvailableTools:ie,isEditMode:T,availableTools:N,gridGap:m,setGridGap:C,loadFile:to,exportPicture:_a,exportData:qa,clearCanvas:no,settings:q,setCanvasZoom:z,resetZoom:te,canvas:{canGrow:d,canShrink:u,layersManipulation:c,withExport:y,withLoadAndSave:g,withUploadPicture:b,withUrlPicture:P}},canvasProps:{shapesRef:ee,selectedShape:ue,selectionFrame:Ie,hoveredShape:De,addShape:Me,setSelectedShape:Ge,setSelectionFrame:gn,refreshSelectedShapes:fn,refreshHoveredShape:vn,removeShape:pe,updateShape:ft,duplicateShapes:he,backwardShape:Fe,forwardShape:ut,saveShapes:ci,refs:gi,width:e,height:t,settings:q,setCanvasSize:H,setCanvasOffset:O,setCanvasZoom:z,resetZoom:te,selectShapes:pi,activeTool:B,setActiveTool:$,isInsideComponent:ne,isInsideCanvas:ge,isEditMode:T,canvas:{withSkeleton:L,withFrameSelection:w,canGrow:d,canShrink:u},canvasOffsetStartData:E,setCanvasOffsetStartData:W,selectionMode:G,setSelectionMode:V,setCanvasMoveAcceleration:di,isShiftPressed:we,isAltPressed:K,isSpacePressed:Y,setShiftPressed:ce,setAltPressed:de,setIsSpacePressed:fe},registerEvent:ze,unregisterEvent:Ve,resetCanvas:eo,resetZoom:te,getCurrentImage:Ka,getCurrentData:Ja,setCanvasOffset:O,setCanvasZoom:z}},Object.defineProperty(Ae,Symbol.toStringTag,{value:"Module"})});
|
|
1
|
+
(function(Re,y){typeof exports=="object"&&typeof module<"u"?y(exports,require("react"),require("react/jsx-runtime")):typeof define=="function"&&define.amd?define(["exports","react","react/jsx-runtime"],y):y((Re=typeof globalThis<"u"?globalThis:Re||self)["react-paint"]={},Re.React,Re.jsxRuntime)})(this,function(Re,y,h){"use strict";const Sn='<svg><path d="M5.146 17.5Q4.146 17.5 3.208 17Q2.271 16.5 1.667 15.708Q2.208 15.75 2.802 15.344Q3.396 14.938 3.396 14.104Q3.396 13.042 4.135 12.292Q4.875 11.542 5.958 11.542Q7.021 11.542 7.76 12.292Q8.5 13.042 8.5 14.104Q8.5 15.5 7.51 16.5Q6.521 17.5 5.146 17.5ZM9.917 12.5 7.562 10.146 14.917 2.729Q15.146 2.5 15.469 2.5Q15.792 2.5 16.021 2.729L17.271 3.958Q17.5 4.188 17.5 4.531Q17.5 4.875 17.271 5.125Z"/></svg>',It='<svg><path d="M2.5 17.5V2.5H17.5V17.5ZM4.25 15.75H15.75V4.25H4.25ZM4.25 15.75V4.25V15.75Z"/></svg>',Wt='<svg><path d="M10 18.333Q8.271 18.333 6.75 17.677Q5.229 17.021 4.104 15.896Q2.979 14.771 2.323 13.25Q1.667 11.729 1.667 10Q1.667 8.271 2.323 6.75Q2.979 5.229 4.104 4.104Q5.229 2.979 6.75 2.323Q8.271 1.667 10 1.667Q11.729 1.667 13.25 2.323Q14.771 2.979 15.896 4.104Q17.021 5.229 17.677 6.75Q18.333 8.271 18.333 10Q18.333 11.729 17.677 13.25Q17.021 14.771 15.896 15.896Q14.771 17.021 13.25 17.677Q11.729 18.333 10 18.333ZM10 16.583Q12.75 16.583 14.667 14.667Q16.583 12.75 16.583 10Q16.583 7.25 14.667 5.333Q12.75 3.417 10 3.417Q7.25 3.417 5.333 5.333Q3.417 7.25 3.417 10Q3.417 12.75 5.333 14.667Q7.25 16.583 10 16.583ZM10 10Q10 10 10 10Q10 10 10 10Q10 10 10 10Q10 10 10 10Q10 10 10 10Q10 10 10 10Q10 10 10 10Q10 10 10 10Z"/></svg>',Nt='<svg><path d="M12.25 18.333V16.167L6.833 13.458H2.5V8.208H6.25L8.25 5.917V1.667H13.5V6.917H9.708L7.75 9.146V11.958L12.25 14.208V13.083H17.5V18.333Z"/></svg>',xn='<svg><path d="M4.125 5.083V3.333H7.062L7.896 2.5H12.104L12.938 3.333H15.875V5.083ZM6.75 17.5Q6.021 17.5 5.51 16.99Q5 16.479 5 15.75V5.958H15V15.75Q15 16.479 14.49 16.99Q13.979 17.5 13.25 17.5Z"/></svg>',Qn='<svg><path d="M10 17.5Q7.208 17.5 5.271 15.594Q3.333 13.688 3.333 10.958Q3.333 9.583 3.854 8.396Q4.375 7.208 5.292 6.292L10 1.667L14.688 6.292Q15.604 7.208 16.135 8.396Q16.667 9.583 16.667 10.958Q16.667 13.688 14.719 15.594Q12.771 17.5 10 17.5ZM5.146 11.667H14.854Q15.083 10.188 14.552 9.146Q14.021 8.104 13.479 7.562L10 4.125L6.521 7.562Q5.979 8.104 5.448 9.146Q4.917 10.188 5.146 11.667Z"/></svg>',Ft='<svg><path d="M4.792 15.083 8.333 11.542 9.833 13.021 11.667 10.708 15.167 15.083ZM6.667 8.417Q5.938 8.417 5.427 7.906Q4.917 7.396 4.917 6.667Q4.917 5.938 5.427 5.427Q5.938 4.917 6.667 4.917Q7.396 4.917 7.906 5.427Q8.417 5.938 8.417 6.667Q8.417 7.396 7.906 7.906Q7.396 8.417 6.667 8.417ZM4.167 18.333Q3.125 18.333 2.396 17.604Q1.667 16.875 1.667 15.833V4.167Q1.667 3.125 2.396 2.396Q3.125 1.667 4.167 1.667H15.833Q16.875 1.667 17.604 2.396Q18.333 3.125 18.333 4.167V15.833Q18.333 16.875 17.604 17.604Q16.875 18.333 15.833 18.333ZM4.167 16.583H15.833Q16.146 16.583 16.365 16.365Q16.583 16.146 16.583 15.833V4.167Q16.583 3.854 16.365 3.635Q16.146 3.417 15.833 3.417H4.167Q3.854 3.417 3.635 3.635Q3.417 3.854 3.417 4.167V15.833Q3.417 16.146 3.635 16.365Q3.854 16.583 4.167 16.583Z"/></svg>',bn='<svg><path d="M8.708 16.667V5.917H4.167V3.333H15.833V5.917H11.292V16.667Z"/></svg>',wn='<svg><path d="M7.5 15.833V14.083H12.833L3.333 4.583L4.583 3.333L14.083 12.833V7.5H15.833V15.833Z"/></svg>',Cn='<svg><path d="M7.521 17.5Q6.125 17.5 5.146 16.51Q4.167 15.521 4.167 14.125V7.417Q3.438 7.125 2.969 6.49Q2.5 5.854 2.5 5.042Q2.5 3.979 3.24 3.24Q3.979 2.5 5.042 2.5Q6.104 2.5 6.844 3.24Q7.583 3.979 7.583 5.042Q7.583 5.854 7.115 6.49Q6.646 7.125 5.917 7.417V14.125Q5.917 14.792 6.385 15.271Q6.854 15.75 7.521 15.75Q8.188 15.75 8.656 15.271Q9.125 14.792 9.125 14.125V5.875Q9.125 4.479 10.104 3.49Q11.083 2.5 12.479 2.5Q13.875 2.5 14.854 3.49Q15.833 4.479 15.833 5.875V12.583Q16.562 12.875 17.031 13.51Q17.5 14.146 17.5 14.958Q17.5 16.021 16.76 16.76Q16.021 17.5 14.958 17.5Q13.896 17.5 13.156 16.76Q12.417 16.021 12.417 14.958Q12.417 14.146 12.885 13.5Q13.354 12.854 14.083 12.583V5.875Q14.083 5.208 13.615 4.729Q13.146 4.25 12.479 4.25Q11.812 4.25 11.344 4.729Q10.875 5.208 10.875 5.875V14.125Q10.875 15.521 9.896 16.51Q8.917 17.5 7.521 17.5Z"/></svg>',Mn='<svg><path d="M5.833 15V3.333H10.375Q11.812 3.333 12.885 4.156Q13.958 4.979 13.958 6.375Q13.958 7.375 13.49 7.969Q13.021 8.562 12.396 8.875V9.042Q13.312 9.354 13.844 10.021Q14.375 10.688 14.375 11.75Q14.375 13.312 13.229 14.156Q12.083 15 10.5 15ZM8.125 8.042H10.188Q10.854 8.042 11.302 7.656Q11.75 7.271 11.75 6.708Q11.75 6.167 11.302 5.771Q10.854 5.375 10.188 5.375H8.125ZM8.125 12.917H10.354Q11.167 12.917 11.625 12.51Q12.083 12.104 12.083 11.458Q12.083 10.812 11.625 10.406Q11.167 10 10.354 10H8.125Z"/></svg>',kn='<svg><path d="M4.167 16.667V14.083H6.979L10.229 5.917H7.5V3.333H15.833V5.917H13.021L9.771 14.083H12.5V16.667Z"/></svg>',Pn='<svg><path d="M3.021 16V15H17V16ZM3.021 13.5V12H17V13.5ZM3 10.5V8.5H16.979V10.5ZM3.021 7V4H17V7Z"/></svg>',jn='<svg><path d="M16.354 18.833 14.521 17Q13.542 17.646 12.396 17.99Q11.25 18.333 10 18.333Q8.271 18.333 6.75 17.677Q5.229 17.021 4.104 15.896Q2.979 14.771 2.323 13.25Q1.667 11.729 1.667 10Q1.667 8.729 2.01 7.594Q2.354 6.458 3 5.458L1.167 3.625L2.396 2.396L17.583 17.604ZM10 16.583Q10.896 16.583 11.708 16.365Q12.521 16.146 13.25 15.729L4.292 6.75Q3.875 7.479 3.646 8.292Q3.417 9.104 3.417 10Q3.417 12.729 5.344 14.656Q7.271 16.583 10 16.583ZM17 14.562 15.708 13.271Q16.125 12.542 16.354 11.719Q16.583 10.896 16.583 10Q16.583 7.271 14.656 5.344Q12.729 3.417 10 3.417Q9.104 3.417 8.292 3.646Q7.479 3.875 6.75 4.292L5.458 3Q6.458 2.354 7.594 2.01Q8.729 1.667 10 1.667Q11.729 1.667 13.25 2.323Q14.771 2.979 15.896 4.104Q17.021 5.229 17.677 6.75Q18.333 8.271 18.333 10Q18.333 11.271 17.979 12.417Q17.625 13.562 17 14.562ZM11.229 8.771Q11.229 8.771 11.229 8.771Q11.229 8.771 11.229 8.771Q11.229 8.771 11.229 8.771Q11.229 8.771 11.229 8.771Q11.229 8.771 11.229 8.771Q11.229 8.771 11.229 8.771ZM8.771 11.229Q8.771 11.229 8.771 11.229Q8.771 11.229 8.771 11.229Q8.771 11.229 8.771 11.229Q8.771 11.229 8.771 11.229Q8.771 11.229 8.771 11.229Q8.771 11.229 8.771 11.229Z"/></svg>',Ln='<svg><path d="M16.354 18.833 14.521 17Q13.542 17.646 12.396 17.99Q11.25 18.333 10 18.333Q8.271 18.333 6.75 17.677Q5.229 17.021 4.104 15.896Q2.979 14.771 2.323 13.25Q1.667 11.729 1.667 10Q1.667 8.729 2.01 7.594Q2.354 6.458 3 5.458L1.167 3.625L2.396 2.396L17.583 17.604ZM17 14.562 5.458 3Q6.458 2.354 7.594 2.01Q8.729 1.667 10 1.667Q11.729 1.667 13.25 2.323Q14.771 2.979 15.896 4.104Q17.021 5.229 17.677 6.75Q18.333 8.271 18.333 10Q18.333 11.271 17.979 12.417Q17.625 13.562 17 14.562Z"/></svg>',Vn='<svg viewBox="0 -960 960 960" width="24px"><path d="M784-120 532-372q-30 24-69 38t-83 14q-109 0-184.5-75.5T120-580q0-109 75.5-184.5T380-840q109 0 184.5 75.5T640-580q0 44-14 83t-38 69l252 252-56 56ZM380-400q75 0 127.5-52.5T560-580q0-75-52.5-127.5T380-760q-75 0-127.5 52.5T200-580q0 75 52.5 127.5T380-400Zm-40-60v-80h-80v-80h80v-80h80v80h80v80h-80v80h-80Z"/></svg>',Se=["transparent","black","white","red","green","blue","yellow"],Ne=[0,1,2],Zn=[[1,0],[1,2],[4,6]],pt="serif",ha=2,Hn=3,pa=4,oe="react-paint-",zn={strokeColor:{values:Se,default:"black"},fillColor:{values:Se,default:"transparent"},opacity:{min:0,max:100,step:1,default:100},lineWidth:{min:1,max:20,step:1,default:1},lineDash:{values:Ne,default:0}},Ot={type:"picture",id:`${oe}picture`,icon:Ft,label:"Image",settings:{opacity:{min:0,max:100,step:1,default:100}}},Tn={type:"brush",id:`${oe}brush`,icon:Sn,label:"Brosse",settings:{strokeColor:{values:Se,default:"black"},opacity:{min:0,max:100,step:1,default:100},lineWidth:{min:6,max:20,step:2,default:10},lineDash:{values:Ne,default:0}}},An={type:"line",id:`${oe}line`,icon:wn,label:"Ligne",settings:{strokeColor:{values:Se,default:"black"},opacity:{min:0,max:100,step:1,default:100},lineWidth:{min:1,max:20,step:1,default:1},lineDash:{values:Ne,default:0},lineArrow:{values:[0,1,2,3],default:0}}},En={type:"polygon",id:`${oe}polygon`,icon:Nt,label:"Polygone",settings:{strokeColor:{values:Se,default:"black"},fillColor:{values:Se,default:"transparent"},opacity:{min:0,max:100,step:1,default:100},lineWidth:{min:1,max:20,step:1,default:1},lineDash:{values:Ne,default:0},closedPoints:{default:0}}},Rn={type:"curve",id:`${oe}curve`,icon:Cn,label:"Courbe",settings:{strokeColor:{values:Se,default:"black"},fillColor:{values:Se,default:"transparent"},opacity:{min:0,max:100,step:1,default:100},lineWidth:{min:1,max:20,step:1,default:1},lineDash:{values:Ne,default:0},closedPoints:{default:0}}},Dn={type:"rect",id:`${oe}rect`,icon:It,label:"Rectangle",settings:zn},In={type:"square",id:`${oe}square`,icon:It,label:"Carré",settings:{strokeColor:{values:Se,default:"black"},fillColor:{values:Se,default:"transparent"},opacity:{min:0,max:100,step:1,default:100},lineWidth:{min:1,max:20,step:1,default:1},lineDash:{values:Ne,default:0}}},Wn={type:"circle",id:`${oe}circle`,icon:Wt,label:"Cercle",settings:{strokeColor:{values:Se,default:"black"},fillColor:{values:Se,default:"transparent"},opacity:{min:0,max:100,step:1,default:100},lineWidth:{min:1,max:20,step:1,default:1},lineDash:{values:Ne,default:0}}},Nn={type:"ellipse",id:`${oe}ellipse`,icon:Wt,label:"Ellipse",settings:{strokeColor:{values:Se,default:"black"},fillColor:{values:Se,default:"transparent"},opacity:{min:0,max:100,step:1,default:100},lineWidth:{min:1,max:20,step:1,default:1},lineDash:{values:Ne,default:0}}},Fn={type:"text",id:`${oe}text`,icon:bn,label:"Texte",settings:{strokeColor:{values:Se,default:"black"},opacity:{min:0,max:100,step:1,default:100},fontFamily:{values:["arial","serif","monospace"],default:pt},fontBold:{values:[!1,!0],default:!1},fontItalic:{values:[!1,!0],default:!1}}},De={id:`${oe}selection`,type:"selection",icon:'<svg><path d="M8.0145 11.1707C8.38484 10.9914 8.82183 11.1558 8.99959 11.5295L10.7031 15.2591L12.0363 14.6238L10.3254 10.9017C10.1476 10.528 10.3106 10.0795 10.6809 9.90761L10.8883 9.84782L12.5918 9.51148L6.48133 4.33192V12.389L7.82934 11.2903L8.0145 11.1707ZM10.6587 16.9258C10.2883 17.1052 9.84395 16.9482 9.67359 16.5745L8.05894 13.0318L6.19988 14.5416C6.07396 14.6462 5.91842 14.706 5.74066 14.706C5.54423 14.706 5.35584 14.6272 5.21694 14.4871C5.07803 14.3469 5 14.1568 5 13.9586V2.74741C5 2.54919 5.07803 2.35908 5.21694 2.21891C5.35584 2.07874 5.54423 2 5.74066 2C5.91842 2 6.08878 2.06727 6.21469 2.1719L6.2221 2.16443L14.7323 9.36947C15.0508 9.63854 15.0879 10.1094 14.8286 10.4233C14.7175 10.5579 14.562 10.6475 14.4064 10.6774L12.0659 11.1408L13.6954 14.6761C13.888 15.0498 13.7102 15.4908 13.3399 15.6627L10.6587 16.9258Z"/></svg>',label:"Sélection"},nt={id:`${oe}undo`,type:"undo",icon:'<svg><path d="M11.708 15.833H5.854V14.083H11.708Q13 14.083 13.958 13.292Q14.917 12.5 14.917 11.271Q14.917 10.042 13.958 9.24Q13 8.438 11.708 8.438H6.667L8.792 10.562L7.562 11.792L3.333 7.562L7.562 3.333L8.792 4.562L6.667 6.688H11.708Q13.729 6.688 15.198 7.99Q16.667 9.292 16.667 11.25Q16.667 13.208 15.198 14.521Q13.729 15.833 11.708 15.833Z"/></svg>',label:"Undo"},st={id:`${oe}redo`,type:"redo",icon:'<svg><path d="M8.292 15.833Q6.271 15.833 4.802 14.521Q3.333 13.208 3.333 11.25Q3.333 9.292 4.802 7.99Q6.271 6.688 8.292 6.688H13.333L11.208 4.562L12.438 3.333L16.667 7.562L12.438 11.792L11.208 10.562L13.333 8.438H8.292Q7 8.438 6.042 9.229Q5.083 10.021 5.083 11.25Q5.083 12.5 6.042 13.292Q7 14.083 8.292 14.083H14.146V15.833Z"/></svg>',label:"Redo"},at={id:`${oe}clear`,type:"clear",icon:'<svg><path d="M7.854 13.812 10 11.688 12.125 13.812 13.354 12.604 11.208 10.458 13.354 8.312 12.125 7.104 10 9.229 7.854 7.104 6.625 8.312 8.771 10.458 6.625 12.604ZM5.896 17.5Q5.167 17.5 4.656 16.99Q4.146 16.479 4.146 15.75V5.125H3.333V3.375H7.542V2.5H12.458V3.375H16.667V5.125H15.833V15.75Q15.833 16.479 15.323 16.99Q14.812 17.5 14.083 17.5Z"/></svg>',label:"Clear"},Bt={id:`${oe}export`,type:"export",icon:'<svg><path d="M10 13.271 5.708 8.979 6.958 7.729 9.125 9.896V3.333H10.875V9.896L13.042 7.729L14.292 8.979ZM5.083 16.667Q4.354 16.667 3.844 16.156Q3.333 15.646 3.333 14.917V12.5H5.083V14.917Q5.083 14.917 5.083 14.917Q5.083 14.917 5.083 14.917H14.917Q14.917 14.917 14.917 14.917Q14.917 14.917 14.917 14.917V12.5H16.667V14.917Q16.667 15.646 16.156 16.156Q15.646 16.667 14.917 16.667Z"/></svg>',label:"Export PNG"},On={id:`${oe}load`,type:"loadfile",icon:'<svg><path d="M3.417 16.667Q2.729 16.667 2.198 16.135Q1.667 15.604 1.667 14.917V5.083Q1.667 4.396 2.198 3.865Q2.729 3.333 3.417 3.333H8.25L9.917 5H16.667Q17.354 5 17.844 5.531Q18.333 6.062 18.333 6.75H3.417V14.917Q3.417 14.917 3.417 14.917Q3.417 14.917 3.417 14.917L5.438 8.5H19.583L17.396 15.479Q17.229 16.021 16.802 16.344Q16.375 16.667 15.833 16.667Z"/></svg>',label:"Load project"},Yt={id:`${oe}save`,type:"savefile",icon:'<svg><path d="M17.5 5.833V15.75Q17.5 16.479 16.99 16.99Q16.479 17.5 15.75 17.5H4.25Q3.521 17.5 3.01 16.99Q2.5 16.479 2.5 15.75V4.25Q2.5 3.521 3.01 3.01Q3.521 2.5 4.25 2.5H14.167ZM10 14.917Q11.062 14.917 11.823 14.156Q12.583 13.396 12.583 12.333Q12.583 11.271 11.823 10.51Q11.062 9.75 10 9.75Q8.938 9.75 8.177 10.51Q7.417 11.271 7.417 12.333Q7.417 13.396 8.177 14.156Q8.938 14.917 10 14.917ZM5.021 8.396H12.521V5.021H5.021Z"/></svg>',label:"Save project"},Xt={id:`${oe}move`,type:"move",icon:'<svg viewBox="0 -960 960 960"><path d="M412-48q-21.95 0-40.98-9Q352-66 338-83L48-434l27-28q17-17 41.5-20.5T162-473l126 74v-381q0-15.3 10.29-25.65Q308.58-816 323.79-816t25.71 10.35Q360-795.3 360-780v300h80v-396q0-15.3 10.29-25.65Q460.58-912 475.79-912t25.71 10.35Q512-891.3 512-876v396h80v-348q0-15.3 10.29-25.65Q612.58-864 627.79-864t25.71 10.35Q664-843.3 664-828v348h80v-252q0-15.3 10.29-25.65Q764.58-768 779.79-768t25.71 10.35Q816-747.3 816-732v540q0 60-42 102T672-48H412Z"/></svg>',label:"Move"},Bn={id:`${oe}upload-picture`,type:"uploadpicture",icon:Ft,label:"Upload picture"},Yn=2,Xn="blue",Xe=14,$n=[[0,0],[.5,0],[1,0],[1,.5],[1,1],[.5,1],[0,1],[0,.5]],Un=["brush","rect","square","line","polygon","circle","curve","ellipse","picture","text","triangle","group"],ga=["rect","square","circle","ellipse","picture","text","triangle","brush","group"],fa=["square","circle","picture","text"],qn="react-paint-canvas-drawcanvas",Gn="react-paint-canvas-selectioncanvas",_n={layersManipulation:!0,grid:0,canGrow:!1,canShrink:!0,withExport:!0,withLoadAndSave:!0,withUploadPicture:!0,withUrlPicture:!1,availableTools:[Tn,An,En,Rn,Dn,In,Wn,Nn,Ot,Fn],clearCallback:"empty",brushAlgo:"simple",isBrushShapeDoneOnMouseUp:!0,withFrameSelection:!0,withSkeleton:!0,canvasSelectionPadding:0,size:"fixed",canZoom:"never",debug:!1},va={canvasBackgroundColor:"white",canvasSelectionColor:Xn,canvasSelectionWidth:Yn},Kn=300,$t=(e,t)=>{const n={...t};for(const s of e)Array.isArray(s)?s[1].includes(n[s[0]])&&delete n[s[0]]:delete n[s];return n},Qe=(e,t,n)=>{const s=Array.isArray(n)?[...n]:{...n},a=Array.isArray(e)?e:typeof e=="string"?e.split("."):[e];return a.reduce((i,c,o)=>(i[c]=Ut(i[c])?{...i[c]}:Array.isArray(i[c])?[...i[c]]:i[c]===void 0||i[c]===null?{}:i[c],o===a.length-1&&(i[c]=t),i[c]),s),s},Ut=e=>typeof e=="object"&&!Array.isArray(e)&&e!==null,Ze=(e,t,n)=>{if(!Ut(t)||!Ut(n))return n;const s={...t};for(const a in n)n.hasOwnProperty(a)&&(s.hasOwnProperty(a)?s[a]=e(s[a],n[a],a)??Ze(e,s[a],n[a]):s[a]=n[a]);return s},Jn=(e,t)=>{if(e===t)return!0;if(typeof e!="object"||typeof t!="object"||e===null||t===null)return!1;const n=Object.keys(e),s=Object.keys(t);if(n.length!==s.length)return!1;for(const a of n)if(!s.includes(a)||!Jn(e[a],t[a]))return!1;return!0},qt={},le=(e="")=>(qt[e]||(qt[e]=0),`${e}${++qt[e]}`),He=(e,t,n)=>Math.max(t,Math.min(e,n)),es=()=>typeof navigator<"u"&&navigator.userAgent.includes("Macintosh"),ts=e=>{e.reset(),e.lineCap="round",e.lineJoin="round"},xe=(e,t={})=>{const{lineCap:n="round",fillColor:s="transparent",opacity:a=100,strokeColor:i=Xn,lineWidth:c=Yn,lineDash:o=0,shadowColor:r="transparent",shadowBlur:l=0}=t;e.lineCap=n,e.globalAlpha=a/100,e.fillStyle=s,e.strokeStyle=i,e.lineWidth=c,e.setLineDash(o===0?[]:[Zn[o][0]*c,Zn[o][1]*c]),e.shadowColor=r,e.shadowBlur=l},it=(e,t,n,s)=>{e.save(),e.scale(t.canvasSize.scaleRatio,t.canvasSize.scaleRatio),e.translate(t.canvasOffset[0],t.canvasOffset[1]),n&&s&&(e.translate(s[0],s[1]),e.rotate(n),e.translate(-s[0],-s[1]))},Gt=e=>180*e/Math.PI,ns=(e,t)=>{const n=t.x-Math.min(Math.max(t.x,e.x),e.x+e.width),s=t.y-Math.min(Math.max(t.y,e.y),e.y+e.height);return Math.sqrt(n*n+s*s)<=t.radius},ne=({origin:e=[0,0],point:t,rotation:n=0})=>{if(n===0)return t;const s=[t[0]-e[0],t[1]-e[1]],a=s[1]*Math.cos(n)-s[0]*Math.sin(n);return[s[1]*Math.sin(n)+s[0]*Math.cos(n)+e[0],a+e[1]]},ss=e=>(e+2*Math.PI)%(2*Math.PI),as=({targetVector:[e,t],radian:n=!0,originVector:s})=>{const a=ss(Math.atan2(t[1]-e[1],t[0]-e[0]));if(s){const[i,c]=s,o=Math.atan2(c[1]-i[1],c[0]-i[0]),r=ss(a-o);return n?r:Gt(r)}return n?a:Gt(a)},is=(e,t)=>Math.sqrt((e[0]-t[0])**2+(e[1]-t[1])**2),$e=(e,t,n)=>{const s=ne({origin:t.computed.center,point:e.computed.center,rotation:t.rotation??0}),a=(s[0]-(e.computed.borders.width/2-n.settings.selectionPadding)-(n.originalBorders.x+n.settings.selectionPadding))*n.widthMultiplier,i=(s[1]-(e.computed.borders.height/2-n.settings.selectionPadding)-(n.originalBorders.y+n.settings.selectionPadding))*n.heightMultiplier;return{x:n.newBorderX+n.settings.selectionPadding+(n.isXinverted?n.newBorderWidth-2*n.settings.selectionPadding-(e.computed.borders.width-2*n.settings.selectionPadding||1)*n.widthMultiplier-a:a),y:n.newBorderY+n.settings.selectionPadding+(n.isYinverted?n.newBorderHeight-2*n.settings.selectionPadding-(e.computed.borders.height-2*n.settings.selectionPadding||1)*n.heightMultiplier-i:i)}},Ue=(e,t,n,s,a)=>ne({origin:e.groupCenter,point:[t+s/2,n+a/2],rotation:-e.rotation}),_t=(e,{selectionPadding:t})=>{const n=e.points.flat(),s=Math.min(...n.map(r=>r[0])),a=Math.min(...n.map(r=>r[1])),i=n.map(r=>je(r,s,a,e.scaleX,e.scaleY)),c=Math.max(...i.map(r=>r[0]))+t,o=Math.max(...i.map(r=>r[1]))+t;return{x:s-t,width:c-s+t,y:a-t,height:o-a+t}},ot=(e,t)=>{const n=Sa(e,t),s=((a,i)=>Te(a,_t,i))(e,t);return{...e,path:n,selection:rt(n,s,t),computed:s}},ma=ot,ze=(e,t=2)=>Math.round(e*10**t)/10**t,je=(e,t,n,s=1,a=1)=>[t+(e[0]-t)*s,n+(e[1]-n)*a],fe=(e,t,n=0)=>{if(!t.gridGap)return ze(e);const s=e+n,a=s>=0?t.gridGap:-t.gridGap;return s+a/2-(s+a/2)%a-n},ya=(e,t,n,s,a,i,c)=>{if(s.mode==="translate")return ce(Hs(n,s.originalShape,s.cursorStartPosition,a,i),a);if(s.mode==="rotate"){const o=s.originalShape.computed.center[0]-s.cursorStartPosition[0],r=s.originalShape.computed.center[1]-s.cursorStartPosition[1],l=s.originalShape.computed.center[0]-n[0],u=s.originalShape.computed.center[1]-n[1],d=((f,g,v)=>g.gridGap||v?f+Math.PI/18/2-(f+Math.PI/18/2)%(Math.PI/18):ze(f,3))(Math.atan2(u,l)-Math.atan2(r,o),a,i),p=$(s.originalShape).map(f=>Ae(Xa(f,d,s.originalShape.computed.center),a));return ce(p,a)}return s.mode==="resize"?ce($a(e,n,s.originalShape,s,a,i,c),a):s.mode==="brush"?ce($(t).map(o=>((r,l,u)=>{const d={...r,points:Qe(r.points.length-1,[...r.points[r.points.length-1],[Math.round(l[0]),Math.round(l[1])]],r.points)};return ot(d,u)})(o,n,a)),a):t},Kt=e=>{const t=new Path2D;return t.rect(e.x,e.y,e.width,e.height),t},yt=e=>{const t=new Path2D;return t.arc(e.x,e.y,e.radius,0,2*Math.PI),t},St=e=>{const t=new Path2D;return t.moveTo(...e.points[0]),t.lineTo(...e.points[1]),t},Sa=(e,{brushAlgo:t})=>{if(e.points.length<1||e.style?.strokeColor==="transparent")return;const n=e.points.flat(),s=n.map(r=>r[0]),a=n.map(r=>r[1]),i=Math.min(...s),c=Math.min(...a),o=new Path2D;for(const r of e.points){if(!r.length)return;if(r.length===1)o.rect(...je(r[0],i,c,e.scaleX,e.scaleY),1,1);else if(o.moveTo(...je(r[0],i,c,e.scaleX,e.scaleY)),t==="quadratic"){for(let l=0;l<r.slice(1).length-2;l++){const u=je(r[l],i,c,e.scaleX,e.scaleY),d=je(r[l+1],i,c,e.scaleX,e.scaleY),p=(u[0]+d[0])/2,f=(u[1]+d[1])/2;o.quadraticCurveTo(...u,p,f)}o.quadraticCurveTo(...je(r[r.length-2],i,c,e.scaleX,e.scaleY),...je(r[r.length-1],i,c,e.scaleX,e.scaleY))}else for(const l of r.slice(1))o.lineTo(...je(l,i,c,e.scaleX,e.scaleY))}return o},xa=(e,t,n,s)=>{const a=w=>(1-w)**3*e[0]+3*(1-w)**2*w*t[0]+3*(1-w)*w**2*n[0]+w**3*s[0],i=w=>(1-w)**3*e[1]+3*(1-w)**2*w*t[1]+3*(1-w)*w**2*n[1]+w**3*s[1],c=(w,Z,A)=>{const L=w-2*Z+A,C=-2*w+2*Z,V=w;if(Math.abs(L)<1e-10){if(Math.abs(C)<1e-10)return[];const Y=-V/C;return Y>0&&Y<1?[Y]:[]}const D=C*C-4*L*V;if(D<0)return[];const z=Math.sqrt(D),B=(-C-z)/(2*L),E=(-C+z)/(2*L),I=[];return B>0&&B<1&&I.push(B),E>0&&E<1&&E!==B&&I.push(E),I},o=e[0],r=t[0],l=n[0],u=s[0],d=e[1],p=t[1],f=n[1],g=s[1],v=c(r-o,l-r,u-l),b=c(p-d,f-p,g-f);let k=Math.min(e[0],s[0]),Q=Math.max(e[0],s[0]),m=Math.min(e[1],s[1]),x=Math.max(e[1],s[1]);for(const w of v){const Z=a(w);k=Math.min(k,Z),Q=Math.max(Q,Z)}for(const w of b){const Z=i(w);m=Math.min(m,Z),x=Math.max(x,Z)}return{minX:k,maxX:Q,minY:m,maxY:x}},Jt=(e,t)=>e.style?.closedPoints===1&&t.length>2?[t[t.length-2],...t,t[0],t[1]]:[t[0],...t,t[t.length-1]],en=(e,t,n,s)=>({cp1:[t[0]+(n[0]-e[0])/6,t[1]+(n[1]-e[1])/6],cp2:[n[0]-(s[0]-t[0])/6,n[1]-(s[1]-t[1])/6]}),os=e=>{const t=e.tempPoint?[...e.points,e.tempPoint]:e.points;if(t.length<2)return;const n=new Path2D;n.moveTo(...t[0]);for(const s of t.slice(1))n.lineTo(...s);return t.length>2&&e.style?.closedPoints===1&&n.lineTo(...t[0]),n},Qa=e=>{const t=new Path2D;return t.moveTo(...e.points[0]),t.lineTo(...e.points[1]),t.lineTo(...e.points[2]),t.lineTo(...e.points[0]),t},ba=(e,t)=>({x:t.x-(e.style?.lineWidth??0)/2,y:t.y-(e.style?.lineWidth??0)/2,width:t.width+(e.style?.lineWidth??0),height:t.height+(e.style?.lineWidth??0)}),Te=(e,t,n,s=ba)=>{const a=t(e,n),i=s(e,a,n),c=[a.x+a.width/2,a.y+a.height/2],o=((r,l,u=0)=>{if(u===0)return r;const d=[[r.x,r.y],[r.x+r.width,r.y],[r.x+r.width,r.y+r.height],[r.x,r.y+r.height]].map(g=>ne({point:g,origin:l,rotation:u})),p=Math.min(...d.map(g=>g[0])),f=Math.min(...d.map(g=>g[1]));return{x:p,y:f,width:Math.max(...d.map(g=>g[0]))-p,height:Math.max(...d.map(g=>g[1]))-f}})(i,c,e.rotation);return{borders:a,outerBorders:i,center:c,boundingBox:o}},rt=(e,t,n)=>{const{borders:s}=t;return{border:Kt(s),shapePath:e,line:St({points:[[s.x+s.width/2,s.y],[s.x+s.width/2,s.y-23/n.canvasSize.scaleRatio]]}),anchors:[yt({x:s.x+s.width/2,y:s.y-23/n.canvasSize.scaleRatio,radius:7/n.canvasSize.scaleRatio}),...$n.map(a=>yt({x:s.x+s.width*a[0],y:s.y+s.height*a[1],radius:7/n.canvasSize.scaleRatio}))]}},rs=({borderStart:e,borderSize:t,vector:n,settings:s,invertedAxe:a,anchor:i})=>{switch(i){case 0:{if(a){const o=Math.max(0,n-t)+2*s.selectionPadding;return[e+t-2*s.selectionPadding,o]}const c=Math.max(2*s.selectionPadding,t-n);return[e+t-c,c]}case .5:return[e,t];case 1:if(a){const c=Math.min(e,e+t+n);return[c,e-c+2*s.selectionPadding]}return[e,Math.max(2*s.selectionPadding,t+n)];default:return[0,0]}},wa=({borderX:e,borderWidth:t,borderY:n,borderHeight:s,center:a,originalShape:i})=>{const c=[e+t/2-a[0],n+s/2-a[1]],[o,r]=ne({point:c,rotation:-(i.rotation??0)});return{borderX:ze(e+o-c[0]),borderWidth:ze(t),borderY:ze(n+r-c[1]),borderHeight:ze(s)}},Ca=(e,t,n,s)=>{const a=t.x+t.width/2,i=t.y+t.height/2,c=n?2*e.borderWidth+t.width:Math.abs(t.width+2*(e.borderWidth-t.width)),o=s?2*e.borderHeight+t.height:Math.abs(t.height+2*(e.borderHeight-t.height));return{...e,borderHeight:o,borderWidth:c,borderX:a-c/2,borderY:i-o/2}},qe=(e,t,n,s,a=!1,i=!1)=>{const{center:c,borders:o}=t.computed,r=ne({origin:c,point:e,rotation:t.rotation}),l=n.anchor[0]===0&&r[0]>=o.x+o.width-s.selectionPadding||n.anchor[0]===1&&r[0]<=o.x+s.selectionPadding,u=n.anchor[1]===0&&r[1]>=o.y+o.height-s.selectionPadding||n.anchor[1]===1&&r[1]<=o.y+s.selectionPadding,d=[fe(r[0],s,n.anchor[0]===0&&!l||n.anchor[0]===1&&l?s.selectionPadding:-s.selectionPadding),fe(r[1],s,n.anchor[1]===0&&!u||n.anchor[1]===1&&u?s.selectionPadding:-s.selectionPadding)],p=s.gridGap?[n.anchor[0]===0?o.x:n.anchor[0]===.5?o.x+o.width/2:o.x+o.width,n.anchor[1]===0?o.y:n.anchor[1]===.5?o.y+o.height/2:o.y+o.height]:ne({origin:c,point:n.cursorStartPosition,rotation:t.rotation}),f=[d[0]-p[0],d[1]-p[1]],[g,v]=rs({borderStart:o.x,borderSize:o.width,vector:f[0],settings:s,invertedAxe:l,anchor:n.anchor[0]}),[b,k]=rs({borderStart:o.y,borderSize:o.height,vector:f[1],settings:s,invertedAxe:u,anchor:n.anchor[1]}),Q=a?((m,x,w,Z,A,L,C,V,D,z,B)=>{const{selectionPadding:E}=B,I=(m.width-2*E||1)/(m.height-2*E||1),Y=(Z-2*E)/(L-2*E);let U,H,S,M;return z.anchor[0]!==.5&&z.anchor[1]!==.5?Y<I?(H=A,M=L,S=(L-2*E)*I+2*E,U=z.anchor[0]===0?C?m.x+m.width-2*E:m.x+(m.width-S):C?m.x-S+2*E:m.x):(U=w,S=Z,M=(Z-2*E)/I+2*E,H=z.anchor[1]===0?V?m.y+m.height-2*E:m.y+(m.height-M):V?m.y-M+2*E:m.y):z.anchor[0]!==.5?(U=w,S=Z,M=(Z-2*E)/I+2*E,H=m.y+(m.height-M)/2):(H=A,M=L,S=(L-2*E)*I+2*E,U=m.x+(m.width-S)/2),{borderX:U,borderWidth:S,borderY:H,borderHeight:M,center:x,originalShape:D}})(o,c,g,v,b,k,l,u,t,n,s):{borderX:g,borderWidth:v,borderY:b,borderHeight:k,center:c,originalShape:t};return{...wa(i?Ca(Q,o,l,u):Q),isXinverted:l,isYinverted:u}},xt=(e,t)=>{const n=Kt(e),s=((a,i)=>Te(a,tn,i))(e,t);return{...e,path:n,computed:s,selection:rt(n,s,t)}},Ma=xt,ls=(e,t,n,s=0,a=0)=>{const i={toolId:e.id,type:e.type,id:le(`${e.type}_`),x:t[0],y:t[1],width:s,height:a,style:{opacity:e.settings.opacity.default,fillColor:e.settings.fillColor.default,strokeColor:e.settings.strokeColor.default,lineWidth:e.settings.lineWidth.default,lineDash:e.settings.lineDash.default}};return xt(i,n)},ka=(e,t)=>{e.globalAlpha!==0&&t.path&&(t.style?.fillColor!=="transparent"&&e.fill(t.path),t.style?.strokeColor!=="transparent"&&e.stroke(t.path))},tn=(e,t)=>({x:e.x-t.selectionPadding,width:e.width+2*t.selectionPadding,y:e.y-t.selectionPadding,height:e.height+2*t.selectionPadding}),cs=(e,t,n,[s,a]=[!1,!1])=>{const i=e[0]===.5?n.x+n.width/2:e[0]===0?n.x+(s?0:n.width):n.x+(s?n.width:0),c=e[1]===.5?n.y+n.height/2:e[1]===0?n.y+(a?0:n.height):n.y+(a?n.height:0);return ja([i,c],n.rotation??0,t)},ds=(e,t,n,s,a,i,c,o)=>{let r=!1;if(a){r=dt(e,a,n,s,!0,i?20:void 0);const u=((d,p,f)=>{if(d.mode==="translate")return{mode:"translate",cursorStartPosition:f,originalShape:p,hasBeenDuplicated:!1,dateStart:Date.now()};if(d.mode==="rotate"){const{center:g}=p.computed;return{mode:"rotate",cursorStartPosition:f,originalShape:p,center:[g[0],g[1]]}}return d.mode==="resize"?{mode:"resize",cursorStartPosition:f,originalShape:p,anchor:d.anchor}:void 0})(r||{mode:"default"},a,n);if(u?.mode==="resize"||u?.mode==="rotate")return{shape:a,mode:u}}const l=t.find(u=>$(a).find(d=>u.id===d?.id)?r&&o?dt(e,u,n,s,!0,i?20:void 0):!!r:!!vs(e,u,n,s));if(l){if(o){const d=$(a).find(p=>p.id===l?.id)?ce(Pa(a,l),s):ce(hs(a,[l]),s);return{shape:d,mode:{mode:"translate",cursorStartPosition:n,hasBeenDuplicated:!1,dateStart:Date.now(),originalShape:d}}}const u=$(a).find(d=>d.id===l?.id)?a:ce([l],s);return{shape:u,mode:{mode:"translate",cursorStartPosition:n,hasBeenDuplicated:!1,dateStart:Date.now(),originalShape:u}}}return o?{shape:a,mode:{mode:c?"selectionFrame":"default"}}:{shape:void 0,mode:{mode:c?"selectionFrame":"default"}}},ce=(e,t)=>{if(!e.length)return;if(e.length===1)return e[0];const n=e.some(c=>c.rotation!==e[0].rotation)?0:e[0]?.rotation??0,s=((c,o,r)=>{const l=c.map(m=>[[m.computed.borders.x+r.selectionPadding,m.computed.borders.y+r.selectionPadding],[m.computed.borders.x-r.selectionPadding+m.computed.borders.width,m.computed.borders.y+r.selectionPadding],[m.computed.borders.x-r.selectionPadding+m.computed.borders.width,m.computed.borders.y-r.selectionPadding+m.computed.borders.height],[m.computed.borders.x+r.selectionPadding,m.computed.borders.y-r.selectionPadding+m.computed.borders.height]].map(x=>{const w=ne({point:[x[0],x[1]],origin:m.computed.center,rotation:-(m.rotation??0)});return ne({point:[w[0],w[1]],origin:[0,0],rotation:o})})),u=Math.min(...l.flatMap(m=>[m[0][0],m[1][0],m[2][0],m[3][0]])),d=Math.min(...l.flatMap(m=>[m[0][1],m[1][1],m[2][1],m[3][1]])),p=Math.max(...l.flatMap(m=>[m[0][0],m[1][0],m[2][0],m[3][0]])),f=Math.max(...l.flatMap(m=>[m[0][1],m[1][1],m[2][1],m[3][1]])),g=[(u+p)/2,(d+f)/2],v=ne({point:g,origin:[0,0],rotation:-o}),b=[g[0]-v[0],g[1]-v[1]],k=u-b[0],Q=d-b[1];return{width:p-b[0]-k,height:f-b[1]-Q,x:k,y:Q}})(e,n,t),a=ls({id:"group_selection",type:"rect",settings:zn},[s.x,s.y],t,s.width,s.height),i=e.slice(1).reduce((c,o)=>{const r=o.style??{},l={};for(const u in r)c[u]!==void 0&&r[u]!==void 0&&c[u]===r[u]&&(l[u]=c[u]);return l},e[0].style??{});return{id:e.map(c=>c.id).join("-"),type:"group",shapes:e,rotation:n,visible:!0,locked:!1,selection:a.selection,x:a.x,y:a.y,width:a.width,height:a.height,style:i,computed:a.computed}},us=(e,t)=>n=>{if(!n)return;const s=n.type==="group"?n.shapes.map(a=>e(a,t)):[e(n,t)];return ce(s,t)},$=e=>e?e.type==="group"?e.shapes:[e]:[],hs=(e,t)=>{const n=$(e);return[...new Set([...n,...t])]},Pa=(e,t)=>$(e).filter(n=>n.id!==t.id),ps=e=>{const{clientX:t=0,clientY:n=0}="touches"in e&&e.touches[0]?e.touches[0]:"changedTouches"in e&&e.changedTouches[0]?e.changedTouches[0]:"clientX"in e?e:{};return{clientX:t,clientY:n}},gs=(e,t,n)=>{const{clientX:s,clientY:a}=ps(e),i=t.getBoundingClientRect();return[(s-i.left)/n.scaleRatio,(a-i.top)/n.scaleRatio]},lt=(e,t,n)=>{const{clientX:s,clientY:a}=ps(e),i=t?.getBoundingClientRect()??{left:0,top:0,width:n.canvasSize.width,height:n.canvasSize.height};return[(s-i.left)*(n.canvasSize.width/i.width)/n.canvasSize.scaleRatio-n.canvasOffset[0],(a-i.top)*(n.canvasSize.height/i.height)/n.canvasSize.scaleRatio-n.canvasOffset[1]]},ct=e=>"touches"in e,Le=(e,t,[n,s])=>ne({origin:[n,s],point:e,rotation:t}),ja=(e,t,[n,s])=>ne({origin:[n,s],point:e,rotation:-t}),Qt=(e,t,n)=>n?ns(e,{x:t[0],y:t[1],radius:n}):((s,a)=>a[0]>=s.x&&a[0]<=s.x+s.width&&a[1]>=s.y&&a[1]<=s.y+s.height)(e,t),dt=(e,t,n,s,a=!1,i=0)=>{if(t.locked)return!1;const{canvasSize:{scaleRatio:c}}=s,{borders:o,center:r}=t.computed,l=Le(n,t.rotation??0,r),u=$(t).length>1?t:$(t)[0];if(u&&a)if(u.type==="line"||u.type==="polygon"||u.type==="curve"){for(let d=0;d<u.points.length;d++)if(Qt({x:u.points[d][0]-7/c,y:u.points[d][1]-7/c,width:Xe/c,height:Xe/c},l,i))return{mode:"resize",anchor:d}}else{if(Qt({x:o.x+o.width/2-7/c,y:o.y-Xe/c-16/c,width:Xe/c,height:Xe/c},l,i))return{mode:"rotate"};for(const d of $n)if(Qt({x:o.x+o.width*d[0]-7/c,y:o.y+o.height*d[1]-7/c,width:Xe/c,height:Xe/c},l,i))return{mode:"resize",anchor:d}}return(Qt(o,l,i)||!!(t.type==="curve"&&"path"in t&&t.path&&e.isPointInPath(t.path,l[0],l[1])))&&{mode:"translate"}},fs=(e,t,n,s,a=50)=>{if(t.locked||t.points.length<2)return!1;const{center:i}=t.computed,c=Le(n,t.rotation??0,i);e.lineWidth=(t.style?.lineWidth??0)+a/s.canvasZoom;const o=t.style?.closedPoints?[...t.points,t.points[0]]:t.points;for(let r=0;r<o.length-1;r++){const l=St({points:[o[r],o[r+1]]});if(e.isPointInStroke(l,c[0],c[1]))return{lineIndex:r}}return!1},vs=(e,t,n,s)=>{if(t.locked)return!1;const{center:a}=t.computed,i=Le(n,t.rotation??0,a);return"path"in t&&t.path?t.style?.fillColor&&t.style?.fillColor!=="transparent"?!!e.isPointInPath(t.path,i[0],i[1])&&{mode:"translate"}:(e.lineWidth=(t.style?.lineWidth??0)+15/s.canvasZoom,!!e.isPointInStroke(t.path,i[0],i[1])&&{mode:"translate"}):dt(e,t,n,s,!1)};function nn(e,t){const n=Math.max(e.x,t.x),s=Math.max(e.y,t.y),a=Math.min(e.x+(e.width||1),t.x+(t.width||1)),i=Math.min(e.y+(e.height||1),t.y+(t.height||1));if(n<a&&s<i)return{x:n,y:s,width:a-n,height:i-s}}const ms=({ctx:e,path:t,rect:n,offset:s,checkFill:a})=>{for(let i=0;i<s;i+=s/2)for(let c=0;c<s;c+=s/2)for(let o=i+n.x;o<n.x+n.width;o+=s)for(let r=c+n.y;r<n.y+n.height;r+=s)if(a?e.isPointInPath(t,o,r):e.isPointInStroke(t,o,r))return!0;return!1},sn=(e,t,n,s)=>({border:Kt(n.borders),shapePath:e,anchors:[...t.points.map(a=>yt({x:a[0],y:a[1],radius:7/s.canvasSize.scaleRatio}))]}),be=[.05,.1,.25,.5,1,2,4,8],an=({size:e,zoom:t,newOffset:[n,s],canvasSize:a})=>e==="infinite"?{zoom:t,offset:[n,s]}:t<1?{zoom:t,offset:[-(a.realWidth-a.realWidth/t)/2,-(a.realHeight-a.realHeight/t)/2]}:{zoom:t,offset:[He(n,a.realWidth/t-a.realWidth,0),He(s,a.realHeight/t-a.realHeight,0)]},on=({size:e,canvasSize:t,currentOffset:n,currentZoom:s,zoom:a,centerPoint:i})=>{const c=e==="fixed"&&a<1?[t.realWidth/2,t.realHeight/2]:i,o=n[0]-(c[0]/s-c[0]/a),r=n[1]-(c[1]/s-c[1]/a);return{offset:e==="infinite"?[o,r]:a<1?[-(t.realWidth-t.realWidth/a)/2,-(t.realHeight-t.realHeight/a)/2]:[He(o,t.realWidth/a-t.realWidth,0),He(r,t.realHeight/a-t.realHeight,0)],zoom:a}},ys=e=>{const{canvasSize:{width:t,height:n,scaleRatioWithNoZoom:s},canvasZoom:a,canvasOffset:i}=e;return{x:i[0]*a*s,y:i[1]*a*s,width:t*a,height:n*a}},Ss=(e,t)=>{const{canvasZoom:n,size:s}=t;if(s!=="fixed"||n>=1)return;const a=ys(t);e.beginPath(),e.rect(a.x,a.y,a.width,a.height),e.closePath(),e.clip()},gt=(e,t)=>t.size!=="fixed"||e[0]>0&&e[0]<t.canvasSize.realWidth&&e[1]>0&&e[1]<t.canvasSize.realHeight,La=(e,t)=>({x:e.x-e.radius-t.selectionPadding,width:2*(e.radius+t.selectionPadding),y:e.y-e.radius-t.selectionPadding,height:2*(e.radius+t.selectionPadding)}),bt=(e,t)=>{const n=yt(e),s=((a,i)=>Te(a,La,i))(e,t);return{...e,path:n,selection:rt(n,s,t),computed:s}},Va=bt,ft=(e,t)=>{const n=os(e),s=((a,i)=>Te(a,wt,i))(e,t);return{...e,path:n,selection:sn(n,e,s,t),computed:s}},xs=ft,wt=(e,t)=>{const n=Math.min(...e.points.map(i=>i[0]))-t.selectionPadding,s=Math.max(...e.points.map(i=>i[0]))+t.selectionPadding,a=Math.min(...e.points.map(i=>i[1]))-t.selectionPadding;return{x:n,width:s-n,y:a,height:Math.max(...e.points.map(i=>i[1]))+t.selectionPadding-a}},Za=(e,t,n,s)=>{if(t<0||t>e.points.length-1)return e;const a=[...e.points.slice(0,t+1),n,...e.points.slice(t+1)];return ft({...e,points:a},s)},Qs=(e,t,n,s=!1)=>{const a=[fe(t[0],n),fe(t[1],n)],i=Le(a,e.rotation??0,e.computed.center),c={...e,points:s?e.points:[...e.points,i],tempPoint:s?i:void 0};return ft(c,n)},Ha=(e,t,n)=>{const s=e.tempPoint?[...e.points,e.tempPoint]:e.points;if(s.length<2){const l=s[0]??[0,0],u=n.selectionPadding;return{x:l[0]-u,y:l[1]-u,width:2*u,height:2*u}}if(s.length<3)return wt({...e,points:s},n);const a=Jt(e,s);let i=Number.POSITIVE_INFINITY,c=Number.NEGATIVE_INFINITY,o=Number.POSITIVE_INFINITY,r=Number.NEGATIVE_INFINITY;for(let l=1;l<a.length-2;l++){const u=a[l-1],d=a[l],p=a[l+1],f=a[l+2],{cp1:g,cp2:v}=en(u,d,p,f),b=xa(d,g,v,p);i=Math.min(i,b.minX),c=Math.max(c,b.maxX),o=Math.min(o,b.minY),r=Math.max(r,b.maxY)}return tn({x:i,y:o,width:c-i,height:r-o},n)},vt=(e,t)=>{const n=(a=>{const i=a.tempPoint?[...a.points,a.tempPoint]:a.points;if(i.length<2)return;if(i.length<3)return os(a);const c=a.style?.closedPoints===1&&i.length>2,o=new Path2D;o.moveTo(...i[0]);const r=Jt(a,i);for(let l=1;l<r.length-2;l++){const u=r[l-1],d=r[l],p=r[l+1],f=r[l+2],{cp1:g,cp2:v}=en(u,d,p,f);o.bezierCurveTo(g[0],g[1],v[0],v[1],p[0],p[1])}return c&&o.closePath(),o})(e),s=((a,i)=>Te(a,wt,i,Ha))(e,t);return{...e,path:n,selection:sn(n,e,s,t),computed:s}},bs=vt,za=(e,t,n,s)=>{if(t<0||t>e.points.length-1)return e;const a=[...e.points.slice(0,t+1),n,...e.points.slice(t+1)];return vt({...e,points:a},s)},ws=(e,t,n,s=!1)=>{const a=[fe(t[0],n),fe(t[1],n)],i=e.computed.center,c=Le(a,e.rotation??0,i),o={...e,points:s?e.points:[...e.points,c],tempPoint:s?c:void 0};return vt(o,n)},Ta=(e,t)=>({x:e.x-e.radiusX-t.selectionPadding,width:2*(e.radiusX+t.selectionPadding),y:e.y-e.radiusY-t.selectionPadding,height:2*(e.radiusY+t.selectionPadding)}),Ct=(e,t)=>{const n=(a=>{const i=new Path2D;return i.ellipse(a.x,a.y,a.radiusX,a.radiusY,0,0,2*Math.PI),i})(e),s=((a,i)=>Te(a,Ta,i))(e,t);return{...e,path:n,selection:rt(n,s,t),computed:s}},Aa=Ct,Ea=(e,t)=>Te(e,wt,t),Cs=(e,t)=>((n,s)=>({...n,path:Qa(n),computed:Ea(n,s)}))({...e,id:le("triangle_"),type:"triangle"},t),Ra=(e,t)=>{e.globalAlpha!==0&&t.path&&(t.style?.fillColor!=="transparent"&&e.fill(t.path),t.style?.strokeColor!=="transparent"&&e.stroke(t.path))},Da=(e,t)=>({x:Math.min(e.points[0][0],e.points[1][0])-t.selectionPadding,width:Math.abs(e.points[0][0]-e.points[1][0])+2*t.selectionPadding,y:Math.min(e.points[0][1],e.points[1][1])-t.selectionPadding,height:Math.abs(e.points[0][1]-e.points[1][1])+2*t.selectionPadding}),Mt=(e,t)=>{const n=[];let s;if(e.style?.lineArrow===1||e.style?.lineArrow===2||e.style?.lineArrow===3){const i=Math.PI/2-as({targetVector:[e.points[0],e.points[1]]});e.style?.lineArrow!==1&&e.style?.lineArrow!==3||n.push(Cs(Ms(e.points[0],i,e.style),t)),e.style?.lineArrow!==2&&e.style?.lineArrow!==3||n.push(Cs(Ms(e.points[1],i+Math.PI,e.style),t));const c=(({line:o,size:r,direction:l})=>{const u=Math.PI/2-as({targetVector:[o.points[0],o.points[1]]}),d=[o.points[0][0]+(o.points[1][0]-o.points[0][0])/2,o.points[0][1]+(o.points[1][1]-o.points[0][1])/2];let p,f;if(["start","both"].includes(l)){const g=ne({point:o.points[0],origin:d,rotation:-u});p=ne({point:[g[0],g[1]+r],origin:d,rotation:u})}else p=[...o.points[0]];if(["end","both"].includes(l)){const g=ne({point:o.points[1],origin:d,rotation:-u});f=ne({point:[g[0],g[1]-r],origin:d,rotation:u})}else f=[...o.points[1]];return{points:[p,f]}})({line:e,size:10+2*(e.style?.lineWidth??0),direction:e.style?.lineArrow===1?"start":e.style?.lineArrow===2?"end":"both"});s=St(c)}else s=St(e);const a=((i,c)=>Te(i,Da,c))(e,t);return{...e,path:s,selection:sn(s,e,a,t),arrows:n,style:{...e.style,lineCap:e.style?.lineArrow?"butt":"round"},computed:a}},Ia=Mt,Ms=(e,t,n)=>{const s=[ne({point:[0,0],rotation:t}),ne({point:[-(5+(n.lineWidth??0)),10+2*(n.lineWidth??0)],rotation:t}),ne({point:[5+(n.lineWidth??0),10+2*(n.lineWidth??0)],rotation:t})];return{points:[[e[0]+s[0][0],e[1]+s[0][1]],[e[0]+s[1][0],e[1]+s[1][1]],[e[0]+s[2][0],e[1]+s[2][1]]],style:{...n,fillColor:n.strokeColor,strokeColor:"transparent"}}},Wa=(e,t,n)=>{const{isXinverted:s,isYinverted:a,settings:i,widthMultiplier:c,heightMultiplier:o}=n,r=e.computed.borders.width-2*i.selectionPadding,l=e.computed.borders.height-2*i.selectionPadding,u=r*c,d=l*o,p=$e(e,t,n),f=Ue(n,p.x,p.y,u,d),g=e.computed.center[0]-r/2,v=e.computed.center[1]-l/2,b=f[0]-u/2,k=f[1]-d/2;return((Q,m)=>Q.type==="line"?Mt(Q,m):Q.type==="polygon"?xs(Q,m):bs(Q,m))({...e,points:e.points.map(([Q,m])=>[b+(s?u-(Q-g)*c:(Q-g)*c),k+(a?d-(m-v)*o:(m-v)*o)])},n.settings)},kt=(e,t)=>{const n=((s,a)=>Te(s,tn,a))(e,t);return{...e,selection:rt(void 0,n,t),computed:n}},Na=kt,rn=(e,t,n,s,a)=>{const[i,c]=((o,r,l,u,d=!1)=>{if(!(o&&r&&u&&l))return[Kn,Kn];const p=o/r;if(p>l/u){const g=d?l:Math.min(o,l);return[g,g/p]}const f=d?u:Math.min(r,u);return[f*p,f]})(e.width,e.height,n,s,!0);return kt({toolId:Ot.id,type:"picture",id:le("picture_"),x:-a.canvasOffset[0]+a.canvasSize.realWidth/a.canvasZoom/2-i/2,y:-a.canvasOffset[1]+a.canvasSize.realHeight/a.canvasZoom/2-c/2,width:i,height:c,src:t,img:e},a)},Fa=(e,t,n,s)=>new Promise((a,i)=>{const c=new Image;c.onerror=()=>{i(new Error("Some images could not be loaded"))},setTimeout(()=>{i(new Error("Timeout while loading images"))},4e3),e instanceof File?((o,r,l,u,d,p)=>{As(l)?l.text().then(f=>{const g=Ts(f);o.onload=async()=>{URL.revokeObjectURL(o.src);const v=rn(o,f,u,d,p);r(v)},o.src=g}):(o.onload=async()=>{URL.revokeObjectURL(o.src);const f=rn(o,o.src,u,d,p);r(f)},o.src=URL.createObjectURL(l))})(c,a,e,t,n,s):((o,r,l,u,d,p)=>{o.onload=()=>{URL.revokeObjectURL(o.src);const f=rn(o,l,u,d,p);r(f)},Es(l).then(f=>{o.src=f}).catch(()=>{o.src=""})})(c,a,e,t,n,s)}),ln=["Texte"],ks=(e,t)=>Te(e,Ba,t),Pt=(e,t)=>{const n=ks(e,t);return{...e,selection:rt(void 0,n,t),computed:n}},Oa=Pt,jt=(e,t,n,s,a,i=pt)=>{e.font=`${a?"italic":""} ${s?"bold":""} 1px ${i}`;const c=t.map(o=>n/e.measureText(o).width);return Math.min(...c)||36},Ba=(e,t)=>({x:e.x-t.selectionPadding,width:e.width+2*t.selectionPadding,y:e.y-t.selectionPadding,height:e.height+2*t.selectionPadding}),Ya=(e,t,n,s)=>{const a={...t,value:n},i=((f,g,v,b,k,Q=pt)=>{f.font=`${k?"italic":""} ${b?"bold":""} ${v}px ${Q}`;const m=g.map(x=>f.measureText(x).width);return Math.max(...m)||20})(e,a.value,a.fontSize,a.style?.fontBold??!1,a.style?.fontItalic??!1,a.style?.fontFamily),c=a.fontSize*a.value.length,o={...a,width:i,height:c},{center:r}=ks(o,s),[l,u]=cs([1,1],t.computed.center,t),[d,p]=cs([1,1],r,o,[!1,!1]);return{...o,x:o.x-(d-l),y:o.y-(p-u)}},Ps=(e,t,n,s)=>{const a=[fe(n[0],s),fe(n[1],s)];switch(t.type){case"brush":return((i,c,o)=>ot({toolId:i.id,type:i.type,id:le(`${i.type}_`),points:[[c]],scaleX:1,scaleY:1,style:{opacity:i.settings.opacity.default,strokeColor:i.settings.strokeColor.default,lineWidth:i.settings.lineWidth.default,lineDash:i.settings.lineDash.default}},o))(t,a,s);case"line":return((i,c,o)=>{const r={toolId:i.id,type:i.type,id:le(`${i.type}_`),points:[c,c],style:{opacity:i.settings.opacity.default,strokeColor:i.settings.strokeColor.default,lineWidth:i.settings.lineWidth.default,lineDash:i.settings.lineDash.default,lineArrow:i.settings.lineArrow.default}};return Mt(r,o)})(t,a,s);case"polygon":return((i,c,o)=>ft({toolId:i.id,type:i.type,id:le(`${i.type}_`),points:[c],style:{opacity:i.settings.opacity.default,fillColor:i.settings.fillColor.default,strokeColor:i.settings.strokeColor.default,lineWidth:i.settings.lineWidth.default,lineDash:i.settings.lineDash.default,closedPoints:i.settings.closedPoints.default}},o))(t,a,s);case"curve":return((i,c,o)=>vt({toolId:i.id,type:i.type,id:le(`${i.type}_`),points:[c],style:{opacity:i.settings.opacity.default,fillColor:i.settings.fillColor.default,strokeColor:i.settings.strokeColor.default,lineWidth:i.settings.lineWidth.default,lineDash:i.settings.lineDash.default,closedPoints:i.settings.closedPoints.default}},o))(t,a,s);case"rect":case"square":return ls(t,a,s);case"text":return((i,c,o,r)=>{const l=jt(i,ln,150,c.settings?.fontBold.default??!1,c.settings?.fontItalic.default??!1,c.settings.fontFamily.default),u=l*(ln.length||1);return Pt({toolId:c.id,type:c.type,id:le(`${c.type}_`),x:o[0]-150,y:o[1]-u,value:ln,fontSize:l,width:150,height:u,style:{opacity:c.settings.opacity.default,strokeColor:c.settings.strokeColor.default,fontFamily:c.settings.fontFamily.default,fontItalic:c.settings.fontItalic.default,fontBold:c.settings.fontBold.default}},r)})(e,t,a,s);case"ellipse":return((i,c,o)=>Ct({toolId:i.id,type:i.type,id:le(`${i.type}_`),x:c[0],y:c[1],radiusX:0,radiusY:0,style:{opacity:i.settings.opacity.default,fillColor:i.settings.fillColor.default,strokeColor:i.settings.strokeColor.default,lineWidth:i.settings.lineWidth.default,lineDash:i.settings.lineDash.default}},o))(t,a,s);case"circle":return((i,c,o)=>bt({toolId:i.id,type:i.type,id:le(`${i.type}_`),x:c[0],y:c[1],radius:0,style:{opacity:i.settings.opacity.default,fillColor:i.settings.fillColor.default,strokeColor:i.settings.strokeColor.default,lineWidth:i.settings.lineWidth.default,lineDash:i.settings.lineDash.default}},o))(t,a,s)}},js=(e,t)=>{switch(t.type){case"brush":((n,s)=>{s.points.length<1||!s.path||n.globalAlpha!==0&&s.style?.strokeColor!=="transparent"&&n.globalAlpha!==0&&n.stroke(s.path)})(e,t);break;case"text":((n,s)=>{if(n.globalAlpha!==0&&s.style?.strokeColor&&s.style.strokeColor!=="transparent"){n.scale(s.flipX?-1:1,s.flipY?-1:1),n.font=`${s.style?.fontItalic?"italic":""} ${s.style?.fontBold?"bold":""} ${s.fontSize}px ${s.style?.fontFamily??pt}`,n.textBaseline="top",n.fillStyle=s.style.strokeColor;for(let a=0;a<s.value.length;a++)n.fillText(s.value[a],s.flipX?-s.x-s.width:s.x,s.flipY?-s.y-s.height:s.y+a*s.fontSize,s.width)}})(e,t);break;case"line":((n,s)=>{if(n.globalAlpha!==0&&s.path){s.style?.fillColor!=="transparent"&&n.fill(s.path),s.style?.strokeColor!=="transparent"&&n.stroke(s.path);for(const a of s.arrows??[])xe(n,a.style),Ra(n,a)}})(e,t);break;case"polygon":((n,s)=>{s.path&&n.globalAlpha!==0&&(s.style?.fillColor!=="transparent"&&n.fill(s.path),s.style?.strokeColor!=="transparent"&&n.stroke(s.path))})(e,t);break;case"curve":((n,s)=>{s.path&&n.globalAlpha!==0&&(s.style?.fillColor!=="transparent"&&n.fill(s.path),s.style?.strokeColor!=="transparent"&&n.stroke(s.path))})(e,t);break;case"circle":((n,s)=>{n.globalAlpha!==0&&s.path&&(s.style?.fillColor!=="transparent"&&n.fill(s.path),s.style?.strokeColor!=="transparent"&&n.stroke(s.path))})(e,t);break;case"ellipse":((n,s)=>{n.globalAlpha!==0&&s.path&&(s.style?.fillColor!=="transparent"&&n.fill(s.path),s.style?.strokeColor!=="transparent"&&n.stroke(s.path))})(e,t);break;case"rect":case"square":ka(e,t);break;case"picture":((n,s)=>{n.globalAlpha!==0&&(n.beginPath(),n.scale(s.flipX?-1:1,s.flipY?-1:1),n.drawImage(s.img,s.flipX?-s.x-s.width:s.x,s.flipY?-s.y-s.height:s.y,s.width,s.height))})(e,t)}},Ls=(e,t,n)=>{if(t.visible===!1)return;if(((a,i)=>{const c=(o=>{const{canvasSize:{width:r,height:l,scaleRatioWithNoZoom:u},canvasZoom:d,canvasOffset:p}=o;return{x:-p[0],y:-p[1],width:r/d/u,height:l/d/u}})(i);return!!nn(a.computed.boundingBox,c)})(t,n)){if(it(e,n,t.rotation,t.computed.center),xe(e,t.style),e.globalAlpha!==1)return((a,i)=>{const{outerBorders:c}=i.computed,o={width:2*c.width,height:2*c.height};if(o.width===0||o.height===0)return;const r=document.createElement("canvas"),l=r.getContext("2d");if(!l)throw new Error("No context found for canvas");r.width=o.width,r.height=o.height,l.translate(o.width/4-c.x,o.height/4-c.y),xe(l,{...i.style,opacity:100}),js(l,i),a.drawImage(r,c.x-o.width/4,c.y-o.height/4)})(e,t),void e.restore();js(e,t),e.restore()}},Xa=(e,t,n)=>{const s=ne({origin:n,point:e.computed.center,rotation:-t});if("points"in e){if(e.type==="brush"){const i=e.points.map(c=>c.map(o=>[o[0]+s[0]-e.computed.center[0],o[1]+s[1]-e.computed.center[1]]));return{...e,points:i,rotation:(e.rotation??0)+t}}const a=e.points.map(i=>ne({origin:n,point:i,rotation:-t}));return{...e,points:a}}return{...e,x:e.x+s[0]-e.computed.center[0],y:e.y+s[1]-e.computed.center[1],rotation:(e.rotation??0)+t}},Vs=(e,t,n,s,a,i,c)=>{switch(n.type){case"line":return((o,r,l,u)=>{const d=[fe(o[0],u),fe(o[1],u)],p=Le(d,r.rotation??0,r.computed.center),f=Qe(["points",l.anchor],p,r);return Mt(f,u)})(t,n,s,a);case"polygon":return((o,r,l,u)=>{const d=[fe(o[0],u),fe(o[1],u)],p=Le(d,r.rotation??0,r.computed.center),f=Qe(["points",l.anchor],p,r);return ft(f,u)})(t,n,s,a);case"curve":return((o,r,l,u)=>{const d=[fe(o[0],u),fe(o[1],u)],p=r.computed.center,f=Le(d,r.rotation??0,p),g=Qe(["points",l.anchor],f,r);return vt(g,u)})(t,n,s,a);case"brush":return((o,r,l,u,d,p)=>{const f=_t({...r,scaleX:1,scaleY:1},u),g=r.computed.borders,{borderX:v,borderHeight:b,borderY:k,borderWidth:Q,isXinverted:m,isYinverted:x}=qe(o,r,l,u,d,p),w=Math.max(0,f.width-2*u.selectionPadding),Z=Math.max(0,f.height-2*u.selectionPadding),A=Math.max(0,Q-2*u.selectionPadding),L=Math.max(0,b-2*u.selectionPadding),C=w?A/w:1,V=Z?L/Z:1;if(!w||!Z)return r;const D=ze(v-g.x)+(m?2*g.x+f.width:0),z=ze(k-g.y)+(x?2*g.y+f.height:0);return ot({...r,points:r.points.map(B=>B.map(([E,I])=>[m?-E+D:E+D,x?-I+z:I+z])),scaleX:C,scaleY:V},u)})(t,n,s,a,i,c);case"circle":return((o,r,l,u,d)=>{const{borderX:p,borderHeight:f,borderY:g,borderWidth:v}=qe(o,r,l,u,!0,d);return bt({...r,radius:Math.max(0,v/2-u.selectionPadding),x:p+v/2,y:g+f/2},u)})(t,n,s,a,c);case"ellipse":return((o,r,l,u,d=!1,p=!1)=>{const{borderX:f,borderHeight:g,borderY:v,borderWidth:b}=qe(o,r,l,u,d,p);return Ct({...r,radiusX:Math.max(0,b/2-u.selectionPadding),radiusY:Math.max(0,g/2-u.selectionPadding),x:f+b/2,y:v+g/2},u)})(t,n,s,a,i,c);case"rect":case"square":return((o,r,l,u,d=!1,p=!1)=>{const{borderX:f,borderHeight:g,borderY:v,borderWidth:b}=qe(o,r,l,u,d,p);return xt({...r,width:Math.max(0,b-2*u.selectionPadding),height:Math.max(0,g-2*u.selectionPadding),x:f+u.selectionPadding,y:v+u.selectionPadding},u)})(t,n,s,a,n.type==="square"||i,c);case"text":return((o,r,l,u,d,p)=>{const{borderX:f,borderHeight:g,borderY:v,borderWidth:b,isXinverted:k,isYinverted:Q}=qe(r,l,u,d,!0,p),m=Pt({...l,width:Math.max(0,b-2*d.selectionPadding),height:Math.max(0,g-2*d.selectionPadding),x:f+d.selectionPadding,y:v+d.selectionPadding,flipX:k?!l.flipX:!!l.flipX,flipY:Q?!l.flipY:!!l.flipY},d);return{...m,fontSize:jt(o,m.value,m.width,m.style?.fontBold??!1,m.style?.fontItalic??!1,m.style?.fontFamily)}})(e,t,n,s,a,c);case"picture":return((o,r,l,u,d)=>{const{borderX:p,borderHeight:f,borderY:g,borderWidth:v,isXinverted:b,isYinverted:k}=qe(o,r,l,u,!0,d);return kt({...r,width:Math.max(0,v-2*u.selectionPadding),height:Math.max(0,f-2*u.selectionPadding),x:p+u.selectionPadding,y:g+u.selectionPadding,flipX:b?!r.flipX:!!r.flipX,flipY:k?!r.flipY:!!r.flipY},u)})(t,n,s,a,c);default:return n}},$a=(e,t,n,s,a,i,c)=>{if(n.type!=="group")return $(n).map(g=>Vs(e,t,g,s,a,i,c));const o=n,r=$(o),l=r.filter(g=>ga.includes(g.type)),u=!l.some(g=>(g.rotation??0)!==(l[0]?.rotation??0)),d=(l[0]?.rotation??0)!==0&&l.length!==r.length,p=r.some(g=>fa.includes(g.type)),f=((g,v,b,k,Q,m)=>{const{borders:x}=v.computed,{borderX:w,borderHeight:Z,borderY:A,borderWidth:L,isXinverted:C,isYinverted:V}=qe(g,v,b,k,Q,m);return{newBorderX:w,newBorderY:A,newBorderWidth:L,newBorderHeight:Z,widthMultiplier:(L-2*k.selectionPadding)/(x.width-2*k.selectionPadding||1),heightMultiplier:(Z-2*k.selectionPadding)/(x.height-2*k.selectionPadding||1),isXinverted:C,isYinverted:V,groupCenter:[w+L/2,A+Z/2],rotation:v.rotation??0,settings:k,originalBorders:x}})(t,o,s,a,i||!u||p||d,c);return r.map(g=>{switch(g.type){case"rect":case"square":return((v,b,k)=>{const{isXinverted:Q,isYinverted:m,settings:x,widthMultiplier:w,heightMultiplier:Z}=k,A=(Q||m)&&!(Q&&m)&&(v.rotation??0)!==0&&b.rotation!==v.rotation,L=$e(v,b,k),C=(v.width||1)*w,V=(v.height||1)*Z,D=Ue(k,L.x,L.y,C,V);return xt({...v,width:C,height:V,x:D[0]-C/2,y:D[1]-V/2,rotation:A?-(v.rotation??0):v.rotation??0},x)})(g,o,f);case"picture":return((v,b,k)=>{const{isXinverted:Q,isYinverted:m,settings:x,widthMultiplier:w,heightMultiplier:Z}=k,A=$e(v,b,k),L=(v.width||1)*w,C=(v.height||1)*Z,V=Ue(k,A.x,A.y,L,C),D=(Q||m)&&!(Q&&m)&&(v.rotation??0)!==0&&b.rotation!==v.rotation;return kt({...v,width:L,height:C,x:V[0]-L/2,y:V[1]-C/2,flipX:Q?!v.flipX:!!v.flipX,flipY:m?!v.flipY:!!v.flipY,rotation:D?-(v.rotation??0):v.rotation??0},x)})(g,o,f);case"text":return((v,b,k,Q)=>{const{isXinverted:m,isYinverted:x,settings:w,widthMultiplier:Z,heightMultiplier:A}=Q,L=(m||x)&&!(m&&x)&&(b.rotation??0)!==0&&k.rotation!==b.rotation,C=$e(b,k,Q),V=(b.width||1)*Z,D=(b.height||1)*A,z=Ue(Q,C.x,C.y,V,D),B=Pt({...b,width:V,height:D,x:z[0]-V/2,y:z[1]-D/2,flipX:m?!b.flipX:!!b.flipX,flipY:x?!b.flipY:!!b.flipY,rotation:L?-(b.rotation??0):b.rotation??0},w);return{...B,fontSize:jt(v,B.value,B.width,B.style?.fontBold??!1,B.style?.fontItalic??!1,B.style?.fontFamily)}})(e,g,o,f);case"ellipse":return((v,b,k)=>{const{isXinverted:Q,isYinverted:m,settings:x,widthMultiplier:w,heightMultiplier:Z}=k,A=(Q||m)&&!(Q&&m)&&(v.rotation??0)!==0&&b.rotation!==v.rotation,L=$e(v,b,k),C=(v.radiusX||.5)*w,V=(v.radiusY||.5)*Z,D=Ue(k,L.x,L.y,2*C,2*V);return Ct({...v,radiusX:C,radiusY:V,x:D[0],y:D[1],rotation:A?-(v.rotation??0):v.rotation??0},x)})(g,o,f);case"circle":return((v,b,k)=>{const Q=$e(v,b,k),m=(v.radius||.5)*k.widthMultiplier,x=Ue(k,Q.x,Q.y,2*m,2*m);return bt({...v,radius:m,x:x[0],y:x[1]},k.settings)})(g,o,f);case"brush":return((v,b,k)=>{const{isXinverted:Q,isYinverted:m,settings:x,widthMultiplier:w,heightMultiplier:Z}=k,A=_t({...v,scaleX:1,scaleY:1},x),L=(v.scaleX??1)*w,C=(v.scaleY??1)*Z,V=(A.width-2*x.selectionPadding)*L,D=(A.height-2*x.selectionPadding)*C,z=$e(v,b,k),B=Ue(k,z.x,z.y,V,D),E=ze(B[0]-V/2-v.computed.borders.x-x.selectionPadding)+(Q?2*v.computed.borders.x+A.width:0),I=ze(B[1]-D/2-v.computed.borders.y-x.selectionPadding)+(m?2*v.computed.borders.y+A.height:0),Y=(Q||m)&&!(Q&&m)&&(v.rotation??0)!==0&&b.rotation!==v.rotation;return ot({...v,points:v.points.map(U=>U.map(([H,S])=>[Q?-H+E:H+E,m?-S+I:S+I])),scaleX:L,scaleY:C,rotation:Y?-(v.rotation??0):v.rotation??0},k.settings)})(g,o,f);case"line":case"polygon":case"curve":return Wa(g,o,f);default:return Vs(e,t,g,s,a,i,c)}})},Zs=(e,t,n,s)=>{switch(e.type){case"rect":case"square":case"ellipse":case"circle":case"picture":case"text":return Ae({...e,x:e.x+t,y:e.y+n},s);case"line":case"polygon":case"curve":return Ae({...e,points:e.points.map(([a,i])=>[a+t,i+n])},s);case"brush":return Ae({...e,points:e.points.map(a=>a.map(([i,c])=>[i+t,c+n]))},s);default:return e}},Hs=(e,t,n,s,a)=>{const i=t.computed.borders,c=((l,u)=>u?[Math.abs(l[0])>Math.abs(l[1])?l[0]:0,Math.abs(l[1])>Math.abs(l[0])?l[1]:0]:l)([e[0]-n[0],e[1]-n[1]],a),o=c[0]===0?0:fe(i.x+s.selectionPadding+c[0],s)-(i.x+s.selectionPadding),r=c[1]===0?0:fe(i.y+s.selectionPadding+c[1],s)-(i.y+s.selectionPadding);return $(t).map(l=>Zs(l,o,r,s))},Ae=(e,t)=>{switch(e.type){case"rect":case"square":return Ma(e,t);case"ellipse":return Aa(e,t);case"circle":return Va(e,t);case"picture":return Na(e,t);case"text":return Oa(e,t);case"line":return Ia(e,t);case"polygon":return xs(e,t);case"curve":return bs(e,t);case"brush":return ma(e,t);default:return e}},zs=({ctx:e,shape:t,settings:n,selectionWidth:s,selectionColor:a,hoverMode:i,selectionMode:c,withAnchors:o=!0})=>{switch(n.debug&&((r,l,u,d)=>{l.selection&&d.debug&&(r.save(),r.scale(d.canvasSize.scaleRatio,d.canvasSize.scaleRatio),r.translate(d.canvasOffset[0],d.canvasOffset[1]),xe(r,{fillColor:"transparent",strokeColor:"green",lineWidth:u/d.canvasSize.scaleRatio}),r.strokeRect(l.computed.boundingBox.x,l.computed.boundingBox.y,l.computed.boundingBox.width,l.computed.boundingBox.height),r.restore())})(e,t,s,n),t.type){case"rect":case"square":case"circle":case"ellipse":case"picture":case"text":case"brush":((r,l,u,d,p,f)=>{if(l.selection&&(it(r,p,l.rotation,l.computed.center),p.debug&&(xe(r,{fillColor:"transparent",strokeColor:"red",lineWidth:d/p.canvasSize.scaleRatio}),r.strokeRect(l.computed.outerBorders.x,l.computed.outerBorders.y,l.computed.outerBorders.width,l.computed.outerBorders.height)),xe(r,{fillColor:"transparent",strokeColor:u,lineWidth:d/p.canvasSize.scaleRatio}),l.selection.shapePath?r.stroke(l.selection.shapePath):r.stroke(l.selection.border),f&&!l.locked)){l.selection.shapePath&&r.stroke(l.selection.border),l.selection.line&&r.stroke(l.selection.line),xe(r,{fillColor:"rgb(255,255,255)",strokeColor:"rgb(150,150,150)",lineWidth:2/p.canvasSize.scaleRatio,shadowColor:u,shadowBlur:0});for(const g of l.selection.anchors)r.fill(g),r.stroke(g)}})(e,t,a,s,n,o);break;case"group":((r,l,u,d,p,f,g)=>{if(l.selection&&(l.shapes.forEach(v=>{xe(r,{fillColor:"transparent",strokeColor:u,lineWidth:d/f.canvasSize.scaleRatio}),it(r,f,v.rotation,v.computed.center),v.selection?.shapePath&&r.stroke(v.selection.shapePath),r.restore()}),p.mode!=="rotate"&&(it(r,f,l.rotation,l.computed.center),f.debug&&(xe(r,{fillColor:"transparent",strokeColor:"red",lineWidth:d/f.canvasSize.scaleRatio}),r.strokeRect(l.computed.outerBorders.x,l.computed.outerBorders.y,l.computed.outerBorders.width,l.computed.outerBorders.height)),xe(r,{fillColor:"transparent",strokeColor:u,lineWidth:d/f.canvasSize.scaleRatio}),g&&!l.locked))){r.stroke(l.selection.border),l.selection.line&&r.stroke(l.selection.line),xe(r,{fillColor:"rgb(255,255,255)",strokeColor:"rgb(150,150,150)",lineWidth:2/f.canvasSize.scaleRatio});for(const v of l.selection.anchors)r.fill(v),r.stroke(v)}})(e,t,a,s,c,n,o);break;case"polygon":case"line":case"curve":(({ctx:r,shape:l,withAnchors:u,selectionWidth:d,selectionColor:p,hoverMode:f,settings:g})=>{if(l.selection&&(it(r,g,l.rotation,l.computed.center),g.debug&&(xe(r,{fillColor:"transparent",strokeColor:"red",lineWidth:d/g.canvasSize.scaleRatio}),r.strokeRect(l.computed.outerBorders.x,l.computed.outerBorders.y,l.computed.outerBorders.width,l.computed.outerBorders.height)),xe(r,{fillColor:"transparent",strokeColor:p,lineWidth:d/g.canvasSize.scaleRatio}),l.selection.shapePath&&r.stroke(l.selection.shapePath),u&&!l.locked)){xe(r,{fillColor:"rgb(255,255,255)",strokeColor:"rgb(150,150,150)",lineWidth:2/g.canvasSize.scaleRatio,shadowColor:p,shadowBlur:0});for(let v=0;v<l.selection.anchors.length;v++){const b=l.selection.anchors[v];f.mode==="resize"&&f.anchor===v?(r.shadowBlur=10,r.fill(b),r.shadowBlur=0):r.fill(b),r.stroke(b)}}})({ctx:e,shape:t,withAnchors:o,selectionWidth:s,selectionColor:a,hoverMode:i,settings:n})}e.restore()},Ua=({ctx:e,selectionFrame:t,settings:n})=>{it(e,n),((s,a,i)=>{xe(s,{fillColor:"rgba(170,170,170, 0.1)",strokeColor:"rgb(170,170,170)",lineWidth:1/i.canvasSize.scaleRatio}),s.fillRect(a[0][0],a[0][1],a[1][0]-a[0][0],a[1][1]-a[0][1]),s.strokeRect(a[0][0],a[0][1],a[1][0]-a[0][0],a[1][1]-a[0][1])})(e,t.frame,n),e.restore()},cn=e=>e.filter(t=>t!=null),Ts=e=>{const t=new DOMParser().parseFromString(e,"text/xml").getElementsByTagName("svg")[0];if(!t)return"";const n=t.getAttribute("width"),s=t.getAttribute("height");let a;if(n||s)a=e;else{const c=t.getAttribute("viewBox")??"0 0 300 300",[,,o,r]=c.split(" ");t.setAttribute("width",o??"300"),t.setAttribute("height",r??"300"),a=new XMLSerializer().serializeToString(t)}const i=new Blob([a],{type:"image/svg+xml"});return URL.createObjectURL(i)},As=e=>(e instanceof File?e.name:e).includes(".svg"),Es=e=>As(e)?fetch(e).then(t=>t.text()).then(t=>Ts(t)):fetch(e).then(t=>t.blob()).then(t=>URL.createObjectURL(t)),Rs=(e,t)=>{const n=document.createElement("a");n.href=e,n.download=t,document.body.appendChild(n),n.click(),document.body.removeChild(n)},qa=e=>e.src.includes("<svg")?e.src:(t=>{const n=document.createElement("canvas");n.width=t.width,n.height=t.height;const s=n.getContext("2d");return s?(s.drawImage(t,0,0),n.toDataURL("image/png")):""})(e.img),dn=({shapes:e,settings:t})=>{const n=document.createElement("canvas"),s=n.getContext("2d");if(!s)throw new Error("No context found for canvas");const{realHeight:a,realWidth:i}=t.canvasSize;n.width=i,n.height=a,s.clearRect(0,0,i,a),ts(s);for(let c=e.length-1;c>=0;c--)Ls(s,e[c],t);return n.toDataURL("image/png")},Ds=({shapes:e,settings:t,view:n})=>{if(n==="fitToShapes"&&!e.length)throw new Error("No image found to export");if(n==="fitToShapes"){const a=Math.min(...e.map(l=>l.computed.boundingBox.x)),i=Math.max(...e.map(l=>l.computed.boundingBox.x+l.computed.boundingBox.width)),c=Math.min(...e.map(l=>l.computed.boundingBox.y)),o=Math.max(...e.map(l=>l.computed.boundingBox.y+l.computed.boundingBox.height)),r={...t,canvasOffset:[-a,-c],canvasZoom:1,canvasSize:{realWidth:i-a,realHeight:o-c,width:i-a,height:o-c,scaleRatio:1,scaleRatioWithNoZoom:1}};return dn({shapes:e,settings:r})}if(n==="defaultView"){const a={...t,canvasOffset:[0,0],canvasZoom:1,canvasSize:{...t.canvasSize,width:t.canvasSize.realWidth,height:t.canvasSize.realHeight,scaleRatio:1,scaleRatioWithNoZoom:1}};return dn({shapes:e,settings:a})}const s={...t,canvasSize:{...t.canvasSize,width:t.canvasSize.realWidth,height:t.canvasSize.realHeight,scaleRatio:t.canvasZoom,scaleRatioWithNoZoom:1}};return dn({shapes:e,settings:s})},Ga=(e,t,n)=>{return a=un(e,t,n),`data:text/plain;charset=utf-8,${encodeURIComponent(JSON.stringify(a))}`;var a},_a=e=>{const t=["img","id","selection","path","arrows","tempPoint","computed",["flipX",[void 0,!1]],["flipY",[void 0,!1]]];return e.map(n=>n.type!=="picture"||n.src.startsWith("http")?$t(t,n):$t(t,{...n,src:qa(n)}))},un=(e,t,n)=>({shapes:_a(e),config:{width:t,height:n}}),Is=(e,t)=>Ae({...e,id:le(`${e.type}_`)},t),Ka=(e,t,n,s)=>{const a=y.useRef([]),i=y.useRef({dataChanged:[]}),[c,o]=y.useState(void 0),[r,l]=y.useState(void 0),[u,d]=y.useState(void 0),[p,f]=y.useState({states:[{shapes:[],selectedShape:void 0,source:"remote"}],cursor:0}),g=p.cursor>0,v=p.cursor<p.states.length-1,b=a.current.length>0,k=y.useCallback(()=>{f(S=>Jn(S.states[S.cursor]?.shapes,a.current)?S:{states:[...S.states.slice(0,S.cursor+1),{shapes:a.current,selectedShape:r,source:"user"}],cursor:S.cursor+1})},[r]),Q=y.useCallback(S=>{a.current=[...S,...a.current]},[]),m=y.useCallback(S=>{a.current=a.current.flatMap(M=>{const P=S.find(T=>T.id===M.id);return P?[{...P,id:le(`${M.type}_`)},M]:M})},[]),x=y.useCallback((S,M,P,T)=>{if(S.target&&"className"in S.target&&![qn,Gn].includes(S.target.className)||!T)return void d(void 0);const j=a.current.find(O=>$(r)?.map(W=>W.id).includes(O.id)?!!dt(M,O,P,e):!!vs(M,O,P,e));d(j)},[e,r]),w=y.useCallback(async(S,M=300,P=300)=>{const T=await Fa(S,M,P,e);return Q([T]),k(),T},[Q,k,e]),Z=y.useCallback((S,M=!1)=>{a.current=a.current.map(P=>S.find(T=>T.id===P.id)??P),l(P=>P&&ce($(P).map(T=>S.find(j=>j.id===T.id)??T),e)),M&&k()},[k,e]),A=y.useCallback(S=>{const M=S.map(P=>$t(["chosen"],P));a.current=M,k()},[k]),L=y.useCallback(S=>{const M=new Set(S.map(P=>P.id));l(P=>{const T=$(P).map(j=>j.id);return T&&M.size&&T.find(j=>M.has(j))?void 0:P}),a.current=a.current.filter(P=>!M?.has(P.id)),k()},[k]),C=y.useCallback(S=>{f(M=>{const P=S(M);return a.current=M.states[P]?.shapes??[],l(M.states[P]?.selectedShape),Qe("cursor",P,M)})},[]),V=y.useCallback(()=>{C(S=>Math.max(0,S.cursor-1))},[C]),D=y.useCallback(()=>{C(S=>Math.min(S.states.length-1,S.cursor+1))},[C]),z=y.useCallback((S,M)=>{l(void 0),a.current=S,f(P=>M.clearHistory?{states:[{shapes:S,selectedShape:void 0,source:M.source}],cursor:0}:{states:[...P.states.slice(0,P.cursor+1),{shapes:S,selectedShape:void 0,source:M.source}],cursor:P.cursor+1})},[]),B=y.useCallback((S,M)=>{const P=a.current,T=P.findIndex(R=>R.id===S),j=P.findIndex(R=>R.id===M);var O,W,F;A((O=P,F=j,(W=T)<0||F<0||W>O.length-1||F>O.length-1?O:W<F?[...O.slice(0,W),...O.slice(W+1,F+1),O[W],...O.slice(F+1,O.length)]:[...O.slice(0,F),O[W],...O.slice(F,W),...O.slice(W+1,O.length)]))},[A]),E=y.useCallback(S=>{const M=a.current,P=new Set(S.map(j=>j.id)),T=M.map(j=>P.has(j.id)?Qe("visible",j.visible===!1,j):j);l(us(j=>Qe("visible",j.visible===!1,j),e)),A(T)},[A,e]),I=y.useCallback(S=>{const M=a.current,P=new Set(S.map(j=>j.id)),T=M.map(j=>P.has(j.id)?Qe("locked",!j.locked,j):j);l(us(j=>Qe("locked",!j.locked,j),e)),A(T)},[A,e]),Y=y.useCallback((S,M)=>{i.current.hasOwnProperty(S)&&(i.current[S]=[...i.current[S],M])},[]),U=y.useCallback((S,M)=>{if(i.current.hasOwnProperty(S))if(M){const P=i.current[S].indexOf(M);i.current[S]=[...i.current[S].slice(0,P),...i.current[S].slice(P+1)]}else i.current[S]=[]},[]);y.useEffect(()=>{const S=p.states[p.cursor],M=un(S.shapes,t,n);for(const P of i.current.dataChanged)P(M,S.source)},[t,n,p]),y.useEffect(()=>{a.current=a.current.map(S=>Ae(S,e)),l(S=>S===void 0?void 0:ce($(S).map(M=>Ae(M,e)),e))},[e]);const H=y.useCallback((S,M)=>{o(P=>{const T=[P?.frame[0]??[M[0],M[1]],[M[0],M[1]]],j=a.current.filter(W=>((F,R,ee,re)=>{const{selectionPadding:se}=re,{center:q,borders:N}=R.computed,ae=Le(ee[0],R.rotation??0,q),te=Le(ee[1],R.rotation??0,q),ve=Math.round(Math.min(ae[0],te[0])-se/2),Ce=Math.round(Math.max(ae[0],te[0])+se),de=Math.round(Math.min(ae[1],te[1])-se/2),_={x:ve,y:de,width:Ce-ve,height:Math.round(Math.max(ae[1],te[1])+se)-de},ue=nn(N,_);if(!ue)return!1;if(N.width<=1||N.height<=1||!("path"in R)||!R.path)return!0;if(F.lineWidth=(R.style?.lineWidth??0)+10,R.type==="brush"){const me=R.points.flat(),Ee=Math.min(...me.map(J=>J[0])),Ve=Math.min(...me.map(J=>J[1]));for(const J of R.points){if(J.length<1)break;if(J.length<2){const he=je(J[0],Ee,Ve,R.scaleX,R.scaleY);if(ns(ue,{x:he[0],y:he[1],radius:(R.style?.lineWidth??1)/2}))return!0}for(let he=0;he<J.length-1;he++){const Ie=je(J[he],Ee,Ve,R.scaleX,R.scaleY),We=je(J[he+1],Ee,Ve,R.scaleX,R.scaleY),Me=nn({x:Math.min(Ie[0],We[0]),y:Math.min(Ie[1],We[1]),width:Math.abs(Ie[0]-We[0]),height:Math.abs(Ie[1]-We[1])},_);if(Me){const _e=new Path2D;if(_e.moveTo(...Ie),_e.lineTo(...We),ms({ctx:F,path:_e,rect:Me,offset:10,checkFill:!1}))return!0}}}return!1}const X=!(!R.style?.fillColor||R.style?.fillColor==="transparent");return ms({ctx:F,path:R.path,rect:ue,offset:10,checkFill:X})})(S,W,T,e)),O=ce(j,e);return l(s?ce(hs(P?.oldSelection,j),e):O),{oldSelection:P?.oldSelection,frame:T}})},[e,s]);return{registerEvent:Y,unregisterEvent:U,shapesRef:a,selectedShape:r,hoveredShape:u,selectionFrame:c,setSelectionFrame:o,refreshSelectedShapes:H,addShapes:Q,duplicateShapes:m,addPictureShape:w,moveShapes:B,saveShapes:k,setSelectedShape:l,refreshHoveredShape:x,toggleShapeVisibility:E,toggleShapeLock:I,removeShape:L,updateShape:Z,backwardShape:V,forwardShape:D,clearShapes:z,canGoBackward:g,canGoForward:v,canClear:b}},Ws=e=>{const t=[e[0].clientX,e[0].clientY],n=[e[1].clientX,e[1].clientY];var s,a;return{diff:is(t,n),center:(a=n,[((s=t)[0]+a[0])/2,(s[1]+a[1])/2])}},Ja=({canvasElt:e,canvasTransformation:t,canvasSize:n,size:s,setCanvasTransformation:a})=>{const i=y.useRef([]),[c,o]=y.useState(i.current.length>0),r=y.useRef(null),l=y.useRef(t);l.current=t;const u=y.useCallback(({startDiff:d,startZoom:p,startCenter:f,startOffset:g,currentDiff:v,currentCenter:b,isMoving:k,isZooming:Q})=>{if(!e||!v||!d)return;const m=(({canvasBoundingRect:x,canvasSize:w,size:Z,startDiff:A,startZoom:L,startCenter:C,startOffset:V,currentDiff:D,currentCenter:z,isMoving:B,isZooming:E})=>{const I=E?He(D/A*L,be[0],be[be.length-1]):L,Y=B?[V[0]+(z[0]-C[0])*(w.width/x.width)/w.scaleRatio/L,V[1]+(z[1]-C[1])*(w.height/x.height)/w.scaleRatio/L]:[V[0],V[1]],U=[(z[0]-x.left)/w.scaleRatio,(z[1]-x.top)/w.scaleRatio];return on({size:Z,canvasSize:w,currentOffset:Y,currentZoom:L,zoom:I,centerPoint:U})})({canvasBoundingRect:e.getBoundingClientRect(),canvasSize:n,size:s,startDiff:d,startZoom:p,startCenter:f,startOffset:g,currentDiff:v,currentCenter:b,isMoving:k,isZooming:Q});a(m)},[e,n,s,a]);y.useEffect(()=>{if(!e)return;const d=p=>{if(i.current=[...i.current,p],o(i.current.length>0),i.current.length===2){p.stopPropagation();const{diff:f,center:g}=Ws(i.current);r.current={startDiff:f,startCenter:g,startZoom:l.current.zoom,startOffset:l.current.offset,isMoving:!1,isZooming:!1}}};return e.addEventListener("pointerdown",d),()=>{e.removeEventListener("pointerdown",d)}},[e]),y.useEffect(()=>{if(!c)return;const d=f=>{const g=i.current.findIndex(v=>v.pointerId===f.pointerId);if(g>-1&&(i.current[g]=f),i.current.length===2&&r.current){const{diff:v,center:b}=Ws(i.current),k=r.current.isZooming||((m,x)=>Math.abs(m-x.startDiff)>30)(v,r.current),Q=r.current.isMoving||k||((m,x)=>Math.abs(is(m,x.startCenter))>10)(b,r.current);r.current={...r.current,isMoving:Q,isZooming:k},u({...r.current,currentDiff:v,currentCenter:b})}},p=f=>{i.current=i.current.filter(g=>g.pointerId!==f.pointerId),o(i.current.length>0)};return document.addEventListener("pointermove",d),document.addEventListener("pointerup",p),document.addEventListener("pointerout",p),document.addEventListener("pointercancel",p),document.addEventListener("pointerleave",p),()=>{document.removeEventListener("pointermove",d),document.removeEventListener("pointerup",p),document.removeEventListener("pointerout",p),document.removeEventListener("pointercancel",p),document.removeEventListener("pointerleave",p)}},[c,u])},Ns={offset:[0,0],zoom:1},ei=({canvasSize:e,size:t,zoomEnabled:n,canvasElt:s})=>{const[a,i]=y.useState(Ns),c=y.useRef(0),o=y.useCallback(u=>{i(({zoom:d})=>an({zoom:d,size:t,canvasSize:e,newOffset:u}))},[e,t]),r=y.useCallback(u=>{i(({offset:d,zoom:p})=>(({size:f,canvasSize:g,currentOffset:v,currentZoom:b,action:k})=>{const Q=k==="default"?be[4]:k==="zoom"?be[He(be.length-1-be.slice(0).reverse().findIndex(x=>x<=b)+1,0,be.length-1)]:be[He(be.findIndex(x=>x>=b)-1,0,be.length-1)],m=[g.realWidth/2,g.realHeight/2];return on({size:f,canvasSize:g,currentOffset:v,currentZoom:b,zoom:Q,centerPoint:m})})({size:t,canvasSize:e,currentOffset:d,currentZoom:p,action:u}))},[e,t]);Ja({canvasElt:s,canvasTransformation:a,canvasSize:e,size:t,setCanvasTransformation:i});const l=y.useCallback(()=>{i(Ns)},[]);return y.useEffect(()=>{if(!n||!s)return;const u=d=>{const p=d.ctrlKey,{deltaX:f,deltaY:g}=((Q,m)=>{const x=Math.abs(Q.deltaY)<50&&m<50,w=Q.ctrlKey,Z=es()&&x&&w;switch(Q.deltaMode){case WheelEvent.DOM_DELTA_LINE:return{deltaX:16*Q.deltaX,deltaY:16*Q.deltaY};case WheelEvent.DOM_DELTA_PAGE:return{deltaX:Q.deltaX*window.innerHeight,deltaY:Q.deltaY*window.innerHeight};default:return Z?{deltaX:5*Q.deltaX,deltaY:5*Q.deltaY}:{deltaX:Q.deltaX,deltaY:Q.deltaY}}})(d,d.timeStamp-c.current);if(c.current=d.timeStamp,p){d.preventDefault();const Q=gs(d,s,e);return void i(({offset:m,zoom:x})=>(({size:w,canvasSize:Z,currentOffset:A,currentZoom:L,delta:C,centerPoint:V})=>{const D=He(L*(1-C/1e3),be[0],be[be.length-1]);return on({size:w,canvasSize:Z,currentOffset:A,currentZoom:L,zoom:D,centerPoint:V})})({size:t,canvasSize:e,currentOffset:m,currentZoom:x,delta:g,centerPoint:Q}))}const v=d.shiftKey,[b,k]=v?[g,f]:[f,g];i(({offset:Q,zoom:m})=>{const x=[Q[0]-b/m,Q[1]-k/m],w=an({zoom:m,size:t,canvasSize:e,newOffset:x});return w.offset[0]===Q[0]&&w.offset[1]===Q[1]||d.preventDefault(),w})};return s.addEventListener("wheel",u,{passive:!1}),()=>{s.removeEventListener("wheel",u)}},[s,t,e,n]),{setCanvasTransformation:i,setCanvasOffset:o,setCanvasZoom:r,resetZoom:l,canvasTransformation:a}},Fs=(e,t=!1)=>{const n=(a,i)=>{if(Array.isArray(a))return i},s=e.map(a=>{if(typeof a!="object")return null;switch(a.type){case"brush":return Ze(n,Tn,a);case"circle":return Ze(n,Wn,a);case"curve":return Ze(n,Rn,a);case"ellipse":return Ze(n,Nn,a);case"line":return Ze(n,An,a);case"polygon":return Ze(n,En,a);case"rect":return Ze(n,Dn,a);case"square":return Ze(n,In,a);case"text":return Ze(n,Fn,a)}return null});return cn(t?[...s,Ot]:s)},ti=({addShapes:e,drawCanvasRef:t,setActiveTool:n,refreshHoveredShape:s,shapes:a,selectionMode:i,activeTool:c,isInsideComponent:o,setCanvasOffset:r,selectedShape:l,canvasOffsetStartData:u,refreshSelectedShapes:d,setSelectedShape:p,setSelectionFrame:f,setCanvasOffsetStartData:g,updateSingleShape:v,duplicateShapes:b,saveShapes:k,setSelectionMode:Q,setCanvasMoveAcceleration:m,settings:x,isShiftPressed:w,isAltPressed:Z,withFrameSelection:A,isSpacePressed:L})=>{const[C,V]=y.useState({mode:"default"}),{registerDoubleClickEvent:D,unRegisterDoubleClickEvent:z}=(()=>{const S=y.useRef(void 0),M=y.useRef(void 0),P=T=>{const j=Date.now();S.current&&j<S.current+300&&M.current?.(T),S.current=Date.now()};return{registerDoubleClickEvent:(T,j)=>{M.current=j,T.addEventListener("click",P),T.addEventListener("touchend",P)},unRegisterDoubleClickEvent:T=>{T.removeEventListener("click",P),T.removeEventListener("touchend",P)}}})(),B=y.useRef(null);B.current=S=>((M,P,T,j,O,W,F,R,ee,re,se,q,N,ae,te,ve,Ce)=>{if(ct(M)&&M.touches.length>1)return;const de=P.current?.getContext("2d");if(!de)return;const _=lt(M,P.current,N);if(j.mode==="selectionFrame"){q(de,_,N);const X=gs(M,P.current,N.canvasSize);return void Ce([Math.ceil(He(X[0]*N.canvasZoom<50?X[0]*N.canvasZoom-50:X[0]*N.canvasZoom>N.canvasSize.width/N.canvasSize.scaleRatioWithNoZoom-50?X[0]*N.canvasZoom-(N.canvasSize.width/N.canvasSize.scaleRatioWithNoZoom-50):0,-100,100)/5/N.canvasZoom),Math.ceil(He(X[1]*N.canvasZoom<50?X[1]*N.canvasZoom-50:X[1]*N.canvasZoom>N.canvasSize.height/N.canvasSize.scaleRatioWithNoZoom-50?X[1]*N.canvasZoom-(N.canvasSize.height/N.canvasSize.scaleRatioWithNoZoom-50):0,-100,100)/5/N.canvasZoom)])}if(W!==void 0)return void se([_[0]+N.canvasOffset[0]-W.start[0],_[1]+N.canvasOffset[1]-W.start[1]]);if(j.mode==="preview"){const X=$(T)[0];if(X?.type==="curve"){const me=ws(X,_,N,!0);return void ve(ce([me],N))}if(X?.type==="polygon"){const me=Qs(X,_,N,!0);return void ve(ce([me],N))}}const ue=gt(_,N);if(ct(M)||R(M,de,_,ue),T===void 0||T.locked)F({mode:"default",outOfView:!ue});else{if(j.mode==="default"||j.mode==="textedition"){if(!ue)return void F({mode:"default"});F(dt(de,T,_,N,!0)||{mode:"default"})}else{const X=P.current?.getContext("2d");if(!X)return;const me=ya(X,T,_,j,N,ae,te);ee($(me))}j.mode==="translate"&&te&&!j.hasBeenDuplicated&&(O({...j,hasBeenDuplicated:!0}),re($(j.originalShape)))}})(S,t,l,i,Q,u,V,s,v,b,r,d,x,w,Z,p,m),y.useEffect(()=>{if(o){const S=M=>B.current?.(M);return document.addEventListener("mousemove",S),document.addEventListener("touchmove",S),()=>{document.removeEventListener("mousemove",S),document.removeEventListener("touchmove",S)}}},[o]);const{isBrushShapeDoneOnMouseUp:E}=x,I=y.useRef(null);I.current=S=>{if(ct(S)&&S.touches.length>1)return;const M=t.current?.getContext("2d");if(!M)return;if("button"in S&&S.button===2)return p(void 0),n(De),Q({mode:"default"}),void f(void 0);if(u)return void g(void 0);if(i.mode==="textedition"||i.mode==="preview")return;const P=lt(S,t.current,x);if(i.mode==="translate"&&Date.now()-i.dateStart<=500&&P[0]===i.cursorStartPosition[0]&&P[1]===i.cursorStartPosition[1]){if(!(S.ctrlKey||S.shiftKey||S.metaKey)){const{shape:T}=ds(M,a,P,x,void 0,ct(S),A,!1);p(T)}return Q({mode:"default"}),f(void 0),void k()}i.mode!=="default"&&(i.mode==="brush"&&E&&p(void 0),Q({mode:"default"}),f(void 0),k())},y.useEffect(()=>{if(o){const S=M=>I.current?.(M);return document.addEventListener("mouseup",S),document.addEventListener("touchend",S),()=>{document.removeEventListener("mouseup",S),document.removeEventListener("touchend",S)}}},[o]);const Y=!x.features.edition&&x.features.zoom,U=!x.features.edition&&!x.features.zoom,H=y.useRef(null);return H.current=(S,M,P)=>{if(S.preventDefault(),ct(S)&&S.touches.length>1)return;const T=M?.getContext("2d");if(!T)return;M.focus();const j=lt(S,t.current,x),O="button"in S&&S.button===1;if(!("button"in S&&S.button===2)){if(O||P||c.type==="move")g({start:j,originalOffset:x.canvasOffset});else if(!Y){if(!gt(j,x))return p(void 0),void Q({mode:"default"});if(c.type==="selection"){const W=S.ctrlKey||S.shiftKey||S.metaKey,{shape:F,mode:R}=ds(T,a,j,x,l,ct(S),A,W);p(F),Q(R),R.mode==="selectionFrame"&&f({oldSelection:F,frame:[[j[0],j[1]],[j[0],j[1]]]})}else if(Un.some(W=>W===c.type)){const W=$(l)[0],F=t.current?.getContext("2d");if(!F)return;if(c.type==="brush"){if(W?.type==="brush"){const R=((ee,re,se)=>{const q={...ee,points:Qe(ee.points.length,[[Math.round(re[0]),Math.round(re[1])]],ee.points)};return ot(q,se)})(W,j,x);v([R])}else{const R=Ps(F,c,j,x);if(!R)return;e([R]),p(ce([R],x))}Q({mode:"brush"})}else if(i.mode!=="preview"||W?.type!=="polygon"&&W?.type!=="curve"){if(c.type!=="picture"){const R=Ps(F,c,j,x);if(!R)return;e([R]);const ee=ce([R],x);p(ee),R.type==="polygon"||R.type==="curve"?Q({mode:"preview"}):(n(De),Q({mode:"resize",cursorStartPosition:[j[0]+x.selectionPadding,j[1]+x.selectionPadding],originalShape:ee,anchor:R.type==="line"?0:[1,1]}))}}else{const R=W.type==="polygon"?Qs(W,j,x):ws(W,j,x);p(ce([R],x)),v([R],!0)}}}}},y.useEffect(()=>{if(U)return;const S=t.current;if(!S)return;const M=P=>H.current?.(P,S,L);return S.addEventListener("mousedown",M,{passive:!1}),S.addEventListener("touchstart",M,{passive:!1}),()=>{S.removeEventListener("mousedown",M),S.removeEventListener("touchstart",M)}},[U,t,L]),y.useEffect(()=>{const S=t.current,M=t.current?.getContext("2d");if(!(!S||!M))return o?(D(S,P=>{if(c.type==="selection"){if($(l).length!==1)return;const T=$(l)[0];if(T?.type==="text"){const j=lt(P,t.current,x);return gt(j,x)?void(dt(M,l,j,x)&&Q({mode:"textedition",defaultValue:T.value})):void 0}if(T?.type==="polygon"){const j=lt(P,t.current,x);if(!gt(j,x))return;const O=fs(M,T,j,x);return void(O&&v([Za(T,O.lineIndex,j,x)]))}if(T?.type==="curve"){const j=lt(P,t.current,x);if(!gt(j,x))return;const O=((W,F,R,ee,re=50)=>{if(F.locked||F.points.length<2)return!1;if(F.points.length<3)return fs(W,F,R,ee,re);const{center:se}=F.computed,q=Le(R,F.rotation??0,se);W.lineWidth=(F.style?.lineWidth??0)+re/ee.canvasZoom;const N=Jt(F,F.points),ae=new Path2D;ae.moveTo(...N[0]);for(let te=1;te<N.length-2;te++){const ve=N[te-1],Ce=N[te],de=N[te+1],_=N[te+2],{cp1:ue,cp2:X}=en(ve,Ce,de,_);if(ae.bezierCurveTo(ue[0],ue[1],X[0],X[1],de[0],de[1]),W.isPointInStroke(ae,q[0],q[1]))return{lineIndex:te-1}}return!1})(M,T,j,x);return void(O&&v([za(T,O.lineIndex,j,x)]))}}}),()=>{z(S)}):void 0},[v,D,z,o,t,c,l,Q,x]),{hoverMode:C}},Os=e=>e.childNodes.length?Array.from(e.childNodes).map(t=>Os(t)).join(""):e.nodeValue??"",ni=({disabled:e=!1,shape:t,defaultValue:n,updateValue:s,saveShapes:a,settings:i})=>{const c=y.useRef(null),o=y.useRef(a);y.useEffect(()=>{if(!c.current)return;const l=c.current,u=d=>{d.preventDefault();const p=d.clipboardData?.getData("text/plain");document.execCommand("insertText",!1,p)};l.addEventListener("paste",u),l.innerText="";for(const d of n){const p=document.createElement("div");d===""?p.innerHTML="<br/>":p.innerText=d,l.appendChild(p)}return l.focus(),()=>{l.removeEventListener("paste",u)}},[n]),y.useEffect(()=>{const l=o.current;return()=>{l()}},[]);const r=y.useMemo(()=>{const{borders:l,center:u}=t.computed;return ne({point:[l.x,l.y],rotation:-(t.rotation??0),origin:u})},[t]);return h.jsx("div",{className:"react-paint-editor-toolbox-edittextbox",ref:c,"data-fontbold":t.style?.fontBold??!1,"data-fontitalic":t.style?.fontItalic??!1,contentEditable:!e,onInput:l=>{const u=Array.from(l.target.childNodes).map(d=>Os(d));s(u)},style:{"--react-paint-editor-toolbox-edittextbox-transform":`translate3D(${(r[0]+i.canvasOffset[0])*i.canvasSize.scaleRatio}px, ${(r[1]+i.canvasOffset[1])*i.canvasSize.scaleRatio}px, 0) rotate(${Gt(t.rotation??0)}deg)`,"--react-paint-editor-toolbox-edittextbox-fontsize":t.fontSize*i.canvasSize.scaleRatio+"px","--react-paint-editor-toolbox-edittextbox-padding":i.selectionPadding*i.canvasSize.scaleRatio+"px","--react-paint-editor-toolbox-edittextbox-color":t.style?.strokeColor??"inherit","--react-paint-editor-toolbox-edittextbox-opacity":(t.style?.opacity??100)/100,"--react-paint-editor-toolbox-edittextbox-fontfamily":t.style?.fontFamily??pt}})},si=(e,t,n,s,a)=>{ts(e),((i,c)=>{const{canvasZoom:o,size:r,canvasSize:{width:l,height:u}}=c;if(r!=="fixed"||o>=1)return;i.fillStyle="#f5f5f5",i.fillRect(0,0,l,u);const d=ys(c);i.clearRect(d.x,d.y,d.width,d.height),Ss(i,c)})(e,n),((i,c)=>{const{canvasSize:{width:o,height:r},gridGap:l,canvasOffset:u,canvasSize:{scaleRatio:d}}=c;if(!l)return;i.strokeStyle="rgb(220,220,220)",i.lineWidth=1,i.save(),i.scale(d,d),i.beginPath();const p=u[0]%l,f=u[1]%l,g=Math.ceil(o/d/l)+2,v=Math.ceil(r/d/l)+2;for(let b=-5;b<g;b++)i.moveTo(p+(b+1)*l,f-l),i.lineTo(p+(b+1)*l,f+r/d+l);for(let b=-5;b<v;b++)i.moveTo(p-l,f+(b+1)*l),i.lineTo(p+o/d+l,f+(b+1)*l);i.stroke(),i.restore()})(e,n);for(let i=s.length-1;i>=0;i--)t.mode==="textedition"&&s[i]===a||Ls(e,$(a).find(c=>c.id===s[i].id)??s[i],n)},ai=y.forwardRef(({canGrow:e,shapes:t,duplicateShapes:n,addShapes:s,updateSingleShape:a,selectedShape:i,setSelectedShape:c,setSelectionFrame:o,hoveredShape:r,selectionFrame:l,refreshHoveredShape:u,refreshSelectedShapes:d,saveShapes:p,activeTool:f,setActiveTool:g,canvasOffsetStartData:v,setCanvasOffsetStartData:b,setCanvasOffset:k,setCanvasMoveAcceleration:Q,isInsideComponent:m,selectionMode:x,setSelectionMode:w,selectionWidth:Z,selectionColor:A,settings:L,isEditMode:C,isShiftPressed:V,isAltPressed:D,isSpacePressed:z,withFrameSelection:B,withSkeleton:E},I)=>{const Y=y.useRef(null),U=y.useRef(null),H=L.canvasSize,S=C,M=C?0:-1;y.useImperativeHandle(I,()=>Y.current);const{hoverMode:P}=ti({addShapes:s,drawCanvasRef:Y,setActiveTool:g,shapes:t,selectionMode:x,activeTool:f,isInsideComponent:m,setCanvasOffset:k,selectedShape:i,canvasOffsetStartData:v,setCanvasOffsetStartData:b,setSelectedShape:c,setSelectionFrame:o,refreshHoveredShape:u,refreshSelectedShapes:d,updateSingleShape:a,duplicateShapes:n,saveShapes:p,setSelectionMode:w,setCanvasMoveAcceleration:Q,isShiftPressed:V,isAltPressed:D,withFrameSelection:B,settings:L,isSpacePressed:z}),T=y.useCallback(O=>{const W=$(i)[0];if(W?.type!=="text")return;const F=Y.current?.getContext("2d");if(!F)return;const R=Ae(Ya(F,W,O,L),L);a([R])},[a,i,L]),j=O=>{if(C)return O.preventDefault(),O.stopPropagation(),!1};return y.useEffect(()=>{const O=Y.current?.getContext("2d");O&&window.requestAnimationFrame(()=>si(O,x,L,t,i))},[t,x,i,L]),y.useEffect(()=>{const O=U.current?.getContext("2d");O&&window.requestAnimationFrame(()=>((W,F,R,ee,re,se,q,N,ae,te,ve)=>{W.reset(),Ss(W,R),ve&&N&&!$(q).find(Ce=>Ce.id===N.id)&&ee.type==="selection"&&F.mode==="default"&&zs({ctx:W,shape:N,settings:R,selectionWidth:re,selectionColor:se,hoverMode:ae,selectionMode:F,withAnchors:!1}),q&&ee.type!=="brush"&&zs({ctx:W,shape:q,settings:R,selectionWidth:re,selectionColor:se,hoverMode:ae,selectionMode:F,withAnchors:F.mode!=="textedition"}),te&&Ua({ctx:W,selectionFrame:te,settings:R})})(O,x,L,f,Z,A,i,r,P,l,E))},[r,P,l,x,i,f,L,Z,A,E]),h.jsx("div",{className:"react-paint-canvas-box",style:{"--react-paint-canvas-cursor":v?"grabbing":P.outOfView?"default":P.mode==="resize"?"pointer":f.type!=="selection"&&f.type!=="move"?"crosshair":P.mode==="translate"?"move":P.mode==="rotate"||f.type==="move"||z?"grab":"default"},children:h.jsxs("div",{className:"react-paint-canvas-container","data-grow":e,children:[h.jsx("canvas",{className:qn,ref:Y,"data-grow":e,width:H.width,height:H.height,onContextMenu:j,tabIndex:M}),S&&h.jsx("canvas",{className:Gn,ref:U,width:H.width,height:H.height,"data-grow":e,onContextMenu:j}),C&&x.mode==="textedition"&&$(i)[0]?.type==="text"&&h.jsx(ni,{disabled:!L.features.edition,shape:$(i)[0],defaultValue:x.defaultValue,updateValue:T,saveShapes:p,settings:L})]})})}),Bs="ArrowUp",Ys="ArrowDown",Xs="ArrowLeft",$s="ArrowRight",ii="Delete",oi="Backspace",ri="Escape",Us="Shift",qs="Alt",Gs="Option",Lt=" ",li="z",ci="Z",di="y",ui="Y",hi="+",pi="-",gi="0",_s="copy",Ks="paste",fi=({isInsideComponent:e,isInsideCanvas:t,selectedShape:n,isEditingText:s,settings:a,setSelectedShape:i,setActiveTool:c,setCanvasZoom:o,resetZoom:r,setSelectionMode:l,setSelectionFrame:u,removeShape:d,pasteShapes:p,updateShapes:f,backwardShape:g,forwardShape:v,setShiftPressed:b,setAltPressed:k,setIsSpacePressed:Q})=>{const[m,x]=y.useState(void 0);return y.useEffect(()=>{const w=C=>{n&&(s||(C.preventDefault(),x({...n})))},Z=C=>{m&&(s||(C.preventDefault(),p(((V,D)=>$(V).map(z=>({...Zs(z,20,20,D),id:le(`${z.type}_`)})))(m,a))))},A=C=>{switch(C.key){case Us:b(!1);break;case qs:case Gs:k(!1);break;case Lt:Q(!1)}},L=C=>{if(C.metaKey||C.ctrlKey){if(C.key===ci||C.key===li)return C.preventDefault(),C.stopPropagation(),void(C.shiftKey?v():g());if(!es()&&(C.key===ui||C.key===di))return C.preventDefault(),C.stopPropagation(),void v();if(C.key===hi)return C.preventDefault(),C.stopPropagation(),void o("zoom");if(C.key===pi)return C.preventDefault(),C.stopPropagation(),void o("unzoom");if(C.key===gi)return C.preventDefault(),C.stopPropagation(),void r()}if(C.key===Us)return C.preventDefault(),C.stopPropagation(),void b(!0);if(C.key===Lt&&t)return C.preventDefault(),C.stopPropagation(),void Q(!0);if(C.key===qs||C.key===Gs)return C.preventDefault(),C.stopPropagation(),void k(!0);if(!n)return;if(C.key===ri)return i(void 0),c(De),l({mode:"default"}),void u(void 0);if(s)return;const V={[Xs]:[a.gridGap?-a.gridGap:-1,0],[$s]:[a.gridGap?a.gridGap:1,0],[Ys]:[0,a.gridGap?a.gridGap:1],[Bs]:[0,a.gridGap?-a.gridGap:-1]};switch(C.key){case Xs:case $s:case Ys:case Bs:C.preventDefault(),C.stopPropagation(),f(Hs(V[C.key],n,[0,0],a,!0));break;case ii:case oi:C.preventDefault(),C.stopPropagation(),d($(n))}};if(e)return document.addEventListener("keydown",L),document.addEventListener("keyup",A),document.addEventListener(_s,w),document.addEventListener(Ks,Z),()=>{document.removeEventListener("keydown",L),document.removeEventListener("keyup",A),document.removeEventListener(_s,w),document.removeEventListener(Ks,Z)}},[e,t,m,s,n,a,f,d,i,p,g,v,b,k,c,l,u,o,r,Q]),{}},vi=({isLoading:e=!1})=>{const[t,n]=y.useState("hidden");return y.useEffect(()=>{if(!e){n("fadeOut");const s=setTimeout(()=>n("hidden"),300);return()=>{clearTimeout(s)}}n("visible")},[e]),t==="hidden"?null:h.jsx("div",{className:"react-paint-editor-loading","data-loading":t,style:{"--react-paint-editor-loading-zindex":ha,"--react-paint-editor-loading-transition-duration":"300ms"},children:h.jsxs("div",{className:"react-paint-editor-loader",children:[h.jsx("div",{}),h.jsx("div",{}),h.jsx("div",{}),h.jsx("div",{})]})})},mi="infos",yi=4e3,Si=({type:e,text:t,duration:n})=>{const[s,a]=y.useState(!1);return y.useEffect(()=>{const i=setTimeout(()=>{a(!0)},100),c=setTimeout(()=>{a(!1)},n-500-100);return()=>{clearTimeout(i),clearTimeout(c)}},[n]),h.jsx("div",{className:"react-paint-editor-snackbar","data-is-shown":+s,"data-type":e,style:{"--react-paint-editor-panel-transition-duration":"500ms"},children:t})},xi=({snackbarList:e})=>h.jsx("div",{className:"react-paint-editor-snackbar-container",style:{"--react-paint-editor-snackbar-zindex":pa},children:e.map(t=>h.jsx(Si,{...t},t.id))}),Qi=y.forwardRef((e,t)=>{const{hidden:n=!1,disabled:s=!1,selected:a=!1,icon:i,children:c,className:o="",title:r,onClick:l,...u}=e,d=s?-1:0,p=y.useRef(null);return y.useImperativeHandle(t,()=>p.current),h.jsxs("label",{className:`react-paint-editor-button ${o}`,title:r,onClick:l,"data-disabled":+s,"data-selected":+a,"data-hidden":+n,tabIndex:d,onKeyDown:f=>{f.key===Lt&&(f.preventDefault(),f.stopPropagation())},onKeyUp:f=>{f.preventDefault(),f.stopPropagation(),f.key===Lt&&p.current?.click()},children:[h.jsx("input",{ref:p,disabled:s,...u}),h.jsxs("span",{className:"react-paint-editor-button-content",children:[c&&h.jsx("span",{className:"react-paint-editor-button-children",children:c}),i&&h.jsx("span",{className:"react-paint-editor-button-icon",dangerouslySetInnerHTML:{__html:i}})]})]})}),G=y.forwardRef((e,t)=>{if(e.type==="file"||e.type==="color")return h.jsx(Qi,{...e,ref:t});const{hidden:n=!1,disabled:s=!1,selected:a=!1,icon:i,children:c,type:o="button",className:r="",...l}=e;return h.jsx("button",{className:`react-paint-editor-button ${r}`,ref:t,disabled:s,"data-disabled":+s,"data-selected":+a,"data-hidden":+n,type:o,...l,children:h.jsxs("span",{className:"react-paint-editor-button-content",children:[c&&h.jsx("span",{className:"react-paint-editor-button-children",children:c}),i&&h.jsx("span",{className:"react-paint-editor-button-icon",dangerouslySetInnerHTML:{__html:i}})]})})}),Ge=({children:e,title:t="",className:n="",position:s="bottom",fitContainer:a=!1,alignment:i="center",style:c,...o})=>h.jsxs("div",{className:`react-paint-editor-panel ${n}`,"data-fitcontainer":a,"data-position":s,"data-alignment":i,style:{...c,"--react-paint-editor-panel-zindex":Hn},...o,children:[t&&h.jsx("h3",{className:"react-paint-editor-panel-title",children:t}),e]}),bi=e=>{switch(e){case"brush":return Sn;case"line":return wn;case"polygon":return Nt;case"curve":return Cn;case"rect":case"square":return It;case"circle":case"ellipse":return Wt;case"text":return bn;case"picture":return Ft;case"group":return'<svg><path d="M3.333 17.5V16.667H7.5V17.5ZM3.333 14.167V13.333H9.167V14.167ZM3.333 10.833V10H10.833V10.833ZM3.333 7.5V6.667H12.5V7.5ZM3.333 4.167V3.333H13.333V4.167ZM3.333 0.833V0H16.667V0.833Z"/></svg>';case"triangle":return""}},wi=({disabled:e=!1,shape:t,selected:n,layoutDragging:s,toggleShapeVisibility:a,toggleShapeLock:i,setLayoutDragging:c,handleRemove:o,handleSelect:r,onMoveShapes:l})=>{const u=y.useRef(null),{isOver:d}=(({disabled:p=!1,ref:f,shape:g,layoutDragging:v,setLayoutDragging:b,handleSelect:k,onMoveShapes:Q})=>{const[m,x]=y.useState(!1);return y.useEffect(()=>{v||x(!1)},[v]),y.useEffect(()=>{const w=f.current;if(!w)return;const Z=()=>{b(void 0)},A=z=>(z.preventDefault&&z.preventDefault(),!1),L=z=>{k([g]),z.dataTransfer&&(z.dataTransfer.effectAllowed="move",z.dataTransfer.setData("draggableShapeId",g.id),b(g.id))},C=()=>{v!==g.id&&x(!0)},V=()=>{x(!1)},D=z=>(z.stopPropagation(),z.dataTransfer&&Q(z.dataTransfer.getData("draggableShapeId"),g.id),!1);return p||(w.addEventListener("dragstart",L),w.addEventListener("dragend",Z),w.addEventListener("dragover",A),w.addEventListener("dragenter",C),w.addEventListener("dragleave",V),w.addEventListener("drop",D)),()=>{p||(w.removeEventListener("dragstart",L),w.removeEventListener("dragend",Z),w.removeEventListener("dragover",A),w.removeEventListener("dragenter",C),w.removeEventListener("dragleave",V),w.removeEventListener("drop",D))}},[p,f,g,b,k,Q,v]),{isOver:m}})({disabled:e,ref:u,shape:t,layoutDragging:s,setLayoutDragging:c,handleSelect:r,onMoveShapes:l});return h.jsxs("div",{className:"react-paint-editor-layout","data-disabled":+e,draggable:!e,"data-is-dragging":+(s===t.id),"data-is-over":+d,onClick:p=>{e||(p.preventDefault(),p.stopPropagation(),r([t]))},"data-selected":+n,ref:u,tabIndex:-1,children:[h.jsx("span",{dangerouslySetInnerHTML:{__html:bi(t.type)}}),h.jsx("span",{children:t.id}),h.jsx("div",{className:"react-paint-editor-layouts-separator"}),h.jsx(G,{className:"react-paint-editor-layouts-visible-button",title:t.visible?"Hide":"Show","data-visible":t.visible!==!1,disabled:e,selected:n,onClick:p=>{e||(p.preventDefault(),p.stopPropagation(),a([t]))},icon:t.visible===!1?'<svg><path d="M13.521 11.021 12.25 9.75Q12.333 8.75 11.604 7.979Q10.875 7.208 9.812 7.312L8.542 6.042Q8.896 5.896 9.26 5.833Q9.625 5.771 10 5.771Q11.583 5.771 12.688 6.875Q13.792 7.979 13.792 9.562Q13.792 9.979 13.719 10.354Q13.646 10.729 13.521 11.021ZM16.167 13.646 14.917 12.417Q15.667 11.833 16.25 11.146Q16.833 10.458 17.25 9.562Q16.229 7.479 14.292 6.281Q12.354 5.083 10 5.083Q9.396 5.083 8.885 5.156Q8.375 5.229 7.875 5.375L6.5 4Q7.354 3.646 8.208 3.49Q9.062 3.333 10 3.333Q13.146 3.333 15.615 5.052Q18.083 6.771 19.167 9.562Q18.688 10.792 17.917 11.823Q17.146 12.854 16.167 13.646ZM16.396 18.854 12.938 15.396Q12.208 15.625 11.479 15.729Q10.75 15.833 10 15.833Q6.833 15.833 4.375 14.094Q1.917 12.354 0.833 9.562Q1.25 8.479 1.917 7.552Q2.583 6.625 3.417 5.875L1.125 3.562L2.375 2.354L17.625 17.625ZM4.604 7.062Q4.021 7.604 3.542 8.219Q3.062 8.833 2.729 9.562Q3.75 11.646 5.688 12.865Q7.625 14.083 10 14.083Q10.354 14.083 10.74 14.052Q11.125 14.021 11.479 13.938L10.812 13.271Q10.625 13.312 10.417 13.333Q10.208 13.354 10 13.354Q8.417 13.354 7.312 12.25Q6.208 11.146 6.208 9.562Q6.208 9.354 6.24 9.167Q6.271 8.979 6.312 8.771ZM11.375 8.875Q11.375 8.875 11.375 8.875Q11.375 8.875 11.375 8.875Q11.375 8.875 11.375 8.875Q11.375 8.875 11.375 8.875Q11.375 8.875 11.375 8.875Q11.375 8.875 11.375 8.875ZM8.042 10.5Q8.042 10.5 8.042 10.5Q8.042 10.5 8.042 10.5Q8.042 10.5 8.042 10.5Q8.042 10.5 8.042 10.5Q8.042 10.5 8.042 10.5Q8.042 10.5 8.042 10.5Z"/></svg>':'<svg><path d="M10 13.354Q11.583 13.354 12.688 12.25Q13.792 11.146 13.792 9.562Q13.792 7.979 12.688 6.875Q11.583 5.771 10 5.771Q8.417 5.771 7.312 6.875Q6.208 7.979 6.208 9.562Q6.208 11.146 7.312 12.25Q8.417 13.354 10 13.354ZM10 11.812Q9.062 11.812 8.406 11.156Q7.75 10.5 7.75 9.562Q7.75 8.625 8.406 7.969Q9.062 7.312 10 7.312Q10.938 7.312 11.594 7.969Q12.25 8.625 12.25 9.562Q12.25 10.5 11.594 11.156Q10.938 11.812 10 11.812ZM10 15.833Q6.938 15.833 4.448 14.125Q1.958 12.417 0.833 9.562Q1.958 6.708 4.458 5.021Q6.958 3.333 10 3.333Q13.042 3.333 15.542 5.021Q18.042 6.708 19.167 9.562Q18.042 12.417 15.552 14.125Q13.062 15.833 10 15.833ZM10 9.562Q10 9.562 10 9.562Q10 9.562 10 9.562Q10 9.562 10 9.562Q10 9.562 10 9.562Q10 9.562 10 9.562Q10 9.562 10 9.562Q10 9.562 10 9.562Q10 9.562 10 9.562ZM10 14.083Q12.333 14.083 14.281 12.865Q16.229 11.646 17.25 9.562Q16.229 7.479 14.281 6.281Q12.333 5.083 10 5.083Q7.667 5.083 5.708 6.281Q3.75 7.479 2.729 9.562Q3.75 11.646 5.708 12.865Q7.667 14.083 10 14.083Z"/></svg>'}),h.jsx(G,{className:"react-paint-editor-layouts-locked-button",title:t.locked?"Locked":"Unlocked","data-locked":!!t.locked,disabled:e,selected:n,onClick:p=>{e||(p.preventDefault(),p.stopPropagation(),i([t]))},icon:t.locked?'<svg><path d="M10 0.833Q11.771 0.833 12.99 2.052Q14.208 3.271 14.208 5.042V6.667H14.917Q15.646 6.667 16.156 7.177Q16.667 7.688 16.667 8.417V16.562Q16.667 17.292 16.156 17.812Q15.646 18.333 14.917 18.333H5.083Q4.354 18.333 3.844 17.812Q3.333 17.292 3.333 16.562V8.417Q3.333 7.688 3.844 7.177Q4.354 6.667 5.083 6.667H5.792V5.042Q5.792 3.271 7.01 2.052Q8.229 0.833 10 0.833ZM10 2.583Q8.979 2.583 8.26 3.302Q7.542 4.021 7.542 5.042V6.667H12.458V5.042Q12.458 4.021 11.74 3.302Q11.021 2.583 10 2.583ZM5.083 16.583H14.917Q14.917 16.583 14.917 16.583Q14.917 16.583 14.917 16.583V8.417Q14.917 8.417 14.917 8.417Q14.917 8.417 14.917 8.417H5.083Q5.083 8.417 5.083 8.417Q5.083 8.417 5.083 8.417V16.583Q5.083 16.583 5.083 16.583Q5.083 16.583 5.083 16.583ZM10 10.812Q9.292 10.812 8.802 11.302Q8.312 11.792 8.312 12.5Q8.312 13.208 8.802 13.698Q9.292 14.188 10 14.188Q10.708 14.188 11.198 13.698Q11.688 13.208 11.688 12.5Q11.688 11.792 11.198 11.302Q10.708 10.812 10 10.812ZM5.083 8.417Q5.083 8.417 5.083 8.417Q5.083 8.417 5.083 8.417V16.583Q5.083 16.583 5.083 16.583Q5.083 16.583 5.083 16.583Q5.083 16.583 5.083 16.583Q5.083 16.583 5.083 16.583V8.417Q5.083 8.417 5.083 8.417Q5.083 8.417 5.083 8.417Z"/></svg>':'<svg><path d="M5.792 5.042Q5.792 3.271 7.01 2.052Q8.229 0.833 10 0.833Q11.771 0.833 12.99 2.052Q14.208 3.271 14.208 5.042V6.667H14.917Q15.646 6.667 16.156 7.177Q16.667 7.688 16.667 8.417V16.562Q16.667 17.292 16.156 17.812Q15.646 18.333 14.917 18.333H5.083Q4.354 18.333 3.844 17.812Q3.333 17.292 3.333 16.562V8.417Q3.333 7.688 3.844 7.177Q4.354 6.667 5.083 6.667H12.458V5.042Q12.458 4.021 11.74 3.302Q11.021 2.583 10 2.583Q8.979 2.583 8.26 3.302Q7.542 4.021 7.542 5.042ZM5.083 16.583H14.917Q14.917 16.583 14.917 16.583Q14.917 16.583 14.917 16.583V8.417Q14.917 8.417 14.917 8.417Q14.917 8.417 14.917 8.417H5.083Q5.083 8.417 5.083 8.417Q5.083 8.417 5.083 8.417V16.583Q5.083 16.583 5.083 16.583Q5.083 16.583 5.083 16.583ZM10 10.812Q9.292 10.812 8.802 11.302Q8.312 11.792 8.312 12.5Q8.312 13.208 8.802 13.698Q9.292 14.188 10 14.188Q10.708 14.188 11.198 13.698Q11.688 13.208 11.688 12.5Q11.688 11.792 11.198 11.302Q10.708 10.812 10 10.812ZM5.083 8.417Q5.083 8.417 5.083 8.417Q5.083 8.417 5.083 8.417V16.583Q5.083 16.583 5.083 16.583Q5.083 16.583 5.083 16.583Q5.083 16.583 5.083 16.583Q5.083 16.583 5.083 16.583V8.417Q5.083 8.417 5.083 8.417Q5.083 8.417 5.083 8.417Z"/></svg>'}),h.jsx(G,{className:"react-paint-editor-layouts-remove-button",title:"Remove",disabled:e,onClick:p=>{e||(p.preventDefault(),p.stopPropagation(),o([t]))},icon:xn})]})},Ci=({gridFormat:e,setGridFormat:t,settings:n,shapes:s,removeShape:a,toggleShapeVisibility:i,toggleShapeLock:c,selectedShapes:o,moveShapes:r,selectShapes:l,isLayoutPanelShown:u})=>{const[d,p]=y.useState(void 0),f=!n.features.edition;return u?h.jsx(Ge,{alignment:"right",className:"react-paint-editor-layouts-panel",children:h.jsx("div",{className:"react-paint-editor-layouts-panel-content",children:h.jsxs("div",{className:"react-paint-editor-layouts-scrolling-content",children:[h.jsxs("div",{className:"react-paint-editor-layouts-row",children:[h.jsx("span",{className:"react-paint-editor-layouts-subtitle",children:"Grid"}),h.jsx(G,{icon:'<svg><path d="M18.333 15.854 16.583 14.104V13.354H15.833L14.083 11.604H16.583V8.375H13.375V10.896L11.625 9.146V8.375H10.875L9.125 6.625H11.625V3.417H8.396V5.896L6.646 4.146V3.417H5.896L4.146 1.667H16.583Q17.312 1.667 17.823 2.177Q18.333 2.688 18.333 3.417ZM13.375 6.625H16.583V3.417Q16.583 3.417 16.583 3.417Q16.583 3.417 16.583 3.417H13.375ZM16.771 19.229 15.854 18.333H3.417Q2.688 18.333 2.177 17.823Q1.667 17.312 1.667 16.583V4.125L0.812 3.271L2.042 2.021L18 18ZM13.375 16.583H14.104L13.375 15.833ZM8.396 11.604H9.125L8.396 10.854ZM8.396 16.583H11.625V14.083L10.875 13.354H8.396ZM3.417 6.625H4.167L3.417 5.875ZM3.417 11.604H6.646V9.104L5.917 8.375H3.417ZM6.646 16.583V13.354H3.417V16.583Q3.417 16.583 3.417 16.583Q3.417 16.583 3.417 16.583Z"/></svg>',className:"react-paint-editor-layouts-grid-button",selected:e==="none",disabled:f,onClick:()=>t("none")}),["small","medium","large"].map(g=>h.jsx(G,{className:"react-paint-editor-layouts-grid-button",selected:e===g,disabled:f,onClick:()=>t(g),children:g.charAt(0).toUpperCase()},g))]}),h.jsx("hr",{}),h.jsx("div",{className:"react-paint-editor-layouts",children:s.length===0?h.jsx("div",{className:"react-paint-editor-layouts-placeholder",children:"No layer yet"}):s.map(g=>h.jsx(wi,{shape:g,disabled:f,layoutDragging:d,setLayoutDragging:p,selected:$(o).some(v=>v.id===g.id)??!1,handleSelect:l,handleRemove:a,onMoveShapes:r,toggleShapeVisibility:i,toggleShapeLock:c},g.id))})]})})}):null},Vt=({children:e,onClose:t,position:n="center",title:s,className:a=""})=>h.jsxs("div",{className:"react-paint-editor-modal","data-position":n,style:{"--react-paint-editor-modal-zindex":Hn},role:"dialog","aria-modal":"true","aria-labelledby":s,children:[h.jsx("div",{className:"react-paint-editor-modal-mask",onClick:t}),h.jsx("div",{className:`react-paint-editor-modal-panel ${a}`,children:e})]}),Zt=({selectedSettings:e,setSelectedSettings:t,title:n="Choisissez une couleur",mode:s="fill",disabled:a=!1,values:i,field:c,value:o="",valueChanged:r})=>{const[l]=y.useState(le("settings_")),u=e===l;return i.length?h.jsxs(h.Fragment,{children:[h.jsx(G,{selected:u,title:n,disabled:a,onClick:()=>{t(d=>d===l?void 0:l)},icon:o==="transparent"?s==="fill"?Ln:jn:void 0,children:o!=="transparent"&&h.jsx("div",{className:"react-paint-editor-colorfield-color","data-mode":s,style:{"--react-paint-editor-colorfield-color-value":o}})}),u&&h.jsx(Ge,{title:n,alignment:"left",children:h.jsxs("div",{className:"react-paint-editor-colorfield-wrapper",children:[i.map(d=>h.jsx(G,{title:d,selected:d===o,color:d,icon:d==="transparent"?s==="fill"?Ln:jn:void 0,onClick:()=>{r(c,d)},children:d!=="transparent"&&h.jsx("div",{className:"react-paint-editor-colorfield-color",color:d,"data-mode":s,style:{"--react-paint-editor-colorfield-color-value":d}})},d)),h.jsx(G,{type:"color",title:"Custom color",selected:o!==""&&!i.includes(o),value:o,onChange:d=>{const p=+d.target.value;r(c,Number.isNaN(p)?d.target.value:p)},children:h.jsx("div",{className:"react-paint-editor-colorfield-customcolor",style:{"--react-paint-editor-colorfield-color-value":i.includes(o)?"var(--react-paint-editor-app-font-color)":o},children:h.jsx("span",{dangerouslySetInnerHTML:{__html:'<svg><path d="M9.958 18.333Q8.25 18.333 6.74 17.677Q5.229 17.021 4.104 15.885Q2.979 14.75 2.323 13.229Q1.667 11.708 1.667 10Q1.667 8.271 2.333 6.75Q3 5.229 4.156 4.104Q5.312 2.979 6.854 2.323Q8.396 1.667 10.125 1.667Q11.771 1.667 13.26 2.25Q14.75 2.833 15.875 3.854Q17 4.875 17.667 6.26Q18.333 7.646 18.333 9.25Q18.333 11.688 16.792 12.948Q15.25 14.208 13.188 14.208H11.75Q11.625 14.208 11.562 14.281Q11.5 14.354 11.5 14.458Q11.5 14.688 11.812 15.219Q12.125 15.75 12.125 16.458Q12.125 17.458 11.51 17.896Q10.896 18.333 9.958 18.333ZM5.458 10.875Q6 10.875 6.375 10.5Q6.75 10.125 6.75 9.583Q6.75 9.042 6.375 8.667Q6 8.292 5.458 8.292Q4.917 8.292 4.542 8.667Q4.167 9.042 4.167 9.583Q4.167 10.125 4.542 10.5Q4.917 10.875 5.458 10.875ZM7.917 7.583Q8.458 7.583 8.833 7.208Q9.208 6.833 9.208 6.292Q9.208 5.75 8.833 5.375Q8.458 5 7.917 5Q7.375 5 7 5.375Q6.625 5.75 6.625 6.292Q6.625 6.833 7 7.208Q7.375 7.583 7.917 7.583ZM12.021 7.583Q12.562 7.583 12.938 7.208Q13.312 6.833 13.312 6.292Q13.312 5.75 12.938 5.375Q12.562 5 12.021 5Q11.479 5 11.104 5.375Q10.729 5.75 10.729 6.292Q10.729 6.833 11.104 7.208Q11.479 7.583 12.021 7.583ZM14.479 10.875Q15.021 10.875 15.396 10.5Q15.771 10.125 15.771 9.583Q15.771 9.042 15.396 8.667Q15.021 8.292 14.479 8.292Q13.938 8.292 13.562 8.667Q13.188 9.042 13.188 9.583Q13.188 10.125 13.562 10.5Q13.938 10.875 14.479 10.875Z"/></svg>'}})})})]})})]}):null},Mi=({disabled:e=!1,selectedShape:t,removeShape:n})=>h.jsx(G,{title:"Delete",disabled:e,"data-disabled":+e,onClick:()=>{n($(t))},icon:xn}),Ht=({CustomOption:e,selectedSettings:t,setSelectedSettings:n,title:s="Choisissez l'option",disabled:a=!1,field:i,icon:c,values:o,defaultValue:r,valueChanged:l})=>{const[u]=y.useState(le("settings_")),d=t===u;return o.length?h.jsxs(h.Fragment,{children:[h.jsx(G,{selected:d,title:s,icon:c,disabled:a,onClick:()=>{n(p=>p===u?void 0:u)}}),d&&h.jsx(Ge,{title:s,alignment:"left",fitContainer:!0,children:h.jsx("div",{className:"react-paint-editor-selectfield-wrapper",children:o.map(p=>h.jsx(G,{title:`${p}`,onClick:()=>(f=>{l(i,f)})(p),selected:r===p,style:{"--react-paint-editor-button-padding":"16px"},children:h.jsx(e,{children:p})},p))})})]}):null},ki=({children:e})=>h.jsx("span",{className:"react-paint-editor-fontfamily-option",style:{"--react-paint-editor-fontfamily-family":e},children:e}),Js=({selectedSettings:e,setSelectedSettings:t,disabled:n=!1,values:s,defaultValue:a,valueChanged:i})=>s.length?h.jsx(Ht,{selectedSettings:e,setSelectedSettings:t,CustomOption:ki,title:"Police",icon:'<svg><path d="M5.312 14.979H7.125L8.042 12.479H11.979L12.896 14.979H14.708L10.917 5H9.083ZM8.542 10.958 9.958 6.958H10.042L11.458 10.958ZM3.417 18.333Q2.688 18.333 2.177 17.823Q1.667 17.312 1.667 16.583V3.417Q1.667 2.688 2.177 2.177Q2.688 1.667 3.417 1.667H16.583Q17.312 1.667 17.823 2.177Q18.333 2.688 18.333 3.417V16.583Q18.333 17.312 17.823 17.823Q17.312 18.333 16.583 18.333ZM3.417 16.583H16.583Q16.583 16.583 16.583 16.583Q16.583 16.583 16.583 16.583V3.417Q16.583 3.417 16.583 3.417Q16.583 3.417 16.583 3.417H3.417Q3.417 3.417 3.417 3.417Q3.417 3.417 3.417 3.417V16.583Q3.417 16.583 3.417 16.583Q3.417 16.583 3.417 16.583ZM3.417 3.417Q3.417 3.417 3.417 3.417Q3.417 3.417 3.417 3.417V16.583Q3.417 16.583 3.417 16.583Q3.417 16.583 3.417 16.583Q3.417 16.583 3.417 16.583Q3.417 16.583 3.417 16.583V3.417Q3.417 3.417 3.417 3.417Q3.417 3.417 3.417 3.417Z"/></svg>',disabled:n,field:"fontFamily",values:s,defaultValue:a,valueChanged:i}):null,Pi=({disabled:e,toggleLayoutPanel:t})=>h.jsx(G,{title:"Toggle layers panel",disabled:e,onClick:t,icon:'<svg><path d="M10 17.646 2.438 11.75 3.875 10.646 10 15.396 16.125 10.646 17.562 11.75ZM10 13.188 2.5 7.354 10 1.521 17.5 7.354Z"/></svg>',className:"react-paint-editor-layout-button"}),ji=({children:e})=>h.jsxs("span",{className:"react-paint-editor-linearrow-option","data-type":e,children:[h.jsx("span",{className:"react-paint-editor-linearrow-left"}),h.jsx("span",{className:"react-paint-editor-linearrow-right"})]}),ea=({selectedSettings:e,setSelectedSettings:t,disabled:n=!1,values:s,defaultValue:a,valueChanged:i})=>s.length?h.jsx(Ht,{selectedSettings:e,setSelectedSettings:t,CustomOption:ji,title:"Flèches",icon:'<svg><path d="M6 17 2 13 6 9 7.062 10.062 4.875 12.25H17V13.75H4.875L7.062 15.938ZM14 11 12.938 9.938 15.125 7.75H3V6.25H15.125L12.938 4.062L14 3L18 7Z"/></svg>',disabled:n,field:"lineArrow",values:s,defaultValue:a,valueChanged:i}):null,Li=({children:e})=>h.jsxs("span",{className:"react-paint-editor-linetype-option","data-type":e,children:[h.jsx("span",{}),h.jsx("span",{}),h.jsx("span",{}),h.jsx("span",{}),h.jsx("span",{}),h.jsx("span",{}),h.jsx("span",{})]}),ta=({selectedSettings:e,setSelectedSettings:t,disabled:n=!1,values:s,defaultValue:a,valueChanged:i})=>s.length?h.jsx(Ht,{selectedSettings:e,setSelectedSettings:t,CustomOption:Li,icon:'<svg><path d="M3 16V14.5H4.5V16ZM6.125 16V14.5H7.625V16ZM9.25 16V14.5H10.75V16ZM12.375 16V14.5H13.875V16ZM15.5 16V14.5H17V16ZM3 13V11.5H6.5V13ZM8.25 13V11.5H11.75V13ZM13.5 13V11.5H17V13ZM3 10V8.5H9.25V10ZM10.75 10V8.5H17V10ZM3 7V4H17V7Z"/></svg>',title:"Type de traits",disabled:n,field:"lineDash",values:s,defaultValue:a,valueChanged:i}):null,zt=({selectedSettings:e,setSelectedSettings:t,title:n="Choisissez l'intervalle",icon:s,disabled:a=!1,field:i,value:c,min:o=1,max:r=20,step:l=1,unity:u="",valueChanged:d,saveShapes:p})=>{const f=c===void 0,g=f?"N/A":`${Math.round(c)}${u}`,[v]=y.useState(le("settings_")),b=((Q,m=500)=>{const x=y.useRef(null),w=y.useCallback((...Z)=>{x.current&&clearTimeout(x.current),x.current=setTimeout(()=>Q(...Z),m)},[Q,m]);return y.useEffect(()=>()=>{x.current&&clearTimeout(x.current)},[]),w})(p),k=e===v;return o===r?null:h.jsxs(h.Fragment,{children:[h.jsx(G,{selected:k,title:n,disabled:a,icon:s,onClick:()=>{t(Q=>Q===v?void 0:v)}}),k&&h.jsx(Ge,{title:n,alignment:"left",fitContainer:!0,children:h.jsx("div",{children:h.jsxs("label",{className:"react-paint-editor-rangefield",children:[h.jsx("input",{type:"range",min:o,max:r,step:l,value:c??(r+o)/2,"data-indeterminate":+f,onChange:Q=>{const m=+Q.target.value,x=Number.isNaN(m)?Q.target.value:m;d(i,x,!1),b()}}),h.jsx("span",{children:g})]})})})]})},Vi=({children:e})=>h.jsx("span",{children:e===0?"Non":"Oui"}),Zi=[0,1],na=({selectedSettings:e,setSelectedSettings:t,disabled:n=!1,defaultValue:s,valueChanged:a})=>h.jsx(Ht,{selectedSettings:e,setSelectedSettings:t,CustomOption:Vi,title:"Fermer les points",icon:Nt,disabled:n,field:"closedPoints",values:Zi,defaultValue:s,valueChanged:a}),Hi=({disabled:e=!1,className:t,toggleZoomPanel:n})=>h.jsx(G,{title:"Toggle zoom panel",disabled:e,onClick:n,icon:Vn,className:t?` ${t}`:""}),Tt=({setSelectedSettings:e,disabled:t=!1,field:n,icon:s,values:a,value:i=!1,valueChanged:c})=>{const[o]=y.useState(le("settings_"));return a.length!==2?null:h.jsx(G,{onClick:()=>{e(r=>r===o?void 0:o),c(n,!i)},selected:i,disabled:t,icon:s})},hn=({activeTool:e,selectedShape:t,selectedShapeTool:n,disabled:s,selectedSettings:a,setSelectedSettings:i,saveShapes:c,handleShapeStyleChange:o,handleShapeFontFamilyChange:r})=>t?n&&h.jsxs(h.Fragment,{children:["strokeColor"in n.settings&&!n.settings.strokeColor.hidden&&h.jsx(Zt,{selectedSettings:a,setSelectedSettings:i,title:"Couleur du trait",mode:"stroke",disabled:s,field:"strokeColor",value:t.style?.strokeColor,valueChanged:o,values:n.settings.strokeColor.values}),"fillColor"in n.settings&&!n.settings.fillColor.hidden&&h.jsx(Zt,{selectedSettings:a,setSelectedSettings:i,title:"Couleur de fond",disabled:s,field:"fillColor",value:t.style?.fillColor,valueChanged:o,values:n.settings.fillColor.values}),"lineWidth"in n.settings&&!n.settings.lineWidth.hidden&&h.jsx(zt,{saveShapes:c,selectedSettings:a,setSelectedSettings:i,title:"Epaisseur du trait",icon:Pn,disabled:s,field:"lineWidth",value:t.style?.lineWidth,valueChanged:o,unity:"px",min:n.settings.lineWidth.min,max:n.settings.lineWidth.max,step:n.settings.lineWidth.step}),"lineDash"in n.settings&&!n.settings.lineDash.hidden&&h.jsx(ta,{selectedSettings:a,setSelectedSettings:i,disabled:s,defaultValue:t.style?.lineDash,valueChanged:o,values:n.settings.lineDash.values}),"lineArrow"in n.settings&&!n.settings.lineArrow.hidden&&h.jsx(ea,{selectedSettings:a,setSelectedSettings:i,disabled:s,defaultValue:t.style?.lineArrow,valueChanged:o,values:n.settings.lineArrow.values}),"closedPoints"in n.settings&&!n.settings.closedPoints.hidden&&h.jsx(na,{selectedSettings:a,setSelectedSettings:i,disabled:s,valueChanged:o,defaultValue:t.style?.closedPoints}),"fontFamily"in n.settings&&!n.settings.fontFamily.hidden&&h.jsx(Js,{selectedSettings:a,setSelectedSettings:i,disabled:s,valueChanged:r,values:n.settings.fontFamily.values,defaultValue:t.style?.fontFamily}),"fontBold"in n.settings&&!n.settings.fontBold.hidden&&h.jsx(Tt,{setSelectedSettings:i,disabled:s,field:"fontBold",icon:Mn,valueChanged:r,values:n.settings.fontBold.values,value:t.style?.fontBold}),"fontItalic"in n.settings&&!n.settings.fontItalic.hidden&&h.jsx(Tt,{setSelectedSettings:i,disabled:s,field:"fontItalic",icon:kn,valueChanged:r,values:n.settings.fontItalic.values,value:t.style?.fontItalic}),"opacity"in n.settings&&!n.settings.opacity.hidden&&h.jsx(zt,{saveShapes:c,selectedSettings:a,setSelectedSettings:i,title:"Opacité",icon:Qn,min:n.settings.opacity.min,max:n.settings.opacity.max,step:n.settings.opacity.step,unity:"%",disabled:s,field:"opacity",value:t.style?.opacity,valueChanged:o})]}):"settings"in e?h.jsxs(h.Fragment,{children:["strokeColor"in e.settings&&!e.settings.strokeColor.hidden&&h.jsx(Zt,{selectedSettings:a,setSelectedSettings:i,title:"Couleur du trait",mode:"stroke",disabled:s,field:"strokeColor",value:e.settings.strokeColor.default,valueChanged:o,values:e.settings.strokeColor.values}),"fillColor"in e.settings&&!e.settings.fillColor.hidden&&h.jsx(Zt,{selectedSettings:a,setSelectedSettings:i,title:"Couleur de fond",disabled:s,field:"fillColor",value:e.settings.fillColor.default,valueChanged:o,values:e.settings.fillColor.values}),"lineWidth"in e.settings&&!e.settings.lineWidth.hidden&&h.jsx(zt,{saveShapes:c,selectedSettings:a,setSelectedSettings:i,title:"Epaisseur du trait",disabled:s,field:"lineWidth",icon:Pn,value:e.settings.lineWidth.default,valueChanged:o,unity:"px",min:e.settings.lineWidth.min,max:e.settings.lineWidth.max,step:e.settings.lineWidth.step}),"lineDash"in e.settings&&!e.settings.lineDash.hidden&&h.jsx(ta,{selectedSettings:a,setSelectedSettings:i,disabled:s,defaultValue:e.settings.lineDash.default,valueChanged:o,values:e.settings.lineDash.values}),"lineArrow"in e.settings&&!e.settings.lineArrow.hidden&&h.jsx(ea,{selectedSettings:a,setSelectedSettings:i,disabled:s,defaultValue:e.settings.lineArrow.default,valueChanged:o,values:e.settings.lineArrow.values}),"closedPoints"in e.settings&&!e.settings.closedPoints.hidden&&h.jsx(na,{selectedSettings:a,setSelectedSettings:i,disabled:s,valueChanged:o,defaultValue:e.settings?.closedPoints.default}),"fontFamily"in e.settings&&!e.settings.fontFamily.hidden&&h.jsx(Js,{selectedSettings:a,setSelectedSettings:i,disabled:s,valueChanged:r,values:e.settings.fontFamily.values,defaultValue:e.settings.fontFamily.default}),"fontBold"in e.settings&&!e.settings.fontBold.hidden&&h.jsx(Tt,{setSelectedSettings:i,disabled:s,field:"fontBold",icon:Mn,valueChanged:r,values:e.settings.fontBold.values,value:e.settings.fontBold.default}),"fontItalic"in e.settings&&!e.settings.fontItalic.hidden&&h.jsx(Tt,{setSelectedSettings:i,disabled:s,field:"fontItalic",icon:kn,valueChanged:r,values:e.settings.fontItalic.values,value:e.settings.fontItalic.default}),"opacity"in e.settings&&!e.settings.opacity.hidden&&h.jsx(zt,{saveShapes:c,selectedSettings:a,setSelectedSettings:i,title:"Opacité",icon:Qn,min:e.settings.opacity.min,max:e.settings.opacity.max,step:e.settings.opacity.step,unity:"%",disabled:s,field:"opacity",value:e.settings.opacity.default,valueChanged:o})]}):null,zi=({width:e,availableTools:t,updateToolSettings:n,layersManipulation:s=!1,toggleLayoutPanel:a,activeTool:i,saveShapes:c,selectedShape:o,canvas:r,settings:l,updateShape:u,removeShape:d,isZoomPanelShown:p,setIsZoomPanelShown:f})=>{const[g,v]=y.useState(void 0),[b,k]=y.useState(!1),Q=l.size==="infinite"||l.features.zoom,m=!l.features.edition,x=()=>{k(V=>!V)},w=((V,D)=>{const z=$(V).map(E=>D.find(I=>I.id===E?.toolId)||D.find(I=>I.type===E?.type)).filter(E=>E!==void 0);if(!z.length)return;if(z.length===1)return z[0];const B=z.slice(1).reduce((E,I)=>{const Y={};for(const U in I.settings){if(E[U]===void 0||I.settings[U]?.hidden||E[U]?.hidden)continue;const H=E[U],S=I.settings[U],M={};"min"in S&&"min"in H&&S.min===H.min&&"max"in S&&"max"in H&&S.max===H.max&&"step"in S&&"step"in H&&S.step===H.step&&(M.min=S.min,M.max=S.max,M.step=S.step),"values"in S&&"values"in H&&S.values?.join(",")===H.values?.join(",")&&(M.values=S.values),(Object.keys(M).length>0||U==="closedPoints")&&(Y[U]=M)}return Y},z[0].settings);return{id:z.map(E=>E.id).join("-"),icon:"",label:"group",type:"group",settings:B}})(o,t),Z=(w?Object.keys(w.settings).length+1:"settings"in i?Object.keys(i.settings).length:0)+ +s+ +Q,A=e<40*Z,L=(V,D,z=!0)=>{if($(o).length){const B=$(o).map(E=>Ae(Qe(["style",V],D,E),l));u(B,z),w&&n(w.id,V,D)}else n(i.id,V,D)},C=(V,D)=>{if($(o).length){const z=$(o).map(B=>{if(B.type!=="text")return B;const E=r?.getContext("2d");if(!E)return B;const I=Qe(["style",V],D,B),Y=jt(E,I.value,I.width,I.style?.fontBold??!1,I.style?.fontItalic??!1,I.style?.fontFamily);return Ae({...I,fontSize:Y,height:Y*I.value.length},l)});u(z,!0),w&&n(w.id,V,D)}else n(i.id,V,D)};return h.jsxs(h.Fragment,{children:[h.jsxs("div",{className:"react-paint-editor-settings-bar",children:[h.jsxs("div",{className:"react-paint-editor-settings-shrinkable",children:[Q&&h.jsx(Hi,{className:p?"react-paint-editor-bar-zoom-button-opened":void 0,toggleZoomPanel:()=>{f(V=>!V)}}),A&&Z>2&&h.jsx(G,{disabled:m,onClick:x,title:"Toggle settings",icon:'<svg><path d="M2.5 15.833V14.083H7.667V15.833ZM2.5 5.917V4.167H10.771V5.917ZM9.208 17.5V12.438H10.958V14.083H17.5V15.833H10.958V17.5ZM5.917 12.542V10.875H2.5V9.125H5.917V7.479H7.667V12.542ZM9.208 10.875V9.125H17.5V10.875ZM12.333 7.562V2.5H14.083V4.167H17.5V5.917H14.083V7.562Z"/></svg>'}),o?w&&h.jsxs(h.Fragment,{children:[!A&&h.jsx(hn,{saveShapes:c,activeTool:i,selectedShape:o,selectedShapeTool:w,disabled:m,selectedSettings:g,setSelectedSettings:v,handleShapeStyleChange:L,handleShapeFontFamilyChange:C}),i.type==="selection"&&h.jsx(Mi,{disabled:m,selectedShape:o,removeShape:d})]}):!A&&h.jsx(hn,{saveShapes:c,activeTool:i,selectedShape:o,selectedShapeTool:w,disabled:m,selectedSettings:g,setSelectedSettings:v,handleShapeStyleChange:L,handleShapeFontFamilyChange:C})]}),h.jsx("div",{className:"react-paint-editor-settings-separator"}),s&&h.jsx(Pi,{disabled:m,toggleLayoutPanel:a})]}),b&&h.jsx(Vt,{className:"react-paint-editor-settings-modal",onClose:x,position:"bottom",title:"Settings",children:h.jsx(hn,{saveShapes:c,activeTool:i,selectedShape:o,selectedShapeTool:w,disabled:m,selectedSettings:g,setSelectedSettings:v,handleShapeStyleChange:L,handleShapeFontFamilyChange:C})})]})},sa=({disabled:e=!1,withText:t=!1,loadFile:n,type:s,img:a,accept:i})=>{const c=y.useRef(null);return h.jsx(G,{ref:c,type:"file",onClick:o=>{o.stopPropagation(),c.current&&(c.current.value="")},onChange:o=>{const r=o.target.files?.item(0);r&&n(r)},accept:i,title:s.label??s.type,icon:a,disabled:e,children:t?s.label:void 0})},we=({type:e,img:t,isActive:n,withText:s=!1,disabled:a=!1,setActive:i})=>h.jsx(G,{disabled:a,selected:n,onClick:()=>{i(e)},title:e.label??e.type,icon:t,children:s?e.label:void 0}),Ti=({activeTool:e,withActionsInMenu:t,hasActionToUndo:n=!1,hasActionToRedo:s=!1,hasActionToClear:a=!1,undoAction:i,redoAction:c,clearCanvas:o,alignment:r,group:l,vertical:u=!1,disabled:d=!1,withLoadAndSave:p,withExport:f,addPicture:g,loadFile:v,togglePictureUrlModal:b,saveFile:k,toggleExportModal:Q,withUploadPicture:m,withUrlPicture:x})=>{const[w,Z]=y.useState(!1),[,A]=y.useTransition(),L=l?.tools?.some(V=>V===e.type),C=(L?e.icon:l.img)??l.title;return y.useEffect(()=>{if(!w)return;const V=()=>{Z(!1)};return document.addEventListener("click",V),()=>{document.removeEventListener("click",V)}},[w]),t||m||x||p||f?h.jsxs("div",{className:"react-paint-editor-toolbox-relative",children:[h.jsx(G,{selected:L,title:l.title,disabled:d,onClick:()=>{A(()=>{Z(!0)})},icon:C}),w&&h.jsx(Ge,{alignment:r,position:"top",children:h.jsxs("div",{className:"react-paint-editor-toolbox-panel-content","data-vertical":+u,children:[t&&h.jsxs(h.Fragment,{children:[h.jsx(we,{withText:!0,type:nt,disabled:d||!n,img:nt.icon,isActive:e.id===nt.id,setActive:i}),h.jsx(we,{withText:!0,type:st,disabled:d||!s,img:st.icon,isActive:e.id===st.id,setActive:c}),h.jsx(we,{withText:!0,type:at,disabled:d||!a,img:at.icon,isActive:e.id===at.id,setActive:o}),(m||x||p)&&h.jsx("hr",{})]}),m&&h.jsx(sa,{withText:!0,type:Bn,disabled:d,loadFile:async V=>{Z(!1),await g(V)},img:Bn.icon,accept:"image/png, image/gif, image/jpeg, image/svg+xml, image/webp"}),x&&h.jsx(G,{disabled:d,selected:!1,onClick:b,title:"Add picture from URL",icon:'<svg><path d="M9.188 16.542V14.938Q8.5 14.938 8.021 14.458Q7.542 13.979 7.542 13.292V12.458L3.583 8.5Q3.5 8.875 3.458 9.25Q3.417 9.625 3.417 10Q3.417 12.5 5.062 14.365Q6.708 16.229 9.188 16.542ZM14.854 14.438Q15.708 13.521 16.146 12.385Q16.583 11.25 16.583 10Q16.583 7.979 15.469 6.313Q14.354 4.646 12.479 3.917V4.229Q12.479 4.917 12 5.396Q11.521 5.875 10.833 5.875H9.188V7.521Q9.188 7.875 8.948 8.115Q8.708 8.354 8.354 8.354H6.708V10H11.646Q12 10 12.24 10.229Q12.479 10.458 12.479 10.812V13.292H13.292Q13.833 13.292 14.26 13.604Q14.688 13.917 14.854 14.438ZM10 18.333Q8.271 18.333 6.75 17.677Q5.229 17.021 4.104 15.896Q2.979 14.771 2.323 13.25Q1.667 11.729 1.667 10Q1.667 8.271 2.323 6.75Q2.979 5.229 4.104 4.104Q5.229 2.979 6.75 2.323Q8.271 1.667 10 1.667Q11.729 1.667 13.25 2.323Q14.771 2.979 15.896 4.104Q17.021 5.229 17.677 6.75Q18.333 8.271 18.333 10Q18.333 11.729 17.677 13.25Q17.021 14.771 15.896 15.896Q14.771 17.021 13.25 17.677Q11.729 18.333 10 18.333Z"/></svg>',children:"Add picture from URL"}),(m||x)&&p&&h.jsx("hr",{}),p&&h.jsxs(h.Fragment,{children:[h.jsx(sa,{withText:!0,type:On,disabled:d,loadFile:V=>{Z(!1),v(V)},img:On.icon,accept:"application/JSON"}),h.jsx(we,{withText:!0,disabled:d,type:Yt,img:Yt.icon,isActive:e.id===Yt.id,setActive:k})]}),f&&h.jsx(we,{withText:!0,disabled:d,type:Bt,img:Bt.icon,isActive:e.id===Bt.id,setActive:Q})]})})]}):null},Ai=({togglePictureUrlModal:e,addPicture:t})=>{const n=y.useRef(null);return y.useEffect(()=>{n.current&&n.current.focus()},[]),h.jsx(Vt,{className:"react-paint-editor-toolbox-pictureinput-modal",onClose:e,title:"Add picture from URL",children:h.jsxs("form",{onSubmit:async s=>{s.preventDefault();const a=n.current?.value;a&&(await t(a),e())},children:[h.jsxs("label",{children:["URL ",h.jsx("input",{type:"text",ref:n})]}),h.jsx(G,{onClick:e,children:"Annuler"}),h.jsx(G,{type:"submit",selected:!0,children:"Ajouter"})]})})},aa="Choose export settings",Ei=({toggleExportModal:e,exportCanvasInFile:t})=>{const n=async s=>{t(s),e()};return h.jsxs(Vt,{className:"react-paint-editor-toolbox-export-modal",onClose:e,title:aa,children:[h.jsx("h3",{children:aa}),h.jsx("hr",{}),h.jsx(G,{onClick:()=>n("currentZoom"),children:"Exporter la vue actuelle"}),h.jsx(G,{onClick:()=>n("defaultView"),children:"Exporter le canevas par défaut"}),h.jsx(G,{onClick:()=>n("fitToShapes"),children:"Exporter le dessin entier"}),h.jsx(G,{selected:!0,onClick:e,children:"Annuler"})]})},Ri=({activeTool:e,alignment:t,group:n,disabled:s=!1,setActiveToolFromId:a})=>{const i=y.useRef(null),[c,o]=y.useState(!1),[,r]=y.useTransition(),[l,u]=y.useState(void 0),d=g=>{u(g),a(g.id)};if(y.useEffect(()=>{if(!c)return;const g=v=>{!((k,Q)=>!!(k.target instanceof Node&&Q)&&Q.contains(k.target))(v,i.current)&&o(!1)};return document.addEventListener("mousedown",g,{passive:!1}),document.addEventListener("touchstart",g,{passive:!1}),()=>{document.removeEventListener("mousedown",g),document.removeEventListener("touchstart",g)}},[c]),"type"in n)return h.jsx(we,{disabled:s,type:n,img:n.icon,isActive:e.id===n.id,setActive:d});if(!n.toolsType.length)return null;if(n.toolsType?.length===1)return h.jsx(we,{disabled:s,type:n.toolsType[0],img:n.toolsType[0].icon,isActive:e.id===n.toolsType[0].id,setActive:d});const p=n?.toolsType.find(g=>g.type===e.type)!==void 0,f=(l?l.icon:n.toolsType?.[0]?.icon)??n.title;return h.jsxs("div",{className:"react-paint-editor-toolbargroup-relative",children:[h.jsx(G,{selected:p,title:n.title,disabled:s,onClick:()=>{l?a(l.id):n.toolsType?.[0]&&d(n.toolsType[0]),r(()=>{o(!0)})},icon:f}),c&&h.jsx(Ge,{alignment:t,position:"top",children:h.jsx("div",{className:"react-paint-editor-toolbargroup-panel-content","data-vertical":+n.vertical,ref:i,children:n.toolsType.map(g=>h.jsx(we,{disabled:s,type:g,img:g.icon,isActive:e.id===g.id,setActive:d},g.id))})})]})},Di=[{title:"brush",toolsType:["brush"],vertical:!1},{title:"lines",toolsType:["line","curve","polygon"],vertical:!1},{title:"shapes",toolsType:["rect","square","circle","ellipse"],vertical:!1},"text"],Ii=({settings:e,width:t,activeTool:n,hasActionToUndo:s=!1,hasActionToRedo:a=!1,hasActionToClear:i=!1,withLoadAndSave:c,withExport:o,clearCanvas:r,setActiveTool:l,undoAction:u,redoAction:d,addPicture:p,loadFile:f,saveFile:g,exportCanvasInFile:v,availableTools:b,withUrlPicture:k,withUploadPicture:Q})=>{const m=((H,S)=>{const M=S.flatMap(P=>{if(typeof P!="object")return H.filter(j=>j.type===P);const T=H.filter(j=>P.toolsType.includes(j.type));return T?{...P,toolsType:T}:null});return cn(M)})(b,Di),x=!e.features.edition,w=t<40*(6+m.length),Z=t<40*(3+m.length),[A,L]=y.useState(!1),[C,V]=y.useState(!1),[D,z]=y.useState(!1),B=()=>{L(H=>!H)},E=()=>{z(H=>!H)},I=H=>{l(H),L(!1)},Y=H=>{I(b.find(S=>S.id===H)??n)},U=b.find(H=>H.type===n.type)!==void 0;return h.jsxs(h.Fragment,{children:[h.jsxs("div",{className:"react-paint-editor-toolbar-toolbox",style:{"--react-paint-editor-toolbar-minwidth":"160px"},children:[h.jsxs("div",{className:"react-paint-editor-toolbar-shrinkable",children:[h.jsx(we,{type:De,disabled:x,img:De.icon,isActive:n.id===De.id,setActive:I}),(e.size==="infinite"||e.features.zoom)&&h.jsx(we,{type:Xt,disabled:x,img:Xt.icon,isActive:n.id===Xt.id,setActive:I}),Z?h.jsx(G,{disabled:x,onClick:B,title:"Toggle tools",icon:'<svg><path d="M5.333 9.292 10.021 1.646 14.708 9.292ZM14.562 18.333Q13 18.333 11.896 17.229Q10.792 16.125 10.792 14.562Q10.792 13 11.896 11.896Q13 10.792 14.562 10.792Q16.125 10.792 17.229 11.896Q18.333 13 18.333 14.562Q18.333 16.125 17.229 17.229Q16.125 18.333 14.562 18.333ZM2.5 17.917V11.188H9.229V17.917ZM14.562 16.583Q15.438 16.583 16.01 16.01Q16.583 15.438 16.583 14.562Q16.583 13.688 16.01 13.115Q15.438 12.542 14.562 12.542Q13.688 12.542 13.115 13.115Q12.542 13.688 12.542 14.562Q12.542 15.438 13.115 16.01Q13.688 16.583 14.562 16.583ZM4.25 16.167H7.479V12.938H4.25ZM8.458 7.542H11.583L10.021 5ZM10.021 7.542ZM7.479 12.938ZM14.562 14.562Q14.562 14.562 14.562 14.562Q14.562 14.562 14.562 14.562Q14.562 14.562 14.562 14.562Q14.562 14.562 14.562 14.562Q14.562 14.562 14.562 14.562Q14.562 14.562 14.562 14.562Q14.562 14.562 14.562 14.562Q14.562 14.562 14.562 14.562Z"/></svg>',selected:U}):m.map(H=>h.jsx(Ri,{disabled:x,activeTool:n,group:H,setActiveToolFromId:Y},"id"in H?H.id:H.title))]}),!w&&h.jsxs(h.Fragment,{children:[h.jsx(we,{type:nt,disabled:x||!s,img:nt.icon,isActive:n.id===nt.id,setActive:u}),h.jsx(we,{type:st,disabled:x||!a,img:st.icon,isActive:n.id===st.id,setActive:d}),h.jsx(we,{type:at,disabled:x||!i,img:at.icon,isActive:n.id===at.id,setActive:r})]}),h.jsx(Ti,{withActionsInMenu:w,disabled:x,vertical:!0,alignment:"right",group:{title:"Menu",img:'<svg><path d="M2.5 15V13.25H17.5V15ZM2.5 10.875V9.125H17.5V10.875ZM2.5 6.75V5H17.5V6.75Z"/></svg>'},activeTool:n,addPicture:p,loadFile:f,saveFile:g,togglePictureUrlModal:()=>{V(!0)},toggleExportModal:E,withUploadPicture:Q,withUrlPicture:k,withLoadAndSave:c,withExport:o,hasActionToUndo:s,hasActionToRedo:a,hasActionToClear:i,undoAction:u,redoAction:d,clearCanvas:r})]}),A&&h.jsx(Vt,{className:"react-paint-editor-toolbar-modal",onClose:B,title:"Outils",children:b.map(H=>H.type==="picture"?null:h.jsx(we,{disabled:x,type:H,img:H.icon,withText:!1,isActive:n.id===H.id,setActive:I},H.id))}),C&&h.jsx(Ai,{togglePictureUrlModal:()=>{V(H=>!H)},addPicture:p}),D&&h.jsx(Ei,{toggleExportModal:E,exportCanvasInFile:v})]})},At={none:0,small:10,medium:20,large:40},Wi={toolbarBackgroundColor:"white",dividerColor:"#36418129",fontRadius:8,fontDisabledColor:"#3641812b",fontDisabledBackgroundColor:"transparent",fontColor:"#364181",fontBackgroundColor:"transparent",fontSelectedColor:"white",fontSelectedBackgroundColor:"#364181",fontHoverColor:"#364181",fontHoverBackgroundColor:"#afd8d8"},Ni=()=>{const e=y.useRef([]),[t,n]=y.useState([]);return y.useEffect(()=>()=>{for(const s of e.current)clearTimeout(s)},[]),{snackbarList:t,addSnackbar:({type:s=mi,duration:a=yi,text:i})=>{const c={id:le("snackbar_"),duration:a,type:s,text:i};n(o=>[...o,c]),e.current=[...e.current,setTimeout(()=>{return o=c.id,void n(r=>r.filter(l=>l.id!==o));var o},a)]}}};Re.Canvas=({options:e,className:t,style:n,canvasProps:s})=>{const{shapesRef:a,selectedShape:i,selectionFrame:c,hoveredShape:o,addShape:r,setSelectedShape:l,setSelectionFrame:u,refreshSelectedShapes:d,refreshHoveredShape:p,duplicateShapes:f,removeShape:g,updateShape:v,backwardShape:b,forwardShape:k,saveShapes:Q,refs:m,width:x,height:w,settings:Z,setCanvasSize:A,setCanvasOffset:L,selectShapes:C,activeTool:V,setActiveTool:D,isInsideComponent:z,isInsideCanvas:B,isEditMode:E,canvas:{withSkeleton:I,withFrameSelection:Y,canGrow:U,canShrink:H},canvasOffsetStartData:S,setCanvasOffsetStartData:M,selectionMode:P,setSelectionMode:T,setCanvasMoveAcceleration:j,isShiftPressed:O,isAltPressed:W,isSpacePressed:F,setShiftPressed:R,setAltPressed:ee,setCanvasZoom:re,resetZoom:se,setIsSpacePressed:q}=s,{canvasBackgroundColor:N,canvasSelectionColor:ae,canvasSelectionWidth:te}={...va,...e},ve=y.useRef(null),Ce=y.useCallback(_=>{r(_),C(_)},[r,C]),de=y.useCallback(_=>{A({realWidth:x,realHeight:w,width:_,height:w*_/x,scaleRatio:_/x})},[x,w,A]);return fi({isInsideComponent:z,isInsideCanvas:B,isEditingText:P.mode==="textedition",settings:Z,selectedShape:i,setSelectedShape:l,removeShape:g,pasteShapes:Ce,updateShapes:v,backwardShape:b,forwardShape:k,setShiftPressed:R,setAltPressed:ee,setActiveTool:D,setSelectionMode:T,setSelectionFrame:u,setCanvasZoom:re,resetZoom:se,setIsSpacePressed:q}),(({onResized:_,element:ue})=>{y.useEffect(()=>{const X=ue.current;if(!X)return;const me=new ResizeObserver(Ee=>{const Ve=Ee?.[0]?.borderBoxSize?.[0],{width:J,height:he}=Ve?{width:Ve.inlineSize,height:Ve.blockSize}:Ee?.[0]?.contentRect??{};J!==void 0&&he!==void 0&&_(J,he)});return me.observe(X),()=>{me.unobserve(X)}},[ue,_])})({element:ve,onResized:de}),h.jsx("div",{ref:ve,className:"react-paint-app-row"+(t?` ${t}`:""),"data-grow":U,"data-shrink":H,style:{"--react-paint-app-row-width":Z.canvasSize.width,"--react-paint-app-canvaswidth":x,"--react-paint-app-canvasheight":w,"--react-paint-app-row-aspectratio":`calc(${Z.canvasSize.width} / ${Z.canvasSize.height})`,"--react-paint-app-canvas-bg":N,...n},children:h.jsx(ai,{duplicateShapes:f,isSpacePressed:F,ref:m.canvas,canGrow:U,isInsideComponent:z,activeTool:V,setActiveTool:D,canvasOffsetStartData:S,setCanvasOffsetStartData:M,shapes:a.current,addShapes:r,updateSingleShape:v,selectedShape:i,selectionFrame:c,setSelectedShape:l,setSelectionFrame:u,hoveredShape:o,refreshHoveredShape:p,refreshSelectedShapes:d,settings:Z,setCanvasOffset:L,saveShapes:Q,selectionMode:P,setSelectionMode:T,setCanvasMoveAcceleration:j,selectionColor:ae,selectionWidth:te,isEditMode:E,isShiftPressed:O,isAltPressed:W,withFrameSelection:Y,withSkeleton:I})})},Re.Editor=({editorProps:e,className:t,style:n,options:s,children:a})=>{const{shapesRef:i,addPictureShape:c,moveShapes:o,toggleShapeVisibility:r,toggleShapeLock:l,canGoBackward:u,canGoForward:d,canClear:p,selectedShape:f,removeShape:g,updateShape:v,backwardShape:b,forwardShape:k,refs:Q,width:m,height:x,selectTool:w,selectShapes:Z,activeTool:A,setActiveTool:L,setAvailableTools:C,isEditMode:V,availableTools:D,gridGap:z,setGridGap:B,loadFile:E,exportPicture:I,exportData:Y,clearCanvas:U,settings:H,setCanvasZoom:S,saveShapes:M,canvas:{canGrow:P,layersManipulation:T,withExport:j,withLoadAndSave:O,withUploadPicture:W,withUrlPicture:F}}=e,{toolbarBackgroundColor:R,dividerColor:ee,fontRadius:re,fontDisabledColor:se,fontDisabledBackgroundColor:q,fontColor:N,fontBackgroundColor:ae,fontSelectedColor:te,fontSelectedBackgroundColor:ve,fontHoverColor:Ce,fontHoverBackgroundColor:de}={...Wi,...s},_=H.size==="infinite"||H.features.zoom,[ue,X]=y.useState(!1),[me,Ee]=y.useState(!1),[Ve,J]=y.useState(_),he=_&&Ve,Ie=z>=At.large?"large":z>=At.medium?"medium":z>=At.small?"small":"none",{snackbarList:We,addSnackbar:Me}=Ni(),_e=y.useCallback((pe,ge,mt)=>{C(Fe=>Fe.map(ut=>ut.id===pe?Qe(["settings",ge,"default"],mt,ut):ut)),L(Fe=>Fe.id===pe?Qe(["settings",ge,"default"],mt,Fe):Fe)},[L,C]),pn=y.useCallback(pe=>{X(!0);try{I(pe)}catch(ge){ge instanceof Error&&Me({type:"error",text:`L'export a échoué : ${ge.message}`}),console.warn(ge)}finally{X(!1)}},[I,Me]),Ke=y.useCallback(()=>{X(!0);try{Y(),X(!1)}catch(pe){pe instanceof Error&&Me({type:"error",text:"L'enregistrement a échoué"}),console.warn(pe)}finally{X(!1)}},[Y,Me]),gn=y.useCallback(async pe=>{X(!0);try{await E(pe),Me({type:"success",text:"Fichier chargé !"})}catch(ge){ge instanceof Error&&Me({type:"error",text:"Le chargement a échoué"}),console.warn(ge)}finally{X(!1)}},[E,Me]),fn=y.useCallback(async pe=>{X(!0);try{const ge=await c(pe,m,x);Z([ge])}catch(ge){ge instanceof Error&&Me({type:"error",text:"Le chargement a échoué"}),console.warn(ge)}finally{X(!1)}},[c,Z,Me,m,x]),vn=`${t?`${t} `:""}${me?"react-paint-editor-layout-opened ":""}react-paint-editor-app`;return h.jsxs("div",{ref:Q.setEditor,className:vn,style:{"--react-paint-editor-app-maxWidth":P?"100%":`${m}px`,"--react-paint-editor-app-toolbar-bg":R,"--react-paint-editor-app-divider-color":ee,"--react-paint-editor-app-font-radius":re,"--react-paint-editor-app-font-disabled-color":se,"--react-paint-editor-app-font-disabled-bg":q,"--react-paint-editor-app-font-color":N,"--react-paint-editor-app-font-bg":ae,"--react-paint-editor-app-font-selected-color":te,"--react-paint-editor-app-font-selected-bg":ve,"--react-paint-editor-app-font-hover-color":Ce,"--react-paint-editor-app-font-hover-bg":de,...n},children:[V&&h.jsx(Ii,{settings:H,width:H.canvasSize.width,activeTool:A,clearCanvas:U,setActiveTool:w,exportCanvasInFile:pn,saveFile:Ke,loadFile:gn,addPicture:fn,hasActionToUndo:u,hasActionToRedo:d,hasActionToClear:p,undoAction:b,redoAction:k,availableTools:D,withExport:j,withLoadAndSave:O,withUploadPicture:W,withUrlPicture:F}),a,V&&T&&h.jsx(Ci,{gridFormat:Ie,setGridFormat:pe=>{B(At[pe])},shapes:i.current,moveShapes:o,selectedShapes:f,removeShape:g,selectShapes:Z,toggleShapeVisibility:r,toggleShapeLock:l,isLayoutPanelShown:me,settings:H}),he&&h.jsxs(Ge,{alignment:"left",className:"react-paint-editor-layouts-panel","data-edit":+V,children:[h.jsx(G,{className:"react-paint-editor-zoom-button",icon:'<svg viewBox="0 -960 960 960" width="24px"><path d="M784-120 532-372q-30 24-69 38t-83 14q-109 0-184.5-75.5T120-580q0-109 75.5-184.5T380-840q109 0 184.5 75.5T640-580q0 44-14 83t-38 69l252 252-56 56ZM380-400q75 0 127.5-52.5T560-580q0-75-52.5-127.5T380-760q-75 0-127.5 52.5T200-580q0 75 52.5 127.5T380-400ZM280-540v-80h200v80H280Z"/></svg>',onClick:()=>S("unzoom")}),h.jsxs(G,{className:"react-paint-editor-zoom-button react-paint-editor-zoom-button-value",onClick:()=>S("default"),children:[Math.round(100*H.canvasZoom),"%"]}),h.jsx(G,{className:"react-paint-editor-zoom-button",icon:Vn,onClick:()=>S("zoom")})]}),V&&h.jsxs(h.Fragment,{children:[h.jsx(zi,{saveShapes:M,setCanvasZoom:S,width:H.canvasSize.width,activeTool:A,availableTools:D,selectedShape:f,settings:H,removeShape:g,updateShape:v,canvas:Q.canvas.current,layersManipulation:T,toggleLayoutPanel:()=>{Ee(pe=>!pe)},isZoomPanelShown:he,setIsZoomPanelShown:J,updateToolSettings:_e}),h.jsx(vi,{isLoading:ue}),h.jsx(xi,{snackbarList:We})]})]})},Re.useReactPaint=({width:e=1e3,height:t=600,shapes:n,mode:s="editor",disabled:a=!1,options:i=_n}={})=>{const{layersManipulation:c,brushAlgo:o,isBrushShapeDoneOnMouseUp:r,debug:l,grid:u,canGrow:d,canShrink:p,withExport:f,withLoadAndSave:g,withUploadPicture:v,withUrlPicture:b,withSkeleton:k,withFrameSelection:Q,clearCallback:m,availableTools:x,canvasSelectionPadding:w,size:Z,canZoom:A}={..._n,...i},L=s!=="viewer",C=y.useRef(null),V=y.useRef(null),D=y.useRef(!1),z=y.useCallback(K=>{C.current=K},[]),[B,E]=y.useState(void 0),[I,Y]=y.useState(De),[U,H]=y.useState({mode:"default"}),[S,M]=y.useState(u),[P,T]=y.useState({realWidth:e,realHeight:t,width:e,height:t,scaleRatio:1}),j=A==="always"&&!a,{canvasTransformation:O,setCanvasTransformation:W,setCanvasOffset:F,setCanvasZoom:R,resetZoom:ee}=ei({canvasSize:P,size:Z,canvasElt:V.current,zoomEnabled:j}),{offset:re,zoom:se}=O,q=y.useMemo(()=>({brushAlgo:o,isBrushShapeDoneOnMouseUp:r,debug:l,canvasSize:{realWidth:P.realWidth,realHeight:P.realHeight,width:P.width,height:P.height,scaleRatioWithNoZoom:P.scaleRatio,scaleRatio:P.scaleRatio*se},size:Z,canvasOffset:re,canvasZoom:se,gridGap:S,selectionPadding:w,features:{edition:L&&!a,zoom:j}}),[w,S,o,r,l,se,re,P,Z,a,j,L]),[N,ae]=y.useState(Fs(x,v||b)),{isInsideComponent:te,isInsideCanvas:ve}=(({settings:K,componentRef:ie,canvasRef:ke})=>{const[Oe,Be]=y.useState(!1),[et,tt]=y.useState(!1),ye=!K.features.edition&&!K.features.zoom;return y.useEffect(()=>{if(!ye){const Pe=()=>Be(!0),Rt=()=>Be(!1),Ye=()=>tt(!0),Dt=()=>tt(!1);return ie.current?.addEventListener("focusin",Pe),ie.current?.addEventListener("focusout",Rt),ke.current?.addEventListener("focusin",Ye),ke.current?.addEventListener("focusout",Dt),()=>{ie.current?.removeEventListener("focusin",Pe),ie.current?.removeEventListener("focusout",Rt),ke.current?.removeEventListener("focusin",Ye),ke.current?.removeEventListener("focusout",Dt)}}Be(!1),tt(!1)},[ye,ie,ke]),{isInsideComponent:Oe,isInsideCanvas:et}})({settings:q,componentRef:C,canvasRef:V}),[Ce,de]=y.useState(!1),[_,ue]=y.useState(!1),[X,me]=y.useState(!1),{registerEvent:Ee,unregisterEvent:Ve,shapesRef:J,selectedShape:he,selectionFrame:Ie,hoveredShape:We,addShapes:Me,addPictureShape:_e,moveShapes:pn,setSelectedShape:Ke,setSelectionFrame:gn,refreshSelectedShapes:fn,refreshHoveredShape:vn,duplicateShapes:pe,removeShape:ge,updateShape:mt,backwardShape:Fe,forwardShape:ut,clearShapes:ia,saveShapes:oa,toggleShapeVisibility:Fi,toggleShapeLock:Oi,canGoBackward:Bi,canGoForward:Yi,canClear:Xi}=Ka(q,e,t,Ce),mn=y.useCallback(K=>{Ke(void 0),Y(K)},[Ke]),[ht,ra]=y.useState([0,0]),la=U.mode==="preview";y.useEffect(()=>{if(la)return()=>H(K=>K.mode==="preview"?{mode:"default"}:K)},[he?.id,la]);const ca=U.mode==="selectionFrame";y.useEffect(()=>{if(ca)return()=>ra([0,0])},[ca]),y.useEffect(()=>{if(ht[0]!==0||ht[1]!==0){const K=setInterval(()=>{W(({offset:ie,zoom:ke})=>{const Oe=[ie[0]-ht[0],ie[1]-ht[1]];return an({zoom:ke,size:Z,canvasSize:P,newOffset:Oe})})},20);return()=>clearInterval(K)}},[ht[0],ht[1],W,Z,P]);const Et=y.useCallback((K,ie)=>{ia(K,ie),mn(De),W({offset:[0,0],zoom:1})},[mn,ia,W]),da=y.useCallback(K=>{Ke(ie=>(ie?.id!==K.map(ke=>ke.id).join("-")&&Y(De),ce(K,q)))},[Ke,q]),$i=y.useCallback(()=>{const K=Ga(J.current,e,t);if(!K)throw new Error("L'encodage a échoué");Rs(K,"drawing.json")},[J,e,t]),Ui=y.useCallback(K=>{const ie=Ds({shapes:J.current,settings:q,view:K});Rs(ie,"drawing.png")},[J,q]),qi=y.useCallback(K=>Ds({shapes:J.current,settings:q,view:K}),[J,q]),Gi=y.useCallback(()=>un(J.current,e,t),[J,e,t]),Je=y.useCallback(async(K,ie)=>{const ke=await(async(Oe,Be)=>{if(!Oe)return[];const et=[],tt=cn(Oe.map(ye=>{if(!ye||!Un.includes(ye.type))return null;if(ye.type==="picture"){const Pe=new Image,Rt=new Promise((Ye,Dt)=>{Pe.onload=()=>{URL.revokeObjectURL(Pe.src),Ye()},Pe.onerror=()=>{Dt(new Error("Some images could not be loaded"))}});if(et.push(Rt),ye.src.startsWith("http"))Es(ye.src).then(Ye=>{Pe.src=Ye}).catch(()=>{Pe.src=""});else if(ye.src.includes("<svg")){const Ye=new Blob([ye.src],{type:"image/svg+xml"});Pe.src=URL.createObjectURL(Ye)}else Pe.src=ye.src;return Is({...ye,img:Pe},Be)}return Is(ye,Be)}));return await Promise.all(et),tt})(K,q);Et(ke,ie)},[Et,q]),yn=y.useRef(Je);yn.current=Je;const _i=y.useCallback((K=[],ie=!0)=>{yn.current?.(K,{clearHistory:ie,source:"remote"})},[]);y.useEffect(()=>{D.current||(D.current=!0,n&&yn.current?.(n,{clearHistory:!0,source:"remote"}))},[n]);const Ki=y.useCallback(async K=>{const ie=await(async ke=>new Promise((Oe,Be)=>{const et=new FileReader;et.onload=tt=>{const ye=tt.target?.result;if(!ye)return Be("Impossible de récupérer les données du fichier");const Pe=JSON.parse(ye);Oe(Pe)},et.readAsText(ke)}))(K);await Je(ie.shapes??[],{clearHistory:!0,source:"remote"})},[Je]),Ji=y.useCallback(()=>{typeof m!="string"?Je(m(),{clearHistory:!1,source:"user"}):m==="defaultShapes"&&n!==void 0?Je(n,{clearHistory:!1,source:"user"}):Et([],{clearHistory:!1,source:"user"})},[Et,Je,n,m]);y.useEffect(()=>{ae(Fs(x,v||b))},[x,v,b]);const ua={canvas:V,editor:C,setEditor:z};return{annotationsProps:{style:{userSelect:"none",touchAction:"none",transformOrigin:"left top",transform:"scale(var(--react-paint-canvas-zoom)) translate(calc(var(--react-paint-canvas-offset-x) * 100% / var(--react-paint-app-canvaswidth)), calc(var(--react-paint-canvas-offset-y) * 100% / var(--react-paint-app-canvasheight)))","--react-paint-canvas-zoom":q.canvasZoom,"--react-paint-canvas-offset-x":q.canvasOffset[0],"--react-paint-canvas-offset-y":q.canvasOffset[1],"--react-paint-app-canvaswidth":e,"--react-paint-app-canvasheight":t}},editorProps:{shapesRef:J,addPictureShape:_e,moveShapes:pn,toggleShapeVisibility:Fi,toggleShapeLock:Oi,canGoBackward:Bi,canGoForward:Yi,canClear:Xi,selectedShape:he,saveShapes:oa,removeShape:ge,updateShape:mt,backwardShape:Fe,forwardShape:ut,refs:ua,width:e,height:t,selectTool:mn,selectShapes:da,activeTool:I,setActiveTool:Y,setAvailableTools:ae,isEditMode:L,availableTools:N,gridGap:S,setGridGap:M,loadFile:Ki,exportPicture:Ui,exportData:$i,clearCanvas:Ji,settings:q,setCanvasZoom:R,resetZoom:ee,canvas:{canGrow:d,canShrink:p,layersManipulation:c,withExport:f,withLoadAndSave:g,withUploadPicture:v,withUrlPicture:b}},canvasProps:{shapesRef:J,selectedShape:he,selectionFrame:Ie,hoveredShape:We,addShape:Me,setSelectedShape:Ke,setSelectionFrame:gn,refreshSelectedShapes:fn,refreshHoveredShape:vn,removeShape:ge,updateShape:mt,duplicateShapes:pe,backwardShape:Fe,forwardShape:ut,saveShapes:oa,refs:ua,width:e,height:t,settings:q,setCanvasSize:T,setCanvasOffset:F,setCanvasZoom:R,resetZoom:ee,selectShapes:da,activeTool:I,setActiveTool:Y,isInsideComponent:te,isInsideCanvas:ve,isEditMode:L,canvas:{withSkeleton:k,withFrameSelection:Q,canGrow:d,canShrink:p},canvasOffsetStartData:B,setCanvasOffsetStartData:E,selectionMode:U,setSelectionMode:H,setCanvasMoveAcceleration:ra,isShiftPressed:Ce,isAltPressed:_,isSpacePressed:X,setShiftPressed:de,setAltPressed:ue,setIsSpacePressed:me},registerEvent:Ee,unregisterEvent:Ve,resetCanvas:_i,resetZoom:ee,getCurrentImage:qi,getCurrentData:Gi,setCanvasOffset:F,setCanvasZoom:R}},Object.defineProperty(Re,Symbol.toStringTag,{value:"Module"})});
|