https://www.lundbergsfastigheter.se/_next/static/chunks/3322.b7e3533558c8f66f.js

1"use strict";(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[3322],{23322:function(e,t,n){n.r(t),n.d(t,{default:function(){return w}});var l=n(85893),r=n(67294),a=n(81323),s=n(97828),i=n(14324),o=n(96021),u=n(85384),d=n(26487),c=n(35005),m=n(45537);let g=(e,t)=>{if(1===t)return{lat:0,lng:0};let n=2*Math.PI*e/t;return{lat:5e-5*Math.cos(n),lng:5e-5*Math.sin(n)}},h=e=>{let t={};return e.forEach(e=>{let n=`${e.latitude.toFixed(6)},${e.longitude.toFixed(6)}`;t[n]||(t[n]=[]),t[n].push(e)}),t},f=e=>(0,l.jsx)("svg",{width:"36",height:"49",viewBox:"0 0 36 49",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:(0,l.jsx)("path",{d:"M36 18C36 26.25 25.0312 40.7812 20.1562 46.875C19.0312 48.2812 16.875 48.2812 15.75 46.875C10.9688 40.7812 0 26.25 0 18C0 8.0625 8.0625 0 18 0C27.9375 0 36 8.0625 36 18Z",fill:e?"var(--darkGreen)":"var(--green)"})}),k=e=>`
2    <svg width="36" height="49" viewBox="0 0 36 49" fill="none" xmlns="http://www.w3.org/2000/svg">
3        <path
4            d="M36 18C36 26.25 25.0312 40.7812 20.1562 46.875C19.0312 48.2812 16.875 48.2812 15.75 46.875C10.9688 40.7812 0 26.25 0 18C0 8.0625 8.0625 0 18 0C27.9375 0 36 8.0625 36 18Z"
5            fill="var(--green)" />
6        <text x="18" y="20" text-anchor="middle" dominant-baseline="middle" font-family="CircularXX TT, sans-serif" font-size="14px" font-weight="700" fill="white">${e}</text>
7    </svg>
8  `,p={render:e=>{let{count:t,position:n,markers:l}=e,r=l?.length||t,a=k(r),s=document.createElement("div");return s.innerHTML=a,s.style.width="44px",s.style.height="56px",new google.maps.marker.AdvancedMarkerElement({position:n,content:s,title:`${r} bost\xe4der p\xe5 kartan`,zIndex:Number(google.maps.Marker.MAX_ZINDEX)+r})}},x=r.memo(e=>{let{isHighlighted:t,onMouseEnter:n,onMouseLeave:r}=e;return(0,l.jsx)("div",{onMouseEnter:n,onMouseLeave:r,style:{cursor:"pointer",width:"44px",height:"56px"},children:f(t)})});x.displayName="MarkerContent";let b=r.memo(e=>{let{listing:t,offset:n,isSelected:s,isHovered:i,setMarkerRef:o,handleClick:u,handleMouseEnter:d,handleMouseLeave:c}=e,g=(0,r.useCallback)(e=>{u(t.marketObjectId)(e),m.Z.sendEvent({event:"click_map"})},[u,t.marketObjectId]),h=r.useMemo(()=>d(t.marketObjectId),[d,t.marketObjectId]),f=(0,r.useCallback)(e=>{o(e,t.marketObjectId)},[o,t.marketObjectId]);return(0,l.jsx)(a._Q,{position:{lat:t.latitude+n.lat,lng:t.longitude+n.lng},ref:f,clickable:!0,title:`Visa bostad p\xe5 ${t.address||"vald adress"}`,zIndex:s||i?1e3:void 0,onClick:g,children:(0,l.jsx)(x,{isHighlighted:s||i,onMouseEnter:h,onMouseLeave:c})})});b.displayName="MarkerWrapper";let j=e=>{let{pois:t,onMarkerClick:n,selectedListingId:i,hoveredListingId:o}=e,u=(0,a.Sx)(),[d,c]=r.useState({}),m=r.useMemo(()=>u?new s.XL({map:u,renderer:p}):null,[u]),f=(0,r.useRef)(0),[k,x]=r.useState(null),j=(0,r.useRef)({}),v=o||k;(0,r.useEffect)(()=>{m&&(m.clearMarkers(),m.addMarkers(Object.values(d)))},[m,d]),(0,r.useEffect)(()=>()=>{m&&m.clearMarkers()},[m]),(0,r.useEffect)(()=>{if(u&&0!==t.length&&f.current!==t.length&&t.length>0){let e=new google.maps.LatLngBounds;t.forEach(t=>{e.extend({lat:t.latitude,lng:t.longitude})}),u.fitBounds(e,{top:50,right:50,bottom:50,left:50}),f.current=t.length}},[u,t]);let w=(0,r.useCallback)((e,t)=>{(!e||j.current[t]!==e)&&(e||j.current[t])&&(e?j.current[t]=e:delete j.current[t],c(n=>{if(e)return{...n,[t]:e};{let{[t]:e,...l}=n;return l}}))},[]),M=(0,r.useCallback)(e=>l=>{if(!u||!l.latLng)return;let r=t.find(t=>t.marketObjectId===e);r&&(n(r),u.panTo(l.latLng))},[u,n,t]),C=(0,r.useCallback)(e=>()=>{x(e)},[]),E=(0,r.useCallback)(()=>{x(null)},[]),Z=r.useMemo(()=>{let e=h(t),n=[];return Object.values(e).forEach(e=>{let t=e.length>1;e.forEach((l,r)=>{let a=g(r,e.length);n.push({listing:l,offset:a,hasOffset:t})})}),n},[t]);return(0,l.jsx)(l.Fragment,{children:Z.map(e=>{let{listing:t,offset:n,hasOffset:r}=e;return(0,l.jsx)(b,{listing:t,offset:n,isSelected:i===t.marketObjectId,isHovered:v===t.marketObjectId,setMarkerRef:w,handleClick:M,handleMouseEnter:C,handleMouseLeave:E},t.marketObjectId)})})},v=e=>{let{selectedListing:t,onFullscreen:n,isFullscreen:s,setSelectedListing:m}=e,g=(0,a.Sx)(),h=(0,r.useRef)(null);return(0,r.useEffect)(()=>

8{if(!g||!t||!h.current||!(window.innerWidth<768))return;let e=h.current.offsetHeight;if(e){let n=g.getZoom()||13,l=new google.maps.LatLng(t.latitude,t.longitude),r=g.getProjection()?.fromLatLngToPoint(l);if(r){let t=new google.maps.Point(r.x,r.y+.7*e/2/Math.pow(2,n)),l=g.getProjection()?.fromPointToLatLng(t);l&&g.panTo(l)}}},[t]),(0,l.jsxs)(l.Fragment,{children:[(0,l.jsxs)("div",{className:"map-controls",children:[(0,l.jsx)(c.Z,{variant:"sky200",className:"py-2 px-3 map-fullscreen-btn",onClick:n,children:s?(0,l.jsx)(l.Fragment,{children:"F\xf6rminska"}):(0,l.jsx)(l.Fragment,{children:"F\xf6rstora"})}),(0,l.jsxs)("div",{className:"map-zoom-controls",children:[(0,l.jsx)(c.Z,{variant:"sky200",className:"btn-xs p-2 map-zoom-btn map-zoom-in-btn",onClick:()=>{if(g){let e=g.getZoom()||13;g.setZoom(e+1)}},"aria-label":"Zooma in kartan",title:"Zooma in kartan",children:(0,l.jsx)(u.Z,{width:24,height:24,fill:"var(--nightsky)"})}),(0,l.jsx)(c.Z,{variant:"sky200",className:"btn-xs p-2 map-zoom-btn map-zoom-out-btn",onClick:()=>{if(g){let e=g.getZoom()||13;g.setZoom(e-1)}},"aria-label":"Zooma ut kartan",title:"Zooma ut kartan",children:(0,l.jsx)(d.Z,{width:24,height:24,fill:"var(--nightsky)"})})]})]}),t&&(0,l.jsxs)("div",{className:"apartment-card-popup",ref:h,children:[(0,l.jsx)(i.Z,{listing:t}),(0,l.jsx)(c.Z,{variant:"green100",className:"btn-xs apartment-card-popup-close",onClick:()=>m(null),"aria-label":"St\xe4ng kartkort",title:"St\xe4ng kartkort",children:(0,l.jsx)(o.Z,{width:16,height:16,fill:"var(--darkGreen)"})})]})]})};function w(e){let{listings:t,hoveredListingId:n}=e,[s,i]=r.useState(null),[o,u]=r.useState(!1),d=(0,r.useRef)(null);(0,r.useEffect)(()=>{let e=()=>{u(!!document.fullscreenElement)};return document.addEventListener("fullscreenchange",e),()=>{document.removeEventListener("fullscreenchange",e)}},[]),(0,r.useEffect)(()=>{i(null)},[t]);let c=r.useMemo(()=>t.filter(e=>e.latitude&&e.longitude),[t]),m=r.useMemo(()=>{if(0===c.length)return{lat:57.7089,lng:11.9746};let e=c.reduce((e,t)=>e+t.latitude,0),t=c.reduce((e,t)=>e+t.longitude,0);return{lat:e/c.length,lng:t/c.length}},[c]);return(0,l.jsx)("div",{ref:d,style:{position:"relative",width:"100%",height:"100%"},children:(0,l.jsxs)(a.D5,{mapId:"67ae748655d76f72de8fbee2",defaultZoom:13,defaultCenter:m,gestureHandling:"greedy",disableDefaultUI:!0,onDrag:()=>i(null),reuseMaps:!0,clickableIcons:!1,maxZoom:20,children:[(0,l.jsx)(j,{pois:c,onMarkerClick:i,selectedListingId:s?.marketObjectId||null,hoveredListingId:n}),(0,l.jsx)(v,{selectedListing:s,setSelectedListing:i,onFullscreen:()=>{d.current&&(document.fullscreenElement?(document.exitFullscreen(),u(!1)):(d.current.requestFullscreen(),u(!0)))},isFullscreen:o})]})})}}}]);