@yorab/react-paint 0.18.1 → 1.0.0-beta.1

package/dist/_chunks/canvas-CDYlr833.js

@@ -0,0 +1 @@
+import{createContext as e,useCallback as t,useContext as n,useEffect as r,useLayoutEffect as i,useMemo as a,useRef as o,useState as s,useSyncExternalStore as c}from"react";import{jsx as l,jsxs as u}from"react/jsx-runtime";var d=`blue`,f=[[0,0],[.5,0],[1,0],[1,.5],[1,1],[.5,1],[0,1],[0,.5]],p=[`rect`,`square`,`circle`,`ellipse`,`picture`,`text`,`triangle`,`brush`,`group`],m=[`square`,`circle`,`picture`,`text`],h=[`brush`,`rect`,`square`,`line`,`polygon`,`circle`,`curve`,`ellipse`,`picture`,`text`,`triangle`,`group`],g=[[1,0],[1,2],[4,6]],_=`serif`,v=`react-paint-`,y={id:`${v}selection`,type:`selection`},b={id:`${v}move`,type:`move`},x=`${v}picture`,S=[`transparent`,`black`,`white`,`red`,`green`,`blue`,`yellow`],C=[0,1,2],ee=[0,1,2,3],w=[`arial`,`serif`,`monospace`],T={strokeColor:{values:S,default:`black`},fillColor:{values:S,default:`transparent`},opacity:{min:0,max:100,step:1,default:100},lineWidth:{min:1,max:20,step:1,default:1},lineDash:{values:C,default:0}},te={opacity:{min:0,max:100,step:1,default:100}},ne={strokeColor:{values:S,default:`black`},opacity:{min:0,max:100,step:1,default:100},fontFamily:{values:w,default:_},fontBold:{values:[!1,!0],default:!1},fontItalic:{values:[!1,!0],default:!1}},re={strokeColor:{values:S,default:`black`},opacity:{min:0,max:100,step:1,default:100},lineWidth:{min:6,max:20,step:2,default:10},lineDash:{values:C,default:0}},ie={strokeColor:{values:S,default:`black`},opacity:{min:0,max:100,step:1,default:100},lineWidth:{min:1,max:20,step:1,default:1},lineDash:{values:C,default:0},lineArrow:{values:ee,default:0}},ae={strokeColor:{values:S,default:`black`},fillColor:{values:S,default:`transparent`},opacity:{min:0,max:100,step:1,default:100},lineWidth:{min:1,max:20,step:1,default:1},lineDash:{values:C,default:0},closedPoints:{default:0}},oe=[{type:`brush`,id:`${v}brush`,settings:re},{type:`line`,id:`${v}line`,settings:ie},{type:`polygon`,id:`${v}polygon`,settings:ae},{type:`curve`,id:`${v}curve`,settings:ae},{type:`rect`,id:`${v}rect`,settings:T},{type:`square`,id:`${v}square`,settings:T},{type:`circle`,id:`${v}circle`,settings:T},{type:`ellipse`,id:`${v}ellipse`,settings:T},{type:`picture`,id:x,settings:te},{type:`text`,id:`${v}text`,settings:ne}],se=`react-paint-canvas-drawcanvas`,ce=104857600,le={grid:0,withContextMenu:!0,withDropPicture:!0,availableTools:oe,clearCallback:`empty`,resolvePictureSrc:void 0,brushAlgo:`simple`,isBrushShapeDoneOnMouseUp:!0,withFrameSelection:!0,withSkeleton:!0,canvasSelectionPadding:0,size:`fixed`,resize:`scaleDown`,canZoom:`never`,debug:!1},ue={canvasBackgroundColor:`white`,canvasSelectionColor:d,canvasSelectionWidth:2},de=(e,t)=>{if(Object.is(e,t))return!0;if(typeof e!=`object`||typeof t!=`object`||e===null||t===null)return!1;if(Array.isArray(e)||Array.isArray(t)){if(!Array.isArray(e)||!Array.isArray(t)||e.length!==t.length)return!1;for(let n=0;n<e.length;n++)if(!Object.is(e[n],t[n]))return!1;return!0}let n=Object.keys(e);return n.length===Object.keys(t).length&&n.every(n=>Object.prototype.hasOwnProperty.call(t,n)&&Object.is(e[n],t[n]))},fe={},pe=(e=``)=>(fe[e]||(fe[e]=0),`${e}${++fe[e]}`),me=0,E=e=>`${e}_${typeof crypto<`u`&&typeof crypto.randomUUID==`function`?crypto.randomUUID():`${Date.now().toString(36)}${Math.random().toString(36).slice(2,10)}${++me}`}`,he=(e,t,n)=>Math.max(t,Math.min(e,n)),ge=()=>typeof navigator>`u`?!1:navigator.userAgent.includes(`Macintosh`),D=(e,t)=>t===void 0?`var(${e})`:`var(${e}, ${t})`,_e=e=>e.filter(e=>e!=null),ve=(e,t,...n)=>{let r=he(Math.round(t),0,e.length);return[...e.slice(0,r),...n,...e.slice(r)]},ye=(e,t,n)=>t<0||n<0||t>e.length-1||n>e.length-1?e:t<n?[...e.slice(0,t),...e.slice(t+1,n+1),e[t],...e.slice(n+1,e.length)]:[...e.slice(0,n),e[t],...e.slice(n,t),...e.slice(t+1,e.length)],be=(e,t)=>{let n={...t};for(let t of e)delete n[t];return n},xe=(e,t,n)=>{let r=Array.isArray(n)?[...n]:{...n},i=Array.isArray(e)?e:typeof e==`string`?e.split(`.`):[e];return i.reduce((e,n,r)=>(e[n]=O(e[n])?{...e[n]}:Array.isArray(e[n])?[...e[n]]:e[n]===void 0||e[n]===null?{}:e[n],r===i.length-1&&(e[n]=t),e[n]),r),r},Se=e=>Object.fromEntries(Object.entries(e).filter(([,e])=>e!==void 0)),Ce=(e,t)=>({...e,...Se(t??{})}),O=e=>typeof e==`object`&&!Array.isArray(e)&&e!==null,we=(e,t)=>Array.isArray(e)?t:void 0,Te=(e,t,n)=>{if(!O(t)||!O(n))return n;let r={...t};for(let t in n)n.hasOwnProperty(t)&&(r[t]=r.hasOwnProperty(t)?e(r[t],n[t],t)??Te(e,r[t],n[t]):n[t]);return r},Ee=(e,t)=>{if(e===t)return!0;if(typeof e!=`object`||typeof t!=`object`||e===null||t===null)return!1;let n=Object.keys(e);if(n.length!==Object.keys(t).length)return!1;let r=e,i=t;for(let e of n)if(!Object.prototype.hasOwnProperty.call(i,e)||!Ee(r[e],i[e]))return!1;return!0},De=e=>e?_e(e.map(e=>{if(!O(e)||!e.type)return null;let t=oe.find(t=>t.type===e.type);return t?Te(we,t,e):e})):oe,Oe=(e,t)=>e.find(e=>e.id===t.toolId)??e.find(e=>e.type===t.type),ke=e=>{let t={};for(let[n,r]of Object.entries(e?.settings??{}))O(r)&&r.default!==void 0&&(t[n]=r.default);return t},k=e=>e?e.type===`group`?e.shapes:[e]:[],Ae=(e,t)=>{let n=_e(k(e).map(e=>Oe(t,e)));if(!n.length)return;if(n.length===1)return n[0];let r=n.slice(1).reduce((e,t)=>{let n={};for(let r in t.settings){if(e[r]===void 0)continue;let i=e[r],a=t.settings[r];if(i.hidden||a?.hidden)continue;let o={};`min`in a&&`min`in i&&a.min===i.min&&`max`in a&&`max`in i&&a.max===i.max&&`step`in a&&`step`in i&&a.step===i.step&&(o.min=a.min,o.max=a.max,o.step=a.step),`values`in a&&`values`in i&&a.values?.join(`,`)===i.values?.join(`,`)&&(o.values=a.values),(Object.keys(o).length>0||r===`closedPoints`)&&(n[r]=o)}return n},n[0].settings);return{id:n.map(e=>e.id).join(`-`),icon:``,label:`group`,type:`group`,settings:r}},je=e=>{e.reset(),e.lineCap=`round`,e.lineJoin=`round`},A=(e,t={})=>{let{lineCap:n=`round`,fillColor:r=`transparent`,opacity:i=100,strokeColor:a=d,lineWidth:o=2,lineDash:s=0,shadowColor:c=`transparent`,shadowBlur:l=0}=t;e.lineCap=n,e.globalAlpha=i/100,e.fillStyle=r,e.strokeStyle=a,e.lineWidth=o,e.setLineDash(s===0?[]:[g[s][0]*o,g[s][1]*o]),e.shadowColor=c,e.shadowBlur=l},j=(e,t,n,r)=>{e.save(),e.scale(t.canvasSize.scaleRatio,t.canvasSize.scaleRatio),e.translate(t.canvasOffset[0],t.canvasOffset[1]),n&&r&&(e.translate(r[0],r[1]),e.rotate(n),e.translate(-r[0],-r[1]))},M=(e,t,n)=>{e.globalAlpha!==0&&(n?.fillColor!==`transparent`&&e.fill(t),n?.strokeColor!==`transparent`&&e.stroke(t))},Me=(e,t,n)=>({realWidth:t,realHeight:n,width:e,height:n*e/t,scaleRatio:e/t}),Ne=(e,t)=>({realWidth:e,realHeight:t,width:e,height:t,scaleRatio:1}),Pe=e=>e===`scale`||e===`scaleUp`,Fe=e=>e===`scale`||e===`scaleDown`,Ie=()=>{if(typeof document>`u`)return null;try{return document.createElement(`canvas`).getContext(`2d`)}catch{return null}},Le=()=>{let e={font:`10px sans-serif`,measureText:t=>({width:t.length*Number.parseFloat(/([\d.]+)px/.exec(e.font)?.[1]??`10`)*.6})};return e},Re=e=>e.type===`line`||e.type===`polygon`||e.type===`curve`,ze=e=>7/e.canvasSize.scaleRatio,Be=(e,t)=>[e.x+e.width/2,e.y-23/t.canvasSize.scaleRatio],Ve=(e,[t,n])=>[e.x+e.width*t,e.y+e.height*n],He=(e,{x:t,y:n,width:r,height:i})=>{e.beginPath(),e.rect(t,n,r,i),e.stroke()},Ue=(e,t)=>A(e,{fillColor:`rgb(255,255,255)`,strokeColor:`rgb(150,150,150)`,lineWidth:2/t.canvasSize.scaleRatio}),We=(e,[t,n],r,i)=>{e.beginPath(),e.arc(t,n,ze(r),0,2*Math.PI),i&&(e.shadowColor=i,e.shadowBlur=10),e.fill(),e.shadowBlur=0,e.stroke()},Ge=(e,t,n)=>{let r=Be(t,n);e.beginPath(),e.moveTo(r[0],t.y),e.lineTo(r[0],r[1]),e.stroke(),Ue(e,n),We(e,r,n);for(let r of f)We(e,Ve(t,r),n)},N={none:0,small:10,medium:20,large:40},Ke=4e3,qe=16384,Je=[`image/png`,`image/gif`,`image/jpeg`,`image/svg+xml`,`image/webp`],Ye=e=>e*180/Math.PI,Xe=(e,t)=>t[0]>=e.x&&t[0]<=e.x+e.width&&t[1]>=e.y&&t[1]<=e.y+e.height,Ze=e=>{let t=1/0,n=1/0,r=-1/0,i=-1/0;for(let a of e)for(let[e,o]of a)e<t&&(t=e),e>r&&(r=e),o<n&&(n=o),o>i&&(i=o);return{minX:t,minY:n,maxX:r,maxY:i}},Qe=({x:e,y:t,width:n,height:r})=>[[e,t],[e+n,t],[e+n,t+r],[e,t+r]],$e=e=>{let t=1/0,n=1/0,r=-1/0,i=-1/0;for(let a of e)t=Math.min(t,a.x),n=Math.min(n,a.y),r=Math.max(r,a.x+a.width),i=Math.max(i,a.y+a.height);return{x:t,y:n,width:r-t,height:i-n}},et=(e,t)=>{let n=t.x-Math.min(Math.max(t.x,e.x),e.x+e.width),r=t.y-Math.min(Math.max(t.y,e.y),e.y+e.height);return Math.sqrt(n*n+r*r)<=t.radius},P=({origin:e=[0,0],point:t,rotation:n=0})=>{if(n===0)return t;let r=[t[0]-e[0],t[1]-e[1]],i=r[1]*Math.cos(n)-r[0]*Math.sin(n);return[r[1]*Math.sin(n)+r[0]*Math.cos(n)+e[0],i+e[1]]},tt=e=>(e+2*Math.PI)%(2*Math.PI),nt=({targetVector:[e,t],radian:n=!0,originVector:r})=>{let i=tt(Math.atan2(t[1]-e[1],t[0]-e[0]));if(r){let[e,t]=r,a=tt(i-Math.atan2(t[1]-e[1],t[0]-e[0]));return n?a:Ye(a)}return n?i:Ye(i)},rt=(e,t)=>Math.sqrt((e[0]-t[0])**2+(e[1]-t[1])**2),it=(e,t)=>[(e[0]+t[0])/2,(e[1]+t[1])/2],at=e=>e.type===`picture`||e.type===`text`?void 0:e.path,ot=(e,t,n,r)=>{r.debug&&(e.save(),e.scale(r.canvasSize.scaleRatio,r.canvasSize.scaleRatio),e.translate(r.canvasOffset[0],r.canvasOffset[1]),A(e,{fillColor:`transparent`,strokeColor:`green`,lineWidth:n/r.canvasSize.scaleRatio}),e.strokeRect(t.computed.boundingBox.x,t.computed.boundingBox.y,t.computed.boundingBox.width,t.computed.boundingBox.height),e.restore())},st=(e,t,n,r,i,a)=>{j(e,i,t.rotation,t.computed.center),i.debug&&(A(e,{fillColor:`transparent`,strokeColor:`red`,lineWidth:r/i.canvasSize.scaleRatio}),e.strokeRect(t.computed.outerBorders.x,t.computed.outerBorders.y,t.computed.outerBorders.width,t.computed.outerBorders.height)),A(e,{fillColor:`transparent`,strokeColor:n,lineWidth:r/i.canvasSize.scaleRatio});let{borders:o}=t.computed,s=at(t);s?e.stroke(s):He(e,o),a&&!t.locked&&(s&&He(e,o),Ge(e,o,i))},ct=({borderStart:e,borderSize:t,vector:n,settings:r,invertedAxe:i,anchor:a})=>{switch(a){case 0:{if(i){let i=Math.max(0,n-t)+2*r.selectionPadding;return[e+t-2*r.selectionPadding,i]}let a=Math.max(2*r.selectionPadding,t-n);return[e+t-a,a]}case .5:return[e,t];case 1:if(i){let i=Math.min(e,e+t+n);return[i,e-i+2*r.selectionPadding]}return[e,Math.max(2*r.selectionPadding,t+n)];default:return[0,0]}},lt=(e,t,n,r,i,a,o,s,c,l,u)=>{let{selectionPadding:d}=u,f=`ratio`in c&&c.ratio?c.ratio:(e.width-d*2||1)/(e.height-d*2||1),p=(r-d*2)/(a-d*2),m,h,g,_;return l.anchor[0]!==.5&&l.anchor[1]!==.5?p<f?(h=i,_=a,g=(a-d*2)*f+2*d,m=l.anchor[0]===0?o?e.x+e.width-2*d:e.x+(e.width-g):o?e.x-g+2*d:e.x):(m=n,g=r,_=(r-d*2)/f+2*d,h=l.anchor[1]===0?s?e.y+e.height-2*d:e.y+(e.height-_):s?e.y-_+2*d:e.y):l.anchor[0]===.5?(h=i,_=a,g=(a-d*2)*f+2*d,m=e.x+(e.width-g)/2):(m=n,g=r,_=(r-d*2)/f+2*d,h=e.y+(e.height-_)/2),{borderX:m,borderWidth:g,borderY:h,borderHeight:_,center:t,originalShape:c}},ut=({borderX:e,borderWidth:t,borderY:n,borderHeight:r,center:i,originalShape:a})=>{let o=[e+t/2-i[0],n+r/2-i[1]],[s,c]=P({point:o,rotation:-(a.rotation??0)});return{borderX:U(e+s-o[0]),borderWidth:U(t),borderY:U(n+c-o[1]),borderHeight:U(r)}},dt=(e,t)=>Math.max(0,Math.abs(e)-t),ft=({roundCursorPosition:e,borders:t,center:n,selectionMode:r,originalShape:i,settings:a})=>{let o=(t,i,o)=>{if(r.anchor[t]===.5)return[i,o];let s=2*Math.max(a.selectionPadding,Math.abs(e[t]-n[t]));return[n[t]-s/2,s]},[s,c]=o(0,t.x,t.width),[l,u]=o(1,t.y,t.height);return{borderX:s,borderWidth:c,borderY:l,borderHeight:u,center:n,originalShape:i}},pt=({roundCursorPosition:e,borders:t,center:n,selectionMode:r,originalShape:i,settings:a})=>{let{selectionPadding:o}=a,s=Math.max(1,t.width-o*2),c=Math.max(1,t.height-o*2),l=`ratio`in i&&i.ratio?i.ratio:s/c,[u,d]=n,[f,p]=r.anchor,m=Math.hypot((f-.5)*s,(p-.5)*c)||1,h=Math.hypot(f===.5?0:dt(e[0]-u,o),p===.5?0:dt(e[1]-d,o))/m,g=2*o/(s+2*o),_=s*Math.max(h,g),v=_/l,y=_+o*2,b=v+o*2;return{borderX:u-y/2,borderY:d-b/2,borderWidth:y,borderHeight:b,center:n,originalShape:i}},F=(e,t,n,r,i=!1,a=!1)=>{let{center:o,borders:s}=t.computed,c=P({origin:o,point:e,rotation:t.rotation}),l=a?[o[0],o[0]]:[s.x+s.width-r.selectionPadding,s.x+r.selectionPadding],u=a?[o[1],o[1]]:[s.y+s.height-r.selectionPadding,s.y+r.selectionPadding],d=n.anchor[0]===0&&c[0]>=l[0]||n.anchor[0]===1&&c[0]<=l[1],f=n.anchor[1]===0&&c[1]>=u[0]||n.anchor[1]===1&&c[1]<=u[1],p=[W(c[0],r,n.anchor[0]===0&&!d||n.anchor[0]===1&&d?r.selectionPadding:-r.selectionPadding),W(c[1],r,n.anchor[1]===0&&!f||n.anchor[1]===1&&f?r.selectionPadding:-r.selectionPadding)];if(a){let e={roundCursorPosition:p,borders:s,center:o,selectionMode:n,originalShape:t,settings:r};return{...ut(i?pt(e):ft(e)),isXinverted:d,isYinverted:f}}let m=r.gridGap?[n.anchor[0]===0?s.x:n.anchor[0]===.5?s.x+s.width/2:s.x+s.width,n.anchor[1]===0?s.y:n.anchor[1]===.5?s.y+s.height/2:s.y+s.height]:P({origin:o,point:n.cursorStartPosition,rotation:t.rotation}),h=[p[0]-m[0],p[1]-m[1]],[g,_]=ct({borderStart:s.x,borderSize:s.width,vector:h[0],settings:r,invertedAxe:d,anchor:n.anchor[0]}),[v,y]=ct({borderStart:s.y,borderSize:s.height,vector:h[1],settings:r,invertedAxe:f,anchor:n.anchor[1]});return{...ut(i?lt(s,o,g,_,v,y,d,f,t,n,r):{borderX:g,borderWidth:_,borderY:v,borderHeight:y,center:o,originalShape:t}),isXinverted:d,isYinverted:f}},mt=(e,t,n,r,i,a,o)=>{t.shapes.forEach(t=>{A(e,{fillColor:`transparent`,strokeColor:n,lineWidth:r/a.canvasSize.scaleRatio}),j(e,a,t.rotation,t.computed.center);let i=at(t);i&&e.stroke(i),e.restore()}),i.mode!==`rotate`&&(j(e,a,t.rotation,t.computed.center),a.debug&&(A(e,{fillColor:`transparent`,strokeColor:`red`,lineWidth:r/a.canvasSize.scaleRatio}),e.strokeRect(t.computed.outerBorders.x,t.computed.outerBorders.y,t.computed.outerBorders.width,t.computed.outerBorders.height)),A(e,{fillColor:`transparent`,strokeColor:n,lineWidth:r/a.canvasSize.scaleRatio}),o&&!t.locked&&(He(e,t.computed.borders),Ge(e,t.computed.borders,a)))},ht=({ctx:e,shape:t,withAnchors:n,selectionWidth:r,selectionColor:i,hoverMode:a,settings:o})=>{j(e,o,t.rotation,t.computed.center),o.debug&&(A(e,{fillColor:`transparent`,strokeColor:`red`,lineWidth:r/o.canvasSize.scaleRatio}),e.strokeRect(t.computed.outerBorders.x,t.computed.outerBorders.y,t.computed.outerBorders.width,t.computed.outerBorders.height)),A(e,{fillColor:`transparent`,strokeColor:i,lineWidth:r/o.canvasSize.scaleRatio}),e.stroke(t.path),n&&!t.locked&&(Ue(e,o),t.points.forEach((t,n)=>{We(e,t,o,a.mode===`resize`&&a.anchor===n?i:void 0)}))},gt=(e,t,n)=>{A(e,{fillColor:`rgba(170,170,170, 0.1)`,strokeColor:`rgb(170,170,170)`,lineWidth:1/n.canvasSize.scaleRatio}),e.fillRect(t[0][0],t[0][1],t[1][0]-t[0][0],t[1][1]-t[0][1]),e.strokeRect(t[0][0],t[0][1],t[1][0]-t[0][0],t[1][1]-t[0][1])},I=[.05,.1,.25,.5,1,2,4,8],_t=`#f5f5f5`,vt=e=>he(e,I[0],I[I.length-1]),yt=(e,t,n,r)=>r*t<=n?n/t/2-r/2:he(e,n/t-r,0),bt=({size:e,zoom:t,newOffset:[n,r],canvasSize:i,drawingSize:a})=>e===`infinite`?{zoom:t,offset:[n,r]}:{zoom:t,offset:[yt(n,t,i.realWidth,a.width),yt(r,t,i.realHeight,a.height)]},xt=({currentOffset:e,currentZoom:t,zoom:n,centerPoint:r,...i})=>{let a=e[0]-(r[0]/t-r[0]/n),o=e[1]-(r[1]/t-r[1]/n),{offset:s}=bt({...i,zoom:n,newOffset:[a,o]});return{offset:s,zoom:n}},St=({currentOffset:e,currentZoom:t,action:n,...r})=>{let i=n==="default"?I[4]:n===`zoom`?I[he(I.length-1-I.slice(0).reverse().findIndex(e=>e<=t)+1,0,I.length-1)]:I[he(I.findIndex(e=>e>=t)-1,0,I.length-1)],a=[r.canvasSize.realWidth/2,r.canvasSize.realHeight/2];return xt({...r,currentOffset:e,currentZoom:t,zoom:i,centerPoint:a})},Ct=({currentOffset:e,currentZoom:t,delta:n,centerPoint:r,...i})=>{let a=vt(t*(1-n/1e3));return xt({...i,currentOffset:e,currentZoom:t,zoom:a,centerPoint:r})},wt=({box:e,padding:t,...n})=>{let{canvasSize:r}=n,i=2*t/r.scaleRatio,a=vt(Math.min((r.realWidth-i)/Math.max(e.width,1),(r.realHeight-i)/Math.max(e.height,1))),o=[r.realWidth/2/a-(e.x+e.width/2),r.realHeight/2/a-(e.y+e.height/2)];return bt({...n,zoom:a,newOffset:o})},Tt=e=>{let{canvasSize:{width:t,height:n,scaleRatioWithNoZoom:r},canvasZoom:i,canvasOffset:a}=e;return{x:0-a[0],y:0-a[1],width:t/i/r,height:n/i/r}},Et=e=>{let{canvasSize:{scaleRatio:t},drawingSize:n,canvasOffset:r}=e;return{x:r[0]*t,y:r[1]*t,width:n.width*t,height:n.height*t}},Dt=({size:e,canvasZoom:t,canvasSize:n,drawingSize:r})=>e===`fixed`&&(r.width*t<n.realWidth||r.height*t<n.realHeight),Ot=(e,t)=>{if(!Dt(t))return;let n=Et(t);e.beginPath(),e.rect(n.x,n.y,n.width,n.height),e.closePath(),e.clip()},kt=(e,t)=>{let{canvasSize:{width:n,height:r}}=t;if(!Dt(t))return;e.fillStyle=_t,e.fillRect(0,0,n,r);let i=Et(t);e.clearRect(i.x,i.y,i.width,i.height),Ot(e,t)},At=(e,t)=>t.size!==`fixed`||e[0]>0&&e[0]<t.drawingSize.width&&e[1]>0&&e[1]<t.drawingSize.height,jt=(e,t)=>{let n=Math.abs(e.deltaY)<50&&t<50,r=e.ctrlKey,i=ge()&&n&&r;switch(e.deltaMode){case WheelEvent.DOM_DELTA_LINE:return{deltaX:e.deltaX*16,deltaY:e.deltaY*16};case WheelEvent.DOM_DELTA_PAGE:return{deltaX:e.deltaX*window.innerHeight,deltaY:e.deltaY*window.innerHeight};default:return i?{deltaX:e.deltaX*5,deltaY:e.deltaY*5}:{deltaX:e.deltaX,deltaY:e.deltaY}}},Mt=(e,t,n,{isXinverted:r=!1,isYinverted:i=!1,rotation:a=e.rotation??0}={})=>{let{borders:o}=e.computed,s=(t.width-2*n.selectionPadding)/(o.width-2*n.selectionPadding||1),c=(t.height-2*n.selectionPadding)/(o.height-2*n.selectionPadding||1);return{newBorderX:t.x,newBorderY:t.y,newBorderWidth:t.width,newBorderHeight:t.height,widthMultiplier:s,heightMultiplier:c,isXinverted:r,isYinverted:i,groupCenter:[t.x+t.width/2,t.y+t.height/2],rotation:a,settings:n,originalBorders:o}},L=(e,t,n,r,i,a)=>{let{borderX:o,borderHeight:s,borderY:c,borderWidth:l,isXinverted:u,isYinverted:d}=F(e,t,n,r,i,a);return Mt(t,{x:o,y:c,width:l,height:s},r,{isXinverted:u,isYinverted:d})},R=(e,t,n)=>{let r=P({origin:t.computed.center,point:e.computed.center,rotation:t.rotation??0}),i=(r[0]-(e.computed.borders.width/2-n.settings.selectionPadding)-(n.originalBorders.x+n.settings.selectionPadding))*n.widthMultiplier,a=(r[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-i:i),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-a:a)}},z=(e,t,n,r,i)=>P({origin:e.groupCenter,point:[t+r/2,n+i/2],rotation:-e.rotation}),Nt=(e,{selectionPadding:t})=>{let n=Ai(e.points),{minX:r,minY:i}=n,[a,o]=vi([n.maxX,n.maxY],r,i,e.scaleX,e.scaleY),s=Math.max(r,a),c=Math.max(i,o);return G({x:r,y:i,width:s-r,height:c-i},t)},B=(e,t,n=Ii(e,t))=>{let r=K(e,Nt,t);return{...e,path:n,computed:r}},Pt=B,Ft=(e,t,n)=>B({toolId:e.id,type:e.type,id:E(e.type),points:[[t]],scaleX:1,scaleY:1,style:{opacity:e.settings.opacity.default,strokeColor:e.settings.strokeColor.default,lineWidth:e.settings.lineWidth.default,lineDash:e.settings.lineDash.default}},n),It=(e,t)=>{t.points.length<1||e.globalAlpha!==0&&t.style?.strokeColor!==`transparent`&&e.globalAlpha!==0&&e.stroke(t.path)},Lt=(e,t,n,r,i,a)=>{let o=Nt({...t,scaleX:1,scaleY:1},r),s=t.computed.borders,{borderX:c,borderHeight:l,borderY:u,borderWidth:d,isXinverted:f,isYinverted:p}=F(e,t,n,r,i,a),m=Math.max(0,o.width-2*r.selectionPadding),h=Math.max(0,o.height-2*r.selectionPadding),g=Math.max(0,d-2*r.selectionPadding),_=Math.max(0,l-2*r.selectionPadding),v=m?g/m:1,y=h?_/h:1;if(!m||!h)return t;let b=U(c-s.x)+(f?2*s.x+o.width:0),x=U(u-s.y)+(p?2*s.y+o.height:0);return B({...t,points:t.points.map(e=>e.map(([e,t])=>[f?-e+b:e+b,p?-t+x:t+x])),scaleX:v,scaleY:y},r)},Rt=(e,t,n)=>{let{isXinverted:r,isYinverted:i,settings:a,widthMultiplier:o,heightMultiplier:s}=n,c=Nt({...e,scaleX:1,scaleY:1},a),l=c.width-2*a.selectionPadding,u=c.height-2*a.selectionPadding,d=e.scaleX??1?(e.scaleX??1)*o:o/l,f=e.scaleY??1?(e.scaleY??1)*s:s/u,p=l*d,m=u*f,h=R(e,t,n),g=z(n,h.x,h.y,p,m),_=U(g[0]-p/2-e.computed.borders.x-a.selectionPadding)+(r?2*e.computed.borders.x+c.width:0),v=U(g[1]-m/2-e.computed.borders.y-a.selectionPadding)+(i?2*e.computed.borders.y+c.height:0),y=(r||i)&&!(r&&i)&&(e.rotation??0)!==0&&n.rotation!==e.rotation;return B({...e,points:e.points.map(e=>e.map(([e,t])=>[r?-e+_:e+_,i?-t+v:t+v])),scaleX:d,scaleY:f,rotation:y?-(e.rotation??0):e.rotation??0},n.settings)},zt=([e,t])=>[Math.round(e),Math.round(t)],Bt=(e,t,n)=>{let r=zt(t);return B({...e,points:ji(e.points,e.points.length-1,r)},n,Fi(e,r,n))},Vt=(e,t,n)=>B({...e,points:ji(e.points,e.points.length,zt(t))},n),Ht=(e,t)=>G({x:e.x-e.radius,y:e.y-e.radius,width:e.radius*2,height:e.radius*2},t.selectionPadding),Ut=(e,t)=>{let n=Ei(e),r=K(e,Ht,t);return{...e,path:n,computed:r}},Wt=Ut,Gt=(e,t,n)=>Ut({toolId:e.id,type:e.type,id:E(e.type),x:t[0],y:t[1],radius:0,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}},n),Kt=(e,t)=>{M(e,t.path,t.style)},qt=(e,t,n,r,i)=>{let{borderX:a,borderHeight:o,borderY:s,borderWidth:c}=F(e,t,n,r,!0,i);return Ut({...t,radius:Math.max(0,c/2-r.selectionPadding),x:a+c/2,y:s+o/2},r)},Jt=(e,t,n)=>{let r=R(e,t,n),i=(e.radius||.5)*n.widthMultiplier,a=z(n,r.x,r.y,i*2,i*2);return Ut({...e,radius:i,x:a[0],y:a[1]},n.settings)},Yt=(e,t)=>{let n=Vi(e),r=K(e,$t,t);return{...e,path:n,computed:r}},Xt=Yt,Zt=(e,t,n)=>Yt({toolId:e.id,type:e.type,id:E(e.type),points:[t],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,closedPoints:e.settings.closedPoints.default}},n),Qt=(e,t)=>{M(e,t.path,t.style)},$t=(e,t)=>{let{minX:n,minY:r,maxX:i,maxY:a}=Ze([e.points]);return G({x:n,width:i-n,y:r,height:a-r},t.selectionPadding)},en=(e,t,n,r)=>{let i=J([W(e[0],r),W(e[1],r)],t.rotation??0,t.computed.center);return Yt(xe([`points`,n.anchor],i,t),r)},tn=(e,t,n,r)=>{if(t<0||t>e.points.length-1)return e;let i=[...e.points.slice(0,t+1),n,...e.points.slice(t+1)];return Yt({...e,points:i},r)},nn=(e,t,n,r=!1)=>{let i=J([W(t[0],n),W(t[1],n)],e.rotation??0,e.computed.center);return Yt({...e,points:r?e.points:[...e.points,i],tempPoint:r?i:void 0},n)},rn=(e,t,n)=>t<0||t>e.points.length-1?e:Yt({...e,points:e.points.filter((e,n)=>n!==t)},n),an=(e,t,n)=>{let r=e.tempPoint?[...e.points,e.tempPoint]:e.points;if(r.length<2){let e=r[0]??[0,0],t=n.selectionPadding;return{x:e[0]-t,y:e[1]-t,width:2*t,height:2*t}}if(r.length<3)return $t({...e,points:r},n);let i=Ri(e,r),a=1/0,o=-1/0,s=1/0,c=-1/0;for(let e=1;e<i.length-2;e++){let t=i[e-1],n=i[e],r=i[e+1],l=i[e+2],{cp1:u,cp2:d}=zi(t,n,r,l),f=Li(n,u,d,r);a=Math.min(a,f.minX),o=Math.max(o,f.maxX),s=Math.min(s,f.minY),c=Math.max(c,f.maxY)}return ba({x:a,y:s,width:o-a,height:c-s},n)},on=(e,t)=>{let n=Bi(e),r=K(e,$t,t,an);return{...e,path:n,computed:r}},sn=on,cn=(e,t,n)=>on({toolId:e.id,type:e.type,id:E(e.type),points:[t],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,closedPoints:e.settings.closedPoints.default}},n),ln=(e,t,n,r)=>{let i=[W(e[0],r),W(e[1],r)],a=t.computed.center,o=J(i,t.rotation??0,a);return on(xe([`points`,n.anchor],o,t),r)},un=(e,t)=>{M(e,t.path,t.style)},dn=(e,t,n,r)=>{if(t<0||t>e.points.length-1)return e;let i=[...e.points.slice(0,t+1),n,...e.points.slice(t+1)];return on({...e,points:i},r)},fn=(e,t,n,r=!1)=>{let i=[W(t[0],n),W(t[1],n)],a=e.computed.center,o=J(i,e.rotation??0,a);return on({...e,points:r?e.points:[...e.points,o],tempPoint:r?o:void 0},n)},pn=(e,t,n)=>t<0||t>e.points.length-1?e:on({...e,points:e.points.filter((e,n)=>n!==t)},n),mn=(e,t)=>G({x:e.x-e.radiusX,y:e.y-e.radiusY,width:e.radiusX*2,height:e.radiusY*2},t.selectionPadding),hn=(e,t)=>{let n=Di(e),r=K(e,mn,t);return{...e,path:n,computed:r}},gn=hn,_n=(e,t,n)=>hn({toolId:e.id,type:e.type,id:E(e.type),x:t[0],y:t[1],radiusX:0,radiusY:0,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}},n),vn=(e,t)=>{M(e,t.path,t.style)},yn=(e,t,n,r,i=!1,a=!1)=>{let{borderX:o,borderHeight:s,borderY:c,borderWidth:l}=F(e,t,n,r,i,a);return hn({...t,radiusX:Math.max(0,l/2-r.selectionPadding),radiusY:Math.max(0,s/2-r.selectionPadding),x:o+l/2,y:c+s/2},r)},bn=(e,t,n)=>{let{isXinverted:r,isYinverted:i,settings:a,widthMultiplier:o,heightMultiplier:s}=n,c=(r||i)&&!(r&&i)&&(e.rotation??0)!==0&&n.rotation!==e.rotation,l=R(e,t,n),u=(e.radiusX||.5)*o,d=(e.radiusY||.5)*s,f=z(n,l.x,l.y,u*2,d*2);return hn({...e,radiusX:u,radiusY:d,x:f[0],y:f[1],rotation:c?-(e.rotation??0):e.rotation??0},a)},xn=(e,t)=>({...e,path:Hi(e),computed:K(e,$t,t)}),Sn=(e,t)=>xn({...e,id:pe(`triangle_`),type:`triangle`},t),Cn=(e,t)=>{M(e,t.path,t.style)},wn=(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])+t.selectionPadding*2,y:Math.min(e.points[0][1],e.points[1][1])-t.selectionPadding,height:Math.abs(e.points[0][1]-e.points[1][1])+t.selectionPadding*2}),Tn=(e,t)=>{let n=[],r;if(e.style?.lineArrow===1||e.style?.lineArrow===2||e.style?.lineArrow===3){let i=Math.PI/2-nt({targetVector:[e.points[0],e.points[1]]});(e.style?.lineArrow===1||e.style?.lineArrow===3)&&n.push(Sn(On(e.points[0],i,e.style),t)),(e.style?.lineArrow===2||e.style?.lineArrow===3)&&n.push(Sn(On(e.points[1],i+Math.PI,e.style),t)),r=Oi(wi({line:e,size:10+(e.style?.lineWidth??0)*2,direction:e.style?.lineArrow===1?`start`:e.style?.lineArrow===2?`end`:`both`}))}else r=Oi(e);let i=K(e,wn,t);return{...e,path:r,arrows:n,style:{...e.style,lineCap:e.style?.lineArrow?`butt`:`round`},computed:i}},En=Tn,Dn=(e,t,n)=>Tn({toolId:e.id,type:e.type,id:E(e.type),points:[t,t],style:{opacity:e.settings.opacity.default,strokeColor:e.settings.strokeColor.default,lineWidth:e.settings.lineWidth.default,lineDash:e.settings.lineDash.default,lineArrow:e.settings.lineArrow.default}},n),On=(e,t,n)=>{let r=[P({point:[0,0],rotation:t}),P({point:[-(5+(n.lineWidth??0)),10+(n.lineWidth??0)*2],rotation:t}),P({point:[5+(n.lineWidth??0),10+(n.lineWidth??0)*2],rotation:t})];return{points:[[e[0]+r[0][0],e[1]+r[0][1]],[e[0]+r[1][0],e[1]+r[1][1]],[e[0]+r[2][0],e[1]+r[2][1]]],style:{...n,fillColor:n.strokeColor,strokeColor:`transparent`}}},kn=(e,t)=>{M(e,t.path,t.style);for(let n of t.arrows??[])A(e,{...n.style,opacity:100}),Cn(e,n)},An=(e,t,n,r)=>{let i=J([W(e[0],r),W(e[1],r)],t.rotation??0,t.computed.center);return Tn(xe([`points`,n.anchor],i,t),r)},jn=(e,t)=>e.type===`line`?Tn(e,t):e.type===`polygon`?Xt(e,t):sn(e,t),Mn=(e,t,n)=>{let{isXinverted:r,isYinverted:i,settings:a,widthMultiplier:o,heightMultiplier:s}=n,c=e.computed.borders.width-2*a.selectionPadding,l=e.computed.borders.height-2*a.selectionPadding,u=c*o,d=l*s,f=R(e,t,n),p=z(n,f.x,f.y,u,d),m=e.computed.center[0]-c/2,h=e.computed.center[1]-l/2,g=p[0]-u/2,_=p[1]-d/2;return jn({...e,points:e.points.map(([e,t])=>[g+(r?u-(e-m)*o:(e-m)*o),_+(i?d-(t-h)*s:(t-h)*s)])},n.settings)},Nn=/* @__PURE__ */ new Set([`img`,`path`,`arrows`,`tempPoint`,`computed`]),Pn=/* @__PURE__ */ new Set([`flipX`,`flipY`]),V=3,Fn=6,In=/* @__PURE__ */ new Map([[`x`,V],[`y`,V],[`width`,V],[`height`,V],[`radius`,V],[`radiusX`,V],[`radiusY`,V],[`fontSize`,V],[`rotation`,Fn],[`scaleX`,Fn],[`scaleY`,Fn],[`ratio`,Fn]]),Ln=/* @__PURE__ */ new WeakMap,Rn=e=>{if(typeof e==`number`)return U(e,V);if(!Array.isArray(e))return e;let t=Array.isArray(e[0]),n=t?Ln.get(e):void 0;if(n)return n;let r=e.map(Rn),i=r.some((t,n)=>t!==e[n])?r:e;return t&&Ln.set(e,i),i},zn=(e,t)=>{if(e===`points`)return Rn(t);let n=In.get(e);return n!==void 0&&typeof t==`number`?U(t,n):t},Bn=e=>{let t={};for(let n of Object.keys(e)){let r=e[n];Nn.has(n)||Pn.has(n)&&(r===void 0||r===!1)||(t[n]=zn(n,r))}return t},Vn=/* @__PURE__ */ new WeakMap,Hn=e=>{let t=Vn.get(e);if(t)return t;let n=Bn(e);return Vn.set(e,n),n},Un=e=>{let t=Hn(e);return e.type===`picture`&&rr(e.src)?{...t,src:nr(e.img)??e.src}:t},Wn=e=>({...Un(e)}),Gn=e=>e.map(Wn),Kn=(e,t,n)=>({shapes:Gn(e),config:{width:t,height:n}}),qn=(e,t,n)=>{let r=new Map(e.map(e=>[e.id,e])),i=new Set(t.map(e=>e.id)),a=[],o=[];t.forEach((e,t)=>{let i=r.get(e.id),s=n[t];if(!i)a.push(s);else if(i!==e){let e=Un(i);Ee(e,s)||o.push({shape:s,previous:{...e}})}});let s=t.filter(e=>r.has(e.id)).map(e=>e.id),c=e.filter(e=>i.has(e.id)).map(e=>e.id);return{added:a,updated:o,removed:Gn(e.filter(e=>!i.has(e.id))),reordered:!de(s,c)}},Jn=e=>{let t=new DOMParser().parseFromString(e,`text/xml`).getElementsByTagName(`svg`)[0];if(!t)throw Error(`The SVG of the picture is invalid`);let n=t.getAttribute(`width`),r=t.getAttribute(`height`),i;if(n||r)i=e;else{let[,,e,n]=(t.getAttribute(`viewBox`)??`0 0 300 300`).split(` `);t.setAttribute(`width`,e??`300`),t.setAttribute(`height`,n??`300`),i=new XMLSerializer().serializeToString(t)}let a=new Blob([i],{type:`image/svg+xml`});return URL.createObjectURL(a)},Yn=e=>(e instanceof File?e.name:e).includes(`.svg`),Xn=e=>{if(/^data:/i.test(e))return/^data:image\//i.test(e)?{kind:`direct`}:{kind:`refused`};if(/^blob:/i.test(e))return{kind:`direct`};if(e.includes(`<svg`))return{kind:`svg`};if(!e||typeof document>`u`)return{kind:`refused`};try{let t=new URL(e,document.baseURI);return t.protocol===`http:`||t.protocol===`https:`?{kind:`remote`,url:t.href}:{kind:`refused`}}catch{return{kind:`refused`}}},Zn=async(e,t)=>{let n=await fetch(e,{credentials:`omit`,referrerPolicy:`no-referrer`,signal:t});if(!n.ok)throw Error(`The picture could not be fetched (${n.status})`);let r=(n.headers.get(`content-type`)??``).split(`;`)[0].trim().toLowerCase(),i=r.startsWith(`image/`);return r===`image/svg+xml`||!i&&Yn(e)?Jn(await n.text()):URL.createObjectURL(new Blob([await n.blob()],{type:i?r:`application/octet-stream`}))},Qn=async(e,t,n)=>{let r=Xn(e);switch(r.kind){case`direct`:return e;case`svg`:return URL.createObjectURL(new Blob([e],{type:`image/svg+xml`}));case`refused`:throw Error(`The source of the picture is not supported`);case`remote`:{let e=t?await t(r.url):r.url;if(typeof e!=`string`)throw Error(`The source of the picture is refused`);let i=Xn(e);if(i.kind!==`remote`)throw Error(`The resolved source of the picture must be an http(s) URL`);return Zn(i.url,n)}}},$n=e=>{e?.startsWith(`blob:`)&&URL.revokeObjectURL(e)},er=(e,t)=>{let n=document.createElement(`a`);n.href=e,n.download=t,document.body.appendChild(n),n.click(),document.body.removeChild(n)},tr=/* @__PURE__ */ new WeakMap,nr=e=>{if(!e.complete||e.width===0)return;let t=tr.get(e);if(t!==void 0)return t;let n=Ie();if(n){n.canvas.width=e.width,n.canvas.height=e.height;try{n.drawImage(e,0,0);let t=n.canvas.toDataURL(`image/png`);return tr.set(e,t),t}catch{return}}},rr=e=>/^blob:/i.test(e),ir=(e,t,n)=>{let r=new AbortController,i,a;return new Promise((o,s)=>{a=setTimeout(()=>s(/* @__PURE__ */ Error(`Timeout while loading images`)),Ke),e.onload=()=>{e.naturalWidth>16384||e.naturalHeight>16384?s(/* @__PURE__ */ Error(`The picture is larger than ${qe} pixels`)):o()},e.onerror=()=>s(/* @__PURE__ */ Error(`Some images could not be loaded`)),Qn(t,n,r.signal).then(t=>{r.signal.aborted?$n(t):(i=t,e.src=t)},s)}).finally(()=>{r.abort(),clearTimeout(a),e.onload=null,e.onerror=null,$n(i)})},ar=e=>`data:text/plain;charset=utf-8,${encodeURIComponent(JSON.stringify(e))}`,or={png:`image/png`,jpeg:`image/jpeg`,webp:`image/webp`},sr=({shapes:e,settings:t,options:n})=>{let r=document.createElement(`canvas`),i=r.getContext(`2d`);if(!i)throw Error(`No context found for canvas`);let{realHeight:a,realWidth:o}=t.canvasSize;r.width=o,r.height=a,i.clearRect(0,0,o,a),je(i);let s=n.format??`png`,c=n.backgroundColor??(s===`jpeg`?`white`:void 0);c&&(i.fillStyle=c,i.fillRect(0,0,o,a)),n.backgroundImage&&(j(i,t),i.drawImage(n.backgroundImage,0,0,t.drawingSize.width,t.drawingSize.height),i.restore());for(let n=e.length-1;n>=0;n--)ti(i,e[n],t);return r.toDataURL(or[s],n.quality)},cr=(e,t,{width:n,height:r})=>({...e,canvasOffset:t,canvasZoom:1,canvasSize:{...Ne(n,r),scaleRatioWithNoZoom:1}}),lr=({shapes:e,settings:t,options:n={}})=>{let{view:r=`defaultView`,...i}=n;if(r===`fitToShapes`&&!e.length)throw Error(`No image found to export`);if(r===`fitToShapes`){let n=$e(e.map(e=>e.computed.boundingBox));return sr({shapes:e,settings:cr(t,[-n.x,-n.y],n),options:i})}return sr(r===`defaultView`?{shapes:e,settings:cr(t,[0,0],t.drawingSize),options:i}:{shapes:e,settings:{...t,canvasSize:{...t.canvasSize,width:t.canvasSize.realWidth,height:t.canvasSize.realHeight,scaleRatio:t.canvasZoom,scaleRatioWithNoZoom:1}},options:i})},ur=(e,t,n)=>ar(Kn(e,t,n)),dr=e=>new Promise((t,n)=>{let r=new FileReader;r.onload=()=>t(r.result),r.onerror=()=>n(r.error??/* @__PURE__ */ Error(`Failed to read file`)),r.readAsDataURL(e)}),fr=async e=>{if(e.size>104857600)throw Error(`The file is larger than ${ce/1024/1024} MB`);return new Promise((t,n)=>{let r=new FileReader;r.onload=e=>{let r=e.target?.result;if(!r)return n(/* @__PURE__ */ Error(`Impossible de récupérer les données du fichier`));try{t(JSON.parse(r))}catch{n(/* @__PURE__ */ Error(`Invalid JSON file`))}},r.onerror=()=>n(/* @__PURE__ */ Error(`Failed to read file`)),r.readAsText(e)})},pr=(e,t)=>{let n=K(e,ba,t),r=Ti(e);return{...e,path:r,computed:n}},mr=pr,hr=(e,t,n,r,i,a)=>{let[o,s]=Ci(e.width,e.height,n,r,!0),[c,l]=a??[-i.canvasOffset[0]+i.canvasSize.realWidth/i.canvasZoom/2,-i.canvasOffset[1]+i.canvasSize.realHeight/i.canvasZoom/2];return pr({toolId:x,type:`picture`,id:E(`picture`),x:c-o/2,y:l-s/2,width:o,height:s,ratio:s===0?1:o/s,src:t,img:e,style:{opacity:100}},i)},gr=async(e,t,n)=>{if(!(t instanceof File))return await ir(e,t,n),t;if(Yn(t)){let n=await t.text();return await ir(e,Jn(n)),n}let[r]=await Promise.all([dr(t),ir(e,URL.createObjectURL(t))]);return r},_r=async(e,t,n,r,i,a)=>{let o=new Image;return hr(o,await gr(o,e,i),t,n,r,a)},vr=/* @__PURE__ */ new WeakMap,yr=(e,t)=>{let{naturalWidth:n,naturalHeight:r}=t.img,{a:i,b:a,c:o,d:s}=e.getTransform(),c=t.width*Math.hypot(i,a),l=t.height*Math.hypot(o,s);return!n||!r||c<=0||l<=0?0:Math.max(0,Math.floor(Math.log2(Math.min(n/c,r/l))))},br=(e,t)=>{if(t===0)return e;let n=vr.get(e)??/* @__PURE__ */ new Map,r=n.get(t);if(r)return r;let i=Ie();return i?(i.canvas.width=Math.ceil(e.naturalWidth/2**t),i.canvas.height=Math.ceil(e.naturalHeight/2**t),i.imageSmoothingQuality=`high`,i.drawImage(e,0,0,i.canvas.width,i.canvas.height),i.canvas.addEventListener(`contextlost`,()=>n.delete(t)),n.set(t,i.canvas),vr.set(e,n),i.canvas):e},xr=(e,t)=>{if(e.globalAlpha===0)return;let n=br(t.img,yr(e,t));e.beginPath(),e.scale(t.flipX?-1:1,t.flipY?-1:1),e.drawImage(n,t.flipX?-t.x-t.width:t.x,t.flipY?-t.y-t.height:t.y,t.width,t.height)},Sr=(e,t,n,r,i)=>{let{borderX:a,borderHeight:o,borderY:s,borderWidth:c,isXinverted:l,isYinverted:u}=F(e,t,n,r,!0,i),d=Math.max(0,c-2*r.selectionPadding),f=Math.max(0,o-2*r.selectionPadding);return pr({...t,width:d,height:f,x:a+r.selectionPadding,y:s+r.selectionPadding,flipX:l?!t.flipX:!!t.flipX,flipY:u?!t.flipY:!!t.flipY},r)},Cr=(e,t,n)=>{let{isXinverted:r,isYinverted:i,settings:a,widthMultiplier:o,heightMultiplier:s}=n,c=R(e,t,n),l=(e.width===0||e.height===0?e.ratio??1:e.width)*o,u=(e.width===0||e.height===0?e.ratio??1:e.height)*s,d=z(n,c.x,c.y,l,u),f=(r||i)&&!(r&&i)&&(e.rotation??0)!==0&&n.rotation!==e.rotation;return pr({...e,width:l,height:u,x:d[0]-l/2,y:d[1]-u/2,flipX:r?!e.flipX:!!e.flipX,flipY:i?!e.flipY:!!e.flipY,rotation:f?-(e.rotation??0):e.rotation??0},a)},wr=[`Texte`],Tr=150,Er=(e,t)=>K(e,Rr,t),Dr=(e,t)=>{let n=Er(e,t),r=Ti(e);return{...e,path:r,computed:n}},Or=Dr,kr=e=>e.length||1,Ar=(e,t,n,r,i,a=_)=>(e.font=`${i?`italic`:``} ${r?`bold`:``} ${n}px ${a}`,Math.max(0,...t.map(t=>e.measureText(t).width))),jr=(e,t,n,r,i,a)=>{let o=n/Ar(e,t,1,r,i,a);return Number.isFinite(o)&&o!==0?o:36},Mr=[`fontFamily`,`fontBold`,`fontItalic`],Nr=e=>Mr.includes(e),Pr=(e,t)=>{let n=jr(e,t.value,t.width,t.style?.fontBold??!1,t.style?.fontItalic??!1,t.style?.fontFamily),r=n*kr(t.value);return{...t,fontSize:n,height:r,ratio:t.width/r}},Fr=(e,t)=>{if(t.width!==void 0&&t.height!==void 0&&t.fontSize!==void 0)return t;if(t.width!==void 0&&t.fontSize===void 0)return Pr(e,t);let{fontBold:n=!1,fontItalic:r=!1,fontFamily:i}=t.style??{},a=kr(t.value),o=t.fontSize??(t.height===void 0?36:t.height/a),s=t.width??Vr(e,t.value,o,n,r,i),c=t.height??o*a;return{...t,fontSize:o,width:s,height:c,ratio:s/c}},Ir=(e,t,n,r)=>{let i=jr(e,wr,Tr,t.settings?.fontBold.default??!1,t.settings?.fontItalic.default??!1,t.settings.fontFamily.default),a=Tr,o=i*wr.length;return Dr({toolId:t.id,type:t.type,id:E(t.type),x:n[0]-a,y:n[1]-o,value:wr,fontSize:i,width:a,height:o,ratio:a/o,style:{opacity:t.settings.opacity.default,strokeColor:t.settings.strokeColor.default,fontFamily:t.settings.fontFamily.default,fontItalic:t.settings.fontItalic.default,fontBold:t.settings.fontBold.default}},r)},Lr=(e,t)=>{if(e.globalAlpha!==0&&t.style?.strokeColor&&t.style.strokeColor!==`transparent`){e.scale(t.flipX?-1:1,t.flipY?-1:1),e.font=`${t.style?.fontItalic?`italic`:``} ${t.style?.fontBold?`bold`:``} ${t.fontSize}px ${t.style?.fontFamily??`serif`}`,e.textBaseline=`top`,e.fillStyle=t.style.strokeColor;for(let n=0;n<t.value.length;n++)e.fillText(t.value[n],t.flipX?-t.x-t.width:t.x,(t.flipY?-t.y-t.height:t.y)+n*t.fontSize,t.width)}},Rr=(e,t)=>G({x:e.x,y:e.y,width:e.width,height:e.height},t.selectionPadding),zr=(e,t,n,r,i,a)=>{let{borderX:o,borderHeight:s,borderY:c,borderWidth:l,isXinverted:u,isYinverted:d}=F(t,n,r,i,!0,a),f=Math.max(0,l-2*i.selectionPadding),p=Math.max(0,s-2*i.selectionPadding),m=Dr({...n,width:f,height:p,x:o+i.selectionPadding,y:c+i.selectionPadding,flipX:u?!n.flipX:!!n.flipX,flipY:d?!n.flipY:!!n.flipY},i);return{...m,fontSize:jr(e,m.value,m.width,m.style?.fontBold??!1,m.style?.fontItalic??!1,m.style?.fontFamily)}},Br=(e,t,n,r)=>{let{isXinverted:i,isYinverted:a,settings:o,widthMultiplier:s,heightMultiplier:c}=r,l=(i||a)&&!(i&&a)&&(t.rotation??0)!==0&&r.rotation!==t.rotation,u=R(t,n,r),d=(t.width===0||t.height===0?t.ratio??1:t.width)*s,f=(t.width===0||t.height===0?t.ratio??1:t.height)*c,p=z(r,u.x,u.y,d,f),m=Dr({...t,width:d,height:f,x:p[0]-d/2,y:p[1]-f/2,flipX:i?!t.flipX:!!t.flipX,flipY:a?!t.flipY:!!t.flipY,rotation:l?-(t.rotation??0):t.rotation??0},o);return{...m,fontSize:jr(e,m.value,m.width,m.style?.fontBold??!1,m.style?.fontItalic??!1,m.style?.fontFamily)}},Vr=(e,t,n,r,i,a)=>Ar(e,t,n,r,i,a)||20,Hr=(e,t,n,r)=>{let i={...t,value:n},a=Vr(e,i.value,i.fontSize,i.style?.fontBold??!1,i.style?.fontItalic??!1,i.style?.fontFamily),o=i.fontSize*kr(i.value),s=a/o,c={...i,width:a,height:o,ratio:s},{center:l}=Er(c,r),[u,d]=xa([1,1],t.computed.center,t),[f,p]=xa([1,1],l,c,[!1,!1]);return{...c,x:c.x-(f-u),y:c.y-(p-d)}},Ur=(e,t,n,r)=>{let i=[W(n[0],r),W(n[1],r)];switch(t.type){case`brush`:return Ft(t,i,r);case`line`:return Dn(t,i,r);case`polygon`:return Zt(t,i,r);case`curve`:return cn(t,i,r);case`rect`:case`square`:return va(t,i,r);case`text`:return Ir(e,t,i,r);case`ellipse`:return _n(t,i,r);case`circle`:return Gt(t,i,r)}},Wr=(e,t)=>{switch(t.type){case`brush`:It(e,t);break;case`text`:Lr(e,t);break;case`line`:kn(e,t);break;case`polygon`:Qt(e,t);break;case`curve`:un(e,t);break;case`circle`:Kt(e,t);break;case`ellipse`:vn(e,t);break;case`rect`:ya(e,t);break;case`square`:ya(e,t);break;case`picture`:xr(e,t)}},Gr=e=>e!==void 0&&e!==`transparent`,Kr=(e,t)=>{if(e.type===`picture`)return!1;if(e.type===`text`)return e.value.length>1;let n=e.style?.strokeColor!==`transparent`;return n&&(e.style?.lineWidth??2)*t<=1?!0:e.type===`line`?!!e.arrows?.length:e.type!==`brush`&&n&&Gr(e.style?.fillColor)},qr=/* @__PURE__ */ new WeakMap,Jr=(e,t)=>Math.min(t,Math.max(32,2**Math.ceil(Math.log2(e)))),Yr=(e,t,n)=>{let r=qr.get(n);(r?.width!==n.width||r.height!==n.height)&&(r={width:n.width,height:n.height,layers:/* @__PURE__ */ new Map},qr.set(n,r));let i=Jr(e,n.width),a=Jr(t,n.height),o=i*65536+a,s=r.layers.get(o);return s===void 0&&(s=Ie(),s&&(s.canvas.width=i,s.canvas.height=a,je(s)),r.layers.set(o,s)),s},Xr=e=>{if(e.type===`text`)return e.fontSize/4;let t=e.style?.lineWidth??2;return e.type===`line`?10+t*2:t/2},Zr=2,Qr=(e,t,n)=>{let{minX:r,minY:i,maxX:a,maxY:o}=Ze([Qe(n).map(([e,n])=>[t.a*e+t.c*n+t.e,t.b*e+t.d*n+t.f])]),s=Math.max(0,Math.floor(r)-Zr),c=Math.max(0,Math.floor(i)-Zr);return{x:s,y:c,width:Math.min(e.width,Math.ceil(a)+Zr)-s,height:Math.min(e.height,Math.ceil(o)+Zr)-c}},$r=(e,t)=>{let n=e.getTransform(),r=Qr(e.canvas,n,G(t.computed.outerBorders,Xr(t)));if(r.width<=0||r.height<=0)return;let i=Yr(r.width,r.height,e.canvas);i&&(i.setTransform(1,0,0,1,0,0),i.clearRect(0,0,r.width,r.height),i.setTransform(n.a,n.b,n.c,n.d,n.e-r.x,n.f-r.y),A(i,{...t.style,opacity:100}),Wr(i,t),e.save(),e.setTransform(1,0,0,1,0,0),e.drawImage(i.canvas,0,0,r.width,r.height,r.x,r.y,r.width,r.height),e.restore())},ei=(e,t,n)=>!!ra(e.computed.boundingBox,n??Tt(t)),ti=(e,t,n,r)=>{t.visible!==!1&&ei(t,n,r)&&(j(e,n,t.rotation,t.computed.center),A(e,t.style),e.globalAlpha<1&&Kr(t,n.canvasSize.scaleRatio)?$r(e,t):e.globalAlpha>0&&Wr(e,t),e.restore())},ni=(e,t,n)=>{if(e.locked)return e;let r=P({origin:n,point:e.computed.center,rotation:-t});if(`points`in e){if(e.type===`brush`){let n=e.points.map(t=>t.map(t=>[t[0]+r[0]-e.computed.center[0],t[1]+r[1]-e.computed.center[1]]));return{...e,points:n,rotation:(e.rotation??0)+t}}let i=e.points.map(e=>P({origin:n,point:e,rotation:-t}));return{...e,points:i}}return{...e,x:e.x+r[0]-e.computed.center[0],y:e.y+r[1]-e.computed.center[1],rotation:(e.rotation??0)+t}},ri=(e,t,n,r,i,a,o)=>{if(n.locked)return n;switch(n.type){case`line`:return An(t,n,r,i);case`polygon`:return en(t,n,r,i);case`curve`:return ln(t,n,r,i);case`brush`:return Lt(t,n,r,i,a,o);case`circle`:return qt(t,n,r,i,o);case`ellipse`:return yn(t,n,r,i,a,o);case`rect`:case`square`:return Sa(t,n,r,i,n.type===`square`||a,o);case`text`:return zr(e,t,n,r,i,o);case`picture`:return Sr(t,n,r,i,o);default:return n}},ii=e=>{let t=e.filter(e=>p.includes(e.type)),n=!t.some(e=>(e.rotation??0)!==(t[0]?.rotation??0)),r=(t[0]?.rotation??0)!==0&&t.length!==e.length,i=e.some(e=>m.includes(e.type));return!n||i||r},ai=(e,t,n,r)=>{if(t.locked)return t;let i=n;switch(t.type){case`rect`:case`square`:return Ca(t,i,r);case`picture`:return Cr(t,i,r);case`text`:return Br(e,t,i,r);case`ellipse`:return bn(t,i,r);case`circle`:return Jt(t,i,r);case`brush`:return Rt(t,i,r);case`line`:case`polygon`:case`curve`:return Mn(t,i,r);default:return t}},oi=(e,t,n,r,i,a,o)=>{if(n.type!==`group`)return k(n).map(n=>ri(e,t,n,r,i,a,o));let s=n,c=k(s),l=L(t,s,r,i,a||ii(c),o);return c.map(n=>n.type===`group`?ri(e,t,n,r,i,a,o):ai(e,n,s,l))},si=(e,t)=>{let{borders:n}=e.computed,r=t.selectionPadding;return{x:n.x+r,y:n.y+r,width:n.width-2*r,height:n.height-2*r}},ci=(e,t,n,r)=>{let i=Y(t,r);if(!i)return t;let a=si(i,r),{width:o,height:s}=n;if(ii(t)&&a.width>0&&a.height>0){let e=Math.min(o/a.width,s/a.height);o=a.width*e,s=a.height*e}let c=r.selectionPadding,l=Mt(i,{x:n.x-c,y:n.y-c,width:o+2*c,height:s+2*c},r);return t.map(t=>ai(e,t,i,l))},li=(e,t,n,r)=>{let i=Y(t,r);if(!i)return[];let a={...Mt(i,i.computed.borders,r,{isXinverted:n===`flipHorizontally`,isYinverted:n===`flipVertically`,rotation:0}),widthMultiplier:1,heightMultiplier:1,groupCenter:i.computed.center};return t.map(t=>ai(e,t,i,a))},ui=(e,t,n,r)=>{if(e.locked)return e;switch(e.type){case`rect`:case`square`:case`ellipse`:case`circle`:case`picture`:case`text`:return H({...e,x:e.x+t,y:e.y+n},r);case`line`:case`polygon`:case`curve`:return H({...e,points:e.points.map(([e,r])=>[e+t,r+n])},r);case`brush`:return H({...e,points:e.points.map(e=>e.map(([e,r])=>[e+t,r+n]))},r);default:return e}},di=(e,t,n,r,i)=>{let a=t.computed.borders,o=xi([e[0]-n[0],e[1]-n[1]],i),s=o[0]===0?0:W(a.x+r.selectionPadding+o[0],r)-(a.x+r.selectionPadding),c=o[1]===0?0:W(a.y+r.selectionPadding+o[1],r)-(a.y+r.selectionPadding);return k(t).map(e=>ui(e,s,c,r))},H=(e,t)=>{switch(e.type){case`rect`:case`square`:return _a(e,t);case`ellipse`:return gn(e,t);case`circle`:return Wt(e,t);case`picture`:return mr(e,t);case`text`:return Or(e,t);case`line`:return En(e,t);case`polygon`:return Xt(e,t);case`curve`:return sn(e,t);case`brush`:return Pt(e,t);default:return e}},fi=(e,t)=>(e?.type===`polygon`||e?.type===`curve`)&&t!==void 0&&t>=0&&t<e.points.length&&e.points.length>2,pi=(e,t,n,r)=>{let i=Object.keys(n).filter(e=>t.type===`text`||!Nr(e));if(!i.length)return t;let a={...t,style:{...t.style,...Object.fromEntries(i.map(e=>[e,n[e]]))}};return a.type===`text`&&i.some(Nr)?H(Pr(e,a),r):H(a,r)},mi=({ctx:e,shape:t,settings:n,selectionWidth:r,selectionColor:i,hoverMode:a,selectionMode:o,withAnchors:s=!0})=>{switch(n.debug&&ot(e,t,r,n),t.type){case`rect`:case`square`:case`circle`:case`ellipse`:case`picture`:case`text`:case`brush`:st(e,t,i,r,n,s);break;case`group`:mt(e,t,i,r,o,n,s);break;case`polygon`:case`line`:case`curve`:ht({ctx:e,shape:t,withAnchors:s,selectionWidth:r,selectionColor:i,hoverMode:a,settings:n})}e.restore()},hi=({ctx:e,selectionFrame:t,settings:n})=>{j(e,n),gt(e,t.frame,n),e.restore()},gi=e=>({...e,id:E(e.type),...e.data?{data:structuredClone(e.data)}:{}}),_i=(e,t)=>k(e).map(e=>gi(ui(e,20,20,t))),U=(e,t=2)=>{let n=10**t;return Math.round(e*n)/n},vi=(e,t,n,r=1,i=1)=>[t+(e[0]-t)*r,n+(e[1]-n)*i],yi=(e,t)=>{let n=e>=0?t:-t;return e+n/2-(e+n/2)%n},W=(e,t,n=0)=>t.gridGap?yi(e+n,t.gridGap)-n:U(e),bi=(e,t,n)=>!t.gridGap&&!n?U(e,3):yi(e,Math.PI/18),xi=(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,Si=(e,t,n,r,i,a,o)=>{if(r.mode===`translate`)return di(n,r.originalShape,r.cursorStartPosition,i,a);if(r.mode===`rotate`){let{originalShape:e,cursorStartPosition:t}=r,o=e.computed.center,[s,c]=o,l=bi(Math.atan2(c-n[1],s-n[0])-Math.atan2(c-t[1],s-t[0]),i,a);return k(e).map(e=>H(ni(e,l,o),i))}return r.mode===`resize`?oi(e,n,r.originalShape,r,i,a,o):r.mode===`brush`?k(t).map(e=>Bt(e,n,i)):k(t)},Ci=(e,t,n,r,i=!1)=>{if(!e||!t||!r||!n)return[300,300];let a=e/t;if(a>n/r){let t=i?n:Math.min(e,n);return[t,t/a]}let o=i?r:Math.min(t,r);return[o*a,o]},wi=({line:e,size:t,direction:n})=>{let r=Math.PI/2-nt({targetVector:[e.points[0],e.points[1]]}),i=[e.points[0][0]+(e.points[1][0]-e.points[0][0])/2,e.points[0][1]+(e.points[1][1]-e.points[0][1])/2],a;if([`start`,`both`].includes(n)){let n=P({point:e.points[0],origin:i,rotation:-r});a=P({point:[n[0],n[1]+t],origin:i,rotation:r})}else a=[...e.points[0]];let o;if([`end`,`both`].includes(n)){let n=P({point:e.points[1],origin:i,rotation:-r});o=P({point:[n[0],n[1]-t],origin:i,rotation:r})}else o=[...e.points[1]];return{points:[a,o]}},Ti=e=>{let t=new Path2D;return t.rect(e.x,e.y,e.width,e.height),t},Ei=e=>{let t=new Path2D;return t.arc(e.x,e.y,e.radius,0,2*Math.PI),t},Di=e=>{let t=new Path2D;return t.ellipse(e.x,e.y,e.radiusX,e.radiusY,0,0,2*Math.PI),t},Oi=e=>{let t=new Path2D;return t.moveTo(...e.points[0]),t.lineTo(...e.points[1]),t},ki=/* @__PURE__ */ new WeakMap,Ai=e=>ki.get(e)??Ze(e),ji=(e,t,n)=>{let r=[...e];r[t]=[...e[t]??[],n];let{minX:i,minY:a,maxX:o,maxY:s}=Ai(e);return ki.set(r,{minX:Math.min(i,n[0]),minY:Math.min(a,n[1]),maxX:Math.max(o,n[0]),maxY:Math.max(s,n[1])}),r},Mi=e=>(e.scaleX??1)===1&&(e.scaleY??1)===1,Ni=e=>e,Pi=e=>{if(Mi(e))return Ni;let{minX:t,minY:n}=Ai(e.points);return r=>vi(r,t,n,e.scaleX,e.scaleY)},Fi=(e,t,{brushAlgo:n})=>{if(!Mi(e)||n===`quadratic`||e.points[e.points.length-1].length<2)return;let r=new Path2D(e.path);return r.lineTo(...t),r},Ii=(e,{brushAlgo:t})=>{let n=new Path2D;if(e.points.length<1)return n;let r=Pi(e);for(let i of e.points)if(i.length){if(i.length===1)n.rect(...r(i[0]),1,1);else switch(n.moveTo(...r(i[0])),t){case`quadratic`:{let e=r(i[1]);for(let t=1;t<i.length-2;t++){let a=r(i[t+1]),o=(e[0]+a[0])/2,s=(e[1]+a[1])/2;n.quadraticCurveTo(...e,o,s),e=a}n.quadraticCurveTo(...r(i[i.length-2]),...r(i[i.length-1]));break}default:for(let e=1;e<i.length;e++)n.lineTo(...r(i[e]))}}return n},Li=(e,t,n,r)=>{let i=i=>(1-i)**3*e[0]+3*(1-i)**2*i*t[0]+3*(1-i)*i**2*n[0]+i**3*r[0],a=i=>(1-i)**3*e[1]+3*(1-i)**2*i*t[1]+3*(1-i)*i**2*n[1]+i**3*r[1],o=(e,t,n)=>{let r=e-2*t+n,i=-2*e+2*t,a=e;if(Math.abs(r)<1e-10){if(Math.abs(i)<1e-10)return[];let e=-a/i;return e>0&&e<1?[e]:[]}let o=i*i-4*r*a;if(o<0)return[];let s=Math.sqrt(o),c=(-i-s)/(2*r),l=(-i+s)/(2*r),u=[];return c>0&&c<1&&u.push(c),l>0&&l<1&&l!==c&&u.push(l),u},s=e[0],c=t[0],l=n[0],u=r[0],d=e[1],f=t[1],p=n[1],m=r[1],h=o(c-s,l-c,u-l),g=o(f-d,p-f,m-p),_=Math.min(e[0],r[0]),v=Math.max(e[0],r[0]),y=Math.min(e[1],r[1]),b=Math.max(e[1],r[1]);for(let e of h){let t=i(e);_=Math.min(_,t),v=Math.max(v,t)}for(let e of g){let t=a(e);y=Math.min(y,t),b=Math.max(b,t)}return{minX:_,maxX:v,minY:y,maxY:b}},Ri=(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]],zi=(e,t,n,r)=>({cp1:[t[0]+(n[0]-e[0])/6,t[1]+(n[1]-e[1])/6],cp2:[n[0]-(r[0]-t[0])/6,n[1]-(r[1]-t[1])/6]}),Bi=e=>{let t=new Path2D,n=e.tempPoint?[...e.points,e.tempPoint]:e.points;if(n.length<2)return t;if(n.length<3)return Vi(e);let r=e.style?.closedPoints===1&&n.length>2;t.moveTo(...n[0]);let i=Ri(e,n);for(let e=1;e<i.length-2;e++){let n=i[e-1],r=i[e],a=i[e+1],o=i[e+2],{cp1:s,cp2:c}=zi(n,r,a,o);t.bezierCurveTo(s[0],s[1],c[0],c[1],a[0],a[1])}return r&&t.closePath(),t},Vi=e=>{let t=new Path2D,n=e.tempPoint?[...e.points,e.tempPoint]:e.points;if(n.length<2)return t;t.moveTo(...n[0]);for(let e of n.slice(1))t.lineTo(...e);return n.length>2&&e.style?.closedPoints===1&&t.lineTo(...n[0]),t},Hi=e=>{let 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},G=(e,t)=>({x:e.x-t,y:e.y-t,width:e.width+t*2,height:e.height+t*2}),Ui=(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)}),Wi=(e,t,n=0)=>{if(n===0)return e;let{minX:r,minY:i,maxX:a,maxY:o}=Ze([Qe(e).map(e=>P({point:e,origin:t,rotation:n}))]);return{x:r,y:i,width:a-r,height:o-i}},K=(e,t,n,r=Ui)=>{let i=t(e,n),a=r(e,i,n),o=[i.x+i.width/2,i.y+i.height/2];return{borders:i,outerBorders:a,center:o,boundingBox:Wi(a,o,e.rotation)}},Gi=(e,t,n)=>{let{clientX:r,clientY:i}=e,a=t.getBoundingClientRect();return[(r-a.left)/n.scaleRatio,(i-a.top)/n.scaleRatio]},Ki=({clientX:e,clientY:t},{left:n,top:r,width:i,height:a},{canvasSize:o,canvasOffset:s})=>[(e-n)*(o.width/i)/o.scaleRatio-s[0],(t-r)*(o.height/a)/o.scaleRatio-s[1]],qi=(e,{left:t,top:n,width:r,height:i},{canvasSize:a,canvasOffset:o})=>({x:t+(e[0]+o[0])*a.scaleRatio*r/a.width,y:n+(e[1]+o[1])*a.scaleRatio*i/a.height}),Ji=(e,t,n)=>Ki(e,t.getBoundingClientRect(),n),q=e=>e.pointerType===`touch`,J=(e,t,[n,r])=>P({origin:[n,r],point:e,rotation:t}),Yi=(e,t,[n,r])=>P({origin:[n,r],point:e,rotation:-t}),Xi=(e,t,n)=>n?et(e,{x:t[0],y:t[1],radius:n}):Xe(e,t),Zi=(e,t,n,r=0)=>{let i=ze(n),a=([e,n])=>Xi({x:e-i,y:n-i,width:i*2,height:i*2},t,r);if(Re(e)){let t=e.points.findIndex(e=>a(e));return t>-1&&{mode:`resize`,anchor:t}}let{borders:o}=e.computed;if(a(Be(o,n)))return{mode:`rotate`};let s=f.find(e=>a(Ve(o,e)));return s?{mode:`resize`,anchor:s}:!1},Qi=(e,t,n,r,i=!1,a=0)=>{let o=k(t).length>1?t:k(t)[0];if(!o)return!1;let{borders:s,center:c}=o.computed,l=J(n,o.rotation??0,c);if(i){let e=Zi(o,l,r,a);if(e)return e}return Re(o)?(e.lineWidth=(o.style?.lineWidth??0)+15/r.canvasZoom,(ta(o,!0)?e.isPointInPath(o.path,l[0],l[1]):e.isPointInStroke(o.path,l[0],l[1]))?{mode:`translate`}:!1):Xi(s,l,(15+a)/r.canvasZoom)?{mode:`translate`}:!1},$i=(e,t,n,r,i=50)=>{if(t.locked||t.points.length<2)return!1;let{center:a}=t.computed,o=J(n,t.rotation??0,a);e.lineWidth=(t.style?.lineWidth??0)+i/r.canvasZoom;let s=t.style?.closedPoints?[...t.points,t.points[0]]:t.points;for(let t=0;t<s.length-1;t++){let n=Oi({points:[s[t],s[t+1]]});if(e.isPointInStroke(n,o[0],o[1]))return{lineIndex:t}}return!1},ea=(e,t,n,r,i=50)=>{if(t.locked||t.points.length<2)return!1;if(t.points.length<3)return $i(e,t,n,r,i);let{center:a}=t.computed,o=J(n,t.rotation??0,a);e.lineWidth=(t.style?.lineWidth??0)+i/r.canvasZoom;let s=Ri(t,t.points),c=new Path2D;c.moveTo(...s[0]);for(let t=1;t<s.length-2;t++){let n=s[t-1],r=s[t],i=s[t+1],a=s[t+2],{cp1:l,cp2:u}=zi(n,r,i,a);if(c.bezierCurveTo(l[0],l[1],u[0],u[1],i[0],i[1]),e.isPointInStroke(c,o[0],o[1]))return{lineIndex:t-1}}return!1},ta=(e,t=!1)=>t&&[`curve`,`polygon`].includes(e.type)?!0:e.style?.fillColor&&e.style?.fillColor!==`transparent`||[`picture`,`text`].includes(e.type),na=(e,t,n,r)=>{let{center:i}=t.computed,a=J(n,t.rotation??0,i);return e.lineWidth=(t.style?.lineWidth??0)+15/r.canvasZoom,(ta(t)?e.isPointInPath(t.path,a[0],a[1]):e.isPointInStroke(t.path,a[0],a[1]))?{mode:`translate`}:!1};function ra(e,t){let n=Math.max(e.x,t.x),r=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&&r<a)return{x:n,y:r,width:i-n,height:a-r}}var ia=({ctx:e,path:t,rect:n,offset:r,center:i,rotation:a=0,checkFill:o})=>{for(let s=0;s<r;s+=r/2)for(let c=0;c<r;c+=r/2)for(let l=s+n.x;l<n.x+n.width;l+=r)for(let s=c+n.y;s<n.y+n.height;s+=r){let n=J([l,s],a,i);if(o?e.isPointInPath(t,n[0],n[1]):e.isPointInStroke(t,n[0],n[1]))return!0}return!1},aa=10,oa=1,sa=(e,t)=>{switch(e.type){case`rect`:case`square`:{let n=G(e,-t);return e=>Xe(n,e)}case`circle`:case`ellipse`:{let n=Math.abs(e.type===`circle`?e.radius:e.radiusX),r=Math.abs(e.type===`circle`?e.radius:e.radiusY),i=1-t/Math.min(n,r);return i<=0?void 0:([t,a])=>((t-e.x)/n)**2+((a-e.y)/r)**2<i**2}default:return}},ca=(e,t,n)=>{let r=sa(e,n+oa);if(!r)return!1;let{center:i}=e.computed;return Qe(t).every(t=>r(J(t,e.rotation??0,i)))},la=(e,t,n)=>{let{borders:r,center:i,boundingBox:a}=t.computed,o=Math.min(n[0][0],n[1][0]),s=Math.max(n[0][0],n[1][0]),c=Math.min(n[0][1],n[1][1]),l=Math.max(n[0][1],n[1][1]),u={x:o,y:c,width:s-o,height:l-c},d=ra(a,u);if(!d)return!1;if(r.width<=1||r.height<=1||a.x>=o&&a.y>=c&&a.x+a.width<=s&&a.y+a.height<=l)return!0;let f=(t.style?.lineWidth??0)+aa;if(e.lineWidth=f,t.type===`brush`){let n=Pi(t);for(let r of t.points){if(r.length<1)break;if(r.length<2){let e=n(r[0]);if(et(d,{x:e[0],y:e[1],radius:(t.style?.lineWidth??1)/2}))return!0}for(let a=0;a<r.length-1;a++){let o=Yi(n(r[a]),t.rotation??0,i),s=Yi(n(r[a+1]),t.rotation??0,i),c=ra({x:Math.min(o[0],s[0]),y:Math.min(o[1],s[1]),width:Math.abs(o[0]-s[0]),height:Math.abs(o[1]-s[1])},u);if(c){let t=new Path2D;if(t.moveTo(...o),t.lineTo(...s),ia({ctx:e,path:t,rect:c,offset:aa,center:i,checkFill:!1}))return!0}}}return!1}let p=ta(t);return!p&&ca(t,d,f/2)?!1:ia({ctx:e,path:t.path,rect:d,offset:aa,center:i,rotation:t.rotation??0,checkFill:p})},ua=5,da=(e,t,n=ua)=>{let r=e.clientX-t.clientX,i=e.clientY-t.clientY;return r*r+i*i>n*n},fa=(e,t)=>!q(e)||da(e,t),pa=(e,t,n,r)=>t.visible!==!1&&Xe(t.computed.boundingBox,n)&&!!na(e,t,n,r),ma=(e,t,n,r)=>t.filter(t=>pa(e,t,n,r)),ha=(e,t,n,r)=>t.find(t=>pa(e,t,n,r)),ga=(e,t)=>{let n=Ti(e),r=K(e,ba,t);return{...e,path:n,computed:r}},_a=ga,va=(e,t,n,r=0,i=0)=>ga({toolId:e.id,type:e.type,id:E(e.type),x:t[0],y:t[1],width:r,height:i,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}},n),ya=(e,t)=>{M(e,t.path,t.style)},ba=(e,t)=>G(e,t.selectionPadding),xa=(e,t,n,[r,i]=[!1,!1])=>Yi([e[0]===.5?n.x+n.width/2:e[0]===0?n.x+(r?0:n.width):n.x+(r?n.width:0),e[1]===.5?n.y+n.height/2:e[1]===0?n.y+(i?0:n.height):n.y+(i?n.height:0)],n.rotation??0,t),Sa=(e,t,n,r,i=!1,a=!1)=>{let{borderX:o,borderHeight:s,borderY:c,borderWidth:l}=F(e,t,n,r,i,a);return ga({...t,width:Math.max(0,l-2*r.selectionPadding),height:Math.max(0,s-2*r.selectionPadding),x:o+r.selectionPadding,y:c+r.selectionPadding},r)},Ca=(e,t,n)=>{let{isXinverted:r,isYinverted:i,settings:a,widthMultiplier:o,heightMultiplier:s}=n,c=(r||i)&&!(r&&i)&&(e.rotation??0)!==0&&n.rotation!==e.rotation,l=R(e,t,n),u=(e.width||1)*o,d=(e.height||1)*s,f=z(n,l.x,l.y,u,d);return ga({...e,width:u,height:d,x:f[0]-u/2,y:f[1]-d/2,rotation:c?-(e.rotation??0):e.rotation??0},a)},wa=({mode:e})=>e==="default"||e===`contextMenu`||e===`textedition`,Ta=(e,t,n)=>{if(e.mode===`translate`)return{mode:`translate`,cursorStartPosition:n,originalShape:t,hasBeenDuplicated:!1,dateStart:Date.now(),selectedShapesLengthAtMouseDown:k(t).length};if(e.mode===`rotate`){let{center:e}=t.computed;return{mode:`rotate`,cursorStartPosition:n,originalShape:t,center:[e[0],e[1]],selectedShapesLengthAtMouseDown:k(t).length}}if(e.mode===`resize`)return{mode:`resize`,cursorStartPosition:n,originalShape:t,anchor:e.anchor,selectedShapesLengthAtMouseDown:k(t).length}},Ea=(e,t,n,r,i,a,o,s=`replace`,c=!0)=>{let l=a?20:void 0,u=!1;if(i){u=Qi(e,i,n,r,!0,l);let t=Ta(u||{mode:`default`},i,n);if(t?.mode===`resize`||t?.mode===`rotate`)return{shape:i,mode:t}}let d=new Set(k(i).map(e=>e.id)),f=t=>d.has(t.id)?u&&Qi(e,t,n,r,!0,l):na(e,t,n,r),p=c&&t.find(e=>d.has(e.id)&&f(e))||t.find(f)||(u?i:void 0),m=s===`toggle`?p&&d.has(p.id)?`remove`:`add`:s;if(i&&i?.id===p?.id)return{shape:i,mode:{mode:`translate`,cursorStartPosition:n,hasBeenDuplicated:!1,dateStart:Date.now(),originalShape:i,selectedShapesLengthAtMouseDown:k(i).length}};if(p?.locked&&m===`add`)return{shape:i,mode:{mode:o?`selectionFrame`:`default`}};if(p&&m===`add`&&i?.locked){let e=Y([p],r);return{shape:e,mode:{mode:`translate`,cursorStartPosition:n,hasBeenDuplicated:!1,dateStart:Date.now(),originalShape:e,selectedShapesLengthAtMouseDown:k(i).length}}}if(p){if(m===`add`){let e=Y(Oa(i,[p]),r);return{shape:e,mode:{mode:`translate`,cursorStartPosition:n,hasBeenDuplicated:!1,dateStart:Date.now(),originalShape:e,selectedShapesLengthAtMouseDown:k(i).length}}}if(m===`remove`){let e=Y(ka(i,[p]),r);return{shape:e,mode:{mode:`translate`,cursorStartPosition:n,hasBeenDuplicated:!1,dateStart:Date.now(),originalShape:e,selectedShapesLengthAtMouseDown:k(i).length}}}let e=d.has(p.id)?i:p;return{shape:e,mode:{mode:`translate`,cursorStartPosition:n,hasBeenDuplicated:!1,dateStart:Date.now(),originalShape:e,selectedShapesLengthAtMouseDown:k(i).length}}}return{shape:s===`replace`?void 0:i,mode:{mode:o?`selectionFrame`:`default`}}},Da=(e,t,n)=>{let{minX:r,minY:i,maxX:a,maxY:o}=Ze(e.map(e=>[[e.computed.borders.x+n.selectionPadding,e.computed.borders.y+n.selectionPadding],[e.computed.borders.x-n.selectionPadding+e.computed.borders.width,e.computed.borders.y+n.selectionPadding],[e.computed.borders.x-n.selectionPadding+e.computed.borders.width,e.computed.borders.y-n.selectionPadding+e.computed.borders.height],[e.computed.borders.x+n.selectionPadding,e.computed.borders.y-n.selectionPadding+e.computed.borders.height]].map(n=>{let r=P({point:[n[0],n[1]],origin:e.computed.center,rotation:-(e.rotation??0)});return P({point:[r[0],r[1]],origin:[0,0],rotation:t})}))),s=[(r+a)/2,(i+o)/2],c=P({point:s,origin:[0,0],rotation:-t}),l=[s[0]-c[0],s[1]-c[1]],u=U(r-l[0]),d=U(a-l[0]),f=U(i-l[1]),p=U(o-l[1]);return{width:d-u,height:p-f,x:u,y:f}},Y=(e,t)=>{if(!e.length)return;if(e.length===1)return e[0];let n=e.some(t=>t.rotation!==e[0].rotation)?0:e[0]?.rotation??0,r=Da(e,n,t),i=va({id:`group_selection`,type:`rect`,settings:T},[r.x,r.y],t,r.width,r.height),a=e.slice(1).reduce((e,t)=>{let n=t.style??{},r={};for(let t in n)e[t]!==void 0&&n[t]!==void 0&&e[t]===n[t]&&(r[t]=e[t]);return r},e[0].style??{});return{id:e.map(e=>e.id).join(`-`),type:`group`,shapes:e,rotation:n,visible:!0,locked:!1,x:i.x,y:i.y,width:i.width,height:i.height,style:a,computed:i.computed,path:i.path}},Oa=(e,t)=>{let n=k(e);return[.../* @__PURE__ */ new Set([...n,...t])]},ka=(e,t)=>{let n=new Set(t.map(e=>e.id));return k(e).filter(e=>!n.has(e.id))},X=e=>{let t,n;return(...r)=>(de(t,r)||(t=r,n=e(...r)),n)},Z=()=>{let e;return t=>((e===void 0||!de(e,t))&&(e=t),e)},Aa=(e,t)=>[y,b,...e].find(e=>e.id===t),ja=()=>{let e=X((e,t,n)=>({edition:e&&!t,zoom:n===`always`&&!t})),t=({config:t})=>e(t.mode!==`viewer`,t.disabled,t.options.canZoom),n=e=>{let{edition:n,zoom:r}=t(e);return n||r},r=X((e,t,n,r,i,a,o,s,c,l,u,d)=>({brushAlgo:e,isBrushShapeDoneOnMouseUp:t,debug:n,canvasSize:{realWidth:a.realWidth,realHeight:a.realHeight,width:a.width,height:a.height,scaleRatioWithNoZoom:a.scaleRatio,scaleRatio:a.scaleRatio*l},drawingSize:{width:o,height:s},size:r,canvasOffset:c,canvasZoom:l,gridGap:u,selectionPadding:i,features:d})),i=X(e=>{let{options:n,width:i,height:a}=e.config,{canvasSize:o,transformation:s,gridGap:c}=e.view;return r(n.brushAlgo,n.isBrushShapeDoneOnMouseUp,n.debug,n.size,n.canvasSelectionPadding,o,i,a,s.offset,s.zoom,c,t(e))}),a=X((e,t)=>Aa(e,t)??y),o=({tools:e})=>a(e.available,e.activeToolId),s=X(k),c=Z(),l=X(e=>c(e.map(e=>e.id))),u=X((e,t)=>t===void 0?void 0:e.find(e=>e.id===t)),d=({document:e,interaction:t})=>u(e.shapes,t.hoveredShapeId),f=({config:e})=>e.options.withContextMenu&&e.mode!==`viewer`&&!e.disabled,p=e=>e.config.options.withDropPicture&&t(e).edition&&e.tools.available.some(e=>e.type===`picture`),m=Z(),h=Z(),g=Z(),_=Z(),v=Z(),b=Z(),x=Z(),S=X((e,t)=>{if(!e||t.mode!==`contextMenu`)return;let n=k(t.originalShape),r=typeof t.anchor==`number`?t.anchor:void 0;return{shapes:n,anchorIndex:r,canRemoveAnchor:n.length===1&&fi(n[0],r),canvasPosition:t.cursorStartPosition,clientPosition:t.clientPosition}}),C=({interaction:e})=>e.hoverMode.mode==="default"||!wa(e.selectionMode)?void 0:e.hoverMode,ee=X(e=>{let{config:n,document:r,view:a,interaction:c}=e,{history:u}=r,{zoom:y,offset:ee}=a.transformation,w=f(e),T=s(r.selectedShape);return x({mode:n.mode,disabled:n.disabled,features:t(e),width:n.width,height:n.height,layout:m({size:n.options.size,resize:n.options.resize}),view:g({zoom:y,offset:ee,displayWidth:a.canvasSize.width,displayHeight:a.canvasSize.height,scaleRatio:a.canvasSize.scaleRatio*y,visibleArea:h(Tt(i(e)))}),options:n.options,gridGap:a.gridGap,shapes:r.shapes,selection:r.selectedShape,selectedShapes:T,selectedShapeIds:l(T),activeTool:o(e),tools:e.tools.available,history:_({canUndo:u.cursor>0,canRedo:u.cursor<u.states.length-1,canClear:r.shapes.length>0}),clipboard:v({hasContent:e.clipboard!==void 0}),withContextMenu:w,withDropPicture:p(e),interaction:b({mode:c.selectionMode.mode,hoveredShape:d(e),selectionHover:C(e),selectionFrame:c.selectionFrame?.frame,modifiers:c.modifiers,isPanning:c.panStart!==void 0,focus:c.focus}),contextMenu:S(w,c.selectionMode)})}),w=X((e,t,n)=>{if(e.mode!==`textedition`)return;let r=k(t)[0];return r?.type===`text`?{shape:r,defaultValue:e.defaultValue,settings:n}:void 0}),T=Z();return{selectFeatures:t,selectIsInteractive:n,selectSettings:i,selectActiveTool:o,selectSelectedShapes:s,selectHoveredShape:d,selectWithContextMenu:f,selectWithDropPicture:p,selectEditorState:ee,selectCanvasView:X(e=>{let{config:n,view:r,document:a,interaction:o}=e;return T({width:n.width,height:n.height,canvasSize:r.canvasSize,resize:n.options.resize,isEditMode:n.mode!==`viewer`,features:t(e),textEdition:w(o.selectionMode,a.selectedShape,i(e))})}),selectCursor:e=>{let{panStart:t,hoverMode:n,modifiers:r}=e.interaction,i=o(e);return t?`grabbing`:n.outOfView?`default`:n.mode===`resize`?`pointer`:i.type!==`selection`&&i.type!==`move`?`crosshair`:n.mode===`translate`?`move`:n.mode===`rotate`||i.type===`move`||r.space?`grab`:`default`}}},Ma=(e,t)=>{let{canvasSize:{width:n,height:r},gridGap:i,canvasOffset:a,canvasSize:{scaleRatio:o}}=t;if(!i)return;e.strokeStyle=`rgb(220,220,220)`,e.lineWidth=1,e.save(),e.scale(o,o),e.beginPath();let s=a[0]%i,c=a[1]%i,l=Math.ceil(n/o/i)+2,u=Math.ceil(r/o/i)+2;for(let t=-5;t<l;t++)e.moveTo(s+(t+1)*i,c-i),e.lineTo(s+(t+1)*i,c+r/o+i);for(let t=-5;t<u;t++)e.moveTo(s-i,c+(t+1)*i),e.lineTo(s+n/o+i,c+(t+1)*i);e.stroke(),e.restore()},Na=(e,t,n)=>{let r=k(t);if(!r.length)return e;let i=new Map(r.map(e=>[e.id,e])),a=[];for(let r of e)n&&r===t||a.push(i.get(r.id)??r);return a},Pa=(e,t,n)=>{je(e),kt(e,n),Ma(e,n);let r=Tt(n);for(let i=t.length-1;i>=0;i--)ti(e,t[i],n,r)},Fa=(e,t,n,r,i,a,o)=>{let{selectedShape:s}=t.document,{selectionMode:c,hoverMode:l,selectionFrame:u}=t.interaction;e.reset(),Ot(e,n),t.config.options.withSkeleton&&i&&!k(s).find(e=>e.id===i.id)&&r.type===`selection`&&wa(c)&&mi({ctx:e,shape:i,settings:n,selectionWidth:a,selectionColor:o,hoverMode:l,selectionMode:c,withAnchors:!1}),s&&r.type!==`brush`&&mi({ctx:e,shape:s,settings:n,selectionWidth:a,selectionColor:o,hoverMode:l,selectionMode:c,withAnchors:c.mode!==`textedition`}),u&&hi({ctx:e,selectionFrame:u,settings:n})},Ia=({store:e,drawCanvas:t,selectionCanvasRef:n,selectionColor:a,selectionWidth:s,canvasSize:c})=>{let l=o([]);r(()=>{let r=(t,n)=>{let r=0,i=()=>{cancelAnimationFrame(r),r=0,n(e.getState())},a=()=>{r||(r=requestAnimationFrame(i))};a();let o=e.watch(t,a,de);return{drawNow:i,stop:()=>{o(),cancelAnimationFrame(r)}}},i=Z(),o=X((e,t,n)=>i(Na(e,t,n))),c=e=>o(e.document.shapes,e.document.selectedShape,e.interaction.selectionMode.mode===`textedition`),u=r(t=>[c(t),e.getSettings(t)],n=>{let r=t?.getContext(`2d`);r&&Pa(r,c(n),e.getSettings(n))}),d=r(t=>[t.document.selectedShape,e.getSettings(t),t.interaction.selectionMode,e.selectors.selectHoveredShape(t),t.interaction.hoverMode,t.interaction.selectionFrame,e.selectors.selectActiveTool(t),t.config.options.withSkeleton],t=>{let r=n.current?.getContext(`2d`);r&&Fa(r,t,e.getSettings(t),e.selectors.selectActiveTool(t),e.selectors.selectHoveredShape(t),s,a)});return l.current=[u,d],()=>{u.stop(),d.stop()}},[e,t,n,a,s]),i(()=>{for(let e of l.current)e.drawNow()},[c.width,c.height])},La=()=>{let e,t,n=()=>{e=void 0,t=void 0};return{press:t=>{e=t.button===0?t:void 0},reset:n,release:r=>{let i=e;if(!i||i.pointerId!==r.pointerId||da(r,i)||r.timeStamp-i.timeStamp>=500){n();return}e=void 0;let a=!!t&&r.timeStamp-t.timeStamp<300&&!da(r,t,q(r)?20:void 0);return t=a?void 0:r,a?`doubleClick`:`click`}}},Ra=500,za=(e,t,n)=>{let r=e*n.canvasZoom,i=r<50?r-50:r>t-50?r-(t-50):0;return Math.ceil(he(i,-100,100)/5/n.canvasZoom)},Ba=(e,t,n)=>{let[r,i]=Gi(e,t,n.canvasSize),{width:a,height:o,scaleRatioWithNoZoom:s}=n.canvasSize;return[za(r,a/s,n),za(i,o/s,n)]},Va=(e,t)=>Xe(t.getBoundingClientRect(),[e.clientX,e.clientY]),Ha=(e,t)=>{r(()=>{if(!t)return;let n=null,r=La(),i=/* @__PURE__ */ new Set,a,o=()=>{let n=e.getState();return{state:n,settings:e.getSettings(n),activeTool:e.selectors.selectActiveTool(n),ctx:t.getContext(`2d`)}},s=n=>{let{state:r,settings:i,activeTool:a,ctx:s}=o();s&&e.batch(()=>{if(a.id!==y.id||!e.selectors.selectWithContextMenu(r)){e.setSelectedShape(void 0),e.setSelectionMode({mode:`default`}),e.setActiveTool(y),e.setSelectionFrame(void 0);return}let o=Ji(n,t,i),{shape:c,mode:l}=Ea(s,r.document.shapes,o,i,r.document.selectedShape,q(n),!1);e.showContextMenu({cursorStartPosition:o,clientPosition:{x:n.clientX,y:n.clientY},originalShape:c,anchor:`anchor`in l?l.anchor:void 0})})},c=r=>{if(a!==void 0&&r.pointerId!==a||(n&&fa(r,n.startPosition)&&clearTimeout(n.timeout),i.size>1||!e.selectors.selectIsInteractive(e.getState())))return;let{state:s,settings:c,ctx:l}=o();if(!l)return;let{selectionMode:u,panStart:d,modifiers:f}=s.interaction,{selectedShape:p}=s.document,m=Ji(r,t,c);if(u.mode===`selectionFrame`){e.batch(()=>{e.refreshSelectedShapes(l,m),e.setMoveAcceleration(Ba(r,t,c))});return}if(d!==void 0){e.actions.setOffset([m[0]+c.canvasOffset[0]-d.start[0],m[1]+c.canvasOffset[1]-d.start[1]]);return}if(u.mode===`preview`){let t=k(p)[0];if(t?.type===`curve`){e.setSelectedShape(Y([fn(t,m,c,!0)],c));return}if(t?.type===`polygon`){e.setSelectedShape(Y([nn(t,m,c,!0)],c));return}}let h=At(m,c),g=!wa(u);e.batch(()=>{if(!q(r)){let n=!g&&(a===void 0||Va(r,t));e.refreshHoveredShape(n,l,m,h)}if(p===void 0||p.locked)e.setHoverMode({mode:`default`,outOfView:!h});else{if(g)e.updateShapes(Si(l,p,m,u,c,f.shift,f.alt));else{if(!h){e.setHoverMode({mode:`default`});return}e.setHoverMode(Qi(l,p,m,c,!0)||{mode:`default`})}u.mode===`translate`&&f.alt&&!u.hasBeenDuplicated&&(e.setSelectionMode({...u,hasBeenDuplicated:!0}),e.duplicateShapes(k(u.originalShape)))}})},l=r=>{n&&clearTimeout(n.timeout);let{state:i,settings:a,ctx:c}=o();if(!c)return;if(r.button===2){s(r);return}if(i.interaction.panStart){e.setPanStart(void 0);return}let{selectionMode:l}=i.interaction;if(l.mode===`contextMenu`||l.mode===`textedition`||l.mode===`preview`)return;let u=Ji(r,t,a);if(l.mode===`translate`&&Date.now()-l.dateStart<=500&&u[0]===l.cursorStartPosition[0]&&u[1]===l.cursorStartPosition[1]){let t=r.ctrlKey||r.shiftKey||r.metaKey,{shape:n}=Ea(c,i.document.shapes,u,a,i.document.selectedShape,q(r),i.config.options.withFrameSelection,t?`toggle`:`replace`,!1),o=t&&k(n).length===l.selectedShapesLengthAtMouseDown;e.batch(()=>{o||e.setSelectedShape(n),e.setSelectionMode({mode:`default`}),e.setSelectionFrame(void 0),e.actions.saveShapes()})}else l.mode!=="default"&&e.batch(()=>{l.mode===`brush`&&a.isBrushShapeDoneOnMouseUp&&e.setSelectedShape(void 0),e.setSelectionMode({mode:`default`}),e.setSelectionFrame(void 0),e.actions.saveShapes()})},u=c=>{let{state:l,settings:u,activeTool:d,ctx:f}=o(),{features:p}=u;if(!e.selectors.selectIsInteractive(l))return;if(c.preventDefault(),i.add(c.pointerId),i.size>1){n&&clearTimeout(n.timeout),r.reset();return}a=c.pointerId,r.press(c);try{t.setPointerCapture(c.pointerId)}catch{}if(t.focus(),!f)return;let{selectedShape:m,shapes:g}=l.document,{selectionMode:_}=l.interaction,v=Ji(c,t,u),b=c.button===1,x=c.button===2;if(b||l.interaction.modifiers.space||d.type===`move`&&!x)e.setPanStart({start:v,originalOffset:u.canvasOffset});else if(p.edition){if(!At(v,u))e.batch(()=>{e.setSelectedShape(void 0),e.setSelectionMode({mode:`default`})});else if(x){if(d.type===`selection`){let{shape:t}=Ea(f,g,v,u,m,q(c),!1);e.batch(()=>{e.setSelectedShape(t),e.setSelectionMode({mode:`default`})})}}else if(q(c)&&(n&&clearTimeout(n.timeout),n={timeout:setTimeout(()=>s(c),Ra),startPosition:{clientX:c.clientX,clientY:c.clientY}}),d.type===`selection`){let t=c.ctrlKey||c.shiftKey||c.metaKey?`add`:`replace`,{withFrameSelection:n}=l.config.options,{shape:r,mode:i}=Ea(f,g,v,u,m,q(c),n,t);e.batch(()=>{e.setSelectedShape(r),e.setSelectionMode(i),i.mode===`selectionFrame`&&e.setSelectionFrame({oldSelection:r,frame:[[v[0],v[1]],[v[0],v[1]]]})})}else if(h.some(e=>e===d.type)){let t=k(m)[0];if(d.type===`brush`)e.batch(()=>{if(t?.type===`brush`)e.updateShapes([Vt(t,v,u)]);else{let t=Ur(f,d,v,u);if(!t)return;e.addShapes([t]),e.setSelectedShape(Y([t],u))}e.setSelectionMode({mode:`brush`})});else if(_.mode===`preview`&&(t?.type===`polygon`||t?.type===`curve`)){let n=t.type===`polygon`?nn(t,v,u):fn(t,v,u);e.batch(()=>{e.setSelectedShape(Y([n],u)),e.updateShapes([n],!0)})}else if(d.type!==`picture`){let t=Ur(f,d,v,u);if(!t)return;let n=Y([t],u);e.batch(()=>{e.addShapes([t]),e.setSelectedShape(n),t.type===`polygon`||t.type===`curve`?e.setSelectionMode({mode:`preview`}):(e.setActiveTool(y),e.setSelectionMode({mode:`resize`,cursorStartPosition:[v[0]+u.selectionPadding,v[1]+u.selectionPadding],originalShape:n,anchor:t.type===`line`?0:[1,1],selectedShapesLengthAtMouseDown:k(n).length}))})}}}},d=n=>{let{state:r,settings:i,activeTool:a,ctx:s}=o();if(a.type!==`selection`||!s)return;let{selectedShape:c}=r.document,l=k(c);if(l.length!==1)return;let u=l[0];if(u?.locked)return;let d=Ji(n,t,i);if(At(d,i)){if(u?.type===`text`)Qi(s,c,d,i)&&e.setSelectionMode({mode:`textedition`,defaultValue:u.value});else if(u?.type===`polygon`){let t=$i(s,u,d,i);t&&e.updateShapes([tn(u,t.lineIndex,d,i)])}else if(u?.type===`curve`){let t=ea(s,u,d,i);t&&e.updateShapes([dn(u,t.lineIndex,d,i)])}}},f=e=>{if(i.delete(e.pointerId),e.pointerId!==a)return;a=void 0;let n=e.type===`pointerup`&&e.button===0&&Va(e,t);l(e),n?r.release(e)===`doubleClick`&&d(e):r.reset()},p=()=>{a===void 0&&e.clearHover()};return t.addEventListener(`pointerdown`,u,{passive:!1}),t.addEventListener(`pointermove`,c),t.addEventListener(`pointerup`,f),t.addEventListener(`pointercancel`,f),t.addEventListener(`lostpointercapture`,f),t.addEventListener(`pointerleave`,p),()=>{n&&clearTimeout(n.timeout),t.removeEventListener(`pointerdown`,u),t.removeEventListener(`pointermove`,c),t.removeEventListener(`pointerup`,f),t.removeEventListener(`pointercancel`,f),t.removeEventListener(`lostpointercapture`,f),t.removeEventListener(`pointerleave`,p)}},[e,t])},Ua=e=>e.dataTransfer?.types.includes(`Files`)??!1,Wa=(e,t)=>{r(()=>{if(!t)return;let n=t=>Ua(t)&&e.selectors.selectWithDropPicture(e.getState()),r=e=>{e.dataTransfer&&n(e)&&(e.preventDefault(),e.dataTransfer.dropEffect=`copy`)},i=async r=>{if(!n(r))return;r.preventDefault();let i=Array.from(r.dataTransfer?.files??[]),a=i.filter(e=>Je.includes(e.type));for(let t of i)a.includes(t)||e.emit(`pictureDropFailed`,t,/* @__PURE__ */ Error(`Unsupported file type: ${t.type||t.name}`));let[o,s]=Ji(r,t,e.getSettings());for(let[t,n]of a.entries())try{await e.actions.addPicture(n,{position:[o+t*20,s+t*20]})}catch(t){console.warn(t),e.emit(`pictureDropFailed`,n,t)}};return t.addEventListener(`dragover`,r),t.addEventListener(`drop`,i),()=>{t.removeEventListener(`dragover`,r),t.removeEventListener(`drop`,i)}},[e,t])},Ga=[`shapeClicked`,`canvasClicked`,`canvasDoubleClicked`],Ka=(e,t)=>{r(()=>{if(!t)return;let n=La(),r,i=n=>({canvasPosition:Ji(n,t,e.getSettings()),clientPosition:{x:n.clientX,y:n.clientY},originalEvent:n}),a=t=>At(t.canvasPosition,e.getSettings()),o=t=>a(t)?e.getShapeAt(t.canvasPosition):void 0,s=()=>e.hasListeners(`shapeClicked`)&&!e.selectors.selectFeatures(e.getState()).edition,c=(n,i,a)=>{t.style.cursor=n&&a?`pointer`:``,n?.id!==r&&(r=n?.id,e.emit(`shapeHovered`,n,i))},l=e=>{(r!==void 0||t.style.cursor)&&c(void 0,i(e),!1)},u={pointerdown:n.press,pointerup:t=>{let r=n.release(t);if(!r||!Ga.some(t=>e.hasListeners(t)))return;let o=i(t);if(!a(o)){n.reset();return}let s=e.getShapeAt(o.canvasPosition);s&&e.emit(`shapeClicked`,s,o),e.emit(`canvasClicked`,s,o),r===`doubleClick`&&e.emit(`canvasDoubleClicked`,s,o)},pointermove:t=>{let n=s();if(!n&&!e.hasListeners(`shapeHovered`)){l(t);return}let r=i(t);c(o(r),r,n)},pointerleave:l};for(let[e,n]of Object.entries(u))t.addEventListener(e,n);return()=>{for(let[e,n]of Object.entries(u))t.removeEventListener(e,n);t.style.cursor=``}},[e,t])},qa=(e,t)=>Math.abs(e-t.startDiff)>30,Ja=(e,t)=>Math.abs(rt(e,t.startCenter))>10,Ya=e=>{let t=[e[0].clientX,e[0].clientY],n=[e[1].clientX,e[1].clientY];return{diff:rt(t,n),center:it(t,n)}},Xa=({canvasBoundingRect:e,startDiff:t,startZoom:n,startCenter:r,startOffset:i,currentDiff:a,currentCenter:o,isMoving:s,isZooming:c,...l})=>{let{canvasSize:u}=l,d=c?vt(a/t*n):n,f=s?[i[0]+(o[0]-r[0])*(u.width/e.width)/u.scaleRatio/n,i[1]+(o[1]-r[1])*(u.height/e.height)/u.scaleRatio/n]:[i[0],i[1]],p=[(o[0]-e.left)/u.scaleRatio,(o[1]-e.top)/u.scaleRatio];return xt({...l,currentOffset:f,currentZoom:n,zoom:d,centerPoint:p})},Za=[`pointerup`,`pointerout`,`pointercancel`,`pointerleave`],Qa=({store:e,canvasElt:t})=>{r(()=>{if(!t)return;let n=[],r,i=i=>{let a=n.findIndex(e=>e.pointerId===i.pointerId);if(a>-1&&(n[a]=i),n.length!==2||!r)return;let{diff:o,center:s}=Ya(n),c=r.isZooming||qa(o,r),l=r.isMoving||c||Ja(s,r);r={...r,isMoving:l,isZooming:c},o&&r.startDiff&&e.setTransformation(Xa({...r,...e.getViewBounds(),canvasBoundingRect:t.getBoundingClientRect(),currentDiff:o,currentCenter:s}))},a=e=>{if(e){document.addEventListener(`pointermove`,i);for(let e of Za)document.addEventListener(e,s)}else{document.removeEventListener(`pointermove`,i);for(let e of Za)document.removeEventListener(e,s)}},o=t=>{if(n=[...n,t],n.length===1&&a(!0),n.length===2){t.stopPropagation();let{diff:i,center:a}=Ya(n),{transformation:o}=e.getState().view;r={startDiff:i,startCenter:a,startZoom:o.zoom,startOffset:o.offset,isMoving:!1,isZooming:!1}}},s=e=>{n=n.filter(t=>t.pointerId!==e.pointerId),n.length||a(!1)};return t.addEventListener(`pointerdown`,o),()=>{t.removeEventListener(`pointerdown`,o),a(!1)}},[t,e])},$a=({store:e,zoomEnabled:t,canvasElt:n})=>{let i=o(0);Qa({store:e,canvasElt:n}),r(()=>{if(!t||!n)return;let r=t=>{let r=t.ctrlKey,{deltaX:a,deltaY:o}=jt(t,t.timeStamp-i.current);if(i.current=t.timeStamp,r){t.preventDefault();let r=Gi(t,n,e.getState().view.canvasSize);e.zoomBy(o,r);return}let s=t.shiftKey;e.scrollBy(s?[o,a]:[a,o])&&t.preventDefault()};return n.addEventListener(`wheel`,r,{passive:!1}),()=>{n.removeEventListener(`wheel`,r)}},[n,t,e])},eo=[`id`,`type`,`rotation`,`toolId`,`visible`,`locked`,`style`,`data`],to={rect:[`x`,`y`,`width`,`height`],square:[`x`,`y`,`width`,`height`],picture:[`x`,`y`,`width`,`height`,`src`,`flipX`,`flipY`,`ratio`],text:[`x`,`y`,`width`,`height`,`value`,`fontSize`,`flipX`,`flipY`,`ratio`],circle:[`x`,`y`,`radius`],ellipse:[`x`,`y`,`radiusX`,`radiusY`],line:[`points`],polygon:[`points`],curve:[`points`],brush:[`points`,`scaleX`,`scaleY`]},no=Object.keys(to),ro=e=>no.includes(e),io=e=>typeof e==`number`&&Number.isFinite(e),ao=e=>Array.isArray(e)&&e.length===2&&io(e[0])&&io(e[1]),oo=(e,t)=>Array.isArray(e)&&e.length>=t&&e.every(ao),so=(e,t)=>{let n=Object.keys(e).find(e=>!eo.includes(e)&&!to[t].includes(e));return n===void 0?void 0:`unknown field "${n}" for a ${t}`},co=e=>{if(e.rotation!==void 0&&!io(e.rotation))return`"rotation" must be a finite number`;if(e.style!==void 0&&!O(e.style))return`"style" must be an object`;if(e.data!==void 0&&!O(e.data))return`"data" must be an object`;if(e.visible!==void 0&&typeof e.visible!=`boolean`)return`"visible" must be a boolean`;if(e.locked!==void 0&&typeof e.locked!=`boolean`)return`"locked" must be a boolean`},lo=(e,t)=>{let n=(...t)=>t.find(t=>!io(e[t]));switch(t){case`rect`:case`square`:case`picture`:{let r=n(`x`,`y`,`width`,`height`);return r?`"${r}" must be a finite number`:t===`picture`&&(typeof e.src!=`string`||!e.src)?`"src" must be a non empty string`:void 0}case`text`:{let t=n(`x`,`y`)??[`width`,`height`,`fontSize`].find(t=>e[t]!==void 0&&!io(e[t]));if(t)return`"${t}" must be a finite number`;let{value:r}=e;return!Array.isArray(r)||!r.length||r.some(e=>typeof e!=`string`)?`"value" must be a non empty array of strings`:void 0}case`circle`:{let e=n(`x`,`y`,`radius`);return e&&`"${e}" must be a finite number`}case`ellipse`:{let e=n(`x`,`y`,`radiusX`,`radiusY`);return e&&`"${e}" must be a finite number`}case`line`:return oo(e.points,2)&&e.points.length===2?void 0:`"points" must hold exactly 2 points`;case`polygon`:case`curve`:return oo(e.points,2)?void 0:`"points" must hold at least 2 points`;case`brush`:return Array.isArray(e.points)&&e.points.length>0&&e.points.every(e=>oo(e,1))?void 0:`"points" must be a non empty array of non empty point lists`}},uo=e=>{if(!O(e))return`a shape must be an object`;let{type:t}=e;return ro(t)?e.id!==void 0&&(typeof e.id!=`string`||!e.id)?`"id" must be a non empty string`:so(e,t)??co(e)??lo(e,t):`unknown shape type "${String(t)}"`},fo=(e,t)=>{e.forEach((e,n)=>{let r=uo(e);if(r)throw Error(`react-paint ${t}: invalid shape at index ${n}, ${r}`)})},po=(e,{ctx:t,settings:n,tools:r,usedIds:i,completeStyle:a})=>{let o=typeof e.id==`string`&&e.id&&!i.has(e.id)?e.id:E(e.type);i.add(o);let s=a?{...ke(Oe(r,e)),...e.style}:e.style,c={...e,id:o,...s?{style:s}:{}};switch(c.type){case`text`:return H(Fr(t,c),n);case`picture`:return H({...c,img:new Image},n);default:return H(c,n)}},mo=async(e,{resolvePictureSrc:t,...n})=>{if(!e)return{shapes:[],failedPictures:[]};let r=_e(e.map(e=>e&&ro(e.type)?po(e,{...n,completeStyle:!1}):null)),i=r.filter(e=>e.type===`picture`),a=await Promise.allSettled(i.map(e=>ir(e.img,e.src,t))),o=[];a.forEach((e,t)=>{if(e.status===`fulfilled`)return;let n=i[t];o.push({shape:n,error:e.reason}),console.warn(`react-paint: the picture ${n.id} is left out, it could not be loaded`,e.reason)});let s=new Set(o.map(({shape:e})=>e));return{shapes:r.filter(e=>!s.has(e)),failedPictures:o}},ho=(e,t)=>{if(!e)return;let{type:n}=e;return ro(n)?t.type!==void 0&&t.type!==n?`the type of a shape cannot change`:so(t,n)??co(t)??lo({...e,...t},n):`a ${n} cannot be updated`},go=(e,t)=>{e.forEach((e,n)=>{let r=O(e)&&typeof e.id==`string`?ho(t.get(e.id),e):`"id" must be a string`;if(r)throw Error(`react-paint updateShapes: invalid patch at index ${n}, ${r}`)})},_o=(e,t,n,r)=>{let{id:i,type:a,...o}=n,s=o.style?{...t.style,...o.style}:t.style,c={...t,...o,style:s};if(c.type===`square`&&(`width`in o||`height`in o)){let e=`width`in o?c.width:c.height;return H({...c,width:e,height:e},r)}if(c.type===`text`){let t=`value`in o||`fontSize`in o||`height`in o,n=Object.keys(o.style??{}).some(e=>Nr(e));if(`width`in o||n&&!t)return H(Pr(e,c),r);if(t){let t=`fontSize`in o?c.fontSize:`height`in o?c.height/kr(c.value):c.fontSize;return H(Hr(e,{...c,fontSize:t,computed:Er(c,r)},c.value,r),r)}}return H(c,r)},vo={position:`absolute`,outline:`none`,left:0,top:0,transformOrigin:`left top`,boxSizing:`border-box`,lineHeight:1,width:`max-content`,background:`none`},yo=e=>e.childNodes.length?Array.from(e.childNodes).map(e=>yo(e)).join(``):e.nodeValue??``,bo=({disabled:e=!1,shape:t,defaultValue:n,updateValue:i,saveShapes:s,settings:c})=>{let u=o(null),d=o(s),f=e=>{i(Array.from(e.target.childNodes).map(e=>yo(e)))};r(()=>{if(!u.current)return;let e=u.current,t=t=>{t.preventDefault();let n=t.clipboardData?.getData(`text/plain`);if(!n)return;let r=window.getSelection();if(!r||r.rangeCount===0)return;r.deleteFromDocument();let i=r.getRangeAt(0);i.insertNode(document.createTextNode(n)),i.collapse(!1),r.removeAllRanges(),r.addRange(i),e.dispatchEvent(new Event(`input`,{bubbles:!0}))};e.addEventListener(`paste`,t),e.innerText=``;for(let t of n){let n=document.createElement(`div`);t===``?n.innerHTML=`<br/>`:n.innerText=t,e.appendChild(n)}return e.focus(),()=>{e.removeEventListener(`paste`,t)}},[n]),r(()=>{let e=d.current;return()=>{e()}},[]);let p=a(()=>{let{borders:e,center:n}=t.computed;return P({point:[e.x,e.y],rotation:-(t.rotation??0),origin:n})},[t]),m=[`translate3D(${(p[0]+c.canvasOffset[0])*c.canvasSize.scaleRatio}px, ${(p[1]+c.canvasOffset[1])*c.canvasSize.scaleRatio}px, 0)`,`rotate(${Ye(t.rotation??0)}deg)`,t.flipX||t.flipY?`scale(${t.flipX?-1:1}, ${t.flipY?-1:1})`:void 0,t.flipX||t.flipY?`translate3D(${t.flipX?-100:0}%,${t.flipY?-100:0}%,0)`:void 0].filter(Boolean).join(` `),h=!e;return/* @__PURE__ */ l(`div`,{className:`react-paint-canvas-edittextbox`,ref:u,"aria-label":`Text content`,contentEditable:h,role:`textbox`,tabIndex:h?0:void 0,onInput:f,style:{...vo,transform:D(`--react-paint-canvas-edittextbox-transform`,m),fontSize:D(`--react-paint-canvas-edittextbox-fontsize`,`${t.fontSize*c.canvasSize.scaleRatio}px`),padding:D(`--react-paint-canvas-edittextbox-padding`,`${c.selectionPadding*c.canvasSize.scaleRatio}px`),color:D(`--react-paint-canvas-edittextbox-color`,t.style?.strokeColor),opacity:D(`--react-paint-canvas-edittextbox-opacity`,(t.style?.opacity??100)/100),fontFamily:D(`--react-paint-canvas-edittextbox-fontfamily`,t.style?.fontFamily??`serif`),fontWeight:t.style?.fontBold?`bold`:void 0,fontStyle:t.style?.fontItalic?`italic`:void 0}})},xo={flex:1,display:`flex`,alignItems:`center`,justifyContent:`center`},So={position:`relative`,backgroundSize:`16px`,overflow:`hidden`,display:`grid`},Co={userSelect:`none`,touchAction:`none`},wo={box:xo,container:{...So,width:`100%`,height:`100%`},canvas:{...Co,position:`relative`,width:`100%`,gridArea:`1 / 1`}},To={box:{position:`absolute`,inset:0},container:{...So,position:`absolute`,inset:0},canvas:{...Co,position:`absolute`,left:0,top:0}},Eo=({store:e,view:n,backgroundColor:i,selectionColor:a,selectionWidth:c})=>{let{canvasSize:d,resize:f,isEditMode:p,features:m,textEdition:h}=n,g=o(null),_=o(null),v=p,y=p?0:-1,b=f===`extend`?To:wo,[x,S]=s(null),C=t(t=>{e.setCanvasElement(t),S(t)},[e]);Ha(e,x),Ka(e,x),Wa(e,x),$a({store:e,canvasElt:x,zoomEnabled:m.zoom}),Ia({store:e,drawCanvas:x,selectionCanvasRef:_,selectionColor:a,selectionWidth:c,canvasSize:d}),r(()=>{let t=g.current;if(!t)return;let n=e=>{t.style.cursor=D(`--react-paint-canvas-cursor`,e)};return n(e.selectors.selectCursor(e.getState())),e.watch(e.selectors.selectCursor,n)},[e]);let ee=t(t=>{let n=e.getState(),r=k(n.document.selectedShape)[0];if(r?.type!==`text`)return;let i=x?.getContext(`2d`);i&&e.updateShapes([_o(i,r,{id:r.id,value:t},e.getSettings(n))])},[e,x]),w=e=>{if(p)return e.preventDefault(),e.stopPropagation(),!1};return/* @__PURE__ */ l(`div`,{className:`react-paint-canvas-box`,style:b.box,children:/* @__PURE__ */ u(`div`,{className:`react-paint-canvas-container`,ref:g,style:{...b.container,backgroundColor:D(`--react-paint-app-canvas-bg`,i)},children:[/* @__PURE__ */ l(`canvas`,{className:se,ref:C,style:b.canvas,"data-testid":`draw-canvas`,width:d.width,height:d.height,onContextMenu:w,tabIndex:y}),v&&/* @__PURE__ */ l(`canvas`,{className:`react-paint-canvas-selectioncanvas`,ref:_,style:{...b.canvas,pointerEvents:`none`},width:d.width,height:d.height,onContextMenu:w}),p&&h&&/* @__PURE__ */ l(bo,{disabled:!m.edition,shape:h.shape,defaultValue:h.defaultValue,updateValue:ee,saveShapes:e.actions.saveShapes,settings:h.settings})]})})},Do=20,Oo=e=>{r(()=>{let t=0,n=0,r=i=>{let a=Math.min(Math.max(i-n,0),100);e.applyMoveAcceleration(a/Do),n=i,t=requestAnimationFrame(r)},i=e=>{cancelAnimationFrame(t),t=0,e&&(n=performance.now(),t=requestAnimationFrame(r))},a=e=>{let[t,n]=e.interaction.moveAcceleration;return t!==0||n!==0};i(a(e.getState()));let o=e.watch(a,i);return()=>{o(),cancelAnimationFrame(t)}},[e])},Q={ArrowUp:`ArrowUp`,ArrowDown:`ArrowDown`,ArrowLeft:`ArrowLeft`,ArrowRight:`ArrowRight`,Delete:`Delete`,Backspace:`Backspace`,Escape:`Escape`,Shift:`Shift`,Alt:`Alt`,Option:`Option`,Space:` `,A:`A`,a:`a`,z:`z`,Z:`Z`,y:`y`,Y:`Y`,Plus:`+`,Minus:`-`,Zero:`0`},ko={Cut:`cut`,Copy:`copy`,Paste:`paste`},Ao=e=>{r(()=>{let t=()=>e.selectors.selectIsInteractive(e.getState()),n=()=>e.getState().interaction.selectionMode.mode===`textedition`,r=()=>e.getState().document.selectedShape!==void 0,i=/* @__PURE__ */ new Set,a=i=>{t()&&r()&&!n()&&(i.preventDefault(),e.actions.copy())},o=i=>{t()&&r()&&!n()&&(i.preventDefault(),e.actions.cut())},s=r=>{t()&&e.getState().clipboard!==void 0&&!n()&&(r.preventDefault(),e.actions.paste())};return e.listenScope({keydown:r=>{if(!t())return;if(r.metaKey||r.ctrlKey){if(r.key===Q.Z||r.key===Q.z){r.preventDefault(),r.stopPropagation(),r.shiftKey?e.actions.redo():e.actions.undo();return}if(!ge()&&(r.key===Q.Y||r.key===Q.y)){r.preventDefault(),r.stopPropagation(),e.actions.redo();return}if(r.key===Q.A||r.key===Q.a){r.preventDefault(),r.stopPropagation(),e.actions.selectAllShapes();return}if(r.key===Q.Plus){r.preventDefault(),r.stopPropagation(),e.actions.setZoom(`zoom`);return}if(r.key===Q.Minus){r.preventDefault(),r.stopPropagation(),e.actions.setZoom(`unzoom`);return}if(r.key===Q.Zero){r.preventDefault(),r.stopPropagation(),e.actions.resetZoom();return}}if(r.key===Q.Shift){r.preventDefault(),r.stopPropagation(),e.setModifiers({shift:!0});return}if(r.key===Q.Space&&e.getState().interaction.focus.canvas){r.preventDefault(),r.stopPropagation(),e.setModifiers({space:!0});return}if(r.key===Q.Alt||r.key===Q.Option){r.preventDefault(),r.stopPropagation(),e.setModifiers({alt:!0});return}let{selectedShape:a}=e.getState().document;if(!a)return;if(r.key===Q.Escape){e.batch(()=>{e.setSelectedShape(void 0),e.setActiveTool(y),e.setSelectionMode({mode:`default`}),e.setSelectionFrame(void 0)});return}if(n())return;let{gridGap:o}=e.getSettings(),s={[Q.ArrowLeft]:[o?-o:-1,0],[Q.ArrowRight]:[o||1,0],[Q.ArrowDown]:[0,o||1],[Q.ArrowUp]:[0,o?-o:-1]};switch(r.key){case Q.ArrowLeft:case Q.ArrowRight:case Q.ArrowDown:case Q.ArrowUp:r.preventDefault(),r.stopPropagation(),i.add(r.key),e.updateShapes(di(s[r.key],a,[0,0],e.getSettings(),!0));break;case Q.Delete:case Q.Backspace:r.preventDefault(),r.stopPropagation(),e.removeShapes(k(a))}},keyup:n=>{if(i.delete(n.key)&&!i.size&&e.actions.saveShapes(),t())switch(n.key){case Q.Shift:e.setModifiers({shift:!1});break;case Q.Alt:case Q.Option:e.setModifiers({alt:!1});break;case Q.Space:e.setModifiers({space:!1})}},focusout:t=>{!i.size||t.relatedTarget&&t.currentTarget.contains(t.relatedTarget)||(i.clear(),e.actions.saveShapes())},[ko.Copy]:a,[ko.Paste]:s,[ko.Cut]:o})},[e])},jo=({onResized:e,element:t})=>{i(()=>{let n=t.current;if(!n)return;let r=new ResizeObserver(t=>{let n=t?.[0]?.borderBoxSize?.[0],{width:r,height:i}=n?{width:n.inlineSize,height:n.blockSize}:t?.[0]?.contentRect??{};r!==void 0&&i!==void 0&&e(r,i)});return r.observe(n),()=>{r.unobserve(n)}},[t,e])},Mo=Symbol.for(`@yorab/react-paint/store`),No=e=>({actions:e.actions,getState:e.getEditorState,subscribe:e.subscribe,registerEvent:e.registerEvent,unregisterEvent:e.unregisterEvent,batch:e.transaction,getShape:e.getShape,getBounds:e.getBounds,getShapesAt:e.getShapesAt,toCanvasPosition:e.toCanvasPosition,toClientPosition:e.toClientPosition,resetCanvas:(t,n)=>void e.resetCanvas(t,n),getCurrentImage:e.getCurrentImage,getCurrentData:e.getCurrentData,scopeRef:e.setScopeElement,[Mo]:e}),Po=e=>{let t=e[Mo];if(!t)throw Error(`The paint prop must be the value returned by useReactPaint`);return t},Fo=e(void 0),Io=({paint:e,children:t})=>/* @__PURE__ */ l(Fo.Provider,{value:e,children:t}),Lo=()=>{let e=n(Fo);if(!e)throw Error(`usePaint must be used inside a PaintProvider or an Editor`);return e},Ro=e=>e,zo=()=>typeof process<`u`&&process.env.NODE_ENV!==`production`;function Bo(e,t,n=Object.is){let i=t??Ro,s=o(null),l=o(!1),u=a(()=>{let t;return()=>{let r=e.getState();if(t&&Object.is(t.state,r))return t.selection;let a=i(r);zo()&&!l.current&&(l.current=!0,n(a,i(r))||console.warn(`usePaintState: the selector returns a new value on each call, so the component renders on each change of the state. Return an existing value, or give an equality function like shallowEqual.`));let o=t??(s.current?{selection:s.current.value}:void 0);return t={state:r,selection:o&&n(o.selection,a)?o.selection:a},t.selection}},[e,i,n]),d=c(e.subscribe,u,u);return r(()=>{s.current={value:d}},[d]),d}var Vo=e=>{let{zoom:t,offset:n}=Bo(e,e=>e.view),r=Bo(e,e=>e.width),i=Bo(e,e=>e.height);return a(()=>({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":t,"--react-paint-canvas-offset-x":n[0],"--react-paint-canvas-offset-y":n[1],"--react-paint-app-canvaswidth":r,"--react-paint-app-canvasheight":i}),[t,n,r,i])},Ho=e=>{let t=e,n=[],r=0,i=!1,a=()=>{if(r>0)i=!0;else for(let e of n)e()},o=e=>(n=[...n,e],()=>{let t=n.indexOf(e);t!==-1&&(n=[...n.slice(0,t),...n.slice(t+1)])});return{getState:()=>t,setState:e=>{let n=typeof e==`function`?e(t):e;Object.is(n,t)||(t=n,a())},subscribe:o,watch:(e,n,r=Object.is)=>{let i=e(t);return o(()=>{let a=e(t);if(r(i,a))return;let o=i;i=a,n(a,o)})},batch:e=>{r++;try{return e()}finally{r--,r===0&&i&&(i=!1,a())}}}},Uo=()=>{let e={dataChanged:[],selectionChanged:[],toolChanged:[],shapeClicked:[],shapeHovered:[],canvasClicked:[],canvasDoubleClicked:[],pictureDropFailed:[],pictureLoaded:[],pictureLoadFailed:[]},t=(t,n)=>{if(e.hasOwnProperty(t)){if(n){let r=e[t].indexOf(n);r!==-1&&e[t].splice(r,1)}else e[t].length=0}};return{registerEvent:(n,r)=>(e.hasOwnProperty(n)&&e[n].push(r),()=>t(n,r)),unregisterEvent:t,emit:(t,...n)=>{for(let r of[...e[t]])r(...n)},hasListeners:t=>e[t].length>0}},Wo={shapes:[],selectedShape:void 0,history:{states:[{shapes:[],selectedShape:void 0,source:`remote`}],cursor:0}},Go=(e,t,n,r=`user`)=>Ee(e.states[e.cursor]?.shapes,t)?e:{states:[...e.states.slice(0,e.cursor+1),{shapes:t,selectedShape:n,source:r}],cursor:e.cursor+1},Ko=(e,t)=>{switch(t.type){case`ADD`:return{...e,shapes:ve(e.shapes,t.index??0,...t.newShapes)};case`UPDATE`:{let n=new Map(t.updatedShapes.map(e=>[e.id,e])),r=e.shapes.map(e=>n.get(e.id)??e),i={...e,shapes:r,selectedShape:t.newSelectedShape};return t.save?{...i,history:Go(i.history,r,t.newSelectedShape,t.source)}:i}case`REMOVE`:{let n=e.shapes.filter(e=>!t.ids.has(e.id));return{...e,shapes:n,selectedShape:t.newSelectedShape,history:Go(e.history,n,t.newSelectedShape,t.source)}}case`DUPLICATE`:{let n=e.shapes.flatMap(e=>{let n=t.newShapesMap.get(e.id);return n?[n,e]:[e]});return{...e,shapes:n,selectedShape:t.newSelectedShape??e.selectedShape}}case`RESET_AND_SAVE`:{let n=t.shapes.map(e=>`chosen`in e?be([`chosen`],e):e);return{...e,shapes:n,selectedShape:t.newSelectedShape,history:Go(e.history,n,t.newSelectedShape)}}case`SET_SELECTION`:return{...e,selectedShape:t.newSelectedShape};case`SAVE`:return{...e,history:Go(e.history,e.shapes,e.selectedShape,t.source)};case`UNDO`:{if(e.history.cursor<=0)return e;let t=e.history.cursor-1,{shapes:n,selectedShape:r}=e.history.states[t];return{...e,shapes:n,selectedShape:r,history:{...e.history,cursor:t}}}case`REDO`:{if(e.history.cursor>=e.history.states.length-1)return e;let t=e.history.cursor+1,{shapes:n,selectedShape:r}=e.history.states[t];return{...e,shapes:n,selectedShape:r,history:{...e.history,cursor:t}}}case`CLEAR`:return t.clearHistory?{shapes:t.shapes,selectedShape:void 0,history:{states:[{shapes:t.shapes,selectedShape:void 0,source:t.source}],cursor:0}}:{...e,shapes:t.shapes,selectedShape:void 0,history:Go(e.history,t.shapes,void 0,t.source)};case`REFRESH_ALL`:return{...e,shapes:t.shapes,selectedShape:t.newSelectedShape};case`SQUASH_HISTORY`:{let{states:n,cursor:r}=e.history;return r<=t.from+1?e:{...e,history:{states:[...n.slice(0,t.from+1),n[r]],cursor:t.from+1}}}default:return e}},qo={offset:[0,0],zoom:1},Jo=({width:e=1e3,height:t=600,mode:n=`editor`,disabled:r=!1,options:i},a)=>{let{clearCallback:o,resolvePictureSrc:s,...c}=Ce(le,Te(we,i??{},a));return c.size===`infinite`&&(c.canZoom=`always`),{config:{width:e,height:t,mode:n,disabled:r,options:c},clearCallback:o,resolvePictureSrc:s}},Yo=e=>({config:e,document:Wo,clipboard:void 0,tools:{available:De(e.options.availableTools),activeToolId:y.id},view:{canvasSize:Ne(e.width,e.height),transformation:qo,gridGap:e.options.grid},interaction:{selectionMode:{mode:`default`},hoveredShapeId:void 0,hoverMode:{mode:`default`},selectionFrame:void 0,modifiers:{shift:!1,alt:!1,space:!1},panStart:void 0,moveAcceleration:[0,0],focus:{component:!1,canvas:!1}}}),Xo=(e,t)=>e[0]===t[0]&&e[1]===t[1],Zo=(e,t)=>e.zoom===t.zoom&&Xo(e.offset,t.offset),Qo=(e,t)=>e.config.options.canvasSelectionPadding!==t.config.options.canvasSelectionPadding||e.config.options.brushAlgo!==t.config.options.brushAlgo,$o=(e,t)=>e.view.canvasSize!==t.view.canvasSize||e.view.transformation!==t.view.transformation||e.config.width!==t.config.width||e.config.height!==t.config.height||e.config.options.size!==t.config.options.size,es=(e,t)=>e.mode!==t.mode||e.outOfView!==t.outOfView?!1:e.mode!==`resize`||t.mode!==`resize`?!0:typeof e.anchor==`number`||typeof t.anchor==`number`?e.anchor===t.anchor:Xo(e.anchor,t.anchor),ts=(e,t)=>Object.keys(t).every(n=>Object.is(t[n],e[n]))?e:{...e,...t},$=(e,t)=>{let n=ts(e.interaction,t);return n===e.interaction?e:{...e,interaction:n}},ns=(e,t)=>Zo(t,e.view.transformation)?e:{...e,view:{...e.view,transformation:t}},rs=(e,t,n)=>{let r=!1,i=e.tools.available.map(e=>e.id===t?Object.entries(n).reduce((e,[t,n])=>{let i=e.settings[t];return!i||n===void 0||Object.is(i.default,n)?e:(r=!0,xe([`settings`,t,`default`],n,e))},e):e);return r?{...e,tools:{...e.tools,available:i}}:e},is=(e=`png`)=>`drawing.${e===`jpeg`?`jpg`:e}`,as=(e,t,n,r)=>{let i=n??Y(e,r)?.computed.center;return i?e.map(e=>H(ni(e,t,i),r)):[]},os=(e,t)=>new Map([...e,...k(t)].map(e=>[e.id,e])),ss=(e={})=>{let t={props:e,overrides:{}},n=Ho(Yo(Jo(e,t.overrides).config)),r=ja(),{registerEvent:i,unregisterEvent:a,emit:o,hasListeners:s}=Uo(),{getState:c,batch:l}=n,u=null,d=null,f=null,p=null,m=!1,h=(e=c())=>r.selectSettings(e),g=(e=c())=>({size:e.config.options.size,canvasSize:e.view.canvasSize,drawingSize:{width:e.config.width,height:e.config.height}}),_,v,b=()=>u?.getContext(`2d`)||(_===void 0&&(_=Ie()),_),x=()=>b()||(v??(v=Le()),v),S=(e,t)=>{let n=e.document.shapes.map(e=>H(e,t)),r=new Map(e.document.shapes.map((e,t)=>[e,n[t]])),i=e.document.selectedShape,a=i===void 0?void 0:Y(k(i).map(e=>r.get(e)??H(e,t)),t);return{...e,document:Ko(e.document,{type:`REFRESH_ALL`,shapes:n,newSelectedShape:a})}},C=(e,t)=>{if(t===e)return t;let n=t,i=e.interaction.selectionMode.mode,a=n.interaction.selectionMode.mode;i===`preview`&&a===`preview`&&e.document.selectedShape?.id!==n.document.selectedShape?.id&&(n=$(n,{selectionMode:{mode:`default`}})),i===`selectionFrame`&&a!==`selectionFrame`&&!Xo(n.interaction.moveAcceleration,[0,0])&&(n=$(n,{moveAcceleration:[0,0]}));let{selectedShape:o}=n.document;return(o===void 0||o.locked)&&n.interaction.hoverMode.mode!=="default"&&(n=$(n,{hoverMode:{mode:`default`}})),!r.selectIsInteractive(n)&&(n.interaction.focus.component||n.interaction.focus.canvas)&&(n=$(n,{focus:{component:!1,canvas:!1}})),Qo(e,n)&&(n=S(n,h(n))),n.config.options.size===`fixed`&&$o(e,n)&&(n=ee(n)),n},ee=e=>{let{transformation:t}=e.view;return ns(e,bt({...g(e),zoom:t.zoom,newOffset:t.offset}))},w=e=>n.setState(t=>C(t,e(t))),T=e=>w(t=>{let n=Ko(t.document,typeof e==`function`?e(t):e);return n===t.document?t:{...t,document:n}}),te=(e,t)=>w(n=>$(n,{[e]:t})),ne=!1,re=e=>ne?e():l(()=>{let t=c().document.history.cursor;ne=!0;try{return e()}finally{ne=!1,T({type:`SQUASH_HISTORY`,from:t})}});n.watch(({document:e,config:t})=>[e.history,t.width,t.height],([e,t,n],[r])=>{if(!s(`dataChanged`))return;let{shapes:i,source:a}=e.states[e.cursor],c=Kn(i,t,n);o(`dataChanged`,c,a,qn(r.states[r.cursor].shapes,i,c.shapes))},de),n.watch(e=>e.document.selectedShape?.id,()=>o(`selectionChanged`,r.selectSelectedShapes(c().document.selectedShape))),n.watch(r.selectActiveTool,e=>o(`toolChanged`,e),(e,t)=>e.id===t.id);let ie=()=>{let{config:e}=Jo(t.props,t.overrides);w(t=>{let n=t.config,r=!Ee(n.options,e.options);if(!r&&n.width===e.width&&n.height===e.height&&n.mode===e.mode&&n.disabled===e.disabled)return t;let i=r?e.options:n.options,a=r&&!Ee(n.options.availableTools,i.availableTools),o=i.grid!==n.options.grid,s=i.resize!==`extend`&&(n.options.resize===`extend`||n.width!==e.width||n.height!==e.height),{view:c}=t;return o&&(c={...c,gridGap:i.grid}),s&&(c={...c,canvasSize:Me(c.canvasSize.width,e.width,e.height)}),{...t,config:{...e,options:i},tools:a?{...t.tools,available:De(i.availableTools)}:t.tools,view:c}})},ae=e=>{t.props=e,ie()},oe=e=>w(t=>e===t.document.selectedShape?t:{...t,document:Ko(t.document,{type:`SET_SELECTION`,newSelectedShape:e})}),se=(e,t)=>T({type:`ADD`,newShapes:e,index:t}),ce=e=>T({type:`SAVE`,source:e}),le=()=>T({type:`UNDO`}),ue=()=>T({type:`REDO`}),fe=(e,{clearHistory:t,source:n})=>T({type:`CLEAR`,shapes:e,clearHistory:t,source:n}),pe=(e,t=!1,n=!1)=>T(r=>{let i=h(r),a=/* @__PURE__ */ new Map,o=[];for(let n of r.document.shapes){let r=e.find(e=>e.id===n.id);if(r){let e=gi(t?ui(r,20,20,i):r);a.set(n.id,e),o.push(e)}}return{type:`DUPLICATE`,newShapesMap:a,newSelectedShape:n?Y(o,i):r.document.selectedShape}}),me=(e,t,n,r)=>{if(!e||!r){te(`hoveredShapeId`,void 0);return}let i=c(),a=h(i),o=k(i.document.selectedShape).map(e=>e.id),s=i.document.shapes.filter(e=>!e.locked&&Xe(e.computed.boundingBox,n)).find(e=>o.includes(e.id)?!!Qi(t,e,n,a):!!na(t,e,n,a));te(`hoveredShapeId`,s?.id)},E=()=>l(()=>{te(`hoveredShapeId`,void 0),Be({mode:`default`})}),ge=(e,t=!1,n)=>T(r=>{let i=new Map(e.map(e=>[e.id,e])),a=r.document.selectedShape;return{type:`UPDATE`,updatedShapes:e,newSelectedShape:a&&Y(k(a).map(e=>i.get(e.id)??e),h(r)),save:t,source:n}}),D=(e,{save:t=!0,source:n}={})=>{e.length&&ge(e,t,n)},be=(e,t=`current`)=>T(n=>({type:`RESET_AND_SAVE`,shapes:e,newSelectedShape:t===`current`?n.document.selectedShape:t})),Ce=(e,t)=>T(n=>{let r=new Set(e.map(e=>e.id)),i=n.document.selectedShape;return{type:`REMOVE`,ids:r,newSelectedShape:k(i).map(e=>e.id).find(e=>r.has(e))?void 0:i,source:t}}),ke=(e,t)=>{let{shapes:n}=c().document,r=n.findIndex(t=>t.id===e),i=n.findIndex(e=>e.id===t);be(ye(n,r,i))},Ae=(e,t)=>{let n=[...c().document.shapes],r=new Set(e.map(e=>e.id)),i=n.map((e,t)=>r.has(e.id)?t:-1).filter(e=>e>=0);if(i.length!==0)switch(t){case`first`:case`last`:{let e=i.map(e=>n[e]).filter(Boolean),r=n.filter((e,t)=>!i.includes(t));be(t===`first`?[...e,...r]:[...r,...e]);break}case`backward`:{let e=[...n],t=i.sort((e,t)=>t-e).map(e=>n[e].id);for(let n of t){let t=e.findIndex(e=>e.id===n);if(t<e.length-1){let n=t+1;r.has(e[n].id)||(e=ye(e,t,n))}}be(e);break}case`forward`:{let e=[...n],t=i.sort((e,t)=>e-t).map(e=>n[e].id);for(let n of t){let t=e.findIndex(e=>e.id===n);if(t>0){let n=t-1;r.has(e[n].id)||(e=ye(e,t,n))}}be(e);break}}},je=e=>{de(e,c().document.shapes)||be(e)},A=(e,t)=>{let n=h(),{shapes:r,selectedShape:i}=c().document,a=new Set(e.map(e=>e.id)),o=r.map(e=>a.has(e.id)?t===`visible`?xe(`visible`,e.visible===!1,e):xe(`locked`,!e.locked,e):e),s=k(i).map(e=>e.id),l=Y(o.filter(e=>s.includes(e.id)),n);be(o,l)},j=e=>A(e,`visible`),M=e=>A(e,`locked`),Ne=(e,t)=>w(n=>{let r=n.interaction.selectionFrame,i=[r?.frame[0]??[t[0],t[1]],[t[0],t[1]]],a=n.document.shapes.filter(t=>!t.locked&&la(e,t,i)),o=n.interaction.modifiers.shift?Oa(r?.oldSelection,a):a,{selectedShape:s}=n.document,c=de(o,k(s));return{...$(n,{selectionFrame:{oldSelection:r?.oldSelection,frame:i}}),document:c?n.document:Ko(n.document,{type:`SET_SELECTION`,newSelectedShape:Y(o,h(n))})}}),Pe=e=>te(`selectionFrame`,e),Fe=e=>w(t=>t.tools.activeToolId===e.id?t:{...t,tools:{...t.tools,activeToolId:e.id}}),Re=e=>l(()=>{oe(void 0),Fe(e)}),ze=e=>te(`selectionMode`,e),Be=e=>w(t=>es(e,t.interaction.hoverMode)?t:$(t,{hoverMode:e})),Ve=e=>te(`panStart`,e),He=e=>w(t=>Xo(e,t.interaction.moveAcceleration)?t:$(t,{moveAcceleration:e})),Ue=e=>w(t=>$(t,{modifiers:ts(t.interaction.modifiers,e)})),We=e=>w(t=>$(t,{focus:ts(t.interaction.focus,e)})),Ge=e=>w(t=>Ee(e,t.view.canvasSize)?t:{...t,view:{...t.view,canvasSize:e}}),N=e=>w(t=>ns(t,e(t.view.transformation,t))),Ke=e=>N(()=>e),qe=e=>N((t,n)=>bt({...g(n),zoom:t.zoom,newOffset:e(t,n)})),Je=e=>qe(()=>e),Ye=e=>N(({offset:t,zoom:n},r)=>St({...g(r),currentOffset:t,currentZoom:n,action:e})),Ze=(e,t)=>N(({offset:n,zoom:r},i)=>{let{canvasSize:a}=i.view,o=t?[(t[0]+n[0])*r,(t[1]+n[1])*r]:[a.realWidth/2,a.realHeight/2];return xt({...g(i),currentOffset:n,currentZoom:r,zoom:vt(e),centerPoint:o})}),Qe=(e,t)=>{if(!e.length)return;let n=$e(e.map(e=>e.computed.boundingBox));N((e,r)=>wt({...g(r),box:n,padding:t}))},et=()=>N((e,t)=>bt({...g(t),zoom:1,newOffset:[0,0]})),P=(e,t)=>N(({offset:n,zoom:r},i)=>Ct({...g(i),currentOffset:n,currentZoom:r,delta:e,centerPoint:t})),tt=([e,t])=>{let n=c().view.transformation;return qe(({offset:n,zoom:r})=>[n[0]-e/r,n[1]-t/r]),c().view.transformation!==n},nt=(e=1)=>qe(({offset:t},{interaction:{moveAcceleration:n}})=>[t[0]-n[0]*e,t[1]-n[1]*e]),rt=e=>w(t=>t.view.gridGap===e?t:{...t,view:{...t.view,gridGap:e}}),it=e=>w(t=>{let n=Y(e,h(t)),r=t.document.selectedShape?.id!==e.map(e=>e.id).join(`-`);return{...t,document:Ko(t.document,{type:`SET_SELECTION`,newSelectedShape:n}),tools:r&&t.tools.activeToolId!==y.id?{...t.tools,activeToolId:y.id}:t.tools}}),at=e=>l(()=>{se(e),it(e)}),ot=(e,{index:t=0,save:n=!0,source:r,select:i=!1}={})=>l(()=>{se(e,t),n&&ce(r),i&&it(e)}),st=()=>it(c().document.shapes.filter(e=>!e.locked)),ct=(e,t)=>l(()=>{fe(e,t),Re(y),et()}),lt=()=>Jo(t.props,t.overrides).resolvePictureSrc,ut=async(e,t)=>{let n=c(),{shapes:r,failedPictures:i}=await mo(e,{ctx:x(),settings:h(n),tools:n.tools.available,usedIds:/* @__PURE__ */ new Set,resolvePictureSrc:lt()});ct(r,t);for(let{shape:e,error:t}of i)o(`pictureLoadFailed`,e,t)},dt=()=>{m||(m=!0,t.props.shapes&&ut(t.props.shapes,{clearHistory:!0,source:`remote`}))},ft=e=>lr({shapes:c().document.shapes,settings:h(),options:e}),pt=()=>{let{document:e,config:t}=c();return Kn(e.shapes,t.width,t.height)},F=(e,t,n)=>{for(let[r,i]of Object.entries(n))e?.removeEventListener(r,i),t?.addEventListener(r,i)},mt=e=>({focusin:()=>r.selectIsInteractive(c())&&We({[e]:!0}),focusout:()=>r.selectIsInteractive(c())&&We({[e]:!1})}),ht={focusin:()=>r.selectIsInteractive(c())&&We({component:!0}),focusout:e=>{e.relatedTarget&&p?.contains(e.relatedTarget)||l(()=>{Ue({shift:!1,alt:!1,space:!1}),We({component:!1})})}},gt=mt(`canvas`),I=/* @__PURE__ */ new Set([ht]),_t=()=>{let e=f??d;if(e!==p){for(let t of I)F(p,e,t);p=e}},yt=e=>(I.add(e),F(null,p,e),()=>{I.delete(e),F(p,null,e)}),Tt=e=>{f=e,_t()},Et=e=>{d=e,_t()},Dt=e=>{e!==u&&(F(u,e,gt),u=e)},Ot=()=>{let e=u?.getBoundingClientRect();return e?.width&&e.height?e:void 0},kt=({x:e,y:t})=>{let n=Ot();return n?Ki({clientX:e,clientY:t},n,h()):void 0},At=e=>{let t=Ot();return t?qi(e,t,h()):void 0},jt=X(os),Mt=()=>{let{shapes:e,selectedShape:t}=c().document;return jt(e,t)},L=e=>{let t=Mt();return _e(e.map(e=>t.get(e)))},R=(e,t,n)=>{let r=L(e);r.length&&D(t(r,h()),n)},z=e=>l(()=>{oe(e.originalShape),Fe(y),Pe(void 0),ze({mode:`contextMenu`,...e})}),Nt=e=>{let t=e?L(e):k(c().document.selectedShape);if(t.length){let e=Y(t,h());w(t=>({...t,clipboard:e}))}return t},B=e=>{if(e.type!==`picture`)return;let t=()=>{let t=c().document.shapes.find(t=>t.id===e.id);return t?.type===`picture`&&t.img===e.img?t:void 0};ir(e.img,e.src,lt()).then(()=>{let e=t();if(!e)return;let n={...e};ge([n]),o(`pictureLoaded`,n)},n=>{console.warn(`react-paint: the picture ${e.id} could not be loaded`,n);let r=t();r&&o(`pictureLoadFailed`,r,n)})},Pt=(e,t)=>{fo(e,`addShapes`);let n=c(),r=new Set(n.document.shapes.map(e=>e.id)),i={ctx:x(),settings:h(n),tools:n.tools.available,usedIds:r,completeStyle:!0},a=e.map(e=>po(e,i));if(!a.length)return[];ot(a,t);for(let e of a)B(e);return a.map(e=>e.id)},Ft=(e,t)=>{let n=Mt();go(e,n);let r=x(),i=h(),a=/* @__PURE__ */ new Map,o=[];for(let t of e){let e=a.get(t.id)??n.get(t.id);if(!e)continue;let s=_o(r,e,t,i);s.type===`picture`&&e.type===`picture`&&s.src!==e.src&&(s={...s,img:new Image},o.push(s)),a.set(t.id,s)}D([...a.values()],t);for(let e of o)B(e)},It=(e,t)=>{let n=L([e])[0];return n&&t.includes(n.type)&&`points`in n&&n.type!==`brush`?n:void 0},Lt={selectTool:e=>{let t=Aa(c().tools.available,typeof e==`string`?e:e.id);t&&Re(t)},updateToolSettings:(e,t,n)=>w(r=>rs(r,e,{[t]:n})),setToolStyle:(e,t)=>w(n=>rs(n,e,t)),selectShapes:(e,{mode:t=`replace`}={})=>{let n=L(e),{selectedShape:r}=c().document;it(t===`add`?Oa(r,n):t===`remove`?ka(r,n):n)},selectAllShapes:st,clearSelection:()=>oe(void 0),addShapes:Pt,updateShapes:Ft,removeShapes:(e,{source:t}={})=>Ce(L(e),t),duplicateShapes:(e,{translate:t=!1,select:n=!1}={})=>pe(L(e),t,n),translateShapes:(e,[t,n],r)=>R(e,(e,r)=>e.map(e=>ui(e,t,n,r)),r),rotateShapes:(e,t,{center:n,...r}={})=>R(e,(e,r)=>as(e,t,n,r),r),resizeShapes:(e,t,n)=>R(e,(e,n)=>ci(x(),e,t,n),n),transformShapes:(e,t)=>R(e,(e,n)=>t===`rotateClockwise`||t===`rotateCounterclockwise`?as(e,t===`rotateClockwise`?Math.PI/2:-Math.PI/2,void 0,n):li(x(),e,t,n)),setShapesStyle:(e,t,{updateTool:n=!1,...r}={})=>l(()=>{let i=x();if(R(e,(e,n)=>e.map(e=>pi(i,e,t,n)),r),!n)return;let{available:a}=c().tools,o=new Set(_e(L(e).map(e=>Oe(a,e)?.id)));w(e=>[...o].reduce((e,n)=>rs(e,n,t),e))}),updateShapesStyle:(e,t,n,{save:r=!0}={})=>Lt.setShapesStyle(e,{[t]:n},{save:r}),moveShapes:(e,t)=>Ae(L(e),t),swapShapes:ke,setShapeIndex:(e,t)=>{let{shapes:n}=c().document,r=n.findIndex(t=>t.id===e);r!==-1&&je(ye(n,r,he(Math.round(t),0,n.length-1)))},reorderShapes:e=>{let{shapes:t}=c().document,n=new Map(t.map(e=>[e.id,e])),r=_e([...new Set(e)].map(e=>n.get(e))),i=new Set(r);je([...r,...t.filter(e=>!i.has(e))])},toggleShapesVisibility:e=>j(L(e)),toggleShapesLock:e=>M(L(e)),setShapesVisibility:(e,t)=>{let n=L(e).filter(e=>e.visible!==!1!==t);n.length&&j(n)},setShapesLocked:(e,t)=>{let n=L(e).filter(e=>!!e.locked!==t);n.length&&M(n)},insertShapePoint:(e,t,n)=>{let r=It(e,[`polygon`,`curve`]);r&&Ft([{id:e,points:ve(r.points,t,n)}])},moveShapePoint:(e,t,n)=>{let r=It(e,[`line`,`polygon`,`curve`]);!r||t<0||t>=r.points.length||Ft([{id:e,points:r.points.map((e,r)=>r===t?n:e)}])},removeShapePoint:(e,t)=>{let n=L([e])[0];if(!fi(n,t))return;let r=h();ge([n.type===`curve`?pn(n,t,r):rn(n,t,r)],!0)},editText:e=>{let t=L([e])[0];t?.type===`text`&&u&&l(()=>{it([t]),ze({mode:`textedition`,defaultValue:t.value})})},addPicture:async(e,{maxWidth:t=c().config.width,maxHeight:n=c().config.height,select:r=!0,position:i}={})=>{let a=await _r(e,t,n,h(),lt(),i);return ot([a],{select:r}),a},copy:e=>{Nt(e)},cut:e=>{let t=Nt(e);t.length&&Ce(t)},paste:()=>{let{clipboard:e}=c();e&&at(_i(e,h()))},undo:le,redo:ue,saveShapes:()=>ce(),clearCanvas:()=>{let{clearCallback:e}=Jo(t.props,t.overrides),n=t.props.shapes;typeof e==`string`?e===`defaultShapes`&&n!==void 0?ut(n,{clearHistory:!1,source:`user`}):ct([],{clearHistory:!1,source:`user`}):ut(e(),{clearHistory:!1,source:`user`})},loadFile:async e=>Lt.loadData(await fr(e)),loadData:async(e,{clearHistory:t=!0}={})=>{let n=typeof e==`string`?JSON.parse(e):e,r=O(n)&&Array.isArray(n.shapes)?n.shapes:[];await ut(r,{clearHistory:t,source:`remote`})},exportPicture:({fileName:e,...t}={})=>er(ft(t),e??is(t.format)),exportData:({fileName:e=`drawing.json`}={})=>{let{document:t,config:n}=c(),r=ur(t.shapes,n.width,n.height);if(!r)throw Error(`L'encodage a échoué`);er(r,e)},setZoom:Ye,zoomTo:(e,{center:t}={})=>Ze(e,t),zoomToShapes:(e,{padding:t=0}={})=>Qe(e?L(e):c().document.shapes.filter(e=>e.visible!==!1),t),resetZoom:et,setOffset:Je,panBy:([e,t])=>qe(({offset:n})=>[n[0]-e,n[1]-t]),setGridGap:rt,openContextMenu:({clientPosition:e,canvasPosition:t,ids:n})=>{let i=c();if(!r.selectWithContextMenu(i))return;let a=h(i);z({cursorStartPosition:t??kt(e)??[0,0],clientPosition:e,originalShape:Y(n?L(n):k(i.document.selectedShape),a),anchor:void 0})},closeContextMenu:()=>{c().interaction.selectionMode.mode===`contextMenu`&&(ze({mode:`default`}),u?.focus())},setOptions:e=>{t.overrides=Se(Te(we,t.overrides,e)),ie()},resetOptions:()=>{t.overrides={},ie()},resetSettings:()=>w(e=>{let{tools:t,view:n}=Yo(e.config);return{...e,tools:t,view:{...e.view,transformation:n.transformation,gridGap:n.gridGap}}})};return{getState:c,subscribe:n.subscribe,watch:n.watch,batch:l,transaction:re,selectors:r,getSettings:h,getEditorState:()=>r.selectEditorState(c()),actions:Lt,registerEvent:i,unregisterEvent:a,emit:o,hasListeners:s,setConfig:ae,init:dt,resetCanvas:(e=[],t=!0)=>ut(e,{clearHistory:t,source:`remote`}),getCurrentImage:ft,getCurrentData:pt,getShape:e=>Mt().get(e),getBounds:e=>{let t=h(),n=Y(L(e),t);if(n)return{...si(n,t),rotation:n.rotation??0,center:n.computed.center}},getShapesAt:e=>{let t=b();return t?ma(t,c().document.shapes,e,h()):[]},getShapeAt:e=>{let t=b();return t?ha(t,c().document.shapes,e,h()):void 0},toCanvasPosition:kt,toClientPosition:At,setScopeElement:Tt,setCanvasRootElement:Et,setCanvasElement:Dt,listenScope:yt,setSelectedShape:oe,addShapes:se,duplicateShapes:pe,refreshHoveredShape:me,clearHover:E,updateShapes:ge,removeShapes:Ce,refreshSelectedShapes:Ne,setSelectionFrame:Pe,setActiveTool:Fe,setSelectionMode:ze,showContextMenu:z,setHoverMode:Be,setPanStart:Ve,setMoveAcceleration:He,setModifiers:Ue,setCanvasSize:Ge,setTransformation:Ke,getViewBounds:g,zoomBy:P,scrollBy:tt,applyMoveAcceleration:nt}},cs=(e={})=>{let[t]=s(()=>No(ss(e))),n=Po(t);return i(()=>{n.setConfig(e)}),r(()=>{n.init()},[n]),t},ls={position:`relative`,width:`100%`,height:`100%`,flex:`1 1 0`,minWidth:0,minHeight:0,overflow:`hidden`},us=({paint:e,options:n,className:i,style:a})=>{let s=Po(e),u=t(()=>s.selectors.selectCanvasView(s.getState()),[s]),d=c(s.subscribe,u,u),{width:f,canvasSize:p,resize:m}=d,{canvasBackgroundColor:h,canvasSelectionColor:g,canvasSelectionWidth:_}=Ce(ue,n),v=o(null),y=t(e=>{v.current=e,s.setCanvasRootElement(e)},[s]),b=o(0);r(()=>()=>cancelAnimationFrame(b.current),[]);let x=t((e,t)=>{if(cancelAnimationFrame(b.current),m===`extend`){let n=Math.round(e),r=Math.round(t);n&&r&&s.setCanvasSize(Ne(n,r))}else b.current=requestAnimationFrame(()=>{let{config:t}=s.getState();s.setCanvasSize(Me(e,t.width,t.height))})},[m,s]);Oo(s),Ao(s),jo({element:v,onResized:x});let S=`calc(${D(`--react-paint-app-canvaswidth`,f)} * 1px)`,C=m===`extend`?ls:{position:`relative`,width:`100%`,maxWidth:Pe(m)?`100%`:S,minWidth:Fe(m)?void 0:S,aspectRatio:D(`--react-paint-app-row-aspectratio`,`${p.width} / ${p.height}`)};return/* @__PURE__ */ l(`div`,{ref:y,className:`react-paint-app-row${i?` ${i}`:``}`,style:{...C,...a},children:/* @__PURE__ */ l(Eo,{store:s,view:d,backgroundColor:h,selectionColor:g,selectionWidth:_})})};export{Io as a,N as c,de as d,le as f,y as h,Bo as i,k as l,b as m,cs as n,Lo as o,oe as p,Vo as r,I as s,us as t,Ae as u};

package/dist/_chunks/editor-BARYd5Od.js

@@ -0,0 +1 @@
+import{a as e,c as t,d as n,h as r,i,m as a,o,s,u as c}from"./canvas-CDYlr833.js";import l,{memo as u,useCallback as d,useEffect as f,useImperativeHandle as p,useMemo as m,useRef as h,useState as g,useTransition as _}from"react";import{Fragment as v,jsx as y,jsxs as b}from"react/jsx-runtime";var x={LOADING:2,PANEL:3,SNACKBAR:4},S=({isLoading:e=!1})=>{let[t,n]=g(`hidden`);return f(()=>{if(e)n(`visible`);else{n(`fadeOut`);let e=setTimeout(()=>n(`hidden`),300);return()=>{clearTimeout(e)}}},[e]),t===`hidden`?null:/* @__PURE__ */ y(`div`,{className:`react-paint-editor-loading`,"data-loading":t,style:{"--react-paint-editor-loading-zindex":x.LOADING,"--react-paint-editor-loading-transition-duration":`300ms`},children:/* @__PURE__ */ b(`div`,{className:`react-paint-editor-loader`,children:[/* @__PURE__ */ y(`div`,{}),/* @__PURE__ */ y(`div`,{}),/* @__PURE__ */ y(`div`,{}),/* @__PURE__ */ y(`div`,{})]})})},C={type:`infos`,duration:4e3},w=({type:e,text:t,duration:n})=>{let[r,i]=g(!1);return f(()=>{let e=setTimeout(()=>{i(!0)},100),t=setTimeout(()=>{i(!1)},n-500-100);return()=>{clearTimeout(e),clearTimeout(t)}},[n]),/* @__PURE__ */ y(`div`,{className:`react-paint-editor-snackbar`,"data-is-shown":+r,"data-type":e,style:{"--react-paint-editor-panel-transition-duration":`500ms`},children:t})},T=({snackbarList:e})=>/* @__PURE__ */ y(`div`,{className:`react-paint-editor-snackbar-container`,style:{"--react-paint-editor-snackbar-zindex":x.SNACKBAR},children:e.map(e=>/* @__PURE__ */ y(w,{...e},e.id))}),E=l.forwardRef((e,t)=>{let{hidden:n=!1,disabled:r=!1,selected:i=!1,icon:a,children:o,className:s=``,title:c,onClick:l,...u}=e,d=r?-1:0,f=h(null);return p(t,()=>f.current),/* @__PURE__ */ b(`label`,{className:`react-paint-editor-button ${s}`,title:c,onClick:l,"data-disabled":+r,"data-selected":+i,"data-hidden":+n,tabIndex:d,onKeyDown:e=>{e.key===` `&&(e.preventDefault(),e.stopPropagation())},onKeyUp:e=>{e.preventDefault(),e.stopPropagation(),e.key===` `&&f.current?.click()},children:[/* @__PURE__ */ y(`input`,{ref:f,disabled:r,...u}),/* @__PURE__ */ b(`span`,{className:`react-paint-editor-button-content`,children:[o&&/* @__PURE__ */ y(`span`,{className:`react-paint-editor-button-children`,children:o}),a&&/* @__PURE__ */ y(`span`,{className:`react-paint-editor-button-icon`,dangerouslySetInnerHTML:{__html:a}})]})]})}),D=l.forwardRef((e,t)=>{if(e.type===`file`||e.type===`color`)return/* @__PURE__ */ y(E,{...e,ref:t});let{hidden:n=!1,disabled:r=!1,selected:i=!1,icon:a,children:o,type:s=`button`,className:c=``,...l}=e;return/* @__PURE__ */ y(`button`,{className:`react-paint-editor-button ${c}`,ref:t,disabled:r,"data-disabled":+r,"data-selected":+i,"data-hidden":+n,type:s,...l,children:/* @__PURE__ */ b(`span`,{className:`react-paint-editor-button-content`,children:[o&&/* @__PURE__ */ y(`span`,{className:`react-paint-editor-button-children`,children:o}),a&&/* @__PURE__ */ y(`span`,{className:`react-paint-editor-button-icon`,dangerouslySetInnerHTML:{__html:a}})]})})}),O=({children:e,title:t=``,className:n=``,position:r,fitContainer:i=!1,alignment:a,style:o,...s})=>/* @__PURE__ */ b(`div`,{className:`react-paint-editor-panel ${n}`,"data-fitcontainer":i,"data-position":r??`unset`,"data-alignment":a??`unset`,style:{...o,"--react-paint-editor-panel-zindex":x.PANEL},...s,children:[t&&/* @__PURE__ */ y(`h3`,{className:`react-paint-editor-panel-title`,children:t}),e]}),k=`<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>`,A=`<svg><path d="M2.5 17.5V2.5H17.5V17.5ZM4.25 15.75H15.75V4.25H4.25ZM4.25 15.75V4.25V15.75Z"/></svg>`,ee=`<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>`,j=`<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>`,M=`<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>`,N=`<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>`,te=`<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>`,P=`<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>`,F=`<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>`,I=`<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>`,L=`<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>`,R=`<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>`,z=`<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>`,B=`<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>`,ne=`<svg><path d="M8.708 16.667V5.917H4.167V3.333H15.833V5.917H11.292V16.667Z"/></svg>`,re=`<svg><path d="M7.5 15.833V14.083H12.833L3.333 4.583L4.583 3.333L14.083 12.833V7.5H15.833V15.833Z"/></svg>`,V=`<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>`,H=`<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>`,ie=`<svg><path d="M2.5 15V13.25H17.5V15ZM2.5 10.875V9.125H17.5V10.875ZM2.5 6.75V5H17.5V6.75Z"/></svg>`,ae=`<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>`,oe=`<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>`,se=`<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>`,ce=`<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>`,U=`<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>`,le=`<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>`,ue=`<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>`,de=`<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>`,fe=`<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>`,pe=`<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>`,me=`<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>`,he=`<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>`,ge=`<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>`,_e=`<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>`,ve=({disabled:e=!1,ref:t,shape:n,layoutDragging:r,setLayoutDragging:i,handleSelect:a,onSwapShapes:o})=>{let[s,c]=g(!1);return f(()=>{r||c(!1)},[r]),f(()=>{let s=t.current;if(!s)return;let l=()=>{i(void 0)},u=e=>(e.preventDefault&&e.preventDefault(),!1),d=e=>{a([n.id]),e.dataTransfer&&(e.dataTransfer.effectAllowed=`move`,e.dataTransfer.setData(`draggableShapeId`,n.id),i(n.id))},f=()=>{r!==n.id&&c(!0)},p=()=>{c(!1)},m=e=>(e.stopPropagation(),e.dataTransfer&&o(e.dataTransfer.getData(`draggableShapeId`),n.id),!1);return e||(s.addEventListener(`dragstart`,d),s.addEventListener(`dragend`,l),s.addEventListener(`dragover`,u),s.addEventListener(`dragenter`,f),s.addEventListener(`dragleave`,p),s.addEventListener(`drop`,m)),()=>{e||(s.removeEventListener(`dragstart`,d),s.removeEventListener(`dragend`,l),s.removeEventListener(`dragover`,u),s.removeEventListener(`dragenter`,f),s.removeEventListener(`dragleave`,p),s.removeEventListener(`drop`,m))}},[e,t,n,i,a,o,r]),{isOver:s}},ye={brush:`Brosse`,line:`Ligne`,polygon:`Polygone`,curve:`Courbe`,rect:`Rectangle`,square:`Carré`,circle:`Cercle`,ellipse:`Ellipse`,picture:`Image`,text:`Texte`,triangle:`Triangle`,group:`Groupe`},W={...r,icon:V,label:`Sélection`},G={...a,icon:H,label:`Move`},be={type:`undo`,icon:te,label:`Undo`},xe={type:`redo`,icon:P,label:`Redo`},Se={type:`clear`,icon:I,label:`Clear`},Ce={type:`export`,icon:R,label:`Export PNG`},we={type:`loadfile`,icon:z,label:`Load project`},Te={type:`savefile`,icon:L,label:`Save project`},Ee={type:`uploadpicture`,icon:B,label:`Upload picture`},De=e=>{switch(e){case`brush`:return k;case`line`:return re;case`polygon`:return M;case`curve`:return le;case`rect`:return A;case`square`:return A;case`circle`:return j;case`ellipse`:return j;case`text`:return ne;case`picture`:return B;case`group`:return _e;case`triangle`:return``}},Oe=e=>({...e,icon:e.icon??De(e.type),label:e.label??ye[e.type]}),ke=u(function({disabled:e=!1,shape:t,selected:n,layoutDragging:r,toggleShapeVisibility:i,toggleShapeLock:a,setLayoutDragging:o,handleRemove:s,handleSelect:c,onSwapShapes:l}){let u=h(null),d=n=>{e||(n.preventDefault(),n.stopPropagation(),s([t.id]))},f=n=>{e||(n.preventDefault(),c([t.id]))},p=n=>{e||(n.preventDefault(),n.stopPropagation(),i([t.id]))},m=n=>{e||(n.preventDefault(),n.stopPropagation(),a([t.id]))},{isOver:g}=ve({disabled:e,ref:u,shape:t,layoutDragging:r,setLayoutDragging:o,handleSelect:c,onSwapShapes:l});return/* @__PURE__ */ b(`div`,{className:`react-paint-editor-layout`,"data-disabled":+e,draggable:!e,"data-is-dragging":+(r===t.id),"data-is-over":+g,onClick:f,"data-selected":+n,ref:u,tabIndex:-1,children:[/* @__PURE__ */ y(`span`,{dangerouslySetInnerHTML:{__html:De(t.type)}}),/* @__PURE__ */ y(`span`,{children:t.id}),/* @__PURE__ */ y(`div`,{className:`react-paint-editor-layouts-separator`}),/* @__PURE__ */ y(D,{className:`react-paint-editor-layouts-visible-button`,title:t.visible?`Hide`:`Show`,"data-visible":t.visible!==!1,disabled:e,selected:n,onClick:p,icon:t.visible===!1?oe:ae}),/* @__PURE__ */ y(D,{className:`react-paint-editor-layouts-locked-button`,title:t.locked?`Locked`:`Unlocked`,"data-locked":!!t.locked,disabled:e,selected:n,onClick:m,icon:t.locked?se:ce}),/* @__PURE__ */ y(D,{className:`react-paint-editor-layouts-remove-button`,title:`Remove`,disabled:e,onClick:d,icon:N})]})}),Ae=e=>e>=t.large?`large`:e>=t.medium?`medium`:e>=t.small?`small`:`none`,je=()=>{let e,t=[],n=/* @__PURE__ */ new Map;return({shapes:r})=>{if(r===e)return t;let i=/* @__PURE__ */ new Map,a=r.map(({id:e,type:t,visible:r,locked:a})=>{let o=n.get(e),s=o?.type===t&&o.visible===r&&o.locked===a?o:{id:e,type:t,visible:r,locked:a};return i.set(e,s),s});return n=i,e=r,t=a,a}},Me=e=>e.selectedShapeIds,Ne=({disabled:e})=>{let r=o(),{actions:a}=r,[s]=g(je),c=i(r,s,n),l=i(r,Me),u=Ae(i(r,e=>e.gridGap)),[d,f]=g(void 0),p=m(()=>new Set(l),[l]),h=e=>a.setGridGap(t[e]);return/* @__PURE__ */ y(O,{alignment:`right`,className:`react-paint-editor-layouts-panel`,position:`bottom`,children:/* @__PURE__ */ y(`div`,{className:`react-paint-editor-layouts-panel-content`,children:/* @__PURE__ */ b(`div`,{className:`react-paint-editor-layouts-scrolling-content`,children:[/* @__PURE__ */ b(`div`,{className:`react-paint-editor-layouts-row`,children:[/* @__PURE__ */ y(`span`,{className:`react-paint-editor-layouts-subtitle`,children:`Grid`}),/* @__PURE__ */ y(D,{"aria-label":`No grid`,icon:U,className:`react-paint-editor-layouts-grid-button`,selected:u===`none`,disabled:e,onClick:()=>h(`none`)}),[`small`,`medium`,`large`].map(t=>/* @__PURE__ */ y(D,{className:`react-paint-editor-layouts-grid-button`,selected:u===t,disabled:e,onClick:()=>h(t),children:t.charAt(0).toUpperCase()},t))]}),/* @__PURE__ */ y(`hr`,{}),/* @__PURE__ */ y(`div`,{className:`react-paint-editor-layouts`,children:c.length===0?/* @__PURE__ */ y(`div`,{className:`react-paint-editor-layouts-placeholder`,children:`No layer yet`}):c.map(t=>/* @__PURE__ */ y(ke,{shape:t,disabled:e,layoutDragging:d,setLayoutDragging:f,selected:p.has(t.id),handleSelect:a.selectShapes,handleRemove:a.removeShapes,onSwapShapes:a.swapShapes,toggleShapeVisibility:a.toggleShapesVisibility,toggleShapeLock:a.toggleShapesLock},t.id))})]})})})},Pe=({disabled:e,isLayoutPanelShown:t})=>t?/* @__PURE__ */ y(Ne,{disabled:e}):null,K=({children:e,onClose:t,position:n=`center`,title:r,className:i=``})=>/* @__PURE__ */ b(`div`,{className:`react-paint-editor-modal`,"data-position":n,style:{"--react-paint-editor-modal-zindex":x.PANEL},role:`dialog`,"aria-modal":`true`,"aria-labelledby":r,children:[/* @__PURE__ */ y(`div`,{className:`react-paint-editor-modal-mask`,onClick:t}),/* @__PURE__ */ y(`div`,{className:`react-paint-editor-modal-panel ${i}`,children:e})]}),Fe={},q=(e=``)=>(Fe[e]||(Fe[e]=0),`${e}${++Fe[e]}`),Ie=(e,t,n)=>Math.max(t,Math.min(e,n)),Le=e=>e.filter(e=>e!=null),Re=(e,t)=>({...e,...Object.fromEntries(Object.entries(t??{}).filter(([,e])=>e!==void 0))}),J=({selectedSettings:e,setSelectedSettings:t,title:n=`Choisissez une couleur`,mode:r=`fill`,disabled:i=!1,values:a,field:o,value:s=``,valueChanged:c})=>{let[l]=g(q(`settings_`)),u=e=>{let t=+e.target.value;c(o,Number.isNaN(t)?e.target.value:t)},d=e=>{c(o,e)},f=()=>{t(e=>e===l?void 0:l)},p=e===l;return a.length?/* @__PURE__ */ b(v,{children:[/* @__PURE__ */ y(D,{selected:p,title:n,disabled:i,onClick:f,icon:s===`transparent`?r===`fill`?me:pe:void 0,children:s!==`transparent`&&/* @__PURE__ */ y(`div`,{className:`react-paint-editor-colorfield-color`,"data-mode":r,style:{"--react-paint-editor-colorfield-color-value":s}})}),p&&/* @__PURE__ */ y(O,{title:n,alignment:`left`,position:`bottom`,children:/* @__PURE__ */ b(`div`,{className:`react-paint-editor-colorfield-wrapper`,children:[a.map(e=>/* @__PURE__ */ y(D,{title:e,selected:e===s,color:e,icon:e===`transparent`?r===`fill`?`<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>`:`<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>`:void 0,onClick:()=>d(e),children:e!==`transparent`&&/* @__PURE__ */ y(`div`,{className:`react-paint-editor-colorfield-color`,color:e,"data-mode":r,style:{"--react-paint-editor-colorfield-color-value":e}})},e)),/* @__PURE__ */ y(D,{type:`color`,title:`Custom color`,selected:s!==``&&!a.includes(s),value:s,onChange:u,children:/* @__PURE__ */ y(`div`,{className:`react-paint-editor-colorfield-customcolor`,style:{"--react-paint-editor-colorfield-color-value":a.includes(s)?`var(--react-paint-editor-app-font-color)`:s},children:/* @__PURE__ */ y(`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},ze=({disabled:e=!1,selectedShapeIds:t,removeShapes:n})=>/* @__PURE__ */ y(D,{title:`Delete`,disabled:e,"data-disabled":+e,onClick:()=>{n(t)},icon:N}),Y=({CustomOption:e,selectedSettings:t,setSelectedSettings:n,title:r=`Choisissez l'option`,disabled:i=!1,field:a,icon:o,values:s,defaultValue:c,valueChanged:l})=>{let[u]=g(q(`settings_`)),d=e=>{l(a,e)},f=()=>{n(e=>e===u?void 0:u)},p=t===u;return s.length?/* @__PURE__ */ b(v,{children:[/* @__PURE__ */ y(D,{selected:p,title:r,icon:o,disabled:i,onClick:f}),p&&/* @__PURE__ */ y(O,{title:r,alignment:`left`,fitContainer:!0,position:`bottom`,children:/* @__PURE__ */ y(`div`,{className:`react-paint-editor-selectfield-wrapper`,children:s.map(t=>/* @__PURE__ */ y(D,{title:`${t}`,onClick:()=>d(t),selected:c===t,style:{"--react-paint-editor-button-padding":`16px`},children:/* @__PURE__ */ y(e,{children:t})},t))})})]}):null},Be=({children:e})=>/* @__PURE__ */ y(`span`,{className:`react-paint-editor-fontfamily-option`,style:{"--react-paint-editor-fontfamily-family":e},children:e}),Ve=({selectedSettings:e,setSelectedSettings:t,disabled:n=!1,values:r,defaultValue:i,valueChanged:a})=>r.length?/* @__PURE__ */ y(Y,{selectedSettings:e,setSelectedSettings:t,CustomOption:Be,title:`Police`,icon:de,disabled:n,field:`fontFamily`,values:r,defaultValue:i,valueChanged:a}):null,He=({disabled:e,toggleLayoutPanel:t})=>/* @__PURE__ */ y(D,{title:`Toggle layers panel`,disabled:e,onClick:t,icon:F,className:`react-paint-editor-layout-button`}),Ue=({children:e})=>/* @__PURE__ */ b(`span`,{className:`react-paint-editor-linearrow-option`,"data-type":e,children:[/* @__PURE__ */ y(`span`,{className:`react-paint-editor-linearrow-left`}),/* @__PURE__ */ y(`span`,{className:`react-paint-editor-linearrow-right`})]}),We=({selectedSettings:e,setSelectedSettings:t,disabled:n=!1,values:r,defaultValue:i,valueChanged:a})=>r.length?/* @__PURE__ */ y(Y,{selectedSettings:e,setSelectedSettings:t,CustomOption:Ue,title:`Flèches`,icon:fe,disabled:n,field:`lineArrow`,values:r,defaultValue:i,valueChanged:a}):null,Ge=({children:e})=>/* @__PURE__ */ b(`span`,{className:`react-paint-editor-linetype-option`,"data-type":e,children:[/* @__PURE__ */ y(`span`,{}),/* @__PURE__ */ y(`span`,{}),/* @__PURE__ */ y(`span`,{}),/* @__PURE__ */ y(`span`,{}),/* @__PURE__ */ y(`span`,{}),/* @__PURE__ */ y(`span`,{}),/* @__PURE__ */ y(`span`,{})]}),Ke=({selectedSettings:e,setSelectedSettings:t,disabled:n=!1,values:r,defaultValue:i,valueChanged:a})=>r.length?/* @__PURE__ */ y(Y,{selectedSettings:e,setSelectedSettings:t,CustomOption:Ge,icon:ue,title:`Type de traits`,disabled:n,field:`lineDash`,values:r,defaultValue:i,valueChanged:a}):null,qe=(e,t=500)=>{let n=h(null),r=d((...r)=>{n.current&&clearTimeout(n.current),n.current=setTimeout(()=>e(...r),t)},[e,t]);return f(()=>()=>{n.current&&clearTimeout(n.current)},[]),r},X=({selectedSettings:e,setSelectedSettings:t,title:n=`Choisissez l'intervalle`,icon:r,disabled:i=!1,field:a,value:o,min:s=1,max:c=20,step:l=1,unity:u=``,valueChanged:d,saveShapes:f})=>{let p=o===void 0,m=p?`N/A`:`${Math.round(o)}${u}`,[h]=g(q(`settings_`)),_=qe(f),x=e=>{let t=+e.target.value;d(a,Number.isNaN(t)?e.target.value:t,!1),_()},S=()=>{t(e=>e===h?void 0:h)},C=e===h;return s===c?null:/* @__PURE__ */ b(v,{children:[/* @__PURE__ */ y(D,{selected:C,title:n,disabled:i,icon:r,onClick:S}),C&&/* @__PURE__ */ y(O,{title:n,alignment:`left`,fitContainer:!0,position:`bottom`,children:/* @__PURE__ */ y(`div`,{children:/* @__PURE__ */ b(`label`,{className:`react-paint-editor-rangefield`,children:[/* @__PURE__ */ y(`input`,{type:`range`,min:s,max:c,step:l,value:o??(c+s)/2,"data-indeterminate":+p,onChange:x}),/* @__PURE__ */ y(`span`,{children:m})]})})})]})},Je=({children:e})=>/* @__PURE__ */ y(`span`,{children:e===0?`Non`:`Oui`}),Ye=[0,1],Xe=({selectedSettings:e,setSelectedSettings:t,disabled:n=!1,defaultValue:r,valueChanged:i})=>/* @__PURE__ */ y(Y,{selectedSettings:e,setSelectedSettings:t,CustomOption:Je,title:`Fermer les points`,icon:M,disabled:n,field:`closedPoints`,values:Ye,defaultValue:r,valueChanged:i}),Ze=({disabled:e=!1,className:t,toggleZoomPanel:n})=>/* @__PURE__ */ y(D,{title:`Toggle zoom panel`,disabled:e,onClick:n,icon:he,className:`${t?` ${t}`:``}`}),Z=({setSelectedSettings:e,disabled:t=!1,field:n,icon:r,title:i,values:a,value:o=!1,valueChanged:s})=>{let[c]=g(q(`settings_`));return a.length===2?/* @__PURE__ */ y(D,{onClick:()=>{e(e=>e===c?void 0:c),s(n,!o)},selected:o,disabled:t,icon:r,title:i}):null},Qe=40,$e=({activeTool:e,hasSelection:t,selectedStyle:n,selectedShapeTool:r,disabled:i,selectedSettings:a,setSelectedSettings:o,saveShapes:s,handleShapeStyleChange:c})=>t?r&&/* @__PURE__ */ b(v,{children:[`strokeColor`in r.settings&&!r.settings.strokeColor.hidden&&/* @__PURE__ */ y(J,{selectedSettings:a,setSelectedSettings:o,title:`Couleur du trait`,mode:`stroke`,disabled:i,field:`strokeColor`,value:n?.strokeColor,valueChanged:c,values:r.settings.strokeColor.values}),`fillColor`in r.settings&&!r.settings.fillColor.hidden&&/* @__PURE__ */ y(J,{selectedSettings:a,setSelectedSettings:o,title:`Couleur de fond`,disabled:i,field:`fillColor`,value:n?.fillColor,valueChanged:c,values:r.settings.fillColor.values}),`lineWidth`in r.settings&&!r.settings.lineWidth.hidden&&/* @__PURE__ */ y(X,{saveShapes:s,selectedSettings:a,setSelectedSettings:o,title:`Epaisseur du trait`,icon:`<svg><path d="M3.021 16V15H17V16ZM3.021 13.5V12H17V13.5ZM3 10.5V8.5H16.979V10.5ZM3.021 7V4H17V7Z"/></svg>`,disabled:i,field:`lineWidth`,value:n?.lineWidth,valueChanged:c,unity:`px`,min:r.settings.lineWidth.min,max:r.settings.lineWidth.max,step:r.settings.lineWidth.step}),`lineDash`in r.settings&&!r.settings.lineDash.hidden&&/* @__PURE__ */ y(Ke,{selectedSettings:a,setSelectedSettings:o,disabled:i,defaultValue:n?.lineDash,valueChanged:c,values:r.settings.lineDash.values}),`lineArrow`in r.settings&&!r.settings.lineArrow.hidden&&/* @__PURE__ */ y(We,{selectedSettings:a,setSelectedSettings:o,disabled:i,defaultValue:n?.lineArrow,valueChanged:c,values:r.settings.lineArrow.values}),`closedPoints`in r.settings&&!r.settings.closedPoints.hidden&&/* @__PURE__ */ y(Xe,{selectedSettings:a,setSelectedSettings:o,disabled:i,valueChanged:c,defaultValue:n?.closedPoints}),`fontFamily`in r.settings&&!r.settings.fontFamily.hidden&&/* @__PURE__ */ y(Ve,{selectedSettings:a,setSelectedSettings:o,disabled:i,valueChanged:c,values:r.settings.fontFamily.values,defaultValue:n?.fontFamily}),`fontBold`in r.settings&&!r.settings.fontBold.hidden&&/* @__PURE__ */ y(Z,{setSelectedSettings:o,disabled:i,field:`fontBold`,icon:`<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>`,title:`Gras`,valueChanged:c,values:r.settings.fontBold.values,value:n?.fontBold}),`fontItalic`in r.settings&&!r.settings.fontItalic.hidden&&/* @__PURE__ */ y(Z,{setSelectedSettings:o,disabled:i,field:`fontItalic`,icon:`<svg><path d="M4.167 16.667V14.083H6.979L10.229 5.917H7.5V3.333H15.833V5.917H13.021L9.771 14.083H12.5V16.667Z"/></svg>`,title:`Italique`,valueChanged:c,values:r.settings.fontItalic.values,value:n?.fontItalic}),`opacity`in r.settings&&!r.settings.opacity.hidden&&/* @__PURE__ */ y(X,{saveShapes:s,selectedSettings:a,setSelectedSettings:o,title:`Opacité`,icon:`<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>`,min:r.settings.opacity.min,max:r.settings.opacity.max,step:r.settings.opacity.step,unity:`%`,disabled:i,field:`opacity`,value:n?.opacity,valueChanged:c})]}):`settings`in e?/* @__PURE__ */ b(v,{children:[`strokeColor`in e.settings&&!e.settings.strokeColor.hidden&&/* @__PURE__ */ y(J,{selectedSettings:a,setSelectedSettings:o,title:`Couleur du trait`,mode:`stroke`,disabled:i,field:`strokeColor`,value:e.settings.strokeColor.default,valueChanged:c,values:e.settings.strokeColor.values}),`fillColor`in e.settings&&!e.settings.fillColor.hidden&&/* @__PURE__ */ y(J,{selectedSettings:a,setSelectedSettings:o,title:`Couleur de fond`,disabled:i,field:`fillColor`,value:e.settings.fillColor.default,valueChanged:c,values:e.settings.fillColor.values}),`lineWidth`in e.settings&&!e.settings.lineWidth.hidden&&/* @__PURE__ */ y(X,{saveShapes:s,selectedSettings:a,setSelectedSettings:o,title:`Epaisseur du trait`,disabled:i,field:`lineWidth`,icon:`<svg><path d="M3.021 16V15H17V16ZM3.021 13.5V12H17V13.5ZM3 10.5V8.5H16.979V10.5ZM3.021 7V4H17V7Z"/></svg>`,value:e.settings.lineWidth.default,valueChanged:c,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&&/* @__PURE__ */ y(Ke,{selectedSettings:a,setSelectedSettings:o,disabled:i,defaultValue:e.settings.lineDash.default,valueChanged:c,values:e.settings.lineDash.values}),`lineArrow`in e.settings&&!e.settings.lineArrow.hidden&&/* @__PURE__ */ y(We,{selectedSettings:a,setSelectedSettings:o,disabled:i,defaultValue:e.settings.lineArrow.default,valueChanged:c,values:e.settings.lineArrow.values}),`closedPoints`in e.settings&&!e.settings.closedPoints.hidden&&/* @__PURE__ */ y(Xe,{selectedSettings:a,setSelectedSettings:o,disabled:i,valueChanged:c,defaultValue:e.settings?.closedPoints.default}),`fontFamily`in e.settings&&!e.settings.fontFamily.hidden&&/* @__PURE__ */ y(Ve,{selectedSettings:a,setSelectedSettings:o,disabled:i,valueChanged:c,values:e.settings.fontFamily.values,defaultValue:e.settings.fontFamily.default}),`fontBold`in e.settings&&!e.settings.fontBold.hidden&&/* @__PURE__ */ y(Z,{setSelectedSettings:o,disabled:i,field:`fontBold`,icon:`<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>`,title:`Gras`,valueChanged:c,values:e.settings.fontBold.values,value:e.settings.fontBold.default}),`fontItalic`in e.settings&&!e.settings.fontItalic.hidden&&/* @__PURE__ */ y(Z,{setSelectedSettings:o,disabled:i,field:`fontItalic`,icon:`<svg><path d="M4.167 16.667V14.083H6.979L10.229 5.917H7.5V3.333H15.833V5.917H13.021L9.771 14.083H12.5V16.667Z"/></svg>`,title:`Italique`,valueChanged:c,values:e.settings.fontItalic.values,value:e.settings.fontItalic.default}),`opacity`in e.settings&&!e.settings.opacity.hidden&&/* @__PURE__ */ y(X,{saveShapes:s,selectedSettings:a,setSelectedSettings:o,title:`Opacité`,icon:`<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>`,min:e.settings.opacity.min,max:e.settings.opacity.max,step:e.settings.opacity.step,unity:`%`,disabled:i,field:`opacity`,value:e.settings.opacity.default,valueChanged:c})]}):null,et=()=>{let e;return t=>((e?.ids!==t.selectedShapeIds||e.tools!==t.tools)&&(e={ids:t.selectedShapeIds,tools:t.tools,tool:c(t.selection,t.tools)}),{width:t.view.displayWidth,activeTool:t.activeTool,selectedStyle:t.selection?.style,selectedShapeIds:t.selectedShapeIds,selectedShapeTool:e.tool})},tt=(e,t)=>e.width===t.width&&e.activeTool===t.activeTool&&e.selectedShapeIds===t.selectedShapeIds&&e.selectedShapeTool===t.selectedShapeTool&&n(e.selectedStyle,t.selectedStyle),nt=({disabled:e,withZoom:t,layersManipulation:n=!1,toggleLayoutPanel:r,isZoomPanelShown:a,setIsZoomPanelShown:s})=>{let c=o(),{actions:l}=c,[u]=g(et),{width:d,activeTool:f,selectedStyle:p,selectedShapeIds:m,selectedShapeTool:h}=i(c,u,tt),_=m.length>0,[x,S]=g(void 0),[C,w]=g(!1),T=()=>{w(e=>!e)},E=()=>{s(e=>!e)},O=(h?Object.keys(h.settings).length+1:`settings`in f?Object.keys(f.settings).length:0)+ +n+ +t,k=d<O*Qe,A=(e,t,n=!0)=>{m.length?l.setShapesStyle(m,{[e]:t},{save:n,updateTool:!0}):l.updateToolSettings(f.id,e,t)};return/* @__PURE__ */ b(v,{children:[/* @__PURE__ */ b(`div`,{className:`react-paint-editor-settings-bar`,children:[/* @__PURE__ */ b(`div`,{className:`react-paint-editor-settings-shrinkable`,children:[t&&/* @__PURE__ */ y(Ze,{className:a?`react-paint-editor-bar-zoom-button-opened`:void 0,toggleZoomPanel:E}),k&&O>2&&/* @__PURE__ */ y(D,{disabled:e,onClick:T,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>`}),_?h&&/* @__PURE__ */ b(v,{children:[!k&&/* @__PURE__ */ y($e,{saveShapes:l.saveShapes,activeTool:f,hasSelection:_,selectedStyle:p,selectedShapeTool:h,disabled:e,selectedSettings:x,setSelectedSettings:S,handleShapeStyleChange:A}),f.type===`selection`&&/* @__PURE__ */ y(ze,{disabled:e,selectedShapeIds:m,removeShapes:l.removeShapes})]}):!k&&/* @__PURE__ */ y($e,{saveShapes:l.saveShapes,activeTool:f,hasSelection:_,selectedStyle:p,selectedShapeTool:h,disabled:e,selectedSettings:x,setSelectedSettings:S,handleShapeStyleChange:A})]}),/* @__PURE__ */ y(`div`,{className:`react-paint-editor-settings-separator`}),n&&/* @__PURE__ */ y(He,{disabled:e,toggleLayoutPanel:r})]}),C&&/* @__PURE__ */ y(K,{className:`react-paint-editor-settings-modal`,onClose:T,position:`bottom`,title:`Settings`,children:/* @__PURE__ */ y($e,{saveShapes:l.saveShapes,activeTool:f,hasSelection:_,selectedStyle:p,selectedShapeTool:h,disabled:e,selectedSettings:x,setSelectedSettings:S,handleShapeStyleChange:A})})]})},rt=({isEditMode:e})=>{let t=o(),{actions:n}=t,r=i(t,e=>e.view.zoom);return/* @__PURE__ */ b(O,{alignment:`left`,position:`bottom`,className:`react-paint-editor-layouts-panel`,"data-edit":+e,children:[/* @__PURE__ */ y(D,{"aria-label":`Zoom out`,className:`react-paint-editor-zoom-button`,icon:ge,disabled:r<=s[0],onClick:()=>n.setZoom(`unzoom`)}),/* @__PURE__ */ b(D,{className:`react-paint-editor-zoom-button react-paint-editor-zoom-button-value`,onClick:()=>n.setZoom(`default`),children:[Math.round(r*100),`%`]}),/* @__PURE__ */ y(D,{"aria-label":`Zoom in`,className:`react-paint-editor-zoom-button`,icon:he,disabled:r>=s[s.length-1],onClick:()=>n.setZoom(`zoom`)})]})},it=(e,t)=>Le(t.flatMap(t=>{if(typeof t!=`object`)return e.filter(e=>e.type===t);let n=e.filter(e=>t.toolsType.includes(e.type));return n?{...t,toolsType:n}:null})),at=({alignment:e,children:t,className:n,style:r,position:i,menuRef:a})=>/* @__PURE__ */ y(O,{alignment:e,position:i,className:n,style:r,children:/* @__PURE__ */ y(`div`,{className:`react-paint-editor-menu`,role:`menu`,ref:a,children:t})}),ot=({disabled:e=!1,withText:t=!1,loadFile:n,type:r,accept:i})=>{let a=h(null);return/* @__PURE__ */ y(D,{ref:a,type:`file`,onClick:()=>{a.current&&(a.current.value=``)},onChange:e=>{let t=e.target.files?.item(0);t&&n(t)},accept:i,title:r.label,icon:r.icon,disabled:e,children:t?r.label:void 0})},st=(e,t)=>!(e.target instanceof Node)||!t?!1:t.contains(e.target),ct=({trigger:e=`click`,disabled:t=!1}={})=>{let[n,r]=g(null),[i,a]=g(!1),[,o]=_(),s=d(()=>{o(()=>{a(!1)})},[]);return f(()=>{if(!n||t)return;if(i){let t=e=>{st(e,n)||o(()=>{a(!1)})},r=()=>{o(()=>{a(!1)})};return e===`hover`?(n.addEventListener(`mouseleave`,r),()=>{n.removeEventListener(`mouseleave`,r)}):(document.addEventListener(`click`,t),()=>{document.removeEventListener(`click`,t)})}let r=()=>{o(()=>{a(!0)})};return e===`hover`?(n.addEventListener(`mouseenter`,r),()=>{n.removeEventListener(`mouseenter`,r)}):(n.addEventListener(`click`,r),()=>{n.removeEventListener(`click`,r)})},[n,i,t,e]),{ref:r,isOpen:i,trigger:e,closeMenu:s}},Q=({type:e,withText:t=!1,disabled:n=!1,onClick:r})=>/* @__PURE__ */ y(D,{disabled:n,onClick:()=>{r()},title:e.label,icon:e.icon,"data-testid":`tool-${e.type}`,children:t?e.label:void 0}),lt=({withActionsInMenu:e,hasActionToUndo:t=!1,hasActionToRedo:n=!1,hasActionToClear:r=!1,undoAction:i,redoAction:a,clearCanvas:o,disabled:s=!1,withLoadAndSave:c,withExport:l,addPicture:u,loadFile:d,togglePictureUrlModal:f,saveFile:p,toggleExportModal:m,withUploadPicture:h,withUrlPicture:g})=>{let{ref:_,isOpen:x,closeMenu:S}=ct(),C=e=>async(...t)=>{await e(...t),S()};return e||h||g||c||l?/* @__PURE__ */ y(`div`,{className:`react-paint-editor-toolbox-relative`,children:/* @__PURE__ */ b(`div`,{ref:_,children:[/* @__PURE__ */ y(D,{title:`Menu`,disabled:s,icon:ie}),x&&/* @__PURE__ */ b(at,{alignment:`right`,position:`top`,children:[e&&/* @__PURE__ */ b(v,{children:[/* @__PURE__ */ y(Q,{withText:!0,type:be,disabled:s||!t,onClick:C(i)}),/* @__PURE__ */ y(Q,{withText:!0,type:xe,disabled:s||!n,onClick:C(a)}),/* @__PURE__ */ y(Q,{withText:!0,type:Se,disabled:s||!r,onClick:C(o)}),(h||g||c)&&/* @__PURE__ */ y(`hr`,{})]}),h&&/* @__PURE__ */ y(ot,{withText:!0,type:Ee,disabled:s,loadFile:C(u),accept:`image/png, image/gif, image/jpeg, image/svg+xml, image/webp`}),g&&/* @__PURE__ */ y(D,{disabled:s,selected:!1,onClick:C(f),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`}),(h||g)&&c&&/* @__PURE__ */ y(`hr`,{}),c&&/* @__PURE__ */ b(v,{children:[/* @__PURE__ */ y(ot,{withText:!0,type:we,disabled:s,loadFile:C(d),accept:`application/JSON`}),/* @__PURE__ */ y(Q,{withText:!0,disabled:s,type:Te,onClick:C(p)})]}),l&&/* @__PURE__ */ y(Q,{withText:!0,disabled:s,type:Ce,onClick:C(m)})]})]})}):null},ut=({togglePictureUrlModal:e,addPicture:t})=>{let n=h(null);return f(()=>{n.current&&n.current.focus()},[]),/* @__PURE__ */ y(K,{className:`react-paint-editor-toolbox-pictureinput-modal`,onClose:e,title:`Add picture from URL`,children:/* @__PURE__ */ b(`form`,{onSubmit:async r=>{r.preventDefault();let i=n.current?.value;i&&(await t(i),e())},children:[/* @__PURE__ */ b(`label`,{children:[`URL\xA0`,/* @__PURE__ */ y(`input`,{type:`text`,ref:n})]}),/* @__PURE__ */ y(D,{onClick:e,children:`Annuler`}),/* @__PURE__ */ y(D,{type:`submit`,selected:!0,children:`Ajouter`})]})})},$=({type:e,img:t,isActive:n,withText:r=!1,disabled:i=!1,setActive:a})=>/* @__PURE__ */ y(D,{disabled:i,selected:n,onClick:()=>{a(e)},title:e.label??e.type,icon:t,"data-testid":`tool-${e.type}`,children:r?e.label:void 0}),dt=`Choose export settings`,ft=({toggleExportModal:e,exportCanvasInFile:t})=>{let n=async n=>{t(n),e()};return/* @__PURE__ */ b(K,{className:`react-paint-editor-toolbox-export-modal`,onClose:e,title:dt,children:[/* @__PURE__ */ y(`h3`,{children:dt}),/* @__PURE__ */ y(`hr`,{}),/* @__PURE__ */ y(D,{onClick:()=>n(`currentZoom`),children:`Exporter la vue actuelle`}),/* @__PURE__ */ y(D,{onClick:()=>n(`defaultView`),children:`Exporter le canevas par défaut`}),/* @__PURE__ */ y(D,{onClick:()=>n(`fitToShapes`),children:`Exporter le dessin entier`}),/* @__PURE__ */ y(D,{selected:!0,onClick:e,children:`Annuler`})]})},pt=(e,t,n=!0)=>{f(()=>{if(!n)return;let r=n=>{st(n,e.current)||t()};return document.addEventListener(`pointerdown`,r),()=>document.removeEventListener(`pointerdown`,r)},[e,t,n])},mt=({activeTool:e,group:t,disabled:n=!1,setActiveToolFromId:r})=>{let i=h(null),[a,o]=g(!1),[,s]=_(),[c,l]=g(void 0),u=e=>{l(e),r(e.id)};if(pt(i,d(()=>o(!1),[]),a),`type`in t)return/* @__PURE__ */ y($,{disabled:n,type:t,img:t.icon,isActive:e.id===t.id,setActive:u});if(!t.toolsType.length)return null;if(t.toolsType?.length===1)return/* @__PURE__ */ y($,{disabled:n,type:t.toolsType[0],img:t.toolsType[0].icon,isActive:e.id===t.toolsType[0].id,setActive:u});let f=t?.toolsType.find(t=>t.type===e.type)!==void 0,p=c?c.icon:t.toolsType?.[0]?.icon;return/* @__PURE__ */ b(`div`,{className:`react-paint-editor-toolbargroup-relative`,children:[/* @__PURE__ */ y(D,{selected:f,title:t.title,disabled:n,onClick:()=>{c?r(c.id):t.toolsType?.[0]&&u(t.toolsType[0]),s(()=>{o(!0)})},icon:p,children:p===void 0?t.title:void 0}),a&&/* @__PURE__ */ y(O,{alignment:`center`,position:`top`,children:/* @__PURE__ */ y(`div`,{className:`react-paint-editor-toolbargroup-panel-content`,"data-vertical":+t.vertical,ref:i,children:t.toolsType.map(t=>/* @__PURE__ */ y($,{disabled:n,type:t,img:t.icon,isActive:e.id===t.id,setActive:u},t.id))})})]})},ht=40,gt=[{title:`brush`,toolsType:[`brush`],vertical:!1},{title:`lines`,toolsType:[`line`,`curve`,`polygon`],vertical:!1},{title:`shapes`,toolsType:[`rect`,`square`,`circle`,`ellipse`],vertical:!1},`text`],_t=e=>({activeTool:e.activeTool,tools:e.tools,history:e.history,width:e.view.displayWidth}),vt=({disabled:e,withMoveTool:t,withLoadAndSave:r,withExport:a,addPicture:s,loadFile:c,saveFile:l,exportCanvasInFile:u,withUrlPicture:d,withUploadPicture:f})=>{let p=o(),{actions:h}=p,{activeTool:_,tools:x,history:S,width:C}=i(p,_t,n),w=m(()=>x.map(Oe),[x]),{canUndo:T,canRedo:E,canClear:O}=S,{undo:k,redo:A,clearCanvas:j}=h,M=it(w,gt),N=C<(6+M.length)*ht,te=C<(3+M.length)*ht,[P,F]=g(!1),[I,L]=g(!1),[R,z]=g(!1),B=()=>{F(e=>!e)},ne=()=>{L(!0)},re=()=>{L(e=>!e)},V=()=>{z(e=>!e)},H=e=>{h.selectTool(e),F(!1)},ie=w.find(e=>e.type===_.type)!==void 0;return/* @__PURE__ */ b(v,{children:[/* @__PURE__ */ b(`div`,{className:`react-paint-editor-toolbar-toolbox`,style:{"--react-paint-editor-toolbar-minwidth":`160px`},children:[/* @__PURE__ */ b(`div`,{className:`react-paint-editor-toolbar-shrinkable`,children:[/* @__PURE__ */ y($,{type:W,disabled:e,img:W.icon,isActive:_.id===W.id,setActive:()=>H(W.id)}),t&&/* @__PURE__ */ y($,{type:G,disabled:e,img:G.icon,isActive:_.id===G.id,setActive:()=>H(G.id)}),te?/* @__PURE__ */ y(D,{disabled:e,onClick:B,title:`Toggle tools`,icon:ee,selected:ie}):M.map(t=>/* @__PURE__ */ y(mt,{disabled:e,activeTool:_,group:t,setActiveToolFromId:H},`id`in t?t.id:t.title))]}),!N&&/* @__PURE__ */ b(v,{children:[/* @__PURE__ */ y(Q,{type:be,disabled:e||!T,onClick:k}),/* @__PURE__ */ y(Q,{type:xe,disabled:e||!E,onClick:A}),/* @__PURE__ */ y(Q,{type:Se,disabled:e||!O,onClick:j})]}),/* @__PURE__ */ y(lt,{withActionsInMenu:N,disabled:e,addPicture:s,loadFile:c,saveFile:l,togglePictureUrlModal:ne,toggleExportModal:V,withUploadPicture:f,withUrlPicture:d,withLoadAndSave:r,withExport:a,hasActionToUndo:T,hasActionToRedo:E,hasActionToClear:O,undoAction:k,redoAction:A,clearCanvas:j})]}),P&&/* @__PURE__ */ y(K,{className:`react-paint-editor-toolbar-modal`,onClose:B,title:`Outils`,children:w.map(t=>t.type===`picture`?null:/* @__PURE__ */ y($,{disabled:e,type:t,img:t.icon,withText:!1,isActive:_.id===t.id,setActive:()=>H(t.id)},t.id))}),I&&/* @__PURE__ */ y(ut,{togglePictureUrlModal:re,addPicture:s}),R&&/* @__PURE__ */ y(ft,{toggleExportModal:V,exportCanvasInFile:u})]})},yt={toolbarBackgroundColor:`white`,dividerColor:`#36418129`,fontRadius:8,fontDisabledColor:`#3641812b`,fontDisabledBackgroundColor:`transparent`,fontColor:`#364181`,fontBackgroundColor:`transparent`,fontSelectedColor:`white`,fontSelectedBackgroundColor:`#364181`,fontHoverColor:`#364181`,fontHoverBackgroundColor:`#afd8d8`,layersManipulation:!0,withExport:!0,withLoadAndSave:!0,withUploadPicture:!0,withUrlPicture:!1},bt=()=>{let e=h([]),[t,n]=g([]),r=d(e=>{n(t=>t.filter(t=>t.id!==e))},[]),i=d(({type:t=C.type,duration:i=C.duration,text:a})=>{let o={id:q(`snackbar_`),duration:i,type:t,text:a};n(e=>[...e,o]);let s=setTimeout(()=>{r(o.id),e.current=e.current.filter(e=>e!==s)},i);e.current=[...e.current,s]},[r]);return f(()=>()=>{for(let t of e.current)clearTimeout(t)},[]),{snackbarList:t,addSnackbar:i}},xt=36,St=16,Ct=176,wt=200,Tt=({contextMenu:e,containerRef:t,hasCopiedShapes:n,actions:r})=>{let{shapes:i,anchorIndex:a,canRemoveAnchor:o,clientPosition:s}=e,c=i.map(e=>e.id),l=i.length>0,u=i[0],d=!i.some(e=>e.visible===!1),p=i.some(e=>e.locked),{ref:m,isOpen:_}=ct({trigger:`hover`}),{ref:x,isOpen:S}=ct({trigger:`hover`,disabled:p}),C=16+xt*(2+(l?8:0)+ +!!o)+St*(l?3:1),[w,T]=g();f(()=>{let e=t.current?.getBoundingClientRect();if(!e)return;let n=Ie(s.x,0,window.innerWidth-Ct),r=Ie(s.y,0,window.innerHeight-C),i=n+Ct+wt>window.innerWidth?`left`:`right`;T({x:n-e.left,y:r-e.top,subMenuPosition:i})},[t,s.x,s.y,C]);let E=w?{"--react-paint-editor-toolbox-contextmenu-transform":`translate3D(${w.x}px, ${w.y}px, 0)`}:{display:`none`},O=h(null);pt(O,r.closeContextMenu);let k=e=>()=>{e(),r.closeContextMenu()},A=k(()=>{u&&a!==void 0&&r.removeShapePoint(u.id,a)}),ee=k(()=>r.removeShapes(c)),j=k(r.selectAllShapes),M=k(()=>r.duplicateShapes(c,{translate:!0,select:!0})),N=k(()=>r.cut(c)),te=k(()=>r.copy(c)),P=k(r.paste),F=e=>k(()=>r.moveShapes(c,e)),I=e=>k(()=>r.transformShapes(c,e)),L=k(()=>r.setShapesVisibility(c,!d)),R=k(()=>r.setShapesLocked(c,!p));return/* @__PURE__ */ b(at,{className:`react-paint-editor-toolbox-contextmenu`,style:E,menuRef:O,children:[l&&/* @__PURE__ */ b(v,{children:[o&&/* @__PURE__ */ y(D,{onClick:A,children:`Delete point`}),/* @__PURE__ */ b(`div`,{className:`react-paint-editor-toolbox-contextmenu-group`,ref:m,children:[/* @__PURE__ */ y(D,{icon:`<svg viewBox="0 -960 960 960"><path d="M504-480 320-664l56-56 240 240-240 240-56-56 184-184Z"/></svg>`,children:`Organize`}),_&&/* @__PURE__ */ b(at,{position:w?.subMenuPosition,children:[/* @__PURE__ */ y(D,{onClick:F(`forward`),children:`Move forward`}),/* @__PURE__ */ y(D,{onClick:F(`first`),children:`Put on first`}),/* @__PURE__ */ y(D,{onClick:F(`backward`),children:`Move backward`}),/* @__PURE__ */ y(D,{onClick:F(`last`),children:`Put on last`})]})]}),/* @__PURE__ */ b(`div`,{className:`react-paint-editor-toolbox-contextmenu-group`,ref:x,children:[/* @__PURE__ */ y(D,{icon:`<svg viewBox="0 -960 960 960"><path d="M504-480 320-664l56-56 240 240-240 240-56-56 184-184Z"/></svg>`,disabled:p,children:`Transform`}),S&&/* @__PURE__ */ b(at,{position:w?.subMenuPosition,children:[/* @__PURE__ */ y(D,{onClick:I(`flipHorizontally`),children:`Flip horizontally`}),/* @__PURE__ */ y(D,{onClick:I(`flipVertically`),children:`Flip vertically`}),/* @__PURE__ */ y(D,{onClick:I(`rotateClockwise`),children:`Rotate clockwise`}),/* @__PURE__ */ y(D,{onClick:I(`rotateCounterclockwise`),children:`Rotate counterclockwise`})]})]}),/* @__PURE__ */ y(`hr`,{}),/* @__PURE__ */ y(D,{onClick:N,children:`Cut`}),/* @__PURE__ */ y(D,{onClick:te,children:`Copy`})]}),/* @__PURE__ */ y(D,{onClick:P,disabled:!n,children:`Paste`}),/* @__PURE__ */ y(`hr`,{}),l&&/* @__PURE__ */ b(v,{children:[/* @__PURE__ */ y(D,{onClick:M,children:`Duplicate`}),/* @__PURE__ */ y(D,{onClick:L,children:d?`Hide`:`Show`}),/* @__PURE__ */ y(D,{onClick:R,children:p?`Unlock`:`Lock`}),/* @__PURE__ */ y(D,{onClick:ee,children:`Delete`}),/* @__PURE__ */ y(`hr`,{})]}),/* @__PURE__ */ y(D,{onClick:j,children:`Select all`})]})},Et=({containerRef:e})=>{let t=o(),n=i(t,e=>e.contextMenu),r=i(t,e=>e.clipboard.hasContent);return n?/* @__PURE__ */ y(Tt,{contextMenu:n,containerRef:e,hasCopiedShapes:r,actions:t.actions}):null},Dt=e=>({mode:e.mode,features:e.features,layout:e.layout,width:e.width}),Ot=({paint:t,className:r,style:a,options:o,children:s})=>{let{actions:c,scopeRef:l}=t,{mode:u,features:p,layout:m,width:_}=i(t,Dt,n),{toolbarBackgroundColor:x,dividerColor:C,fontRadius:w,fontDisabledColor:E,fontDisabledBackgroundColor:D,fontColor:O,fontBackgroundColor:k,fontSelectedColor:A,fontSelectedBackgroundColor:ee,fontHoverColor:j,fontHoverBackgroundColor:M,layersManipulation:N,withExport:te,withLoadAndSave:P,withUploadPicture:F,withUrlPicture:I}=Re(yt,o),L=u!==`viewer`,R=!p.edition,z=m.size===`infinite`||p.zoom,B=h(null),ne=d(e=>{B.current=e,l(e)},[l]),[re,V]=g(!1),[H,ie]=g(!1),[ae,oe]=g(z),se=z&&ae,{snackbarList:ce,addSnackbar:U}=bt(),le=d(e=>{V(!0);try{c.exportPicture({view:e})}catch(e){e instanceof Error&&U({type:`error`,text:`L'export a échoué : ${e.message}`}),console.warn(e)}finally{V(!1)}},[c,U]),ue=d(()=>{V(!0);try{c.exportData(),V(!1)}catch(e){e instanceof Error&&U({type:`error`,text:`L'enregistrement a échoué`}),console.warn(e)}finally{V(!1)}},[c,U]),de=d(async e=>{V(!0);try{await c.loadFile(e),U({type:`success`,text:`Fichier chargé !`})}catch(e){e instanceof Error&&U({type:`error`,text:`Le chargement a échoué`}),console.warn(e)}finally{V(!1)}},[c,U]),fe=d(async e=>{V(!0);try{await c.addPicture(e)}catch(e){e instanceof Error&&U({type:`error`,text:`Le chargement a échoué`}),console.warn(e)}finally{V(!1)}},[c,U]);f(()=>t.registerEvent(`pictureDropFailed`,()=>U({type:`error`,text:`Le chargement a échoué`})),[t,U]);let pe=qe(d(()=>U({type:`error`,text:`Certaines images n'ont pas pu être chargées`}),[U]),0);f(()=>t.registerEvent(`pictureLoadFailed`,pe),[t,pe]),f(()=>{if(!F)return c.setOptions({withDropPicture:!1}),()=>c.setOptions({withDropPicture:void 0})},[c,F]);let me=`${r?`${r} `:``}${H?`react-paint-editor-layout-opened `:``}react-paint-editor-app`;return/* @__PURE__ */ y(`div`,{ref:ne,className:me,"data-resize":m.resize,style:{"--react-paint-editor-app-canvasWidth":`calc(var(--react-paint-app-canvaswidth, ${_}) * 1px)`,"--react-paint-editor-app-toolbar-bg":x,"--react-paint-editor-app-divider-color":C,"--react-paint-editor-app-font-radius":`${w}px`,"--react-paint-editor-app-font-disabled-color":E,"--react-paint-editor-app-font-disabled-bg":D,"--react-paint-editor-app-font-color":O,"--react-paint-editor-app-font-bg":k,"--react-paint-editor-app-font-selected-color":A,"--react-paint-editor-app-font-selected-bg":ee,"--react-paint-editor-app-font-hover-color":j,"--react-paint-editor-app-font-hover-bg":M,...a},children:/* @__PURE__ */ b(e,{paint:t,children:[L&&/* @__PURE__ */ y(vt,{disabled:R,withMoveTool:z,exportCanvasInFile:le,saveFile:ue,loadFile:de,addPicture:fe,withExport:te,withLoadAndSave:P,withUploadPicture:F,withUrlPicture:I}),s,L&&N&&/* @__PURE__ */ y(Pe,{isLayoutPanelShown:H,disabled:R}),se&&/* @__PURE__ */ y(rt,{isEditMode:L}),L&&/* @__PURE__ */ b(v,{children:[/* @__PURE__ */ y(nt,{disabled:R,withZoom:z,layersManipulation:N,toggleLayoutPanel:()=>{ie(e=>!e)},isZoomPanelShown:se,setIsZoomPanelShown:oe}),/* @__PURE__ */ y(S,{isLoading:re}),/* @__PURE__ */ y(T,{snackbarList:ce})]}),/* @__PURE__ */ y(Et,{containerRef:B})]})})};export{yt as n,Ot as t};

package/dist/canvas/components/Canvas.d.ts

@@ -1,4 +1,16 @@
-import React from 'react';
-import './Canvas.css';
-declare const Canvas: React.ForwardRefExoticComponent<React.RefAttributes<HTMLCanvasElement>>;
+import type { PaintStore } from './../../canvas/store/paintStore.js';
+import type { CanvasView } from './../../canvas/store/selectors.js';
+import type React from 'react';
+type CanvasElementProps = {
+    store: PaintStore;
+    view: CanvasView;
+    backgroundColor: string;
+    selectionColor: string;
+    selectionWidth: number;
+};
+/**
+ * Canvases of the drawing and of the selection. React only renders what changes the DOM (sizes, mode, text edition):
+ * the gestures update the store, which draws the canvases and sets the cursor directly.
+ */
+declare const Canvas: ({ store, view, backgroundColor, selectionColor, selectionWidth }: CanvasElementProps) => React.JSX.Element;
 export default Canvas;

package/dist/canvas/components/EditTextBox.d.ts

@@ -1,6 +1,6 @@
-import type { UtilsSettings } from './../../canvas/constants/app';
-import type { ShapeEntity } from './../../common/types/Shapes';
-import './EditTextBox.css';
+import type { UtilsSettings } from './../../canvas/constants/app.js';
+import type { ShapeEntity } from './../../canvas/types/Shapes.js';
+import type React from 'react';
 type EditTextBoxType = {
     disabled?: boolean;
     shape: ShapeEntity<'text'>;
@@ -9,5 +9,5 @@ type EditTextBoxType = {
     updateValue: (newValue: string[]) => void;
     saveShapes: () => void;
 };
-declare const EditTextBox: ({ disabled, shape, defaultValue, updateValue, saveShapes, settings }: EditTextBoxType) => import("react/jsx-runtime").JSX.Element;
+declare const EditTextBox: ({ disabled, shape, defaultValue, updateValue, saveShapes, settings }: EditTextBoxType) => React.JSX.Element;
 export default EditTextBox;

package/dist/canvas/constants/app.d.ts

@@ -1,35 +1,50 @@
-import type { Size } from './../../common/types/Canvas';
-import type { ExportedDrawableShape } from './../../common/types/Shapes';
-import type { CustomToolInput } from './../../common/types/tools';
-import type { RecursivePartial } from './../../common/types/utils';
+import type { Resize, Size } from './../../canvas/types/Canvas.js';
+import type { ShapeInput } from './../../canvas/types/Shapes.js';
+import type { CustomToolInput } from './../../canvas/types/tools.js';
+import type { RecursivePartial } from './../../canvas/types/utils.js';
 export declare const APP_NAME = "react_paint";
 export declare const DRAWCANVAS_CLASSNAME = "react-paint-canvas-drawcanvas";
 export declare const SELECTIONCANVAS_CLASSNAME = "react-paint-canvas-selectioncanvas";
-import type { BrushAlgo } from './../../common/types/Settings';
-export type { BrushAlgo, UtilsSettings } from './../../common/types/Settings';
-type AppOptionsType = {
-    layersManipulation: boolean;
+import type { BrushAlgo } from './../../canvas/types/Settings.js';
+export type { BrushAlgo, UtilsSettings } from './../../canvas/types/Settings.js';
+/** Largest data file read by loadFile, in bytes */
+export declare const DATA_FILE_MAX_SIZE: number;
+/**
+ * Receives the absolute URL of a remote picture before it is fetched, and returns the URL to fetch instead, or null to
+ * refuse the picture. The source kept in the shape and in the exported data is not changed
+ */
+export type PictureSrcResolver = (url: string) => string | null | Promise<string | null>;
+export type AppOptions = {
     grid: number;
-    canGrow: boolean;
-    canShrink: boolean;
     availableTools: CustomToolInput[];
-    withExport: boolean;
-    withLoadAndSave: boolean;
-    withUploadPicture: boolean;
-    withUrlPicture: boolean;
     withFrameSelection: boolean;
     withSkeleton: boolean;
     withContextMenu: boolean;
-    clearCallback: 'empty' | 'defaultShapes' | (() => ExportedDrawableShape[]);
+    /** Adds the image files dropped on the canvas as pictures, when the picture tool is available */
+    withDropPicture: boolean;
+    clearCallback: 'empty' | 'defaultShapes' | (() => ShapeInput[]);
+    /** Filters or rewrites the URLs of the remote pictures, which may come from data drawn by someone else */
+    resolvePictureSrc: PictureSrcResolver | undefined;
     brushAlgo: BrushAlgo;
     isBrushShapeDoneOnMouseUp: boolean;
     canvasSelectionPadding: number;
     size: Size;
+    /**
+     * 'scaleDown', 'scale', 'scaleUp' and 'none' keep the width and the height and show the whole drawing, scaled to the
+     * width of the container within their bounds. 'extend' fills the container at the scale 1: the visible area follows it
+     */
+    resize: Resize;
+    /** Always 'always' with an infinite size */
     canZoom: 'never' | 'always';
     debug: boolean;
 };
-export type OptionalOptions = RecursivePartial<AppOptionsType>;
-export declare const DEFAULT_OPTIONS: AppOptionsType;
+export type OptionalOptions = RecursivePartial<AppOptions>;
+export declare const DEFAULT_OPTIONS: AppOptions;
+export type CanvasOptions = {
+    canvasBackgroundColor?: string | undefined;
+    canvasSelectionColor?: string | undefined;
+    canvasSelectionWidth?: number | undefined;
+};
 export declare const DEFAULT_CANVAS_OPTIONS: {
     canvasBackgroundColor: string;
     canvasSelectionColor: string;

package/dist/canvas/constants/grid.d.ts

@@ -1 +1,8 @@
 export declare const GRID_ROTATION_STEPS = 18;
+/** Gaps of the grid offered by the Editor: give one of them to setGridGap. 0 hides the grid */
+export declare const GRID_PRESETS: {
+    readonly none: 0;
+    readonly small: 10;
+    readonly medium: 20;
+    readonly large: 40;
+};

package/dist/canvas/constants/picture.d.ts

@@ -1 +1,9 @@
 export declare const PICTURE_DEFAULT_SIZE = 300;
+/** Delay after which the loading of a picture fails, in milliseconds */
+export declare const PICTURE_LOAD_TIMEOUT = 4000;
+/** Largest width or height of the image of a picture, in pixels: the usual limit of a canvas, where it is drawn and encoded */
+export declare const PICTURE_MAX_SIZE = 16384;
+/** Types of the image files accepted as a picture: the file input of the editor (MenuGroup) lists the same ones */
+export declare const PICTURE_MIME_TYPES: string[];
+/** Gap between the pictures added together by a drop, in the units of the drawing */
+export declare const PICTURE_DROP_GAP = 20;

package/dist/canvas/constants/shapes.d.ts

@@ -1,10 +1,10 @@
-import type { Point } from './../../common/types/Shapes';
+import type { Point } from './../../canvas/types/Shapes.js';
 export declare const SELECTION_DEFAULT_PADDING = 0;
 export declare const SELECTION_DEFAULT_WIDTH = 2;
 export declare const SELECTION_DEFAULT_COLOR = "blue";
 export declare const SELECTION_ANCHOR_SIZE = 14;
 export declare const SELECTION_ROTATED_ANCHOR_POSITION = 16;
 export declare const SELECTION_RESIZE_ANCHOR_POSITIONS: Point[];
-export declare const ShapeTypeArray: readonly ["brush", "rect", "square", "line", "polygon", "circle", "curve", "ellipse", "picture", "text", "triangle", "group"];
 export declare const SHAPES_WITH_ROTATION: string[];
 export declare const SHAPES_KEEPING_RATIO: string[];
+export declare const ShapeTypeArray: readonly ["brush", "rect", "square", "line", "polygon", "circle", "curve", "ellipse", "picture", "text", "triangle", "group"];

package/dist/canvas/constants/tools.d.ts

@@ -1,4 +1,14 @@
-import type { ActionsTool, ToolsRectSettings } from './../../common/types/tools';
+import type { ActionsTool, CustomToolInput, ToolsRectSettings } from './../../canvas/types/tools.js';
+/**
+ * Tools handled by the canvas besides the drawing tools. Like them, they hold no visual data:
+ * an editor gives them an icon and a label, and selects them by id.
+ */
 export declare const SELECTION_TOOL: ActionsTool;
+export declare const MOVE_TOOL: ActionsTool;
 export declare const PICTURE_TOOL_ID = "react-paint-picture";
-export declare const CANVAS_DEFAULT_RECT_SETTINGS: ToolsRectSettings;
+export declare const SETTINGS_DEFAULT_RECT: ToolsRectSettings;
+/**
+ * Default drawing tools. They hold the logic needed by the canvas (type and settings) but no visual data:
+ * icon and label are optional and resolved by the editor from the tool type when missing.
+ */
+export declare const DEFAULT_TOOLS: CustomToolInput[];