var tn=Object.create;var ge=Object.defineProperty,nn=Object.defineProperties,on=Object.getOwnPropertyDescriptor,rn=Object.getOwnPropertyDescriptors,sn=Object.getOwnPropertyNames,He=Object.getOwnPropertySymbols,an=Object.getPrototypeOf,je=Object.prototype.hasOwnProperty,et=Object.prototype.propertyIsEnumerable;var Fe=(r,e,t)=>e in r?ge(r,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):r[e]=t,T=(r,e)=>{for(var t in e||(e={}))je.call(e,t)&&Fe(r,t,e[t]);if(He)for(var t of He(e))et.call(e,t)&&Fe(r,t,e[t]);return r},$=(r,e)=>nn(r,rn(e)),tt=r=>ge(r,"__esModule",{value:!0});var O=(r,e)=>{var t={};for(var n in r)je.call(r,n)&&e.indexOf(n)<0&&(t[n]=r[n]);if(r!=null&&He)for(var n of He(r))e.indexOf(n)<0&&et.call(r,n)&&(t[n]=r[n]);return t};var dn=(r,e)=>{for(var t in e)ge(r,t,{get:e[t],enumerable:!0})},nt=(r,e,t,n)=>{if(e&&typeof e=="object"||typeof e=="function")for(let o of sn(e))!je.call(r,o)&&(t||o!=="default")&&ge(r,o,{get:()=>e[o],enumerable:!(n=on(e,o))||n.enumerable});return r},L=(r,e)=>nt(tt(ge(r!=null?tn(an(r)):{},"default",!e&&r&&r.__esModule?{get:()=>r.default,enumerable:!0}:{value:r,enumerable:!0})),r),ln=(r=>(e,t)=>r&&r.get(e)||(t=nt(tt({}),e,1),r&&r.set(e,t),t))(typeof WeakMap!="undefined"?new WeakMap:0);var B=(r,e,t)=>(Fe(r,typeof e!="symbol"?e+"":e,t),t);var Qn={};dn(Qn,{HTMLContainer:()=>qn,Inputs:()=>C,Renderer:()=>Zn,SVGContainer:()=>J,SnapPoints:()=>Ze,TLBoundsCorner:()=>ve,TLBoundsEdge:()=>ye,TLPerformanceMode:()=>_e,TLShapeUtil:()=>ze,Utils:()=>S,inputs:()=>Fn});var A=L(require("react"));var Y=L(require("react"));var V=L(require("react"));var Ue=L(require("react"));var Ie=L(require("react")),Le=Ie.createContext({});function R(){return Ie.useContext(Le)}var Ke=require("@tldraw/vec"),rt=require("@use-gesture/react"),j=L(require("react"));var h=require("@tldraw/vec");var _e=(o=>(o.TransformSelected="transform_selected",o.TranslateSelected="translate_selected",o.TransformAll="transform_all",o.TranslateAll="translate_all",o))(_e||{}),ye=(o=>(o.Top="top_edge",o.Right="right_edge",o.Bottom="bottom_edge",o.Left="left_edge",o))(ye||{}),ve=(o=>(o.TopLeft="top_left_corner",o.TopRight="top_right_corner",o.BottomRight="bottom_right_corner",o.BottomLeft="bottom_left_corner",o))(ve||{}),Ze=(a=>(a.minX="minX",a.midX="midX",a.maxX="maxX",a.minY="minY",a.midY="midY",a.maxY="maxY",a))(Ze||{});String.prototype.replaceAll||(String.prototype.replaceAll=function(r,e){return Object.prototype.toString.call(r).toLowerCase()==="[object regexp]"?this.replace(r,e):this.replace(new RegExp(r,"g"),e)});var Me=Math.PI*2,K=class{static lerp(e,t,n){return n=K.clamp(n,0,1),e*(1-n)+t*n}static lerpColor(e,t,n=.5){function o(l){let u=/^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(l);return[parseInt(u[1],16),parseInt(u[2],16),parseInt(u[3],16)]}function i(l){return"#"+((1<<24)+(l[0]<<16)+(l[1]<<8)+l[2]).toString(16).slice(1)}let a=o(e)||[0,0,0],s=o(t)||[0,0,0],d=a.slice();for(let l=0;l<3;l++)d[l]=Math.round(d[l]+n*(s[l]-a[l]));return i(d)}static modulate(e,t,n,o=!1){let[i,a]=t,[s,d]=n,l=s+(e-i)/(a-i)*(d-s);return o?s<d?Math.max(Math.min(l,d),s):Math.max(Math.min(l,s),d):l}static clamp(e,t,n){return Math.max(t,typeof n!="undefined"?Math.min(e,n):e)}static deepClone(e){if(e===null)return e;if(Array.isArray(e))return[...e];if(typeof e=="object"){let t=T({},e);return Object.keys(t).forEach(n=>t[n]=typeof e[n]=="object"?K.deepClone(e[n]):e[n]),t}return e}static rng(e=""){let t=0,n=0,o=0,i=0;function a(){let s=t^t<<11;return t=n,n=o,o=i,i^=(i>>>19^s^s>>>8)>>>0,i/4294967296}for(let s=0;s<e.length+64;s++)t^=e.charCodeAt(s)|0,a();return a}static pointsToLineSegments(e,t=!1){let n=[];for(let o=1;o<e.length;o++)n.push([e[o-1],e[o]]);return t&&n.push([e[e.length-1],e[0]]),n}static getRectangleSides(e,t,n=0){let o=[e[0]+t[0]/2,e[1]+t[1]/2],i=h.Vec.rotWith(e,o,n),a=h.Vec.rotWith(h.Vec.add(e,[t[0],0]),o,n),s=h.Vec.rotWith(h.Vec.add(e,t),o,n),d=h.Vec.rotWith(h.Vec.add(e,[0,t[1]]),o,n);return[["top",[i,a]],["right",[a,s]],["bottom",[s,d]],["left",[d,i]]]}static circleFromThreePoints(e,t,n){let[o,i]=e,[a,s]=t,[d,l]=n,u=o*(s-l)-i*(a-d)+a*l-d*s,m=(o*o+i*i)*(l-s)+(a*a+s*s)*(i-l)+(d*d+l*l)*(s-i),c=(o*o+i*i)*(a-d)+(a*a+s*s)*(d-o)+(d*d+l*l)*(o-a),p=-m/(2*u),y=-c/(2*u);return[p,y,Math.hypot(p-o,y-i)]}static perimeterOfEllipse(e,t){let n=Math.pow(e-t,2)/Math.pow(e+t,2);return Math.PI*(e+t)*(1+3*n/(10+Math.sqrt(4-3*n)))}static shortAngleDist(e,t){let n=Math.PI*2,o=(t-e)%n;return 2*o%n-o}static longAngleDist(e,t){return Math.PI*2-K.shortAngleDist(e,t)}static lerpAngles(e,t,n){return e+K.shortAngleDist(e,t)*n}static angleDelta(e,t){return K.shortAngleDist(e,t)}static getSweep(e,t,n){return K.angleDelta(h.Vec.angle(e,t),h.Vec.angle(e,n))}static clampRadians(e){return(Math.PI*2+e)%(Math.PI*2)}static snapAngleToSegments(e,t){let n=Math.PI*2/t;return Math.floor((K.clampRadians(e)+n/2)/n)*n}static isAngleBetween(e,t,n){if(n===e||n===t)return!0;let o=(t-e+Me)%Me,i=(n-e+Me)%Me;return o<=Math.PI!=i>o}static degreesToRadians(e){return e*Math.PI/180}static radiansToDegrees(e){return e*180/Math.PI}static getArcLength(e,t,n,o){let i=K.getSweep(e,n,o);return t*(2*Math.PI)*(i/(2*Math.PI))}static getSweepFlag(e,t,n){let o=h.Vec.angle(e,n);return(h.Vec.angle(e,t)-o+3*Math.PI)%(2*Math.PI)-Math.PI>0?0:1}static getLargeArcFlag(e,t,n){let o=h.Vec.angle(n,e),a=(h.Vec.angle(n,t)-o+3*Math.PI)%(2*Math.PI)-Math.PI;return Math.abs(a)>Math.PI/2?0:1}static getArcDashOffset(e,t,n,o,i){let a=K.getSweepFlag(e,n,o),s=K.getArcLength(e,t,n,o);return-(a<0?s:2*Math.PI*e[2]-s)/2+i}static getEllipseDashOffset(e,t){return-(2*Math.PI*e[2])/2+-t}static pointInCircle(e,t,n){return h.Vec.dist(e,t)<=n}static pointInEllipse(e,t,n,o,i=0){i=i||0;let a=Math.cos(i),s=Math.sin(i),d=h.Vec.sub(e,t),l=a*d[0]+s*d[1],u=s*d[0]-a*d[1];return l*l/(n*n)+u*u/(o*o)<=1}static pointInRect(e,t){return!(e[0]<t[0]||e[0]>e[0]+t[0]||e[1]<t[1]||e[1]>e[1]+t[1])}static pointInPolygon(e,t){let n=0;return t.forEach((o,i)=>{let a=t[(i+1)%t.length];o[1]<=e[1]?a[1]>e[1]&&h.Vec.cross(o,a,e)>0&&(n+=1):a[1]<=e[1]&&h.Vec.cross(o,a,e)<0&&(n-=1)}),n!==0}static pointInBounds(e,t){return!(e[0]<t.minX||e[0]>t.maxX||e[1]<t.minY||e[1]>t.maxY)}static pointInPolyline(e,t,n=3){for(let o=1;o<t.length;o++)if(h.Vec.distanceToLineSegment(t[o-1],t[o],e)<n)return!0;return!1}static getBoundsSides(e){return this.getRectangleSides([e.minX,e.minY],[e.width,e.height])}static expandBounds(e,t){return{minX:e.minX-t,minY:e.minY-t,maxX:e.maxX+t,maxY:e.maxY+t,width:e.width+t*2,height:e.height+t*2}}static boundsCollide(e,t){return!(e.maxX<t.minX||e.minX>t.maxX||e.maxY<t.minY||e.minY>t.maxY)}static boundsContain(e,t){return e.minX<t.minX&&e.minY<t.minY&&e.maxY>t.maxY&&e.maxX>t.maxX}static boundsContained(e,t){return K.boundsContain(t,e)}static boundsAreEqual(e,t){return!(t.maxX!==e.maxX||t.minX!==e.minX||t.maxY!==e.maxY||t.minY!==e.minY)}static getBoundsFromPoints(e,t=0){let n=1/0,o=1/0,i=-1/0,a=-1/0;if(e.length<2)n=0,o=0,i=1,a=1;else for(let[s,d]of e)n=Math.min(s,n),o=Math.min(d,o),i=Math.max(s,i),a=Math.max(d,a);return t!==0?K.getBoundsFromPoints(e.map(s=>h.Vec.rotWith(s,[(n+i)/2,(o+a)/2],t))):{minX:n,minY:o,maxX:i,maxY:a,width:Math.max(1,i-n),height:Math.max(1,a-o)}}static centerBounds(e,t){let n=this.getBoundsCenter(e),o=t[0]-n[0],i=t[1]-n[1];return this.translateBounds(e,[o,i])}static snapBoundsToGrid(e,t){let n=Math.round(e.minX/t)*t,o=Math.round(e.minY/t)*t,i=Math.round(e.maxX/t)*t,a=Math.round(e.maxY/t)*t;return{minX:n,minY:o,maxX:i,maxY:a,width:Math.max(1,i-n),height:Math.max(1,a-o)}}static translateBounds(e,t){return{minX:e.minX+t[0],minY:e.minY+t[1],maxX:e.maxX+t[0],maxY:e.maxY+t[1],width:e.width,height:e.height}}static rotateBounds(e,t,n){let[o,i]=h.Vec.rotWith([e.minX,e.minY],t,n),[a,s]=h.Vec.rotWith([e.maxX,e.maxY],t,n);return{minX:o,minY:i,maxX:a,maxY:s,width:e.width,height:e.height}}static getRotatedEllipseBounds(e,t,n,o,i=0){let a=Math.cos(i),s=Math.sin(i),d=Math.hypot(n*a,o*s),l=Math.hypot(n*s,o*a);return{minX:e+n-d,minY:t+o-l,maxX:e+n+d,maxY:t+o+l,width:d*2,height:l*2}}static getExpandedBounds(e,t){let n=Math.min(e.minX,t.minX),o=Math.min(e.minY,t.minY),i=Math.max(e.maxX,t.maxX),a=Math.max(e.maxY,t.maxY),s=Math.abs(i-n),d=Math.abs(a-o);return{minX:n,minY:o,maxX:i,maxY:a,width:s,height:d}}static getCommonBounds(e){if(e.length<2)return e[0];let t=e[0];for(let n=1;n<e.length;n++)t=K.getExpandedBounds(t,e[n]);return t}static getRotatedCorners(e,t=0){let n=[e.minX+e.width/2,e.minY+e.height/2];return[[e.minX,e.minY],[e.maxX,e.minY],[e.maxX,e.maxY],[e.minX,e.maxY]].map(o=>h.Vec.rotWith(o,n,t))}static getTransformedBoundingBox(e,t,n,o=0,i=!1){let[a,s]=[e.minX,e.minY],[d,l]=[e.maxX,e.maxY],[u,m]=[e.minX,e.minY],[c,p]=[e.maxX,e.maxY];if(t==="center")return{minX:u+n[0],minY:m+n[1],maxX:c+n[0],maxY:p+n[1],width:c-u,height:p-m,scaleX:1,scaleY:1};let[y,g]=h.Vec.rot(n,-o);switch(t){case"top_edge":case"top_left_corner":case"top_right_corner":{m+=g;break}case"bottom_edge":case"bottom_left_corner":case"bottom_right_corner":{p+=g;break}}switch(t){case"left_edge":case"top_left_corner":case"bottom_left_corner":{u+=y;break}case"right_edge":case"top_right_corner":case"bottom_right_corner":{c+=y;break}}let v=d-a,E=l-s,f=(c-u)/v,x=(p-m)/E,X=f<0,U=x<0,w=Math.abs(c-u),b=Math.abs(p-m);if(i){let P=v/E,H=P<w/b,M=w*(x<0?1:-1)*(1/P),k=b*(f<0?1:-1)*P;switch(t){case"top_left_corner":{H?m=p+M:u=c+k;break}case"top_right_corner":{H?m=p+M:c=u-k;break}case"bottom_right_corner":{H?p=m-M:c=u-k;break}case"bottom_left_corner":{H?p=m-M:u=c+k;break}case"bottom_edge":case"top_edge":{let Q=(u+c)/2,ae=b*P;u=Q-ae/2,c=Q+ae/2;break}case"left_edge":case"right_edge":{let Q=(m+p)/2,ae=w/P;m=Q-ae/2,p=Q+ae/2;break}}}if(o%(Math.PI*2)!==0){let P=[0,0],H=h.Vec.med([a,s],[d,l]),M=h.Vec.med([u,m],[c,p]);switch(t){case"top_left_corner":{P=h.Vec.sub(h.Vec.rotWith([c,p],M,o),h.Vec.rotWith([d,l],H,o));break}case"top_right_corner":{P=h.Vec.sub(h.Vec.rotWith([u,p],M,o),h.Vec.rotWith([a,l],H,o));break}case"bottom_right_corner":{P=h.Vec.sub(h.Vec.rotWith([u,m],M,o),h.Vec.rotWith([a,s],H,o));break}case"bottom_left_corner":{P=h.Vec.sub(h.Vec.rotWith([c,m],M,o),h.Vec.rotWith([d,s],H,o));break}case"top_edge":{P=h.Vec.sub(h.Vec.rotWith(h.Vec.med([u,p],[c,p]),M,o),h.Vec.rotWith(h.Vec.med([a,l],[d,l]),H,o));break}case"left_edge":{P=h.Vec.sub(h.Vec.rotWith(h.Vec.med([c,m],[c,p]),M,o),h.Vec.rotWith(h.Vec.med([d,s],[d,l]),H,o));break}case"bottom_edge":{P=h.Vec.sub(h.Vec.rotWith(h.Vec.med([u,m],[c,m]),M,o),h.Vec.rotWith(h.Vec.med([a,s],[d,s]),H,o));break}case"right_edge":{P=h.Vec.sub(h.Vec.rotWith(h.Vec.med([u,m],[u,p]),M,o),h.Vec.rotWith(h.Vec.med([a,s],[a,l]),H,o));break}}[u,m]=h.Vec.sub([u,m],P),[c,p]=h.Vec.sub([c,p],P)}return c<u&&([c,u]=[u,c]),p<m&&([p,m]=[m,p]),{minX:u,minY:m,maxX:c,maxY:p,width:c-u,height:p-m,scaleX:(c-u)/(d-a||1)*(X?-1:1),scaleY:(p-m)/(l-s||1)*(U?-1:1)}}static getTransformAnchor(e,t,n){let o=e;switch(e){case"top_left_corner":{t&&n?o="bottom_right_corner":t?o="top_right_corner":n?o="bottom_left_corner":o="bottom_right_corner";break}case"top_right_corner":{t&&n?o="bottom_left_corner":t?o="top_left_corner":n?o="bottom_right_corner":o="bottom_left_corner";break}case"bottom_right_corner":{t&&n?o="top_left_corner":t?o="bottom_left_corner":n?o="top_right_corner":o="top_left_corner";break}case"bottom_left_corner":{t&&n?o="top_right_corner":t?o="bottom_right_corner":n?o="top_left_corner":o="top_right_corner";break}}return o}static getRelativeTransformedBoundingBox(e,t,n,o,i){let a=(o?t.maxX-n.maxX:n.minX-t.minX)/t.width,s=(i?t.maxY-n.maxY:n.minY-t.minY)/t.height,d=n.width/t.width,l=n.height/t.height,u=e.minX+e.width*a,m=e.minY+e.height*s,c=e.width*d,p=e.height*l;return{minX:u,minY:m,maxX:u+c,maxY:m+p,width:c,height:p}}static getRotatedSize(e,t){let n=h.Vec.div(e,2),o=[[0,0],[e[0],0],e,[0,e[1]]].map(a=>h.Vec.rotWith(a,n,t)),i=K.getBoundsFromPoints(o);return[i.width,i.height]}static getBoundsCenter(e){return[e.minX+e.width/2,e.minY+e.height/2]}static getBoundsWithCenter(e){let t=K.getBoundsCenter(e);return $(T({},e),{midX:t[0],midY:t[1]})}static getCommonTopLeft(e){let t=[1/0,1/0];return e.forEach(n=>{t[0]=Math.min(t[0],n[0]),t[1]=Math.min(t[1],n[1])}),t}static getFromCache(e,t,n){let o=e.get(t);if(o===void 0&&(e.set(t,n()),o=e.get(t),o===void 0))throw Error("Cache did not include item!");return o}static uniqueId(e=""){return e?((Number(e)^Math.random()*16)>>Number(e)/4).toString(16):`${1e7}-${1e3}-${4e3}-${8e3}-${1e11}`.replace(/[018]/g,K.uniqueId)}static rotateArray(e,t){return e.map((n,o)=>e[(o+t)%e.length])}static debounce(e,t=0){let n;return function(...o){clearTimeout(n),n=setTimeout(()=>e.apply(o),t)}}static getSvgPathFromStroke(e){let t=e.length;if(!t)return"";let n=e[0],o=`M${n[0].toFixed(3)},${n[1].toFixed(3)}Q`;for(let i=0,a=t-1;i<a;i++){let s=e[i],d=e[i+1];o+=`${s[0].toFixed(3)},${s[1].toFixed(3)} ${ke(s[0],d[0]).toFixed(3)},${ke(s[1],d[1]).toFixed(3)} `}return o+="Z",o}static getSvgPathFromStrokePoints(e){let t=e.length;if(!t)return"";let n=e[0].point,o=`M${n[0].toFixed(3)},${n[1].toFixed(3)}Q`;for(let i=0,a=t-1;i<a;i++){let s=e[i].point,d=e[i+1].point;o+=`${s[0].toFixed(3)},${s[1].toFixed(3)} ${ke(s[0],d[0]).toFixed(3)},${ke(s[1],d[1]).toFixed(3)} `}return o}static getPerfectDashProps(e,t,n,o=1,i=!0,a=2){let s,d,l;if(n.toLowerCase()==="dashed")s=t*a,l=1,d=i?(s/2).toString():"0";else if(n.toLowerCase()==="dotted")s=t/100,l=100,d="0";else return{strokeDasharray:"none",strokeDashoffset:"none"};let u=Math.floor(e/s/(2*l));u-=u%o,u=Math.max(u,4);let m=Math.max(s,(e-u*s)/(i?u:u-1));return{strokeDasharray:[s,m].join(" "),strokeDashoffset:d}}static isMobileSafari(){if(typeof window=="undefined")return!1;let e=window.navigator.userAgent,t=!!e.match(/iPad/i)||!!e.match(/iPhone/i),n=!!e.match(/WebKit/i);return t&&n&&!e.match(/CriOS/i)}static throttle(e,t){let n,o;return function(...i){return n||(n=!0,setTimeout(()=>n=!1,t),o=e(...i)),o}}static isDarwin(){return/Mac|iPod|iPhone|iPad/.test(window.navigator.platform)}static metaKey(e){return K.isDarwin()?e.metaKey:e.ctrlKey}static lns(e){let t=e.split("");return t.push(...t.splice(0,Math.round(t.length/5))),t.push(...t.splice(0,Math.round(t.length/4))),t.push(...t.splice(0,Math.round(t.length/3))),t.push(...t.splice(0,Math.round(t.length/2))),t.reverse().map(n=>+n?+n<5?5+ +n:+n>5?+n-5:n:n).join("")}},S=K;B(S,"getSnapPoints",(e,t,n)=>{let o=T({},e),i=[0,0],a=[],s={["minX"]:{id:"minX",isSnapped:!1},["midX"]:{id:"midX",isSnapped:!1},["maxX"]:{id:"maxX",isSnapped:!1},["minY"]:{id:"minY",isSnapped:!1},["midY"]:{id:"midY",isSnapped:!1},["maxY"]:{id:"maxY",isSnapped:!1}},d=["midX","minX","maxX"],l=["midY","minY","maxY"],u=t.map(g=>{let v=d.flatMap((f,x)=>d.map((X,U)=>{let w=o[f]-g[X],b=Math.abs(w);return{f,t:X,gap:w,distance:b,isCareful:x===0||x+U===3}})),E=l.flatMap((f,x)=>l.map((X,U)=>{let w=o[f]-g[X],b=Math.abs(w);return{f,t:X,gap:w,distance:b,isCareful:x===0||x+U===3}}));return[g,v,E]}),m=1/0,c=1/0,p=1/0,y=1/0;return u.forEach(([g,v,E])=>{v.forEach(f=>{f.distance<n&&f.distance<p&&(p=f.distance,m=f.gap)}),E.forEach(f=>{f.distance<n&&f.distance<y&&(y=f.distance,c=f.gap)})}),u.forEach(([g,v,E])=>{m!==1/0&&v.forEach(f=>{Math.abs(f.gap-m)<2&&(s[f.f]=$(T({},s[f.f]),{isSnapped:!0,to:g[f.t],B:g,distance:f.distance}))}),c!==1/0&&E.forEach(f=>{Math.abs(f.gap-c)<2&&(s[f.f]=$(T({},s[f.f]),{isSnapped:!0,to:g[f.t],B:g,distance:f.distance}))})}),i[0]=m===1/0?0:m,i[1]=c===1/0?0:c,o.minX-=i[0],o.midX-=i[0],o.maxX-=i[0],o.minY-=i[1],o.midY-=i[1],o.maxY-=i[1],d.forEach(g=>{let v=s[g];if(!v.isSnapped)return;let{id:E,B:f}=v,x=o[E];a.push(E==="minX"?[[x,o.midY],[x,f.minY],[x,f.maxY]]:[[x,o.minY],[x,o.maxY],[x,f.minY],[x,f.maxY]])}),l.forEach(g=>{let v=s[g];if(!v.isSnapped)return;let{id:E,B:f}=v,x=o[E];a.push(E==="midY"?[[o.midX,x],[f.minX,x],[f.maxX,x]]:[[o.minX,x],[o.maxX,x],[f.minX,x],[f.maxX,x]])}),{offset:i,snapLines:a}}),B(S,"deepMerge",(e,t)=>{let n=T({},e),o=Object.entries(t);for(let[i,a]of o)n[i]=a===Object(a)&&!Array.isArray(a)?K.deepMerge(n[i],a):a;return n});function ke(r,e){return(r+e)/2}var I=S;function it(r,e){let t=j.useRef(void 0),n=j.useRef(void 0),o=j.useRef([0,0]),{inputs:i,bounds:a,callbacks:s}=R();j.useEffect(()=>{let c=p=>p.preventDefault();return document.addEventListener("gesturestart",c),document.addEventListener("gesturechange",c),()=>{document.removeEventListener("gesturestart",c),document.removeEventListener("gesturechange",c)}},[]);let d=j.useCallback(({event:c})=>{var f,x,X,U;if(c.preventDefault(),i.isPinching)return;let[p,y,g]=cn(c);if((c.altKey||c.ctrlKey||c.metaKey)&&c.buttons===0){let b=[...(x=(f=i.pointer)==null?void 0:f.point)!=null?x:[a.width/2,a.height/2],g*.618],P=i.pan(b,c);(X=s.onZoom)==null||X.call(s,$(T({},P),{delta:b}),c);return}let v=Ke.Vec.mul(c.shiftKey&&!I.isDarwin?[y,0]:[p,y],.5);if(Ke.Vec.isEqual(v,[0,0]))return;let E=i.pan(v,c);(U=s.onPan)==null||U.call(s,E,c)},[s,i,a]),l=j.useCallback(({origin:c,event:p})=>{var v;if(p instanceof WheelEvent)return;let y=e.current;if(!y||!(p.target===y||y.contains(p.target)))return;let g=i.pinch(c,c);i.isPinching=!0,(v=s.onPinchStart)==null||v.call(s,g,p),n.current=g.point,t.current=g.origin,o.current=[0,0]},[s,i,a]),u=j.useCallback(({origin:c,offset:p,event:y})=>{var f;if(y instanceof WheelEvent)return;let g=e.current;if(!(y.target===g||(g==null?void 0:g.contains(y.target)))||!t.current)return;let v=i.pinch(c,t.current),E=Ke.Vec.sub(v.delta,o.current);o.current=v.delta,(f=s.onPinch)==null||f.call(s,$(T({},v),{point:v.point,origin:t.current,delta:[...E,p[0]]}),y),n.current=c},[s,i,a]),m=j.useCallback(({origin:c,event:p})=>{var v;let y=e.current;if(!(p.target===y||(y==null?void 0:y.contains(p.target))))return;let g=i.pinch(c,c);i.isPinching=!1,(v=s.onPinchEnd)==null||v.call(s,g,p),n.current=void 0,t.current=void 0,o.current=[0,0]},[]);(0,rt.useGesture)({onWheel:d,onPinchStart:l,onPinch:u,onPinchEnd:m},{target:e,eventOptions:{passive:!1},pinch:{from:[r.current,0],scaleBounds:()=>({from:r.current,max:5,min:.1})}})}var ot=10;function cn(r){let{deltaY:e,deltaX:t}=r,n=0;if(r.ctrlKey||r.metaKey){let o=Math.sign(r.deltaY),i=Math.abs(r.deltaY),a=e;i>ot&&(a=ot*o),n=a}return[t,e,n]}var st=require("react");function at(){let{callbacks:r}=R();(0,st.useEffect)(()=>{function e(){var t;(t=r.onShapeBlur)==null||t.call(r)}return I.isMobileSafari()?(document.addEventListener("focusout",e),()=>document.removeEventListener("focusout",e)):()=>null},[r])}var dt=L(require("react"));function lt(){let{callbacks:r,inputs:e}=R();return dt.useMemo(()=>({onPointerDown:t=>{var o,i;if(t.dead||(t.dead=!0,!e.pointerIsValid(t))||t.button===2)return;t.currentTarget.setPointerCapture(t.pointerId);let n=e.pointerDown(t,"canvas");t.button===0&&((o=r.onPointCanvas)==null||o.call(r,n,t)),(i=r.onPointerDown)==null||i.call(r,n,t)},onPointerMove:t=>{var o,i;if(t.dead||(t.dead=!0,!e.pointerIsValid(t)))return;let n=e.pointerMove(t,"canvas");t.buttons===1&&t.currentTarget.hasPointerCapture(t.pointerId)&&((o=r.onDragCanvas)==null||o.call(r,n,t)),(i=r.onPointerMove)==null||i.call(r,n,t)},onPointerUp:t=>{var i,a,s,d;if(t.dead||(t.dead=!0,e.activePointer=void 0,!e.pointerIsValid(t))||t.button===2)return;let n=e.pointerUp(t,"canvas"),o=e.isDoubleClick();t.currentTarget.hasPointerCapture(t.pointerId)&&((i=t.currentTarget)==null||i.releasePointerCapture(t.pointerId)),t.button===0&&(o&&!(n.altKey||n.metaKey)&&((a=r.onDoubleClickCanvas)==null||a.call(r,n,t)),(s=r.onReleaseCanvas)==null||s.call(r,n,t)),(d=r.onPointerUp)==null||d.call(r,n,t)},onDrop:r.onDrop,onDragOver:r.onDragOver}),[r,e])}var De=L(require("react"));function ct(r){let{rPageState:e,rSelectionBounds:t,callbacks:n,inputs:o}=De.useContext(Le);return De.useMemo(()=>({onPointerDown:i=>{var s,d,l,u,m,c,p;if(i.dead||(i.dead=!0,!o.pointerIsValid(i)))return;if(i.button===2){(s=n.onRightPointShape)==null||s.call(n,o.pointerDown(i,r),i);return}let a=o.pointerDown(i,r);if((d=i.currentTarget)==null||d.setPointerCapture(i.pointerId),t.current&&S.pointInBounds(a.point,t.current)&&!e.current.selectedIds.includes(r)){i.button===0&&((l=n.onPointBounds)==null||l.call(n,o.pointerDown(i,"bounds"),i),(u=n.onPointShape)==null||u.call(n,a,i)),(m=n.onPointerDown)==null||m.call(n,a,i);return}i.button===0&&((c=n.onPointShape)==null||c.call(n,a,i)),(p=n.onPointerDown)==null||p.call(n,a,i)},onPointerUp:i=>{var d,l,u,m;if(i.dead||(i.dead=!0,!o.pointerIsValid(i))||i.button===2)return;o.activePointer=void 0;let a=o.isDoubleClick(),s=o.pointerUp(i,r);i.pointerId&&i.currentTarget.hasPointerCapture(i.pointerId)&&((d=i.currentTarget)==null||d.releasePointerCapture(i.pointerId)),i.button===0&&(a&&!(s.altKey||s.metaKey)&&((l=n.onDoubleClickShape)==null||l.call(n,s,i)),(u=n.onReleaseShape)==null||u.call(n,s,i)),(m=n.onPointerUp)==null||m.call(n,s,i)},onPointerMove:i=>{var s,d;if(i.dead||(i.dead=!0,i.buttons===2||!o.pointerIsValid(i)||o.pointer&&i.pointerId!==o.pointer.pointerId))return;let a=o.pointerMove(i,r);i.buttons===1&&i.currentTarget.hasPointerCapture(i.pointerId)&&((s=n.onDragShape)==null||s.call(n,a,i)),(d=n.onPointerMove)==null||d.call(n,a,i)},onPointerEnter:i=>{var s;if(!o.pointerIsValid(i))return;let a=o.pointerEnter(i,r);(s=n.onHoverShape)==null||s.call(n,a,i)},onPointerLeave:i=>{var s;if(!o.pointerIsValid(i))return;let a=o.pointerEnter(i,r);(s=n.onUnhoverShape)==null||s.call(n,a,i)}}),[o,n,r])}var xe=require("@tldraw/vec"),be=L(require("react"));function ut(r,e,t,n,o,i=!1,a=!1,s){let d={shape:r,asset:r.assetId?o[r.assetId]:void 0,meta:s,isChildOfSelected:a,isGhost:r.isGhost||i,isEditing:n.editingId===r.id,isBinding:n.bindingTargetId===r.id,isSelected:n.selectedIds.includes(r.id),isHovered:n.hoveredId===r.id||r.children!==void 0&&(n.hoveredId&&r.children.includes(n.hoveredId)||r.children.some(l=>n.selectedIds.includes(l)))};e.push(d),r.children&&(d.children=[],r.children.map(l=>t[l]).filter(l=>t[l.id]).sort((l,u)=>l.childIndex-u.childIndex).forEach(l=>ut(l,d.children,t,n,o,d.isGhost,d.isSelected||d.isChildOfSelected,s)))}function un(r,e){return S.boundsContain(e,r)||S.boundsCollide(e,r)}function mt(r,e,t,n){let{callbacks:o,shapeUtils:i,bounds:a}=R(),s=be.useRef(),d=be.useRef(-1),l=be.useRef(new Set),u=be.useRef(new Set),{selectedIds:m,camera:c}=e,[p,y]=xe.Vec.sub(xe.Vec.div([0,0],c.zoom),c.point),[g,v]=xe.Vec.sub(xe.Vec.div([a.width,a.height],c.zoom),c.point),E={minX:p,minY:y,maxX:g,maxY:v,height:g-p,width:v-y},f=u.current,x=l.current;f.clear(),x.clear(),Object.values(r.shapes).filter(b=>i[b.type].isStateful||m.includes(b.id)||un(i[b.type].getBounds(b),E)).forEach(b=>{if(b.parentId===r.id){x.add(b.id),f.add(b);return}let P=r.shapes[b.parentId];if(P===void 0)throw Error(`A shape (${b.id}) has a parent (${b.parentId}) that does not exist!`);x.add(P.id),f.add(P)}),f.size!==d.current&&(s.current&&clearTimeout(s.current),s.current=requestAnimationFrame(()=>{var b;(b=o.onRenderCountChange)==null||b.call(o,Array.from(x.values()))}),d.current=f.size);let U=e.bindingId?r.bindings[e.bindingId].toId:void 0,w=[];return f.forEach(b=>{if(b===void 0)throw Error("Rendered shapes included a missing shape");ut(b,w,r.shapes,$(T({},e),{bindingTargetId:U}),t,b.isGhost,!1,n)}),w.sort((b,P)=>b.shape.childIndex-P.shape.childIndex),w}var Pe=L(require("react")),qe=new Map;function mn(r,e){return Object.keys(e).reduce((t,n)=>{let o=e[n];return o?t+`${`--${r}-${n}`}: ${o};
`:t},"")}function pn(r,e,t=":root"){Pe.useLayoutEffect(()=>{let n=document.createElement("style"),o=mn(r,e);return n.setAttribute("id",`${r}-theme`),n.setAttribute("data-selector",t),n.innerHTML=`
        ${t} {
          ${o}
        }
      `,document.head.appendChild(n),()=>{n&&document.head.contains(n)&&document.head.removeChild(n)}},[r,e,t])}function hn(r,e){Pe.useLayoutEffect(()=>{if(qe.get(r))return()=>{};let t=document.createElement("style");return t.innerHTML=e,t.setAttribute("id",r),document.head.appendChild(t),qe.set(r,t),()=>{t&&document.head.contains(t)&&(document.head.removeChild(t),qe.delete(r))}},[r,e])}var fn=(r,...e)=>r.reduce((t,n,o)=>t+n+(o<e.length?e[o]:""),""),Tn={accent:"rgb(255, 0, 0)",brushFill:"rgba(0,0,0,.05)",brushStroke:"rgba(0,0,0,.25)",brushDashStroke:"rgba(0,0,0,.6)",selectStroke:"rgb(66, 133, 244)",selectFill:"rgba(65, 132, 244, 0.05)",binding:"rgba(65, 132, 244, 0.12)",background:"rgb(248, 249, 250)",foreground:"rgb(51, 51, 51)",grid:"rgba(144, 144, 144, 1)"},gn=fn`
  .tl-container {
    --tl-zoom: 1;
    --tl-scale: calc(1 / var(--tl-zoom));
    --tl-padding: calc(64px * max(1, var(--tl-scale)));
    --tl-performance-all: auto;
    --tl-performance-selected: auto;
    position: relative;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    max-width: 100%;
    max-height: 100%;
    box-sizing: border-box;
    padding: 0px;
    margin: 0px;
    z-index: 100;
    overflow: hidden;
    touch-action: none;
    overscroll-behavior: none;
    background-color: var(--tl-background);
  }
  .tl-container * {
    box-sizing: border-box;
  }
  .tl-overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    touch-action: none;
    pointer-events: none;
  }
  .tl-grid {
    position: absolute;
    width: 100%;
    height: 100%;
    touch-action: none;
    pointer-events: none;
    user-select: none;
  }
  .tl-snap-line {
    stroke: var(--tl-accent);
    stroke-width: calc(1px * var(--tl-scale));
  }
  .tl-snap-point {
    stroke: var(--tl-accent);
    stroke-width: calc(1px * var(--tl-scale));
  }
  .tl-canvas {
    position: absolute;
    width: 100%;
    height: 100%;
    touch-action: none;
    pointer-events: all;
    overflow: clip;
  }
  .tl-layer {
    position: absolute;
    top: 0px;
    left: 0px;
    height: 0px;
    width: 0px;
    contain: layout style size;
  }
  .tl-absolute {
    position: absolute;
    top: 0px;
    left: 0px;
    transform-origin: center center;
    contain: layout style size;
  }
  .tl-positioned {
    position: absolute;
    top: 0px;
    left: 0px;
    transform-origin: center center;
    pointer-events: none;
    display: flex;
    align-items: center;
    justify-content: center;
    contain: layout style size;
    will-change: var(--tl-performance-all);
  }
  .tl-positioned-svg {
    width: 100%;
    height: 100%;
    overflow: hidden;
    contain: layout style size;
  }
  .tl-positioned-div {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
    padding: var(--tl-padding);
    overflow: hidden;
    contain: layout style size;
  }
  .tl-positioned-selected {
    will-change: var(--tl-performance-selected);
  }
  .tl-inner-div {
    position: relative;
    width: 100%;
    height: 100%;
  }
  .tl-stroke-hitarea {
    fill: none;
    stroke: transparent;
    stroke-width: calc(24px * var(--tl-scale));
    pointer-events: stroke;
    stroke-linecap: round;
    stroke-linejoin: round;
  }
  .tl-fill-hitarea {
    fill: transparent;
    stroke: transparent;
    stroke-width: calc(24px * var(--tl-scale));
    pointer-events: all;
    stroke-linecap: round;
    stroke-linejoin: round;
  }
  .tl-counter-scaled {
    transform: scale(var(--tl-scale));
  }
  .tl-dashed {
    stroke-dasharray: calc(2px * var(--tl-scale)), calc(2px * var(--tl-scale));
  }
  .tl-transparent {
    fill: transparent;
    stroke: transparent;
  }
  .tl-cursor-ns {
    cursor: ns-resize;
  }
  .tl-cursor-ew {
    cursor: ew-resize;
  }
  .tl-cursor-nesw {
    cursor: nesw-resize;
  }
  .tl-cursor-nwse {
    cursor: nwse-resize;
  }
  .tl-corner-handle {
    stroke: var(--tl-selectStroke);
    fill: var(--tl-background);
    stroke-width: calc(1.5px * var(--tl-scale));
  }
  .tl-rotate-handle {
    stroke: var(--tl-selectStroke);
    fill: var(--tl-background);
    stroke-width: calc(1.5px * var(--tl-scale));
    cursor: grab;
  }
  .tl-binding {
    fill: var(--tl-selectFill);
    stroke: var(--tl-selectStroke);
    stroke-width: calc(1px * var(--tl-scale));
    pointer-events: none;
  }
  .tl-user {
    left: calc(-15px * var(--tl-scale));
    top: calc(-15px * var(--tl-scale));
    height: calc(35px * var(--tl-scale));
    width: calc(35px * var(--tl-scale));
    transform: scale(var(--tl-scale));
    pointer-events: none;
    will-change: transform;
  }
  .tl-animated {
    transition: transform 200ms linear;
  }
  .tl-indicator {
    fill: transparent;
    stroke-width: calc(1.5px * var(--tl-scale));
    pointer-events: none;
  }
  .tl-user-indicator-bounds {
    border-style: solid;
    border-width: calc(1px * var(--tl-scale));
  }
  .tl-hovered {
    stroke: var(--tl-selectStroke);
  }
  .tl-selected {
    stroke: var(--tl-selectStroke);
  }
  .tl-locked {
    stroke-dasharray: calc(3px * var(--tl-scale)) calc(3px * var(--tl-scale));
  }
  .tl-editing {
    stroke-width: calc(2.5px * min(5, var(--tl-scale)));
  }
  .tl-performance {
    will-change: transform, contents;
  }
  .tl-clone-target {
    pointer-events: all;
  }
  .tl-clone-target:hover .tl-clone-button {
    opacity: 1;
  }
  .tl-clone-button-target {
    cursor: pointer;
    pointer-events: all;
  }
  .tl-clone-button-target:hover .tl-clone-button {
    fill: var(--tl-selectStroke);
  }
  .tl-clone-button {
    opacity: 0;
    r: calc(8px * var(--tl-scale));
    stroke-width: calc(1.5px * var(--tl-scale));
    stroke: var(--tl-selectStroke);
    fill: var(--tl-background);
  }
  .tl-bounds {
    pointer-events: none;
    contain: layout style size;
  }
  .tl-bounds-bg {
    stroke: none;
    fill: var(--tl-selectFill);
    pointer-events: all;
    contain: layout style size;
  }
  .tl-bounds-center {
    fill: transparent;
    stroke: var(--tl-selectStroke);
    stroke-width: calc(1.5px * var(--tl-scale));
  }
  .tl-brush {
    fill: var(--tl-brushFill);
    stroke: var(--tl-brushStroke);
    stroke-width: calc(1px * var(--tl-scale));
    pointer-events: none;
    contain: layout style size;
  }
  .tl-dashed-brush-line {
    fill: none;
    stroke: var(--tl-brushDashStroke);
    stroke-width: calc(1px * var(--tl-scale));
    pointer-events: none;
  }
  .tl-brush.dashed {
    stroke: none;
  }
  .tl-handle {
    pointer-events: all;
    cursor: grab;
  }
  .tl-handle:hover .tl-handle-bg {
    fill: var(--tl-selectFill);
  }
  .tl-handle:hover .tl-handle-bg > * {
    stroke: var(--tl-selectFill);
  }
  .tl-handle:active .tl-handle-bg {
    cursor: grabbing;
    fill: var(--tl-selectFill);
  }
  .tl-handle:active .tl-handle-bg > * {
    stroke: var(--tl-selectFill);
  }
  .tl-handle {
    fill: var(--tl-background);
    stroke: var(--tl-selectStroke);
    stroke-width: 1.5px;
  }
  .tl-handle-bg {
    fill: transparent;
    stroke: none;
    pointer-events: all;
    r: calc(16px / max(1, var(--tl-zoom)));
  }
  .tl-binding-indicator {
    fill: transparent;
    stroke: var(--tl-binding);
  }
  .tl-centered-g {
    transform: translate(var(--tl-padding), var(--tl-padding));
  }
  .tl-current-parent > *[data-shy='true'] {
    opacity: 1;
  }
  .tl-binding {
    fill: none;
    stroke: var(--tl-selectStroke);
    stroke-width: calc(2px * var(--tl-scale));
  }
  .tl-grid-dot {
    fill: var(--tl-grid);
  }
  .tl-erase-line {
    stroke-linejoin: round;
    stroke-linecap: round;
    pointer-events: none;
    fill: var(--tl-grid);
    opacity: 0.32;
  }
`;function pt(r,e){let t=Pe.useMemo(()=>T(T({},Tn),r),[r]);pn("tl",t,e),hn("tl-canvas",gn)}var me=L(require("react"));function _(r){let{callbacks:e,inputs:t}=R(),n=me.useCallback(d=>{var u,m,c;if(d.dead||(d.dead=!0,!t.pointerIsValid(d)))return;let l=t.pointerDown(d,r);if(d.button===2){(u=e.onRightPointBoundsHandle)==null||u.call(e,l,d);return}d.button===0&&((m=e.onPointBoundsHandle)==null||m.call(e,l,d)),(c=e.onPointerDown)==null||c.call(e,l,d)},[t,e,r]),o=me.useCallback(d=>{var m,c,p;if(d.dead||(d.dead=!0,d.button===2||!t.pointerIsValid(d)))return;let l=t.pointerUp(d,r),u=t.isDoubleClick();d.button===0&&(u&&!(l.altKey||l.metaKey)&&((m=e.onDoubleClickBoundsHandle)==null||m.call(e,l,d)),(c=e.onReleaseBoundsHandle)==null||c.call(e,l,d)),(p=e.onPointerUp)==null||p.call(e,l,d)},[t,e,r]),i=me.useCallback(d=>{var u,m;if(d.dead||(d.dead=!0,!t.pointerIsValid(d))||d.buttons===2)return;let l=t.pointerMove(d,r);d.buttons===1&&d.currentTarget.hasPointerCapture(d.pointerId)&&((u=e.onDragBoundsHandle)==null||u.call(e,l,d)),(m=e.onPointerMove)==null||m.call(e,l,d)},[t,e,r]),a=me.useCallback(d=>{var l;!t.pointerIsValid(d)||(l=e.onHoverBoundsHandle)==null||l.call(e,t.pointerEnter(d,r),d)},[t,e,r]),s=me.useCallback(d=>{var l;!t.pointerIsValid(d)||(l=e.onUnhoverBoundsHandle)==null||l.call(e,t.pointerEnter(d,r),d)},[t,e,r]);return{onPointerDown:n,onPointerUp:o,onPointerEnter:a,onPointerMove:i,onPointerLeave:s}}var Re=L(require("react"));function ht(r,e,t){let n=Re.useRef(),o=Re.useRef();Re.useLayoutEffect(()=>{let{zoom:i,point:a}=t.camera,s=i!==n.current,d=a!==o.current;if(n.current=i,o.current=a,s||d){let l=r.current;if(e&&"current"in e){let u=e.current;s&&u&&u.style.setProperty("--tl-zoom",i.toString()),l&&l.style.setProperty("transform",`scale(${i}) translateX(${a[0]}px) translateY(${a[1]}px)`)}}},[t.camera.zoom,t.camera.point])}var Tt=L(require("react"));function ft(r,e){return[(r[0]+e.point[0])*e.zoom,(r[1]+e.point[1])*e.zoom]}function Qe(r,e){return r[e.type]}function gt(r,e,t){let{rSelectionBounds:n}=R(),{selectedIds:o}=e,i=Tt.useRef(),a,s=0,d=!1,l=!1;if(o.length===1){let m=o[0],c=r.shapes[m];if(!c)throw Error(`selectedIds is set to the id of a shape that doesn't exist: ${m}`);s=c.rotation||0,d=c.isLocked||!1;let p=Qe(t,c);a=p.hideBounds?void 0:p.getBounds(c)}else if(o.length>1){let m=o.map(c=>r.shapes[c]);s=0,d=m.every(c=>c.isLocked),a=m.reduce((c,p,y)=>y===0?Qe(t,p).getRotatedBounds(p):I.getExpandedBounds(c,Qe(t,p).getRotatedBounds(p)),{})}if(a){let[m,c]=ft([a.minX,a.minY],e.camera),[p,y]=ft([a.maxX,a.maxY],e.camera);l=!!Object.values(r.bindings).find(g=>o.includes(g.toId)||o.includes(g.fromId)),n.current={minX:m,minY:c,maxX:p,maxY:y,width:p-m,height:y-c}}else n.current=null;let u=i.current;return!u||!a?i.current=a:a&&u.minX===a.minX&&u.minY===a.minY&&u.maxX===a.maxX&&u.maxY===a.maxY&&(a=i.current),{bounds:a,rotation:s,isLocked:d,isLinked:l}}var Lt=L(require("react"));function yt(r){let{inputs:e,callbacks:t}=R();return Lt.useMemo(()=>({onPointerDown:n=>{var i,a,s;if(n.dead||(n.dead=!0,!e.pointerIsValid(n))||n.button===2)return;(i=n.currentTarget)==null||i.setPointerCapture(n.pointerId);let o=e.pointerDown(n,r);n.button===0&&((a=t.onPointHandle)==null||a.call(t,o,n)),(s=t.onPointerDown)==null||s.call(t,o,n)},onPointerUp:n=>{var a,s,d,l;if(n.dead||(n.dead=!0,!e.pointerIsValid(n))||n.button===2)return;let o=e.isDoubleClick(),i=e.pointerUp(n,r);n.currentTarget.hasPointerCapture(n.pointerId)&&((a=n.currentTarget)==null||a.releasePointerCapture(n.pointerId),n.button===0&&(o&&!(i.altKey||i.metaKey)&&((s=t.onDoubleClickHandle)==null||s.call(t,i,n)),(d=t.onReleaseHandle)==null||d.call(t,i,n))),(l=t.onPointerUp)==null||l.call(t,i,n)},onPointerMove:n=>{var i,a;if(n.dead||(n.dead=!0,!e.pointerIsValid(n))||n.buttons===2)return;let o=e.pointerMove(n,r);n.buttons===1&&n.currentTarget.hasPointerCapture(n.pointerId)&&((i=t.onDragHandle)==null||i.call(t,o,n)),(a=t.onPointerMove)==null||a.call(t,o,n)},onPointerEnter:n=>{var i;if(!e.pointerIsValid(n))return;let o=e.pointerEnter(n,r);(i=t.onHoverHandle)==null||i.call(t,o,n)},onPointerLeave:n=>{var i;if(!e.pointerIsValid(n))return;let o=e.pointerEnter(n,r);(i=t.onUnhoverHandle)==null||i.call(t,o,n)}}),[e,t,r])}var vt=L(require("react"));function xt(r){let{bounds:e}=R();vt.useEffect(()=>{let t=i=>{i.preventDefault()},n=i=>{let a=i.touches[0].pageX,s=i.touches[0].radiusX||0;(a-s<10||a+s>e.width-10)&&i.preventDefault()},o=r.current;return o?(o.addEventListener("gestureend",t),o.addEventListener("gesturechange",t),o.addEventListener("gesturestart",t),o.addEventListener("touchstart",n),()=>{o&&(o.removeEventListener("gestureend",t),o.removeEventListener("gesturechange",t),o.removeEventListener("gesturestart",t),o.removeEventListener("touchstart",n))}):()=>{}},[r,e.width])}var bt=L(require("react"));function Pt(){let{callbacks:r,inputs:e}=R();return bt.useMemo(()=>({onPointerDown:t=>{var o,i,a,s;if(t.dead||(t.dead=!0,!e.pointerIsValid(t)))return;if(t.button===2){(o=r.onRightPointBounds)==null||o.call(r,e.pointerDown(t,"bounds"),t);return}let n=e.pointerDown(t,"bounds");(i=t.currentTarget)==null||i.setPointerCapture(t.pointerId),t.button===0&&((a=r.onPointBounds)==null||a.call(r,n,t)),(s=r.onPointerDown)==null||s.call(r,n,t)},onPointerUp:t=>{var i,a,s,d;if(t.dead||(t.dead=!0,t.button===2)||(e.activePointer=void 0,!e.pointerIsValid(t)))return;let n=e.isDoubleClick(),o=e.pointerUp(t,"bounds");t.currentTarget.hasPointerCapture(t.pointerId)&&((i=t.currentTarget)==null||i.releasePointerCapture(t.pointerId)),t.button===0&&(n&&!(o.altKey||o.metaKey)&&((a=r.onDoubleClickBounds)==null||a.call(r,o,t)),(s=r.onReleaseBounds)==null||s.call(r,o,t)),(d=r.onPointerUp)==null||d.call(r,o,t)},onPointerMove:t=>{var o,i;if(t.dead||(t.dead=!0,!e.pointerIsValid(t)))return;t.buttons===1&&t.currentTarget.hasPointerCapture(t.pointerId)&&((o=r.onDragBounds)==null||o.call(r,e.pointerMove(t,"bounds"),t));let n=e.pointerMove(t,"bounds");(i=r.onPointerMove)==null||i.call(r,n,t)},onPointerEnter:t=>{var n;!e.pointerIsValid(t)||(n=r.onHoverBounds)==null||n.call(r,e.pointerEnter(t,"bounds"),t)},onPointerLeave:t=>{var n;!e.pointerIsValid(t)||(n=r.onUnhoverBounds)==null||n.call(r,e.pointerEnter(t,"bounds"),t)}}),[e,r])}var Ye=L(require("react"));function Xe(r,e=0){let t=Ye.useRef(null);return Ye.useLayoutEffect(()=>{let n=t.current,o=`
    translate(
      calc(${r.minX}px - var(--tl-padding)),
      calc(${r.minY}px - var(--tl-padding))
    )
    rotate(${e+(r.rotation||0)}rad)`;n.style.setProperty("transform",o),n.style.setProperty("width",`calc(${Math.floor(r.width)}px + (var(--tl-padding) * 2))`),n.style.setProperty("height",`calc(${Math.floor(r.height)}px + (var(--tl-padding) * 2))`)},[r,e]),t}var Rt=L(require("react"));function Et(){let{inputs:r,callbacks:e}=R();Rt.useEffect(()=>{let t=o=>{var i;(i=e.onKeyDown)==null||i.call(e,o.key,r.keydown(o),o)},n=o=>{var i;r.keyup(o),(i=e.onKeyUp)==null||i.call(e,o.key,r.keyup(o),o)};return window.addEventListener("keydown",t),window.addEventListener("keyup",n),()=>{window.removeEventListener("keydown",t),window.removeEventListener("keyup",n)}},[r,e])}var Bt=L(require("react"));function St(r,e){Bt.useLayoutEffect(()=>{if(e&&"current"in e){let t=e==null?void 0:e.current;if(!t)return;switch(r){case"transform_selected":{t.style.setProperty("--tl-performance-all","auto"),t.style.setProperty("--tl-performance-selected","transform, contents");break}case"transform_all":{t.style.setProperty("--tl-performance-all","transform, contents"),t.style.setProperty("--tl-performance-selected","transform, contents");break}case"translate_selected":{t.style.setProperty("--tl-performance-all","auto"),t.style.setProperty("--tl-performance-selected","transform");break}case"translate_all":{t.style.setProperty("--tl-performance-all","transform"),t.style.setProperty("--tl-performance-selected","transform");break}default:t.style.setProperty("--tl-performance-all","auto"),t.style.setProperty("--tl-performance-selected","auto")}}},[r])}function Ln(s){var d=s,{id:r,bounds:e,rotation:t=0,isGhost:n=!1,isSelected:o=!1,children:i}=d,a=O(d,["id","bounds","rotation","isGhost","isSelected","children"]);let l=Xe(e,t);return Ue.createElement("div",T({id:r,ref:l,className:`tl-positioned${n?" tl-ghost":""}${o?" tl-positioned-selected":""}`,"aria-label":"container","data-testid":"container"},a),i)}var Z=Ue.memo(Ln);function yn({brush:r,zoom:e,dashed:t}){return V.createElement(Z,{bounds:r,rotation:0},V.createElement(J,null,V.createElement("rect",{className:"tl-brush"+(t?" dashed":""),opacity:1,x:0,y:0,width:r.width,height:r.height,"aria-label":"brush"}),t&&V.createElement("g",{className:"tl-dashed-brush-line"},V.createElement($e,{x1:0,y1:0,x2:r.width,y2:0,zoom:e}),V.createElement($e,{x1:r.width,y1:0,x2:r.width,y2:r.height,zoom:e}),V.createElement($e,{x1:0,y1:r.height,x2:r.width,y2:r.height,zoom:e}),V.createElement($e,{x1:0,y1:0,x2:0,y2:r.height,zoom:e}))))}var wt=V.memo(yn);function $e({x1:r,y1:e,x2:t,y2:n,zoom:o}){let i=I.getPerfectDashProps(Math.hypot(t-r,n-e),1/o,"dashed",1,!0,3);return V.createElement("line",{x1:r,y1:e,x2:t,y2:n,strokeWidth:1/o,strokeDasharray:i.strokeDasharray,strokeDashoffset:i.strokeDashoffset})}var Ct=L(require("perfect-freehand")),Ne=L(require("react"));function vn({points:r,zoom:e}){if(r.length===0)return null;let t=I.getSvgPathFromStroke((0,Ct.default)(r,{size:16/e,start:{taper:!0}}));return Ne.createElement("path",{d:t,className:"tl-erase-line"})}var Ht=Ne.memo(vn);var pe=L(require("react"));var It=[[-1,.15,64],[.05,.375,16],[.15,1,4],[.7,2.5,1]];function Mt({grid:r,camera:e}){return pe.createElement("svg",{className:"tl-grid",version:"1.1",xmlns:"http://www.w3.org/2000/svg"},pe.createElement("defs",null,It.map(([t,n,o],i)=>{let a=o*r*e.zoom,s=e.point[0]*e.zoom,d=e.point[1]*e.zoom,l=s>0?s%a:a+s%a,u=d>0?d%a:a+d%a,m=e.zoom<n?I.modulate(e.zoom,[t,n],[0,1]):1;return pe.createElement("pattern",{key:`grid-pattern-${i}`,id:`grid-${i}`,width:a,height:a,patternUnits:"userSpaceOnUse"},pe.createElement("circle",{className:"tl-grid-dot",cx:l,cy:u,r:1,opacity:m}))})),It.map((t,n)=>pe.createElement("rect",{key:`grid-rect-${n}`,width:"100%",height:"100%",fill:`url(#grid-${n})`})))}var te=L(require("react"));function xn({camera:{zoom:r,point:e},children:t}){let n=2.5/r;return te.createElement("svg",{className:"tl-overlay"},te.createElement("defs",null,te.createElement("g",{id:"tl-snap-point"},te.createElement("path",{className:"tl-snap-point",d:`M ${-n},${-n} L ${n},${n} M ${-n},${n} L ${n},${-n}`}))),te.createElement("g",{transform:`scale(${r}) translate(${e})`},t))}var kt=te.memo(xn);var G=L(require("react"));var D=L(require("react"));var de=L(require("react")),J=de.memo(de.forwardRef(function(a,i){var s=a,{id:e,className:t="",children:n}=s,o=O(s,["id","className","children"]);return de.createElement("svg",T({ref:i,className:`tl-positioned-svg ${t}`},o),de.createElement("g",{id:e,className:"tl-centered-g"},n))}));var We=L(require("react"));function bn({bounds:r,isLocked:e,isHidden:t}){return We.createElement("rect",{className:["tl-bounds-center",e?"tl-dashed":""].join(" "),x:-1,y:-1,width:r.width+2,height:r.height+2,opacity:t?0:1,pointerEvents:"none","aria-label":"center handle"})}var Kt=We.memo(bn);var W=L(require("react"));var q=L(require("react"));var Pn={right:0,bottomRight:45,bottom:90,bottomLeft:135,left:180,topLeft:225,top:270,topRight:315};function Rn({bounds:r,side:e,targetSize:t,size:n}){let o=t*2,i={left:-o,topLeft:-o,bottomLeft:-o,right:r.width,topRight:r.width,bottomRight:r.width,top:r.width/2-o/2,bottom:r.width/2-o/2}[e],a={left:r.height/2-o/2,right:r.height/2-o/2,top:-o*2,topLeft:-o,topRight:-o,bottom:r.height,bottomLeft:r.height,bottomRight:r.height}[e],{callbacks:s,inputs:d}=R(),l=q.useCallback(u=>{var c;u.stopPropagation();let m=d.pointerDown(u,e);(c=s.onShapeClone)==null||c.call(s,m,u)},[s.onShapeClone]);return q.createElement("g",{className:"tl-clone-target",transform:`translate(${i}, ${a})`,"aria-label":"clone button"},q.createElement("rect",{className:"tl-transparent",width:t*2,height:t*2}),q.createElement("g",{className:"tl-clone-button-target",onPointerDown:l,transform:`translate(${t}, ${t}) rotate(${Pn[e]})`},q.createElement("circle",{className:"tl-transparent ",r:t}),q.createElement("path",{className:"tl-clone-button",d:`M -${n/2},-${n/2} L ${n/2},0 -${n/2},${n/2} Z`,strokeLinejoin:"round"})))}var ee=q.memo(Rn);function En({targetSize:r,size:e,bounds:t}){return W.createElement(W.Fragment,null,W.createElement(ee,{targetSize:r,size:e,bounds:t,side:"top"}),W.createElement(ee,{targetSize:r,size:e,bounds:t,side:"right"}),W.createElement(ee,{targetSize:r,size:e,bounds:t,side:"bottom"}),W.createElement(ee,{targetSize:r,size:e,bounds:t,side:"left"}),W.createElement(ee,{targetSize:r,size:e,bounds:t,side:"topLeft"}),W.createElement(ee,{targetSize:r,size:e,bounds:t,side:"topRight"}),W.createElement(ee,{targetSize:r,size:e,bounds:t,side:"bottomLeft"}),W.createElement(ee,{targetSize:r,size:e,bounds:t,side:"bottomRight"}))}var Dt=W.memo(En);var he=L(require("react"));var Bn={["top_left_corner"]:"tl-cursor-nwse",["top_right_corner"]:"tl-cursor-nesw",["bottom_right_corner"]:"tl-cursor-nwse",["bottom_left_corner"]:"tl-cursor-nesw"};function Sn({size:r,targetSize:e,isHidden:t,corner:n,bounds:o}){let i=_(n),a=n==="top_left_corner"||n==="top_right_corner",s=n==="top_left_corner"||n==="bottom_left_corner";return he.createElement("g",{opacity:t?0:1},he.createElement("rect",T({className:"tl-transparent "+(t?"":Bn[n]),"aria-label":"corner transparent",x:(s?-1:o.width+1)-e,y:(a?-1:o.height+1)-e,width:e*2,height:e*2,pointerEvents:t?"none":"all"},i)),he.createElement("rect",{className:"tl-corner-handle","aria-label":"corner handle",x:(s?-1:o.width+1)-r/2,y:(a?-1:o.height+1)-r/2,width:r,height:r,pointerEvents:"none"}))}var Ee=he.memo(Sn);var Ae=L(require("react"));var wn={["top_edge"]:"tl-cursor-ns",["right_edge"]:"tl-cursor-ew",["bottom_edge"]:"tl-cursor-ns",["left_edge"]:"tl-cursor-ew"};function Cn({size:r,isHidden:e,bounds:t,edge:n}){let o=_(n),i=n==="top_edge"||n==="bottom_edge",a=n==="right_edge"||n==="bottom_edge",{height:s,width:d}=t;return Ae.createElement("rect",T({pointerEvents:e?"none":"all",className:"tl-transparent tl-edge-handle "+(e?"":wn[n]),"aria-label":`${n} handle`,opacity:e?0:1,x:i?r/2:(a?d+1:-1)-r/2,y:i?(a?s+1:-1)-r/2:r/2,width:i?Math.max(0,d+1-r):r,height:i?r:Math.max(0,s+1-r)},o))}var Be=Ae.memo(Cn);var z=L(require("react"));function Hn({size:r,bounds:e,isHidden:t}){let n=_("left"),o=_("center"),i=_("right");return z.createElement("g",{cursor:"grab",transform:`translate(${e.width/2-r*4}, ${e.height+r*2})`,"aria-label":"link handle"},z.createElement("g",{className:"tl-transparent",pointerEvents:t?"none":"all"},z.createElement("rect",T({x:0,y:0,width:r*2,height:r*2},n)),z.createElement("rect",T({x:r*3,y:0,width:r*2,height:r*2},o)),z.createElement("rect",T({x:r*6,y:0,width:r*2,height:r*2},i))),z.createElement("g",{className:"tl-rotate-handle",transform:`translate(${r/2}, ${r/2})`,"aria-label":"link rotate handle"},z.createElement("path",{d:`M 0,${r/2} L ${r},${r} ${r},0 Z`,pointerEvents:"none",opacity:t?0:1}),z.createElement("path",{transform:`translate(${r*3}, 0)`,d:`M 0,0 L ${r},0 ${r/2},${r} Z`,pointerEvents:"none",opacity:t?0:1}),z.createElement("path",{transform:`translate(${r*6}, 0)`,d:`M ${r},${r/2} L 0,0 0,${r} Z`,pointerEvents:"none",opacity:t?0:1})))}var Yt=z.memo(Hn);var fe=L(require("react"));function In({bounds:r,targetSize:e,size:t,isHidden:n}){let o=_("rotate");return fe.createElement("g",{cursor:"grab",opacity:n?0:1},fe.createElement("circle",T({className:"tl-transparent","aria-label":"rotate handle transparent",cx:r.width/2,cy:t*-2,r:e,pointerEvents:n?"none":"all"},o)),fe.createElement("circle",{className:"tl-rotate-handle","aria-label":"rotate handle",cx:r.width/2,cy:t*-2,r:t/2,pointerEvents:"none"}))}var Xt=fe.memo(In);var Mn=function({zoom:e,bounds:t,viewportWidth:n,rotation:o,isHidden:i,isLocked:a,hideCloneHandles:s,hideResizeHandles:d,hideRotateHandle:l,hideBindingHandles:u}){let m=(n<768?16:8)/e,c=8/e,p=Math.min(t.width,t.height)*e,y=!l&&!i&&!a&&p>32,g=!i&&!a&&p>24,v=!i&&!a&&p>20,E=!s&&p>24;return D.createElement(Z,{bounds:t,rotation:o},D.createElement(J,null,D.createElement(Kt,{bounds:t,isLocked:a,isHidden:i}),!d&&!a?D.createElement(D.Fragment,null,D.createElement(Be,{targetSize:m,size:c,bounds:t,edge:"top_edge",isHidden:!g}),D.createElement(Be,{targetSize:m,size:c,bounds:t,edge:"right_edge",isHidden:!g}),D.createElement(Be,{targetSize:m,size:c,bounds:t,edge:"bottom_edge",isHidden:!g}),D.createElement(Be,{targetSize:m,size:c,bounds:t,edge:"left_edge",isHidden:!g}),D.createElement(Ee,{targetSize:m,size:c,bounds:t,isHidden:i||!v,corner:"top_left_corner"}),D.createElement(Ee,{targetSize:m,size:c,bounds:t,isHidden:i||!v,corner:"top_right_corner"}),D.createElement(Ee,{targetSize:m,size:c,bounds:t,isHidden:i||!v,corner:"bottom_right_corner"}),D.createElement(Ee,{targetSize:m,size:c,bounds:t,isHidden:i||!v,corner:"bottom_left_corner"})):null,y&&D.createElement(Xt,{targetSize:m,size:c,bounds:t,isHidden:!g}),E&&D.createElement(Dt,{bounds:t,targetSize:m,size:c}),!u&&D.createElement(Yt,{targetSize:m,size:c,bounds:t,isHidden:!g})))},Ut=D.memo(Mn);var Te=L(require("react"));function kn({bounds:r,rotation:e,isHidden:t}){let n=Pt();return Te.createElement(Z,{bounds:r,rotation:e},Te.createElement(J,null,Te.createElement("rect",T({className:"tl-bounds-bg","aria-label":"bounds bg",width:r.width,height:r.height,opacity:t?0:1},n))))}var $t=Te.memo(kn);var Oe=require("@tldraw/vec"),le=L(require("react"));var ne=L(require("react"));function Kn({id:r,point:e}){let t=yt(r);return ne.createElement(Z,{bounds:I.translateBounds({minX:0,minY:0,maxX:0,maxY:0,width:0,height:0},e)},ne.createElement(J,null,ne.createElement("g",T({className:"tl-handle","aria-label":"handle"},t),ne.createElement("circle",{className:"tl-handle-bg",pointerEvents:"all"}),ne.createElement("circle",{className:"tl-counter-scaled tl-handle",pointerEvents:"none",r:4}))))}var Nt=ne.memo(Kn);function Dn({shape:r,zoom:e}){if(r.handles===void 0)return null;let t=null,n=Object.values(r.handles).reduce((o,i)=>{let a=Oe.Vec.add(i.point,r.point);return(!t||Oe.Vec.dist(a,t)*e>=32)&&(o.push(i),t=a),o},[]);return n.length===1?null:le.createElement(le.Fragment,null,n.map(o=>le.createElement(Nt,{key:r.id+"_"+o.id,id:o.id,point:Oe.Vec.add(o.point,r.point)})))}var Wt=le.memo(Dn);var oe=L(require("react"));var Se=L(require("react"));var Ve=L(require("react"));function Yn(r){let e=r.utils.getRef(r.shape);return Ve.createElement(r.utils.Component,T({ref:e},r))}var At=Ve.memo(Yn,(r,e)=>r.isHovered!==e.isHovered||r.isSelected!==e.isSelected||r.isEditing!==e.isEditing||r.isBinding!==e.isBinding||r.isGhost!==e.isGhost||r.meta!==e.meta?!1:e.shape!==r.shape?!e.utils.shouldRender(e.shape,r.shape):!0);function Xn(o){var i=o,{shape:r,utils:e,meta:t}=i,n=O(i,["shape","utils","meta"]);let{callbacks:a}=R(),s=e.getBounds(r),d=ct(r.id);return Se.createElement(Z,{id:r.id,bounds:s,rotation:r.rotation,"data-shape":r.type,isGhost:n.isGhost,isSelected:n.isSelected},Se.createElement(At,T({shape:r,utils:e,meta:t,events:d,bounds:s,onShapeChange:a.onShapeChange,onShapeBlur:a.onShapeBlur},n)))}var Ot=Se.memo(Xn);function Un(i){var a=i,{shape:r,utils:e,meta:t,children:n}=a,o=O(a,["shape","utils","meta","children"]);return oe.createElement(oe.Fragment,null,oe.createElement(Ot,T({shape:r,utils:e[r.type],meta:t},o)),n&&n.map(s=>oe.createElement(Je,T({key:s.shape.id,utils:e},s))))}var Je=oe.memo(Un);var ce=L(require("react"));function $n({isHovered:r=!1,isSelected:e=!1,isEditing:t=!1,shape:n,user:o,meta:i}){let{shapeUtils:a}=R(),s=a[n.type],d=s.getBounds(n),l=Xe(d,n.rotation);return ce.createElement("div",{ref:l,draggable:!1,className:["tl-indicator","tl-absolute",e&&!o?"tl-selected":"tl-hovered",t?"tl-editing":"",n.isLocked?"tl-locked":""].join(" ")},ce.createElement("svg",{width:"100%",height:"100%"},ce.createElement("g",{className:"tl-centered-g",stroke:o==null?void 0:o.color},ce.createElement(s.Indicator,{shape:n,meta:i,user:o,bounds:d,isSelected:e,isHovered:r}))))}var we=ce.memo($n);function Nn({page:r,pageState:e,assets:t,hideBounds:n,hideHandles:o,hideIndicators:i,hideBindingHandles:a,hideCloneHandles:s,hideRotateHandle:d,hideResizeHandles:l,meta:u}){let{bounds:m,shapeUtils:c}=R(),p=mt(r,e,t,u),{bounds:y,isLinked:g,isLocked:v,rotation:E}=gt(r,e,c),{selectedIds:f,hoveredId:x,editingId:X,camera:{zoom:U}}=e,w=i,b=!0,P=!1,H,M=f.map(k=>r.shapes[k]);if(M.length===1){let k=M[0];P=X===k.id,P&&(w=!0);let Q=c[k.type];b=s||!Q.showCloneHandles,k.handles!==void 0&&!P&&(H=k)}return G.createElement(G.Fragment,null,y&&G.createElement($t,{bounds:y,rotation:E,isHidden:n}),p.map(k=>G.createElement(Je,T({key:k.shape.id,utils:c},k))),!w&&M.map(k=>G.createElement(we,{key:"selected_"+k.id,shape:k,meta:u,isSelected:!0,isEditing:P})),!w&&x&&x!==X&&G.createElement(we,{key:"hovered_"+x,shape:r.shapes[x],meta:u,isHovered:!0}),y&&G.createElement(Ut,{zoom:U,bounds:y,viewportWidth:m.width,isLocked:v,rotation:E,isHidden:n,hideRotateHandle:d,hideResizeHandles:l,hideBindingHandles:a||!g,hideCloneHandles:b}),!o&&H&&G.createElement(Wt,{shape:H,zoom:U}))}var Vt=G.memo(Nn);var F=L(require("react"));function Wn({snapLines:r}){return F.createElement(F.Fragment,null,r.map((e,t)=>F.createElement(On,{key:t,snapLine:e})))}function An({snapLine:r}){let e=I.getBoundsFromPoints(r);return F.createElement(F.Fragment,null,F.createElement("line",{className:"tl-snap-line",x1:e.minX,y1:e.minY,x2:e.maxX,y2:e.maxY}),r.map(([t,n],o)=>F.createElement("use",{key:o,href:"#tl-snap-point",x:t,y:n})))}var On=F.memo(An),zt=F.memo(Wn);var Ce=L(require("react"));var N=L(require("react"));function Gt({user:r}){let e=N.useRef(null);return N.useLayoutEffect(()=>{e.current&&(e.current.style.transform=`translate(${r.point[0]}px, ${r.point[1]}px)`)},[r.point]),N.createElement("svg",{ref:e,className:`tl-absolute tl-user tl-counter-scaled ${r.session?"":"tl-animated"}`,xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 35 35",fill:"none",fillRule:"evenodd"},N.createElement("g",{fill:"rgba(0,0,0,.2)",transform:"translate(1,1)"},N.createElement("path",{d:"m12 24.4219v-16.015l11.591 11.619h-6.781l-.411.124z"}),N.createElement("path",{d:"m21.0845 25.0962-3.605 1.535-4.682-11.089 3.686-1.553z"})),N.createElement("g",{fill:"white"},N.createElement("path",{d:"m12 24.4219v-16.015l11.591 11.619h-6.781l-.411.124z"}),N.createElement("path",{d:"m21.0845 25.0962-3.605 1.535-4.682-11.089 3.686-1.553z"})),N.createElement("g",{fill:r.color},N.createElement("path",{d:"m19.751 24.4155-1.844.774-3.1-7.374 1.841-.775z"}),N.createElement("path",{d:"m13 10.814v11.188l2.969-2.866.428-.139h4.768z"})))}function Ft({userId:r,users:e}){return Ce.createElement(Ce.Fragment,null,Object.values(e).filter(t=>t&&t.id!==r).map(t=>Ce.createElement(Gt,{key:t.id,user:t})))}var re=L(require("react"));function jt({userId:r,users:e,meta:t,page:n}){let{shapeUtils:o}=R();return re.createElement(re.Fragment,null,Object.values(e).filter(Boolean).filter(i=>i.id!==r&&i.selectedIds.length>0).map(i=>{let a=i.selectedIds.map(d=>n.shapes[d]).filter(Boolean);if(a.length===0)return null;let s=I.getCommonBounds(a.map(d=>o[d.type].getBounds(d)));return re.createElement(re.Fragment,{key:i.id+"_shapes"},re.createElement("div",{className:"tl-absolute tl-user-indicator-bounds",style:{backgroundColor:i.color+"0d",borderColor:i.color+"78",transform:`translate(${s.minX}px, ${s.minY}px)`,width:s.width,height:s.height,pointerEvents:"none"}}),a.map(d=>re.createElement(we,{key:`${i.id}_${d.id}_indicator`,shape:d,user:i,meta:t,isHovered:!0})))}))}var ie=L(require("react"));var Vn=r=>{let e=r.parentElement;for(;e;){if(e===document.body)return document;let{overflowY:t}=window.getComputedStyle(e);if(e.scrollHeight>e.clientHeight&&(t==="auto"||t==="scroll"||t==="overlay"))return e;e=e.parentElement}return document};function _t(r,e){let{inputs:t,callbacks:n}=R(),o=ie.useRef(!1),i=ie.useCallback(()=>{var a,s;if(o.current){let d=(a=r.current)==null?void 0:a.getBoundingClientRect();if(d){let l={minX:d.left,maxX:d.left+d.width,minY:d.top,maxY:d.top+d.height,width:d.width,height:d.height};t.bounds=l,e(l),(s=n.onBoundsChange)==null||s.call(n,l)}}else o.current=!0},[r,t,n.onBoundsChange]);ie.useEffect(()=>{let a=r.current?Vn(r.current):document,s=S.debounce(i,100);return a.addEventListener("scroll",s),window.addEventListener("resize",s),()=>{a.removeEventListener("scroll",s),window.removeEventListener("resize",s)}},[]),ie.useEffect(()=>{let a=new ResizeObserver(s=>{t.isPinching||s[0].contentRect&&i()});return r.current&&a.observe(r.current),()=>{a.disconnect()}},[r,t]),ie.useEffect(()=>{i()},[r])}function zn({id:r,page:e,pageState:t,assets:n,snapLines:o,eraseLine:i,grid:a,users:s,userId:d,meta:l,performanceMode:u,externalContainerRef:m,showDashedBrush:c,hideHandles:p,hideBounds:y,hideIndicators:g,hideBindingHandles:v,hideCloneHandles:E,hideResizeHandles:f,hideRotateHandle:x,hideGrid:X,onBoundsChange:U}){let w=Y.useRef(null),b=Y.useRef(t.camera.zoom);b.current=t.camera.zoom,it(b,m||w),_t(w,U),at(),xt(w);let P=Y.useRef(null),H=Y.useRef(null);ht(H,P,t),St(u,P),Et();let M=lt();return Y.createElement("div",{id:r,className:"tl-container",ref:P},Y.createElement("div",T({id:"canvas",className:"tl-absolute tl-canvas",ref:w},M),!X&&a&&Y.createElement(Mt,{grid:a,camera:t.camera}),Y.createElement("div",{ref:H,className:"tl-absolute tl-layer","data-testid":"layer"},Y.createElement(Vt,{page:e,pageState:t,assets:n,hideBounds:y,hideIndicators:g,hideHandles:p,hideBindingHandles:v,hideCloneHandles:E,hideResizeHandles:f,hideRotateHandle:x,meta:l}),s&&d&&Y.createElement(jt,{userId:d,users:s,page:e,meta:l}),t.brush&&Y.createElement(wt,{brush:t.brush,dashed:c,zoom:t.camera.zoom}),s&&Y.createElement(Ft,{userId:d,users:s})),Y.createElement(kt,{camera:t.camera},i&&Y.createElement(Ht,{points:i,zoom:t.camera.zoom}),o&&Y.createElement(zt,{snapLines:o}))))}var Zt=Y.memo(zn);var se=require("@tldraw/vec");var Gn=250,C=class{constructor(){B(this,"pointer");B(this,"keyboard");B(this,"keys",{});B(this,"isPinching",!1);B(this,"bounds",{minX:0,maxX:640,minY:0,maxY:480,width:640,height:480});B(this,"pointerUpTime",0);B(this,"activePointer");B(this,"panStart",e=>{var s,d;let{shiftKey:t,ctrlKey:n,metaKey:o,altKey:i}=e,a={target:"wheel",pointerId:((s=this.pointer)==null?void 0:s.pointerId)||0,origin:((d=this.pointer)==null?void 0:d.origin)||[0,0],delta:[0,0],pressure:.5,point:C.getPoint(e,this.bounds),shiftKey:t,ctrlKey:n,metaKey:o,altKey:i,spaceKey:this.keys[" "]};return this.pointer=a,a});B(this,"pan",(e,t)=>{if(!this.pointer||this.pointer.target!=="wheel")return this.panStart(t);let{shiftKey:n,ctrlKey:o,metaKey:i,altKey:a}=t,s=this.pointer,d=C.getPoint(t,this.bounds),l=$(T({},s),{target:"wheel",delta:e,point:d,shiftKey:n,ctrlKey:o,metaKey:i,altKey:a,spaceKey:this.keys[" "]});return this.pointer=l,l});B(this,"keydown",e=>{var a,s;let{shiftKey:t,ctrlKey:n,metaKey:o,altKey:i}=e;return this.keys[e.key]=!0,{point:((a=this.pointer)==null?void 0:a.point)||[0,0],origin:((s=this.pointer)==null?void 0:s.origin)||[0,0],key:e.key,keys:Object.keys(this.keys),shiftKey:t,ctrlKey:n,metaKey:S.isDarwin()?o:n,altKey:i}});B(this,"keyup",e=>{var a,s;let{shiftKey:t,ctrlKey:n,metaKey:o,altKey:i}=e;return delete this.keys[e.key],{point:((a=this.pointer)==null?void 0:a.point)||[0,0],origin:((s=this.pointer)==null?void 0:s.origin)||[0,0],key:e.key,keys:Object.keys(this.keys),shiftKey:t,ctrlKey:n,metaKey:S.isDarwin()?o:n,altKey:i}})}pointerIsValid(e){if("pointerId"in e&&this.activePointer&&this.activePointer!==e.pointerId)return!1;if("touches"in e){let t=e.changedTouches[0];if(this.activePointer&&this.activePointer!==t.identifier)return!1}return!0}touchStart(e,t){let{shiftKey:n,ctrlKey:o,metaKey:i,altKey:a}=e,s=e.changedTouches[0];this.activePointer=s.identifier;let d={target:t,pointerId:s.identifier,origin:C.getPoint(s,this.bounds),delta:[0,0],point:C.getPoint(s,this.bounds),pressure:C.getPressure(s),shiftKey:n,ctrlKey:o,metaKey:S.isDarwin()?i:o,altKey:a,spaceKey:this.keys[" "]};return this.pointer=d,d}touchEnd(e,t){let{shiftKey:n,ctrlKey:o,metaKey:i,altKey:a}=e,s=e.changedTouches[0],d={target:t,pointerId:s.identifier,origin:C.getPoint(s,this.bounds),delta:[0,0],point:C.getPoint(s,this.bounds),pressure:C.getPressure(s),shiftKey:n,ctrlKey:o,metaKey:S.isDarwin()?i:o,altKey:a,spaceKey:this.keys[" "]};return this.pointer=d,this.activePointer=void 0,d}touchMove(e,t){let{shiftKey:n,ctrlKey:o,metaKey:i,altKey:a}=e,s=e.changedTouches[0],d=this.pointer,l=C.getPoint(s,this.bounds),u=(d==null?void 0:d.point)?se.Vec.sub(l,d.point):[0,0],m=$(T({origin:l},d),{target:t,pointerId:s.identifier,point:l,delta:u,pressure:C.getPressure(s),shiftKey:n,ctrlKey:o,metaKey:S.isDarwin()?i:o,altKey:a,spaceKey:this.keys[" "]});return this.pointer=m,m}pointerDown(e,t){let{shiftKey:n,ctrlKey:o,metaKey:i,altKey:a}=e,s=C.getPoint(e,this.bounds);this.activePointer=e.pointerId;let d={target:t,pointerId:e.pointerId,origin:s,point:s,delta:[0,0],pressure:C.getPressure(e),shiftKey:n,ctrlKey:o,metaKey:S.isDarwin()?i:o,altKey:a,spaceKey:this.keys[" "]};return this.pointer=d,d}pointerEnter(e,t){let{shiftKey:n,ctrlKey:o,metaKey:i,altKey:a}=e,s=C.getPoint(e,this.bounds),d={target:t,pointerId:e.pointerId,origin:s,delta:[0,0],point:s,pressure:C.getPressure(e),shiftKey:n,ctrlKey:o,metaKey:S.isDarwin()?i:o,altKey:a,spaceKey:this.keys[" "]};return this.pointer=d,d}pointerMove(e,t){let{shiftKey:n,ctrlKey:o,metaKey:i,altKey:a}=e,s=this.pointer,d=C.getPoint(e,this.bounds),l=(s==null?void 0:s.point)?se.Vec.sub(d,s.point):[0,0],u=$(T({origin:d},s),{target:t,pointerId:e.pointerId,point:d,delta:l,pressure:C.getPressure(e),shiftKey:n,ctrlKey:o,metaKey:S.isDarwin()?i:o,altKey:a,spaceKey:this.keys[" "]});return this.pointer=u,u}pointerUp(e,t){let{shiftKey:n,ctrlKey:o,metaKey:i,altKey:a}=e,s=this.pointer,d=C.getPoint(e,this.bounds),l=(s==null?void 0:s.point)?se.Vec.sub(d,s.point):[0,0];this.activePointer=void 0;let u=$(T({origin:d},s),{target:t,pointerId:e.pointerId,point:d,delta:l,pressure:C.getPressure(e),shiftKey:n,ctrlKey:o,metaKey:S.isDarwin()?i:o,altKey:a,spaceKey:this.keys[" "]});return this.pointer=u,this.pointerUpTime=performance.now(),u}isDoubleClick(){if(!this.pointer)return!1;let{origin:e,point:t}=this.pointer,n=performance.now()-this.pointerUpTime<Gn&&se.Vec.dist(e,t)<4;return n&&(this.activePointer=void 0),n}clear(){this.pointer=void 0}resetDoubleClick(){this.pointerUpTime=0}pinch(e,t){let{shiftKey:n,ctrlKey:o,metaKey:i,altKey:a}=this.keys,s=se.Vec.sub(t,e),d={pointerId:0,target:"pinch",origin:t,delta:s,point:se.Vec.sub(se.Vec.toFixed(e),[this.bounds.minX,this.bounds.minY]),pressure:.5,shiftKey:n,ctrlKey:o,metaKey:S.isDarwin()?i:o,altKey:a,spaceKey:this.keys[" "]};return this.pointer=d,d}reset(){this.pointerUpTime=0,this.pointer=void 0,this.keyboard=void 0,this.activePointer=void 0,this.keys={}}static getPoint(e,t){return[+e.clientX.toFixed(2)-t.minX,+e.clientY.toFixed(2)-t.minY]}static getPressure(e){return"pressure"in e&&+e.pressure.toFixed(2)||.5}static commandKey(){return S.isDarwin()?"\u2318":"Ctrl"}},Fn=new C;var jn={};function _n(P){var H=P,{id:r="tl",shapeUtils:e,page:t,pageState:n,assets:o=jn,users:i,userId:a,theme:s,meta:d,snapLines:l,eraseLine:u,grid:m,containerRef:c,performanceMode:p,hideHandles:y=!1,hideIndicators:g=!1,hideCloneHandles:v=!1,hideBindingHandles:E=!1,hideResizeHandles:f=!1,hideRotateHandles:x=!1,hideBounds:X=!1,hideGrid:U=!0,showDashedBrush:w=!1}=H,b=O(H,["id","shapeUtils","page","pageState","assets","users","userId","theme","meta","snapLines","eraseLine","grid","containerRef","performanceMode","hideHandles","hideIndicators","hideCloneHandles","hideBindingHandles","hideResizeHandles","hideRotateHandles","hideBounds","hideGrid","showDashedBrush"]);pt(s,"#"+r);let M=A.useRef(null),k=A.useRef(n);A.useEffect(()=>{k.current=n},[n]);let[Q,ae]=A.useState(()=>({callbacks:b,shapeUtils:e,rSelectionBounds:M,rPageState:k,bounds:{minX:0,minY:0,maxX:1/0,maxY:1/0,width:1/0,height:1/0},inputs:new C})),Qt=A.useCallback(Jt=>{ae(en=>$(T({},en),{bounds:Jt}))},[]);return A.createElement(Le.Provider,{value:Q},A.createElement(Zt,{id:r,page:t,pageState:n,assets:o,snapLines:l,eraseLine:u,grid:m,users:i,userId:a,externalContainerRef:c,hideBounds:X,hideIndicators:g,hideHandles:y,hideCloneHandles:v,hideBindingHandles:E,hideRotateHandle:x,hideResizeHandles:f,hideGrid:U,showDashedBrush:w,onBoundsChange:Qt,performanceMode:p,meta:d}))}var Zn=A.memo(_n);var ue=L(require("react")),qn=ue.memo(ue.forwardRef(function(i,o){var a=i,{children:e,className:t=""}=a,n=O(a,["children","className"]);return ue.createElement("div",T({ref:o,className:`tl-positioned-div ${t}`,draggable:!1},n),ue.createElement("div",{className:"tl-inner-div"},e))}));var qt=require("@tldraw/intersect"),Ge=L(require("react"));var ze=class{constructor(){B(this,"refMap",new Map);B(this,"boundsCache",new WeakMap);B(this,"showCloneHandles",!1);B(this,"hideBounds",!1);B(this,"isStateful",!1);B(this,"shouldRender",(e,t)=>!0);B(this,"getRef",e=>(this.refMap.has(e.id)||this.refMap.set(e.id,Ge.createRef()),this.refMap.get(e.id)));B(this,"hitTestBounds",(e,t)=>{let n=this.getBounds(e),o=I.getRotatedCorners(n,e.rotation);return o.every(i=>I.pointInBounds(i,t))||(0,qt.intersectPolygonBounds)(o,t).length>0});B(this,"getRotatedBounds",e=>I.getBoundsFromPoints(I.getRotatedCorners(this.getBounds(e),e.rotation)))}};B(ze,"Component",e=>Ge.forwardRef(e)),B(ze,"Indicator",e=>e);module.exports=ln(Qn);
/**
 * String.prototype.replaceAll() polyfill
 * https://gomakethings.com/how-to-replace-a-section-of-a-string-with-another-one-with-vanilla-js/
 * @author Chris Ferdinandi
 * @license MIT
 */
//# sourceMappingURL=index.js.map