https://www.opel.com.sg/etc.clientlibs/stellantis-whitelabel/clien…/resources/js/899.983b2e11961b318de045.js

1/*! stellantis-whitelabel 2026.923.1111206.0009148307 */
2(self.webpackChunkcanvashotspot=self.webpackChunkcanvashotspot||[]).push([[899],{7808:(e,t,n)=>{"use strict";n.r(t),n.d(t,{mount:()=>M});var r=n(7393),s=n.n(r),o=n(4645);const a=e=>{let t,n;e.classList.add("is--scrollDragged"),window.isDown=!1,window.isMoving=!1;let r,s=0;const o=()=>cancelAnimationFrame(r),a=()=>{e.scrollLeft+=s,s*=.97,Math.abs(s)>.5&&(r=requestAnimationFrame(a))};e.addEventListener("mousedown",r=>{window.isDown=!0,e.classList.add("is--grabbed"),t=r.pageX-e.offsetLeft,n=e.scrollLeft,o()}),e.addEventListener("mouseleave",()=>{window.isDown=!1,window.isMoving=!1,e.classList.remove("is--grabbed")}),e.addEventListener("mouseup",()=>{window.isDown=!1,e.classList.remove("is--grabbed"),o(),r=requestAnimationFrame(a)}),e.addEventListener("mousemove",r=>{if(!window.isDown)return;window.isMoving=!0,r.preventDefault();const o=2*(r.pageX-e.offsetLeft-t),a=e.scrollLeft;e.scrollLeft=n-o,s=e.scrollLeft-a})};var i=n(216),l=n.n(i);n(7271);const c=({kicker:e})=>s().createElement("div",{className:"wl-canvashotspot-kicker-underline wlb-size-heading-6"},e);c.propTypes={kicker:l().string},c.defaultProps={kicker:""};const d=c;n(5539);var u=n(30),p=n(3993),h=n.n(p),g=n(841),m=n.n(g);const b=[],f=(()=>{const e=[];for(let t=0;t<256;t++)e[t]=(t<16?"0":"")+t.toString(16);return e})();const w=function e(t){t=t||"";const n=4294967295*Math.random()|0,r=4294967295*Math.random()|0;let s=t+f[255&n]+f[n>>8&255]+f[n>>16&255]+f[n>>24&255]+"-"+f[255&r]+f[r>>8&255];return b.indexOf(s)>=0&&(s=e(t)),b.push(s),s};class v extends r.Component{state={error:"",errorInfo:"",hasError:!1};static getDerivedStateFromError(e){return{hasError:!0,error:e}}componentDidCatch(e,t){console.error({error:e,errorInfo:t}),this.setState({errorInfo:t})}render(){return this.state.hasError?this.props.fallBack||null:this.props.children}}v.propTypes={children:l().oneOfType([l().object,l().array]).isRequired,fallBack:l().oneOf([l().string,l().element])};const T=(e,t=s().createElement("div",null,"Loading..."))=>{const n=s().lazy(e);return e=>s().createElement(v,null,s().createElement(r.Suspense,{fallback:t},s().createElement(n,e)))};const y=function(e=764){const[t,n]=(0,r.useState)(()=>"undefined"!=typeof window&&window.innerWidth<=e);return(0,r.useEffect)(()=>{const t=()=>{(0,r.startTransition)(()=>{n(window.innerWidth<=e)})};return window.addEventListener("resize",t),t(),()=>{window.removeEventListener("resize",t)}},[e]),t},E=e=>t=>{const{id:n,...o}=t,a=(0,r.useMemo)(()=>{if("undefined"==typeof window||"undefined"==typeof document)return null;if(!n)return o;const e=document.getElementById("wl-tooltip-mapping");if(!e)return o;const t=e.getAttribute("data-props");if(!t)return o;const{tooltipsList:r=[]}=JSON.parse(t),s=r.find(e=>e.id===n);return s?{id:n,...o,...s}:o},[n,o]);return s().createElement(e,a)},L=({onOpen:e,onClose:t,delay:n=150,targetElementId:s})=>{const o=(0,r.useRef)(null),a=(0,r.useRef)(null),i=(0,r.useCallback)(()=>{o.current&&(clearTimeout(o.current),o.current=null)},[]),l=(0,r.useCallback)(()=>{a.current&&(a.current.abort(),a.current=null)},[]);return{handleMouseEnter:(0,r.useCallback)(()=>{o.current?i():e()},[e,i]),handleMouseLeave:(0,r.useCallback)(()=>{l(),i();const e=new AbortController;a.current=e;const{signal:r}=e;o.current=setTimeout(()=>{o.current=null,t()},n);const c=document.getElementById(s);c&&(c.addEventListener("mouseenter",()=>{i()},{signal:r}),c.addEventListener("mouseleave",()=>{o.current=setTimeout(()=>{o.current=null,t()},n)},{signal:r}))},[t,n,s,l,i]),cleanup:(0,r.useCallback)(()=>{i(),l()},[i,l])}};const k=globalThis?.whitelabel?.stores?.__WL_TOOLTIP__||new class{constructor(e){if(globalThis.whitelabel??={},globalThis.whitelabel.stores??={},void 0!==globalThis.whitelabel.stores.__WL_TOOLTIP__)return globalThis.whitelabel.stores.__WL_TOOLTIP__;this.state=e,this.listeners=[],globalThis.whitelabel.stores.__WL_TOOLTIP__=this}getState(){return this.state}getTooltipNumber(e){return this.state.contentList.indexOf(e)+1||"i"}subscribe(e){return this.listeners.push(e),()=>{this.listeners=this.listeners.filter(t=>t!==e)}}dispatch(e){this.state=this.reducer(this.state,e),this.listeners.forEac

2h(e=>e())}insertIntoContentList(e,t){if(!t||e.includes(t))return e;const n=document.querySelector(`span[data-tooltip-id-wl="${t}"]`),r=[...e],s=r.findIndex(e=>{const t=document.querySelector(`span[data-tooltip-id-wl="${e}"]`);return t&&n&&n.compareDocumentPosition(t)&Node.DOCUMENT_POSITION_FOLLOWING});return-1===s?r.push(t):r.splice(s,0,t),r}getUpdatedVisibleTooltips(e,t,n){const r=e[t];if(r?.visible&&r?.triggerTooltipId===n){const n={...e};return delete n[t],n}return{[t]:{visible:!0,triggerTooltipId:n}}}reducer(e,t){switch(t.type){case"UPDATE_CONTENT_LIST":return{...e,contentList:this.insertIntoContentList(e.contentList,t.payload)};case"SHOW_TOOLTIP":{const{tooltipInfoId:n,triggerTooltipId:r}=t.payload;return{...e,visibleTooltips:this.getUpdatedVisibleTooltips(e.visibleTooltips,n,r)}}case"HIDE_TOOLTIP":{const{tooltipInfoId:n}=t.payload;if(!e.visibleTooltips[n])return e;const r={...e.visibleTooltips};return delete r[n],{...e,visibleTooltips:r}}default:return e}}}({contentList:[],visibleTooltips:{}});n(2135);function I(){return I=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)({}).hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},I.apply(null,arguments)}const O=T(()=>n.e(53).then(n.t.bind(n,9053,23)),s().createElement("span",null)),_=T(()=>n.e(23).then(n.bind(n,4023)),s().createElement("span",null)),x=({id:e,icon:t,numbered:n,analytics:o,openOn:a,theme:i})=>{const l=(0,r.useRef)(null),c=(0,r.useRef)(w("wl-tooltip-trigger-")),d=y(),[u,p]=(0,r.useState)(),h="click"===(d?"click":a);(0,r.useEffect)(()=>{const t=k.subscribe(()=>{(0,r.startTransition)(()=>{p(k.getTooltipNumber(e))})}),s=l.current?.parentNode;return s&&(s.removeAttribute("style"),s.classList.remove("wlb-custom-display-none")),n&&k.dispatch({type:"UPDATE_CONTENT_LIST",payload:e}),l.current&&(l.current.setAttribute("data-tooltip-id-wl",e),l.current.setAttribute("data-trigger-id-wl",c.current)),()=>{t(),T()}},[e,n]);const g=()=>{k.dispatch({type:"SHOW_TOOLTIP",payload:{tooltipInfoId:e,triggerTooltipId:c.current}})},b=()=>{k.dispatch({type:"HIDE_TOOLTIP",payload:{tooltipInfoId:e}})},{handleMouseEnter:f,handleMouseLeave:v,cleanup:T}=L({onOpen:g,onClose:b,delay:150,targetElementId:e});return s().createElement("span",I({ref:l,className:"wl-tooltip-button-wrapper"},!h&&{onMouseEnter:f,onMouseLeave:v}),s().createElement(O,I({className:m()("wl-tooltip-button","wlb-size-body-regular"),tabIndex:0,nodeName:"button",wrapperNodeName:"span",iconRight:"",theme:"dark"===i?"light":"dark",ariaLabel:n?`tooltip-${e}`:"tooltip",ariaDescribedby:e,ariaExpanded:!1,ariaControls:e,analytics:o},!h&&{onFocus:g,onBlur:b},{action:h?g:void 0,textClassName:n?"wlb-size-body-regular":void 0}),n&&u?`(${u})`:s().createElement(_,{size:"16",name:t||"wlb-icon-information-outline"})))};x.propTypes={id:l().string.isRequired,icon:l().string,analytics:l().object,theme:l().oneOf(["light","dark"]),numbered:l().bool,openOn:l().oneOf(["hover","click"])},x.defaultProps={icon:"wlb-icon-information-outline",numbered:!1,openOn:"click",theme:"dark"};const C=E(s().memo(x)),N=(e,t,n)=>{if(!e)return"";const r=e.replace(/&amp;/gi,"&").replace(/&lt;/gi,"<").replace(/&gt;/gi,">").replace(/&trade;/gi,"™").replace(/&reg;/gi,"®"),o={a:h().simpleTransform("a",{rel:"noopener noreferrer",target:"_blank"}),img:h().simpleTransform("img",{loading:"lazy"})};n&&"object"==typeof n&&Object.keys(n).forEach(e=>{const t=n[e];t&&"string"==typeof t&&(o[e]=(e,n)=>({tagName:e,attribs:{...n,class:n.class?`${n.class} ${t}`:t}}))});const a=t||{allowedTags:["p","b","i","em","strong","u","s","br","ul","ol","li","blockquote","code","pre","a","span","div","h1","h2","h3","h4","h5","h6","img","hr","sub","sup"],allowedAttributes:{a:["href","target","rel","name"],img:["src","alt","title","width","height"],span:["style","class","id","data-app-wl","data-props"],"*":["style","class","id"]},allowedStyles:{"*":{"text-align":[/^left$/,/^right$/,/^center$/,/^justify$/],"font-weight":[/^bold$/,/^\d+$/],"font-style":[/^italic$/],"text-decoration":[/^underline$/,/^line-through$/],color:[/^#[0-9A-Fa-f]+$/,/^rgb\((.*)\)$/],"background-color":[/^#[0-9A-Fa-f]+$/,/^rgb\((.*)\)$/],"font-size":[/^\d*(\.\d+)?(?:px|em|%)$/]}},allowedSchemes:["http","https","mailto"],transformTags:o,disallowedTagsMode:"discard",selfClosing:["img","br","hr"],nonTextTags:["style","script","textarea","noscript"]},i=h()(r,a),l={replace:e=>{if("tag"===e.type&&"span"===e.name&&e.attribs&&"WlTooltip"===e.attribs["data-app-wl"]&&e.attribs["data-props"])try{const t=JSON.parse(e.attribs["data-props"]);return s().createElement("span",(0,u.e_)(e.attribs),s().createElement(C,t))}catch(t){return console.error("Failed to parse data-props for WlTooltip:",t),e}}};return(0,u.ZP)(i,l)};function $(){return $=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)({}).hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},$.apply(null,arguments)}const A=({headingLevelTag:e="h2",headingText:t,headingTypography:n="",headingCustomClassname:r="",headingId:o=""})=>{const a=m()("wl-headingtext-wrapper",n&&n,r&&r);return s().createElement(e,$({className:a},o?{id:o}:{}),N(t))};A.propTypes={headingLevelTag:l().string,headingText:l().string.isRequired,headingTypography:l().string,headingCustomClassname:l().string,headingId:l().string};

2const S=A,D=e=>{const{id:t,index:n,context:o,schema:i,kicker:l,headline:c,arrowText:u,image:p,headLineLevel:h}=e,g=(0,r.useRef)(),m=e=>{const t=new CustomEvent("wl-modal-open",{detail:{containerId:e}});document.dispatchEvent(t)};return(0,r.useEffect)(()=>{let e;return(async t=>{const n=await fetch(t);(e=>{const t=(new DOMParser).parseFromString(e,"image/svg+xml").documentElement;g.current.appendChild(t)})(await n.text()),(()=>{const e=[].slice.call(g.current.querySelectorAll("rect")),t=g.current.querySelector("svg");e.map(e=>{if(null===e.getAttribute("id"))return;const n=+e.getAttribute("x"),r=+e.getAttribute("width")+n,s=+e.getAttribute("y"),o=+e.getAttribute("height")+s,a=e.getAttribute("aria-label")||"",i=(n+r)/2,l=(s+o)/2;t.insertAdjacentHTML("beforeend",`\n          <g class="wl-hotspot-group" transform="translate(${i}, ${l})">\n            <circle class="wl-hotspot wl-hotspot-circle-main" data-testid={'wl-circle'} id="${e.id}" r='30' role="button" tabindex="0" aria-label="${a||"hotspot-circle-main"}"/>\n            <circle class="wl-hotspot-circle-inner" r='20'/>\n            <circle class="wl-hotspot-circle-pulse" r='30'/>\n          </g>`),e.remove()})})(),a(g.current),e=g.current.querySelectorAll(".wl-hotspot-circle-main"),(e=>{e?.forEach(e=>{e.addEventListener("click",()=>{m(e.id)}),e.addEventListener("keydown",t=>{"Enter"!==t.key&&" "!==t.key||(t.preventDefault(),m(e.id))})})})(e)})((e=>window.location.host?.includes("localhost")?e:window.location.protocol+"//"+window.location.host+e)(p?.desktopImg)),()=>{(e=>{e?.forEach(e=>{e.removeEventListener("click",()=>{m(e.id)}),e.addEventListener("keydown",()=>{m(e.id)})})})(e)}},[]),s().createElement("section",{id:t,"data-index":n,"data-context":o,"data-theme":"white"===i?"light":"dark",className:"wl-canvas-hotspot","data-testid":"wl-canvas-hotspot-container"},s().createElement("div",{className:"wl-canvas-hotspot__text"},s().createElement("div",{className:"wl-canvas-hotspot__text--container"},l&&s().createElement(d,{kicker:l}),c&&s().createElement(S,{headingLevelTag:h||"div",headingTypography:"wlb-size-heading-4",headingText:c,headingCustomClassname:`headline ${h&&"wlb-size-margin-0"}`}))),u&&s().createElement("div",{className:"wl-canvas-hotspot__helperText wlb-size-body-regular",tabIndex:"0","aria-label":u},u),s().createElement("div",{className:"wl-canvas-hotspot__canvas","data-image":p?.desktopImg,ref:g,"data-testid":"wl-canvas-hotspot-canvas"}))};D.propTypes={id:l().string,index:l().string,context:l().string,schema:l().string,headline:l().string,kicker:l().string,arrowText:l().string,image:l().object,headLineLevel:l().string};const P=D,M=(e,t={})=>{o.createRoot(e).render(s().createElement(P,t))}},1839:(e,t,n)=>{"use strict";n.r(t)},6805:(e,t,n)=>{"use strict";n.r(t)},5761:(e,t,n)=>{"use strict";n.r(t)},7271:(e,t,n)=>{var r=n(1839);"string"==typeof r&&(r=[[e.id,r,""]]);var s={hmr:!0,transform:void 0,insertInto:void 0};n(63)(r,s);r.locals&&(e.exports=r.locals)},5539:(e,t,n)=>{var r=n(6805);"string"==typeof r&&(r=[[e.id,r,""]]);var s={hmr:!0,transform:void 0,insertInto:void 0};n(63)(r,s);r.locals&&(e.exports=r.locals)},2135:(e,t,n)=>{var r=n(5761);"string"==typeof r&&(r=[[e.id,r,""]]);var s={hmr:!0,transform:void 0,insertInto:void 0};n(63)(r,s);r.locals&&(e.exports=r.locals)},7544:()=>{},9599:()=>{},2310:()=>{},3842:()=>{},5695:()=>{}}]);