https://www.c-monetiquette.fr/105.9bc2c80399fe22af375a.js

1(window.webpackJsonp=window.webpackJsonp||[]).push([[105],{"4tK0":function(e,n,o){"use strict"
2var t=o("JPst"),a=o.n(t)()((function(e){return e[1]}))
3a.push([e.i,"/* googleMapPickup.module.css */\n\n.googleMapPickup-root-WC3 {\n    display: flex;\n    flex-direction: column;\n}\n\n.googleMapPickup-mapContainer-z-W {\n    width: 100%;\n    height: 360px;\n    border-radius: 4px;\n    overflow: hidden;\n}\n\n/* Marker — carte Chronopost */\n.googleMapPickup-marker-7XT {\n    display: flex;\n    flex-direction: column;\n    align-items: stretch;\n    width: 56px;\n    background: #fff;\n    border: 2px solid #bdbdbd;\n    border-radius: 6px;\n    cursor: pointer;\n    white-space: nowrap;\n    /* ancrage : pointe de la flèche = point GPS */\n    transform: translate(-50%, calc(-100% - 8px));\n    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);\n    -webkit-user-select: none;\n       -moz-user-select: none;\n            user-select: none;\n    position: relative;\n}\n\n/* Flèche en bas — corps blanc */\n.googleMapPickup-marker-7XT::after {\n    content: '';\n    position: absolute;\n    bottom: -9px;\n    left: 50%;\n    transform: translateX(-50%);\n    width: 0;\n    height: 0;\n    border-left: 7px solid transparent;\n    border-right: 7px solid transparent;\n    border-top: 8px solid #bdbdbd;\n}\n\n/* Flèche — couche intérieure blanche (masque la bordure) */\n.googleMapPickup-marker-7XT::before {\n    content: '';\n    position: absolute;\n    bottom: -6px;\n    left: 50%;\n    transform: translateX(-50%);\n    width: 0;\n    height: 0;\n    border-left: 5px solid transparent;\n    border-right: 5px solid transparent;\n    border-top: 6px solid #fff;\n    z-index: 1;\n}\n\n/* Marker sélectionné */\n.googleMapPickup-markerSelected-mGy {\n    border-color: #aaee44;\n}\n\n.googleMapPickup-markerSelected-mGy::after {\n    border-top-color: #aaee44;\n}\n\n.googleMapPickup-markerSelected-mGy::before {\n    border-top-color: #fff;\n}\n\n.googleMapPickup-marker-7XT:focus,\n.googleMapPickup-markerSelected-mGy:focus {\n    outline: 2px solid #1a73e8;\n    outline-offset: 2px;\n}\n\n/* Zone logo (haut de la carte) */\n.googleMapPickup-markerLogoArea--ED {\n    background: #fff;\n    border-radius: 4px 4px 0 0;\n    overflow: hidden;\n    line-height: 0;\n}\n\n.googleMapPickup-markerLogo-FQq {\n    width: 100%;\n    height: auto;\n    display: block;\n}\n\n/* Bande bleue \"Pickup\" */\n.googleMapPickup-markerBand-glt {\n    background: #1a73e8;\n    color: #fff;\n    font-size: 10px;\n    font-weight: 700;\n    font-family: 'Quicksand', sans-serif;\n    text-align: center;\n    padding: 3px 0;\n    border-radius: 0 0 3px 3px;\n    letter-spacing: 0.5px;\n}\n\n/* Wrapper englobant la fiche détail + le bouton de confirmation.\n   scroll-margin-bottom laisse 20px sous le bouton lors du scrollIntoView. */\n.googleMapPickup-detailWrapper-zjZ {\n    scroll-margin-bottom: 20px;\n}\n\n/* Fiche détail (affichée sous la carte) */\n.googleMapPickup-detail-62g {\n    padding: 16px;\n    background: #fff;\n    border: 1px solid #000000;\n    border-radius: 10px;\n    margin-top: 16px;\n    display: flex;\n    flex-direction: column;\n    gap: 8px;\n}\n\n.googleMapPickup-detailHeader-bv0 {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n}\n\n.googleMapPickup-detailHoursTitle-o7Z {\n    font-family: 'Sofia Pro', sans-serif;\n    -webkit-text-decoration: underline solid #828282;\n            text-decoration: underline solid #828282;\n    font-size: 12px;\n    font-weight: 400;\n    color: #828282;\n    margin: 0;\n}\n.googleMapPickup-detailName-yzb {\n    font-size: 12px;\n    font-weight: 700;\n    color: #6cb2bb;\n    text-transform: uppercase;\n    margin: 0;\n}\n\n.googleMapPickup-detailMeta-8oK {\n    font-weight: 700;\n    font-family: 'Sofia Pro', sans-serif;\n    font-size: 12px;\n    color: #3d3e3e;\n    margin: 0;\n}\n\n.googleMapPickup-detailAddress-nE- {\n    font-weight: 700;\n    font-family: 'Sofia Pro', sans-serif;\n    font-size: 12px;\n    color: #3d3e3e;\n    margin: 0;\n}\n\n.googleMapPickup-detailHours-K-w {\n    font-size: 12px;\n    color: #828282;\n    margin: 0;\n}\n\n.googleMapPickup-confirmButton-YJW {\n    display: block;\n    width: 100%;\n    padding: 12px;\n    margin-top: 12px;\n    background: #6cb2bb;\n    color: #fff;\n    border: none;\n    border-radius: 8px;\n    font-size: 14px;\n    font-weight: 600;\n    cursor: pointer;\n    text-align: center;\n}\n\n.googleMapPickup-hoursToggle-T37 {\n    font-family: 'Sofia Pro', sans-serif;\n    font-size: 12px;\n    font-weight: 400;\n    line-height: 16px;\n    color: #828282;\n    -webkit-text-decoration: underline solid #828282;\n            text-decoration: underline solid #828282;\n    cursor: pointer;\n    background: none;\n    border: none;\n    padding: 0;\n    margin-top: 4px;\n}\n\n.googleMapPickup-hoursList-RwD {\n    list-style: none;\n    margin: 4px 0 0;\n    padding: 0;\n    font-size: 12px;\n    font-weight: 400;\n    color: #3d3e3e;\n}\n\n.googleMapPickup-hoursListItem-ANi {\n    display: flex;\n    line-height: 20px;\n}\n\n.googleMapPickup-hoursDayName-DM6 {\n    min-width: 80px;\n}\n\n/* Pin localisation adresse saisie */\n.googleMapPickup-userLocationPin-KAp {\n    width: 20p

3x;\n    height: 20px;\n    background: #1a73e8;\n    border: 3px solid #fff;\n    border-radius: 50% 50% 50% 0;\n    transform: translate(-50%, calc(-100% - 4px)) rotate(-45deg);\n    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.35);\n    pointer-events: none;\n}\n\n/* Message d'erreur chargement SDK */\n.googleMapPickup-error-Pmy {\n    font-size: 13px;\n    color: #d32f2f;\n    margin: 16px 0 0;\n    text-align: center;\n}\n",""]),a.locals={root:"googleMapPickup-root-WC3",mapContainer:"googleMapPickup-mapContainer-z-W",marker:"googleMapPickup-marker-7XT",markerSelected:"googleMapPickup-markerSelected-mGy googleMapPickup-marker-7XT",markerLogoArea:"googleMapPickup-markerLogoArea--ED",markerLogo:"googleMapPickup-markerLogo-FQq",markerBand:"googleMapPickup-markerBand-glt",detailWrapper:"googleMapPickup-detailWrapper-zjZ",detail:"googleMapPickup-detail-62g",detailHeader:"googleMapPickup-detailHeader-bv0",detailHoursTitle:"googleMapPickup-detailHoursTitle-o7Z",detailName:"googleMapPickup-detailName-yzb",detailMeta:"googleMapPickup-detailMeta-8oK",detailAddress:"googleMapPickup-detailAddress-nE-",detailHours:"googleMapPickup-detailHours-K-w",confirmButton:"googleMapPickup-confirmButton-YJW",hoursToggle:"googleMapPickup-hoursToggle-T37",hoursList:"googleMapPickup-hoursList-RwD",hoursListItem:"googleMapPickup-hoursListItem-ANi",hoursDayName:"googleMapPickup-hoursDayName-DM6",userLocationPin:"googleMapPickup-userLocationPin-KAp",error:"googleMapPickup-error-Pmy"},n.a=a},"5/hY":function(e,n,o){e.exports=o.p+"relay_icon-8hC.png"},mUAI:function(e,n,o){"use strict"
4o.r(n)
5var t=o("J4zp"),a=o.n(t),r=o("q1tI"),i=o.n(r),l=o("17x9"),c=o.n(l),s=o("kriW"),u=o("GcSG"),p=o("LiED"),d=o("5/hY"),g=o.n(d),f=o("Ms0P"),m=o("LboF"),k=o.n(m),b=o("4tK0"),h={injectType:"singletonStyleTag",insert:"head",singleton:!0},P=(k()(b.a,h),b.a.locals||{}),x={top:50,right:50,bottom:50,left:50},M=function isValidPoint(e){return Number.isFinite(parseFloat(e.coordGeolocalisationLatitude))&&Number.isFinite(parseFloat(e.coordGeolocalisationLongitude))},E=function HoursList(e){var n=e.listeHoraireOuverture,o=new Map(null==n?void 0:n.map((function(e){return[e.jour,e]})))
6return i.a.createElement("ul",{className:P.hoursList},Array.from({length:7},(function(e,n){var t=n+1,r=f.a[t]
7return i.a.createElement("li",{key:t,className:P.hoursListItem},i.a.createElement("span",{className:P.hoursDayName},i.a.createElement(s.a,{id:r.id,defaultMessage:r.defaultMessage})),i.a.createElement("span",null,function renderDayHours(e){var n
8if(!e)return i.a.createElement(s.a,{id:"checkoutPage.pickupPoint.closed",defaultMessage:"Closed"})
9var o=(null===(n=e.listeHoraireOuverture)||void 0===n?void 0:n.length)>0?e.listeHoraireOuverture:[],t=a()(o,2),r=t[0],l=t[1]
10return null!=r&&r.debut?i.a.createElement(i.a.Fragment,null,r.debut," - ",r.fin,l&&i.a.createElement(i.a.Fragment,null,i.a.createElement(s.a,{id:"checkoutPage.pickupPoint.hours.separator",defaultMessage:" et "}),l.debut," - ",l.fin)):e.horairesAsString}(o.get(t))))})))},v=function GoogleMapPickup(e){var n,o=e.points,t=e.onSelect,l=e.isLoaded,c=e.loadError,d=e.userLocation,f=e.onBoundsChange,m=Object(r.useState)(null),k=a()(m,2),b=k[0],h=k[1],v=Object(r.useState)(!0),w=a()(v,2),y=w[0],L=w[1],N=Object(r.useState)(!1),O=a()(N,2),F=O[0],C=O[1],A=Object(r.useRef)(null),S=Object(r.useRef)(null),T=Object(r.useRef)(!0),j=Object(r.useRef)(null),z=Object(r.useRef)(0),G=Object(r.useRef)(!1),D=Object(r.useRef)(d)
11Object(r.useEffect)((function(){if(b){var e,n=requestAnimationFrame((function(){e=requestAnimationFrame((function(){j.current&&j.current.scrollIntoView({behavior:"smooth",block:"end"})}))}))
12return function(){cancelAnimationFrame(n),e&&cancelAnimationFrame(e)}}}),[b])
13var H=Object(r.useState)((function(){return null!=d?d:function computeCenter(e){var n=e.filter(M)
14return n.length?{lat:n.reduce((function(e,n){return e+parseFloat(n.coordGeolocalisationLatitude)}),0)/n.length,lng:n.reduce((function(e,n){return e+parseFloat(n.coordGeolocalisationLongitude)}),0)/n.length}:{lat:48.8566,lng:2.3522}}(o)})),R=a()(H,1)[0]
15Object(r.useEffect)((function(){if(F&&A.current&&!G.current){var e=o.filter(M)
16if(e.length){var n=new google.maps.LatLngBounds
17e.forEach((function(e){n.extend({lat:parseFloat(e.coordGeolocalisationLatitude),lng:parseFloat(e.coordGeolocalisationLongitude)})})),d&&n.extend(d),z.current=Date.now(),A.current.fitBounds(n,x),G.current=!0}else d&&(z.current=Date.now(),A.current.panTo(d))}}),[F,o,d]),Object(r.useEffect)((function(){var e=D.current!==d
18D.current=d,e&&G.current&&(G.current=!1,A.current&&d&&(z.current=Date.now(),A.current.panTo(d),A.current.setZoom(14)))}),[d])
19var B=Object(r.useCallback)((function(e){A.current=e,S.current=ne

19w google.maps.Geocoder,C(!0)}),[]),K=Object(r.useCallback)((function(){if(T.current)T.current=!1
20else if(!(Date.now()-z.current<1e3)&&A.current&&f&&S.current){var e=A.current.getCenter(),n=e.lat(),o=e.lng()
21S.current.geocode({location:{lat:n,lng:o}},(function(e,t){var a,r,i
22if("OK"===t&&null!=e&&e[0]){var l=e[0].address_components||[],c=(null===(a=l.find((function(e){return e.types.includes("postal_code")})))||void 0===a?void 0:a.long_name)||"",s=(null===(r=l.find((function(e){return e.types.includes("locality")})))||void 0===r?void 0:r.long_name)||"",u=(null===(i=l.find((function(e){return e.types.includes("country")})))||void 0===i?void 0:i.short_name)||"FR"
23c&&f({postcode:c,city:s,street:"",countryCode:u,lat:n,lng:o,formattedAddress:e[0].formatted_address||""})}}))}}),[f])
24if(c)return i.a.createElement("p",{className:P.error},i.a.createElement(s.a,{id:"pickupFlowV2.map.loadError",defaultMessage:"La carte n'a pas pu se charger. Veuillez utiliser la vue Liste."}))
25if(!l)return i.a.createElement(p.a,{parentName:"GoogleMapPickup"})
26var W=o.filter(M),_=W.find((function(e){return e.identifiant===b}))||null,I=_?function formatDistance(e){var n=Number(e)
27return!e||isNaN(n)?null:"".concat((.001*n).toFixed(1)," km")}(_.distanceEnMetre):null
28return i.a.createElement("div",{className:P.root},i.a.createElement(u.a,{mapContainerClassName:P.mapContainer,center:R,zoom:14,onLoad:B,onIdle:K},W.map((function(e){return i.a.createElement(u.b,{key:e.identifiant,position:{lat:parseFloat(e.coordGeolocalisationLatitude),lng:parseFloat(e.coordGeolocalisationLongitude)},mapPaneName:u.b.OVERLAY_MOUSE_TARGET},i.a.createElement("div",{className:b===e.identifiant?P.markerSelected:P.marker,onClick:function onClick(){h(e.identifiant),L(!0)},onKeyDown:function onKeyDown(n){"Enter"!==n.key&&" "!==n.key||(h(e.identifiant),L(!0))},role:"button",tabIndex:0,"aria-label":e.nom},i.a.createElement("div",{className:P.markerLogoArea},i.a.createElement("img",{src:g.a,alt:"",className:P.markerLogo}))))})),d&&i.a.createElement(u.b,{position:d,mapPaneName:u.b.OVERLAY_MOUSE_TARGET},i.a.createElement("div",{className:P.userLocationPin}))),_&&i.a.createElement("div",{ref:j,className:P.detailWrapper},i.a.createElement("div",{className:P.detail},i.a.createElement("div",{className:P.detailHeader},i.a.createElement("p",{className:P.detailName},_.nom),I&&i.a.createElement("p",{className:P.detailMeta},I)),i.a.createElement("p",{className:P.detailAddress},_.adresse1,i.a.createElement("br",null),_.codePostal," ",_.localite),(null===(n=_.listeHoraireOuverture)||void 0===n?void 0:n.length)>0&&i.a.createElement("div",null,i.a.createElement("button",{type:"button",className:P.hoursToggle,onClick:function onClick(e){e.stopPropagation(),L((function(e){return!e}))}},i.a.createElement(s.a,{id:"checkoutPage.pickupPoint.hours",defaultMessage:"Horaires"})),y&&i.a.createElement(E,{listeHoraireOuverture:_.listeHoraireOuverture}))),i.a.createElement("button",{className:P.confirmButton,onClick:function onClick(e){e.stopPropagation(),t(_)}},i.a.createElement(s.a,{id:"pickupFlowV2.choosePoint",defaultMessage:"Choisir ce point relais"}))))}
29v.propTypes={points:c.a.array.isRequired,onSelect:c.a.func.isRequired,isLoaded:c.a.bool.isRequired,loadError:c.a.object,userLocation:c.a.shape({lat:c.a.number,lng:c.a.number}),onBoundsChange:c.a.func}
30n.default=v}}])