https://singaporebirds.com/assets/FamilyScreen-Dlg5SwZf.js

1import{r as C,j as e}from"./react-vendor-eUQHqTr8.js";import{h as ce,g as pe,C as ge,j as xe,e as Y,E as he,b as fe,a1 as me,a as ue,T as n,L as I,m as ye,D as z,B as x,S as $,c as F,I as R,F as je,A as ve,a2 as be,P as Se}from"./index-CwTm0-D0.js";import{t as O}from"./lists-vSjpx8Vm.js";import{N as we,O as ke}from"./OfflineNotice-B8dxlFVQ.js";import{NotFoundScreen as Fe}from"./NotFoundScreen-BV5syPH4.js";import{G as X}from"./GlossaryToggle-BsVn4Q1h.js";import{W as We}from"./WishLifeToggles-D_Bljz3-.js";import{P as G,D as Be,I as Ce}from"./DidYouKnow-CZ0iG8Xd.js";import{S as ze,s as $e}from"./SeasonalityHeatmap-QnpbPhuB.js";import"./SpeciesTitleBlock-DTVEuKnD.js";import"./speciesStatus-BEXUQ5Ih.js";import"./Tooltip-AnQScd3Q.js";const N={"very common":0,common:1,uncommon:2,rare:3,"very rare":4,vagrant:5};function Te(t){return String(t||"").split(/\s+and\s+/i).map(i=>i.trim()).map(i=>i[0].toUpperCase()+i.slice(1)).filter(Boolean)}function Ie(t){const i=t.toLowerCase();return i.includes("vagrant")?"coral":i.includes("resident")?"sage":i.includes("migrant")||i.includes("visitor")||i.includes("passage")?"amber":"neutral"}const _={Res:"residents",Mi:"migrants",Vis:"visitors",Vagr:"vagrants",Intr:"introduced",Ex:"former"};function H(t){var o;if((o=t.statusesSg)!=null&&o.length){const l=new Set;for(const r of t.statusesSg){const c=typeof r=="object"?r.extra_short_name:null;c&&_[c]&&l.add(_[c])}return l}const i=(t.localStatus||"").toLowerCase(),s=new Set;return i.includes("introduced")&&s.add("introduced"),i.includes("former resident")&&s.add("former"),i.includes("resident")&&!i.includes("former")&&s.add("residents"),i.includes("vagrant")&&s.add("vagrants"),(i.includes("non-breeding visitor")||i.includes("visitor")&&!i.includes("migrant"))&&s.add("visitors"),(i.includes("migrant")||i.includes("passage"))&&s.add("migrants"),s}function Re(t){const i={residents:0,migrants:0,vagrants:0,visitors:0,introduced:0,former:0};for(const s of t)for(const o of H(s))o in i&&i[o]++;return i}function P({children:t,style:i={}}){return e.jsx("div",{style:{fontFamily:F,fontSize:12,letterSpacing:1.4,textTransform:"uppercase",color:n.amberHi,fontWeight:600,marginBottom:10,...i},children:t})}function Pe({filter:t,setFilter:i,counts:s,total:o}){const l=[{key:"all",label:`All (${o})`},s.residents>0&&{key:"residents",label:`Residents (${s.residents})`},s.migrants>0&&{key:"migrants",label:`Migrants (${s.migrants})`},s.visitors>0&&{key:"visitors",label:`Visitors (${s.visitors})`},s.vagrants>0&&{key:"vagrants",label:`Vagrants (${s.vagrants})`},s.introduced>0&&{key:"introduced",label:`Introduced (${s.introduced})`},s.former>0&&{key:"former",label:`Former residents (${s.former})`}].filter(Boolean);return e.jsx("div",{style:{display:"flex",gap:6,flexWrap:"wrap"},children:l.map(r=>e.jsx("button",{onClick:()=>i(r.key),style:{height:30,padding:"0 12px",background:t===r.key?n.amber:n.panel,color:t===r.key?n.onAmber:n.textDim,border:`1px solid ${t===r.key?n.amber:n.rule}`,borderRadius:999,fontFamily:F,fontSize:12,fontWeight:600,cursor:"pointer",letterSpacing:-.1},children:r.label},r.key))})}function Ae({filtered:t,busy:i,busyKind:s,onAdd:o,onRemove:l}){if(t.length===0)return null;const r=t.filter(a=>!a.onWishlist).length,c=t.length-r;return e.jsxs("div",{style:{display:"inline-flex",gap:6},children:[r>0&&e.jsxs("button",{type:"button",onClick:o,disabled:i,style:{height:30,padding:"0 12px",background:n.amberTint,color:n.amberHi,border:`1px solid ${n.amberDim}`,borderRadius:999,fontFamily:x,fontSize:12,fontWeight:600,cursor:i?"wait":"pointer",letterSpacing:-.1,display:"inline-flex",alignItems:"center",gap:6,opacity:i?.6:1},children:[e.jsx(R,{name:"starFill",size:13,stroke:1.8}),i&&s==="add"?"Adding…":`Add ${r} to wishlist`]}),c>0&&e.jsxs("button",{type:"button",onClick:l,disabled:i,style:{height:30,padding:"0 12px",background:"transparent",color:n.textDim,border:`1px solid ${n.rule}`,borderRadius:999,fontFamily:x,fontSize:12,fontWeight:600,cursor:i?"wait":"pointer",letterSpacing:-.1,display:"inline-flex",alignItems:"center",gap:6,opacity:i?.6:1},children:[e.jsx(R,{name:"star",size:13,stroke:1.8}),i&&s==="remove"?"Removing…":`Remove ${c} from wishlist`]})]})}function V({species:t}){const{status:i}=Y(),s=i==="signedIn",o=Te(t.localStatus);return e.jsxs($,{screen:"species",params:{id:t.slug||t.id},style:{background:n.panel,border:`1px solid ${n.rule}`,borderRadius:4,overflow:"hidden",cursor:"pointer",position:"relative"},children:[t.coverPhotoUrl?e.jsx("div",{style:{aspectRatio:"4/3",overflow:"hidden",background:n.photoBg},children:e.jsx("img",{src:t.coverPhotoUrl,alt:t.common,style:{width:"100%",height:"100%",objectFit:"cover",display:"block"}})}):e.jsx(be,{label:"",height:void 0,style:{aspectRatio:"4/3",height:"auto"}}),e.jsxs("div",{style:{padding:"12px 14px 14px"},children:[e.jsx("div",{style:{fontFamily:z,fontWeight:600,fontSize:14,color:n.text,marginBottom:3,lineHeight:1.3},children:t.common}),e.jsx("div",{style:{fontFamily:x,fontStyle:"italic",fontSize:12,color:n.textDim,marginBottom:7},children:t.sci}),e.jsxs("div",{style:{display:"flex",alignItems:"flex-end",justifyContent:"space-between",gap:8},children:[o.length>0?e.jsx("div",{style:{display:"flex",gap:4,flexWrap:"wrap",flex:1,minWidth:0},children:o.map((l,r)=>e.jsx(Se,{tone:Ie(l),style:{fontSize:10,minWidth:0,whiteSpace:"normal"},children:l},r))}):e.jsx("span",{style:{flex:1}}),s&&e.jsx("div",{style:{display:"flex",gap:2,flexShrink:0},children:e.jsx(We,{species:t,size:"sm"})})]})]})]})}function q({fam:t,counts:i,signedIn:s,species:o,bulkBusy:l,bulkKind:r,doBulkAdd:c,isDesktop:a}){const m=ve(),d=o.filter(p=>!p.lifer).length,h=o.filter(p=>p.onWishlist).length,y=t.speciesCount,j=y>0?Math.round(d/y*100):0,v=[i.residents>0&&{k:"residents",v:i.residents,l:"Residents"},i.migrants>0&&{k:"migrants",v:i.migrants,l:"Migrants"},i.visitors>0&&{k:"visitors",v:i.visitors,l:"Visitors"},i.vagrants>0&&{k:"vagrants",v:i.vagrants,l:"Vagrants"},i.introduced>0&&{k:"introduced",v:i.introduced,l:"Introduced"},i.former>0&&{k:"former",v:i.former,l:"Former"}

1].filter(Boolean);return e.jsxs("section",{style:{background:n.panel,border:`1px solid ${n.rule}`,borderRadius:6,boxShadow:"0 1px 0 rgba(31,45,38,0.04), 0 6px 24px -12px rgba(31,45,38,0.18)",padding:a?"22px 26px":"18px 18px",display:"flex",flexDirection:a?"row":"column",alignItems:a?"center":"stretch",gap:a?22:16,marginTop:a?24:0,position:"relative",zIndex:2},children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:16,minWidth:0},children:[e.jsx("div",{style:{fontFamily:x,fontSize:56,lineHeight:1,fontWeight:500,color:n.amber,letterSpacing:-1.5},children:y}),e.jsxs("div",{children:[e.jsx("div",{style:{fontFamily:x,fontSize:15,fontWeight:600,color:n.text,lineHeight:1.2},children:"species in Singapore"}),e.jsx("div",{style:{fontFamily:F,fontSize:11,letterSpacing:1.2,textTransform:"uppercase",color:n.textDim,marginTop:5},children:t.familyScientific})]})]}),a&&e.jsx("div",{style:{width:1,alignSelf:"stretch",background:n.ruleSoft}}),e.jsx("ul",{style:{listStyle:"none",margin:0,padding:0,display:"grid",gridTemplateColumns:`repeat(${Math.max(2,v.length)}, minmax(0,1fr))`,gap:12,flex:1,minWidth:0},children:v.map(p=>e.jsxs("li",{style:{display:"flex",flexDirection:"column",gap:3},children:[e.jsx("span",{style:{fontFamily:x,fontSize:22,fontWeight:500,color:n.text,letterSpacing:-.5,lineHeight:1},children:p.v}),e.jsx("span",{style:{fontFamily:F,fontSize:11,letterSpacing:1.2,textTransform:"uppercase",color:n.textDim},children:p.l})]},p.k))}),s?e.jsxs("div",{style:{flexShrink:0,display:"flex",flexDirection:"column",gap:6,minWidth:a?200:"auto",maxWidth:a?220:"none"},children:[e.jsxs("div",{style:{display:"flex",alignItems:"baseline",gap:8,flexWrap:"wrap"},children:[e.jsxs("div",{style:{fontFamily:x,fontSize:30,lineHeight:1,fontWeight:500,color:n.sage,letterSpacing:-1},children:[d,e.jsxs("span",{style:{color:n.textDim,fontSize:17,fontWeight:500},children:["/",y]})]}),e.jsxs("div",{style:{fontFamily:x,fontSize:13,fontWeight:600,color:n.text,lineHeight:1.2},children:["in your ",m.possessive]})]}),e.jsx("div",{style:{width:"100%",height:6,background:n.ruleSoft,borderRadius:999,overflow:"hidden"},children:e.jsx("div",{style:{height:"100%",width:`${j}%`,background:`linear-gradient(90deg, ${n.sage} 0%, #5fa68f 100%)`,borderRadius:999,transition:"width 0.4s ease"}})}),e.jsxs("div",{style:{fontFamily:F,fontSize:10.5,letterSpacing:1,textTransform:"uppercase",color:n.textDim,fontWeight:600},children:[h," on wishlist"]})]}):null]})}function J({writeup:t,species:i=[],isDesktop:s,nav:o,onHashClick:l}){const r=t||{},c=[["Overview",r.overview],["In Singapore",r.inSingapore]].filter(([,d])=>d&&d.trim()),a=[["Habitat",r.habitat],["Behaviour & ecology",r.behaviourEcology]].filter(([,d])=>d&&d.trim()),m=(r.interestingInfo||[]).filter(d=>d&&d.trim());return e.jsxs("section",{style:{paddingBottom:s?32:22,borderBottom:`1px solid ${n.rule}`},children:[e.jsx(P,{style:{marginBottom:s?18:14},children:"About this family"}),c.length===0&&a.length===0&&m.length===0?i.length===1?e.jsxs("p",{style:{font:`400 ${s?15.5:14.5}px/1.65 ${x}`,color:n.textMute,margin:0},children:["One species occurs in Singapore. To learn more, view the species page for"," ",e.jsx($,{screen:"species",params:{id:i[0].slug||i[0].id},style:{display:"inline",cursor:"pointer",color:n.sage,fontWeight:600,textDecoration:"underline",textDecorationStyle:"solid",textDecorationColor:"rgba(46,107,90,0.4)"},children:i[0].common}),"."]}):e.jsx("p",{style:{font:`400 ${s?15.5:14.5}px/1.65 ${x}`,color:n.textMute,fontStyle:"italic",margin:0},children:"We're still working on the writeup for this family."}):e.jsxs("div",{style:{display:"grid",gridTemplateColumns:s?"1.45fr 1fr":"1fr",gap:s?56:28,alignItems:"start"},children:[e.jsx("div",{style:{maxWidth:s?640:"none"},children:c.map(([d,h],y)=>e.jsxs("div",{style:{marginTop:y===0?0:28},children:[e.jsx("h2",{style:{fontFamily:x,fontWeight:600,fontSize:s?22:19,letterSpacing:-.4,lineHeight:1.2,margin:"0 0 10px",color:n.text},children:d}),e.jsx(G,{html:h,nav:o,onHashClick:l,glossary:!0,style:{font:`400 ${s?15.5:14.5}px/1.65 ${x}`,color:n.text}})]},d))}),e.jsxs("aside",{style:{display:"flex",flexDirection:"column",gap:24,paddingTop:s?28:0,borderTop:s?`1px solid ${n.ruleSoft}`:"none"},children:[a.map(([d,h])=>e.jsxs("div",{children:[e.jsx("div",{style:{font:`600 11px ${F}`,color:n.amberDim,textTransform:"uppercase",letterSpacing:"0.08em",marginBottom:6},children:d}),e.jsx(G,{html:h,nav:o,onHashClick:l,glossary:!0,style:{font:`400 ${s?14.5:13.5}px/1.6 ${x}`,color:n.textDim}})]},d)),e.jsx(Be,{items:m,nav:o,isDesktop:s})]})]})]})}function Q({flagships:t,species:i,isDesktop:s}){if(!t||t.length===0)return null;const o=new Map;for(const r of i)o.set(r.id,r);const l=t.map(r=>({sp:o.get(r.ebirdCode),line:r.oneLiner})).filter(r=>r.sp);return l.length===0?null:e.jsxs("section",{style:{paddingTop:s?40:28,paddingBottom:s?32:22,borderBottom:`1px solid ${n.rule}`},children:[e.jsx(P,{style:{marginBottom:s?18:14},children:"Featured species"}),e.jsx("div",{style:{display:"grid",gridTemplateColumns:s?`repeat(${Math.min(4,l.length)}, 1fr)`:"repeat(2, 1fr)",gap:s?16:12},children:l.map(({sp:r,line:c},a)=>e.jsxs($,{screen:"species",params:{id:r.slug||r.id},style:{background:n.panel,border:`1px solid ${n.rule}`,borderRadius:6,overflow:"hidden",display:"flex",flexDirection:"column",cursor:"pointer"},children:[e.jsx("div",{style:{aspectRatio:"4/3",position:"relative",background:n.photoBg,overflow:"hidden"},children:r.coverPhotoUrl&&e.jsx("img",{src:r.coverPhotoUrl,alt:r.common,style:{width:"100%",height:"100%",objectFit:"cover",display:"block"}})}),e.jsxs("div",{style:{padding:"14px 16px 16px",display:"flex",flexDirection:"column",flex:1},children:[e.jsx("div",{style:{fontFamily:z,fontWeight:600,fontSize:15,color:n.text,lineHeight:1.25},children:r.common}),e.jsx("div",{style:{fontFamily:x,fontStyle:"italic",fontSize:12.5,color:n.textDim,marginTop:2},children:r.sci}),e.jsx("p",{style:{fontSize:13.5,lineHeight:1.55,color:n.textDim,margin:"10px 0 12px",flex:1},children:c}),e.jsxs("div",{style:{fontFamily:x,fontSize:12,fontWeight:600,color:n.amber,display:"inline-flex",alignItems:"center",gap:6,letterSpacing:-.1},children:["View species ",e.jsx(R,{name:"chevron",size:12,stroke:2.2})]})]})]},r.id))})]})}function Z({species:t,isDesktop:i=!0}){return t.some(o=>(o.weeks||[]).some(l=>l>0))?e.jsxs("section",{style:{paddingTop:i?40:28,paddingBottom:i?32:22,borderBottom:`1px solid ${n.rule}`},children:[e.jsx(P,{style:{marginBottom:i?8:6}

1,children:"When to see them"}),e.jsx("h2",{style:{fontFamily:x,fontWeight:600,fontSize:i?22:19,letterSpacing:-.4,lineHeight:1.2,margin:"0 0 16px",color:n.text},children:"Family seasonality at a glance"}),e.jsx(ze,{species:t,isDesktop:i,groupByGenus:!0,stickyHeader:!0})]}):null}function ee({currentSlug:t,isDesktop:i}){const s=je();if(!s.length)return null;const o=s.findIndex(c=>c.slug===t);if(o===-1)return null;const l=o>0?s[o-1]:null,r=o<s.length-1?s[o+1]:null;return e.jsxs("div",{style:{borderTop:`1px solid ${n.rule}`,display:"grid",gridTemplateColumns:"1fr 1fr",padding:i?"20px 48px":"16px 18px",gap:8},children:[e.jsx("div",{children:l&&e.jsxs($,{screen:"family",params:{slug:l.slug},style:K("left"),children:[e.jsx("span",{style:{color:n.amberHi},children:"←"}),e.jsxs("div",{style:{minWidth:0},children:[e.jsx("div",{style:{fontSize:10,fontFamily:F,letterSpacing:1,textTransform:"uppercase",color:n.textMute,marginBottom:2},children:"Previous"}),e.jsx("div",{style:{fontFamily:z,fontWeight:600,fontSize:13,color:n.text,lineHeight:1.3,overflowWrap:"anywhere"},children:l.familyEnglish}),e.jsx("div",{style:{fontSize:11,color:n.textMute,overflowWrap:"anywhere"},children:l.familyScientific})]})]})}),e.jsx("div",{style:{display:"flex",justifyContent:"flex-end"},children:r&&e.jsxs($,{screen:"family",params:{slug:r.slug},style:K("right"),children:[e.jsxs("div",{style:{minWidth:0,textAlign:"right"},children:[e.jsx("div",{style:{fontSize:10,fontFamily:F,letterSpacing:1,textTransform:"uppercase",color:n.textMute,marginBottom:2},children:"Next"}),e.jsx("div",{style:{fontFamily:z,fontWeight:600,fontSize:13,color:n.text,lineHeight:1.3,overflowWrap:"anywhere"},children:r.familyEnglish}),e.jsx("div",{style:{fontSize:11,color:n.textMute,overflowWrap:"anywhere"},children:r.familyScientific})]}),e.jsx("span",{style:{color:n.amberHi},children:"→"})]})})]})}function K(t){return{display:"flex",alignItems:"center",gap:10,background:"none",border:"none",cursor:"pointer",padding:"6px 0",textAlign:t==="left"?"left":"right",maxWidth:"100%"}}function te({articles:t,isDesktop:i}){return!Array.isArray(t)||t.length===0?null:e.jsxs("section",{style:{paddingTop:i?40:24},children:[e.jsx(P,{style:{marginBottom:12},children:"Identification guides"}),e.jsx("div",{style:{display:"flex",flexDirection:"column",gap:12},children:t.map(s=>e.jsx(Ce,{a:s,isDesktop:i,variant:"family"},s.slug))})]})}function ie({species:t,filter:i,setFilter:s,counts:o,total:l,signedIn:r,bulkBusy:c,bulkKind:a,doBulkAdd:m,doBulkRemove:d,isDesktop:h,bumpKey:y}){const j=i==="all"?t:t.filter(p=>H(p).has(i)),v=C.useMemo(()=>{const p=new Map;for(const g of j){const u=$e(g);p.has(u)||p.set(u,[]),p.get(u).push(g)}return[...p.entries()].map(([g,u])=>({genus:g,rows:u}))},[j]);return e.jsxs("section",{style:{paddingTop:h?40:24},children:[e.jsxs("div",{style:{display:"flex",alignItems:"flex-end",justifyContent:"space-between",gap:16,flexWrap:"wrap",marginBottom:h?18:14},children:[e.jsxs("div",{children:[e.jsx(P,{style:{marginBottom:4},children:"All species"}),e.jsxs("h2",{style:{fontFamily:x,fontWeight:600,fontSize:h?22:19,letterSpacing:-.4,lineHeight:1.2,margin:0,color:n.text},children:[l," species"]})]}),r&&e.jsx(Ae,{filtered:j,busy:c,busyKind:a,onAdd:m,onRemove:d})]}),e.jsx("div",{style:{marginBottom:18},children:e.jsx(Pe,{filter:i,setFilter:s,counts:o,total:l})}),(()=>{const p=({genus:g})=>e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:8},children:[e.jsx("span",{style:{fontFamily:x,fontStyle:"italic",fontSize:14,fontWeight:600,color:n.amberDim,letterSpacing:.2,whiteSpace:"nowrap"},children:g}),e.jsx("div",{style:{flex:1,height:1,background:n.ruleSoft}})]});return h?e.jsx("div",{style:{display:"flex",flexWrap:"wrap",alignItems:"flex-start",gap:24},children:v.map(k=>{const b=Math.min(k.rows.length,4);return e.jsxs("div",{id:k.genus?`genus-${k.genus}`:void 0,style:{flexGrow:b,flexShrink:1,flexBasis:b*248+(b-1)*16,maxWidth:b*340+(b-1)*16,display:"flex",flexDirection:"column",gap:10,scrollMarginTop:24},children:[e.jsx(p,{genus:k.genus}),e.jsx("div",{style:{display:"grid",gridTemplateColumns:`repeat(${b}, minmax(0, 1fr))`,gap:16},children:k.rows.map(A=>e.jsx(V,{species:A},`${A.id}:${y}`))})]},k.genus)})}):e.jsx("div",{style:{display:"grid",gridTemplateColumns:"repeat(2, 1fr)",gap:12,alignItems:"start"},children:v.flatMap((g,u)=>[e.jsx("div",{id:g.genus?`genus-${g.genus}`:void 0,style:{gridColumn:"1 / -1",marginTop:u===0?0:10,scrollMarginTop:24},children:e.jsx(p,{genus:g.genus})},`genus-${g.genus}`),...g.rows.map(S=>e.jsx(V,{species:S},`${S.id}:${y}`))])})})()]})}function ne({fam:t,slug:i,isDesktop:s}){const[o,l]=C.useState(!1),[r,c]=C.useState(!1),a=`https://singaporebirds.com/family/${i}/`,m=new Date().toLocaleDateString("en-US",{month:"long",day:"numeric",year:"numeric"}),d=`Bird Society of Singapore. (n.d.). ${t.familyEnglish}. Retrieved on ${m} from ${a}`;return e.jsxs("section",{style:{marginTop:s?40:28,border:`1px solid ${n.ruleSoft}`,borderRadius:6,overflow:"hidden",background:n.panel},children:[e.jsxs("button",{onClick:()=>l(h=>!h),style:{display:"flex",alignItems:"center",justifyContent:"space-between",width:"100%",background:"none",border:"none",cursor:"pointer",padding:s?"14px 20px":"12px 16px",fontFamily:F,fontSize:12,color:n.textMute,letterSpacing:1.1,textTransform:"uppercase"},children:["Recommended citation",e.jsx(R,{name:"chevronDn",size:13,style:{color:n.textMute,transform:o?"rotate(180deg)":"none",transition:"transform 0.15s"}})]}),o&&e.jsxs("div",{style:{padding:s?"0 20px 16px":"0 16px 14px",display:"flex",alignItems:"flex-start",ga

1p:8},children:[e.jsxs("p",{style:{flex:1,margin:0,fontFamily:x,fontSize:13,color:n.textDim,lineHeight:1.6},children:["Bird Society of Singapore. (n.d.). ",t.familyEnglish,". Retrieved on ",m," from"," ",e.jsx("a",{href:a,style:{color:n.amber},children:a}),"."]}),e.jsxs("button",{onClick:()=>{navigator.clipboard.writeText(d).then(()=>{c(!0),setTimeout(()=>c(!1),2e3)})},style:{flexShrink:0,background:"none",border:`1px solid ${n.rule}`,borderRadius:4,cursor:"pointer",padding:"7px 10px",fontFamily:F,fontSize:11,letterSpacing:.3,color:r?n.amber:n.textMute,display:"flex",alignItems:"center",gap:5},children:[r&&e.jsx(R,{name:"check",size:12}),r?"Copied":"Copy"]})]})]})}function se({species:t,isDesktop:i}){if(!(t!=null&&t.length))return null;if(t.length>=4){const o=t.slice(0,4);return e.jsx("div",{style:{position:"relative",display:"grid",gridTemplateColumns:"1fr 1fr",gap:0,borderRadius:i?4:0,overflow:"hidden",background:n.photoBg},children:o.map(l=>e.jsxs($,{screen:"species",params:{id:l.slug||l.id},style:{position:"relative",overflow:"hidden",background:n.photoBg,aspectRatio:"3/2",cursor:"pointer"},children:[e.jsx("img",{src:l.coverPhotoUrl,alt:l.common,style:{width:"100%",height:"100%",objectFit:"cover",display:"block"}}),e.jsx("div",{style:{position:"absolute",inset:0,background:"linear-gradient(180deg, transparent 50%, rgba(10,30,18,0.7) 100%)",pointerEvents:"none"}}),e.jsx("div",{style:{position:"absolute",bottom:10,left:10,right:10,fontFamily:z,fontSize:i?12.5:12,fontWeight:600,letterSpacing:.1,lineHeight:1.2,color:"rgba(255,255,255,0.92)"},children:l.common})]},l.id))})}const s=t[0];return s!=null&&s.coverPhotoUrl?e.jsxs($,{screen:"species",params:{id:s.slug||s.id},style:{position:"relative",borderRadius:4,overflow:"hidden",background:n.photoBg,cursor:"pointer"},children:[e.jsx("img",{src:s.coverPhotoUrl,alt:s.common,style:{width:"100%",height:"auto",display:"block"}}),e.jsx("div",{style:{position:"absolute",bottom:0,left:0,right:0,background:"linear-gradient(transparent, rgba(0,20,10,0.55))",padding:"24px 14px 12px"},children:e.jsx("div",{style:{fontFamily:z,fontSize:13,fontWeight:600,color:"rgba(255,255,255,0.9)"},children:s.common})})]}):null}function He({fam:t,filter:i,setFilter:s,counts:o,heroSpecies:l,nav:r,currentSlug:c,signedIn:a,bulkBusy:m,bulkKind:d,doBulkAdd:h,doBulkRemove:y,bumpKey:j,offlineNotice:v}){var S,W,k;const p=(S=l[0])==null?void 0:S.coverPhotoUrl,g=l.some(b=>b==null?void 0:b.coverPhotoUrl),u=ye(1e3);return e.jsxs("div",{style:{background:n.ink,minHeight:"100%"},children:[v&&e.jsx("div",{style:{padding:"12px 48px 0"},children:v}),e.jsxs("div",{style:{position:"relative",overflow:"hidden"},children:[p&&e.jsx("div",{style:{position:"absolute",inset:"-30px",backgroundImage:`url(${p})`,backgroundSize:"cover",backgroundPosition:"center",filter:"blur(22px) saturate(0.55) brightness(1.15)",opacity:.28}}),e.jsxs("div",{style:{position:"relative",zIndex:1,maxWidth:1180,margin:"0 auto"},children:[e.jsxs("div",{style:{display:"grid",gridTemplateColumns:g&&u?"350px 1fr":"1fr",gap:u?40:24,alignItems:"end",padding:`44px ${u?48:32}px 32px`},children:[e.jsxs("div",{style:{padding:"8px 0"},children:[e.jsxs(P,{style:{marginBottom:12},children:["Family · ",t.speciesCount," species"]}),e.jsx("h1",{style:{fontFamily:z,fontWeight:600,fontSize:52,lineHeight:.95,color:n.text,margin:"0 0 10px",letterSpacing:-1.4},children:t.familyEnglish}),e.jsx("div",{style:{fontSize:20,color:n.textDim,marginBottom:20,fontFamily:x},children:t.familyScientific})]}),g&&e.jsx(se,{species:l,isDesktop:!0})]}),e.jsx(ee,{currentSlug:c,isDesktop:!0})]})]}),e.jsxs("div",{style:{maxWidth:1180,margin:"0 auto",padding:"0 48px 56px"},children:[e.jsx(q,{fam:t,counts:o,signedIn:a,species:t.species,bulkBusy:m,bulkKind:d,doBulkAdd:h,isDesktop:!0}),e.jsx("div",{style:{marginTop:40},children:e.jsx(J,{writeup:t.writeup,species:t.species,isDesktop:!0,nav:r})}),((k=(W=t.writeup)==null?void 0:W.flagshipSpecies)==null?void 0:k.length)>0&&e.jsx(Q,{flagships:t.writeup.flagshipSpecies,species:t.species,isDesktop:!0}),e.jsx(te,{articles:t.identificationArticles,isDesktop:!0}),e.jsx(Z,{species:t.species,isDesktop:!0}),e.jsx(ie,{species:t.species,filter:i,setFilter:s,counts:o,total:t.speciesCount,signedIn:a,bulkBusy:m,bulkKind:d,doBulkAdd:h,doBulkRemove:y,isDesktop:!0,bumpKey:j}),e.jsx(ne,{fam:t,slug:c,isDesktop:!0})]}),e.jsx(X,{})]})}function Me({fam:t,filter:i,setFilter:s,counts:o,heroSpecies:l,nav:r,currentSlug:c,signedIn:a,bulkBusy:m,bulkKind:d,doBulkAdd:h,doBulkRemove:y,bumpKey:j,offlineNotice:v}){var g,u;const p=l.some(S=>S==null?void 0:S.coverPhotoUrl);return e.jsxs("div",{style:{background:n.ink,minHeight:"100%"},children:[v&&e.jsx("div",{style:{padding:"10px 18px 0"},children:v}),e.jsxs("div",{style:{position:"relative",background:n.photoBg},children:[p?l.length>=4?e.jsx(se,{species:l,isDesktop:!1}):e.jsx($,{screen:"species",params:{id:l[0].slug||l[0].id},style:{cursor:"pointer"},children:e.jsx("img",{src:l[0].coverPhotoUrl,alt:l[0].common,style:{width:"100%",height:"auto",display:"block"}})}):e.jsx("div",{style:{height:220,display:"flex",alignItems:"center",justifyContent:"center",fontFamily:F,fontSize:12,color:n.photoFg,letterSpacing:1.2,textTransform:"uppercase",backgroundImage:`repeating-linear-gradient(135deg, transparent 0 6px, ${n.photoStripe} 6px 7px)`},children:t.familyEnglish.toLowerCase()}),e.jsx("button",{onClick:()=>r("back"),style:Le(14,"left"),"aria-label":"Back",children:e.jsx(R,{name:"chevron",size:16,style:{transform:"rotate(180deg)"}})})]}),e.jsxs("div",{style:{padding:"18px 18px 0"},children:[e.jsx("h1",{style:{fontFamily:z,fontWeight:600,fontSize:34,lineHeight:.95,color:n.text,margin:"0 0 6px",letterSpacing:-.8},children:t.familyEnglish}),e.jsx("div",{style:{fontSize:18,color:n.textDim,marginBottom:20,fontFamily:x},children:t.familyScientific})]}),e.jsx(ee,{currentSlug:c,isDesktop:!1}),e.jsx("div",{style:{padding:"0 18px"},children:e.jsx(q,{fam:t,counts:o,signedIn:a,species:t.species,bulkBusy:m,bulkKind:d,doBulkAdd:h,isDesktop:!1})}),e.jsx("div",{style:{padding:"28px 18px 0"},children:e.jsx(J,{writeup:t.writeup,species:t.species,isDesktop:!1,nav:r})}),e.jsxs("div",{style:{padding:"0 18px"},children:[((u=(g=t.writeup)==null?void 0:g.flagshipSpecies)==null?void 0:u.length)>0&&e.jsx(Q,{flagships:t.writeup.flagshipSpecies,species:t.species,isDesktop:!1}),e.jsx(te,{articles:t.identificationArticles,isDesktop:!1}),e.jsx(Z,{species:t.species,isDesktop:!1}),e.jsx(ie,{species:t.species,filter:i,setFilter:s,counts:o,total:t.speciesCount,signedIn:a,bulkBusy:m,bulkKind:d,doBulkAdd:h,doBulkRemove:y,isDesktop:!1,bumpKey:j}),e.jsx(ne,{fam:t,slug:c,isDesktop:!1})]}),e.jsx(X,{})]})}function De({isDesktop:t}){return e.jsxs("div",{style:{background:n.panelHi,minHeight:"100%"},children:[e.jsxs("div",{style:{padding:t?"44px 48px 36px":"28px 18px 24px"},children:[e.jsx(I,{height:12,width:140,style:{marginBottom:16}}),e.jsx(I,{height:t?56:40,width:260,style:{marginBottom:12}}),e.jsx(I,{height:20,width:180,style:{marginBottom:20}}),e.jsxs("div",{style:{display:"flex",gap:8},children:[e.jsx(I,{height:24,width:80,style:{borderRadius:999}}),e.jsx(I,{height:24,width:100,style:{borderRadius:999}})]})]}),e.jsx("div",{style:{padding:t?"32px 48px":"24px 18px"},children:e.jsx("div",{style:{display:"grid",gridTemplateColumns:t?"repeat(4, 1fr)":"repeat(2, 1fr)",gap:16},children:Array.from({length:8},(i,s)=>e.jsxs("div",{style:{background:n.panel,borderRadius:4,overflow:"hidden"},children:[e.jsx("div",{style:{aspectRatio:"4/3",background:n.panelHi}}),e.jsxs("div",{style:{padding:"12px 14px"},children:[e.jsx(I,{height:14,style:{marginBottom:6}}),e.jsx(I,{height:12,width:"70%"})]})]},s))})})]})}function Qe({nav:t,params:i,isDesktop:s=!1}){const o=i==null?void 0:i.slug,{data:l,error:r,loading:c,reload:a,offline:m,notDownloaded:d,syncedAt:h}=ce(()=>ue.family(o),()=>me(o),[o]),{lists:y}=pe(),j=C.useMemo(()=>!m||!(l!=null&&l.species)?l:{...l,species:ge(l.species,y)},[l,m,y]);xe(j==null?void 0:j.familyEnglish);const[v,p]=C.useState("all"),{status:g}=Y(),u=g==="signedIn",[S,W]=C.useState(!1),[k,b]=C.useState(null),[A,M]=C.useState(0);if(c&&!j)return e.jsx(De,{isDesktop:s});if(r)return r.status===404?e.jsx(Fe,{isDesktop:s}):d?e.jsx(we,{what:"This family",onRetry:a}):e.jsx(he,{title:"Couldn't load family",message:r.message,action:e.jsx(fe,{onClick:a,children:"Retry"})});const B=j,re=Re(B.species),D=v==="all"?B.species:B.species.filter(w=>H(w).has(v)),le=[...B.species].sort((w,f)=>N[w.rarity]-N[f.rarity]).find(w=>w.coverPhotoUrl)||B.species[0],L=(()=>{var U;const w=((U=B.writeup)==null?void 0:U.flagshipSpecies)||[];if(!w.length)return[];const f=new Map;for(const T of B.species)f.set(T.id,T);return w.map(T=>f.get(T.ebirdCode)).filter(T=>T&&T.coverPhotoUrl)})(),oe=L.length>=4?L.slice(0,4):[le];async function ae(){if(S)return;const w=D.filter(f=>!f.onWishlist);if(w.length!==0){W(!0),b("add");try{await Promise.all(w.map(f=>O({list:"wishlist",speciesId:f.id,on:!0}))),await a(),M(f=>f+1)}catch(f){console.warn("Bulk add to wishlist failed:",f)}finally{W(!1),b(null)}}}async function de(){if(S)return;const w=D.filter(f=>f.onWishlist);if(w.length!==0){W(!0),b("remove");try{await Promise.all(w.map(f=>O({list:"wishlist",speciesId:f.id,on:!1}))),await a(),M(f=>f+1)}catch(f){console.warn("Bulk remove from wishlist failed:",f)}finally{W(!1),b(null)}}}const E={fam:B,filter:v,setFilter:p,counts:re,heroSpecies:oe,nav:t,currentSlug:o,signedIn:u,bulkBusy:S,bulkKind:k,doBulkAdd:ae,doBulkRemove:de,bumpKey:A,offlineNotice:m?e.jsx(ke,{syncedAt:h}):null};return s?e.jsx(He,{...E}):e.jsx(Me,{...E})}function Le(t,i){return{position:"absolute",top:t,[i]:t,width:36,height:36,borderRadius:18,background:n.panelBlur,border:`1px solid ${n.rule}`,color:n.text,cursor:"pointer",zIndex:5,display:"flex",alignItems:"center",justifyContent:"center"}}export{Qe as FamilyScreen};