import{jsxs as l,jsx as e}from"react/jsx-runtime";import n,{useEffect as c}from"react";const g=n.memo(function({newsBackgroundUrl:t,children:r}){const[o,i]=n.useState(!1);c(()=>{const a=()=>i(window.innerWidth<768);return a(),window.addEventListener("resize",a),()=>window.removeEventListener("resize",a)},[]);const s=n.useMemo(()=>({backgroundImage:t?`url(${t})`:"linear-gradient(135deg, var(--background) 0%, var(--muted) 100%)",backgroundSize:"cover",backgroundPosition:"center",backgroundRepeat:"no-repeat",backgroundAttachment:o?"scroll":"fixed"}),[t,o]);return o?l("div",{className:"relative w-full px-4 pt-8",style:s,children:[t&&e("div",{className:"absolute inset-0 bg-black/50"}),e("div",{className:"pointer-events-none absolute top-0 right-0 left-0 h-24 bg-gradient-to-b from-black to-transparent",style:{zIndex:1}}),r,e("div",{className:"pointer-events-none absolute right-0 bottom-0 left-0 h-24 bg-gradient-to-t from-black to-transparent",style:{zIndex:1}})]}):l("div",{className:"relative w-full px-4 pt-8",style:s,children:[t&&e("div",{className:"absolute inset-0 bg-black/40"}),e("div",{className:"pointer-events-none absolute top-0 right-0 left-0 h-24 bg-gradient-to-b from-black to-transparent",style:{zIndex:1}}),r,e("div",{className:"pointer-events-none absolute bottom-0 h-32 w-full overflow-hidden sm:h-40 md:h-48",style:{zIndex:10,left:"50%",transform:"translateX(-50%)"},children:e("img",{src:"/img/animations/blur-bottom.svg",alt:"",className:"h-full min-w-full object-cover object-top",style:{opacity:.85,maskImage:"linear-gradient(to bottom, transparent 0%, black 20%)",WebkitMaskImage:"linear-gradient(to bottom, transparent 0%, black 20%)"},loading:"lazy",onError:a=>a.currentTarget.style.display="none"})})]})});export{g as NewsBackground};
