https://assets.blocket.se/pkg/frontpage-layout-v2/0.0.151/braze-content-card-island.js

1import{n as e,t}from"./hydrate.js";import{t as n}from"./dist.js";import{t as r}from"./useInView.js";import{r as i}from"./tracking.js";import{n as a}from"./ConfigContext.js";import{useCallback as o,useEffect as s,useState as c}from"https://assets.finn.no/npm/react/v19/react.production.min.js";function l({card:e,braze:t,threshold:n=.5}){let a=o(()=>{i(t,e,`View`)},[e,t]),{ref:s}=r({threshold:n,onEnter:a,enabled:!!e,once:!0});return{elementRef:s,trackViewEvent:a}}var u={high:3,medium:2,low:1};function d(e){return e===`high`||e===`medium`||e===`low`?u[e]:1}function f(e){return e.length===0?null:[...e].sort((e,t)=>{let n=d(e.extras?.priority),r=d(t.extras?.priority);return n===r?e.updated&&t.updated?t.updated.getTime()-e.updated.getTime():0:r-n})[0]}var p=[{id:`mock-wrong-location`,title:`Wrong location`,extras:{cardId:`wrong`,cardLocation:`profile`}},{id:`mock-dismissed`,title:`Already dismissed`,dismissed:!0,dismissible:!0,extras:{cardId:`dismissed`,cardLocation:`frontpage`,priority:`high`}},{id:`mock-low`,title:`Low priority`,extras:{cardId:`low`,cardLocation:`frontpage`,priority:`low`}},{id:`mock-winner`,title:`Frontpage test`,description:`This is how we test blocket braze cards!`,imageUrl:`https://cdn.pixabay.com/photo/2024/10/20/14/51/coffee-9135194_1280.jpg`,url:`https://dev.blocket.se/frontpage-layout-v2#web`,linkText:`URL2FRONTPAGE`,dismissible:!0,extras:{cardId:`frontpage-lv22`,cardLocation:`frontpage`,primaryButtonLink:`https://dev.blocket.se/frontpage-layout-v2#bl`,primaryButtonText:`GOTO Layout`,imageAltText:`A Vend bag next to a pool.`,priority:`medium`}}],m=e=>e.filter(e=>e.extras?.cardLocation===`frontpage`&&!e.dismissed);function h({testCard:e,useMockData:t=!1}){let[n,r]=c(()=>t?f(m(p)):e||null);s(()=>{if(t||!window.braze)return;let e=window.braze,n=e.subscribeToContentCardsUpdates(e=>{r(f(m(e.cards)))});return e.requestContentCardsRefresh(),()=>{e.removeSubscription(n)}},[t]);let a=typeof window<`u`?window.braze??null:null;return{card:n,braze:a,dismissCard:o(()=>{n&&(a&&i(a,n,`Dismiss`),r(null))},[a,n])}}var g=e();function _({testCard:e,useMockData:t=!1}={}){let{card:r,braze:o,dismissCard:s}=h({testCard:e,useMockData:t}),{locale:c}=a(),{elementRef:u}=l({card:r,braze:o,threshold:.5});if(!r||!r.title&&!r.description&&!r.imageUrl)return null;let d=r.url||r.extras?.primaryButtonLink,f=r.linkText||r.extras?.primaryButtonText,p=r.altImageText||r.extras?.imageAltText||``;return(0,g.jsxs)(`section`,{ref:u,id:`frontpage-banner`,"aria-labelledby":r.title?`fp-banner-header`:void 0,"data-card-id":r.extras?.cardId,className:`flex justify-between grow relative overflow-hidden rounded-8 s-surface-elevated-200 my-24`,children:[r.dismissible&&(0,g.jsx)(`w-button`,{variant:`overlay`,"icon-only":!0,small:!0,"aria-label":n.t({id:`frontpage.braze-content-card.dismiss`,message:`Dismiss banner`}),className:`absolute top-8 right-8 z-10 rounded-full`,onClick:s,children:(0,g.jsx)(`w-icon`,{name:`Close`,size:`small`,locale:c,className:`w-16 h-16 pointer-events-none`})}),(0,g.jsxs)(`div`,{className:`p-16 sm:p-24`,children:[r.title&&(0,g.jsx)(`h2`,{className:`h4 md:h3`,id:`fp-banner-header`,children:r.title}),r.description&&(0,g.jsx)(`p`,{className:`inline text-14 md:my-16`,children:r.description}),d&&f&&(0,g.jsx)(`div`,{className:`mr-8 mt-16`,children:(0,g.jsx)(`w-link`,{variant:`primary`,href:d,onClick:()=>i(o,r,`Click`),children:f})})]}),r.imageUrl&&(0,g.jsx)(`img`,{src:r.imageUrl,alt:p,className:`flex flex-1 items-center max-w-2/5 object-cover max-h-full`,style:{aspectRatio:`10/3`}})]})}t(`braze-content-card-island`,e=>(0,g.jsx)(_,{...e}));