https://tuttle-twins-fan-art.netlify.app/assets/ReferencesScreen-B6jrQzdG.js

1import{J as M,K as R,R as p,w as e,E as r,d as f,I as d,a as w,H as k,k as z,G as B,z as S}from"./index-BQtTnC3W.js";function O({item:s,onClose:x,navigate:o}){const i=s&&s.imageUrls&&s.imageUrls.length?s.imageUrls:s&&s.imageUrl?[s.imageUrl]:[],[n,c]=p.useState(0);if(p.useEffect(()=>{c(0)},[s&&s.id]),!s)return null;const m=i[n]||null,h=i.length>1;return S.createPortal(e.jsxs("div",{className:"fixed inset-0 z-[70] flex items-start justify-center anim-fade p-4 pt-6 overflow-y-auto",style:{background:"rgba(23,51,52,0.78)"},onClick:x,children:[e.jsx("button",{onClick:x,className:"fixed top-4 right-4 press w-11 h-11 rounded-full bg-white border-2 border-ink flex items-center justify-center text-ink z-10",children:e.jsx(d,{name:"X",size:20})}),e.jsxs("div",{className:"w-full max-w-md anim-pop pb-8",onClick:a=>a.stopPropagation(),children:[e.jsxs("div",{className:"bg-white p-3 border-2 border-ink rounded-lg shadow-pop relative",style:{transform:"rotate(-0.6deg)"},children:[e.jsx("div",{className:"rounded-md overflow-hidden bg-mint",children:m?e.jsx("img",{src:m,alt:k(s,s.kind),className:"w-full h-auto object-contain max-h-[62vh]"}):e.jsx("div",{className:"aspect-square flex items-center justify-center text-ink/40",children:e.jsx(d,{name:"FileImage",size:56})})}),h&&e.jsxs(e.Fragment,{children:[e.jsx("button",{onClick:()=>c(a=>(a-1+i.length)%i.length),className:"press absolute left-1 top-1/2 -translate-y-1/2 w-9 h-9 rounded-full bg-white border-2 border-ink flex items-center justify-center text-ink shadow-pop",title:"Previous image",children:e.jsx(d,{name:"ArrowLeft",size:16})}),e.jsx("button",{onClick:()=>c(a=>(a+1)%i.length),className:"press absolute right-1 top-1/2 -translate-y-1/2 w-9 h-9 rounded-full bg-white border-2 border-ink flex items-center justify-center text-ink shadow-pop",title:"Next image",children:e.jsx(d,{name:"ArrowRight",size:16})})]})]}),h&&e.jsx("div",{className:"mt-3 flex justify-center gap-2",children:i.map((a,u)=>e.jsx("button",{onClick:()=>c(u),className:`press w-14 h-14 rounded-lg overflow-hidden border-2 ${u===n?"border-orange shadow-pop":"border-white/40"}`,title:`Image ${u+1} of ${i.length}`,children:e.jsx("img",{src:a,alt:"",className:"w-full h-full object-cover"})},a+u))}),e.jsxs("div",{className:"mt-4 text-center",children:[e.jsx("p",{className:"tt-title text-[26px] text-white leading-none",children:k(s,s.kind)}),s.description&&e.jsx("p",{className:"text-[14px] text-white/85 leading-snug mt-2 max-w-xs mx-auto",children:s.description}),s.kind==="background"&&e.jsx("p",{className:"text-[12px] text-white/75 mt-3 italic max-w-xs mx-auto leading-snug",children:r("refs.qualityNote")}),e.jsxs("div",{className:"mt-5 flex flex-wrap gap-2 justify-center",children:[m&&e.jsx(w,{variant:"outline",size:"sm",icon:"Download",onClick:async()=>{try{const a=s.slug||s.name,u=h?`${a}_${n+1}`:a;await z(m,u)}catch(a){B((a==null?void 0:a.message)||"Download failed.",{tone:"error"})}},children:h?r("refs.download.count",{index:n+1,total:i.length}):r("refs.download")}),e.jsx(w,{variant:"primary",size:"sm",icon:"Upload",onClick:()=>{x();const a=s.category==="Characters"?{characterId:s.id}:{backgroundId:s.id};o("upload",a)},children:r("refs.submitArt")})]})]})]})]}),document.body)}function $({refItem:s,onOpen:x,navigate:o}){const i=s.kind==="background";return e.jsxs("div",{className:"relative bg-white p-2 pb-3 border-2 border-ink/10 shadow-tile rounded-sm",children:[e.jsxs("button",{onClick:()=>x(s),className:"press w-full block text-left",children:[e.jsxs("div",{className:"aspect-square rounded-sm overflow-hidden bg-mint relative",children:[s.imageUrl?e.jsx("img",{src:s.imageUrl,alt:k(s,s.kind),className:"w-full h-full object-cover",loading:"lazy"}):e.jsx("div",{className:"w-full h-full flex items-center justify-center text-ink/30",children:e.jsx(d,{name:"FileImage",size:32})}),e.jsx("span",{className:"absolute top-1.5 right-1.5 bg-white/90 border-2 border-ink/10 rounded-full px-2 py-0.5 tt-sub text-[9px] text-ink/70",children:s.category==="Characters"?r("refs.card.character"):i?r("refs.card.background"):r("refs.card.misc")}),s.featured&&e.jsx("span",{className:"absolute top-1.5 left-1.5 bg-gold border-2 border-ink rounded-full w-7 h-7 flex items-center justify-center shadow-sticker",title:"We're collecting art of this one!",children:e.jsx(d,{name:"Sparkles",size:13,className:"text-ink",strokeWidth:2.6})})]}),e.jsx("p",{className:"tt-sub text-[12px] text-ink/85 mt-2 truncate px-1",children:k(s,s.kind).replace(/^[⭐\u{1F31F}\u{2728}️\s]+/u,"")}),s.description&&e.jsx("p",{className:"text-[11px] text-ink/55 mt-0.5 line-clamp-2 px-1 leading-snug",children:s.description})]}),e.jsxs("div",{className:"mt-2 px-1 flex items-center gap-2",children:[s.imageUrl&&e.jsxs("button",{onClick:async()=>{try{await z(s.imageUrl,s.slug||s.name)}catch(n){B((n==null?void 0:n.message)||"Download failed.",{tone:"error"})}},className:"press text-[10px] tt-sub text-ink/55 hover:text-ink flex items-center gap-1",title:"Download the reference image",children:[e.jsx(d,{name:"Download",size:11}),r("refs.download")]}),e.jsxs("button",{onClick:()=>{const n=s.category==="Characters"?{characterId:s.id}:{backgroundId:s.id};o("upload",n)},className:"press text-[10px] tt-sub text-orange hover:brightness-110 flex items-center gap-1 ml-auto",title:r("refs.submitArt"),children:[r("refs.submitArtShort"),e.jsx(d,{name:"ArrowRight",size:11})]})]})]})}function F({navigate:s,initialFilter:x}){M();const{characters:o,backgrounds:i}

1=R(),n=["Backgrounds","Characters","Misc"].includes(x)?x:"Backgrounds",[c,m]=p.useState(n),[h,a]=p.useState(null),u=p.useMemo(()=>(o||[]).some(l=>l.featured),[o]),y=p.useMemo(()=>{const b=(u?(o||[]).filter(t=>t.featured):o||[]).map(t=>({id:t.id,name:t.name,slug:t.slug,description:t.description||"",imageUrl:t.thumbnail||null,imageUrls:t.thumbnails&&t.thumbnails.length?t.thumbnails:t.thumbnail?[t.thumbnail]:[],kind:"character",category:"Characters",featured:!!t.featured,displayOrder:t.displayOrder||0})),A=(i||[]).map(t=>({id:t.id,name:t.name,slug:t.slug,description:t.description||"",imageUrl:t.imageUrl||null,imageUrls:t.imageUrl?[t.imageUrl]:[],kind:t.kind,category:t.kind==="misc"?"Misc":"Backgrounds",featured:!1,displayOrder:t.displayOrder||0}));return[...b,...A].sort((t,j)=>{const v={Backgrounds:0,Characters:1,Misc:2},C=(v[t.category]??99)-(v[j.category]??99);if(C!==0)return C;if(t.featured!==j.featured)return t.featured?-1:1;const U=(t.displayOrder||0)-(j.displayOrder||0);return U!==0?U:t.name.localeCompare(j.name)})},[o,i,u]),N=y.filter(l=>l.category===c),g=y.reduce((l,b)=>(l[b.category]=(l[b.category]||0)+1,l),{});return e.jsxs("div",{className:"anim-fade pb-2",children:[e.jsxs("div",{className:"px-5 pt-6 pb-2",children:[e.jsx("h1",{className:"tt-title text-[34px] text-ink leading-none mb-1",children:r("refs.title")}),e.jsx("p",{className:"text-[15px] text-ink/65 font-semibold",children:r("refs.subtitle")})]}),e.jsxs("div",{className:"flex gap-2 overflow-x-auto no-bar px-5 py-3",children:[e.jsxs(f,{active:c==="Backgrounds",onClick:()=>m("Backgrounds"),children:[r("refs.chip.backgrounds")," · ",g.Backgrounds||0]}),e.jsxs(f,{active:c==="Characters",onClick:()=>m("Characters"),children:[r("refs.chip.characters")," · ",g.Characters||0]}),e.jsxs(f,{active:c==="Misc",onClick:()=>m("Misc"),children:[r("refs.chip.misc")," · ",g.Misc||0]})]}),c==="Backgrounds"&&(g.Backgrounds||0)>0&&e.jsxs("div",{className:"mx-5 mb-2 px-3 py-2.5 rounded-2xl bg-mint border-2 border-ink/10 flex items-start gap-2",children:[e.jsx(d,{name:"Camera",size:16,className:"text-teal mt-0.5 shrink-0"}),e.jsx("p",{className:"text-[12px] text-ink/75 leading-snug",children:r("refs.qualityBanner")})]}),e.jsx("div",{className:"px-5 pt-2",children:N.length===0?e.jsxs("div",{className:"text-center py-16 px-6",children:[e.jsx("div",{className:"w-20 h-20 mx-auto rounded-full bg-mint border-2 border-ink/10 flex items-center justify-center mb-4",children:e.jsx(d,{name:"Sparkles",size:34,className:"text-teal"})}),e.jsx("p",{className:"tt-title text-[24px] text-ink mb-1",children:r("refs.empty.title")}),e.jsx("p",{className:"text-[15px] text-ink/60 font-semibold mb-5",children:r("refs.empty.blurb")}),e.jsx(w,{variant:"teal",icon:"Upload",onClick:()=>s("upload"),children:r("gallery.uploadCta")})]}):e.jsx("div",{className:"grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-x-3 gap-y-4 pb-4",children:N.map(l=>e.jsx($,{refItem:l,onOpen:a,navigate:s},`${l.category}:${l.id}`))})}),e.jsx(O,{item:h,onClose:()=>a(null),navigate:s})]})}export{F as default};