1const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["assets/vendor-export-DLngdRqf.js","assets/vendor-react-C9yDzYQD.js"])))=>i.map(i=>d[i]); 2import{_ as e}from"./runtime-preload-CFP917pd.js";import{r as t,j as r,a as n,R as a}from"./vendor-react-C9yDzYQD.js";import{supabase as i}from"./supabase-client-_h80EYw_.js";import{a as o,u as s}from"./vendor-query-DpPswXvj.js";import{B as l}from"./button-CcIRk75H.js";import{I as c}from"./input-CJADGzyX.js";import{S as d}from"./slider-16Gwg18s.js";import{u as h}from"./useAuth-Dz3EPsxs.js";import{a as u,b as m}from"./runtime-utils-GN4cODRt.js";import{P as x,a as p,b as f}from"./popover-BqNd_ntB.js";import{T as w}from"./type-BPxbhrRm.js";import{S as g}from"./search-D7ByVMw5.js";import{S as v}from"./star-PkyT3oQ1.js";import{A as b,a as y,b as j,Q as N}from"./quote-DXetA9wY.js";import{B as k,I as S,H as C,a as M}from"./italic-D6D3ztyg.js";import{c as _}from"./createLucideIcon-DNcTU-zM.js";import{S as E}from"./sliders-horizontal-Bf84lb4T.js";import{E as R}from"./ellipsis-D4MBwnVX.js";import{C as z}from"./copy-BrZVoqd7.js";import{L as T}from"./lock-Dh-2FzOx.js";import{A}from"./arrow-up-B_wwnXCW.js";import{A as P}from"./arrow-down-BaXtb92R.js";import{T as D}from"./trash-2-B7zVZuh_.js";import{V as L}from"./VideoPosterOnly-CNeQsWm2.js";import{b as F}from"./image-utils-AdRSPECl.js";import{a as B,m as Y,R as H,b as I}from"./vendor-animation-DJXjROdF.js";import{L as X}from"./loader-circle-CWK_zhHB.js";import{R as W}from"./rotate-cw-BM7LyWim.js";import{I as $}from"./image-Bt9rnFUc.js";import{P as O,c as q,a as K,u as V}from"./index-BrpnBk_C.js";import{P as U,c as J}from"./index-CuooO_kK.js";import{u as Q}from"./index-DyIfOVK5.js";import{u as G}from"./index-CfYZuMWu.js";import{c as Z}from"./index-jVOyRz7F.js";import{u as ee}from"./useBoards-KZlRZb0G.js";import{T as te,a as re,b as ne,c as ae}from"./tabs-DdWd6h3i.js";import{G as ie}from"./grip-vertical-DC3L8uyk.js";import{V as oe}from"./video-DibMJbQh.js";import{E as se}from"./eye-off-Dee1325O.js";import{E as le}from"./eye-Dkh28JiF.js";import{S as ce}from"./sticky-note-B8w2Mnxi.js";import{C as de}from"./chevron-down-BFi_I8Zn.js";import{C as he}from"./check-MQhLD6FV.js";import{P as ue}from"./plus-CNl86JwM.js";import{S as me,a as xe,b as pe}from"./sheet-CpTCe5Eu.js";import{D as fe,a as we,b as ge,c as ve}from"./dialog-DHNNRuDw.js";import{t as be}from"./canvasTelemetry-BiDssRnL.js";import{D as ye}from"./useUserSettings-COPNty3J.js";import{s as je}from"./windowResizeSubscriptions-C3xwW4pN.js";import{a as Ne}from"./startup-platform-OWIpYyjW.js";import{u as ke}from"./r2-upload-BKh8xYPI.js";import{a as Se,f as Ce,e as Me,h as _e,d as Ee,c as Re,g as ze,m as Te}
2from"./canvasFormats-DrEJnqdk.js";import{d as Ae,u as Pe}from"./vendor-router-X7RJKav4.js";import{A as De}from"./arrow-left-B8V7NEG8.js";import{M as Le}from"./maximize-2-CH7Eq6Sf.js";import{M as Fe}from"./minus-DTEknrgZ.js";import{C as Be}from"./crop-D7OvLSp8.js";import{S as Ye}from"./save-bUzvHLwe.js";const He=_("AlignCenterVertical",[["path",{d:"M12 2v20",key:"t6zp3m"}],["path",{d:"M8 10H4a2 2 0 0 1-2-2V6c0-1.1.9-2 2-2h4",key:"14d6g8"}],["path",{d:"M16 10h4a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2h-4",key:"1e2lrw"}],["path",{d:"M8 20H7a2 2 0 0 1-2-2v-2c0-1.1.9-2 2-2h1",key:"1fkdwx"}],["path",{d:"M16 14h1a2 2 0 0 1 2 2v2a2 2 0 0 1-2 2h-1",key:"1euafb"}]]),Ie=_("AlignEndVertical",[["rect",{width:"16",height:"6",x:"2",y:"4",rx:"2",key:"10wcwx"}],["rect",{width:"9",height:"6",x:"9",y:"14",rx:"2",key:"4p5bwg"}],["path",{d:"M22 22V2",key:"12ipfv"}]]),Xe=_("AlignHorizontalDistributeCenter",[["rect",{width:"6",height:"14",x:"4",y:"5",rx:"2",key:"1wwnby"}],["rect",{width:"6",height:"10",x:"14",y:"7",rx:"2",key:"1fe6j6"}],["path",{d:"M17 22v-5",key:"4b6g73"}],["path",{d:"M17 7V2",key:"hnrr36"}],["path",{d:"M7 22v-3",key:"1r4jpn"}],["path",{d:"M7 5V2",key:"liy1u9"}]]),We=_("AlignStartVertical",[["rect",{width:"9",height:"6",x:"6",y:"14",rx:"2",key:"lpm2y7"}],["rect",{width:"16",height:"6",x:"6",y:"4",rx:"2",key:"rdj6ps"}],["path",{d:"M2 2v20",key:"1ivd8o"}]]),$e=_("AlignVerticalDistributeCenter",[["path",{d:"M22 17h-3",key:"1lwga1"}],["path",{d:"M22 7h-5",key:"o2endc"}],["path",{d:"M5 17H2",key:"1gx9xc"}],["path",{d:"M7 7H2",key:"6bq26l"}],["rect",{x:"5",y:"14",width:"14",height:"6",rx:"2",key:"1qrzuf"}],["rect",{x:"7",y:"4",width:"10",height:"6",rx:"2",key:"we8e9z"}]]),Oe=_("CaseSensitive",[["path",{d:"m3 15 4-8 4 8",key:"1vwr6u"}],["path",{d:"M4 13h6",key:"1r9ots"}],["circle",{cx:"18",cy:"12",r:"3",key:"1kchzo"}],["path",{d:"M21 9v6",key:"anns31"}]]),qe=_("Eraser",[["path",{d:"m7 21-4.3-4.3c-1-1-1-2.5 0-3.4l9.6-9.6c1-1 2.5-1 3.4 0l5.6 5.6c1 1 1 2.5 0 3.4L13 21",key:"182aya"}],["path",{d:"M22 21H7",key:"t4ddhn"}],["path",{d:"m5 11 9 9",key:"1mo9qw"}]]),Ke=_("FlipHorizontal",[["path",{d:"M8 3H5a2 2 0 0 0-2 2v14c0 1.1.9 2 2 2h3",key:"1i73f7"}],["path",{d:"M16 3h3a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2h-3",key:"saxlbk"}],["path",{d:"M12 20v2",key:"1lh1kg"}],["path",{d:"M12 14v2",key:"8jcxud"}],["path",{d:"M12 8v2",key:"1woqiv"}],["path",{d:"M12 2v2",key:"tus03m"}]]),Ve=_("FlipVertical",[["path",{d:"M21 8V5a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v3",key:"14bfxa"}],["path",{d:"M21 16v3a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-3",key:"14rx03"}],["path",{d:"M4 12H2",key:"rhcxmi"}],["path",{d:"M10 12H8",key:"s88cx1"}],["path",{d:"M16 12h-2",key:"10asgb"}],["path",{d:"M22 12h-2",key:"14jgyd"}]]),Ue=_("Layers",[["path",{d:"m12.83 2.18a2 2 0 0 0-1.66 0L2.6 6.08a1 1 0 0 0 0 1.83l8.58 3.91a2 2 0 0 0 1.66 0l8.58-3.9a1 1 0 0 0 0-1.83Z",key:"8b97xw"}],["path",{d:"m22 17.65-9.17 4.16a2 2 0 0 1-1.66 0L2 17.65",key:"dd6zsq"}],["path",{d:"m22 12.65-9.17 4.16a2 2 0 0 1-1.66 0L2 12.65",key:"ep9fru"}]]),Je=_("LockOpen",[["rect",{width:"18",height:"11",x:"3",y:"11",rx:"2",ry:"2",key:"1w4ew1"}],["path",{d:"M7 11V7a5 5 0 0 1 9.9-1",key:"1mm8w8"}]]),Qe=_("Pilcrow",[["path",{d:"M13 4v16",key:"8vvj80"}],["path",{d:"M17 4v16",key:"7dpous"}],["path",{d:"M19 4H9.5a4.5 4.5 0 0 0 0 9H13",key:"sh4n9v"}]]),Ge=_("Underline",[["path",{d:"M6 4v6a6 6 0 0 0 12 0V4",key:"9kb039"}],["line",{x1:"4",x2:"20",y1:"20",y2:"20",key:"nun2al"}]]),Ze=[{id:"title",label:"Title",description:"Strong editorial heading",content:"Type something",boxMode:"auto",width:620,height:120,style:{fontFamily:"Manrope, sans-serif",fontSize:76,fontWeight:"800",lineHeight:1.02,letterSpacing:-1.8,textAlign:"center",color:"#ffffff"}},{id:"subtitle",label:"Subtitle",description:"Supporting statement",content:"Type something",boxMode:"auto",width:520,height:86,style:{fontFamily:"Manrope, sans-serif",fontSize:44,fontWeight:"600",lineHeight:1.12,letterSpacing:-.4,textAlign:"center",color:"#ffffff"}},{id:"paragraph",label:"Paragraph",description:"Readable body copy",content:"Type something",boxMode:"fixed",width:560,height:210,style:{fontFamily:"Inter, sans-serif",fontSize:30,fontWeight:"400",lineHeight:1.45,letterSpacing:0,textAlign:"left",color:"#ffffff"}},{id:"caption",label:"Caption",description:"Compact supporting copy",content:"Type something",boxMode:"fixed",width:420,height:100,style:{fontFamily:"Inter, sans-serif",fontSize:22,fontWeight:"500",lineHeight:1.3,letterSpacing:.2,textAlign:"left",color:"#ffffff"}},{id:"quote",label:"Quote",description:"Editorial multiline quote",content:"âType somethingâ",boxMode:"fixed",width:700,height:280,style:{fontFamily:"Playfair Display, serif",fontSize:54,fontWeight:"600",fontStyle:"italic",lineHeight:1.2,letterSpacing:-.5,textAlign:"center",color:"#ffffff",textShadow:"0 2px 12px rgba(0,0,0,0.35)"}},{id:"label",label:"Label",description:"Short highlighted marker",content:"TYPE SOMETHING",boxMode:"auto",width:360,height:74,style:{fontFamily:"Space Grotesk, sans-serif",fontSize:22,fontWeight:"700",lineHeight:1,letterSpacing:1.8,textAlign:"center",color:"#111111",backgroundColor:"rgba(255,255,255,0.92)",padding:18,borderRadius:12}},{id:"note",label:"Small note",description:"Handwritten journal annotation",content:"Type something",boxMode:"fixed",width:380,height:120,style:{fontFamily:"Caveat, cursive",fontSize:34,fontWeight:"500",lineHeight:1.2,letterSpacing:0,textAlign:"left",color:"#ffffff"}}],et=[{name:"Manrope",value:"Manrope, sans-serif",category:"Recommended"},{name:"Inter",value:"Inter, sans-serif",category:"Recommended"},{name:"Playfair Display",value:"Playfair Display, serif",category:"Recommended"},{name:"Space Grotesk",value:"Space Grotesk, sans-serif",category:"Recommended"},{name:"Caveat",value:"Caveat, cursive",category:"Recommended"},{name:"JetBrains Mono",value:"JetBrains Mono, monospace",category:"Recommended"},{name:"Arial",value:"Arial, sans-serif",category:"Sans serif"},{name:"Helvetica",value:"Helvetica, Arial, sans-serif",category:"Sans serif"},{name:"Verdana",value:"Verdana, sans-serif",category:"Sans serif"},{name:"Trebuchet",value:"Trebuchet MS, sans-serif",category:"Sans serif"},{name:"Georgia",value:"Georgia, serif",category:"Serif"},{name:"Baskerville",value:"Baskerville, Georgia, serif",category:"Serif"},{name:"Times",value:"Times New Roman, serif",category:"Serif"},{name:"Impact",value:"Impact, sans-serif",category:"Display"},{name:"Copperplate",value:"Copperplate, fantasy",category:"Display"},{name:"Dancing Script",value:"Dancing Script, cursive",category:"Handwritten"},{name:"Brush Script",value:"Brush Script MT, cursive",category:"Handwritten"},{name:"Courier",value:"Courier New, monospace",category:"Monospace"},{name:"Menlo",value:"Menlo, Monaco, monospace",category:"Monospace"},{name:"IBM Plex Mono",value:"IBM Plex Mono, monospace",category:"Monospace"}],tt={none:"none",soft:"0 2px 8px rgba(0,0,0,0.4)",hard:"2px 2px 0px rgba(0,0,0,0.8)",glow:"0 0 12px rgba(255,255,255,0.8)"}
2,rt=({element:e,onChange:n,isEditing:a=!1,advancedEnabled:i=!0,onDuplicate:o,onRemove:s})=>{var h;const m=e.style||{},[N,C]=t.useState(""),[M,_]=t.useState(()=>{try{const e=JSON.parse(window.localStorage.getItem("echo-canvas-favorite-fonts")||"[]");return Array.isArray(e)?e:[]}catch{return[]}}),L=(t,r)=>{n(e.id,{style:{...m,[t]:r}},!0)},F=(null==(h=Object.entries(tt).find(([,e])=>e===m.textShadow))?void 0:h[0])||"none",B=et.find(e=>e.value===m.fontFamily),Y=t.useMemo(()=>et.filter(e=>e.name.toLowerCase().includes(N.trim().toLowerCase())),[N]),H=Number.parseInt(m.fontWeight||"400",10)>=600||"bold"===m.fontWeight;return r.jsxs("div",{className:"flex max-w-[min(58rem,calc(100vw-2rem))] flex-wrap items-center gap-1.5 rounded-2xl border border-white/12 bg-neutral-950/95 p-2.5 shadow-2xl shadow-black/45 backdrop-blur-xl",onMouseDown:e=>e.preventDefault(),children:[a&&r.jsxs(r.Fragment,{children:[r.jsxs("span",{className:"flex h-8 items-center gap-2 rounded-xl bg-primary/16 px-3 text-xs font-semibold text-primary",children:[r.jsx("span",{className:"h-2 w-2 animate-pulse rounded-full bg-primary"}),"Editing text"]}),r.jsx("div",{className:"h-5 w-px flex-shrink-0 bg-white/20"})]}),r.jsxs(x,{children:[r.jsx(p,{asChild:!0,children:r.jsx("button",{className:"h-8 w-8 flex-shrink-0 rounded-full border border-white/25 transition-transform hover:scale-110",style:{backgroundColor:m.color||"#ffffff"},title:"Text color","aria-label":"Text color"})}),r.jsx(f,{className:"w-auto p-3 bg-black/90 border-white/10 rounded-2xl",children:r.jsx("div",{className:"grid grid-cols-5 gap-2",children:["#ffffff","#000000","#ef4444","#f97316","#eab308","#22c55e","#3b82f6","#a855f7","#ec4899"].map(e=>r.jsx("button",{className:u("w-6 h-6 rounded-full border border-white/10 hover:scale-110 transition-transform",m.color===e&&"ring-2 ring-white"),style:{backgroundColor:e},onClick:()=>L("color",e)},e))})})]}),r.jsx("div",{className:"w-px h-4 bg-white/20 flex-shrink-0"}),r.jsxs(x,{children:[r.jsx(p,{asChild:!0,children:r.jsx(l,{variant:"ghost",size:"icon",className:"h-9 w-9 flex-shrink-0 rounded-xl text-white hover:bg-white/10",title:"Font size",children:r.jsx(w,{className:"h-4 w-4"})})}),r.jsx(f,{className:"w-52 p-4 bg-black/90 border-white/10 rounded-2xl",children:r.jsxs("div",{className:"space-y-4",children:[r.jsxs("div",{className:"space-y-2",children:[r.jsxs("label",{className:"text-xs text-white/50 font-medium",children:["Size: ",m.fontSize||16,"px"]}),r.jsx(d,{value:[m.fontSize||16],min:12,max:120,step:1,onValueChange:([e])=>L("fontSize",e)})]}),r.jsxs("div",{className:"space-y-2",children:[r.jsxs("label",{className:"text-xs text-white/50 font-medium",children:["Letter spacing: ",m.letterSpacing??0,"px"]}),r.jsx(d,{value:[m.letterSpacing??0],min:-2,max:10,step:.5,onValueChange:([e])=>L("letterSpacing",e)})]}),r.jsxs("div",{className:"space-y-2",children:[r.jsxs("label",{className:"text-xs text-white/50 font-medium",children:["Line height: ",m.lineHeight??1.4]}),r.jsx(d,{value:[m.lineHeight??1.4],min:1,max:2.5,step:.1,onValueChange:([e])=>L("lineHeight",e)})]})]})})]}),r.jsxs(x,{children:[r.jsx(p,{asChild:!0,children:r.jsx(l,{variant:"ghost",size:"sm",className:"h-9 flex-shrink-0 rounded-xl px-3 text-sm font-medium text-white hover:bg-white/10",children:(null==B?void 0:B.name)||"Font"})}),r.jsxs(f,{className:"w-72 rounded-2xl border-white/10 bg-black/95 p-2 text-white",children:[r.jsxs("div",{className:"relative mb-2",children:[r.jsx(g,{className:"absolute left-3 top-1/2 h-3.5 w-3.5 -translate-y-1/2 text-white/35"}),r.jsx(c,{value:N,onChange:e=>C(e.target.value),placeholder:"Search fonts",className:"h-9 rounded-xl border-white/10 bg-white/[0.06] pl-9 text-xs text-white"})]}),r.jsxs("div",{className:"max-h-72 overflow-y-auto",children:[Array.from(new Set(Y.map(e=>e.category))).map(t=>r.jsxs("div",{className:"mb-2",children:[r.jsx("div",{className:"px-2 py-1 text-[9px] font-bold uppercase tracking-widest text-white/30",children:t}),Y.filter(e=>e.category===t).map(t=>r.jsxs("div",{className:u("flex items-center rounded-xl",m.fontFamily===t.value&&"bg-primary/12"),children:[r.jsx("button",{className:u("min-w-0 flex-1 truncate px-3 py-2 text-left text-base text-white/80 hover:text-white",m.fontFamily===t.value&&"text-primary"),style:{fontFamily:t.value},onClick:()=>(e=>{L("fontFamily",e);try{const t=JSON.parse(window.localStorage.getItem("echo-canvas-recent-fonts")||"[]"),r=Array.isArray(t)?t.filter(e=>"string"==typeof e):[];window.localStorage.setItem("echo-canvas-recent-fonts",JSON.stringify([e,...r.filter(t=>t!==e)].slice(0,6)))}catch{window.localStorage.setItem("echo-canvas-recent-fonts",JSON.stringify([e]))}})(t.value),children:e.content||t.name}),r.jsx("button",{type:"button",onClick:()=>(e=>{const t=M.includes(e)?M.filter(t=>t!==e):[...M,e];_(t),window.localStorage.setItem("echo-canvas-favorite-fonts",JSON.stringify(t))})(t.value),className:"mr-1 flex h-8 w-8 items-center justify-center rounded-lg text-white/25 hover:bg-white/10 hover:text-white","aria-label":`${M.includes(t.value)?"Unfavorite":"Favorite"} ${t.name}`,children:r.jsx(v,{className:u("h-3.5 w-3.5",M.includes(t.value)&&"fill-current text-amber-300")})})]},t.value))]},t)),!Y.length&&r.jsx("div",{className:"p-4 text-center text-xs text-white/40",children:"No fonts found"})]}),r.jsxs("div",{className:"mt-2 border-t border-white/10 p-2",children:[r.jsx("div",{className:"mb-1 text-[9px] font-bold uppercase tracking-widest text-white/30",children:"Weight"}
2),r.jsx("div",{className:"grid grid-cols-5 gap-1",children:["400","500","600","700","800"].map(e=>r.jsx("button",{type:"button",onClick:()=>L("fontWeight",e),className:u("rounded-lg py-1.5 text-[10px] text-white/45 hover:bg-white/10 hover:text-white",m.fontWeight===e&&"bg-white/15 text-white"),children:e},e))})]})]})]}),r.jsx("div",{className:"w-px h-4 bg-white/20 flex-shrink-0"}),r.jsx("div",{className:"flex bg-white/5 rounded-full p-0.5 flex-shrink-0",children:[{icon:b,v:"left"},{icon:y,v:"center"},{icon:j,v:"right"}].map(({icon:e,v:t})=>r.jsx("button",{className:u("rounded-lg p-2 text-white/55 transition-colors hover:bg-white/10",m.textAlign===t&&"text-white bg-white/20"),onClick:()=>L("textAlign",t),title:`Align ${t}`,children:r.jsx(e,{className:"h-4 w-4"})},t))}),r.jsxs("div",{className:"flex items-center gap-0.5 flex-shrink-0",children:[r.jsx("button",{className:u("rounded-lg p-2 text-white/55 transition-colors hover:bg-white/10",H&&"text-white bg-white/20"),onClick:()=>L("fontWeight",H?"400":"700"),title:"Bold (Cmd+B)",children:r.jsx(k,{className:"h-4 w-4"})}),r.jsx("button",{className:u("rounded-lg p-2 text-white/55 transition-colors hover:bg-white/10","italic"===m.fontStyle&&"text-white bg-white/20"),onClick:()=>L("fontStyle","italic"===m.fontStyle?"normal":"italic"),title:"Italic",children:r.jsx(S,{className:"h-4 w-4"})}),r.jsx("button",{className:u("rounded-lg p-2 text-white/55 transition-colors hover:bg-white/10","underline"===m.textDecoration&&"text-white bg-white/20"),onClick:()=>L("textDecoration","underline"===m.textDecoration?"none":"underline"),title:"Underline",children:r.jsx(Ge,{className:"h-4 w-4"})}),r.jsx("button",{className:u("rounded-lg p-2 text-white/55 transition-colors hover:bg-white/10","uppercase"===m.textTransform&&"text-white bg-white/20"),onClick:()=>L("textTransform","uppercase"===m.textTransform?"none":"uppercase"),title:"Uppercase",children:r.jsx(Oe,{className:"h-4 w-4"})})]}),i&&r.jsxs(r.Fragment,{children:[r.jsx("div",{className:"w-px h-4 bg-white/20 flex-shrink-0"}),r.jsx("div",{className:"flex items-center gap-1 flex-shrink-0",children:[{key:"heading",label:"H",style:{fontSize:64,fontWeight:"800",letterSpacing:-1,lineHeight:1.05}},{key:"subheading",label:"S",style:{fontSize:42,fontWeight:"700",letterSpacing:-.2,lineHeight:1.15}},{key:"caption",label:"C",style:{fontSize:22,fontWeight:"600",letterSpacing:.2,lineHeight:1.25}}].map(t=>r.jsx("button",{onClick:()=>n(e.id,{style:{...m,...t.style}},!0),className:"h-8 min-w-8 rounded-lg border border-white/20 px-1.5 text-xs font-bold text-white/70 hover:bg-white/10 hover:text-white",title:t.key,children:t.label},t.key))}),r.jsx("div",{className:"w-px h-4 bg-white/20 flex-shrink-0"}),r.jsxs(x,{children:[r.jsx(p,{asChild:!0,children:r.jsx(l,{variant:"ghost",size:"icon",className:"h-9 w-9 flex-shrink-0 rounded-xl text-white hover:bg-white/10",title:"Effects",children:r.jsx(E,{className:"h-4 w-4"})})}),r.jsx(f,{className:"w-52 p-4 bg-black/90 border-white/10 rounded-2xl",children:r.jsxs("div",{className:"space-y-4",children:[r.jsxs("div",{className:"space-y-2",children:[r.jsx("label",{className:"text-xs text-white/50 font-medium uppercase tracking-wider",children:"Readability"}),r.jsx("div",{className:"grid grid-cols-2 gap-1",children:[{label:"None",backgroundColor:"transparent",padding:0,borderRadius:0,boxShadow:"none"},{label:"Backdrop",backgroundColor:"rgba(0,0,0,0.48)",padding:18,borderRadius:12,boxShadow:"none"},{label:"Light",backgroundColor:"rgba(255,255,255,0.9)",padding:18,borderRadius:12,boxShadow:"none",color:"#111111"},{label:"Highlight",backgroundColor:"rgba(250,204,21,0.78)",padding:8,borderRadius:3,boxShadow:"none",color:"#111111"}].map(t=>r.jsx("button",{type:"button",onClick:()=>n(e.id,{style:{...m,...t}},!0),className:"rounded-lg border border-white/10 px-2 py-1.5 text-[9px] font-bold uppercase tracking-wide text-white/55 hover:bg-white/10 hover:text-white",children:t.label},t.label))})]}),r.jsxs("div",{className:"space-y-2",children:[r.jsx("label",{className:"text-xs text-white/50 font-medium uppercase tracking-wider",children:"Shadow"}),r.jsx("div",{className:"grid grid-cols-4 gap-1",children:Object.keys(tt).map(e=>r.jsx("button",{onClick:()=>L("textShadow",tt[e]),className:u("py-1.5 text-[9px] font-bold uppercase tracking-wider rounded-lg border transition-all",F===e?"bg-primary/20 border-primary/50 text-primary":"border-white/10 text-white/40 hover:bg-white/10 hover:text-white/70"),children:e},e))})]}),r.jsxs("div",{className:"space-y-2",children:[r.jsxs("label",{className:"text-xs text-white/50 font-medium",children:["Opacity: ",Math.round(100*(e.opacity??1)),"%"]}),r.jsx(d,{value:[Math.round(100*(e.opacity??1))],min:10,max:100,step:5,onValueChange:([t])=>n(e.id,{opacity:t/100},!0)})]})]})})]})]}),r.jsxs(x,{children:[r.jsx(p,{asChild:!0,children:r.jsx(l,{variant:"ghost",size:"icon",className:"h-9 w-9 flex-shrink-0 rounded-xl text-white hover:bg-white/10",title:"More text actions",children:r.jsx(R,{className:"h-4 w-4"})})}),r.jsxs(f,{className:"w-48 rounded-xl border-white/10 bg-black/95 p-1.5 text-white",children:[r.jsxs("button",{type:"button",onClick:()=>n(e.id,{textBoxMode:"fixed"===e.textBoxMode?"auto":"fixed"},!0),className:"flex w-full items-center rounded-lg px-3 py-2 text-left text-xs text-white/75 hover:bg-white/10 hover:text-white",children:[r.jsx(w,{className:"mr-2 h-3.5 w-3.5"}),"fixed"===e.textBoxMode?"Auto-width text":"Fixed-width text"]}),r.jsxs("button",{type:"button",onClick:()=>null==o?void 0:o(e.id),className:"flex w-full items-center rounded-lg px-3 py-2 text-left text-xs text-white/75 hover:bg-white/10 hover:text-white",children:[r.jsx(z,{className:"mr-2 h-3.5 w-3.5"})," Duplicate"]}),r.jsxs("button",{type:"button",onClick:()=>n(e.id,{locked:!e.locked},!0),className:"flex w-full items-center rounded-lg px-3 py-2 text-left text-xs text-white/75 hover:bg-white/10 hover:text-white",children:[e.locked?r.jsx(Je,{className:"mr-2 h-3.5 w-3.5"}):r.jsx(T,{className:"mr-2 h-3.5 w-3.5"}),e.locked?"Unlock":"Lock"]}),r.jsxs("button",{type:"button",onClick:()=>n(e.id,{z:(e.z||0)+1},!0),className:"flex w-full items-center rounded-lg px-3 py-2 text-left text-xs text-white/75 hover:bg-white/10 hover:text-white",children:[r.jsx(A,{className:"mr-2 h-3.5 w-3.5"})," Bring forward"]}),r.jsxs("button",{type:"button",onClick:()=>n(e.id,{z:Math.max(0,(e.z||0)-1)},!0),className:"flex w-full items-center rounded-lg px-3 py-2 text-left text-xs text-white/75 hover:bg-white/10 hover:text-white",children:[r.jsx(P,{className:"mr-2 h-3.5 w-3.5"})," Send backward"]}),r.jsxs("button",{type:"button",onClick:()=>null==s?void 0:s(e.id),className:"flex w-full items-center rounded-lg px-3 py-2 text-left text-xs text-red-400 hover:bg-red-500/10",children:[r.jsx(D,{className:"mr-2 h-3.5 w-3.5"})," Delete"]})]})]})]})},nt=(e,t)=>
2{let r=null,n=null,a=!0;const i=t=>{n=t,null===r&&(r=window.requestAnimationFrame(()=>{r=null;const t=n;n=null,t&&e(t)}))},o=()=>{a&&(a=!1,null!==r&&window.cancelAnimationFrame(r),r=null,n=null,window.removeEventListener("pointermove",i),window.removeEventListener("pointerup",s),window.removeEventListener("pointercancel",s))},s=()=>{a&&((()=>{null!==r&&(window.cancelAnimationFrame(r),r=null);const t=n;n=null,t&&e(t)})(),o(),t())};return window.addEventListener("pointermove",i,{passive:!0}),window.addEventListener("pointerup",s,{passive:!0}),window.addEventListener("pointercancel",s,{passive:!0}),o},at=(e,t)=>{const r=e.style.height,n=e.style.width;e.style.height="auto","auto"===t&&(e.style.width="max-content");const a=e.getBoundingClientRect(),i=Math.ceil(Math.max(e.scrollWidth,a.width))+2,o=Math.ceil(Math.max(e.scrollHeight,a.height))+2;return e.style.height=r,e.style.width=n,{width:i,height:o}},it=t.memo(({element:e,isSelected:a,onSelect:i,onChange:o,scale:s,isBackgroundRemoving:l=!1,onCropRequest:c,textV2Enabled:d=!0,isTextEditing:h=!1,onTextEditingChange:m=()=>{},onDuplicate:x,onRemove:p})=>{var f;const[w,g]=t.useState(!1),[v,b]=t.useState(!1),[y,j]=t.useState(null),N=t.useRef(null),k=t.useRef(null),S=t.useRef(null);t.useEffect(()=>()=>{var e;null==(e=N.current)||e.call(N),N.current=null},[]),t.useEffect(()=>{if(!a||"text"!==e.type)return void j(null);let t=0;const r=()=>{var e;const n=k.current;if(!n)return;const a=n.getBoundingClientRect(),i=null==(e=S.current)?void 0:e.getBoundingClientRect(),o=(null==i?void 0:i.width)||Math.min(736,window.innerWidth-32),s=(null==i?void 0:i.height)||56,l=a.top<s+12+12,c=a.left+a.width/2,d=Math.min(window.innerWidth-o/2-16,Math.max(o/2+16,c)),h=l?a.bottom+12:a.top-12,u={left:Math.round(d),top:Math.round(l?Math.min(window.innerHeight-s-16,Math.max(16,h)):Math.max(s+16,Math.min(window.innerHeight-16,h))),below:l};j(e=>e&&e.left===u.left&&e.top===u.top&&e.below===u.below?e:u),t=window.requestAnimationFrame(r)};return r(),()=>window.cancelAnimationFrame(t)},[e.type,a,h]);const C=e.contentScale||1,M=e.contentX||0,_=e.contentY||0,E=e.contentRotation||0,R=e.contentFlipX?-1:1,z=e.contentFlipY?-1:1,T=e.contentCropX??0,A=e.contentCropY??0,P=e.contentCropW&&e.contentCropW>0?e.contentCropW:1,D=e.contentCropH&&e.contentCropH>0?e.contentCropH:1,H=0!==T||0!==A||1!==P||1!==D,I=(null==(f=e.memory)?void 0:f.image_url)?F(e.memory.image_url,"large")||e.memory.image_url:null,O=B(e.x),q=B(e.y);t.useEffect(()=>{O.set(e.x),q.set(e.y)},[e.x,e.y,O,q]);const K=t.useRef(null);t.useEffect(()=>{if(h&&K.current){K.current.innerText=e.content||"Type something",K.current.focus();const t=document.createRange();t.selectNodeContents(K.current);const r=window.getSelection();null==r||r.removeAllRanges(),null==r||r.addRange(t)}
2},[h]);const V=(t,r)=>{var n;t.stopPropagation(),t.preventDefault(),null==(n=N.current)||n.call(N),g(!0),t.target.setPointerCapture(t.pointerId);const a=t.clientX,i=t.clientY,l=e.w,c=e.h,d=O.get(),h=q.get();let u=l,m=c,x=d,p=h;N.current=nt(t=>{const n=(t.clientX-a)/s,f=(t.clientY-i)/s;if(u=l,m=c,x=d,p=h,r.includes("e")&&(u=Math.max(50,l+n)),r.includes("s")&&(m=Math.max(50,c+f)),r.includes("w")){const e=Math.min(n,l-50);u=l-e,x=d+e}if(r.includes("n")){const e=Math.min(f,c-50);m=c-e,p=h+e}if(t.shiftKey||e.aspectLocked){const e=l/c;r.includes("e")||r.includes("w")?(m=u/e,r.includes("n")||r.includes("s")?r.includes("n")&&(p=h+(c-m)):p=h+(c-m)/2):(u=m*e,r.includes("e")||r.includes("w")?r.includes("w")&&(x=d+(l-u)):x=d+(l-u)/2)}O.set(x),q.set(p),o(e.id,{w:u,h:m,x:x,y:p,..."text"===e.type&&(r.includes("e")||r.includes("w"))?{textBoxMode:"fixed"}:{}},!1)},()=>{N.current=null,g(!1),o(e.id,{w:u,h:m,x:x,y:p,..."text"===e.type&&(r.includes("e")||r.includes("w"))?{textBoxMode:"fixed"}:{}},!0)})};return r.jsxs(r.Fragment,{children:[r.jsxs(Y.div,{ref:k,"data-canvas-element-id":e.id,initial:!1,style:{width:e.w,height:e.h,position:"absolute",left:0,top:0,zIndex:e.z,rotate:e.rotation,opacity:void 0!==e.opacity?e.opacity:1,scaleX:e.flipX?-1:1,scaleY:e.flipY?-1:1,x:O,y:q},onPointerDown:t=>{var r;if(h)return void t.stopPropagation();if(e.locked||w||v)return;if(!t.isPrimary)return;t.preventDefault(),t.stopPropagation(),null==(r=N.current)||r.call(N),i({metaKey:t.metaKey,ctrlKey:t.ctrlKey,shiftKey:t.shiftKey});const n=t.clientX,a=t.clientY,l=O.get(),c=q.get();N.current=nt(e=>{const t=(e.clientX-n)/s,r=(e.clientY-a)/s;O.set(l+t),q.set(c+r)},()=>{N.current=null,o(e.id,{x:O.get(),y:q.get()},!0)})},onDoubleClick:t=>{var r;t.stopPropagation(),e.locked||("text"===e.type?m(!0):(null==(r=e.memory)?void 0:r.image_url)&&(null==c||c(e.id)))},onClick:e=>e.stopPropagation(),className:u("group absolute overflow-visible transition-shadow duration-200",h?"cursor-text touch-auto select-text":"touch-none select-none",!h&&!w&&!v&&"curs
2or-move",!a&&"hover:shadow-lg"),children:["text"===e.type&&!h&&r.jsx("div",{"aria-hidden":"true","data-canvas-text-hit-target":"true",className:"pointer-events-auto absolute left-1/2 top-1/2 z-0 -translate-x-1/2 -translate-y-1/2",style:{minWidth:Math.max(e.w,44/Math.max(s,.01)),minHeight:Math.max(e.h,44/Math.max(s,.01))}}),r.jsxs("div",{className:u("relative z-[1] w-full h-full overflow-hidden transition-all","text"===e.type&&"overflow-visible",a?"ring-2 ring-primary shadow-2xl ring-offset-2 ring-offset-transparent":"hover:ring-2 hover:ring-primary/30"),children:[r.jsx("div",{className:"relative w-full h-full overflow-hidden",children:(()=>{var t,n,i,s,l,c,d,x,p,f,g,b,y,j,N,k,S,F,B,Y;const X={transform:`scale(${C}) translate(${M}px, ${_}px) rotate(${E}deg) scaleX(${R}) scaleY(${z})`,transition:"transform 0.2s",...e.style};return"text"===e.type?r.jsx("div",{ref:K,role:"textbox","aria-label":"Canvas text","aria-multiline":"true",contentEditable:h,suppressContentEditableWarning:!0,onBlur:t=>{var r,n,a,i;const s=t.currentTarget.innerText,l=e.textBoxMode||"auto",c=at(t.currentTarget,l),d=(null==(r=e.style)?void 0:r.fontSize)||24,h=(null==(n=e.style)?void 0:n.padding)||0,u=Math.ceil(d*((null==(a=e.style)?void 0:a.lineHeight)||1.15)+2*h),x={content:s,h:Math.max(48,u,c.height)};if("fixed"===l&&"italic"===(null==(i=e.style)?void 0:i.fontStyle)&&!s.includes("\n")&&s.trim().length>0&&s.trim().length<=40){const r=at(t.currentTarget,"auto"),n=Math.max(80,Math.min(e.w,r.width));x.w=n,x.x=e.x+(e.w-n)/2,x.textBoxMode="auto"}m(!1),o(e.id,x,!0)},onKeyDown:e=>{e.stopPropagation(),("Escape"===e.key||"Enter"===e.key&&(e.metaKey||e.ctrlKey))&&(e.preventDefault(),e.currentTarget.blur())},onInput:t=>{const r=e.textBoxMode||"auto",n=at(t.currentTarget,r),a={content:t.currentTarget.innerText};"auto"===r&&(a.w=Math.max(80,Math.min(1600,n.width))),a.h=Math.max(48,n.height),o(e.id,a,!1)},className:u("h-full w-full outline-none selection:bg-primary/35 selection:text-white",h?"cursor-text select-text touch-auto caret-current":"my-auto cursor-default select-none"),style:{fontSize:(null==(t=e.style)?void 0:t.fontSize)||24,color:(null==(n=e.style)?void 0:n.color)||"#ffffff",textAlign:(null==(i=e.style)?void 0:i.textAlign)||"center",fontFamily:(null==(s=e.style)?void 0:s.fontFamily)||"Manrope, sans-serif",fontWeight:(null==(l=e.style)?void 0:l.fontWeight)||"bold",fontStyle:(null==(c=e.style)?void 0:c.fontStyle)||"normal",lineHeight:(null==(d=e.style)?void 0:d.lineHeight)||1.15,letterSpacing:(null==(x=e.style)?void 0:x.letterSpacing)||0,textDecoration:(null==(p=e.style)?void 0:p.textDecoration)||"none",textShadow:(null==(f=e.style)?void 0:f.textShadow)||"none",textTransform:(null==(g=e.style)?void 0:g.textTransform)||"none",opacity:(null==(b=e.style)?void 0:b.opacity)??1,backgroundColor:(null==(y=e.style)?void 0:y.backgroundColor)||"transparent",padding:(null==(j=e.style)?void 0:j.padding)||0,borderRadius:(null==(N=e.style)?void 0:N.borderRadius)||0,backdropFilter:(null==(k=e.style)?void 0:k.backdropBlur)?`blur(${e.style.backdropBlur}px)`:void 0,boxShadow:null==(S=e.style)?void 0:S.boxShadow,whiteSpace:"fixed"===e.textBoxMode?"pre-wrap":"pre",overflowWrap:"fixed"===e.textBoxMode?"anywhere":"normal",overflow:h?"visible":"hidden",display:"block"},children:h?null:e.content}):"placeholder"===e.type?r.jsxs("div",{className:"w-full h-full bg-muted/40 flex flex-col items-center justify-center text-muted-foreground/50 border-2 border-dashed border-white/20 select-none",children:[r.jsx("div",{className:"w-16 h-16 rounded-full bg-white/5 flex items-center justify-center mb-2 active:scale-95 transition-transform",children:r.jsx($,{className:"w-8 h-8 opacity-50"})}),r.jsx("span",{className:"text-xs font-medium uppercase tracking-widest opacity-50",children:"Drag Media Here"})]}):I?H?r.jsx("img",{src:I,className:"absolute max-w-none pointer-events-none",style:{left:-T/P*100+"%",top:-A/D*100+"%",width:1/P*100+"%",height:"auto",transform:`rotate(${E}deg) scaleX(${R}) scaleY(${z})`,transformOrigin:"center center",transition:"transform 0.2s"},alt:""}):r.jsx("img",{src:I,className:"absolute inset-0 h-full w-full object-cover pointer-events-none",style:X,alt:""}):"video"===(null==(F=e.memory)?void 0:F.type)&&(null==(B=e.memory)?void 0:B.video_url)?a?r.jsx("video",{src:e.memory.video_url,className:"w-full h-full object-cover",style:X,playsInl
2ine:!0,controls:a&&!w&&!v,muted:!0,preload:"metadata"}):r.jsx(L,{posterSrc:I,posterFallbackSrc:e.memory.image_url,videoSrc:e.memory.video_url,className:"h-full w-full",mediaClassName:"h-full w-full object-cover",mediaStyle:X,showBadge:!1,allowVideoFrame:!0}):r.jsx("div",{className:"w-full h-full bg-background/50 p-4 flex items-center justify-center text-center overflow-hidden border border-border backdrop-blur-sm",children:r.jsx("p",{className:"text-[10px] sm:text-xs select-none",children:null==(Y=e.memory)?void 0:Y.content})})})()}),l&&r.jsx("div",{className:"absolute inset-0 bg-black/40 backdrop-blur-[1px] z-[65] flex items-center justify-center",children:r.jsxs("div",{className:"px-3 py-1.5 rounded-full bg-black/75 text-white text-xs font-semibold flex items-center gap-2",children:[r.jsx(X,{className:"w-3.5 h-3.5 animate-spin"}),"Removing background..."]})}),a&&!h&&r.jsx(r.Fragment,{children:r.jsx("div",{"data-html2canvas-ignore":"true",className:"absolute -top-8 md:-top-6 left-1/2 w-11 h-11 md:w-6 md:h-6 -translate-x-1/2 bg-white text-primary rounded-full shadow-md flex items-center justify-center cursor-alias z-50 border border-primary/20 hover:scale-110 transition-transform",onPointerDown:t=>{t.stopPropagation(),(t=>{var r,n;t.stopPropagation(),t.preventDefault(),null==(r=N.current)||r.call(N),b(!0);const a=null==(n=t.target.parentElement)?void 0:n.getBoundingClientRect();if(!a)return void b(!1);const i=a.left+a.width/2,s=a.top+a.height/2;N.current=nt(t=>{let r=Math.atan2(t.clientY-s,t.clientX-i)*(180/Math.PI);t.shiftKey&&(r=45*Math.round(r/45)),o(e.id,{rotation:r+90},!1)},()=>{N.current=null,b(!1),o(e.id,{},!0)})})(t)},children:r.jsx(W,{className:"w-4 h-4 md:w-3 md:h-3"})})})]}),a&&!h&&r.jsxs(r.Fragment,{children:[r.jsx("div",{"data-html2canvas-ignore":"true",className:"absolute top-0 left-0 w-8 h-8 md:w-5 md:h-5 bg-white border-2 border-primary rounded-full -translate-x-1/2 -translate-y-1/2 cursor-nw-resize z-[100] hover:scale-125 transition-transform shadow-lg",onPointerDown:e=>{e.stopPropagation(),V(e,"nw")}}),r.jsx("div",{"data-html2canvas-ignore":"true",className:"absolute top-0 right-0 w-8 h-8 md:w-5 md:h-5 bg-white border-2 border-primary rounded-full translate-x-1/2 -translate-y-1/2 cursor-ne-resize z-[100] hover:scale-125 transition-transform shadow-lg",onPointerDown:e=>{e.stopPropagation(),V(e,"ne")}}),r.jsx("div",{"data-html2canvas-ignore":"true",className:"absolute bottom-0 left-0 w-8 h-8 md:w-5 md:h-5 bg-white border-2 border-primary rounded-full -translate-x-1/2 translate-y-1/2 cursor-sw-resize z-[100] hover:scale-125 transition-transform shadow-lg",onPointerDown:e=>{e.stopPropagation(),V(e,"sw")}}),r.jsx("div",{"data-html2canvas-ignore":"true",className:"absolute bottom-0 right-0 w-8 h-8 md:w-5 md:h-5 bg-white border-2 border-primary rounded-full translate-x-1/2 translate-y-1/2 cursor-se-resize z-[100] hover:scale-125 transition-transform shadow-lg",onPointerDown:e=>{e.stopPropagation(),V(e,"se")}}),r.jsx("div",{"data-html2canvas-ignore":"true",className:"absolute top-0 left-1/2 w-10 h-6 md:w-8 md:h-3 bg-white border border-primary/50 rounded-full -translate-x-1/2 -translate-y-1/2 cursor-n-resize z-[100] hover:scale-110 hover:bg-primary/10 transition-all shadow-md",onPointerDown:e=>{e.stopPropagation(),V(e,"n")}}),r.jsx("div",{"data-html2canvas-ignore":"true",className:"absolute bottom-0 left-1/2 w-10 h-6 md:w-8 md:h-3 bg-white border border-primary/50 rounded-full -translate-x-1/2 translate-y-1/2 cursor-s-resize z-[100] hover:scale-110 hover:bg-primary/10 transition-all shadow-md",onPointerDown:e=>{e.stopPropagation(),V(e,"s")}}),r.jsx("div",{"data-html2canvas-ignore":"true",className:"absolute left-0 top-1/2 w-6 h-10 md:w-3 md:h-8 bg-white border border-primary/50 rounded-full -translate-x-1/2 -translate-y-1/2 cursor-w-resize z-[100] hover:scale-110 hover:bg-primary/10 transition-all shadow-md",onPointerDown:e=>{e.stopPropagation(),V(e,"w")}}),r.jsx("div",{"data-html2canvas-ignore":"true",className:"absolute right-0 top-1/2 w-6 h-10 md:w-3 md:h-8 bg-white border border-primary/50 rounded-full translate-x-1/2 -translate-y-1/2 cursor-e-resize z-[100] hover:scale-110 hover:bg-primary/10 transition-all shadow-md",onPointerDown:e=>{e.stopPropagation(),V(e,"e")}})]})]}),y&&"undefined"!=typeof document&&n.createPortal(r.jsx("div",{ref:S,"data-html2canvas-ignore":"true","data-canvas-text-toolbar":"true",className:"fixed z-[2147483600] w-max",style:{left:y.left,top:y.top,transform:y.below?"translate(-50%, 0)":"translate(-50%, -100%)"},onPointerDown:e=>e.stopPropagation(),onClick:e=>e.stopPropagation(),onDoubleClick:e=>
2e.stopPropagation(),children:r.jsx(rt,{element:e,onChange:o,isEditing:h,advancedEnabled:d,onDuplicate:x,onRemove:p})}),document.body)]})},(e,t)=>e.element===t.element&&e.isSelected===t.isSelected&&e.scale===t.scale&&e.isBackgroundRemoving===t.isBackgroundRemoving&&e.textV2Enabled===t.textV2Enabled&&e.isTextEditing===t.isTextEditing);var ot="ScrollArea",[st]=q(ot),[lt,ct]=st(ot),dt=t.forwardRef((e,n)=>{const{__scopeScrollArea:a,type:i="hover",dir:o,scrollHideDelay:s=600,...l}=e,[c,d]=t.useState(null),[h,u]=t.useState(null),[m,x]=t.useState(null),[p,f]=t.useState(null),[w,g]=t.useState(null),[v,b]=t.useState(0),[y,j]=t.useState(0),[N,k]=t.useState(!1),[S,C]=t.useState(!1),M=Q(n,e=>d(e)),_=G(o);return r.jsx(lt,{scope:a,type:i,dir:_,scrollHideDelay:s,scrollArea:c,viewport:h,onViewportChange:u,content:m,onContentChange:x,scrollbarX:p,onScrollbarXChange:f,scrollbarXEnabled:N,onScrollbarXEnabledChange:k,scrollbarY:w,onScrollbarYChange:g,scrollbarYEnabled:S,onScrollbarYEnabledChange:C,onCornerWidthChange:b,onCornerHeightChange:j,children:r.jsx(O.div,{dir:_,...l,ref:M,style:{position:"relative","--radix-scroll-area-corner-width":v+"px","--radix-scroll-area-corner-height":y+"px",...e.style}})})});dt.displayName=ot;var ht="ScrollAreaViewport",ut=t.forwardRef((e,n)=>{const{__scopeScrollArea:a,children:i,nonce:o,...s}=e,l=ct(ht,a),c=t.useRef(null),d=Q(n,c,l.onViewportChange);return r.jsxs(r.Fragment,{children:[r.jsx(mt,{nonce:o}),r.jsx(O.div,{"data-radix-scroll-area-viewport":"",...s,ref:d,style:{overflowX:l.scrollbarXEnabled?"scroll":"hidden",overflowY:l.scrollbarYEnabled?"scroll":"hidden",...e.style},children:r.jsx("div",{ref:l.onContentChange,style:{minWidth:"100%",display:"table"},children:i})})]})});ut.displayName=ht;var mt=t.memo(({nonce:e})=>r.jsx("style",{dangerouslySetInnerHTML:{__html:"[data-radix-scroll-area-viewport]{scrollbar-width:none;-ms-overflow-style:none;-webkit-overflow-scrolling:touch;}[data-radix-scroll-area-viewport]::-webkit-scrollbar{display:none}"},nonce:e}),(e,t)=>e.nonce===t.nonce),xt="ScrollAreaScrollbar",pt=t.forwardRef((e,n)=>{const{forceMount:a,...i}=e,o=ct(xt,e.__scopeScrollArea),{onScrollbarXEnabledChange:s,onScrollbarYEnabledChange:l}=o,c="horizontal"===e.orientation;return t.useEffect(()=>(c?s(!0):l(!0),()=>{c?s(!1):l(!1)}),[c,s,l]),"hover"===o.type?r.jsx(ft,{...i,ref:n,forceMount:a}):"scroll"===o.type?r.jsx(wt,{...i,ref:n,forceMount:a}):"auto"===o.type?r.jsx(gt,{...i,ref:n,forceMount:a}):"always"===o.type?r.jsx(vt,{...i,ref:n,"data-state":"visible"}):null});pt.displayName=xt;var ft=t.forwardRef((e,n)=>{const{forceMount:a,...i}=e,o=ct(xt,e.__scopeScrollArea),[s,l]=t.useState(!1);return t.useEffect(()=>{const e=o.scrollArea;let t=0;if(e){const r=()=>{window.clearTimeout(t),l(!0)},n=()=>{t=window.setTimeout(()=>l(!1),o.scrollHideDelay)};return e.addEventListener("pointerenter",r),e.addEventListener("pointerleave",n),()=>{window.clearTimeout(t),e.removeEventListener("pointerenter",r),e.removeEventListener("pointerleave",n)}}},[o.scrollArea,o.scrollHideDelay]),r.jsx(U,{present:a||s,children:r.jsx(gt,{"data-state":s?"visible":"hidden",...i,ref:n})})}),wt=t.forwardRef((e,n)=>{const{forceMount:a,...i}=e,o=ct(xt,e.__scopeScrollArea),s="horizontal"===e.orientation,l=Bt(()=>d("SCROLL_END"),100),[c,d]=(h={hidden:{SCROLL:"scrolling"},scrolling:{SCROLL_END:"idle",POINTER_ENTER:"interacting"},interacting:{SCROLL:"interacting",POINTER_LEAVE:"idle"},idle:{HIDE:"hidden",SCROLL:"scrolling",POINTER_ENTER:"interacting"}},t.useReducer((e,t)=>h[e][t]??e,"hidden"));var h;return t.useEffect(()=>{if("idle"===c){const e=window.setTimeout(()=>d("HIDE"),o.scrollHideDelay);return()=>window.clearTimeout(e)}},[c,o.scrollHideDelay,d]),t.useEffect(()=>{const e=o.viewport,t=s?"scrollLeft":"scrollTop";if(e){let r=e[t];const n=()=>{const n=e[t];r!==n&&(d("SCROLL"),l()),r=n};return e.addEventListener("scroll",n),()=>e.removeEventListener("scroll",n)}},[o.viewport,s,d,l]),r.jsx(U,{present:a||"hidden"!==c,children:r.jsx(vt,{"data-state":"hidden"===c?"hidden":"visible",...i,ref:n,onPointerEnter:J(e.onPointerEnter,()=>d("POINTER_ENTER")),onPointerLeave:J(e.onPointerLeave,()=>d("POINTER_LEAVE"))})})}
2),gt=t.forwardRef((e,n)=>{const a=ct(xt,e.__scopeScrollArea),{forceMount:i,...o}=e,[s,l]=t.useState(!1),c="horizontal"===e.orientation,d=Bt(()=>{if(a.viewport){const e=a.viewport.offsetWidth<a.viewport.scrollWidth,t=a.viewport.offsetHeight<a.viewport.scrollHeight;l(c?e:t)}},10);return Yt(a.viewport,d),Yt(a.content,d),r.jsx(U,{present:i||s,children:r.jsx(vt,{"data-state":s?"visible":"hidden",...o,ref:n})})}),vt=t.forwardRef((e,n)=>{const{orientation:a="vertical",...i}=e,o=ct(xt,e.__scopeScrollArea),s=t.useRef(null),l=t.useRef(0),[c,d]=t.useState({content:0,viewport:0,scrollbar:{size:0,paddingStart:0,paddingEnd:0}}),h=Tt(c.viewport,c.content),u={...i,sizes:c,onSizesChange:d,hasThumb:Boolean(h>0&&h<1),onThumbChange:e=>s.current=e,onThumbPointerUp:()=>l.current=0,onThumbPointerDown:e=>l.current=e};function m(e,t){return function(e,t,r,n="ltr"){const a=At(r),i=t||a/2,o=a-i,s=r.scrollbar.paddingStart+i,l=r.scrollbar.size-r.scrollbar.paddingEnd-o,c=r.content-r.viewport;return Dt([s,l],"ltr"===n?[0,c]:[-1*c,0])(e)}(e,l.current,c,t)}return"horizontal"===a?r.jsx(bt,{...u,ref:n,onThumbPositionChange:()=>{if(o.viewport&&s.current){const e=Pt(o.viewport.scrollLeft,c,o.dir);s.current.style.transform=`translate3d(${e}px, 0, 0)`}},onWheelScroll:e=>{o.viewport&&(o.viewport.scrollLeft=e)},onDragScroll:e=>{o.viewport&&(o.viewport.scrollLeft=m(e,o.dir))}}):"vertical"===a?r.jsx(yt,{...u,ref:n,onThumbPositionChange:()=>{if(o.viewport&&s.current){const e=Pt(o.viewport.scrollTop,c);s.current.style.transform=`translate3d(0, ${e}px, 0)`}},onWheelScroll:e=>{o.viewport&&(o.viewport.scrollTop=e)},onDragScroll:e=>{o.viewport&&(o.viewport.scrollTop=m(e))}}):null}),bt=t.forwardRef((e,n)=>{const{sizes:a,onSizesChange:i,...o}=e,s=ct(xt,e.__scopeScrollArea),[l,c]=t.useState(),d=t.useRef(null),h=Q(n,d,s.onScrollbarXChange);return t.useEffect(()=>{d.current&&c(getComputedStyle(d.current))},[d]),r.jsx(kt,{"data-orientation":"horizontal",...o,ref:h,sizes:a,style:{bottom:0,left:"rtl"===s.dir?"var(--radix-scroll-area-corner-width)":0,right:"ltr"===s.dir?"var(--radix-scroll-area-corner-width)":0,"--radix-scroll-area-thumb-width":At(a)+"px",...e.style},onThumbPointerDown:t=>e.onThumbPointerDown(t.x),onDragScroll:t=>e.onDragScroll(t.x),onWheelScroll:(t,r)=>{if(s.viewport){const n=s.viewport.scrollLeft+t.deltaX;e.onWheelScroll(n),Lt(n,r)&&t.preventDefault()}},onResize:()=>{d.current&&s.viewport&&l&&i({content:s.viewport.scrollWidth,viewport:s.viewport.offsetWidth,scrollbar:{size:d.current.clientWidth,paddingStart:zt(l.paddingLeft),paddingEnd:zt(l.paddingRight)}})}})}),yt=t.forwardRef((e,n)=>{const{sizes:a,onSizesChange:i,...o}=e,s=ct(xt,e.__scopeScrollArea),[l,c]=t.useState(),d=t.useRef(null),h=Q(n,d,s.onScrollbarYChange);return t.useEffect(()=>{d.current&&c(getComputedStyle(d.current))},[d]),r.jsx(kt,{"data-orientation":"vertical",...o,ref:h,sizes:a,style:{top:0,right:"ltr"===s.dir?0:void 0,left:"rtl"===s.dir?0:void 0,bottom:"var(--radix-scroll-area-corner-height)","--radix-scroll-area-thumb-height":At(a)+"px",...e.style},onThumbPointerDown:t=>e.onThumbPointerDown(t.y),onDragScroll:t=>e.onDragScroll(t.y),onWheelScroll:(t,r)=>{if(s.viewport){const n=s.viewport.scrollTop+t.deltaY;e.onWheelScroll(n),Lt(n,r)&&t.preventDefault()}},onResize:()=>{d.current&&s.viewport&&l&&i({content:s.viewport.scrollHeight,viewport:s.viewport.offsetHeight,scrollbar:{size:d.current.clientHeight,paddingStart:zt(l.paddingTop),paddingEnd:zt(l.paddingBottom)}})}})}),[jt,Nt]=st(xt),kt=t.forwardRef((e,n)=>{const{__scopeScrollArea:a,sizes:i,hasThumb:o,onThumbChange:s,onThumbPointerUp:l,onThumbPointerDown:c,onThumbPositionChange:d,onDragScroll:h,onWheelScroll:u,onResize:m,...x}=e,p=ct(xt,a),[f,w]=t.useState(null),g=Q(n,e=>w(e)),v=t.useRef(null),b=t.useRef(""),y=p.viewport,j=i.content-i.viewport,N=K(u),k=K(d),S=Bt(m,10);function C(e){if(v.current){const t=e.clientX-v.current.left,r=e.clientY-v.current.top;h({x:t,y:r})}}return t.useEffect(()=>{const e=e=>{const t=e.target;(null==f?void 0:f.contains(t))&&N(e,j)};return document.addEventListener("wheel",e,{passive:!1}),()=>document.removeEventListener("wheel",e,{passive:!1})},[y,f,j,N]),t.useEffect(k,[i,k]),Yt(f,S),Yt(p.content,S),r.jsx(jt,{scope:a,scrollbar:f,hasThumb:o,onThumbChange:K(s),onThumbPointerUp:K(l),onThumbPositionChange:k,onThumbPointerDown:K(c),children:r.jsx(O.div,{...x,ref:g,style:{position:"absolute",...x.style},onPointerDown:J(e.onPointerDown,e=>{0===e.button&&(e.target.setPointerCapture(e.pointerId),v.current=f.getBoundingClientRect(),b.current=document.body.style.webkitUserSelect,document.body.style.webkitUserSelect="none",p.viewport&&(p.viewport.style.scrollBehavior="auto"),C(e))}),onPointerMove:J(e.onPointerMove,C),onPointerUp:J(e.onPointerUp,e=>{const t=e.target;t.hasPointerCapture(e.pointerId)&&t.releasePointerCapture(e.pointerId),document.body.style.webkitUserSelect=b.current,p.viewport&&(p.viewport.style.scrollBehavior=""),v.current=null})})})}),St="ScrollAreaThumb",Ct=t.forwardRef((e,t)=>
2{const{forceMount:n,...a}=e,i=Nt(St,e.__scopeScrollArea);return r.jsx(U,{present:n||i.hasThumb,children:r.jsx(Mt,{ref:t,...a})})}),Mt=t.forwardRef((e,n)=>{const{__scopeScrollArea:a,style:i,...o}=e,s=ct(St,a),l=Nt(St,a),{onThumbPositionChange:c}=l,d=Q(n,e=>l.onThumbChange(e)),h=t.useRef(void 0),u=Bt(()=>{h.current&&(h.current(),h.current=void 0)},100);return t.useEffect(()=>{const e=s.viewport;if(e){const t=()=>{if(u(),!h.current){const t=Ft(e,c);h.current=t,c()}};return c(),e.addEventListener("scroll",t),()=>e.removeEventListener("scroll",t)}},[s.viewport,u,c]),r.jsx(O.div,{"data-state":l.hasThumb?"visible":"hidden",...o,ref:d,style:{width:"var(--radix-scroll-area-thumb-width)",height:"var(--radix-scroll-area-thumb-height)",...i},onPointerDownCapture:J(e.onPointerDownCapture,e=>{const t=e.target.getBoundingClientRect(),r=e.clientX-t.left,n=e.clientY-t.top;l.onThumbPointerDown({x:r,y:n})}),onPointerUp:J(e.onPointerUp,l.onThumbPointerUp)})});Ct.displayName=St;var _t="ScrollAreaCorner",Et=t.forwardRef((e,t)=>{const n=ct(_t,e.__scopeScrollArea),a=Boolean(n.scrollbarX&&n.scrollbarY);return"scroll"!==n.type&&a?r.jsx(Rt,{...e,ref:t}):null});Et.displayName=_t;var Rt=t.forwardRef((e,n)=>{const{__scopeScrollArea:a,...i}=e,o=ct(_t,a),[s,l]=t.useState(0),[c,d]=t.useState(0),h=Boolean(s&&c);return Yt(o.scrollbarX,()=>{var e;const t=(null==(e=o.scrollbarX)?void 0:e.offsetHeight)||0;o.onCornerHeightChange(t),d(t)}),Yt(o.scrollbarY,()=>{var e;const t=(null==(e=o.scrollbarY)?void 0:e.offsetWidth)||0;o.onCornerWidthChange(t),l(t)}),h?r.jsx(O.div,{...i,ref:n,style:{width:s,height:c,position:"absolute",right:"ltr"===o.dir?0:void 0,left:"rtl"===o.dir?0:void 0,bottom:0,...e.style}}):null});function zt(e){return e?parseInt(e,10):0}function Tt(e,t){const r=e/t;return isNaN(r)?0:r}function At(e){const t=Tt(e.viewport,e.content),r=e.scrollbar.paddingStart+e.scrollbar.paddingEnd,n=(e.scrollbar.size-r)*t;return Math.max(n,18)}function Pt(e,t,r="ltr"){const n=At(t),a=t.scrollbar.paddingStart+t.scrollbar.paddingEnd,i=t.scrollbar.size-a,o=t.content-t.viewport,s=i-n,l=Z(e,"ltr"===r?[0,o]:[-1*o,0]);return Dt([0,o],[0,s])(l)}function Dt(e,t){return r=>{if(e[0]===e[1]||t[0]===t[1])return t[0];const n=(t[1]-t[0])/(e[1]-e[0]);return t[0]+n*(r-e[0])}}function Lt(e,t){return e>0&&e<t}var Ft=(e,t=()=>{})=>{let r={left:e.scrollLeft,top:e.scrollTop},n=0;return function a(){const i={left:e.scrollLeft,top:e.scrollTop},o=r.left!==i.left,s=r.top!==i.top;(o||s)&&t(),r=i,n=window.requestAnimationFrame(a)}(),()=>window.cancelAnimationFrame(n)};function Bt(e,r){const n=K(e),a=t.useRef(0);return t.useEffect(()=>()=>window.clearTimeout(a.current),[]),t.useCallback(()=>{window.clearTimeout(a.current),a.current=window.setTimeout(n,r)},[n,r])}function Yt(e,t){const r=K(t);V(()=>{let t=0;if(e){const n=new ResizeObserver(()=>{cancelAnimationFrame(t),t=window.requestAnimationFrame(r)});return n.observe(e),()=>{window.cancelAnimationFrame(t),n.unobserve(e)}}},[e,r])}var Ht=dt,It=ut,Xt=Et;const Wt=t.forwardRef(({className:e,children:t,...n},a)=>r.jsxs(Ht,{ref:a,className:u("relative overflow-hidden",e),...n,children:[r.jsx(It,{className:"h-full w-full rounded-[inherit]",children:t}),r.jsx($t,{}),r.jsx(Xt,{})]}));Wt.displayName=Ht.displayName;const $t=t.forwardRef(({className:e,orientation:t="vertical",...n},a)=>r.jsx(pt,{ref:a,orientation:t,className:u("flex touch-none select-none transition-colors","vertical"===t&&"h-full w-2.5 border-l border-l-transparent p-[1px]","horizontal"===t&&"h-2.5 flex-col border-t border-t-transparent p-[1px]",e),...n,children:r.jsx(Ct,{className:"relative flex-1 rounded-full bg-border"})}));$t.displayName=pt.displayName;const Ot=({elements:e,selectedId:t,onSelect:n,onChange:a,onRemove:i,setElements:o})=>{const s=[...e].sort((e,t)=>(e.z||0)-(t.z||0)).reverse();return r.jsxs("div",{className:"flex h-full flex-col border-l border-neutral-800 bg-neutral-950/95 text-white backdrop-blur-xl",children:[r.jsxs("div",{className:"border-b border-neutral-800 p-4",children:[r.jsx("h2",{className:"mb-1 font-bold text-white",children:"Layers"}),r.jsx("p",{className:"text-[10px] text-white/50",children:"Drag to reorder z-index"})]}),r.jsxs(Wt,{className:"flex-1",children:[0===s.length&&r.jsx("div",{className:"p-4",children:r.jsx("div",{className:"rounded-xl border border-neutral-800 bg-white/[0.04] p-4 text-center text-sm text-white/60",children:"No layers yet. Add media or text to start composing."})}),r.jsx(H,{axis:"y",values:s,onReorder:e=>{const t=e.length,r=e.map((e,r)=>({...e,z:t-r}));o(r)},className:"p-4 space-y-2",children:s.map(e=>{var o,s,c;return r.jsxs(I,{value:e,className:u("flex items-center gap-2 rounded-lg border border-neutral-800 bg-white/[0.06] p-2 text-white select-none group touch-manipulation",t===e.id&&"border-primary/60 bg-primary/18 ring-1 ring-primary/70"),onPointerDown:()=>n(e.id),initial:{opacity:0,y:10}
2,animate:{opacity:1,y:0},exit:{opacity:0,scale:.9},children:[r.jsx("div",{className:"cursor-grab active:cursor-grabbing p-1 text-white/20 hover:text-white",children:r.jsx(ie,{className:"w-4 h-4"})}),r.jsx("div",{className:"w-8 h-8 rounded bg-black/35 flex items-center justify-center overflow-hidden",children:"text"===e.type?r.jsx(w,{className:"w-4 h-4 text-white/50"}):"video"===(null==(o=e.memory)?void 0:o.type)?r.jsx(oe,{className:"w-4 h-4 text-white/50"}):(null==(s=e.memory)?void 0:s.image_url)?r.jsx("img",{src:F(e.memory.image_url,"thumbnail")||e.memory.image_url,className:"w-full h-full object-cover",loading:"lazy",decoding:"async"}):r.jsx($,{className:"w-4 h-4 text-white/50"})}),r.jsx("div",{className:"flex-1 min-w-0",children:r.jsx("p",{className:"truncate text-xs font-medium text-white/90",children:"text"===e.type?`T â ${e.content||"Text Layer"}`:(null==(c=e.memory)?void 0:c.content)||"Media Layer"})}),r.jsxs("div",{className:"flex items-center gap-1 opacity-100 sm:opacity-0 group-hover:opacity-100 transition-opacity",children:[r.jsx(l,{variant:"ghost",size:"icon",className:"w-9 h-9 md:w-6 md:h-6 rounded-full hover:bg-white/10",onClick:t=>{t.stopPropagation(),a(e.id,{locked:!e.locked})},children:e.locked?r.jsx(T,{className:"w-4 h-4 md:w-3 md:h-3 text-red-400"}):r.jsx(Je,{className:"w-4 h-4 md:w-3 md:h-3 text-white/30"})}),r.jsx(l,{variant:"ghost",size:"icon",className:"w-9 h-9 md:w-6 md:h-6 rounded-full hover:bg-white/10",onClick:t=>{t.stopPropagation(),a(e.id,{visible:!1===e.visible})},children:!1===e.visible?r.jsx(se,{className:"w-4 h-4 md:w-3 md:h-3 text-white/30"}):r.jsx(le,{className:"w-4 h-4 md:w-3 md:h-3 text-white/70"})}),r.jsx(l,{variant:"ghost",size:"icon",className:"w-9 h-9 md:w-6 md:h-6 rounded-full hover:bg-destructive/20 hover:text-destructive",onClick:t=>{t.stopPropagation(),i(e.id)},children:r.jsx(D,{className:"w-4 h-4 md:w-3 md:h-3 text-white/30 hover:text-destructive"})})]})]},e.id)})})]})]})},qt=[{id:"title",label:"Add heading",description:"Large, auto-width title",icon:C},{id:"subtitle",label:"Add subheading",description:"Supporting auto-width text",icon:M},{id:"paragraph",label:"Add body text",description:"Wrapped, fixed-width paragraph",icon:Qe}];function Kt({onAdd:e}){let t=[];try{const e=JSON.parse(window.localStorage.getItem("echo-canvas-recent-fonts")||"[]");Array.isArray(e)&&(t=e.filter(e=>"string"==typeof e).slice(0,4))}catch{t=[]}return r.jsx("div",{className:"flex h-full flex-col bg-neutral-950/95 text-white",children:r.jsx(Wt,{className:"flex-1",children:r.jsxs("div",{className:"space-y-7 p-4 pb-24",children:[r.jsx("section",{className:"space-y-2",children:qt.map(({id:t,label:n,description:a,icon:i})=>r.jsxs("button",{type:"button",onClick:()=>e(t),className:"flex min-h-16 w-full items-center gap-3 rounded-2xl border border-neutral-800 bg-white/[0.055] p-3 text-left transition-colors hover:border-white/20 hover:bg-white/[0.09] focus:outline-none focus:ring-2 focus:ring-primary/70",children:[r.jsx("span",{className:"flex h-10 w-10 shrink-0 items-center justify-center rounded-xl bg-white/[0.07]",children:r.jsx(i,{className:"h-5 w-5 text-white/75"})}),r.jsxs("span",{children:[r.jsx("span",{className:"block text-sm font-semibold",children:n}),r.jsx("span",{className:"mt-0.5 block text-[11px] text-white/42",children:a})]})]},t))}),r.jsxs("section",{className:"space-y-3",children:[r.jsxs("div",{children:[r.jsx("h3",{className:"text-xs font-bold uppercase tracking-wider text-white/70",children:"Text styles"}),r.jsx("p",{className:"mt-1 text-[11px] text-white/38",children:"Start polished, then make it yours."})]}),r.jsx("div",{className:"grid grid-cols-2 gap-2",children:Ze.filter(e=>!["title","subtitle","paragraph"].includes(e.id)).map(t=>r.jsxs("button",{type:"button",onClick:()=>e(t.id),className:"min-h-24 rounded-2xl border border-neutral-800 bg-white/[0.04] p-3 text-left transition-colors hover:border-white/20 hover:bg-white/[0.08]",children:[r.jsx("span",{className:"line-clamp-2 block text-white",style:{fontFamily:t.style.fontFamily,fontWeight:t.style.fontWeight,fontStyle:t.style.fontStyle},children:"quote"===t.id?"âA thought worth keeping.â":t.label}),r.jsx("span",{className:"mt-2 block text-[10px] text-white/38",children:t.description})]},t.id))})]}),r.jsxs("section",{className:"space-y-3",children:[r.jsx("h3",{className:"text-xs font-bold uppercase tracking-wider text-white/70",children:"Quote starters"}),r.jsxs("button",{type:"button",onClick:()=>e("quote"),className:"flex w-full items-start gap-3 rounded-2xl border border-neutral-800 bg-gradient-to-br from-white/[0.08] to-white/[0.025] p-4 text-left hover:border-white/20",children:[r.jsx(N,{className:"mt-0.5 h-5 w-5 shrink-0 text-primary"}),r.jsx("span",{className:"font-serif text-lg leading-snug text-white/85",children:"âType something worth remembering.â"})]}),r.jsxs("button",{type:"button",onClick:()=>e("note"),className:"flex w-full items-center gap-3 rounded-2xl border border-neutral-800 bg-white/[0.04] p-3 text-left hover:border-white/20",children:[r.jsx(ce,{className:"h-5 w-5 text-white/55"}),r.jsx("span",{className:"text-sm font-semibold",children:"Add journal note"})]})]}),r.jsxs("section",{className:"space-y-3",children:[r.jsx("h3",{className:"text-xs font-bold uppercase tracking-wider text-white/70",children:t.length?"Recent fonts":"Recommended fonts"}),r.jsx("div",{className:"space-y-1",children:(t.length?t.map(e=>et.find(t=>
2t.value===e)).filter(Boolean):et.filter(e=>"Recommended"===e.category).slice(0,4)).map(e=>e&&r.jsx("div",{className:"rounded-xl px-3 py-2 text-sm text-white/70",style:{fontFamily:e.value},children:e.name},e.value))})]})]})})})}const Vt=["id","type","image_url","video_url","content","title","ai_title","description","ai_description","source_url","metadata"].join(","),Ut=`created_at, memories!inner(${Vt})`;function Jt(e,t){const r=t.trim().toLowerCase();return r?(e||[]).filter(e=>function(e){return[e.content,e.title,e.ai_title,e.description,e.ai_description,e.source_url,e.metadata?JSON.stringify(e.metadata):null].filter(Boolean).join(" ").toLowerCase()}(e).includes(r)):e||[]}function Qt(...e){const t=new Map;return e.flat().forEach(e=>{(null==e?void 0:e.id)&&"image"===e.type&&!t.has(e.id)&&t.set(e.id,e)}),Array.from(t.values())}function Gt(e){const t=Array.isArray(null==e?void 0:e.memories)?e.memories[0]:null==e?void 0:e.memories;return(null==t?void 0:t.id)?t:null}function Zt(e,t){return i.from("memories").select(Vt).eq("user_id",e).is("deleted_at",null).eq("type","image").order("created_at",{ascending:!1}).limit(t?500:100)}function er(e,t){return i.from("memory_boards").select(Ut).in("board_id",e).is("memories.deleted_at",null).eq("memories.type","image").order("created_at",{ascending:!1}).limit(t?500:100)}function tr(e,t){return i.from("memory_boards").select(Ut).eq("added_by",e).is("memories.deleted_at",null).eq("memories.type","image").order("created_at",{ascending:!1}).limit(t?500:100)}const rr=({onAdd:e,elements:t=[],selectedId:n=null,onSelect:l=()=>{},onChange:d=()=>{},onRemove:h=()=>{},setElements:m=()=>{},onAddText:w=()=>{},defaultTab:g="library"})=>{var v;const b=o(),[y,j]=a.useState(""),[N,k]=a.useState("all"),[S,C]=a.useState(!1),{boards:M=[]}=ee(),_=a.useMemo(()=>[...M].filter(e=>!e.is_smart&&(e.is_owner||e.can_edit||!e.is_following)).map(e=>({id:e.id,name:e.name,updated_at:e.updated_at})).sort((e,t)=>new Date(t.updated_at||0).getTime()-new Date(e.updated_at||0).getTime()),[M]),E=a.useMemo(()=>_.map(e=>e.id),[_]),R="all"===N?"All Boards":(null==(v=_.find(e=>e.id===N))?void 0:v.name)||"All Boards",z=a.useMemo(()=>
2["memories-sidebar",y,N,E.join("|")],[E,y,N]),{data:T,isLoading:A}=s({queryKey:z,queryFn:async()=>{var e;const t=y.trim(),{data:{session:r}}=await i.auth.getSession(),n=null==r?void 0:r.user;if(!n)return[];if(!t&&"all"===N){const e=await Zt(n.id,t).returns();if(e.error)throw e.error;const r=Qt(e.data);b.setQueryData(z,r);const[a,i]=await Promise.all([tr(n.id,t),E.length>0?er(E,t):Promise.resolve({data:[],error:null})]);return a.error,i.error,Qt(r,(a.data||[]).map(Gt).filter(Boolean),(i.data||[]).map(Gt).filter(Boolean))}let a=[];if(t.length>3&&"all"===N)try{const n=await i.functions.invoke("semantic-search",{body:{query:t,limit:50,threshold:.5},headers:r?{Authorization:`Bearer ${r.access_token}`}:{}});(null==(e=n.data)?void 0:e.success)&&(a=(n.data.memories||[]).filter(e=>"image"===e.type))}catch(s){}const o=await async function(e,t,r,n){const a="all"===t?n:n.includes(t)?[t]:[];if(!r){const[n,i,o]=await Promise.all(["all"===t?Zt(e,r):Promise.resolve({data:[],error:null}),"all"===t?tr(e,r):Promise.resolve({data:[],error:null}),a.length>0?er(a,r):Promise.resolve({data:[],error:null})]);if(n.error)throw n.error;if(i.error)throw i.error;if(o.error)throw o.error;
2return Qt(n.data||[],(i.data||[]).map(Gt).filter(Boolean),(o.data||[]).map(Gt).filter(Boolean))}const o=function(e){return`%${e.trim().replace(/[%_]/g,"\\$&")}%`}(r),s=Zt(e,r).textSearch("search_vector",r,{type:"plain"}).returns(),l="all"===t?Zt(e,r).returns():Promise.resolve({data:[],error:null}),c=a.length>0?er(a,r):Promise.resolve({data:[],error:null}),d="all"===t?tr(e,r):Promise.resolve({data:[],error:null}),h=i.from("memory_tags").select("memory_id, tags!inner(name,user_id)").eq("tags.user_id",e).ilike("tags.name",o).limit(500),[u,m,x,p,f]=await Promise.all([s,l,c,d,h]);if(u.error,f.error,x.error,p.error,m.error)throw m.error;const w=Array.from(new Set((f.data||[]).map(e=>null==e?void 0:e.memory_id).filter(Boolean))),g=w.length>0?await Zt(e,r).in("id",w).returns():{data:[],error:null};g.error;const v=Jt(m.data,r),b=Jt((x.data||[]).map(Gt).filter(Boolean),r);return Qt(v,Jt((p.data||[]).map(Gt).filter(Boolean),r),b,u.data,g.data)}(n.id,N,t,E);return Qt(o,a)},staleTime:6e4,gcTime:6e5,retry:1,refetchOnWindowFocus:!1});return r.jsx("div",{className:"flex h-full flex-col border-t border-neutral-800 bg-neutral-950/95 text-white backdrop-blur-xl md:border-l md:border-t-0",children:r.jsxs(te,{defaultValue:g,className:"flex h-full min-h-0 flex-col",children:[r.jsxs(re,{className:"grid h-12 w-full shrink-0 grid-cols-3 bg-black/40 p-1.5",children:[r.jsx(ne,{value:"library",className:"rounded-xl text-sm font-semibold text-white/58 data-[state=active]:bg-white/10 data-[state=active]:text-white",children:"Library"}),r.jsx(ne,{value:"text",className:"rounded-xl text-sm font-semibold text-white/58 data-[state=active]:bg-white/10 data-[state=active]:text-white",children:"Text"}),r.jsx(ne,{value:"layers",className:"rounded-xl text-sm font-semibold text-white/58 data-[state=active]:bg-white/10 data-[state=active]:text-white",children:"Layers"})]}),r.jsxs(ae,{value:"library",className:"mt-0 min-h-0 flex-1 flex-col overflow-hidden data-[state=active]:flex data-[state=inactive]:hidden",children:[r.jsxs("div",{className:"space-y-3 border-b border-neutral-800 p-4",children:[r.jsx(c,{placeholder:"Search your echoes...",value:y,onChange:e=>j(e.target.value),className:"h-11 rounded-full border border-neutral-800 bg-white/[0.07] text-white placeholder:text-white/42 focus-visible:ring-white/15 md:h-9"}),r.jsxs(x,{open:S,onOpenChange:C,children:[r.jsx(p,{asChild:!0,children:r.jsxs("button",{type:"button",className:"flex h-11 w-full items-center justify-between gap-3 rounded-2xl border border-neutral-800 bg-white/[0.08] px-4 text-left text-sm font-semibold text-white shadow-inner shadow-black/20 transition-colors hover:border-neutral-700 hover:bg-white/[0.12] focus:outline-none focus:ring-1 focus:ring-white/15 md:h-10",children:[r.jsx("span",{className:"min-w-0 truncate",children:R}),r.jsx(de,{className:u("h-4 w-4 shrink-0 text-white/55 transition-transform",S&&"rotate-180")})]})}),r.jsxs(f,{align:"start",sideOffset:8,className:"z-[160] w-[var(--radix-popover-trigger-width)] overflow-hidden rounded-2xl border-neutral-800 bg-neutral-950/95 p-1.5 text-white shadow-2xl shadow-black/50 backdrop-blur-xl",children:[r.jsx("div",{className:"px-3 pb-2 pt-2 text-[10px] font-bold uppercase tracking-widest text-white/40",children:"Recently updated"}),r.jsx("div",{className:"max-h-[min(22rem,calc(100vh-14rem))] overflow-y-auto overscroll-contain pr-1",style:{WebkitOverflowScrolling:"touch"},onWheel:e=>e.stopPropagation(),onTouchMove:e=>e.stopPropagation(),children:r.jsx("div",{className:"space-y-1",children:[{id:"all",name:"All Boards"},..._].map(e=>{const t=N===e.id;return r.jsxs("button",{type:"button",onClick:()=>{k(e.id),C(!1)},className:u("flex min-h-10 w-full items-center gap-3 rounded-xl px-3 py-2 text-left text-sm font-semibold transition-colors",t?"bg-primary/18 text-white":"text-white/82 hover:bg-white/10 hover:text-white"),children:[r.jsx("span",{className:"flex h-4 w-4 shrink-0 items-center justify-center",children:t&&r.jsx(he,{className:"h-4 w-4 text-primary"})}),r.jsx("span",{className:"min-w-0 truncate",children:e.name})]},e.id)})})})]})]})]}),r.jsx(Wt,{className:"flex-1 p-4",children:A&&!T?r.jsx("div",{className:"flex justify-center p-8",children:r.jsx(X,{className:"animate-spin text-white/65"})}):r.jsxs("div",{className:"grid grid-cols-2 gap-3 pb-24",children:[null==T?void 0:T.map(t=>r.jsxs("div",{draggable:!0,onDragStart:e=>((e,t)=>{e.dataTransfer.setData("echo",JSON.stringify(t))})(e,t),onClick:()=>e(t),className:"aspect-[3/4] rounded-xl overflow-hidden cursor-grab active:cursor-grabbing transition-all bg-white/[0.06] relative group shadow-sm hover:shadow-md touch-manipulation",children:[t.image_url?r.jsx("img",{src:F(t.image_url,"thumbnail")||t.image_url,className:"w-full h-full object-cover pointer-events-none",loading:"lazy",decoding:"async"}):r.jsx("div",{className:"h-full bg-white/[0.07] p-3 text-[10px] text-white/75 line-clamp-6",children:t.content}),r.jsx("div",{className:"absolute inset-0 bg-black/0 hover:bg-black/10 transition-colors"}),r.jsx("div",{className:"absolute inset-0 flex items-center justify-center opacity-100 md:opacity-0 md:group-hover:opacity-100 transition-opacity bg-black/20",children:r.jsx(ue,{className:"w-6 h-6 text-white drop-shadow-md"})})]},t.id)),!(null==T?void 0:T.length)&&r.jsx("div",{className:"col-span-2 rounded-xl border border-neutral-800 bg-white/[0.04] p-4 text-center text-sm text-white/60",children:"No media found. Try another board or search term."})]})})]}),r.jsx(ae,{value:"text",className:"mt-0 min-h-0 flex-1 overflow-hidden data-[state=inactive]:hidden",children:r.jsx(Kt,{onAdd:w})}),r.jsx(ae,{value:"layers",className:"mt-0 min-h-0 flex-1 overflow-hidden data-[state=inactive]:hidden",children:r.jsx(Ot,{elements:t,selectedId:n,onSelect:l,onCh
2ange:d,onRemove:h,setElements:m})})]})})};function nr({selectedIds:e,elements:t,onBatchChange:n}){if(e.size<2)return null;const a=t.filter(t=>e.has(t.id)),i=[{op:"left",icon:b,title:"Align left"},{op:"centerH",icon:y,title:"Align center (horizontal)"},{op:"right",icon:j,title:"Align right"},{op:"top",icon:We,title:"Align top"},{op:"centerV",icon:He,title:"Align middle (vertical)"},{op:"bottom",icon:Ie,title:"Align bottom"},{op:"distributeH",icon:Xe,title:"Distribute horizontally"},{op:"distributeV",icon:$e,title:"Distribute vertically"}];return r.jsxs(r.Fragment,{children:[r.jsx("div",{className:"h-6 w-px bg-white/20 flex-shrink-0"}),r.jsxs("div",{className:"flex items-center gap-0.5 flex-shrink-0",title:`${e.size} selected`,children:[r.jsxs("span",{className:"text-[9px] text-primary/70 font-black uppercase tracking-widest mr-1 hidden md:inline",children:[e.size," sel"]}),i.map(({op:e,icon:t,title:i})=>r.jsx(l,{variant:"ghost",size:"icon",onClick:()=>(e=>{const t=[],r=Math.min(...a.map(e=>e.x)),i=Math.max(...a.map(e=>e.x+e.w)),o=Math.min(...a.map(e=>e.y)),s=Math.max(...a.map(e=>e.y+e.h)),l=(r+i)/2,c=(o+s)/2;if("left"===e)a.forEach(e=>t.push({id:e.id,x:r}));else if("centerH"===e)a.forEach(e=>t.push({id:e.id,x:l-e.w/2}));else if("right"===e)a.forEach(e=>t.push({id:e.id,x:i-e.w}));else if("top"===e)a.forEach(e=>t.push({id:e.id,y:o}));else if("centerV"===e)a.forEach(e=>t.push({id:e.id,y:c-e.h/2}));else if("bottom"===e)a.forEach(e=>t.push({id:e.id,y:s-e.h}));else if("distributeH"===e){const e=[...a].sort((e,t)=>e.x-t.x),n=e.reduce((e,t)=>e+t.w,0),o=i-r-n,s=e.length>1?o/(e.length-1):0;let l=r;e.forEach(e=>{t.push({id:e.id,x:l}),l+=e.w+s})}else if("distributeV"===e){const e=[...a].sort((e,t)=>e.y-t.y),r=e.reduce((e,t)=>e+t.h,0),n=s-o-r,i=e.length>1?n/(e.length-1):0;let l=o;e.forEach(e=>{t.push({id:e.id,y:l}),l+=e.h+i})}n(t)})(e),title:i,className:"w-7 h-7 rounded-full hover:bg-white/10 text-white/50 hover:text-white transition-colors",children:r.jsx(t,{className:"w-3.5 h-3.5"})},e))]})]})}const ar={fontSize:48,color:"rgb(var(--ink))",textAlign:"center",fontWeight:"700",fontFamily:"Manrope, sans-serif",lineHeight:1.15,letterSpacing:0};function ir(e){var t;return Boolean(null==(t=null==e?void 0:e.memory)?void 0:t.image_url)}const or=e=>"object"==typeof e&&null!==e&&!Array.isArray(e),sr=(e,t)=>"number"==typeof e&&Number.isFinite(e)?e:t,lr=(e,t)=>{const r=sr(e,t);return r>0?r:t},cr=e=>"image"===e||"video"===e||"text"===e||"placeholder"===e||"memory"===e,dr=e=>void 0===e||"string"==typeof e;function hr(e,t=0){const r=String((null==e?void 0:e.id)??`layer-${t}-${Date.now()}`),n=(a=e.memory,or(a)&&dr(a.id)&&dr(a.type)&&dr(a.image_url)&&dr(a.video_url)&&dr(a.content)&&dr(a.title)?e.memory:void 0);var a;const i=(e=>!!or(e)&&["fontSize","opacity","letterSpacing","lineHeight","padding","borderRadius","backdropBlur"].every(t=>void 0===e[t]||"number"==typeof e[t])&&["color","fontFamily","fontWeight","fontStyle","textDecoration","textTransform","textShadow","backgroundColor","boxShadow"].every(t=>void 0===e[t]||"string"==typeof e[t])&&(void 0===e.textAlign||"left"===e.textAlign||"center"===e.textAlign||"right"===e.textAlign))(e.style)?e.style:void 0,o={id:r,type:cr(e.type)?e.type:void 0,x:sr(e.x,0),y:sr(e.y,0),w:lr(e.w,200),h:lr(e.h,300),z:sr(e.z,t+1),rotation:sr(e.rotation,0),opacity:"number"==typeof(null==e?void 0:e.opacity)?e.opacity:1,flipX:Boolean(null==e?void 0:e.flipX),flipY:Boolean(null==e?void 0:e.flipY),visible:!1!==(null==e?void 0:e.visible),locked:Boolean(null==e?void 0:e.locked),aspectLocked:Boolean(null==e?void 0:e.aspectLocked),contentScale:sr(e.contentScale,1),contentX:sr
2(e.contentX,0),contentY:sr(e.contentY,0),contentRotation:sr(e.contentRotation,0),contentFlipX:Boolean(null==e?void 0:e.contentFlipX),contentFlipY:Boolean(null==e?void 0:e.contentFlipY),contentCropX:sr(e.contentCropX,0),contentCropY:sr(e.contentCropY,0),contentCropW:lr(e.contentCropW,1),contentCropH:lr(e.contentCropH,1)};return"text"===(null==e?void 0:e.type)?{...o,type:"text",content:String((null==e?void 0:e.content)??"Type something"),textBoxMode:"fixed"===(null==e?void 0:e.textBoxMode)?"fixed":"auto",style:{...ar,...i},memory:n}:"placeholder"===(null==e?void 0:e.type)?{...o,type:"placeholder",memory:n}:{...o,type:"image"===e.type||"video"===e.type||"memory"===e.type?e.type:void 0,memory:n,content:"string"==typeof e.content?e.content:void 0,style:i}}const ur=e=>{if("string"==typeof e)return e.trim()||null;if(e instanceof Error)return e.message.trim()||null;if(!e||"object"!=typeof e)return null;const t=e;for(const r of["message","details","hint","error"]){const e=ur(t[r]);if(e)return e}return"string"==typeof t.code&&t.code.trim()?`Save error (${t.code.trim()})`:null},mr=(e,t="The canvas could not be saved. Please try again.")=>{const r=ur(e)||t,n=r.toLowerCase();return n.includes("statement timeout")||n.includes("canceling statement")||n.includes("cancelling statement")?"Saving took too long. Please try again in a moment.":n.includes("row-level security")||n.includes("permission denied")||n.includes("violates row-level security")?"You no longer have permission to save there.":n.includes("jwt")||n.includes("not authenticated")||n.includes("unauthorized")?"Your session has expired. Sign in again, then retry.":n.includes("failed to fetch")||n.includes("networkerror")||n.includes("network request failed")||n.includes("load failed")?"The connection was interrupted while saving. Your canvas is still openâplease retry.":r},xr=(e,t=String("https://cdn.myechoboard.com"))=>{if(!e||e.startsWith("data:")||e.startsWith("blob:"))return!0;if(!/^https?:\/\//i.test(e))return!0;try{const r=new URL(e).hostname.toLowerCase(),n=t?new URL(t).hostname.toLowerCase():"";return Boolean(r===n||"cdn.myechoboard.com"===r||"assets.myechoboard.com"===r||r.endsWith(".supabase.co"))}catch{return!1}},pr=m,fr=(e,t)=>`scale(${e}) translate(${t.x/e}px, ${t.y/e}px)`,wr=async()=>(await e(async()=>{const{default:e}=await import("./vendor-export-DLngdRqf.js").then(e=>e.h);return{default:e}},__vite__mapDeps([0,1]))).default,gr=[{key:"free",label:"Free",ratio:null},{key:"original",label:"Original",ratio:null},{key:"1:1",label:"1:1",ratio:1},{key:"4:5",label:"4:5",ratio:.8},{key:"3:4",label:"3:4",ratio:3/4},{key:"9:16",label:"9:16",ratio:9/16},{key:"16:9",label:"16:9",ratio:16/9},{key:"2:3",label:"2:3",ratio:2/3}],vr={contentScale:1,contentX:0,contentY:0,contentRotation:0,contentFlipX:!1,contentFlipY:!1,aspect:"free",frame:{x:.08,y:.08,w:.84,h:.84}},br=(e,t,r)=>
2Math.min(r,Math.max(t,e)),yr=e=>JSON.parse(JSON.stringify(e)),jr=()=>{var e;const{id:n}=Ae(),a=Pe(),x=o(),{toast:p}=h(),f=Ne(),{state:g,setState:v,undo:b,redo:y}=((e,{maxEntries:r=80}={})=>{const n=Math.max(2,Math.floor(r)),[a,i]=t.useState({history:[e],currentIndex:0}),o=t.useRef(e),s=a.history[a.currentIndex]??o.current,l=t.useCallback((e,t)=>{i(r=>{const{history:a,currentIndex:i}=r,s=a[i]??o.current,l="function"==typeof e?e(s):e;if(null==l)return r;if(Object.is(l,s))return r;if(null==t?void 0:t.overwrite){const e=[...a];return e[i]=l,{history:e,currentIndex:i}}return((e,t,r,n)=>{const a=Math.max(2,Math.floor(n)),i=[...e.slice(0,t+1),r],o=i.length>a?i.slice(-a):i;return{history:o,currentIndex:o.length-1}})(a,i,l,n)})},[n]);return{state:s,setState:l,undo:t.useCallback(()=>{i(e=>({...e,currentIndex:Math.max(0,e.currentIndex-1)}))},[]),redo:t.useCallback(()=>{i(e=>({...e,currentIndex:Math.min(e.history.length-1,e.currentIndex+1)}))},[]),canUndo:a.currentIndex>0,canRedo:a.currentIndex<a.history.length-1,history:a.history}})([],{maxEntries:f?30:80}),[j,N]=t.useState(null),[k,S]=t.useState(null),[C,M]=t.useState(new Set),[_,E]=t.useState(null),[R,A]=t.useState(vr),[P,L]=t.useState(null),[F,B]=t.useState(!1),Y=t.useRef(null),H=t.useRef(null),[I,O]=t.useState(null),q=t.useRef(!1),[K,V]=t.useState(!1),[U,J]=t.useState({x:0,y:0}),Q=t.useRef(U),G=t.useRef(1),Z=t.useRef(null),te=t.useRef(null),re=t.useRef(!1),ne=t.useRef(!1),[ae,ie]=t.useState(1),[oe,se]=t.useState("saved"),[le,ce]=t.useState(!1),[de,He]=t.useState(!1),[Ie,Xe]=t.useState("#ffffff"),[We,$e]=t.useState(""),[Oe,Qe]=t.useState(!1),Ge=t.useRef(!1),et=t.useRef(null),[tt,rt]=t.useState(null),[nt,at]=t.useState(""),[ot,st]=t.useState(!1),[lt,ct]=t.useState(!1),[dt,ht]=t.useState("16:9"),[ut,mt]=t.useState("px"),[xt,pt]=t.useState(1920),[ft,wt]=t.useState(1080),[gt,vt]=t.useState(!0),bt=t.useRef(16/9),[yt,jt]=t.useState("rearrange"),[Nt,kt]=t.useState(!0),[St,Ct]=t.useState(!1);t.useEffect(()=>{k&&j!==k&&!C.has(k)&&S(null)},[k,j,C]),t.useEffect(()=>{if(!k)return;const e=e=>{const t=e.target;if(!(t instanceof Element))return;const r=Array.from(document.querySelectorAll("[data-canvas-element-id]")).find(e=>e.dataset.canvasElementId===k),n=(null==r?void 0:r.contains(t))??!1,a=Boolean(t.closest("[data-canvas-text-toolbar], [data-radix-popper-content-wrapper]"));n||a||(document.activeElement instanceof HTMLElement&&document.activeElement.blur(),S(null))};return document.addEventListener("pointerdown",e,!0),()=>{document.removeEventListener("pointerdown",e,!0)}},[k]);const{boards:Mt=[]}=ee(),_t=t.useMemo(()=>Mt.filter(e=>!1!==e.can_edit&&!e.is_following).sort((e,t)=>new Date(t.updated_at||0).getTime()-new Date(e.updated_at||0).getTime()).map(e=>({id:e.id,name:e.name})),[Mt]),[Et,Rt]=t.useState(new Set),zt=t.useRef(!1),Tt=t.useRef(null),At=t.useRef(null),Pt=t.useRef(null),Dt=t.useRef(""),Lt=t.useRef(Promise.resolve()),Ft=t.useRef(0),Bt=t.useRef(null),[Yt,Ht]=t.useState(!1),[It,Xt]=t.useState("library"),Wt=t.useCallback(()=>{Z.current=null,Tt.current&&(Tt.current.style.transform=fr(G.current,Q.current))},[]),$t=t.useCallback(()=>{null===Z.current&&(Z.current=requestAnimationFrame(Wt))},[Wt]);t.useEffect(()=>{Q.current=U,$t()},[U,$t]),t.useEffect(()=>{G.current=ae,$t()},[ae,$t]),t.useEffect(()=>()=>{null!==Z.current&&cancelAnimationFrame(Z.current)},[]);const{data:Ot,isLoading:qt}=s({queryKey:["canvas",n],queryFn:async()=>{const{data:e,error:t}=await i.from("canvases").select("*").eq("id",n).single();if(t)throw t;return e}});t.useEffect(()=>{if(!(null==Ot?void 0:Ot.id))return;const e=window.setTimeout(()=>{wr().catch(e=>{})},250);return()=>window.clearTimeout(e)},[null==Ot?void 0:Ot.id]);const{data:Kt}=s({queryKey:["canvas-feature-flags"],queryFn:async()=>{const{data:e}=await i.from("system_settings").select("key, value").in("key",["canvas_bg_remove_enabled","canvas_mobile_gestures_v2","canvas_text_v2"]),t={canvas_bg_remove_enabled:!0,canvas_mobile_gestures_v2:!0,canvas_text_v2:!0};if(!e)return t;const r={...t};return e.forEach(e=>{"boolean"==typeof e.value&&e.key in r&&(r[e.key]=e.value)}),r},staleTime:6e4}),Vt=t.useCallback((e,t,r=!0)=>{var n,a;if("number"==typeof t.x&&Number.isNaN(t.x))return;if("number"==typeof t.y&&Number.isNaN(t.y))return;if("number"==typeof t.w&&Number.isNaN(t.w))return;if("number"==typeof t.h&&Number.isNaN(t.h))return;const i={...t};"freeform"===(null==Ot?void 0:Ot.type)||void 0===i.x&&void 0===i.y||("number"==typeof i.x&&(i.x=50*Math.round(i.x/50)),"number"==typeof i.y&&(i.y=50*Math.round(i.y/50)));const o=Se((null==Ot?void 0:Ot.aspect_ratio)||"9:16"),s=o.w,l=o.h;if("number"==typeof i.x){const t="number"==typeof i.w?i.w:(null==(n=null==g?void 0:g.find(t=>
2t.id===e))?void 0:n.w)??200;i.x=Math.max(0,Math.min(i.x,s-t))}if("number"==typeof i.y){const t="number"==typeof i.h?i.h:(null==(a=null==g?void 0:g.find(t=>t.id===e))?void 0:a.h)??300;i.y=Math.max(0,Math.min(i.y,l-t))}const c=!zt.current;v(t=>t?t.map(t=>t.id===e?{...t,...i}:t):t,{overwrite:!c}),zt.current=!r},[null==Ot?void 0:Ot.type,null==Ot?void 0:Ot.aspect_ratio,v,g]),Ut=t.useCallback(e=>{const t=new Map(e.map(e=>[e.id,e]));v(e=>e?e.map(e=>{const r=t.get(e.id);return r?{...e,...r}:e}):e)},[v]),Jt=()=>{Qe(!1),We.trim()||$e((null==Ot?void 0:Ot.name)||"Untitled canvas")},Qt=t.useRef(!1),Gt=t.useCallback(()=>{if(!Ot)return;const e=window.innerWidth<768,t=Se(Ot.aspect_ratio||"9:16"),r=e?0:80,n=e?0:320,a=window.innerWidth-n-r,i=window.innerHeight-80-r,o=Math.min(a/t.w,i/t.h),s=Math.max(.1,Math.min(o,1));ie(s)},[Ot]),Zt=t.useCallback((e="title",t,r)=>{var n,a;const i=function(e){return Ze.find(t=>t.id===e)||Ze[0]}(e),o=Se((null==Ot?void 0:Ot.aspect_ratio)||"9:16"),s=null==(n=Tt.current)?void 0:n.getBoundingClientRect(),l=null==(a=At.current)?void 0:a.getBoundingClientRect(),c=(null==s?void 0:s.width)?s.width/o.w:G.current,d=s&&l?{x:(l.left+l.width/2-s.left)/Math.max(c,.001),y:(l.top+l.height/2-s.top)/Math.max(c,.001)}:{x:o.w/2,y:o.h/2},h=r||d,u=pr(),m={id:u,type:"text",content:(null==t?void 0:t.trim())||i.content,textBoxMode:i.boxMode,x:br(h.x-i.width/2,0,Math.max(0,o.w-i.width)),y:br(h.y-i.height/2,0,Math.max(0,o.h-i.height)),w:Math.min(i.width,o.w),h:Math.min(i.height,o.h),z:1,rotation:0,opacity:1,flipX:!1,flipY:!1,visible:!0,locked:!1,aspectLocked:!1,contentScale:1,contentX:0,contentY:0,style:{...i.style}};v(e=>{const t=Array.isArray(e)?e:[],r=Math.max(0,...t.map(e=>e.z||0))+1;return[...t,{...m,z:r}]}),M(new Set),N(u),S(u),be("canvas_text_add",{preset:e})},[null==Ot?void 0:Ot.aspect_ratio,v]),er=t.useCallback(e=>{const t=(g||[]).find(t=>t.id===e);if(!t)return;const r=pr();v(e=>{const n=Array.isArray(e)?e:[],a=Math.max(0,...n.map(e=>e.z||0))+1;return[...n,{...t,id:r,x:t.x+24,y:t.y+24,z:a}]}),M(new Set),N(r)},[g,v]);t.useEffect(()=>{const e=()=>{const e=window.innerWidth<768;return He(e),e};e();const t=je(e);if((null==Ot?void 0:Ot.elements)&&et.current!==Ot.id){const e=function(e){return Array.isArray(e)?e.filter(or).map((e,t)=>hr(e,t)).sort((e,t)=>(e.z||0)-(t.z||0)):[]}(Ot.elements);v(e,{overwrite:!0}),Pt.current=e,Dt.current=Ot.name||"Untitled Canvas",et.current=Ot.id}return!Ot||Ge.current&&(!Ot.name||We||Oe)||($e(Ot.name||"Untitled Canvas"),Ge.current=!0),Ot&&!Qt.current&&(Qt.current=!0,setTimeout(Gt,100)),t},[Ot,We,Oe,Gt,v]),t.useEffect(()=>{const e=e=>{if(" "===e.key&&!e.repeat){const t=e.target.tagName;if("INPUT"!==t&&"TEXTAREA"!==t&&!e.target.isContentEditable)return e.preventDefault(),void V(!0)}if("INPUT"===e.target.tagName||"TEXTAREA"===e.target.tagName||e.target.isContentEditable)return;const t=null==g?void 0:g.find(e=>e.id===j);if(!e.metaKey&&!e.ctrlKey&&!e.altKey&&"t"===e.key.toLowerCase())return e.preventDefault(),void Zt("title");if("Enter"===e.key&&"text"===(null==t?void 0:t.type))return e.preventDefault(),void S(t.id);if((e.metaKey||e.ctrlKey)&&"a"===e.key){e.preventDefault();const t=new Set((g||[]).map(e=>e.id));return M(t),void N(null)}if("Delete"===e.key||"Backspace"===e.key){if(C.size>0)return e.preventDefault(),v(e=>(e||[]).filter(e=>!C.has(e.id))),void M(new Set);if(j)return e.preventDefault(),v(e=>(e||[]).filter(e=>e.id!==j)),void N(null)}if("Escape"===e.key)return N(null),void M(new Set);if((e.metaKey||e.ctrlKey)&&"z"===e.key)return e.preventDefault(),void(e.shiftKey?y():b());if((e.metaKey||e.ctrlKey)&&"d"===e.key&&t)return e.preventDefault(),er(t.id),void p({title:"Element duplicated"});if((e.metaKey||e.ctrlKey)&&"c"===e.key&&t)return e.preventDefault(),sessionStorage.setItem("canvas_clipboard",JSON.stringify(t)),void p({title:"Element copied"});if((e.metaKey||e.ctrlKey)&&"v"===e.key){const t=sessionStorage.getItem("canvas_clipboard");if(t){e.preventDefault();const r=JSON.parse(t),n={...r,id:pr(),x:r.x+40,y:r.y+40,z:1};v(e=>{const t=Array.isArray(e)?e:[],r=(Math.max(0,...t.map(e=>e.z||0))||0)+1;return[...t,{...n,z:r}]}),N(n.id),p({title:"Element pasted"})}return}if(t&&["ArrowUp","ArrowDown","ArrowLeft","ArrowRight"].includes(e.ke
2y)){e.preventDefault();const r=e.shiftKey?10:1;let n=0,a=0;return"ArrowUp"===e.key&&(a=-r),"ArrowDown"===e.key&&(a=r),"ArrowLeft"===e.key&&(n=-r),"ArrowRight"===e.key&&(n=r),void Vt(j,{x:t.x+n,y:t.y+a},!0)}},t=e=>{" "===e.key&&V(!1)},r=e=>{var t,r;const n=e.target;if((null==n?void 0:n.isContentEditable)||"INPUT"===(null==n?void 0:n.tagName)||"TEXTAREA"===(null==n?void 0:n.tagName))return;if(sessionStorage.getItem("canvas_clipboard"))return;const a=null==(r=null==(t=e.clipboardData)?void 0:t.getData("text/plain"))?void 0:r.trim();a&&(e.preventDefault(),Zt(a.includes("\n")||a.length>80?"paragraph":"title",a))};return window.addEventListener("keydown",e),window.addEventListener("keyup",t),window.addEventListener("paste",r),()=>{window.removeEventListener("keydown",e),window.removeEventListener("keyup",t),window.removeEventListener("paste",r)}},[j,C,g,v,b,y,Vt,p,Zt,er]);const tr=t.useMemo(()=>function(e){return e.filter(e=>!1!==e.visible)}(g||[]),[g]);t.useEffect(()=>{const e=new Set((g||[]).map(e=>e.id));j&&!e.has(j)&&N(null),M(t=>{if(!t.size)return t;const r=new Set(Array.from(t).filter(t=>e.has(t)));return r.size===t.size?t:r})},[g,j]),t.useEffect(()=>{if(!Ot||!g)return;if(Pt.current===g&&Dt.current===We)return;const e=window.setTimeout(()=>{const e=g,t=We,r=++Ft.current;se("saving");const a=async()=>{const{error:a}=await i.from("canvases").update({elements:yr(e),name:t,updated_at:(new Date).toISOString()}).eq("id",n);if(a)return r===Ft.current&&se("error"),void be("canvas_autosave_error",{message:a.message});Pt.current=e,Dt.current=t,r===Ft.current&&se("saved")};Lt.current=Lt.current.then(a,a)},850);return()=>window.clearTimeout(e)},[g,n,Ot,We]);const ar=async(e,t={})=>{const{proxyExternal:r=!0,forceProxyRemote:n=!1}=t,a=e.querySelectorAll("img");await Promise.all(Array.from(a).map(async e=>{const t=e.src,a=/^https?:\/\//i.test(t),o=r&&(n?a:!xr(t));if(t&&o)try{if(e.src.startsWith("data:"))return;const{data:r,error:n}=await i.functions.invoke("proxy-image",{body:{imageUrl:t}});if(n)throw n;if(!r.success)throw new Error(r.error);e.src=r.data,await new Promise((t,r)=>{e.onload=()=>t(),e.onerror=()=>t()})}catch(s){}else e.complete||await new Promise(t=>{e.onload=()=>t(),e.onerror=()=>t()})}))},sr=async(e,t)=>{try{const{data:{session:r}}=await i.auth.getSession();return(null==r?void 0:r.user)?await ke(e,r.access_token,`${r.user.id}/${t}-${n}-${Date.now()}.png`,"image/png"):null}catch(r){return null}},lr=e=>{const t=document.createElement("canvas");t.width=16,t.height=16;const r=t.getContext("2d",{willReadFrequently:!0});if(!r)return!1;r.drawImage(e,0,0,t.width,t.height);const n=r.getImageData(0,0,t.width,t.height).data;let a=255,i=0;for(let o=0;o<n.length;o+=4)a=Math.min(a,n[o],n[o+1],n[o+2]),i=Math.max(i,n[o],n[o+1],n[o+2]);return i-a>12},cr=async e=>{st(!1),rt("save");const t=e?_t.find(t=>t.id===e):null;at("Preparing canvasâ¦");try{const r=await(async()=>{const e=Tt.current;if(!e)return null;const t=null==tr?void 0:tr.filter(e=>{var t,r;const n=(null==(t=e.memory)?void 0:t.image_url)||(null==(r=e.memory)?void 0:r.video_url);return Boolean(n&&!xr(n))});t&&t.length>0&&p({title:"Warning: External Images",description:`${t.length} image(s) from external sources may not export correctly.`,variant:"warning"});const r=j,n=new Set(C);N(null),M(new Set);let a=null;try{await new Promise(e=>requestAnimationFrame(()=>requestAnimationFrame(()=>e()))),a=e.cloneNode(!0),a.style.transform="none",a.style.transformOrigin="top left",a.style.position="fixed",a.style.left="-100000px",a.style.top="0",a.style.pointerEvents="none",a.style.zIndex="-1",a.style.boxShadow="none",a.setAttribute("aria-hidden","true"),document.body.appendChild(a),await ar(a,{proxyExternal:!0,forceProxyRemote:!0});const t=Math.max(a.offsetWidth,a.offsetHeight,1),r=Math.min(1,4096/t),n=await wr(),i=await n(a,{scale:r,useCORS:!0,allowTaint:!1,imageTimeout:15e3,backgroundColor:Ie||"#ffffff",logging:!1});if(((null==tr?void 0:tr.length)||0)>0&&!lr(i))throw new Error("The rendered canvas was blank. Nothing was savedâplease try again.");return await new Promise(e=>
2{i.toBlob(e,"image/png",.92)})}finally{null==a||a.remove(),N(r),M(n)}})();if(!r)throw new Error("Failed to capture canvas");at("Uploading imageâ¦");const a=await sr(r,"canvas");if(!a)throw new Error("The canvas image could not be uploaded. Please try again.");const o=We||(null==Ot?void 0:Ot.name)||"Untitled Canvas";(await i.from("canvases").update({thumbnail_url:a,name:o}).eq("id",n)).error||await x.invalidateQueries({queryKey:["canvases"]}),at(e?`Adding to ${(null==t?void 0:t.name)||"board"}â¦`:"Adding to your profileâ¦");const s=await(async({publicUrl:e,memoryTitle:t,boardId:r})=>{const{data:{session:a}}=await i.auth.getSession();if(!(null==a?void 0:a.user))throw new Error("Your session has expired. Sign in again, then retry.");const o={id:m(),type:"image",title:t,content:`Canvas Export: ${t}`,description:"Canvas created in Echo Canvas",image_url:e,user_id:a.user.id,metadata:{source:"canvas_editor",canvas_id:n||null,processed_at:(new Date).toISOString()}};let s=null;for(let n=0;n<3;n+=1){const{data:t,error:l}=await i.from("memories").upsert(o,{onConflict:"id"}).select().single();if(!l&&(null==t?void 0:t.id)){if(r){const{error:e}=await i.rpc("add_memory_to_board_safe",{p_memory_id:t.id,p_board_id:r});if(e)throw e}const{data:n,error:o}=await i.from("memories").select("*").eq("id",t.id).eq("user_id",a.user.id).single();if(o)throw o;if(!(null==n?void 0:n.id)||n.image_url!==e)throw new Error("The saved canvas could not be verified. Please try again.");return n}s=l,n<2&&await new Promise(e=>window.setTimeout(e,350*(n+1)))}throw s||new Error("The canvas could not be saved. Please try again.")})({publicUrl:a,memoryTitle:o,boardId:e});ye({memory_id:s.id,upload_source:"canvas_editor",board_id:e||null});const l=e?(null==t?void 0:t.name)||"your board":"your profile";p({title:`${o} saved to ${l}`,description:"Your complete canvas is ready as an Echo.",variant:"success",duration:8e3}),window.dispatchEvent(new CustomEvent("memory-added",{detail:{memory:s}}))}catch(r){const e=mr(r);p({title:"Save failed",description:e,variant:"error"}),be("canvas_export_fail",{mode:"save",message:e})}finally{rt(null),at("")}},dr=(e,t)=>{const r=Nr(),n=()=>p({title:"Echo added to canvas",description:`Added to ${We||(null==Ot?void 0:Ot.name)||"this canvas"}. Changes save automatically.`,variant:"success"});if(t){const r=null==g?void 0:g.find(e=>"placeholder"===e.type&&t.x>=e.x&&t.x<=e.x+e.w&&t.y>=e.y&&t.y<=e.y+e.h);if(r)return v(t=>t.map(t=>t.id===r.id?hr({...t,type:"video"===(null==e?void 0:e.type)?"video":"image",memory:e}):t)),void n()}let a,i;t?(a=t.x-100,i=t.y-150):(a=r.w/2-100,i=r.h/2-150),a=Math.max(0,Math.min(a,r.w-200)),i=Math.max(0,Math.min(i,r.h-300));const o=hr({id:pr(),memory:e,x:a,y:i,w:200,h:300,rotation:0,z:1,type:"video"===(null==e?void 0:e.type)?"video":"image"});v(e=>{const t=Array.isArray(e)?e:[],r=(Math.max(0,...t.map(e=>e.z||0))||0)+1;return[...t,{...o,z:r}]}),n()},ur=t.useCallback(async e=>{var t;if(!(null==Kt?void 0:Kt.canvas_bg_remove_enabled))return void p({title:"Remove Backgroun
2d is disabled right now",variant:"warning"});const r=(g||[]).find(t=>t.id===e);if(r&&ir(r)&&(null==(t=r.memory)?void 0:t.image_url)){Rt(t=>new Set(t).add(e)),be("canvas_bg_remove_start",{canvasId:n,elementId:e});try{const{data:t,error:a}=await i.functions.invoke("remove-background",{body:{imageUrl:r.memory.image_url,canvasId:n,elementId:e}});if(a)throw a;if(!(null==t?void 0:t.success)||!(null==t?void 0:t.imageUrl))throw new Error((null==t?void 0:t.error)||"Background removal failed");Vt(e,{memory:{...r.memory,image_url:t.imageUrl}},!0),be("canvas_bg_remove_success",{canvasId:n,elementId:e,processingMs:t.processingMs}),p({title:"Background removed"})}catch(a){let t="",r="";const i=null==a?void 0:a.context;if(i&&"function"==typeof i.text)try{const e=await i.text();if(e)try{const n=JSON.parse(e);t=n.error||e,r=n.code||""}catch{t=e}}catch{}const o=t||String(a);be("canvas_bg_remove_fail",{canvasId:n,elementId:e,message:o,code:r||void 0}),p({title:"Background removal failed",description:o.length>180?`${o.slice(0,177)}...`:o,variant:"error"})}finally{Rt(t=>{const r=new Set(t);return r.delete(e),r})}}else p({title:"Select an image layer first",variant:"warning"})},[null==Kt?void 0:Kt.canvas_bg_remove_enabled,g,Vt,n,p]),jr=e=>{e.preventDefault(),e.stopPropagation();const t=e.dataTransfer.getData("echo");if(!t)return;const r=JSON.parse(t),n=e.currentTarget.getBoundingClientRect(),a=Q.current,i=G.current,o=(e.clientX-n.left)/i-a.x/i,s=(e.clientY-n.top)/i-a.y/i;dr(r,{x:o,y:s})},Nr=()=>Se((null==Ot?void 0:Ot.aspect_ratio)||"9:16"),kr=Nr(),Sr=t.useMemo(()=>(g||[]).find(e=>e.id===j)||null,[g,j]),Cr=t.useMemo(()=>(g||[]).find(e=>e.id===_)||null,[g,_]),Mr=Cr&&ir(Cr)&&(null==(e=Cr.memory)?void 0:e.image_url)||null,_r=(null==P?void 0:P.w)&&(null==P?void 0:P.h)?`${P.w} / ${P.h}`:Cr?`${Cr.w} / ${Cr.h}`:"1 / 1";t.useEffect(()=>{_&&_!==j&&E(null)},[_,j]),t.useEffect(()=>{L(null)},[Mr]);const Er=t.useCallback(e=>({...vr,contentScale:1,contentX:0,contentY:0,contentRotation:e.contentRotation||0,contentFlipX:!!e.contentFlipX,contentFlipY:!!e.contentFlipY,aspect:"free"}),[]),Rr=t.useCallback((e,t)=>{var r;return"free"===e?null:"original"===e?(null==P?void 0:P.w)&&(null==P?void 0:P.h)?P.w/P.h:t&&t.h>0?t.w/t.h:1:(null==(r=gr.find(t=>t.key===e))?void 0:r.ratio)||null},[P]),zr=t.useCallback((e,t,r,n,a)=>{const i={...e},o=Rr(t,a),s=72/Math.max(r,72),l=72/Math.max(n,72);if(o&&r>0&&n>0){const e=o*(n/r),t=i.x+i.w/2,a=i.y+i.h/2;let c=br(i.w,s,1),d=c/e;d<l&&(d=l,c=d*e),c>1&&(c=1,d=c/e),d>1&&(d=1,c=d*e),i.w=br(c,s,1),i.h=br(d,l,1),i.x=t-i.w/2,i.y=a-i.h/2}else i.w=br(i.w,s,1),i.h=br(i.h,l,1);i.x=br(i.x,0,1-i.w),i.y=br(i.y,0,1-i.h);const c=i.x+i.w/2,d=i.y+i.h/2;return Math.abs(c-.5)<.012&&(i.x=.5-i.w/2),Math.abs(d-.5)<.012&&(i.y=.5-i.h/2),i.x=br(i.x,0,1-i.w),i.y=br(i.y,0,1-i.h),i},[Rr]),Tr=t.useCallback(e=>{A(t=>{var r;const n=Er(e),a=null==(r=Y.current)?void 0:r.getBoundingClientRect();return{...n,frame:zr(n.frame,n.aspect,(null==a?void 0:a.width)||640,(null==a?void 0:a.height)||640,e)}})},[zr,Er]);t.useEffect(()=>{Cr&&A(Er(Cr))},[Er,Cr]);const Ar=t.useCallback(()=>{j&&Sr&&ir(Sr)&&(A(Er(Sr)),E(j))},[Er,Sr,j]),Pr=t.useCallback(e=>{const t=(g||[]).find(t=>t.id===e);t&&ir(t)&&(N(e),M(new Set),A(Er(t)),E(e))},[g,Er]),Dr=t.useCallback(()=>{E(null),H.current=null,B(!1)},[]),Lr=t.useCallback(()=>{var e;if(!_||!Cr)return;const t=R.frame,r=null==(e=Y.current)?void 0:e.getBoundingClientRect(),n=(null==r?void 0:r.width)||Cr.w,a=(null==r?void 0:r.height)||Cr.h,i=(null==P?void 0:P.w)&&(null==P?void 0:P.h)?P.w/P.h:n/Math.max(a,1),o=n/Math.max(a,1)>i?{w:a*i,h:a,x:(n-a*i)/2,y:0}:{w:n,h:n/i,x:0,y:(a-n/i)/2},s={x:t.x*n,y:t.y*a,w:t.w*n,h:t.h*a},l=br(s.x,o.x,o.x+o.w),c=br(s.y,o.y,o.y+o.h),d=br(s.x+s.w,o.x,o.x+o.w),h=br(s.y+s.h,o.y,o.y+o.h),u={x:br((l-o.x)/o.w,0,1),y:br((c-o.y)/o.h,0,1),w:br((d-l)/o.w,.01,1),h:br((h-c)/o.h,.01,1)},m=i*(u.w/Math.max(u.h,.01)),x=(d-l)/Math.max(n,1),p=Math.max(50,Cr.w*x),f=Math.max(50,p/Math.max(m,.01));Vt(_,{x:Cr.x+(Cr.w-p)/2,y:Cr.y+(Cr.h-f)/2,w:p,h:f,aspectLocked:!0,contentScale:1,contentX:0,contentY:0,contentRotation:R.contentRotation,contentFlipX:R.contentFlipX,contentFlipY:R.contentFlipY,contentCropX:u.x,contentCropY:u.y,contentCropW:u.w,contentCropH:u.h},!0),Dr()},[Dr,R,P,Vt,Cr,_]),Fr=t.useCallback(()=>{Cr&&Tr(Cr)},[Tr,Cr]),Br=t.useCallback((e,t,r)=>{var n;const a=null==(n=Y.current)?void 0:n.getBoundingClientRect();a&&(e.preventDefault(),e.stopPropagation(),e.currentTarget.setPointerCapture(e.pointerId),H.current={mode:t,handle:r,startX:e.clientX,startY:e.clientY,startDraft:R,stageW:a.width,stageH:a.height},B(!0))},[R]),Yr=t.useCallback(e=>{e.target.closest('[data-crop-frame="true"]')||Br(e,"image")},[Br]),Hr=t.useCallback(e=>{const t=H.current;if(!t)return;e.preventDefault();const r=e.clientX-t.startX,n=e.clientY-t.startY,a=t.startDraft;A(e=>({...e,..."image"===t.mode?{contentX:a.contentX+r/Math.max(e.contentScale,.1),contentY:a.contentY+n/Math.max(e.contentScale,.1)}:(()=>{const i=r/t.stageW,o=n/t.stageH,s={...a.frame};if("move-frame"===t.mode)s.x=a.frame.x+i,s.y=a.frame.y+o;else{const e=t.handle||"";e.includes("w")&&(s.x=a.frame.x+i,s.w=a.frame.w-i),e.includes("e")&&(s.w=a.frame.w+i),e.includes("n")&&(s.y=a.frame.y+o,s.h=a.frame.h-o),e.includes("s")&&(s.h=a.frame.h+o)}return{frame:zr(s,e.aspect,t.stageW,t.stageH,Cr)}})()}))},[zr,Cr]),Ir=t.useCallback(()=>{H.current=null,B(!1)},[]),Xr=t.useCallback(e=>{var t;const r=null==(t=Y.current)?void 0:t.getBoundingClientRect();A(t=>
2({...t,aspect:e,frame:zr(t.frame,e,(null==r?void 0:r.width)||640,(null==r?void 0:r.height)||640,Cr)}))},[zr,Cr]),Wr=(e,t)=>{const r=e.clientX-t.clientX,n=e.clientY-t.clientY;return Math.sqrt(r*r+n*n)};return qt?r.jsx("div",{className:"flex h-screen items-center justify-center bg-neutral-950 text-white",children:r.jsx(X,{className:"animate-spin"})}):r.jsxs("div",{className:"relative flex h-screen overflow-hidden bg-neutral-950 text-white",children:[r.jsx("div",{className:"z-20 hidden h-full w-80 border-r border-neutral-800 bg-neutral-950/95 backdrop-blur-xl md:block",children:r.jsx(rr,{onAdd:dr,elements:g,selectedId:j,onSelect:e=>{N(e),M(new Set)},onChange:(e,t)=>Vt(e,t,!0),onRemove:e=>v(t=>(t||[]).filter(t=>t.id!==e)),setElements:v,onAddText:Zt})}),r.jsxs("div",{className:"flex-1 relative bg-neutral-900 overflow-hidden flex flex-col",children:[r.jsxs("div",{className:"absolute left-0 right-0 top-0 z-[100] flex h-[calc(3.5rem+max(env(safe-area-inset-top),var(--native-safe-top,0px)))] items-center gap-2 border-b border-white/10 bg-black/75 px-0 pt-[max(env(safe-area-inset-top),var(--native-safe-top,0px))] shadow-2xl backdrop-blur-xl transition-all md:h-14 md:pt-0",children:[r.jsx(l,{variant:"ghost",size:"icon",onClick:async()=>{if(!le){ce(!0),se("saving");try{const e=await(async()=>{const e=Tt.current;if(!e)return null;const t=j,r=new Set(C);try{N(null),M(new Set),await new Promise(e=>requestAnimationFrame(()=>requestAnimationFrame(()=>e())));const t=e.cloneNode(!0);return t.style.transform="none",t.style.position="fixed",t.style.left="-100000px",t.style.top="0",t.style.pointerEvents="none",t.style.zIndex="-1",t.setAttribute("aria-hidden","true"),document.body.appendChild(t),t}catch(n){return null}finally{N(t),M(r)}})(),t=(new Date).toISOString();Pt.current=g,Dt.current=We,se("saved"),x.setQueryData(["canvases"],e=>null==e?void 0:e.map(e=>e.id===n?{...e,elements:g,name:We,updated_at:t}:e)),a("/canvas"),(async()=>{try{const r=Lt.current.then(()=>i.from("canvases").update({elements:yr(g),name:We,updated_at:t}).eq("id",n)),a=e&&g.length>0?(async e=>{try{await ar(e,{proxyExternal:!0,forceProxyRemote:!0});const t=Math.max(e.offsetWidth,e.offsetHeight,1),r=Math.min(.35,512/t),n=await wr(),a=await n(e,{scale:r,useCORS:!0,allowTaint:!1,imageTimeout:15e3,backgroundColor:Ie||"#ffffff",logging:!1});return lr(a)?await new Promise(e=>
2{a.toBlob(e,"image/png",.82)}):null}catch(t){return null}finally{e.remove()}})(e):Promise.resolve(null);e&&0===g.length&&e.remove();const[o,s]=await Promise.all([r,a]);if(o.error)return p({title:"Canvas save needs attention",description:mr(o.error),variant:"error"}),void(await x.invalidateQueries({queryKey:["canvases"]}));if(!s)return void(await x.invalidateQueries({queryKey:["canvases"]}));const l=await sr(s,"thumb");if(!l)return void(await x.invalidateQueries({queryKey:["canvases"]}));if((await i.from("canvases").update({thumbnail_url:l}).eq("id",n)).error)return;await x.invalidateQueries({queryKey:["canvases"]})}catch(r){null==e||e.remove(),p({title:"Canvas save needs attention",description:mr(r),variant:"error"}),await x.invalidateQueries({queryKey:["canvases"]})}})()}catch(e){se("error"),ce(!1),p({title:"Could not save canvas",description:mr(e),variant:"error"})}}},disabled:le,title:"Back to Gallery",className:"h-full w-14 shrink-0 rounded-none border-r border-white/10 text-white hover:bg-white/15",children:le?r.jsx(X,{className:"h-5 w-5 animate-spin"}):r.jsx(De,{className:"h-5 w-5"})}),r.jsx("div",{className:"flex min-w-0 flex-1 items-center gap-2 px-2",children:r.jsx("input",{value:We,onChange:e=>$e(e.target.value),onFocus:()=>Qe(!0),onBlur:Jt,onKeyDown:e=>"Enter"===e.key&&Jt(),className:"w-full min-w-[72px] max-w-none truncate border-none bg-transparent px-1 text-xs font-bold text-white outline-none transition-all md:text-sm",placeholder:"Untitled"})}),r.jsx("div",{className:"h-6 w-px bg-white/20"}),r.jsxs("div",{className:"flex shrink-0 items-center gap-1 px-2 md:gap-2 md:px-3",children:[r.jsxs("button",{type:"button",onClick:()=>{const e=Nr();ht((null==Ot?void 0:Ot.aspect_ratio)||"16:9"),mt("px"),pt(e.w),wt(e.h),bt.current=e.w/e.h,vt(!0),jt("rearrange"),kt(!0),ct(!0)},className:"flex items-center gap-1 rounded-lg px-1.5 py-1.5 text-[9px] font-semibold uppercase tracking-wide text-white/55 transition-colors hover:bg-white/10 hover:text-white md:gap-1.5 md:px-2 md:text-[10px]",title:"Resize canvas or create another format",children:[r.jsx(Le,{className:"h-3.5 w-3.5"}),Ce(null==Ot?void 0:Ot.aspect_ratio)]}),r.jsx(l,{variant:"ghost",size:"icon",className:"h-10 w-10 rounded-none text-white hover:bg-white/15 md:h-9 md:w-9",onClick:()=>ie(e=>Math.max(.1,e-.1)),children:r.jsx(Fe,{className:"w-4 h-4"})}),r.jsxs("span",{className:"font-mono text-[10px] w-8 text-center text-white/90",children:[Math.round(100*ae),"%"]}),r.jsx(l,{variant:"ghost",size:"icon",className:"h-10 w-10 rounded-none text-white hover:bg-white/15 md:h-9 md:w-9",onClick:()=>ie(e=>Math.min(2,e+.1)),children:r.jsx(ue,{className:"w-4 h-4"})}),r.jsx("div",{className:"mx-0.5 h-6 w-px bg-white/20"}),r.jsx("div",{className:"relative flex items-center justify-center",children:r.jsx("input",{type:"color",value:Ie,onChange:e=>Xe(e.target.value),className:"h-9 w-9 cursor-pointer appearance-none rounded-none border border-white/20 bg-transparent md:h-8 md:w-8 [&::-webkit-color-swatch-wrapper]:p-0 [&::-webkit-color-swatch]:rounded-none [&::-webkit-color-swatch]:border-0",title:"Canvas Background Color"})})]})]}),r.jsx("div",{className:"absolute top-20 right-6 z-[100] hidden md:block",children:r.jsxs("div",{className:"px-3 py-1 bg-black/60 backdrop-blur-md border border-white/10 rounded-full flex items-center gap-2",children:[r.jsx("div",{className:"w-2 h-2 rounded-full bg-green-500 animate-pulse"}),r.jsxs("span",{className:"text-[10px] font-bold text-white/80 uppercase tracking-widest leading-none",children:[Me(null==Ot?void 0:Ot.aspect_ratio)," ⢠",kr.w,"x",kr.h]})]})}),r.jsx("div",{ref:At,className:u("flex-1 flex items-center justify-center p-0 md:p-8 pb-32 md:pb-24 overflow-auto","cursor-grab active:cursor-grabbing"),style:{touchAction:(null==Kt?void 0:Kt.canvas_mobile_gestures_v2)?"none":"auto"},onDragOver:e=>e.preventDefault(),onDrop:jr,onTouchStart:e=>{if(!(null==Kt?void 0:Kt.canvas_mobile_gestures_v2))return;if(2!==e.touches.length)return;const[t,r]=[e.touches[0],e.touches[1]],n=Wr(t,r),a=(t.clientX+r.clientX)/2,i=(t.clientY+r.clientY)/2;Bt.current={initialDistance:n,initialZoom:G.current,initialOffsetX:Q.current.x,initialOffsetY:Q.current.y,initialCenterX:a,initialCenterY:i,lastMidX:a,lastMidY:i}},onTouchMove:e=>{if(!(null==Kt?void 0:Kt.canvas_mobile_gestures_v2))return;if(2!==e.touches.length||!Bt.current)return;e.preventDefault();const[t,r]=[e.touches[0],e.touches[1]],n=Bt.current,a=Wr(t,r),i=(t.clientX+r.clientX)/2,o=(t.clientY+r.clientY)/2,s=a/Math.max(n.initialDistance,1),l=Math.min(2.5,Math.max(.1,n.initialZoom*s)),c=i-n.initialCenterX,d=o-n.initialCenterY;G.current=l,Q.current={x:n.initialOffsetX+c,y:n.initialOffsetY+d},$t(),(Math.abs(i-n.lastMidX)>8||Math.abs(o-n.lastMidY)>8)&&(be("canvas_gesture_pinch",{zoom:l}),n.lastMidX=i,n.lastMidY=o)},onTouchEnd:()=>{(null==Kt?void 0:Kt.canvas_mobile_gestures_v2)&&(ie(G.current),J(Q.current),Bt.current=null)},onWheel:e=>{(e.ctrlKey||e.metaKey)&&(e.preventDefault(),ie(t=>Math.min(2.5,Math.max(.1,t-.001*e.deltaY))))},onPointerDown:e=>{var t;const r=e.target,n=r===At.current||r===Tt.current;(K||n)&&(n&&k&&(document.activeElement instanceof HTMLElement&&document.activeElement.blur(),S(null)),e.preventDefault(),re.current=n,ne.current=!1,te.current={mouseX:e.clientX,mouseY:e.clientY,offsetX:Q.current.x,offsetY:Q.current.y},null==(t=At.current)||t.setPointerCapture(e.pointerId))},onPointerMove:e=>{if(K&&te.current){const t=e.clientX-te.current.mouseX,r=e.clientY-te.current.mouseY;Q.current={x:te.current.offsetX+t,y:te.current.offsetY+r},$t()}else if(re.current&&te.current){const t=e.clientX-te.current.mouseX,r=e.clientY-te.current.mouseY;(Math.abs(t)>3||Math.abs(r)>3)&&(ne.current=!0),Q.current={x:te.current.offsetX+t,y:te.current.offsetY+r},$t()}},onPointerUp:()=>{re.current&&!ne.current&&(S(null),N(null),M(new Set)),J(Q.current),te.current=null,re.current=!1},onPointerCancel:()=>{J(Q.current),te.current=null,re.current=!1},children:r.jsx("div",{ref:Tt,role:"region","aria-label":"Canvas workspace",className:u("relative cursor-default origin-center overflow-hidden shadow-2xl",!f&&!de&&"will-change-transform"),style:{width:`${kr.w}px`,height:`${kr.h}px`,minWidth:`${kr.w}px`,minHeight:`${kr.h}px`,aspectRatio:`${kr.w} / ${kr.h}`,transform:fr(ae,U),transformOrigin:"center center",backgroundColor:Ie,backgroundImage:void 0,backgroundSize:"50px 50px"},onClick:e=>{if(ne.current)return e.preventDefault(),e.stopPropagation(),void(ne.current=!1);q.current||(S(null),N(null),M(new Set)),q.current=!1},onDoubleClick:e=>{if(e.target!==e.currentTarget)return;e.preventDefault();const t=e.currentTarget.getBoundingClientRect();Zt("title",void 0,{x:(e.clientX-t.left)/Math.max(t.width/kr.w,.001),y:(e.clientY-t.top)/Math.max(t.height/kr.h,.001)})},onDragOver:e=>e.preventDefault(),onDrop:jr,children:null==tr?void 0:tr.map(e=>r.jsx(it,{element:e,isSelected:j===e.id||C.has(e.id),onSelect:t=>{k&&k!==e.id&&(document.activeElement instanceof HTMLElement&&document.activeElement.blur(),S(null)),t&&(t.metaKey||t.ctrlKey||t.shiftKey)?(N(null),M(t=>{const r=new Set(t);return r.has(e.id)?r.delete(e.id):r.add(e.id),r})):(N(e.id),M(new Set))}
2,onChange:Vt,scale:ae,isBackgroundRemoving:Et.has(e.id),onCropRequest:Pr,textV2Enabled:(null==Kt?void 0:Kt.canvas_text_v2)??!0,isTextEditing:k===e.id&&(j===e.id||C.has(e.id)),onTextEditingChange:t=>S(t?e.id:null),onDuplicate:er,onRemove:e=>{v(t=>(t||[]).filter(t=>t.id!==e)),k===e&&S(null),j===e&&N(null)}},e.id))})})]}),r.jsxs("div",{className:"fixed inset-x-0 bottom-0 z-50 flex items-center justify-center gap-1 overflow-x-auto border-t border-white/10 bg-black/85 px-2 py-2 pb-[max(0.5rem,env(safe-area-inset-bottom))] shadow-2xl backdrop-blur-xl no-scrollbar md:gap-2 md:px-4",children:[r.jsxs(me,{open:Yt,onOpenChange:Ht,children:[!j&&0===C.size&&r.jsx(xe,{asChild:!0,children:r.jsx(l,{variant:"ghost",size:"icon",className:"w-11 h-11 md:w-10 md:h-10 rounded-full hover:bg-white/10 text-white",title:"Add Memory",onClick:()=>Xt("library"),children:r.jsx($,{className:"w-4 h-4 md:w-5 md:h-5"})})}),r.jsx(pe,{side:"bottom",className:"h-[76vh] rounded-t-[2rem] border-t border-neutral-800 bg-neutral-950/95 p-0 text-white backdrop-blur-xl pb-[max(0.5rem,env(safe-area-inset-bottom))]",children:r.jsx(rr,{onAdd:e=>{dr(e),Ht(!1)},elements:g,selectedId:j,onSelect:e=>{N(e),M(new Set)},onChange:(e,t)=>
2Vt(e,t,!0),onRemove:e=>v(t=>(t||[]).filter(t=>t.id!==e)),setElements:v,onAddText:e=>{Zt(e),Ht(!1)},defaultTab:It})})]}),!j&&0===C.size&&r.jsxs(r.Fragment,{children:[r.jsx(l,{variant:"ghost",size:"icon",className:"md:hidden h-11 w-11 rounded-full text-white hover:bg-white/10",title:"Add text",onClick:()=>{Xt("text"),Ht(!0)},children:r.jsx(w,{className:"h-4 w-4"})}),r.jsx(l,{variant:"ghost",size:"icon",className:"md:hidden w-11 h-11 rounded-full hover:bg-white/10 text-white",title:"Layers",onClick:()=>{Xt("layers"),Ht(!0)},children:r.jsx(Ue,{className:"w-4 h-4"})})]}),C.size>=2&&r.jsx(nr,{selectedIds:C,elements:g||[],onBatchChange:Ut}),j&&0===C.size&&"text"!==(null==Sr?void 0:Sr.type)&&r.jsxs(r.Fragment,{children:[r.jsxs("div",{className:"flex items-center gap-1.5 flex-shrink-0",children:[r.jsxs("div",{className:"flex items-center gap-2 hidden md:flex",children:[r.jsx("span",{className:"text-[9px] text-white/40 font-medium uppercase tracking-wider",children:"Opacity"}),r.jsx("div",{className:"w-20",children:r.jsx(d,{value:[Math.round(100*((null==Sr?void 0:Sr.opacity)??1))],min:10,max:100,step:5,onValueChange:([e])=>Vt(j,{opacity:e/100},!0),className:"[&_.bg-primary]:bg-white [&_.bg-muted]:bg-white/20"})}),r.jsxs("span",{className:"text-[9px] text-white/40 w-7 text-right",children:[Math.round(100*((null==Sr?void 0:Sr.opacity)??1)),"%"]})]}),r.jsx(l,{variant:"ghost",size:"icon",className:"w-11 h-11 md:w-8 md:h-8 rounded-full hover:bg-white/10 text-white/70 hover:text-white",title:"Flip",onClick:()=>{Sr&&Vt(j,{flipX:!Sr.flipX},!0)},children:r.jsx(Ke,{className:"w-4 h-4"})}),Sr&&ir(Sr)&&r.jsx(l,{variant:"ghost",size:"icon",className:"w-11 h-11 md:w-8 md:h-8 rounded-full hover:bg-white/10 text-white/70 hover:text-white",title:"Crop",onClick:Ar,children:r.jsx(Be,{className:"w-4 h-4"})}),r.jsx(l,{variant:"ghost",size:"icon",className:"w-11 h-11 md:w-8 md:h-8 rounded-full text-destructive hover:bg-destructive hover:text-white",title:"Delete",onClick:()=>{v(e=>(e||[]).filter(e=>e.id!==j)),E(null),N(null),M(new Set)},children:r.jsx(D,{className:"w-4 h-4"})})]}),r.jsx("div",{className:"hidden h-6 w-px flex-shrink-0 bg-white/20 sm:block"}),r.jsxs("div",{className:"hidden md:flex items-center gap-2 flex-shrink-0",children:[r.jsx("span",{className:"text-[9px] text-white/40 font-medium uppercase tracking-wider",children:"Rotate"}),r.jsx("div",{className:"w-24",children:r.jsx(d,{value:[(null==Sr?void 0:Sr.rotation)??0],min:-180,max:180,step:1,onValueChange:([e])=>j&&Vt(j,{rotation:e},!0),className:"[&_.bg-primary]:bg-white [&_.bg-muted]:bg-white/20"})}),r.jsxs("span",{className:"text-[9px] text-white/40 w-10 text-right",children:[Math.round((null==Sr?void 0:Sr.rotation)??0),"°"]})]}),(null==Kt?void 0:Kt.canvas_bg_remove_enabled)&&Sr&&ir(Sr)&&r.jsxs(l,{variant:"ghost",size:"sm",className:"h-10 md:h-8 min-w-11 rounded-full hover:bg-white/10 text-white/90 px-3",onClick:()=>j&&ur(j),disabled:!!j&&Et.has(j),title:"Remove background",children:[j&&Et.has(j)?r.jsx(X,{className:"w-4 h-4 animate-spin"}):r.jsx(qe,{className:"w-4 h-4 md:mr-1"}),r.jsx("span",{className:"hidden md:inline text-xs",children:"Remove Backgroun
2d"})]})]}),!j&&0===C.size&&r.jsxs(r.Fragment,{children:[r.jsx("div",{className:"hidden h-6 w-px flex-shrink-0 bg-white/20 sm:block"}),r.jsxs("div",{className:"flex items-center gap-2 px-2 flex-shrink-0",title:"saving"===oe?"Saving...":"error"===oe?"Error Saving":"All changes saved",children:["saving"===oe?r.jsx(X,{className:"w-3 h-3 md:w-4 md:h-4 animate-spin text-muted-foreground"}):"error"===oe?r.jsx("div",{className:"w-2 h-2 rounded-full bg-red-500 shadow-[0_0_8px_rgba(239,68,68,0.6)]"}):r.jsx("div",{className:"w-2 h-2 rounded-full bg-green-500 shadow-[0_0_8px_rgba(34,197,94,0.4)]"}),r.jsx("span",{className:"hidden md:inline text-[10px] text-white/50 font-medium uppercase tracking-wider",children:"saving"===oe?"Saving":"error"===oe?"Error":"Saved"})]})]}),r.jsx("div",{className:"hidden h-6 w-px flex-shrink-0 bg-white/20 sm:block"}),r.jsxs(l,{variant:"default",size:"sm",onClick:()=>st(!0),disabled:!!tt,className:"rounded-full bg-primary px-3 font-bold text-white hover:bg-primary/90 md:px-4 flex-shrink-0",children:[r.jsx(Ye,{className:"w-4 h-4 mr-0 md:mr-2"}),r.jsx("span",{className:"hidden md:inline",children:"Save canvas"}),r.jsx("span",{className:"md:hidden",children:"Save"})]})]}),tt&&r.jsx("div",{className:"fixed inset-0 z-[100] flex items-center justify-center bg-black/70 px-5 backdrop-blur-md",children:r.jsxs("div",{className:"w-full max-w-sm overflow-hidden rounded-3xl border border-white/10 bg-[#111111]/95 shadow-[0_28px_90px_rgba(0,0,0,0.55)]",role:"status","aria-live":"polite",children:[r.jsxs("div",{className:"flex flex-col items-center px-8 pb-7 pt-8 text-center",children:[r.jsx("div",{className:"mb-5 flex h-14 w-14 items-center justify-center rounded-2xl border border-primary/25 bg-primary/10 shadow-[0_0_32px_rgba(225,29,72,0.18)]",children:r.jsx(X,{className:"h-7 w-7 animate-spin text-primary"})}),r.jsx("div",{className:"text-lg font-semibold tracking-tight text-white",children:nt||("download"===tt?"Preparing downloadâ¦":"Preparing canvasâ¦")}),r.jsx("div",{className:"mt-2 text-sm text-white/45",children:"This should only take a moment."})]}),r.jsx("div",{className:"h-1 w-full overflow-hidden bg-white/5",children:r.jsx("div",{className:"h-full w-2/3 animate-pulse rounded-r-full bg-gradient-to-r from-primary/50 via-primary to-fuchsia-500"})})]})}),r.jsx(fe,{open:!!_&&!!Mr,onOpenChange:e=>!e&&Dr(),children:r.jsxs(we,{className:"flex h-[min(92vh,880px)] w-[min(96vw,1040px)] max-w-none flex-col overflow-hidden border-white/10 bg-[#090909]/95 p-0 text-white shadow-2xl",children:[r.jsx(ge,{className:"border-b border-white/10 px-4 py-3 sm:px-5",children:r.jsxs(ve,{className:"flex items-center gap-2 text-base font-semibold",children:[r.jsx(Be,{className:"h-5 w-5"}),"Crop image"]})}),r.jsxs("div",{className:"flex min-h-0 flex-1 flex-col px-3 pb-3 sm:px-5 sm:pb-5",children:[r.jsxs("div",{ref:Y,className:"relative mx-auto mt-4 w-full max-w-[min(820px,100%)] flex-1 touch-none overflow-hidden rounded-[1.5rem] border border-white/10 bg-black shadow-inner",style:{aspectRatio:_r,maxHeight:"min(52vh, 560px)"},onPointerDown:Yr,onPointerMove:Hr,onPointerUp:Ir,onPointerCancel:Ir,onLostPointerCapture:Ir,children:[Mr&&r.jsx("img",{src:Mr,alt:"",draggable:!1,className:"absolute inset-0 h-full w-full cursor-grab select-none object-contain active:cursor-grabbing",onLoad:e=>{const t=e.currentTarget;t.naturalWidth>0&&t.naturalHeight>0&&L({w:t.naturalWidth,h:t.naturalHeight})},style:{transform:`scale(${R.contentScale}) translate(${R.contentX}px, ${R.contentY}px) rotate(${R.contentRotation}deg) scaleX(${R.contentFlipX?-1:1}) scaleY(${R.contentFlipY?-1:1})`,transformOrigin:"center center"}}),r.jsx("div",{className:"pointer-events-none absolute bg-black/55",style:{left:0,top:0,width:"100%",height:100*R.frame.y+"%"}}),r.jsx("div",{className:"pointer-events-none absolute bg-black/55",style:{left:0,top:100*(R.frame.y+R.frame.h)+"%",width:"100%",bottom:0}}),r.jsx("div",{className:"pointer-events-none absolute bg-black/55",style:{left:0,top:100*R.frame.y+"%",width:100*R.frame.x+"%",height:100*R.frame.h+"%"}}),r.jsx("div",{className:"pointer-events-none absolute bg-black/55",style:{left:100*(R.frame.x+R.frame.w)+"%",top:100*R.frame.y+"%",right:0,height:100*R.frame.h+"%"}}),r.jsxs("div",{"data-crop-frame":"true",className:"absolute cursor-move border-2 border-white shadow-[0_0_0_1px_rgba(0,0,0,0.45),0_12px_36px_rgba(0,0,0,0.35)]",style:{left:100*R.frame.x+"%",top:100*R.frame.y+"%",width:100*R.frame.w+"%",height:100*R.frame.h+"%"},onPointerDown:e=>Br(e,"move-frame"),children:[r.jsxs("div",{className:u("pointer-events-none absolute inset-0 transition-opacity",F?"opacity-100":"opacity-55"),children:[r.jsx("div",{className:"absolute inset-y-0 left-1/3 border-l border-white/45"}),r.jsx("div",{className:"absolute inset-y-0 left-2/3 border-l border-white/45"}),r.jsx("div",{className:"absolute inset-x-0 top-1/3 border-t border-white/45"}),r.jsx("div",{className:"absolute inset-x-0 top-2/3 border-t border-white/45"})]}),[["nw","-left-3 -top-3 cursor-nw-resize"],["n","left-1/2 -top-3 -translate-x-1/2 cursor-n-resize"],["ne","-right-3 -top-3 cursor-ne-resize"],["e","-right-3 top-1/2 -translate-y-1/2 cursor-e-resize"],["se","-bottom-3 -right-3 cursor-se-resize"],["s","left-1/2 -bottom-3 -translate-x-1/2 cursor-s-resize"],["sw","-bottom-3 -left-3 cursor-sw-resize"],["w","-left-3 top-1/2 -translate-y-1/2 cursor-w-resize"]].map(([e,t])=>r.jsx("button",{type:"button","aria-label":`Resize crop ${e}`,className:u("absolute h-7 w-7 rounded-full border-2 border-black bg-white shadow-lg transition-transform hover:scale-110",t),onPointerDown:t=>Br(t,"resize-frame",e)},e))]})]}),r.jsxs("div",{className:"mt-4 shrink-0 space-y-3 rounded-2xl bg-black/35 p-3",children:[r.jsx("div",{className:"flex gap-2 overflow-x-auto pb-1 no-scrollbar",children:gr.map(e=>r.jsx("button",{type:"button",className:u("h-9 flex-shrink-0 rounded-full border px-3 text-xs font-semibold transition-colors",R.aspect===e.key?"border-white bg-white text-black":"border-white/10 bg-white/[0.06] text-white/70 hover:bg-white/[0.1] hover:text-white"),onClick:()=>Xr(e.key),children:e.label},e.key))}),r.jsxs("div",{className:"flex items-center gap-3",children:[r.jsx("span",{className:"w-24 shrink-0 text-[10px] font-semibold uppercase tracking-wide text-white/50 sm:w-20",children:"Zoom"}),r.jsx(d,{value:[R.contentScale],min:1,max:5,step:.05,onValueChange:([e])=>A(t=>({...t,contentScale:e})),className:"flex-1 [&_.bg-primary]:bg-white [&_.bg-muted]:bg-white/20"}),r.jsxs("span",{className:"w-12 text-right text-xs tabular-nums text-white/50",children:[Math.round(100*R.contentScale),"%"]})]}),r.jsxs("div",{className:"flex items-center gap-3",children:[r.jsx("span",{className:"w-24 shrink-0 text-[10px] font-semibold uppercase tracking-wide text-white/50 sm:w-20",children:"Straighten"}),r.jsx(d,{value:[R.contentRotation],min:-25,max:25,step:.5,onValueChange:([e])=>A(t=>({...t,contentRotation:e})),className:"flex-1 [&_.bg-primary]:bg-white [&_.bg-muted]:bg-white/20"}),r.jsxs("span",{className:"w-12 text-right text-xs tabular-nums text-white/50",children:[Math.round(R.contentRotation),"°"]})]}),r.jsxs("div",{className:"flex flex-col-reverse gap-2 sm:flex-row sm:items-center sm:justify-between",children:[r.jsxs("div",{className:"flex gap-2",children:[r.jsx(l,{type:"button",variant:"ghost",className:"h-10 rounded-full text-white/70 hover:bg-white/10 hover:text-white",onClick:()=>A(e=>({...e,contentRotation:e.contentRotation+90})),title:"Rotate 90 degrees",children:r.jsx(W,{className:"h-4 w-4"})}),r.jsx(l,{type:"button",variant:"ghost",className:u("h-10 rounded-full text-white/70 hover:bg-white/10 hover:text-white",R.contentFlipX&&"bg-white/15 text-white"),onClick:()=>A(e=>({...e,contentFlipX:!e.contentFlipX})),title:"Flip horizontal",children:r.jsx(Ke,{className:"h-4 w-4"})}),r.jsx(l,{type:"button",variant:"ghost",className:u("h-10 rounded-full text-white/70 hover:bg-white/10 hover:text-white",R.contentFlipY&&"bg-white/15 text-white"),onClick:()=>A(e=>({...e,contentFlipY:!e.contentFlipY})),title:"Flip vertical",children:r.jsx(Ve,{className:"h-4 w-4"})})]}),r.jsx(l,{type:"button",variant:"ghost",className:"rounded-full text-white/70 hover:bg-white/10 hover:text-white",onClick:Fr,children:"Reset"}),r.jsxs("div",{className:"flex gap-2",children:[r.jsx(l,{type:"button",variant:"ghost",className:"flex-1 rounded-full text-white/70 hover:bg-white/10 hover:text-white sm:flex-none",onClick:Dr,children:"Cancel"}),r.jsx(l,{type:"button",className:"flex-1 rounded-full bg-white px-5 font-semibold text-black hover:bg-white/90 sm:flex-none",onClick:Lr,children:"Apply crop"})]})]})]})]})]})}),r.jsx(fe,{open:lt,onOpenChange:e=>!St&&ct(e),children:r.jsxs(we,{className:"grid h-[92vh] max-h-[780px] overflow-hidden border-white/10 bg-[#111111]/98 p-0 text-white shadow-2xl sm:max-w-3xl",style:{display:"grid",gridTemplateRows:"auto minmax(0, 1fr) auto"},children:[r.jsx(ge,{children:r.jsxs("div",{className:"border-b border-white/10 px-6 pb-5 pt-6",children:[r.jsx(ve,{className:"text-xl",children:"Resize c
2anvas"}),r.jsxs("p",{className:"mt-1.5 text-sm text-white/50",children:["Current: ",Me(null==Ot?void 0:Ot.aspect_ratio)," · ",kr.w," à ",kr.h,"px"]})]})}),r.jsxs("div",{className:"min-h-0 space-y-6 overflow-y-auto px-6 pb-6",children:[r.jsxs("section",{className:"space-y-3",children:[r.jsxs("div",{className:"flex items-center justify-between",children:[r.jsx("h3",{className:"text-sm font-semibold",children:"Preset formats"}),r.jsx("span",{className:"text-xs text-white/40",children:"Choose a starting size, then fine-tune it"})]}),r.jsx("div",{className:"grid grid-cols-2 gap-2 sm:grid-cols-3 lg:grid-cols-4",children:_e.map(e=>{const t=dt===e.id;return r.jsxs("button",{type:"button",onClick:()=>(e=>{const t=Se(e);ht(e),pt(Re(t.w,ut)),wt(Re(t.h,ut)),bt.current=t.w/t.h})(e.id),"aria-pressed":t,className:u("rounded-xl border p-3 text-left transition-colors",t?"border-primary bg-primary/15":"border-white/10 bg-white/[0.035] hover:border-white/25 hover:bg-white/[0.06]"),children:[r.jsx("span",{className:"block truncate text-xs font-semibold",children:e.label}),r.jsxs("span",{className:"mt-1 block text-[10px] text-white/40",children:[e.width," à ",e.height]})]},e.id)})})]}),r.jsxs("section",{className:"rounded-2xl border border-white/10 bg-white/[0.035] p-4",children:[r.jsxs("div",{className:"mb-4 flex flex-wrap items-center justify-between gap-3",children:[r.jsx("h3",{className:"text-sm font-semibold",children:"Dimensions"}),r.jsx("div",{className:"flex rounded-lg border border-white/10 bg-black/25 p-0.5",children:["px","mm","in"].map(e=>r.jsx("button",{type:"button",onClick:()=>(e=>{const t=Ee(xt,ut),r=Ee(ft,ut);mt(e),pt(Re(t,e)),wt(Re(r,e))})(e),className:u("rounded-md px-2.5 py-1 text-xs font-semibold uppercase transition-colors",ut===e?"bg-white text-black":"text-white/45 hover:text-white"),children:e},e))})]}),r.jsxs("div",{className:"grid grid-cols-[1fr_auto_1fr] items-end gap-3",children:[r.jsxs("label",{className:"text-xs text-white/45",children:["Width",r.jsx(c,{type:"number",min:"1",value:xt,onChange:e=>{const t=Math.max(1,Number(e.target.value));pt(t),ht("custom"),gt&&wt(Number((t/bt.current).toFixed(2)))},className:"mt-1.5 h-11 rounded-xl border-white/10 bg-black/25 text-white"})]}),r.jsx("button",{type:"button",onClick:()=>{pt(ft),wt(xt),bt.current=1/bt.current,ht("custom")},className:"mb-1 flex h-10 w-10 items-center justify-center rounded-xl border border-white/10 text-white/55 hover:bg-white/10 hover:text-white","aria-label":"Swap canvas orientation",title:"Swap orientation",children:r.jsx(W,{className:"h-4 w-4"})}),r.jsxs("label",{className:"text-xs text-white/45",children:["Height",r.jsx(c,{type:"number",min:"1",value:ft,onChange:e=>{const t=Math.max(1,Number(e.target.value));wt(t),ht("custom"),gt&&pt(Number((t*bt.current).toFixed(2)))},className:"mt-1.5 h-11 rounded-xl border-white/10 bg-black/25 text-white"})]})]}),r.jsxs("div",{className:"mt-3 flex flex-wrap items-center justify-between gap-3",children:[r.jsxs("button",{type:"button",onClick:()=>{vt(e=>!e),bt.current=xt/ft},className:"flex items-center gap-2 text-xs font-semibold text-white/55 hover:text-white",children:[gt?r.jsx(T,{className:"h-3.5 w-3.5"}):r.jsx(Je,{className:"h-3.5 w-3.5"}),"Aspect ratio ",gt?"locked":"unlocked"]}),r.jsx("span",{className:"text-[11px] text-white/35",children:"px"===ut?`${Math.round(xt)} à ${Math.round(ft)} px`:`300 DPI · ${Ee(xt,ut)} à ${Ee(ft,ut)} px`})]})]}),r.jsxs("section",{className:"space-y-3",children:[r.jsxs("div",{children:[r.jsx("h3",{className:"text-sm font-semibold",children:"Resize method"}),r.jsx("p",{className:"mt-1 text-xs text-white/40",children:"Choose how existing artwork adapts to the new shape."})]}),r.jsx("div",{className:"grid gap-2 sm:grid-cols-3",children:[{id:"scale",label:"Scale",description:"Scale everything proportionally and center it."},{id:"rearrange",label:"Rearrange",description:"Adapt object positions to the new ratio."},{id:"crop",label:"Crop canvas only",description:"Change the frame; keep objects untouched."}].map(e=>r.jsxs("button",{type:"button",onClick:()=>jt(e.id),className:u("rounded-xl border p-3 text-left transition-colors",yt===e.id?"border-primary bg-primary/15":"border-white/10 bg-white/[0.035] hover:border-white/25"),children:[r.jsx("span",{className:"block text-xs font-semibold",children:e.label}),r.jsx("span",{className:"mt-1 block text-[11px] leading-relaxed text-white/40",children:e.description})]},e.id))})]}),r.jsxs("button",{type:"button",onClick:()=>kt(e=>!e),className:u("flex w-full items-start gap-3 rounded-2xl border p-4 text-left transition-colors",Nt?"border-primary/60 bg-primary/10":"border-white/10 bg-white/[0.025]"),"aria-pressed":Nt,children:[r.jsx("span",{className:u("mt-0.5 flex h-5 w-5 shrink-0 items-center justify-center rounded-md border",Nt?"border-primary bg-primary text-primary-foreground":"border-white/20"),children:Nt&&r.jsx(he,{className:"h-3.5 w-3.5"})}),r.jsxs("span",{children:[r.jsxs("span",{className:"flex items-center gap-2 text-sm font-semibold",children:[r.jsx(z,{className:"h-4 w-4"}),"Create a copy",r.jsx("span",{className:"rounded-full bg-primary/20 px-2 py-0.5 text-[10px] font-bold uppercase text-primary",children:"Recommended"})]}),r.jsx("span",{className:"mt-1 block text-xs text-white/45",children:"Keeps the original untouched and opens a new version."})]})]})]}),r.jsxs("div",{className:"flex items-center justify-between border-t border-white/10 bg-black/20 px-6 py-4",children:[r.jsx(l,{type:"button",variant:"ghost",className:"rounded-full text-white/60 hover:bg-white/10 hover:text-white",onClick:()=>ct(!1),disabled:St,children:"Cancel"}),r.jsxs(l,{type:"button",className:"rounded-full px-6",onClick:async()=>
2{if(!Ot||!n||St)return;const e=br(Ee(xt,ut),64,12e3),t=br(Ee(ft,ut),64,12e3),r=ze(dt),o=(null==r?void 0:r.width)===e&&(null==r?void 0:r.height)===t,s=o?r.id:Te(e,t),l=Nr(),c=((e,t,r,n)=>{if("crop"===n)return e.map(e=>({...e}));const a=Math.min(r.w/t.w,r.h/t.h),i="scale"===n?(r.w-t.w*a)/2:0,o="scale"===n?(r.h-t.h*a)/2:0;return e.map(e=>{var s;const l=Math.max(1,e.w*a),c=Math.max(1,e.h*a),d="rearrange"===n?(e.x+e.w/2)/t.w*r.w-l/2:e.x*a+i,h="rearrange"===n?(e.y+e.h/2)/t.h*r.h-c/2:e.y*a+o;return{...e,x:br(d,0,Math.max(0,r.w-l)),y:br(h,0,Math.max(0,r.h-c)),w:Math.min(l,r.w),h:Math.min(c,r.h),..."text"===e.type?{style:{...e.style,fontSize:Math.max(12,((null==(s=e.style)?void 0:s.fontSize)||24)*a)}}:{}}})})(g||[],l,{w:e,h:t},yt),d=o?r.label:`${e} à ${t}`;Ct(!0);try{if(Nt){const{data:e,error:t}=await i.from("canvases").insert({name:`${We||Ot.name} â ${d}`,type:Ot.type||"freeform",aspect_ratio:s,elements:yr(c),thumbnail_url:null}).select().single();if(t||!(null==e?void 0:e.id))throw t||new Error("Canvas copy could not be created");return await x.invalidateQueries({queryKey:["canvases"]}),ct(!1),a(`/canvas/${e.id}`),void p({title:"New format created",description:"The original canvas is unchanged."})}const{error:r}=await i.from("canvases").update({aspect_ratio:s,elements:yr(c),thumbnail_url:null,updated_at:(new Date).toISOString()}).eq("id",n);if(r)throw r;v(c),x.setQueryData(["canvas",n],e=>e?{...e,aspect_ratio:s,elements:c}:e),await x.invalidateQueries({queryKey:["canvases"]}),ct(!1),window.setTimeout(Gt,50),p({title:"Canvas resized",description:`${d} · ${e} à ${t}px`})}catch(h){p({title:"Resize failed",description:mr(h),variant:"error"})}finally{Ct(!1)}},disabled:St,children:[St&&r.jsx(X,{className:"mr-2 h-4 w-4 animate-spin"}),Nt?"Create new format":"Resize canvas"]})]})]})}),r.jsx(fe,{open:ot,onOpenChange:st,children:r.jsxs(we,{className:"overflow-hidden border-white/10 bg-[#111111]/95 p-0 text-white shadow-2xl sm:max-w-md",children:[r.jsx(ge,{children:r.jsxs("div",{className:"border-b border-white/10 px-6 pb-5 pt-6",children:[r.jsx(ve,{className:"text-xl",children:"Save canvas"}),r.jsx("p",{className:"mt-1.5 text-sm text-white/50",children:"Choose where this canvas should appear."})]})}),r.jsxs("div",{className:"flex max-h-[min(65vh,520px)] flex-col gap-2 overflow-y-auto px-4 pb-4",children:[r.jsxs("button",{onClick:()=>cr(null),className:"w-full rounded-2xl border border-white/10 bg-white/[0.035] p-4 text-left transition-all hover:border-primary/60 hover:bg-primary/10",children:[r.jsx("div",{className:"font-semibold",children:"Your profile"}),r.jsx("div",{className:"mt-1 text-sm text-white/45",children:"Save without adding it to a board"})]}),_t.map(e=>r.jsxs("button",{onClick:()=>cr(e.id),className:"w-full rounded-2xl border border-white/10 bg-white/[0.035] p-4 text-left transition-all hover:border-primary/60 hover:bg-primary/10",children:[r.jsx("div",{className:"font-semibold",children:e.name}),r.jsx("div",{className:"mt-1 text-sm text-white/45",children:"Add to board"})]},e.id))]})]})})]})};export{jr as default};
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.