import{k as V,j as r,t as X,m as G,n as Y,p as i,q as Z,i as o,v as ee,A as P,w as te,x as d,s as le}from"./web.Os7kOAdY.js";import{g as M,t as ae}from"./i18n-runtime._BAkvU05.js";var ne=P('<div class=tool-container><label class=field><span class=field-label></span><input type=text class=input></label><label class=field style=margin-top:12px><span class=field-label></span><input type=text class=input></label><div class=mobile-stack-grid style="display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;margin-top:12px"><label class=field><span class=field-label></span><input type=color class=input></label><label class=field><span class=field-label></span><input type=color class=input></label><label class=field><span class=field-label></span><input type=color class=input></label></div><div style=display:flex;gap:12px;margin-top:16px><button class=btn></button><button class="btn btn-secondary"></button></div><!$><!/>'),ie=P('<div style="margin-top:16px;border:1px solid var(--border);border-radius:8px;overflow:hidden"><img alt="OG Image preview"style=display:block;width:100%;height:auto>');function oe(){const[N,m]=r(M(),{equals:!1}),s=t=>ae(t,N());X(()=>{const t=n=>{const a=n.detail?.locale;a&&m(a)};window.addEventListener("taitan:locale-change",t),m(M()),le(()=>window.removeEventListener("taitan:locale-change",t))});const[f,R]=r("My Awesome Page"),[b,q]=r("A short description goes here"),[v,z]=r("#667eea"),[_,D]=r("#764ba2"),[h,F]=r("#ffffff"),[p,I]=r("");function O(){const a=document.createElement("canvas");a.width=1200,a.height=630;const e=a.getContext("2d"),c=e.createLinearGradient(0,0,1200,630);c.addColorStop(0,v()),c.addColorStop(1,_()),e.fillStyle=c,e.fillRect(0,0,1200,630),e.fillStyle=h(),e.textAlign="center",e.textBaseline="middle";const g=Math.min(72,1200/(f().length*.7+2));e.font=`bold ${g}px sans-serif`,e.fillText(f(),1200/2,630*.4,1080);const u=Math.min(32,1200/(b().length*.5+4));e.font=`${u}px sans-serif`,e.globalAlpha=.85,e.fillText(b(),1200/2,630*.6,1080),e.globalAlpha=1,I(a.toDataURL("image/png"))}function j(){const t=p();if(!t)return;const n=document.createElement("a");n.href=t,n.download="og-image.png",n.click()}return(()=>{var t=G(ne),n=t.firstChild,a=n.firstChild,e=a.nextSibling,c=n.nextSibling,g=c.firstChild,u=g.nextSibling,S=c.nextSibling,y=S.firstChild,C=y.firstChild,w=C.nextSibling,T=y.nextSibling,W=T.firstChild,k=W.nextSibling,B=T.nextSibling,E=B.firstChild,A=E.nextSibling,H=S.nextSibling,$=H.firstChild,x=$.nextSibling,U=H.nextSibling,[J,K]=Y(U.nextSibling);return i(a,()=>s("标题")),e.$$input=l=>R(l.currentTarget.value),i(g,()=>s("描述")),u.$$input=l=>q(l.currentTarget.value),i(C,()=>s("渐变起始色")),w.$$input=l=>z(l.currentTarget.value),i(W,()=>s("渐变结束色")),k.$$input=l=>D(l.currentTarget.value),i(E,()=>s("文字色")),A.$$input=l=>F(l.currentTarget.value),$.$$click=O,i($,()=>s("生成预览")),x.$$click=j,i(x,()=>s("下载 PNG")),i(t,(()=>{var l=Z(()=>!!p());return()=>l()&&(()=>{var L=G(ie),Q=L.firstChild;return o(()=>te(Q,"src",p())),L})()})(),J,K),o(()=>d(x,"disabled",!p())),o(()=>d(e,"value",f())),o(()=>d(u,"value",b())),o(()=>d(w,"value",v())),o(()=>d(k,"value",_())),o(()=>d(A,"value",h())),ee(),t})()}V(["input","click"]);export{oe as default};
