// @license magnet:?xt=urn:btih:0b31508aeb0634b347b8270c7bee4d411b5d4109&dn=agpl-3.0.txt AGPL-3.0-or-later // @source: https://gitlab.com/soapbox-pub/ditto/-/tree/f0a3877c import{r as e}from"./rolldown-runtime-QTnfLwEv.js";import{Bt as t,On as n,Ri as r,_n as i,a,j as o,li as s,q as c,qi as l,wr as u,yt as d}from"./lucide-icons-BdRF0moN.js";import{t as f}from"./jsx-runtime-By8HlURe.js";import{u as p}from"./esm-CRVqHnq2.js";import{h as m}from"./useQuery-rCAlChE8.js";import{R as h,S as g,k as _,x as v,y}from"./useTheme-B8n3R7ig.js";import{l as b,o as x,t as S}from"./useCurrentUser-C6OJJlWo.js";import{t as C}from"./useNostrPublish-CrMjnYm4.js";import{f as w,i as T,o as ee,r as te,s as E}from"./letterTypes-BLLFWtiN.js";import{n as D,r as O,t as ne}from"./avatar--oX_CTF4.js";import{c as k,d as re,n as A}from"./chunk-62JRHF6Z-yJW_vgm4.js";import{t as ie}from"./CustomEmoji-DRcU63lJ.js";import{r as j}from"./haptics-Cp_uF-bV.js";import{t as ae}from"./skeleton-CVls4GW9.js";import{a as M,c as N,n as P,t as F}from"./dialog-C3CFmras.js";import{i as I}from"./letterUtils-ByLgglzi.js";import{c as oe}from"./LayoutContext-CjQBLGO-.js";import{t as se}from"./useCustomEmojis-BRL1hilD.js";import{t as ce}from"./SubHeaderBar-BYwNp4Nc.js";import{t as L}from"./scroll-area-D2CmkWvj.js";import{E as le,K as ue,o as de,w as R}from"./index-CYEZWNq6.js";import{t as z}from"./useStationeryColors-O59Qp8EM.js";import{t as fe}from"./useLetterPreferences-ElrzsYts.js";import{n as pe,t as me}from"./LetterEditor-CfqrZGP4.js";import{t as he}from"./LetterStickers-B8Ngg6eA.js";var B=e(l(),1),V=f();function ge({onSelect:e}){let{emojis:t,isLoading:r}=se(),[i,a]=(0,B.useState)(!1);return(0,V.jsxs)(`div`,{className:`space-y-2`,children:[(0,V.jsxs)(`div`,{className:`flex items-center gap-1`,children:[(0,V.jsx)(`span`,{className:`text-xs font-medium text-muted-foreground px-1`,children:`my stickers`}),(0,V.jsx)(`button`,{onClick:()=>a(!0),className:`ml-auto opacity-60 hover:opacity-100 transition-opacity`,"aria-label":`About stickers`,children:(0,V.jsx)(n,{className:`w-5 h-5`,strokeWidth:2.5})})]}),r&&(0,V.jsx)(`div`,{className:`grid grid-cols-4 gap-1.5`,children:Array.from({length:8}).map((e,t)=>(0,V.jsx)(ae,{className:`aspect-square rounded-xl`},t))}),!r&&t.length===0&&(0,V.jsxs)(`div`,{className:`flex flex-col items-center justify-center py-8 text-muted-foreground gap-2`,children:[(0,V.jsx)(c,{className:`size-8 opacity-40`}),(0,V.jsx)(`p`,{className:`text-sm`,children:`no sticker packs yet`}),(0,V.jsx)(`p`,{className:`text-xs opacity-70`,children:`add emoji packs to your profile to use stickers`})]}),!r&&t.length>0&&(0,V.jsx)(L,{className:`h-[200px]`,children:(0,V.jsx)(`div`,{className:`grid grid-cols-4 gap-1.5 p-1`,children:t.map(t=>(0,V.jsx)(`button`,{type:`button`,title:t.shortcode,onClick:()=>e(t),className:`aspect-square rounded-xl overflow-hidden hover:bg-muted/80 transition-all p-1.5 group active:scale-90`,children:(0,V.jsx)(ie,{name:t.shortcode,url:t.url,className:`w-full h-full object-contain group-hover:scale-110 transition-transform duration-150`})},t.shortcode))})}),(0,V.jsx)(F,{open:i,onOpenChange:a,children:(0,V.jsxs)(P,{className:`max-w-xs rounded-2xl`,children:[(0,V.jsx)(M,{children:(0,V.jsxs)(N,{className:`flex items-center gap-2`,children:[(0,V.jsx)(c,{className:`w-5 h-5 shrink-0`}),`Stickers`]})}),(0,V.jsxs)(`div`,{className:`space-y-3 text-sm text-muted-foreground`,children:[(0,V.jsx)(`p`,{children:`Stickers are custom emoji packs (NIP-30) published on Nostr. They get placed on top of your letter as decorations.`}),(0,V.jsx)(`p`,{children:`Add emoji packs to your profile to make them available as stickers.`}),(0,V.jsx)(`p`,{children:(0,V.jsx)(A,{to:`/emojis`,onClick:()=>a(!1),className:`text-foreground font-medium underline underline-offset-2 hover:no-underline`,children:`Browse emoji packs`})})]})]})})]})}function H(e,t,n){let r=n[0]-t[0],i=n[1]-t[1],a=r*r+i*i;if(a===0)return Math.hypot(e[0]-t[0],e[1]-t[1]);let o=Math.max(0,Math.min(1,((e[0]-t[0])*r+(e[1]-t[1])*i)/a));return Math.hypot(e[0]-(t[0]+o*r),e[1]-(t[1]+o*i))}function U(e,t){if(e.length<=2)return e;let n=0,r=0,i=e.length-1;for(let t=1;tn&&(n=a,r=t)}if(n<=t)return[e[0],e[i]];let a=U(e.slice(0,r+1),t),o=U(e.slice(r),t);return[...a.slice(0,-1),...o]}function W(e){return Math.round(e*10)/10}function G(e){if(e.length===0)return``;if(e.length===1)return`M${W(e[0][0])},${W(e[0][1])}l0,0`;if(e.length===2)return`M${W(e[0][0])},${W(e[0][1])}L${W(e[1][0])},${W(e[1][1])}`;let t=`M${W(e[0][0])},${W(e[0][1])}`;for(let n=1;nr&&(r=o+e),s+e>i&&(i=s+e)}return isFinite(t)?{x:t,y:n,w:r-t,h:i-n}:null}var q=8,J=1.5,Y=/^#(?:[0-9a-fA-F]{3,4}|[0-9a-fA-F]{6}|[0-9a-fA-F]{8})$/;function _e(e){return Y.test(e)?e:`#000000`}function ve(e){let t=Number(e);return Number.isFinite(t)&&t>0&&t<=100?t:4}function ye(e){if(e.length===0)return null;let t=K(e);return!t||t.w<1||t.h<1?null:`${e.map(e=>``).join(``)}`}var X=300,Z=[`#1a1a1a`,`#e53e3e`,`#dd6b20`,`#d69e2e`,`#38a169`,`#3182ce`,`#805ad5`,`#d53f8c`,`#f7f7f7`],be=[{value:3,label:`S`},{value:6,label:`M`},{value:10,label:`L`},{value:16,label:`XL`}];function xe(e,t){let n=t.getBoundingClientRect();return[(e.clientX-n.left)/n.width*X,(e.clientY-n.top)/n.height*X]}function Se({onConfirm:e,onCancel:t}){let n=(0,B.useRef)(null),[r,i]=(0,B.useState)([]),[c,l]=(0,B.useState)(null),[d,f]=(0,B.useState)(Z[0]),[p,m]=(0,B.useState)(be[1].value),h=(0,B.useCallback)(e=>{n.current&&(e.preventDefault(),e.target.setPointerCapture?.(e.pointerId),l({points:[xe(e,n.current)],color:d,width:p}))},[d,p]),g=(0,B.useCallback)(e=>{if(!c||!n.current)return;e.preventDefault();let t=xe(e,n.current);l(e=>e&&{...e,points:[...e.points,t]})},[c]),_=(0,B.useCallback)(()=>{c&&(i(e=>[...e,c]),l(null))},[c]),v=(0,B.useCallback)(()=>{let t=ye(r);t&&e(t)},[r,e]),y=c?[...r,c]:r,b=r.length>0,x=`p-2.5 rounded-xl text-muted-foreground hover:text-foreground hover:bg-muted transition-colors disabled:opacity-30 disabled:cursor-not-allowed`;return(0,V.jsxs)(`div`,{className:`flex flex-col gap-3`,children:[(0,V.jsx)(`div`,{className:`relative mx-auto w-full max-w-[300px]`,children:(0,V.jsx)(`div`,{className:`relative rounded-2xl overflow-hidden border-2 border-dashed border-border bg-white`,style:{aspectRatio:`1`},children:(0,V.jsxs)(`svg`,{ref:n,viewBox:`0 0 ${X} ${X}`,className:`absolute inset-0 w-full h-full cursor-crosshair`,style:{touchAction:`none`},onPointerDown:h,onPointerMove:g,onPointerUp:_,onPointerLeave:_,children:[(0,V.jsx)(`defs`,{children:(0,V.jsx)(`pattern`,{id:`drawing-grid`,width:`30`,height:`30`,patternUnits:`userSpaceOnUse`,children:(0,V.jsx)(`circle`,{cx:`15`,cy:`15`,r:`0.5`,fill:`#d4d4d4`})})}),(0,V.jsx)(`rect`,{width:X,height:X,fill:`url(#drawing-grid)`}),y.map((e,t)=>(0,V.jsx)(`path`,{d:G(e.points),fill:`none`,stroke:e.color,strokeWidth:e.width,strokeLinecap:`round`,strokeLinejoin:`round`,opacity:e===c?.8:1},t))]})})}),(0,V.jsx)(`div`,{className:`flex items-center justify-center gap-1.5`,children:Z.map(e=>(0,V.jsx)(`button`,{type:`button`,onClick:()=>f(e),className:`w-7 h-7 rounded-full transition-all border-2 ${d===e?`border-primary scale-110 shadow-md`:`border-transparent hover:scale-105`}`,style:{backgroundColor:e}},e))}),(0,V.jsx)(`div`,{className:`flex items-center justify-center gap-2`,children:be.map(e=>(0,V.jsxs)(`button`,{type:`button`,onClick:()=>m(e.value),className:`flex items-center justify-center rounded-xl px-3 py-1.5 text-xs font-semibold transition-all ${p===e.value?`bg-primary text-primary-foreground shadow-sm`:`bg-muted text-muted-foreground hover:text-foreground`}`,children:[(0,V.jsx)(`span`,{className:`rounded-full inline-block mr-1.5`,style:{width:Math.max(4,e.value),height:Math.max(4,e.value),backgroundColor:p===e.value?`currentColor`:d}}),e.label]},e.value))}),(0,V.jsxs)(`div`,{className:`flex items-center justify-center gap-2`,children:[(0,V.jsx)(`button`,{type:`button`,onClick:t,className:x,title:`Cancel`,children:(0,V.jsx)(a,{className:`w-5 h-5`,strokeWidth:2.5})}),(0,V.jsx)(`button`,{type:`button`,onClick:()=>{i([]),l(null)},disabled:!b,className:x,title:`Clear all`,children:(0,V.jsx)(u,{className:`w-5 h-5`,strokeWidth:2.5})}),(0,V.jsx)(`button`,{type:`button`,onClick:()=>i(e=>e.slice(0,-1)),disabled:!b,className:x,title:`Undo`,children:(0,V.jsx)(o,{className:`w-5 h-5`,strokeWidth:2.5})}),(0,V.jsxs)(`button`,{type:`button`,onClick:v,disabled:!b,className:`px-5 py-2.5 rounded-xl bg-primary text-primary-foreground font-semibold text-sm hover:bg-primary/90 transition-colors disabled:opacity-30 disabled:cursor-not-allowed flex items-center gap-1.5`,children:[(0,V.jsx)(s,{className:`w-4 h-4`,strokeWidth:3}),`done`]})]})]})}function Ce(e){let t=Math.min(Math.round(e*.85),420),n=Math.round(t/1.588),r=Math.round(t*.041),i=t/54,a=Math.round(n*.147),o=Math.round(n*.647),s=Math.round(o*1.08),c=Math.round(t*.82);return{envW:t,envH:n,r,flapY:a,vY:o,flapTriH:s,letterW:c,letterH:c/(5/4),strokeV:Math.round(i*1.6*10)/10,strokeCorner:Math.round(i*1.4*10)/10}}function we(){let[e,t]=(0,B.useState)(()=>Ce(window.innerWidth));return(0,B.useEffect)(()=>{let e=()=>t(Ce(window.innerWidth));return window.addEventListener(`resize`,e),()=>window.removeEventListener(`resize`,e)},[]),e}var Q={inOutCubic:e=>e<.5?4*e*e*e:1-(-2*e+2)**3/2,outQuart:e=>1-(1-e)**4,outQuint:e=>1-(1-e)**5,inQuad:e=>e*e};function Te(e,t,n,r){let i=0,a=performance.now(),o=s=>{let c=Math.min(1,(s-a)/e);t(r(c)),c<1?i=requestAnimationFrame(o):n()};return i=requestAnimationFrame(o),()=>cancelAnimationFrame(i)}function $(e,t){let[n,r,i]=_(e),a=e=>Math.min(255,Math.round(e+(255-e)*t));return h(a(n),a(r),a(i))}function Ee(e,t){let n=v(e,t,.08);return{body:n,inner:v(e,t,.18),stroke:g(n,.2),corner:g(n,.12),sealBase:t,sealDark:g(t,.12),sealDarker:g(t,.22),sealEdge:g(t,.18)}}function De(e,t){let[n,r,i]=_(t),a=[t,$(t,.25),$(t,.45),g(t,.15),h(n,r,Math.min(255,i+40))];return Array.from({length:e},()=>({delay:Math.random()*1.8,duration:2.5+Math.random()*2,size:18+Math.random()*16,startRotate:Math.random()*360,color:a[Math.floor(Math.random()*a.length)]}))}function Oe(){j()}function ke({letterElement:e,letterWidth:t,recipientName:n,recipientPicture:r,bgColor:i,primaryColor:a,textColor:o,onComplete:s}){let c=we(),l=(0,B.useId)(),[u,d]=(0,B.useState)(0),f=(0,B.useRef)(void 0),p=(0,B.useRef)(s);p.current=s;let m=(0,B.useMemo)(()=>Ee(i,a),[i,a]),h=(0,B.useMemo)(()=>De(12,a),[a]),g=(0,B.useRef)(!1),_=(0,B.useCallback)(()=>{f.current?.(),f.current=void 0},[]);(0,B.useEffect)(()=>()=>_(),[_]),(0,B.useLayoutEffect)(()=>(f.current=Te(9e3,d,()=>{p.current()},Q.inOutCubic),_),[_]);let v=(e,t)=>Math.max(0,Math.min(1,(u-e)/(t-e))),y=Q.outQuint(v(0,.06)),b=Q.outQuart(v(.04,.16)),x=Q.outQuart(v(.15,.21)),S=Q.inOutCubic(v(.18,.38)),C=Q.inQuad(v(.48,.58)),w=Q.outQuart(v(.58,.65)),T=Q.inQuad(v(.92,1)),ee=-c.letterH+b*(c.letterH+c.flapY),te=x*180,E=S>0,D=(1-S)*-120,O=Math.max(0,(S-.75)/.25),ne=O===0?1:O<.4?1+O/.4*.08:1.08-(O-.4)/.6*.08,k=O===0?1:O<.4?1-O/.4*.06:.94+(O-.4)/.6*.06,re=O<.3?O/.3:1,A=(1-S)*24+4,ie=(1-S)*30+2;O>0&&!g.current&&(g.current=!0,Oe());let j=C*-250,ae=1-C,M=Math.sin(C*Math.PI)*2,N=Math.round(c.envW*.19),P=N/2,F=Math.round(N*1.3),I=c.letterH+c.flapTriH+c.envH+60;return(0,V.jsxs)(`div`,{className:`absolute inset-0 z-50 bg-background flex items-center justify-center overflow-hidden`,style:{opacity:1-T},children:[(0,V.jsx)(`div`,{className:`absolute inset-0 flex items-center justify-center`,style:{opacity:1-w},children:(0,V.jsx)(`div`,{className:`relative`,style:{width:c.envW+40,height:I,marginTop:-60},children:(0,V.jsx)(`div`,{className:`absolute inset-0 flex items-center justify-center`,style:{transform:C>0?`translateY(${j}px) rotate(${M}deg)`:void 0,opacity:C>0?ae:1},children:(0,V.jsxs)(`div`,{className:`relative`,style:{width:c.envW,height:c.envH,marginTop:c.flapTriH,opacity:y,transform:`scale(${.94+y*.06})`},children:[(0,V.jsxs)(`div`,{style:{position:`absolute`,bottom:`100%`,left:0,width:c.envW,height:c.flapTriH,transformOrigin:`bottom center`,transform:`rotateX(${te}deg)`,transformStyle:`preserve-3d`,zIndex:te>90?4:-1},children:[(0,V.jsx)(`svg`,{width:c.envW,height:c.flapTriH,viewBox:`0 0 ${c.envW} ${c.flapTriH}`,className:`absolute inset-0`,style:{backfaceVisibility:`hidden`},children:(0,V.jsx)(`path`,{d:`M${c.r*.65},${c.flapTriH} L${c.envW/2-c.r},${c.r} Q${c.envW/2},0 ${c.envW/2+c.r},${c.r} L${c.envW-c.r*.65},${c.flapTriH} Z`,fill:m.inner})}),(0,V.jsxs)(`svg`,{width:c.envW,height:c.flapTriH,viewBox:`0 0 ${c.envW} ${c.flapTriH}`,className:`absolute inset-0`,style:{backfaceVisibility:`hidden`,transform:`rotateX(180deg)`},children:[(0,V.jsx)(`path`,{d:`M${c.r},0 Q0,0 0,${c.r} L0,${c.flapY} L${c.envW/2-c.r},${c.flapTriH-c.r} Q${c.envW/2},${c.flapTriH} ${c.envW/2+c.r},${c.flapTriH-c.r} L${c.envW},${c.flapY} L${c.envW},${c.r} Q${c.envW},0 ${c.envW-c.r},0 Z`,fill:m.body}),(0,V.jsx)(`path`,{d:`M0,${c.flapY} L${c.envW/2-c.r},${c.flapTriH-c.r} Q${c.envW/2},${c.flapTriH} ${c.envW/2+c.r},${c.flapTriH-c.r} L${c.envW},${c.flapY}`,stroke:o,strokeWidth:c.strokeV,strokeLinecap:`round`,strokeLinejoin:`round`,fill:`none`})]})]}),(0,V.jsx)(`div`,{className:`absolute inset-0`,style:{backgroundColor:m.body,borderRadius:c.r,boxShadow:`0 8px 40px rgba(0,0,0,0.18), 0 2px 8px rgba(0,0,0,0.10), 0 0 0 1px rgba(0,0,0,0.06)`}}),(0,V.jsx)(`div`,{className:`absolute overflow-hidden`,style:{top:0,left:0,right:0,height:c.vY,borderRadius:`${c.r}px ${c.r}px 0 0`,backgroundColor:m.inner,zIndex:0}}),(0,V.jsx)(`div`,{className:`absolute inset-0 overflow-hidden`,style:{borderRadius:c.r,zIndex:1},children:(0,V.jsxs)(`svg`,{className:`absolute inset-0`,width:c.envW,height:c.envH,viewBox:`0 0 ${c.envW} ${c.envH}`,children:[(0,V.jsx)(`path`,{d:`M2,${c.envH-2} L${c.envW*.35},${c.envH*.5}`,stroke:m.corner,strokeWidth:c.strokeCorner,strokeLinecap:`round`,fill:`none`,opacity:`0.5`}),(0,V.jsx)(`path`,{d:`M${c.envW-2},${c.envH-2} L${c.envW*.65},${c.envH*.5}`,stroke:m.corner,strokeWidth:c.strokeCorner,strokeLinecap:`round`,fill:`none`,opacity:`0.5`})]})}),(0,V.jsx)(`div`,{className:`absolute overflow-hidden`,style:{top:-(c.letterH+c.flapTriH),left:0,right:0,bottom:0,borderRadius:`0 0 ${c.r}px ${c.r}px`,zIndex:1},children:(0,V.jsx)(`div`,{className:`absolute`,style:{left:(c.envW-t)/2,width:t,top:c.letterH+c.flapTriH+ee},children:e})}),(0,V.jsxs)(`svg`,{className:`absolute inset-0 pointer-events-none`,width:c.envW,height:c.envH,viewBox:`0 0 ${c.envW} ${c.envH}`,style:{zIndex:2},children:[(0,V.jsx)(`path`,{d:`M0,${c.flapY} L${c.envW/2-c.r},${c.vY-c.r} Q${c.envW/2},${c.vY} ${c.envW/2+c.r},${c.vY-c.r} L${c.envW},${c.flapY} L${c.envW},${c.envH-c.r} Q${c.envW},${c.envH} ${c.envW-c.r},${c.envH} L${c.r},${c.envH} Q0,${c.envH} 0,${c.envH-c.r} Z`,fill:m.body}),(0,V.jsx)(`path`,{d:`M0,${c.flapY} L${c.envW/2-c.r},${c.vY-c.r} Q${c.envW/2},${c.vY} ${c.envW/2+c.r},${c.vY-c.r} L${c.envW},${c.flapY}`,fill:`none`,stroke:o,strokeWidth:c.strokeV,strokeLinecap:`round`,strokeLinejoin:`round`})]}),E&&(0,V.jsxs)(`div`,{className:`absolute`,style:{left:c.envW/2-P,top:c.vY-P,width:N,height:N,zIndex:5,transform:`translateY(${D}px) scaleX(${ne}) scaleY(${k})`,transformOrigin:`center center`},children:[O>0&&(0,V.jsxs)(`svg`,{className:`absolute`,width:F,height:F,viewBox:`0 0 84 84`,style:{left:-(F-N)/2,top:-(F-N)/2,transform:`scale(${.88+re*.12})`},children:[(0,V.jsx)(`defs`,{children:(0,V.jsxs)(`radialGradient`,{id:l,children:[(0,V.jsx)(`stop`,{offset:`0%`,stopColor:m.sealBase}),(0,V.jsx)(`stop`,{offset:`50%`,stopColor:m.sealDark}),(0,V.jsx)(`stop`,{offset:`85%`,stopColor:m.sealDarker}),(0,V.jsx)(`stop`,{offset:`100%`,stopColor:m.sealDarker,stopOpacity:`0.6`})]})}),(0,V.jsx)(`path`,{d:`M42 3 C50 2, 58 7, 64 13 C69 18, 76 24, 78 33 C80 41, 82 48, 77 56 C73 62, 66 70, 56 73 C48 76, 40 78, 32 74 C24 71, 14 66, 9 58 C5 50, 2 42, 4 34 C6 26, 12 18, 19 12 C26 6, 34 4, 42 3 Z`,fill:`url(#${l})`}),(0,V.jsx)(`path`,{d:`M42 3 C50 2, 58 7, 64 13 C69 18, 76 24, 78 33 C80 41, 82 48, 77 56 C73 62, 66 70, 56 73 C48 76, 40 78, 32 74 C24 71, 14 66, 9 58 C5 50, 2 42, 4 34 C6 26, 12 18, 19 12 C26 6, 34 4, 42 3 Z`,fill:`none`,stroke:`rgba(255,255,255,0.08)`,strokeWidth:`1`})]}),(0,V.jsx)(`div`,{className:`absolute rounded-full`,style:{inset:2,background:` radial-gradient(ellipse at 35% 30%, rgba(255,255,255,0.22) 0%, transparent 50%), radial-gradient(ellipse at 65% 70%, rgba(0,0,0,0.14) 0%, transparent 50%), radial-gradient(circle at 50% 50%, ${m.sealBase} 0%, ${m.sealDark} 55%, ${m.sealDarker} 100%) `,boxShadow:` 0 ${ie}px ${A}px rgba(0,0,0,0.28), 0 1px 3px rgba(0,0,0,0.14), inset 0 1.5px 2px rgba(255,255,255,0.18), inset 0 -1.5px 2px rgba(0,0,0,0.18) `,border:`2px solid ${m.sealEdge}`}}),(0,V.jsx)(`div`,{className:`absolute inset-0 flex items-center justify-center`,style:{zIndex:1},children:(0,V.jsx)(`img`,{src:`/logo.svg`,alt:``,style:{width:N*.58,height:N*.58,filter:`brightness(0) invert(1) opacity(0.85)`},decoding:`async`})})]}),(0,V.jsx)(`div`,{className:`absolute left-4 right-4`,style:{bottom:-4,height:8,background:`radial-gradient(ellipse at center, rgba(0,0,0,0.06) 0%, transparent 70%)`,zIndex:-1,borderRadius:`50%`}})]})})})}),w>0&&(0,V.jsx)(`div`,{className:`absolute inset-0 flex items-center justify-center overflow-hidden`,style:{opacity:w},children:(0,V.jsxs)(`div`,{className:`relative text-center space-y-5 px-6`,style:{transform:`translateY(${(1-w)*12}px)`},children:[(0,V.jsxs)(`div`,{className:`relative mx-auto`,style:{width:96,height:96},children:[h.map((e,t)=>{let n=(t/h.length*360+e.startRotate*.3)*Math.PI/180,r=60+e.size*3,i=Math.cos(n)*r,a=Math.sin(n)*r;return(0,V.jsx)(`svg`,{className:`absolute pointer-events-none`,width:e.size,height:e.size,viewBox:`0 0 24 24`,fill:`none`,style:{left:`50%`,top:`50%`,marginLeft:-e.size/2,marginTop:-e.size/2,opacity:0,animation:`letter-send-burst ${e.duration}s ease-out ${e.delay*.4}s both`,"--burst-tx":`${i}px`,"--burst-ty":`${a}px`,"--burst-rot":`${e.startRotate}deg`},children:(0,V.jsx)(`circle`,{cx:`12`,cy:`12`,r:`5`,fill:e.color,opacity:.8})},t)}),(0,V.jsx)(`div`,{className:`w-24 h-24 rounded-full border-4 flex items-center justify-center overflow-hidden`,style:{backgroundColor:i,borderColor:m.stroke,animation:`letter-send-avatar-in 0.7s cubic-bezier(0.34, 1.56, 0.64, 1) both`},children:r?(0,V.jsx)(`img`,{src:r,alt:``,className:`w-full h-full object-cover`,decoding:`async`}):(0,V.jsx)(`img`,{src:`/logo.svg`,alt:``,style:{width:44,height:44,opacity:.5},decoding:`async`})})]}),(0,V.jsxs)(`p`,{className:`text-2xl font-bold text-foreground`,style:{opacity:0,animation:`letter-send-fade-up 0.5s ease-out 0.3s forwards`},children:[`Sent a letter to `,n,`!`]})]})})]})}function Ae({content:e,width:t}){let{text:n,line:r}=z(e.stationery),i=w(e.stationery??{color:`#F5E6D3`}).fontFamily??T[0].family,a=Math.round(t*E);return(0,V.jsxs)(`div`,{className:`relative`,style:{containerType:`inline-size`,width:t},children:[(0,V.jsx)(I,{stationery:e.stationery,frame:e.stationery?.frame,frameTint:e.stationery?.frameTint,className:`rounded-2xl`,children:(0,V.jsxs)(`div`,{className:`relative z-10 flex flex-col`,style:{aspectRatio:`5 / 4`,padding:`5cqw`},children:[(0,V.jsx)(`p`,{className:`whitespace-pre-wrap font-semibold tracking-wide overflow-hidden flex-1 min-h-0`,style:{fontSize:`4.8cqw`,lineHeight:`${a}px`,letterSpacing:`0.06em`,paddingTop:`0.5cqw`,fontFamily:i,color:n,backgroundImage:`linear-gradient(to bottom, transparent ${a-3}px, ${r} ${a-3}px)`,backgroundSize:`100% ${a}px`,backgroundRepeat:`repeat-y`,maxHeight:`${a*5}px`},children:e.body}),e.closing&&(0,V.jsx)(`div`,{className:`flex flex-col items-end`,style:{paddingTop:`6cqw`,gap:`3cqw`,paddingRight:`4cqw`,fontFamily:i},children:(0,V.jsx)(`p`,{style:{fontSize:`4.8cqw`,color:n},children:e.closing})})]})}),e.stickers&&e.stickers.length>0&&(0,V.jsx)(`div`,{className:`absolute inset-0 rounded-2xl overflow-hidden pointer-events-none`,style:{zIndex:20},children:(0,V.jsx)(`div`,{className:`relative w-full h-full`,children:(0,V.jsx)(he,{stickers:e.stickers})})})]})}var je=220;function Me({pubkey:e,onClear:t}){let n=b(e).data?.metadata,r=n?.name||n?.display_name||`Anonymous`;return(0,V.jsxs)(`div`,{className:`flex items-center gap-2 px-3 py-1.5 rounded-2xl bg-muted/60 min-w-0`,children:[(0,V.jsxs)(ne,{className:`size-6 shrink-0`,children:[(0,V.jsx)(O,{src:n?.picture,alt:r}),(0,V.jsx)(D,{className:`bg-primary/15 text-[10px] font-bold text-primary`,children:r[0]?.toUpperCase()||`?`})]}),(0,V.jsx)(`span`,{className:`text-base font-medium truncate`,children:r}),t&&(0,V.jsx)(`button`,{onClick:t,className:`text-muted-foreground hover:text-foreground shrink-0 transition-colors p-0.5`,children:(0,V.jsx)(a,{className:`size-4`,strokeWidth:3})})]})}function Ne({onClose:e,toPubkey:n}){let{user:a}=S(),{mutateAsync:o}=C(),s=m(),l=(0,B.useRef)(null),u=(0,B.useRef)(null),f=(0,B.useRef)(null);(0,B.useEffect)(()=>{let e=setTimeout(()=>l.current?.focus(),300);return()=>clearTimeout(e)},[]);let h=(0,B.useMemo)(()=>{if(n)try{if(n.startsWith(`npub1`)){let e=p.decode(n);if(e.type===`npub`)return e.data}if(/^[0-9a-f]{64}$/i.test(n))return n}catch{}},[n]),{prefs:g,isThemeDefault:_}=fe(),v=pe(),[E,D]=(0,B.useState)(h),[O,ne]=(0,B.useState)(``),[k,re]=(0,B.useState)(()=>g.closing??`Warmly,`),[A,ie]=(0,B.useState)(()=>g.signature??``),[j,ae]=(0,B.useState)(()=>T.find(e=>e.value===g.font)??T[0]),[M,N]=(0,B.useState)(_?{color:te}:v),[P,F]=(0,B.useState)(()=>g.frame??`none`),[I,oe]=(0,B.useState)(()=>g.frameTint??!1),[L,R]=(0,B.useState)(`none`),[z,H]=(0,B.useState)([]),{emojis:U}=se(),[W,G]=(0,B.useState)(!1),[K,q]=(0,B.useState)(null),J=we().letterW,Y=(0,B.useRef)(!1);(0,B.useEffect)(()=>{Y.current||(!_&&g.stationery?(N(g.stationery),Y.current=!0):_&&(Y.current=!0))},[_,g.stationery]);let _e=(0,B.useRef)(!1),ve=(0,B.useCallback)(e=>{_e.current=!0,N(e)},[]);(0,B.useEffect)(()=>{!_e.current&&!_&&N(v)},[v,_]);let[ye,X]=(0,B.useState)(0);(0,B.useEffect)(()=>{let e=u.current;if(!e)return;let t=new ResizeObserver(([e])=>{let t=e.contentBoxSize?.[0]?.inlineSize??e.contentRect.width;X(Math.ceil(t*.005))});return t.observe(e),()=>t.disconnect()},[]);let Z=!!E&&(O.trim().length>0||z.length>0)&&!!a,be=(0,B.useCallback)(e=>{H(t=>[...t,{url:e.url,shortcode:e.shortcode,x:20+Math.random()*60,y:20+Math.random()*60,rotation:-15+Math.random()*30}]),R(`none`)},[]),xe=(0,B.useCallback)(e=>{H(t=>[...t,{url:``,shortcode:`drawing`,svg:e,x:20+Math.random()*60,y:20+Math.random()*60,rotation:-15+Math.random()*30}]),R(`none`)},[]),Ce=(0,B.useCallback)((e,t)=>{H(n=>n.map((n,r)=>r===e?{...n,...t}:n))},[]),Q=(0,B.useCallback)(e=>{H(t=>t.filter((t,n)=>n!==e))},[]),Te=(0,B.useCallback)(()=>{let e={...M,...j.family===T[0].family?{}:{fontFamily:j.family},...P&&P!==`none`?{frame:P}:{},...P&&P!==`none`&&I?{frameTint:!0}:{}};return{body:O.trim(),...k.trim()?{closing:k.trim()}:{},...A.trim()?{signature:A.trim()}:{},...z.length>0?{stickers:z}:{},stationery:e}},[O,k,A,z,M,j,P,I]),$=async()=>{if(!(!Z||!a||!E)){if(!a.signer.nip44){x({title:`your signer doesn't support encryption yet`,variant:`destructive`});return}G(!0);try{let e=Te(),t=await a.signer.nip44.encrypt(E,JSON.stringify(e));await o({kind:ee,content:t,tags:[[`p`,E],[`alt`,`Encrypted letter`]]}),s.invalidateQueries({queryKey:[`letters-sent`]}),s.invalidateQueries({queryKey:[`letters-inbox`]}),q(e)}catch(e){console.error(`Failed to send letter:`,e),G(!1),x({title:`couldn't send that one`,variant:`destructive`})}}},Ee=b(E),De=Ee.data?.metadata?.name||Ee.data?.metadata?.display_name||(E?`Anonymous`:`friend`),Oe=(0,B.useMemo)(()=>w(M??{color:`#F5E6D3`}),[M]),Ne=Oe.color??`#F5E6D3`,Pe=Oe.primaryColor??`#7c52e0`,Fe=Oe.textColor??y(Ne),Ie=(0,B.useMemo)(()=>K?(0,V.jsx)(Ae,{content:K,width:J}):(0,V.jsx)(Ae,{content:{body:``},width:J}),[K,J]);return(0,V.jsxs)(V.Fragment,{children:[(0,V.jsx)(`div`,{"aria-hidden":!0,className:`absolute opacity-0 pointer-events-none`,style:{width:J,top:-9999},children:(0,V.jsx)(Ae,{content:Te(),width:J})}),K&&(0,V.jsx)(ke,{letterElement:Ie,letterWidth:J,recipientName:De,recipientPicture:Ee.data?.metadata?.picture,bgColor:Ne,primaryColor:Pe,textColor:Fe,onComplete:e}),(0,V.jsxs)(`div`,{ref:u,className:`absolute inset-0 z-40 bg-background flex flex-col overflow-y-auto`,style:K?{visibility:`hidden`,pointerEvents:`none`}:void 0,children:[(0,V.jsx)(me,{state:{selectedFont:j,setSelectedFont:ae,stationery:M,setStationery:ve,frame:P,setFrame:F,frameTint:I,setFrameTint:oe,closing:k,setClosing:re,signature:A,setSignature:ie},overlay:L,setOverlay:e=>R(e),renderToolbarButtons:(t,n)=>(0,V.jsxs)(`div`,{className:`sticky top-0 z-20`,children:[n,(0,V.jsxs)(ce,{pinned:!0,className:`relative !top-0`,children:[(0,V.jsx)(`button`,{onClick:e,className:`pl-3 pr-1 py-1.5 text-muted-foreground hover:text-foreground transition-colors shrink-0`,children:(0,V.jsx)(r,{className:`size-5`})}),t]})]}),extraButtons:(0,V.jsxs)(V.Fragment,{children:[U.length>0&&(0,V.jsx)(de,{label:`Stickers`,active:L===`sticker`,onClick:()=>R(L===`sticker`?`none`:`sticker`),children:(0,V.jsx)(c,{className:`h-5 w-5`,strokeWidth:2.5})}),(0,V.jsx)(de,{label:`Draw`,active:L===`draw`,onClick:()=>R(L===`draw`?`none`:`draw`),children:(0,V.jsx)(t,{className:`h-5 w-5`,strokeWidth:2.5})})]}),extraDrawerContent:(0,V.jsxs)(V.Fragment,{children:[L===`sticker`&&(0,V.jsx)(ge,{onSelect:be}),L===`draw`&&(0,V.jsx)(Se,{onConfirm:xe,onCancel:()=>R(`none`)})]}),beforeCard:(0,V.jsx)(`div`,{className:`max-w-xl mx-auto w-full px-5 pb-2 pt-4 max-sidebar:pt-[calc(20px+2.5rem)]`,children:(0,V.jsxs)(`div`,{className:`flex items-center gap-2 min-w-0`,children:[(0,V.jsx)(`span`,{className:`text-sm font-medium text-muted-foreground shrink-0 w-14`,children:`To`}),!h&&!E?(0,V.jsx)(`div`,{className:`flex-1 min-w-0`,children:(0,V.jsx)(ue,{placeholder:`search for a person...`,onSelect:e=>D(e.pubkey),hideCountry:!0,className:`w-full`,inputClassName:`rounded-2xl bg-muted/60 border-0 focus-visible:ring-2 focus-visible:ring-primary/20 text-base h-auto py-2`})}):(0,V.jsx)(Me,{pubkey:E??h,onClear:h?void 0:()=>D(void 0)})]})}),bodyContent:({lineHeightPx:e,stationeryTextColor:t,stationeryLineColor:n,resolvedFontFamily:r})=>(0,V.jsx)(`textarea`,{ref:l,dir:`auto`,value:O,onFocus:()=>R(`none`),onChange:e=>{let t=e.target,n=e.target.value;if(n.length>je){t.value=O;return}if(n.length>O.length&&t.scrollHeight>t.clientHeight){t.value=O;return}ne(n)},maxLength:je,placeholder:`dear friend...`,className:`w-full flex-1 min-h-0 border-none shadow-none resize-none overflow-hidden focus:outline-none font-semibold tracking-wide`,style:{paddingTop:`0.5cqw`,paddingBottom:0,fontSize:`4.8cqw`,lineHeight:e>0?`${e}px`:`8.4cqw`,...e>0?{maxHeight:`${e*5+ye}px`}:{},letterSpacing:`0.06em`,fontFamily:r,color:t,caretColor:t,backgroundColor:`transparent`,...e>0?{backgroundImage:`linear-gradient(to bottom, transparent ${e-3}px, ${n} ${e-3}px)`,backgroundSize:`100% ${e}px`,backgroundRepeat:`repeat-y`}:{}}}),cardRef:f,cardOverlay:(0,V.jsx)(he,{stickers:z,editable:!0,onUpdate:Ce,onRemove:Q,containerRef:f})}),(0,V.jsx)(`div`,{className:`fixed bottom-fab right-6 z-30 sidebar:hidden`,children:(0,V.jsx)(le,{onClick:$,disabled:!Z||W,title:`Send letter`,icon:W?(0,V.jsx)(i,{size:18,className:`animate-spin`}):(0,V.jsx)(d,{strokeWidth:3,size:18})})}),(0,V.jsx)(`div`,{className:`hidden sidebar:block sticky bottom-6 z-30 pointer-events-none`,children:(0,V.jsx)(`div`,{className:`flex justify-end pr-4`,children:(0,V.jsx)(`div`,{className:`pointer-events-auto`,children:(0,V.jsx)(le,{onClick:$,disabled:!Z||W,title:`Send letter`,icon:W?(0,V.jsx)(i,{size:18,className:`animate-spin`}):(0,V.jsx)(d,{strokeWidth:3,size:18})})})})})]})]})}function Pe(){let e=k(),[t]=re(),n=t.get(`to`)??void 0;return oe({showFAB:!1,noOverscroll:!0,hasSubHeader:!0}),R({title:`Write a Letter`}),(0,V.jsx)(`main`,{className:`relative h-screen overflow-hidden`,style:{touchAction:`none`},children:(0,V.jsx)(Ne,{toPubkey:n,onClose:()=>e(`/letters`)})})}export{Pe as LetterComposePage}; // @license-end