https://singaporebirds.com/assets/ShareCardScreen-D3PGWtM0.js

1import{b as vt,r as f,j as i}from"./react-vendor-eUQHqTr8.js";import{a as Ye,X as Xe,B as g,T as u,D as je,c as U}from"./index-Wm-ehMmj.js";import{B as jt}from"./BlogPostContent-BvgF4c8k.js";import"./MasonryGallery-BNQD0MFh.js";import"./Lightbox-D1sMHH8m.js";import"./SpeciesTitleBlock-DlZyAIQu.js";import"./Tooltip-QJmVpwZI.js";import"./PastRecordsTable-FBwGOZwD.js";import"./SeasonalityHeatmap-9aE3xtri.js";import"./speciesStatus-BtT3pfvN.js";function Ct(e,t){if(e.match(/^[a-z]+:\/\//i))return e;if(e.match(/^\/\//))return window.location.protocol+e;if(e.match(/^[a-z]+:/i))return e;const n=document.implementation.createHTMLDocument(),r=n.createElement("base"),o=n.createElement("a");return n.head.appendChild(r),n.body.appendChild(o),t&&(r.href=t),o.href=e,o.href}const Rt=(()=>{let e=0;const t=()=>`0000${(Math.random()*36**4<<0).toString(36)}`.slice(-4);return()=>(e+=1,`u${t()}${e}`)})();function E(e){const t=[];for(let n=0,r=e.length;n<r;n++)t.push(e[n]);return t}let W=null;function Ke(e={}){return W||(e.includeStyleProperties?(W=e.includeStyleProperties,W):(W=E(window.getComputedStyle(document.documentElement)),W))}function ce(e,t){const r=(e.ownerDocument.defaultView||window).getComputedStyle(e).getPropertyValue(t);return r?parseFloat(r.replace("px","")):0}function Ft(e){const t=ce(e,"border-left-width"),n=ce(e,"border-right-width");return e.clientWidth+t+n}function kt(e){const t=ce(e,"border-top-width"),n=ce(e,"border-bottom-width");return e.clientHeight+t+n}function Qe(e,t={}){const n=t.width||Ft(e),r=t.height||kt(e);return{width:n,height:r}}function Et(){let e,t;try{t=process}catch{}const n=t&&t.env?t.env.devicePixelRatio:null;return n&&(e=parseInt(n,10),Number.isNaN(e)&&(e=1)),e||window.devicePixelRatio||1}const j=16384;function Pt(e){(e.width>j||e.height>j)&&(e.width>j&&e.height>j?e.width>e.height?(e.height*=j/e.width,e.width=j):(e.width*=j/e.height,e.height=j):e.width>j?(e.height*=j/e.width,e.width=j):(e.width*=j/e.height,e.height=j))}function Tt(e,t={}){return e.toBlob?new Promise(n=>{e.toBlob(n,t.type?t.type:"image/png",t.quality?t.quality:1)}):new Promise(n=>{const r=window.atob(e.toDataURL(t.type?t.type:void 0,t.quality?t.quality:void 0).split(",")[1]),o=r.length,s=new Uint8Array(o);for(let l=0;l<o;l+=1)s[l]=r.charCodeAt(l);n(new Blob([s],{type:t.type?t.type:"image/png"}))})}function ue(e){return new Promise((t,n)=>{const r=new Image;r.onload=()=>{r.decode().then(()=>{requestAnimationFrame(()=>t(r))})},r.onerror=n,r.crossOrigin="anonymous",r.decoding="async",r.src=e})}async function Dt(e){return Promise.resolve().then(()=>new XMLSerializer().serializeToString(e)).then(encodeURIComponent).then(t=>`data:image/svg+xml;charset=utf-8,${t}`)}async function $t(e,t,n){const r="http://www.w3.org/2000/svg",o=document.createElementNS(r,"svg"),s=document.createElementNS(r,"foreignObject");return o.setAttribute("width",`${t}`),o.setAttribute("height",`${n}`),o.setAttribute("viewBox",`0 0 ${t} ${n}`),s.setAttribute("width","100%"),s.setAttribute("height","100%"),s.setAttribute("x","0"),s.setAttribute("y","0"),s.setAttribute("externalResourcesRequired","true"),o.appendChild(s),s.appendChild(e),Dt(o)}const v=(e,t)=>{if(e instanceof t)return!0;const n=Object.getPrototypeOf(e);return n===null?!1:n.constructor.name===t.name||v(n,t)};function Lt(e){const t=e.getPropertyValue("content");return`${e.cssText} content: '${t.replace(/'|"/g,"")}';`}function zt(e,t){return Ke(t).map(n=>{const r=e.getPropertyValue(n),o=e.getPropertyPriority(n);return`${n}: ${r}${o?" !important":""};`}).join(" ")}function At(e,t,n,r){const o=`.${e}:${t}`,s=n.cssText?Lt(n):zt(n,r);return document.createTextNode(`${o}{${s}}`)}function Me(e,t,n,r){const o=window.getComputedStyle(e,n),s=o.getPropertyValue("content");if(s===""||s==="none")return;const l=Rt();try{t.className=`${t.className} ${l}`}catch{return}const c=document.createElement("style");c.appendChild(At(l,n,o,r)),t.appendChild(c)}function Mt(e,t,n){Me(e,t,":before",n),Me(e,t,":after",n)}const Ie="application/font-woff",Be="image/jpeg",It={woff:Ie,woff2:Ie,ttf:"application/font-truetype",eot:"application/vnd.ms-fontobject",png:"image/png",jpg:Be,jpeg:Be,gif:"image/gif",tiff:"image/tiff",svg:"image/svg+xml",webp:"image/webp"};function Bt(e){const t=/\.([^./]*?)$/g.exec(e);return t?t[1]:""}function Fe(e){const t=Bt(e).toLowerCase();return It[t]||""}function Ht(e){return e.split(/,/)[1]}function Ce(e){return e.search(/^(data:)/)!==-1}function Wt(e,t){return`data:${t};base64,${e}`}async function Ze(e,t,n){const r=await fetch(e,t);if(r.status===404)throw new Error(`Resource "${r.url}" not found`);const o=await r.blob();return new Promise((s,l)=>{const c=new FileReader;c.onerror=l,c.onloadend=()=>{try{s(n({res:r,result:c.result}))}catch(h){l(h)}},c.readAsDataURL(o)})}const Se={};function Ot(e,t,n){let r=e.replace(/\?.*/,"");return n&&(r=e),/ttf|otf|eot|woff2?/i.test(r)&&(r=r.replace(/.*\//,"")),t?`[${t}]${r}`:r}async function ke(e,t,n){const r=Ot(e,t,n.includeQueryParams);if(Se[r]!=null)return Se[r];n.cacheBust&&(e+=(/\?/.test(e)?"&":"?")+new Date().getTime());let o;try{const s=await Ze(e,n.fetchRequestInit,({res:l,result:c})=>(t||(t=l.headers.get("Content-Type")||""),Ht(c)));o=Wt(s,t)}catch(s){o=n.imagePlaceholder||"";let l=`Failed to fetch resource: ${e}`;s&&(l=typeof s=="string"?s:s.message),l&&console.warn(l)}return Se[r]=o,o}async function Ut(e){const t=e.toDataURL();return t==="data:,"?e.cloneNode(!1):ue(t)}async function Vt(e,t){if(e.currentSrc){const s=document.createElement("canvas"),l=s.getContext("2d");s.width=e.clientWidth,s.height=e.clientHeight,l==null||l.drawImage(e,0,0,s.width,s.height);const c=s.toDataURL();return ue(c)}const n=e.poster,r=Fe(n),o=await ke(n,r,t);return ue(o)}async function _t(e,t){var n;try{if(!((n=e==null?void 0:e.contentDocument)===null||n===void 0)&&n.body)return await de(e.contentDocument.body,t,!0)}catch{}return e.cloneNode(!1)}async function qt(e,t){return v(e,HTMLCanvasElement)?Ut(e):v(e,HTMLVideoElement)?Vt(e,t):v(e,HTMLIFrameElement)?_t(e,t):e.cloneNode(Je(e))}const Gt=e=>e.tagName!=null&&e.tagName.toUpperCase()==="SLOT",Je=e=>e.tagName!=null&&e.tagName.toUpperCase()==="SVG";async function Yt(e,t,n){var r,o;

1if(Je(t))return t;let s=[];return Gt(e)&&e.assignedNodes?s=E(e.assignedNodes()):v(e,HTMLIFrameElement)&&(!((r=e.contentDocument)===null||r===void 0)&&r.body)?s=E(e.contentDocument.body.childNodes):s=E(((o=e.shadowRoot)!==null&&o!==void 0?o:e).childNodes),s.length===0||v(e,HTMLVideoElement)||await s.reduce((l,c)=>l.then(()=>de(c,n)).then(h=>{h&&t.appendChild(h)}),Promise.resolve()),t}function Xt(e,t,n){const r=t.style;if(!r)return;const o=window.getComputedStyle(e);o.cssText?(r.cssText=o.cssText,r.transformOrigin=o.transformOrigin):Ke(n).forEach(s=>{let l=o.getPropertyValue(s);s==="font-size"&&l.endsWith("px")&&(l=`${Math.floor(parseFloat(l.substring(0,l.length-2)))-.1}px`),v(e,HTMLIFrameElement)&&s==="display"&&l==="inline"&&(l="block"),s==="d"&&t.getAttribute("d")&&(l=`path(${t.getAttribute("d")})`),r.setProperty(s,l,o.getPropertyPriority(s))})}function Kt(e,t){v(e,HTMLTextAreaElement)&&(t.innerHTML=e.value),v(e,HTMLInputElement)&&t.setAttribute("value",e.value)}function Qt(e,t){if(v(e,HTMLSelectElement)){const n=t,r=Array.from(n.children).find(o=>e.value===o.getAttribute("value"));r&&r.setAttribute("selected","")}}function Zt(e,t,n){return v(t,Element)&&(Xt(e,t,n),Mt(e,t,n),Kt(e,t),Qt(e,t)),t}async function Jt(e,t){const n=e.querySelectorAll?e.querySelectorAll("use"):[];if(n.length===0)return e;const r={};for(let s=0;s<n.length;s++){const c=n[s].getAttribute("xlink:href");if(c){const h=e.querySelector(c),p=document.querySelector(c);!h&&p&&!r[c]&&(r[c]=await de(p,t,!0))}}const o=Object.values(r);if(o.length){const s="http://www.w3.org/1999/xhtml",l=document.createElementNS(s,"svg");l.setAttribute("xmlns",s),l.style.position="absolute",l.style.width="0",l.style.height="0",l.style.overflow="hidden",l.style.display="none";const c=document.createElementNS(s,"defs");l.appendChild(c);for(let h=0;h<o.length;h++)c.appendChild(o[h]);e.appendChild(l)}return e}async function de(e,t,n){return!n&&t.filter&&!t.filter(e)?null:Promise.resolve(e).then(r=>qt(r,t)).then(r=>Yt(e,r,t)).then(r=>Zt(e,r,t)).then(r=>Jt(r,t))}const Ne=/url\((['"]?)([^'"]+?)\1\)/g,Nt=/url\([^)]+\)\s*format\((["']?)([^"']+)\1\)/g,en=/src:\s*(?:url\([^)]+\)\s*format\([^)]+\)[,;]\s*)+/g;function tn(e){const t=e.replace(/([.*+?^${}()|\[\]\/\\])/g,"\\$1");return new RegExp(`(url\\(['"]?)(${t})(['"]?\\))`,"g")}function nn(e){const t=[];return e.replace(Ne,(n,r,o)=>(t.push(o),n)),t.filter(n=>!Ce(n))}async function rn(e,t,n,r,o){try{const s=n?Ct(t,n):t,l=Fe(t);let c;return o||(c=await ke(s,l,r)),e.replace(tn(t),`$1${c}$3`)}catch{}return e}function on(e,{preferredFontFormat:t}){return t?e.replace(en,n=>{for(;;){const[r,,o]=Nt.exec(n)||[];if(!o)return"";if(o===t)return`src: ${r};`}}):e}function et(e){return e.search(Ne)!==-1}async function tt(e,t,n){if(!et(e))return e;const r=on(e,n);return nn(r).reduce((s,l)=>s.then(c=>rn(c,l,t,n)),Promise.resolve(r))}async function O(e,t,n){var r;const o=(r=t.style)===null||r===void 0?void 0:r.getPropertyValue(e);if(o){const s=await tt(o,null,n);return t.style.setProperty(e,s,t.style.getPropertyPriority(e)),!0}return!1}async function sn(e,t){await O("background",e,t)||await O("background-image",e,t),await O("mask",e,t)||await O("-webkit-mask",e,t)||await O("mask-image",e,t)||await O("-webkit-mask-image",e,t)}async function an(e,t){const n=v(e,HTMLImageElement);if(!(n&&!Ce(e.src))&&!(v(e,SVGImageElement)&&!Ce(e.href.baseVal)))return;const r=n?e.src:e.href.baseVal,o=await ke(r,Fe(r),t);await new Promise((s,l)=>{e.onload=s,e.onerror=t.onImageErrorHandler?(...h)=>{try{s(t.onImageErrorHandler(...h))}catch(p){l(p)}}:l;const c=e;c.decode&&(c.decode=s),c.loading==="lazy"&&(c.loading="eager"),n?(e.srcset="",e.src=o):e.href.baseVal=o})}async function ln(e,t){const r=E(e.childNodes).map(o=>nt(o,t));await Promise.all(r).then(()=>e)}async function nt(e,t){v(e,Element)&&(await sn(e,t),await an(e,t),await ln(e,t))}function cn(e,t){const{style:n}=e;t.backgroundColor&&(n.backgroundColor=t.backgroundColor),t.width&&(n.width=`${t.width}px`),t.height&&(n.height=`${t.height}px`);const r=t.style;return r!=null&&Object.keys(r).forEach(o=>{n[o]=r[o]}),e}const He={};async function We(e){let t=He[e];if(t!=null)return t;const r=await(await fetch(e)).text();return t={url:e,cssText:r},He[e]=t,t}async function Oe(e,t){let n=e.cssText;const r=/url\(["']?([^"')]+)["']?\)/g,s=(n.match(/url\([^)]+\)/g)||[]).map(async l=>{let c=l.replace(r,"$1");return c.startsWith("https://")||(c=new URL(c,e.url).href),Ze(c,t.fetchRequestInit,({result:h})=>(n=n.replace(l,`url(${h})`),[l,h]))});return Promise.all(s).then(()=>n)}function Ue(e){if(e==null)return[];const t=[],n=/(\/\*[\s\S]*?\*\/)/gi;let r=e.replace(n,"");const o=new RegExp("((@.*?keyframes [\\s\\S]*?){([\\s\\S]*?}\\s*?)}

1)","gi");for(;;){const h=o.exec(r);if(h===null)break;t.push(h[0])}r=r.replace(o,"");const s=/@import[\s\S]*?url\([^)]*\)[\s\S]*?;/gi,l="((\\s*?(?:\\/\\*[\\s\\S]*?\\*\\/)?\\s*?@media[\\s\\S]*?){([\\s\\S]*?)}\\s*?})|(([\\s\\S]*?){([\\s\\S]*?)})",c=new RegExp(l,"gi");for(;;){let h=s.exec(r);if(h===null){if(h=c.exec(r),h===null)break;s.lastIndex=c.lastIndex}else c.lastIndex=s.lastIndex;t.push(h[0])}return t}async function un(e,t){const n=[],r=[];return e.forEach(o=>{if("cssRules"in o)try{E(o.cssRules||[]).forEach((s,l)=>{if(s.type===CSSRule.IMPORT_RULE){let c=l+1;const h=s.href,p=We(h).then(x=>Oe(x,t)).then(x=>Ue(x).forEach(b=>{try{o.insertRule(b,b.startsWith("@import")?c+=1:o.cssRules.length)}catch(R){console.error("Error inserting rule from remote css",{rule:b,error:R})}})).catch(x=>{console.error("Error loading remote css",x.toString())});r.push(p)}})}catch(s){const l=e.find(c=>c.href==null)||document.styleSheets[0];o.href!=null&&r.push(We(o.href).then(c=>Oe(c,t)).then(c=>Ue(c).forEach(h=>{l.insertRule(h,l.cssRules.length)})).catch(c=>{console.error("Error loading remote stylesheet",c)})),console.error("Error inlining remote css file",s)}}),Promise.all(r).then(()=>(e.forEach(o=>{if("cssRules"in o)try{E(o.cssRules||[]).forEach(s=>{n.push(s)})}catch(s){console.error(`Error while reading CSS rules from ${o.href}`,s)}}),n))}function dn(e){return e.filter(t=>t.type===CSSRule.FONT_FACE_RULE).filter(t=>et(t.style.getPropertyValue("src")))}async function hn(e,t){if(e.ownerDocument==null)throw new Error("Provided element is not within a Document");const n=E(e.ownerDocument.styleSheets),r=await un(n,t);return dn(r)}function rt(e){return e.trim().replace(/["']/g,"")}function fn(e){const t=new Set;function n(r){(r.style.fontFamily||getComputedStyle(r).fontFamily).split(",").forEach(s=>{t.add(rt(s))}),Array.from(r.children).forEach(s=>{s instanceof HTMLElement&&n(s)})}return n(e),t}async function gn(e,t){const n=await hn(e,t),r=fn(e);return(await Promise.all(n.filter(s=>r.has(rt(s.style.fontFamily))).map(s=>{const l=s.parentStyleSheet?s.parentStyleSheet.href:null;return tt(s.cssText,l,t)}))).join(`
2`)}async function pn(e,t){const n=t.fontEmbedCSS!=null?t.fontEmbedCSS:t.skipFonts?null:await gn(e,t);if(n){const r=document.createElement("style"),o=document.createTextNode(n);r.appendChild(o),e.firstChild?e.insertBefore(r,e.firstChild):e.appendChild(r)}}async function xn(e,t={}){const{width:n,height:r}=Qe(e,t),o=await de(e,t,!0);return await pn(o,t),await nt(o,t),cn(o,t),await $t(o,n,r)}async function mn(e,t={}){const{width:n,height:r}=Qe(e,t),o=await xn(e,t),s=await ue(o),l=document.createElement("canvas"),c=l.getContext("2d"),h=t.pixelRatio||Et(),p=t.canvasWidth||n,x=t.canvasHeight||r;return l.width=p*h,l.height=x*h,t.skipAutoScale||Pt(l),l.style.width=`${p}`,l.style.height=`${x}`,t.backgroundColor&&(c.fillStyle=t.backgroundColor,c.fillRect(0,0,l.width,l.height)),c.drawImage(s,0,0,l.width,l.height),l}async function yn(e,t={}){const n=await mn(e,t);return await Tt(n)}const m={ink:"#1F2D26",panel:"#F8FBF6",cream:"#F5F1E7",creamDim:"rgba(245,241,231,0.82)",forest:"#1F2D26",forestDim:"#4A5C52"},F={clay:{id:"clay",label:"Clay",hex:"#C77942"},sage:{id:"sage",label:"Sage",hex:"#2E6B5A"},sky:{id:"sky",label:"Sky",hex:"#356E80"}},Ve={story:{id:"story",w:1080,h:1920,label:"Story",ratio:"9 : 16"},portrait:{id:"portrait",w:1080,h:1350,label:"Portrait",ratio:"4 : 5"},square:{id:"square",w:1080,h:1080,label:"Square",ratio:"1 : 1"}},bn=[{label:"Clay",value:F.clay.hex},{label:"Sage",value:F.sage.hex},{label:"Forest",value:m.forest},{label:"Cream",value:m.cream},{label:"White",value:"#FFFFFF"},{label:"Transparent",value:"transparent"}],wn=[{label:"Cream",value:m.cream},{label:"White",value:"#FFFFFF"},{label:"Forest",value:m.forest},{label:"Clay",value:F.clay.hex}],le=(e,t,n)=>Math.max(t,Math.min(n,e));function it(e){if(!e)return"";try{return new Date(e).toLocaleDateString("en-SG",{day:"numeric",month:"long",year:"numeric"})}catch{return""}}function Sn(e){if(!e)return"";const t=Object.entries(e).filter(([n,r])=>r&&!jt.has(n));return t.length?(t.sort(([n],[r])=>n==="by"?-1:r==="by"?1:0),String(t[0][1])):""}const _e=820;function vn(){const[e,t]=f.useState(()=>typeof window<"u"&&typeof window.matchMedia=="function"&&window.matchMedia(`(max-width: ${_e-1}px)`).matches);return f.useEffect(()=>{if(typeof window>"u"||typeof window.matchMedia!="function")return;const n=window.matchMedia(`(max-width: ${_e-1}px)`),r=()=>t(n.matches);return r(),n.addEventListener("change",r),()=>n.removeEventListener("change",r)},[]),e}function jn(){const e=f.useRef(null),[t,n]=f.useState({w:0,h:0});return f.useEffect(()=>{const r=e.current;if(!r||typeof ResizeObserver>"u")return;const o=new ResizeObserver(s=>{const l=s[0].contentRect;n({w:l.width,h:l.height})});return o.observe(r),()=>o.disconnect()},[]),[e,t]}function qe({dark:e,logo:t=64}){const n=t/20;return i.jsxs("div",{style:{display:"flex",alignItems:"center",gap:5*n,transform:`translateY(-${t}px)`},children:[i.jsx("img",{src:"/logo.png",alt:"",style:{width:t,height:t,objectFit:"contain",flexShrink:0}}),i.jsxs("div",{children:[i.jsx("div",{style:{fontFamily:g,fontWeight:700,fontStyle:"italic",fontSize:13*n,letterSpacing:-.5*n,position:"relative",left:-5*n,lineHeight:1,color:e?m.cream:m.forest},children:"Birds of Singapore"}),i.jsx("div",{style:{fontFamily:g,fontSize:8*n,letterSpacing:-.4*n,color:e?"#A8C9B5":"rgb(80,121,51)"},children:"by the Bird Society of Singapore"})]})]})}function Cn(e,t,n,r){const o=f.useRef(null),s=f.useRef(null),[l,c]=f.useState(e);return f.useLayoutEffect(()=>{const h=o.current,p=s.current;if(!h||!p){c(e);return}let x=e;for(p.style.fontSize=`${x}px`;x>t&&p.scrollHeight>h.clientHeight+1;)x-=2,p.style.fontSize=`${x}px`;c(x)},[e,t,r,...n]),{wrapRef:o,textRef:s,size:l}}function Rn({fmt:e,layout:t,accent:n,photoSrc:r,focal:o,zoom:s,imgAspect:l,eyebrow:c,title:h,meta:p,titleScale:x,caption:b,captionPos:R,captionDrag:D,captionBg:Z,captionColor:he,captionSize:$,captionWidth:L}){const C=F[n].hex,V=t==="plate",[J,k]=f.useState(!1);f.useEffect(()=>{var Y;let I=!0;return(Y=document.fonts)!=null&&Y.ready?document.fonts.ready.then(()=>{I&&k(!0)}):k(!0),()=>{I=!1}},[]);const N=V?e.id==="story"?104:e.id==="portrait"?94:86:e.id==="story"?82:e.id==="portrait"?76:72,P=Math.round(N*x),z=Cn(P,Math.min(36,P),[h,e.id],J),A=V?P:z.size,fe=Math.round(e.h*.62),M=Z||"transparent",_=M==="transparent",T=$||36,ee=b?i.jsx("div",{...D||{},style:{position:"absolute",left:`${R.x}%`,top:`${R.y}%`,transform:"translate(-50%, -50%)",width:`${L||70}%`,maxWidth:"96%",boxSizing:"border-box",padding:_?0:`${Math.round(T*.55)}px ${Math.round(T*.9)}px`,borderRadius:999,background:M,color:he||m.cream,fontFamily:g,fontWeight:700,fontSize:T,letterSpacing:-.5,lineHeight:1.2,textAlign:"center",boxShadow:_?"none":"0 8px 26px rgba(0,0,0,0.28)",textShadow:_?"0 2px 10px rgba(0,0,0,0.55)":"none",cursor:D?"move":"default",touchAction:"none",userSelect:"none"},children:b}):null,q=i.jsx("div",{style:{position:"absolute",inset:0,overflow:"hidden",background:`linear-gradient(150deg, ${m.ink}, ${F.sage.hex})`},children:r?i.jsx("img",{src:r,alt:"",draggable:!1,style:{width:"100%",height:"100%",objectFit:"cover",objectPosition:`${o.x}% ${o.y}%`,transform:`scale(${s})`,transformOrigin:`${o.x}% ${o.y}%`,pointerEvents:"none",userSelect:"none",WebkitUserDrag:"none"}}):i.jsxs("div",{style:{position:"absolute",inset:0,display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",gap:22},children:[i.jsx("img",{src:"/logo.png",alt:"",style:{width:150,height:150,opacity:.5}}),i.jsx("div",{style:{fontFamily:g,fontSize:30,color:m.creamDim,letterSpacing:.5},children:"Add a photo →"})]})});if(V)return i.jsxs("div",{style:{position:"relative",width:e.w,height:e.h,overflow:"hidden",background:m.ink,fontFamily:g},children:[q,i.jsx("div",{style:{position:"absolute",top:0,left:0,right:0,height:Math.round(e.h*.24),background:"linear-gradient(to bottom, rgba(31,45,38,0.72), transparent)"}}),i.jsx("div",{style:{position:"absolute",left:0,right:0,bottom:0,height:Math.round(e.h*.62),background:`linear-gradient(to top, ${m.ink} 2%, rgba(31,45,38,0.88) 22%, transparent 100%)`}}),i.jsx("div",{style:{position:"absolute",inset:44,border:"2px s

2olid rgba(245,241,231,0.5)",borderRadius:6,pointerEvents:"none"}}),i.jsx("div",{style:{position:"absolute",top:e.id==="story"?Math.round(e.h*.13):68,left:74},children:i.jsx(qe,{dark:!0,logo:72})}),i.jsxs("div",{style:{position:"absolute",left:74,right:74,bottom:80},children:[c?i.jsxs("div",{style:{display:"flex",alignItems:"center",gap:14,marginBottom:22},children:[i.jsx("span",{style:{width:17,height:17,borderRadius:"50%",background:C,flexShrink:0}}),i.jsx("span",{style:{fontFamily:U,fontSize:32,fontWeight:600,letterSpacing:3.4,textTransform:"uppercase",color:m.cream},children:c})]}):null,i.jsx("div",{style:{maxHeight:fe,overflow:"hidden"},children:i.jsx("div",{style:{fontFamily:je,fontWeight:600,fontSize:A,lineHeight:1.05,letterSpacing:-2,color:m.cream,paddingBottom:2},children:h})}),p?i.jsxs(i.Fragment,{children:[i.jsx("div",{style:{width:76,height:4,background:C,borderRadius:2,margin:"26px 0 18px"}}),i.jsx("div",{style:{fontFamily:g,fontSize:34,color:m.creamDim,lineHeight:1.3},children:p})]}):null]}),ee]});const te=58,ge=te*2+96+130+(c?56:0)+(p?96:0),G=l?Math.min(Math.round(e.w/l),e.h-ge):Math.round(e.h*(e.id==="portrait"?.58:e.id==="story"?.56:.55));return i.jsxs("div",{style:{position:"relative",width:e.w,height:e.h,overflow:"hidden",background:m.panel,fontFamily:g},children:[i.jsx("div",{style:{position:"absolute",top:0,left:0,right:0,height:G,overflow:"hidden"},children:q}),i.jsxs("div",{style:{position:"absolute",top:G,left:0,right:0,bottom:0,borderTop:`6px solid ${C}`,background:m.panel,padding:te,display:"flex",flexDirection:"column"},children:[c?i.jsxs("div",{style:{display:"flex",alignItems:"center",gap:13,marginBottom:20},children:[i.jsx("span",{style:{width:16,height:16,borderRadius:"50%",background:C,flexShrink:0}}),i.jsx("span",{style:{fontFamily:U,fontSize:31,fontWeight:600,letterSpacing:3.4,textTransform:"uppercase",color:C},children:c})]}):null,i.jsx("div",{ref:z.wrapRef,style:{flex:"1 1 auto",minHeight:0,overflow:"hidden"},children:i.jsx("div",{ref:z.textRef,style:{fontFamily:je,fontWeight:600,fontSize:A,lineHeight:1.05,letterSpacing:-2,color:m.forest,paddingBottom:2},children:h})}),p?i.jsxs(i.Fragment,{children:[i.jsx("div",{style:{width:72,height:4,background:C,borderRadius:2,margin:"24px 0 16px"}}),i.jsx("div",{style:{fontFamily:g,fontSize:33,color:m.forestDim,lineHeight:1.3},children:p})]}):null,i.jsx("div",{style:{marginTop:28},children:i.jsx(qe,{dark:!1,logo:64})})]}),ee]})}function Q({children:e}){return i.jsx("div",{style:{fontFamily:U,fontSize:12,fontWeight:700,letterSpacing:1.2,textTransform:"uppercase",color:u.textMute,margin:"0 0 10px"},children:e})}function Fn({options:e,value:t,onChange:n}){return i.jsx("div",{style:{display:"flex",gap:4,background:u.panelHi,padding:4,borderRadius:10,border:`1px solid ${u.ruleSoft}`},children:e.map(r=>{const o=r.id===t;return i.jsxs("button",{onClick:()=>n(r.id),style:{flex:1,padding:"7px 6px",border:"none",borderRadius:7,cursor:"pointer",background:o?u.panel:"transparent",boxShadow:o?"0 1px 3px rgba(0,40,30,0.12)":"none",color:o?u.text:u.textDim,fontFamily:g,fontSize:12.5,fontWeight:o?700:500,lineHeight:1.1},children:[i.jsx("div",{children:r.label}),r.sub?i.jsx("div",{style:{fontFamily:U,fontSize:10.5,color:o?u.textMute:u.textMute,letterSpacing:.5,marginTop:2},children:r.sub}):null]},r.id)})})}function kn({mode:e}){const t="currentColor";return i.jsxs("svg",{width:"56",height:"72",viewBox:"0 0 56 72",fill:"none",style:{display:"block"},children:[i.jsx("rect",{x:"1.5",y:"1.5",width:"53",height:"69",rx:"5",stroke:t,strokeWidth:"2",opacity:"0.5"}),e==="overlay"?i.jsxs(i.Fragment,{children:[i.jsx("rect",{x:"4",y:"4",width:"48",height:"64",rx:"3",fill:t,opacity:"0.12"}),i.jsx("circle",{cx:"18",cy:"24",r:"7",fill:t,opacity:"0.3"}),i.jsx("rect",{x:"10",y:"50",width:"30",height:"4.5",rx:"2.25",fill:t}),i.jsx("rect",{x:"10",y:"58",width:"22",height:"4.5",rx:"2.25",fill:t,opacity:"0.7"})]}):i.jsxs(i.Fragment,{children:[i.jsx("rect",{x:"4",y:"4",width:"48",height:"38",rx:"3",fill:t,opacity:"0.18"}),i.jsx("circle",{cx:"18",cy:"22",r:"7",fill:t,opacity:"0.32"}),i.jsx("rect",{x:"4",y:"44",width:"48",height:"2.5",fill:t}),i.jsx("rect",{x:"10",y:"52",width:"30",height:"4.5",rx:"2.25",fill:t}),i.jsx("rect",{x:"10",y:"60",width:"22",height:"4.5",rx:"2.25",fill:t,opacity:"0.7"})]})]})}

2function En({value:e,onChange:t}){const n=[{id:"plate",label:"Overlay",glyph:"overlay"},{id:"label",label:"Split",glyph:"split"}];return i.jsx("div",{style:{display:"flex",gap:10},children:n.map(r=>{const o=r.id===e;return i.jsxs("button",{onClick:()=>t(r.id),style:{flex:1,display:"flex",flexDirection:"column",alignItems:"center",gap:8,padding:"14px 6px 11px",borderRadius:10,cursor:"pointer",background:o?u.sageSoft:u.panelHi,border:`1.5px solid ${o?u.sage:u.ruleSoft}`,color:o?u.sage:u.textDim},children:[i.jsx(kn,{mode:r.glyph}),i.jsx("span",{style:{fontFamily:g,fontSize:13,fontWeight:o?700:500,color:o?u.text:u.textDim},children:r.label})]},r.id)})})}function Ge({options:e,value:t,onChange:n}){return i.jsx("div",{style:{display:"flex",flexWrap:"wrap",gap:8},children:e.map(r=>{const o=r.value===t,s=r.value==="transparent";return i.jsx("button",{onClick:()=>n(r.value),title:r.label,style:{width:30,height:30,borderRadius:8,cursor:"pointer",padding:0,background:s?"repeating-conic-gradient(#bbb 0% 25%, #fff 0% 50%) 50% / 10px 10px":r.value,border:o?`2.5px solid ${u.sage}`:`1px solid ${u.rule}`,boxShadow:o?`0 0 0 2px ${u.panel} inset`:"none"}},r.label)})})}function ve({label:e,value:t,onChange:n}){return i.jsxs("label",{style:{display:"flex",alignItems:"center",justifyContent:"space-between",cursor:"pointer",padding:"6px 0"},children:[i.jsx("span",{style:{fontFamily:g,fontSize:13.5,color:u.text},children:e}),i.jsx("span",{onClick:()=>n(!t),style:{width:40,height:23,borderRadius:999,padding:2,flexShrink:0,background:t?u.sage:u.rule,transition:"background 0.15s",display:"flex",justifyContent:t?"flex-end":"flex-start"},children:i.jsx("span",{style:{width:19,height:19,borderRadius:"50%",background:"#fff",boxShadow:"0 1px 2px rgba(0,0,0,0.25)"}})})]})}const Re={width:"100%",boxSizing:"border-box",padding:"8px 10px",border:`1px solid ${u.rule}`,borderRadius:8,background:u.panel,color:u.text,fontFamily:g,fontSize:13.5,outline:"none"};function Pn({onPick:e,selectedSlug:t}){const[n,r]=f.useState(""),[o,s]=f.useState(null),[l,c]=f.useState(null);return f.useEffect(()=>{let h=!0;return c(null),s(null),Ye.blogList(1,24,null,n.trim()||null).then(p=>{h&&s(p.posts||[])}).catch(p=>{h&&c(p.message||"Could not load posts")}),()=>{h=!1}},[n]),i.jsxs("div",{children:[i.jsx("input",{value:n,onChange:h=>r(h.target.value),placeholder:"Search posts…",style:{...Re,marginBottom:10}}),i.jsxs("div",{style:{maxHeight:280,overflowY:"auto",display:"flex",flexDirection:"column",gap:6,paddingRight:2},children:[l&&i.jsx("div",{style:{fontFamily:g,fontSize:13,color:u.coral},children:l}),!o&&!l&&i.jsx("div",{style:{fontFamily:g,fontSize:13,color:u.textMute},children:"Loading…"}),o&&o.length===0&&i.jsx("div",{style:{fontFamily:g,fontSize:13,color:u.textMute},children:"No posts found."}),o&&o.map(h=>{var b,R;const p=h.slug===t,x=((R=(b=h.featuredImageVariants)==null?void 0:b.small)==null?void 0:R.url)||h.featuredImage;return i.jsxs("button",{onClick:()=>e(h),style:{display:"flex",gap:10,alignItems:"center",textAlign:"left",cursor:"pointer",padding:7,borderRadius:9,border:`1px solid ${p?u.sage:u.ruleSoft}`,background:p?u.sageSoft:u.panel},children:[i.jsx("div",{style:{width:46,height:46,borderRadius:6,flexShrink:0,overflow:"hidden",background:u.panelHi},children:x&&i.jsx("img",{src:x,alt:"",style:{width:"100%",height:"100%",objectFit:"cover"}})}),i.jsxs("div",{style:{minWidth:0},children:[i.jsx("div",{style:{fontFamily:g,fontSize:13,fontWeight:600,color:u.text,lineHeight:1.25,display:"-webkit-box",WebkitLineClamp:2,WebkitBoxOrient:"vertical",overflow:"hidden"},children:Xe(h.title)}),i.jsx("div",{style:{fontFamily:U,fontSize:11,color:u.textMute,letterSpacing:.4,marginTop:2},children:it(h.publishedAt)})]})]},h.slug)})]})]})}function Wn(){const e=vt(),t=vn();f.useEffect(()=>{const a=document.title;document.title="Share Card Studio";const d=document.createElement("meta");return d.name="robots",d.content="noindex,nofollow",document.head.appendChild(d),()=>{d.remove(),document.title=a}},[]);const[n,r]=f.useState("story"),[o,s]=f.useState("plate"),l="clay",[c,h]=f.useState(null),[p,x]=f.useState(null),[b,R]=f.useState(null),[D,Z]=f.useState(!1),[he,$]=f.useState({x:50,y:50}),[L,C]=f.useState(1),[V,J]=f.useState(null);f.useEffect(()=>{if(!b){J(null);return}let a=!0;const d=new Image;return d.onload=()=>

2{a&&d.naturalWidth&&J(d.naturalWidth/d.naturalHeight)},d.src=b,()=>{a=!1}},[b]);const[k,N]=f.useState([]),[P,z]=f.useState("Select a blog post to begin"),[A,fe]=f.useState(!0),[M,_]=f.useState(!0),[T,ee]=f.useState(!1),[q,te]=f.useState("Check out our latest blog post!"),[ge,G]=f.useState({x:50,y:82}),[I,Y]=f.useState(F.clay.hex),[Ee,ot]=f.useState(m.cream),[pe,st]=f.useState(36),[xe,at]=f.useState(70),[me,Pe]=f.useState(.6),[X,Te]=f.useState(!1),[De,ne]=f.useState(null),$e=f.useRef(null),ye=f.useRef(null),[lt,re]=jn(),S=Ve[n],ie=a=>{var d,y,w,se;return((y=(d=a==null?void 0:a.featuredImageVariants)==null?void 0:d.large)==null?void 0:y.url)||((se=(w=a==null?void 0:a.featuredImageVariants)==null?void 0:w.medium)==null?void 0:se.url)||(a==null?void 0:a.featuredImage)||null},be=f.useCallback(async a=>{const d=ie(a);if(!d)return!1;Z(!0);try{const y=await fetch(`/api/share-card/image-proxy?url=${encodeURIComponent(d)}`,{credentials:"include"});if(!y.ok)throw new Error(`hero ${y.status}`);const w=await y.blob(),se=await new Promise((wt,St)=>{const ae=new FileReader;ae.onload=()=>wt(ae.result),ae.onerror=St,ae.readAsDataURL(w)});return R(se),$({x:50,y:50}),C(1),!0}catch{return ne("Could not load the post featured image. Upload the image directly instead."),!1}finally{Z(!1)}},[]),ct=f.useCallback(async a=>{x(a.slug),ne(null);let d=a;try{d=await Ye.blogPost(a.slug)}catch{}h(d),z(Xe(d.title||a.title||""));const y=(d.categories||d.tags||[]).filter(Boolean);N(y),be(d)},[be]),ut=f.useCallback(a=>

2{if(!a)return;const d=new FileReader;d.onload=()=>{R(d.result),$({x:50,y:50}),C(1)},d.readAsDataURL(a)},[]),B=f.useRef(null),dt=a=>{if(b){a.preventDefault(),B.current={x:a.clientX,y:a.clientY};try{a.currentTarget.setPointerCapture(a.pointerId)}catch{}}},ht=a=>{if(!B.current)return;const d=a.clientX-B.current.x,y=a.clientY-B.current.y;B.current={x:a.clientX,y:a.clientY},$(w=>({x:le(w.x-d*.18/L,0,100),y:le(w.y-y*.18/L,0,100)}))},Le=()=>{B.current=null},ft=f.useMemo(()=>{const a=[];if(A){const d=Sn(c==null?void 0:c.byline);d&&a.push(d)}if(M){const d=it(c==null?void 0:c.publishedAt);d&&a.push(d)}return a.join("   ·   ")},[A,M,c]),we=f.useMemo(()=>{const a=((c==null?void 0:c.categories)||[]).filter(Boolean),d=a.length?[...a]:["From the Blog"];return k.forEach(y=>{d.includes(y)||d.push(y)}),[...new Set(d)]},[c,k]),gt=f.useCallback(a=>{N(d=>d.includes(a)?d.filter(y=>y!==a):[...d,a])},[]),pt=f.useMemo(()=>we.filter(a=>k.includes(a)).join("  ·  "),[we,k]),ze=t?32:56,K=re.w&&re.h?Math.min((re.w-ze)/S.w,(re.h-ze)/S.h):.2,H=f.useRef(null),xt=a=>{a.stopPropagation(),H.current={x:a.clientX,y:a.clientY},a.currentTarget.setPointerCapture(a.pointerId)},mt=a=>{if(!H.current)return;a.stopPropagation();const d=a.clientX-H.current.x,y=a.clientY-H.current.y;H.current={x:a.clientX,y:a.clientY},G(w=>({x:le(w.x+d/K/S.w*100,0,100),y:le(w.y+y/K/S.h*100,0,100)}))},Ae=a=>{a.stopPropagation(),H.current=null},yt={onPointerDown:xt,onPointerMove:mt,onPointerUp:Ae,onPointerLeave:Ae},bt=f.useCallback(async()=>{var a;if(ye.current){Te(!0),ne(null);try{if((a=document.fonts)!=null&&a.ready)try{await document.fonts.ready}catch{}const d=await yn(ye.current,{width:S.w,height:S.h,pixelRatio:1,cacheBust:!1,backgroundColor:o==="label"?m.panel:m.ink,style:{transform:"none",transformOrigin:"top left",margin:"0"}});if(!d)throw new Error("Export produced no image.");const y=URL.createObjectURL(d),w=document.createElement("a");w.href=y,w.download=`${(p||"share-card").slice(0,60)}-${n}.png`,document.body.appendChild(w),w.click(),w.remove(),URL.revokeObjectURL(y)}catch(d){ne((d==null?void 0:d.message)||"Export failed. If the photo is a post featured image, try re-selecting it or upload the file directly.")}finally{Te(!1)}}},[S,o,p,n]),oe=b&&P;return i.jsxs("div",{style:{position:"fixed",inset:0,display:"flex",flexDirection:"column",background:u.ink,color:u.text,fontFamily:g},children:[i.jsxs("header",{style:{flexShrink:0,display:"flex",alignItems:"center",gap:16,flexWrap:"wrap",rowGap:10,padding:t?"10px 14px":"10px 18px",background:u.panelHi,borderBottom:`1px solid ${u.rule}`},children:[i.jsx("button",{onClick:()=>e("/"),style:{display:"inline-flex",alignItems:"center",gap:6,padding:"6px 12px",background:"transparent",border:`1px solid ${u.rule}`,borderRadius:8,color:u.textDim,fontFamily:g,fontSize:13,cursor:"pointer"},children:"← Exit"}),i.jsx("div",{children:i.jsx("div",{style:{fontFamily:je,fontSize:17,fontWeight:600,letterSpacing:-.4,color:u.text},children:"Sharing Studio"})}),i.jsx("div",{style:{flex:1}}),De&&i.jsx("div",{style:{fontFamily:g,fontSize:12,color:u.coral,maxWidth:320,textAlign:"right"},children:De}),i.jsx("button",{onClick:bt,disabled:!oe||X,style:{padding:"10px 18px",borderRadius:9,border:"none",background:oe&&!X?u.amber:u.rule,color:oe&&!X?u.onAmber:u.textMute,fontFamily:g,fontSize:13.5,fontWeight:700,cursor:oe&&!X?"pointer":"default"},children:X?"Rendering…":`Download PNG · ${S.w}×${S.h}`})]}),i.jsxs("div",{style:{flex:1,display:"flex",flexDirection:t?"column":"row",minHeight:0},children:[i.jsxs("aside",{style:{width:t?"100%":372,flexShrink:0,flex:t?"1 1 auto":"0 0 auto",order:t?2:0,overflowY:"auto",background:u.panel,borderRight:t?"none":`1px solid ${u.rule}`,borderTop:t?`1px solid ${u.rule}`:"none",padding:20,display:"flex",flexDirection:"column",gap:24},children:[i.jsxs("section",{children:[i.jsx(Q,{children:"1 · Blog post"}),i.jsx(Pn,{onPick:ct,selectedSlug:p})]}),i.jsxs("section",{children:[i.jsx(Q,{children:"2 · Format"}),i.jsx(Fn,{value:n,onChange:r,options:Object.values(Ve).map(a=>({id:a.id,label:a.label,sub:a.ratio}))})]}),i.jsxs("section",{children:[i.jsx(Q,{children:"3 · Layout"}),i.jsx(En,{value:o,onChange:s})]}),i.jsxs("section",{children:[i.jsx(Q,{children:"4 · Photo"}),i.jsx("input",{ref:$e,type:"file",accept:"image/*",style:{display:"none"},onChange:a=>{var d;return ut((d=a.target.files)==null?void 0:d[0])}}),i.jsxs("div",{style:{display:"flex",gap:8},children:[i.jsx("button",{onClick:()=>{var a;return(a=$e.current)==null?void 0:a.click()},style:{flex:1,padding:"9px 10px",borderRadius:8,cursor:"pointer",background:u.sage,color:u.onAmber,border:"none",fontFamily:g,fontSize:13,fontWeight:700},children:"Upload photo"}),i.jsx("button",{onClick:()=>be(c),disabled:!ie(c)||D,style:{flex:1,padding:"9px 10px",borderRadius:8,background:"transparent",border:`1px solid ${u.rule}`,color:ie(c)?u.text:u.textMute,fontFamily:g,fontSize:13,fontWeight:600,cursor:ie(c)&&!D?"pointer":"default"},children:D?"Loading…":"Use post featured image"})]}),b&&i.jsxs("div",{style:{marginTop:12},children:[i.jsxs("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between",marginBottom:4},children:[i.jsx("span",{style:{fontFamily:g,fontSize:12.5,color:u.textDim},children:"Zoom"}),i.jsx("button",{onClick:()=>{C(1),$({x:50,y:50})},style:{background:"none",border:"none",cursor:"pointer",fontFamily:g,fontSize:11.5,color:u.amber,padding:0},children:"Reset"})]}),i.jsx("input",{type:"range",min:"1",max:"2.5",step:"0.01",value:L,onChange:a=>C(parseFloat(a.target.value)),style:{width:"100%",accentColor:F.sage.hex}}),i.jsx("div",{style:{fontFamily:g,fontSize:11.5,color:u.textMute,marginTop:4},children:"Drag the preview to reposition."})]})]}),i.jsxs("section",{children:[i.jsx(Q,{children:"5 · Text"}),i.jsxs("div",{style:{marginBottom:12},children:[i.jsx("div",{style:{fontFamily:g,fontSize:12,color:u.textDim,marginBottom:6},children:"Labels (post categories)"}),i.jsx("div",{style:{display:"flex",flexWrap:"wrap",gap:6},children:we.map(a=>{const d=k.includes(a);return i.jsx("button",{onClick:()=>gt(a),style:{padding:"5px 11px",borderRadius:999,cursor:"pointer",fontFamily:U,fontSize:11.5,fontWeight:600,letterSpacing:.4,textTransform:"uppercase",background:d?u.sage:"transparent",color:d?u.onAmber:u.textDim,border:`1px solid ${d?u.sage:u.rule}`},children:a},a)})})]}),i.jsxs("div",{style:{marginBottom:10},children:[i.jsx("div",{style:{fontFamily:g,fontSize:12,color:u.textDim,marginBottom:4},children:"Title"}),i.jsx("textarea",{value:P,onChange:a=>z(a.target.value),rows:3,style:{...Re,resize:"vertical",lineHeight:1.35}})]}),i.jsxs("div",{style:{marginBottom:12},children:[i.jsxs("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between",marginBottom:4},children:[i.jsxs("span",{style:{fontFamily:g,fontSize:12,color:u.textDim},children:["Title size · ",Math.round(me*100),"%"]}),i.jsx("button",{onClick:()=>Pe(.6),style:{background:"none",border:"none",cursor:"pointer",fontFamily:g,fontSize:11.5,color:u.amber,padding:0},children:"Reset"})]}),i.jsx("input",{type:"range",min:"0.5",max:"2.6",step:"0.02",value:me,onChange:a=>Pe(parseFloat(a.target.value)),style:{width:"100%",accentColor:F.sage.hex}})]}),i.jsx(ve,{label:"Show author",value:A,onChange:fe}),i.jsx(ve,{label:"Show date",value:M,onChange:_}),i.jsx(ve,{label:"Add text box",value:T,onChange:ee}),T&&i.jsxs(i.Fragment,{children:[i.jsx("textarea",{value:q,onChange:a=>te(a.target.value),rows:2,placeholder:"Check out our latest blog post!",style:{...Re,marginTop:8,resize:"vertical",lineHeight:1.35}}),i.jsxs("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between",marginTop:6},children:[i.jsx("span",{style:{fontFamily:g,fontSize:11.5,color:u.textMute},children:"Drag the text box on the preview to place it."}),i.jsx("button",{onClick:()=>G({x:50,y:82}),style:{background:"none",border:"none",cursor:"pointer",fontFamily:g,fontSize:11.5,color:u.amber,padding:0,flexShrink:0,marginLeft:8},children:"Reset position"})]}),i.jsxs("div",{style:{marginTop:12},children:[i.jsx("div",{style:{fontFamily:g,fontSize:12,color:u.textDim,marginBottom:6},children:"Box colour"}),i.jsx(Ge,{options:bn,value:I,onChange:Y})]}),i.jsxs("div",{style:{marginTop:12},children:[i.jsx("div",{style:{fontFamily:g,fontSize:12,color:u.textDim,marginBottom:6},children:"Text colour"}),i.jsx(Ge,{options:wn,value:Ee,onChange:ot})]}),i.jsxs("div",{style:{marginTop:12},children:[i.jsxs("div",{style:{fontFamily:g,fontSize:12,color:u.textDim,marginBottom:4},children:["Text size · ",pe,"px"]}),i.jsx("input",{type:"range",min:"20",max:"80",step:"1",value:pe,onCh

2ange:a=>st(parseInt(a.target.value,10)),style:{width:"100%",accentColor:F.sage.hex}})]}),i.jsxs("div",{style:{marginTop:12},children:[i.jsxs("div",{style:{fontFamily:g,fontSize:12,color:u.textDim,marginBottom:4},children:["Box width · ",xe,"%"]}),i.jsx("input",{type:"range",min:"25",max:"96",step:"1",value:xe,onChange:a=>at(parseInt(a.target.value,10)),style:{width:"100%",accentColor:F.sage.hex}})]})]})]})]}),i.jsx("main",{ref:lt,style:{minWidth:0,display:"flex",alignItems:"center",justifyContent:"center",flex:t?"0 0 44vh":1,order:t?1:0,background:"repeating-conic-gradient("+u.ink+" 0% 25%, "+u.panelHi+" 0% 50%) 50% / 28px 28px",padding:t?16:28,overflow:"hidden"},children:i.jsx("div",{style:{width:S.w*K,height:S.h*K,position:"relative",borderRadius:6,overflow:"hidden",boxShadow:"0 18px 50px rgba(0,0,0,0.45)",cursor:b?"grab":"default",touchAction:"none",userSelect:"none"},onPointerDown:dt,onPointerMove:ht,onPointerUp:Le,onPointerLeave:Le,onDragStart:a=>a.preventDefault(),children:i.jsx("div",{ref:ye,style:{width:S.w,height:S.h,transform:`scale(${K})`,transformOrigin:"top left"},children:i.jsx(Rn,{fmt:S,layout:o,accent:l,photoSrc:b,focal:he,zoom:L,imgAspect:V,eyebrow:pt,title:P,meta:ft,titleScale:me,caption:T?q.trim():"",captionPos:ge,captionDrag:yt,captionBg:I,captionColor:Ee,captionSize:pe,captionWidth:xe})})})})]})]})}export{Wn as ShareCardScreen};