https://www.ajprodukte.de/assets/26.chunk.c293f4090d28969e55d0.js

1"use strict";(globalThis.webpackChunknitro5_app=globalThis.webpackChunknitro5_app||[]).push([[26,3686],{60026(e,t,o){o.d(t,{default:()=>y});var i=o(26166),n=o(63696),r=o(95082),s=o(10774),l=o(75083),a=o(89224),c=o(25927),d=o(85838),p=o(81349),m=o(20153),u=o(53686);const h=function({hotspotDevice:e}){const t=e.hotspots.filter(e=>e.expanded).map(e=>e.article.itemNumber),[o,i]=(0,n.useState)(t);return{activeHotspotIds:o,setActiveHotspotIds:i}};var f=o(73532),b=o(18455),g=o(31678),v=o(50037);var I=o(39879);const x=(0,s.I4)((0,s.yd)(function(e){var{component:t,className:o,name:r}=e,s=(0,i.__rest)(e,["component","className","name"]);const d=(0,g.d)(e=>e.appShellData.siteSettings.brand),I=(0,a.in)(),x=(0,c.DD)(),{desktop:y,mobile:T,altText:C}=s,O=(0,m.rR)(),D=(0,p.mD)(100*O),S=x&&T.image&&T||y,{activeHotspotIds:A,setActiveHotspotIds:B}=h({hotspotDevice:S}),N=(0,n.useRef)(null),R=r,{trackedImpressionIndexes:j}=function(e,t,o){const i=(0,g.d)(e=>e.appShellData.siteSettings.brand),r=(0,n.useMemo)(()=>o.reduce((e,t,o)=>t.expanded?[...e,o]:e,[]),[o]),s=(0,n.useRef)(r);return(0,v.S)(e,{onlyRunOnce:!0,stateful:!1,threshold:.7,callback:()=>{(0,f.kg)(t);for(const e of r)(0,f.Ol)(Object.assign(Object.assign({},(0,b.sF)(o[e].article,e,i)),{interaction_option:"visible"}),t)}}),{trackedImpressionIndexes:s}}(N,R,S.hotspots);return n.createElement(t,{className:o,css:w},n.createElement(l.RQ,{appearance:s.appearance,defaultAppearance:I},n.createElement(E,{ref:N},n.createElement(k,{src:S.image,preset:D,alt:C}),S.hotspots.map((e,t)=>{const o=`${e.article.itemNumber}-${t}`,i=null==A?void 0:A.includes(e.article.itemNumber);return n.createElement(u.default,Object.assign({},e,{key:o,index:t,listName:R,trackImpression:()=>{j.current.includes(t)||((0,f.Ol)(Object.assign(Object.assign({},(0,b.sF)(e.article,t,d)),{interaction_option:e.expanded?"visible":"hidden"}),R),j.current.push(t))},setActiveHotspotIds:B,expanded:i}))}))))}),{height:"100%"}),y=(0,r.pG)(x),E=s.I4.div({position:"relative"}),k=(0,s.I4)(d.Ay,{height:"100%"}),w={ZIndex:I.Py.InfoToolTip,position:"relative"}},53686(e,t,o){o.d(t,{default:()=>D});var i=o(63696),n=o(10774),r=o(39372),s=o(39879),l=o(11386),a=o(30561),c=o(70702),d=o(34232),p=o(29531),m=o(16835),u=o(58463),h=o(83137),f=o(93538),b=o(73532),g=o(18455),v=o(31678);const I=function({listName:e,hotspotArticle:t,index:o,id:n}){const r=(0,v.d)(e=>e.appShellData.siteSettings.brand);return i.createElement(x,{id:n,onClick:()=>{(0,b.bv)([(0,g.sF)(t,o,r)],e)},to:t.url,"aria-label":t.name},!!t.hasSeveralEmbodiments&&i.createElement(E,null,(0,a.TlY)("/Product/ExistAsSeveralVariants")),i.createElement(y,null,t.name),i.createElement(k,null,i.createElement(p.A,{realTimePrice:t.realTimePrice},i.createElement(w,null,i.createElement(d.A,{isPreviousLowestGray:!0,hidePreviousLowest:!0,shouldUseRealTimePriceContext:!0,size:c.w.M,price:t.price,wrapperDirection:"column",discountDirection:"column"}))),i.createElement(T,null,i.createElement(C,null,i.createElement(O,null)))))},x=(0,n.I4)(h.A,f.l9,{zIndex:s.Py.InfoToolTip,display:"inline-block",flex:{grow:1,shrink:1,basis:"auto"},minWidth:141,wordBreak:"normal",overflowWrap:"normal",whiteSpace:"normal"}),y=(0,n.I4)(m.A,{maxWidth:4*s.wm,margin:{bottom:s.nU}}),E=n.I4.div({color:e=>e.siteTheme.productCard.secondaryTextColor,fontSize:s.Ni,margin:{bottom:s.nU}}),k=n.I4.div({display:"flex",justifyContent:"space-between",alignItems:"stretch",gap:s.EX}),w=n.I4.div({flex:{grow:1,shrink:1,basis:0}}),T=n.I4.div({display:"flex",alignItems:"center",paddingBottom:s.Ni}),C=n.I4.div({display:"flex",justifyContent:"center",alignItems:"center",width:s.as,height:s.as,overflow:"hidden"}),O=(0,n.I4)(u.Qp,{height:s.ut+s.EX,width:s.ut+s.EX,flexShrink:0,position:"relative"});const D=function({index:e,listName:t,positionX:o,positionY:n,tooltipDirection:r,expanded:a,article:c,trackImpression:d,setActiveHotspotIds:p}){const[m,u]=(0,i.useState)(!1),h={Top:"top",Bottom:"bottom",Left:"left",Right:"right"}[r]||"top",[f,b]=(0,i.useState)(!1),g=(0,i.useRef)(null),v=`hotspot-content-${c.itemNumber}`,x=a||f;(0,i.useEffect)(()=>()=>{g.current&&(clearTimeout(g.current),g.current=null)},[]);const y=()=>{p([c.itemNumber]),null==d||d(),u(!0),b(!1)};return i.createElement(S,{css:{left:`${o}%`,top:`${n}%`,zIndex:a||f?s.Py.InfoToolTip:"auto"},onMouseLeave:()=>{a||(g.current&&(clearTimeout(g.current),g.current=null),b(!1),u(!1))}},i.createElement(A,{onMouseEnter:()=>{a||(null==d||d(),g.current=setTimeout(()=>{u(!0),b(!0),p(null)},200))}},i.createElement(l.A,{minWidth:160,placement:h,appearance:"narrow",isOpen:x,controlled:!0,onClose:()=>{!a&&f?y():(p(null),u(!1))},onOpen:y,preventCloseOnClickOutside:a,content:i.createElement(I,{listName:t,hotspotArticle:c,index:e,id:v}),role:"dialog",target:i.createElement(B,{"aria-label":c.name,"aria-expanded":x,"aria-controls":v,onFocus:()=>u(!0),onBlur:()=>u(!1)},i.createElement(N,{css:!!m&&{opacity:.4,border:{xy:{color:e=>e.siteTheme.hotspotBlock.item.bigDot.focusBorderColor}}}}),i.createElement(R,{css:!!m&&{height:8,width:8}}))})))};const S=n.I4.div({display:"flex",justifyContent:"center",alignItems:"center",position:"absolute",transform:"translate(-50%, -50%)",width:55,height:55}),A=n.I4.div({position:"relative",display:"flex",justifyContent:"center",alignItems:"center"}),B=(0,n.I4)(r.pH,{width:30,height:30,borderRadius:"50%",transformOrigin:"center center",position:"relative",":focus-visible":{border:{radius:"50%",xy:{color:e=>e.siteTheme.hotspotBlock.item.dotBody.focusBorderColor,width:3,style:"solid"}},outline:{offset:0,color:e=>e.siteTheme.hotspotBlock.item.dotBody.focusOutlineColor,width:1}}}),N=n.I4.div({width:"100%",height:"100%",borderRadius:"50%",backgroundColor:e=>e.siteTheme.hotspotBlock.item.bigDot.bgColor,opacity:.45,border:{xy:{color:e=>e.siteTheme.hotspotBlock.item.bigDot.borderColor,width:1,style:"solid"}}}),R=n.I4.div(Object.assign({backgroundColor:e=>e.siteTheme.hotspotBlock.item.smallDot.bgColor,position:"absolute",borderRadius:"50%",height:14,width:14,top:"50%",left:"50%",transform:"translate(-50%, -50%)",opacity:1,zIndex:1,transformOrigin:"center center"},(0,s.kY)({property:"all",duration:200})))}}]);
2//# sourceMappingURL=26.chunk.c293f4090d28969e55d0.js.map