@postnord/pn-marketweb-components 3.3.1 → 3.3.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1 +1 @@
1
- {"file":"pn-media-block.entry.js","mappings":";;AAAA,MAAM,eAAe,GAAG,knRAAknR,CAAC;AAC3oR,2BAAe,eAAe;;MCSjB,YAAY;;;2BACO,IAAI;wBACN,IAAI;yCACa,SAAS;4BACtB,EAAE;wBACN,IAAI;8BACE,KAAK;gCACH,KAAK;uCACE,IAAI;wCACH,KAAK;+BACd,KAAK;+BACL,KAAK;4BACR,IAAI;iCACC,CAAC;6BACL,IAAI;6CAE8B;YACjE,IAAI,EAAE,QAAQ;YACd,SAAS,EAAE,CAAC;YACZ,UAAU,EAAE,qBAAqB;SAClC;;6BAGiC,IAAI;;;IAItC,IAAI,wBAAwB;QAC1B,IAAI,IAAI,CAAC,YAAY,IAAI,IAAI,CAAC,YAAY,KAAK,IAAI,EAAE;YACnD,OAAO,CAAC,IAAI,CAAC,wDAAwD,CAAC,CAAC;YACvE,OAAO,SAAS,CAAC;SAClB;QACD,OAAO,IAAI,CAAC,iBAAiB,CAAC;KAC/B;IAED,IAAI,QAAQ;QACV,IAAI,IAAI,CAAC,QAAQ,KAAK,IAAI,IAAI,IAAI,CAAC,QAAQ,KAAK,WAAW,EAAE;YAC3D,OAAO,IAAI,CAAC;SACb;QACD,OAAO,KAAK,CAAC;KACd;IAED,IAAI,QAAQ;QACV,IAAI,IAAI,CAAC,QAAQ,KAAK,IAAI,IAAI,IAAI,CAAC,QAAQ,KAAK,WAAW,EAAE;YAC3D,OAAO,IAAI,CAAC;SACb;QACD,OAAO,KAAK,CAAC;KACd;IAEO,cAAc,CAAuB;IACrC,YAAY,CAAuB;IAE3C,iBAAiB;QACf,IAAI,CAAC,aAAa,GAAG,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,aAAa,CAAC,qBAAqB,CAAC,CAAC;KACxE;IAED,MAAM,gBAAgB;QACpB,MAAM,aAAa,GAAG,QAAQ,CAAC,cAAc,CAAC,gBAAgB,CAAC,CAAC;QAChE,IAAI,CAAC,qBAAqB,GAAG,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC;QAErD,MAAM,cAAc,GAAG,IAAI,CAAC,KAAK,CAAC,aAAa,CAAC,oBAAoB,CAAgB,CAAC;QACrF,IAAI,IAAI,CAAC,uBAAuB,IAAI,IAAI,IAAI,IAAI,CAAC,uBAAuB,IAAI,WAAW,EAAE;YACvF,cAAc,CAAC,KAAK,CAAC,UAAU,GAAG,GAAG,IAAI,CAAC,uBAAuB,EAAE,CAAC;SACrE;QAED,IAAI,IAAI,CAAC,cAAc,EAAE;YACvB,IAAI,CAAC,cAAc,GAAG,IAAI,oBAAoB,CAC5C,OAAO;gBACL,OAAO,CAAC,OAAO,CAAC,KAAK;oBACnB,IAAI,KAAK,CAAC,cAAc,EAAE;wBACxB,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC;qBACtD;yBAAM;wBACL,MAAM,CAAC,mBAAmB,CAAC,QAAQ,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC;qBACzD;iBACF,CAAC,CAAC;aACJ,EACD,EAAE,UAAU,EAAE,SAAS,EAAE,CAC1B,CAAC;YAEF,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC;SAC5C;QAED,IAAI,IAAI,CAAC,eAAe,EAAE;YACxB,IAAI,CAAC,YAAY,GAAG,IAAI,oBAAoB,CAC1C,OAAO;gBACL,OAAO,CAAC,OAAO,CAAC,KAAK;oBACnB,IAAI,KAAK,CAAC,cAAc,EAAE;;wBAExB,IAAI,IAAI,CAAC,KAAK,YAAY,WAAW,EAAE;4BACrC,UAAU,CAAC;gCACT,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,KAAK,EAAE,OAAO,EAAE,CAAC,CAAC;6BACnE,EAAE,IAAI,CAAC,CAAC;yBACV;6BAAM;4BACL,OAAO,CAAC,KAAK,CAAC,uCAAuC,CAAC,CAAC;yBACxD;qBACF;iBACF,CAAC,CAAC;aACJ,EACD;gBACE,IAAI,EAAE,QAAQ;gBACd,UAAU,EAAE,qBAAqB;gBACjC,SAAS,EAAE,CAAC;aACb,CACF,CAAC;YAEF,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC;SAC1C;KACF;IAED,oBAAoB;;QAElB,IAAI,IAAI,CAAC,cAAc,EAAE;YACvB,IAAI,CAAC,cAAc,CAAC,UAAU,EAAE,CAAC;SAClC;QACD,IAAI,IAAI,CAAC,YAAY,EAAE;YACrB,IAAI,CAAC,YAAY,CAAC,UAAU,EAAE,CAAC;SAChC;QACD,MAAM,CAAC,mBAAmB,CAAC,QAAQ,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC;KACzD;IAED,YAAY,GAAG;QACb,MAAM,iBAAiB,GAAG,IAAI,CAAC,KAAK,CAAC,iBAAgC,CAAC;QACtE,MAAM,aAAa,GAAG,IAAI,CAAC,KAAK,CAAC,aAAa,CAAC,iBAAiB,CAAgB,CAAC;QACjF,MAAM,gBAAgB,GAAG,IAAI,CAAC,KAAK,CAAC,aAAa,CAAC,+BAA+B,CAAsB,CAAC;QAExG,MAAM,gBAAgB,GAAG,aAAa,CAAC,qBAAqB,EAAE,CAAC,GAAG,CAAC;QACnE,MAAM,uBAAuB,GAAG,iBAAiB,CAAC,YAAY,CAAC;QAE/D,MAAM,cAAc,GAAG,uBAAuB,GAAG,gBAAgB,CAAC;QAElE,MAAM,oBAAoB,GAAG,GAAG,CAAC;QACjC,MAAM,kBAAkB,GAAG,GAAG,CAAC;QAE/B,MAAM,cAAc,GAAG,IAAI,CAAC,KAAK,CAAC,aAAa,CAAC,+BAA+B,CAAgB,CAAC;QAChG,MAAM,OAAO,GAAG,IAAI,CAAC,KAAK,CAAC,aAAa,CAAC,iCAAiC,CAAgB,CAAC;QAE3F,IAAI,cAAc,IAAI,IAAI,EAAE;;YAE1B,cAAc,CAAC,KAAK,CAAC,SAAS,GAAG,gBAAgB,cAAc,IAAI,GAAG,GAAG,kBAAkB,CAAC,KAAK,CAAC;YAElG,IAAI,gBAAgB,IAAI,IAAI,EAAE;;gBAE5B,gBAAgB,CAAC,KAAK,CAAC,SAAS,GAAG,gBAAgB,CAAC,cAAc,IAAI,GAAG,GAAG,kBAAkB,CAAC,KAAK,CAAC;aACtG;SACF;QAED,IAAI,OAAO,EAAE;;YAEX,OAAO,CAAC,KAAK,CAAC,SAAS,GAAG,gBAAgB,cAAc,IAAI,GAAG,GAAG,oBAAoB,CAAC,KAAK,CAAC;;YAG7F,MAAM,OAAO,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,GAAG,cAAc,GAAG,GAAG,CAAC,CAAC;YACtD,OAAO,CAAC,KAAK,CAAC,OAAO,GAAG,GAAG,OAAO,EAAE,CAAC;SACtC;KACF,CAAC;IAEF,MAAM;QACJ,MAAM,EAAE,gBAAgB,EAAE,eAAe,EAAE,WAAW,EAAE,eAAe,EAAE,wBAAwB,EAAE,aAAa,EAAE,QAAQ,EAAE,QAAQ,EAAE,wBAAwB,EAAE,GAAG,IAAI,CAAC;QACxK,MAAM,UAAU,GAAG,IAAI,wBAAwB,IAAI,CAAC,EAAE,CAAC;QACvD,MAAM,OAAO,GAAG,QAAQ,CAAC;QACzB,MAAM,OAAO,GAAG,QAAQ,CAAC;QAEzB,MAAM,OAAO,GAAG;YACd,aAAa;YACb,WAAW,GAAG,uBAAuB,WAAW,EAAE,GAAG,EAAE;YACvD,gBAAgB,GAAG,2BAA2B,GAAG,EAAE;YACnD,wBAAwB,GAAG,yCAAyC,GAAG,EAAE;YACzE,OAAO,GAAG,oBAAoB,GAAG,EAAE;YACnC,eAAe,GAAG,aAAa,GAAG,gBAAgB;YAClD,eAAe,GAAG,+BAA+B,GAAG,EAAE;SACvD,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;QAEZ,MAAM,6BAA6B,GAA6B;YAC9D,IAAI,EAAE,IAAI,CAAC,WAAW,KAAK,QAAQ,GAAG,IAAI,CAAC,KAAK,GAAG,IAAI;YACvD,SAAS,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,CAAC,CAAC;SACvB,CAAC;QAEF,QACE,4DAAK,KAAK,EAAE,OAAO,IACjB,4DAAK,KAAK,EAAC,8BAA8B,IACvC,4DAAK,KAAK,EAAC,8BAA8B,IACtC,OAAO,IACN,yCAAiC,IAAI,CAAC,gBAAgB,EAAE,eAAe,EAAE,6BAA6B,eAAa,IAAI,CAAC,QAAQ,GAAsB,IACpJ,OAAO,IACT,mBACE,cAAQ,KAAK,EAAC,qBAAqB,EAAC,MAAM,EAAE,IAAI,CAAC,QAAQ,GAAI,EAC7D,cAAQ,KAAK,EAAC,qBAAqB,EAAC,MAAM,EAAE,IAAI,CAAC,QAAQ,GAAI,EAC7D,cAAQ,KAAK,EAAC,qBAAqB,EAAC,MAAM,EAAE,IAAI,CAAC,QAAQ,GAAI,EAC7D,cACE,KAAK,EAAC,qBAAqB,EAC3B,MAAM,EAAE,IAAI,CAAC,yBAAyB,IAAI,IAAI,CAAC,yBAAyB,KAAK,WAAW,GAAG,IAAI,CAAC,yBAAyB,GAAG,IAAI,CAAC,QAAQ,GACzI,EACF,cACE,KAAK,EAAC,oBAAoB,EAC1B,MAAM,EAAE,IAAI,CAAC,yBAAyB,IAAI,IAAI,CAAC,yBAAyB,KAAK,WAAW,GAAG,IAAI,CAAC,yBAAyB,GAAG,IAAI,CAAC,QAAQ,GACzI,EACF,cACE,KAAK,EAAC,oBAAoB,EAC1B,MAAM,EAAE,IAAI,CAAC,yBAAyB,IAAI,IAAI,CAAC,yBAAyB,KAAK,WAAW,GAAG,IAAI,CAAC,yBAAyB,GAAG,IAAI,CAAC,QAAQ,GACzI,EACF,WACE,GAAG,EAAE,IAAI,CAAC,yBAAyB,KAAK,WAAW,GAAG,IAAI,CAAC,yBAAyB,GAAG,IAAI,CAAC,QAAQ,EACpG,GAAG,EAAE,IAAI,CAAC,YAAY,KAAK,WAAW,GAAG,IAAI,CAAC,YAAY,GAAG,EAAE,EAC/D,IAAI,EAAE,IAAI,CAAC,YAAY,KAAK,WAAW,GAAG,KAAK,GAAG,cAAc,iBACnD,IAAI,CAAC,YAAY,KAAK,WAAW,GAAG,OAAO,GAAG,MAAM,GACjE,CACM,IACR,IAAI,CACJ,EAEL,CAAC,OAAO,IAAI,4DAAK,KAAK,EAAC,6BAA6B,EAAC,EAAE,EAAC,mBAAmB,GAAO,EAElF,CAAC,IAAI,CAAC,YAAY,IAAI,IAAI,CAAC,aAAa,MACvC,4DAAK,KAAK,EAAC,gCAAgC,IACxC,IAAI,CAAC,YAAY,IAAI,EAAC,UAAU,qDAAC,KAAK,EAAC,4BAA4B,IAAE,IAAI,CAAC,YAAY,CAAc,EACpG,IAAI,CAAC,aAAa,IAAI,0DAAG,KAAK,EAAC,uBAAuB,IAAE,IAAI,CAAC,aAAa,CAAK,EAC/E,aAAa,KACZ,4DAAK,KAAK,EAAC,uBAAuB,IAChC,6DAAM,IAAI,EAAC,YAAY,GAAG,CACtB,CACP,CACG,CACP,CACG,EAEN,4DAAK,EAAE,EAAC,gBAAgB,GAAO,CAC3B,EACN;KACH;;;;;;","names":[],"sources":["src/components/media/pn-media-block/pn-media-block.scss?tag=pn-media-block","src/components/media/pn-media-block/pn-media-block.tsx"],"sourcesContent":["@import '../../../globals/main.scss';\n\n$animationDuration: 20s;\n\npn-media-block {\n .media-block {\n .media-block__block-container {\n display: grid;\n overflow: hidden;\n }\n .media-block__media-container,\n .media-block__content-container,\n .media-block__overlay-filter {\n grid-area: 1 / 1;\n width: 100%;\n position: relative;\n }\n\n .media-block__media-container {\n height: 100vh;\n overflow: hidden;\n position: relative;\n\n img,\n video {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n object-fit: cover;\n pointer-events: none;\n max-width: 100%;\n max-height: none;\n height: 100%;\n width: 100%;\n pointer-events: none;\n }\n\n pn-play-on-scroll {\n width: 100%;\n height: 100%;\n }\n\n .scroll-wrapper {\n width: 100%;\n height: 100%;\n }\n\n [slot='scroll-affected'] {\n width: 100%;\n height: 100%;\n display: flex;\n }\n\n .scroll-wrapper,\n .scroll-affected {\n width: 100%;\n height: 100%;\n display: flex;\n }\n video {\n width: 100%;\n height: 100%;\n }\n }\n\n .media-block__overlay-filter {\n z-index: 2;\n }\n\n .media-block__content-container {\n z-index: 3;\n display: flex;\n align-items: center;\n justify-content: center;\n transition: opacity 1s;\n flex-direction: column;\n margin: 0 auto;\n padding: 3.4rem 0;\n\n @include inner-container;\n\n @media screen and (min-width: 992px) {\n padding: 6.4rem 0;\n }\n\n @media screen and (min-width: 1200px) {\n padding: 7.2rem 0;\n }\n\n @media screen and (min-width: 1640px) {\n padding: 8rem 0;\n }\n\n .media-block__block-heading {\n max-width: 100rem;\n text-wrap: balance;\n color: white;\n font-size: 3.2rem;\n text-align: center;\n font-weight: 700;\n line-height: 1.1;\n margin-bottom: 3rem;\n\n @media screen and (min-width: 576px) {\n font-size: 4rem;\n }\n\n @media screen and (min-width: 768px) {\n font-size: 4.8rem;\n }\n\n @media screen and (min-width: 992px) {\n font-size: 5.6rem;\n }\n\n @media screen and (min-width: 1200px) {\n font-size: 8rem;\n }\n\n @media screen and (min-width: 1640px) {\n font-size: 8.8rem;\n }\n }\n\n .media-block__preamble {\n max-width: 80rem;\n max-width: 80ch;\n text-wrap: balance;\n display: flex;\n color: white;\n font-size: 1.8rem;\n text-align: center;\n font-weight: 300;\n\n @media screen and (min-width: 576px) {\n font-size: 2rem;\n }\n\n @media screen and (min-width: 1200px) {\n font-size: 2.4rem;\n }\n\n @media screen and (min-width: 1640px) {\n font-weight: 500;\n }\n }\n\n .media-block__cta-link {\n margin-top: 3rem;\n }\n }\n }\n\n .media-block--height-100svh {\n min-height: 100vh;\n\n @supports (height: 100svh) {\n height: 100svh;\n }\n\n .media-block__block-container {\n height: 100vh;\n\n @supports (max-height: 100svh) {\n max-height: 100svh;\n }\n\n .media-block__media-container,\n .media-block__content-container,\n .media-block__overlay-filter {\n height: 100vh;\n\n @supports (max-height: 100svh) {\n max-height: 100svh;\n }\n }\n\n .media-block__media-container picture {\n height: 100vh;\n\n @supports (max-height: 100svh) {\n max-height: 100svh;\n }\n }\n }\n }\n\n .media-block--height-65svh {\n min-height: 65svh;\n overflow: auto;\n\n .media-block__block-container {\n height: 65vh;\n\n @supports (max-height: 100svh) {\n max-height: 65svh;\n }\n\n .media-block__media-container,\n .media-block__content-container,\n .media-block__overlay-filter {\n height: 65vh;\n\n @supports (max-height: 100svh) {\n max-height: 65svh;\n }\n }\n }\n\n .media-block__media-container img {\n max-height: none !important;\n height: auto !important;\n }\n }\n\n .media-block--height-dynamic {\n height: auto;\n overflow: auto;\n\n .media-block__block-container {\n height: auto;\n max-height: none;\n\n .media-block__media-container,\n .media-block__content-container,\n .media-block__overlay-filter {\n height: auto;\n max-height: none;\n }\n }\n }\n\n .media-block--with-overlay {\n .media-block__block-container .media-block__overlay-filter {\n z-index: 2;\n background: radial-gradient(circle, rgba(13, 35, 75, 0.68) 7%, rgba(13, 35, 75, 0) 80%);\n }\n }\n\n .media-block--fixed-background {\n .media-block__block-container {\n .media-block__media-container,\n .media-block__overlay-filter {\n position: relative;\n overflow: hidden;\n top: 0;\n width: 100%;\n display: flex !important;\n clip-path: inset(0);\n }\n\n .media-block__media-container {\n picture {\n position: absolute;\n top: 0;\n width: 100%;\n display: flex !important;\n clip-path: inset(0);\n height: 100%;\n\n img {\n position: fixed;\n width: 100%;\n height: 100%;\n object-fit: cover;\n z-index: 1;\n }\n }\n }\n }\n }\n\n .media-block--video {\n .media-block__content-container {\n max-width: 80%;\n }\n }\n\n .media-block--animate-overlay-background {\n .media-block__overlay-filter {\n background-size: 200% 200% !important;\n animation: overlayBackgroundAnimation $animationDuration ease infinite;\n }\n }\n\n @keyframes overlayBackgroundAnimation {\n 0% {\n background-position: 100% 100%;\n }\n 50% {\n background-position: 50% 60%;\n }\n 100% {\n background-position: 100% 100%;\n }\n }\n\n .media-block--margin-bottom {\n margin-bottom: 3.2rem;\n\n @media screen and (min-width:768px) {\n margin-bottom: 4rem;\n }\n\n @media screen and (min-width:992px) {\n margin-bottom: 5.6rem;\n }\n\n @media screen and (min-width:1200px) {\n margin-bottom: 7.2rem;\n }\n }\n}\n","import { Component, Element, Prop, h, State } from '@stencil/core';\n\nfunction userPrefersReducedMotion(): boolean {\n return window.matchMedia('(prefers-reduced-motion: reduce)').matches;\n}\n\n@Component({\n tag: 'pn-media-block',\n styleUrl: 'pn-media-block.scss',\n})\nexport class PnmediaBlock {\n @Prop() blockHeight: string = null;\n @Prop() imageSrc?: string = null;\n @Prop() imageSrcSmallScreenFormat?: string = undefined;\n @Prop() imageAltText?: string = '';\n @Prop() videoSrc?: string = null;\n @Prop() parallaxScroll: boolean = false;\n @Prop() showOverlayLayer: boolean = false;\n @Prop() customOverlayBackground?: string = null;\n @Prop() animateOverlayBackground: boolean = false;\n @Prop() scrollSnapBlock: boolean = false;\n @Prop() fixedBackground: boolean = false;\n @Prop() blockHeading?: string = null;\n @Prop() blockHeadingLevel?: number = 2;\n @Prop() blockPreamble?: string = null;\n\n @State() pnPlayOnScrollObserverOptions: IntersectionObserverInit = {\n root: document,\n threshold: 1,\n rootMargin: '220px 0px 220px 0px',\n };\n\n @State() calculatedBlockHeight: number;\n @State() hasButtonSlot: boolean = true;\n\n @Element() block: HTMLElement;\n\n get blockHeadingLevelChecked() {\n if (this.blockHeading && this.blockHeading !== null) {\n console.warn('blockHeadingLevel is required when blockHeading is set');\n return undefined;\n }\n return this.blockHeadingLevel;\n }\n\n get hasVideo() {\n if (this.videoSrc !== null && this.videoSrc !== 'undefined') {\n return true;\n }\n return false;\n }\n\n get hasImage() {\n if (this.imageSrc !== null && this.imageSrc !== 'undefined') {\n return true;\n }\n return false;\n }\n\n private observerScroll: IntersectionObserver;\n private observerSnap: IntersectionObserver;\n\n componentWillLoad() {\n this.hasButtonSlot = !!this.block.querySelector('[slot=\"cta-button\"]');\n }\n\n async componentDidLoad() {\n const scrollTrigger = document.getElementById('scroll-trigger');\n this.calculatedBlockHeight = this.block.offsetHeight;\n\n const overlayElement = this.block.querySelector('#mediaBlockOverlay') as HTMLElement;\n if (this.customOverlayBackground != null || this.customOverlayBackground != 'undefined') {\n overlayElement.style.background = `${this.customOverlayBackground}`;\n }\n\n if (this.parallaxScroll) {\n this.observerScroll = new IntersectionObserver(\n entries => {\n entries.forEach(entry => {\n if (entry.isIntersecting) {\n window.addEventListener('scroll', this.handleScroll);\n } else {\n window.removeEventListener('scroll', this.handleScroll);\n }\n });\n },\n { rootMargin: `0px 0px` },\n );\n\n this.observerScroll.observe(scrollTrigger);\n }\n\n if (this.scrollSnapBlock) {\n this.observerSnap = new IntersectionObserver(\n entries => {\n entries.forEach(entry => {\n if (entry.isIntersecting) {\n // The block is within 100px of the viewport, scroll it into view\n if (this.block instanceof HTMLElement) {\n setTimeout(() => {\n this.block.scrollIntoView({ behavior: 'smooth', block: 'start' });\n }, 1000); // Adjust the delay as needed\n } else {\n console.error('this.block is not a valid HTMLElement');\n }\n }\n });\n },\n {\n root: document,\n rootMargin: '100px 0px 100px 0px',\n threshold: 0,\n },\n );\n\n this.observerSnap.observe(scrollTrigger);\n }\n }\n\n disconnectedCallback() {\n // Clean up the observer and event listener when the component is removed\n if (this.observerScroll) {\n this.observerScroll.disconnect();\n }\n if (this.observerSnap) {\n this.observerSnap.disconnect();\n }\n window.removeEventListener('scroll', this.handleScroll);\n }\n\n handleScroll = () => {\n const mediaBlockElement = this.block.firstElementChild as HTMLElement;\n const scrollTrigger = this.block.querySelector('#scroll-trigger') as HTMLElement;\n const videoPauseButton = this.block.querySelector('#overlayed-button-pause-video') as HTMLButtonElement;\n\n const scrollTriggerTop = scrollTrigger.getBoundingClientRect().top;\n const mediaBlockElementHeight = mediaBlockElement.offsetHeight;\n\n const scrollPosition = mediaBlockElementHeight - scrollTriggerTop;\n\n const parallaxSpeedContent = 0.3;\n const parallaxSpeedMedia = 0.2;\n\n const mediaContainer = this.block.querySelector('.media-block__media-container') as HTMLElement;\n const content = this.block.querySelector('.media-block__content-container') as HTMLElement;\n\n if (mediaContainer != null) {\n // Move the image or video at a slower speed\n mediaContainer.style.transform = `translate(0, ${scrollPosition * (0.1 + parallaxSpeedMedia)}px)`;\n\n if (videoPauseButton != null) {\n // Move the pause button up\n videoPauseButton.style.transform = `translate(0, ${-scrollPosition * (0.3 + parallaxSpeedMedia)}px)`;\n }\n }\n\n if (content) {\n // Move the content at a faster speed\n content.style.transform = `translate(0, ${scrollPosition * (0.5 + parallaxSpeedContent)}px)`;\n\n // Change the opacity based on the scroll position\n const opacity = Math.max(0, 1 - scrollPosition / 600);\n content.style.opacity = `${opacity}`;\n }\n };\n\n render() {\n const { showOverlayLayer, fixedBackground, blockHeight, scrollSnapBlock, blockHeadingLevelChecked, hasButtonSlot, hasVideo, hasImage, animateOverlayBackground } = this;\n const HeadingTag = `h${blockHeadingLevelChecked ?? 2}`;\n const isVideo = hasVideo;\n const isImage = hasImage;\n\n const classes = [\n 'media-block',\n blockHeight ? `media-block--height-${blockHeight}` : '',\n showOverlayLayer ? 'media-block--with-overlay' : '',\n animateOverlayBackground ? `media-block--animate-overlay-background` : '',\n isVideo ? 'media-block--video' : '',\n scrollSnapBlock ? 'scroll-snap' : 'no-scroll-snap',\n fixedBackground ? 'media-block--fixed-background' : '',\n ].join(' ');\n\n const pnPlayOnScrollObserverOptions: IntersectionObserverInit = {\n root: this.blockHeight === \"100svh\" ? this.block : null,\n threshold: [0, 0.5, 1], // Callback will be executed when 0%, 50%, and 100% of the target is visible\n };\n\n return (\n <div class={classes}>\n <div class=\"media-block__block-container\">\n <div class=\"media-block__media-container\">\n {isVideo ? (\n <pn-play-on-scroll show-overlay={this.showOverlayLayer} observerOptions={pnPlayOnScrollObserverOptions} video-src={this.videoSrc}></pn-play-on-scroll>\n ) : isImage ? (\n <picture>\n <source media=\"(min-width: 1400px)\" srcSet={this.imageSrc} />\n <source media=\"(min-width: 1224px)\" srcSet={this.imageSrc} />\n <source media=\"(min-width: 1140px)\" srcSet={this.imageSrc} />\n <source\n media=\"(min-width: 1023px)\"\n srcSet={this.imageSrcSmallScreenFormat && this.imageSrcSmallScreenFormat !== 'undefined' ? this.imageSrcSmallScreenFormat : this.imageSrc}\n />\n <source\n media=\"(min-width: 768px)\"\n srcSet={this.imageSrcSmallScreenFormat && this.imageSrcSmallScreenFormat !== 'undefined' ? this.imageSrcSmallScreenFormat : this.imageSrc}\n />\n <source\n media=\"(min-width: 500px)\"\n srcSet={this.imageSrcSmallScreenFormat && this.imageSrcSmallScreenFormat !== 'undefined' ? this.imageSrcSmallScreenFormat : this.imageSrc}\n />\n <img\n src={this.imageSrcSmallScreenFormat !== 'undefined' ? this.imageSrcSmallScreenFormat : this.imageSrc}\n alt={this.imageAltText !== 'undefined' ? this.imageAltText : ''}\n role={this.imageAltText !== 'undefined' ? 'img' : 'presentation'}\n aria-hidden={this.imageAltText !== 'undefined' ? 'false' : 'true'}\n />\n </picture>\n ) : null}\n </div>\n\n {!isVideo && <div class=\"media-block__overlay-filter\" id=\"mediaBlockOverlay\"></div>}\n\n {(this.blockHeading || this.blockPreamble) && (\n <div class=\"media-block__content-container\">\n {this.blockHeading && <HeadingTag class=\"media-block__block-heading\">{this.blockHeading}</HeadingTag>}\n {this.blockPreamble && <p class=\"media-block__preamble\">{this.blockPreamble}</p>}\n {hasButtonSlot && (\n <div class=\"media-block__cta-link\">\n <slot name=\"cta-button\" />\n </div>\n )}\n </div>\n )}\n </div>\n\n <div id=\"scroll-trigger\"></div>\n </div>\n );\n }\n}\n"],"version":3}
1
+ {"file":"pn-media-block.entry.js","mappings":"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","names":[],"sources":["src/components/media/pn-media-block/pn-media-block.scss?tag=pn-media-block","src/components/media/pn-media-block/pn-media-block.tsx"],"sourcesContent":["@import '../../../globals/main.scss';\n\n$animationDuration: 20s;\n\npn-media-block {\n .media-block {\n .media-block__block-container {\n display: grid;\n overflow: hidden;\n }\n .media-block__media-container,\n .media-block__content-container,\n .media-block__overlay-filter {\n grid-area: 1 / 1;\n width: 100%;\n position: relative;\n }\n\n .media-block__media-container {\n height: 100vh;\n overflow: hidden;\n position: relative;\n\n img,\n video {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n object-fit: cover;\n pointer-events: none;\n max-width: 100%;\n max-height: none;\n height: 100%;\n width: 100%;\n pointer-events: none;\n }\n\n pn-play-on-scroll {\n width: 100%;\n height: 100%;\n }\n\n .scroll-wrapper {\n width: 100%;\n height: 100%;\n }\n\n [slot='scroll-affected'] {\n width: 100%;\n height: 100%;\n display: flex;\n }\n\n .scroll-wrapper,\n .scroll-affected {\n width: 100%;\n height: 100%;\n display: flex;\n }\n video {\n width: 100%;\n height: 100%;\n }\n }\n\n .media-block__overlay-filter {\n z-index: 2;\n }\n\n .media-block__content-container {\n z-index: 3;\n display: flex;\n align-items: center;\n justify-content: center;\n transition: opacity 1s;\n flex-direction: column;\n margin: 0 auto;\n padding: 3.4rem 0;\n\n @include inner-container;\n\n @media screen and (min-width: 992px) {\n padding: 6.4rem 0;\n }\n\n @media screen and (min-width: 1200px) {\n padding: 7.2rem 0;\n }\n\n @media screen and (min-width: 1640px) {\n padding: 8rem 0;\n }\n\n .media-block__block-heading {\n max-width: 100rem;\n text-wrap: balance;\n color: white;\n font-size: 3.2rem;\n text-align: center;\n font-weight: 700;\n line-height: 1.1;\n margin-bottom: 3rem;\n\n @media screen and (min-width: 576px) {\n font-size: 4rem;\n }\n\n @media screen and (min-width: 768px) {\n font-size: 4.8rem;\n }\n\n @media screen and (min-width: 992px) {\n font-size: 5.6rem;\n }\n\n @media screen and (min-width: 1200px) {\n font-size: 8rem;\n }\n\n @media screen and (min-width: 1640px) {\n font-size: 8.8rem;\n }\n }\n\n .media-block__preamble {\n max-width: 80rem;\n max-width: 80ch;\n text-wrap: balance;\n display: flex;\n color: white;\n font-size: 1.8rem;\n text-align: center;\n font-weight: 300;\n\n @media screen and (min-width: 576px) {\n font-size: 2rem;\n }\n\n @media screen and (min-width: 1200px) {\n font-size: 2.4rem;\n }\n\n @media screen and (min-width: 1640px) {\n font-weight: 500;\n }\n }\n\n .media-block__cta-link {\n margin-top: 3rem;\n }\n }\n }\n\n .media-block--height-100svh {\n min-height: 100vh;\n\n @supports (height: 100svh) {\n height: 100svh;\n }\n\n .media-block__block-container {\n height: 100vh;\n\n @supports (max-height: 100svh) {\n max-height: 100svh;\n }\n\n .media-block__media-container,\n .media-block__content-container,\n .media-block__overlay-filter {\n height: 100vh;\n\n @supports (max-height: 100svh) {\n max-height: 100svh;\n }\n }\n\n .media-block__media-container picture {\n height: 100vh;\n\n @supports (max-height: 100svh) {\n max-height: 100svh;\n }\n }\n }\n }\n\n .media-block--height-65svh {\n min-height: 65svh;\n overflow: auto;\n\n .media-block__block-container {\n height: 65vh;\n\n @supports (max-height: 100svh) {\n max-height: 65svh;\n }\n\n .media-block__media-container,\n .media-block__content-container,\n .media-block__overlay-filter {\n height: 65vh;\n\n @supports (max-height: 100svh) {\n max-height: 65svh;\n }\n }\n }\n\n .media-block__media-container picture {\n max-height: none !important;\n height: auto !important;\n }\n }\n\n .media-block--height-dynamic {\n height: auto;\n overflow: auto;\n\n .media-block__block-container {\n height: auto;\n max-height: none;\n\n .media-block__media-container,\n .media-block__content-container,\n .media-block__overlay-filter {\n height: auto;\n max-height: none;\n }\n }\n }\n\n .media-block--with-overlay {\n .media-block__block-container .media-block__overlay-filter {\n z-index: 2;\n background: radial-gradient(circle, rgba(13, 35, 75, 0.68) 7%, rgba(13, 35, 75, 0) 80%);\n }\n }\n\n .media-block--fixed-background {\n .media-block__block-container {\n .media-block__media-container,\n .media-block__overlay-filter {\n position: relative;\n overflow: hidden;\n top: 0;\n width: 100%;\n display: flex !important;\n clip-path: inset(0);\n }\n\n .media-block__media-container {\n picture {\n position: absolute;\n top: 0;\n width: 100%;\n display: flex !important;\n height: 100%;\n\n img {\n position: fixed;\n width: 100%;\n height: 100%;\n object-fit: cover;\n z-index: 1;\n }\n }\n }\n }\n }\n\n .media-block--video {\n .media-block__content-container {\n max-width: 80%;\n }\n }\n\n .media-block--animate-overlay-background {\n .media-block__overlay-filter {\n background-size: 200% 200% !important;\n animation: overlayBackgroundAnimation $animationDuration ease infinite;\n }\n }\n\n @keyframes overlayBackgroundAnimation {\n 0% {\n background-position: 100% 100%;\n }\n 50% {\n background-position: 50% 60%;\n }\n 100% {\n background-position: 100% 100%;\n }\n }\n\n .media-block--margin-bottom {\n margin-bottom: 3.2rem;\n\n @media screen and (min-width:768px) {\n margin-bottom: 4rem;\n }\n\n @media screen and (min-width:992px) {\n margin-bottom: 5.6rem;\n }\n\n @media screen and (min-width:1200px) {\n margin-bottom: 7.2rem;\n }\n }\n}\n","import { Component, Element, Prop, h, State } from '@stencil/core';\n\nfunction userPrefersReducedMotion(): boolean {\n return window.matchMedia('(prefers-reduced-motion: reduce)').matches;\n}\n\n@Component({\n tag: 'pn-media-block',\n styleUrl: 'pn-media-block.scss',\n})\nexport class PnmediaBlock {\n @Prop() blockHeight: string = null;\n @Prop() imageSrc?: string = null;\n @Prop() imageSrcSmallScreenFormat?: string = undefined;\n @Prop() imageAltText?: string = '';\n @Prop() videoSrc?: string = null;\n @Prop() parallaxScroll: boolean = false;\n @Prop() showOverlayLayer: boolean = false;\n @Prop() customOverlayBackground?: string = null;\n @Prop() animateOverlayBackground: boolean = false;\n @Prop() scrollSnapBlock: boolean = false;\n @Prop() fixedBackground: boolean = false;\n @Prop() blockHeading?: string = null;\n @Prop() blockHeadingLevel?: number = 2;\n @Prop() blockPreamble?: string = null;\n\n @State() pnPlayOnScrollObserverOptions: IntersectionObserverInit = {\n root: document,\n threshold: 1,\n rootMargin: '220px 0px 220px 0px',\n };\n\n @State() calculatedBlockHeight: number;\n @State() hasButtonSlot: boolean = true;\n\n @Element() block: HTMLElement;\n\n get blockHeadingLevelChecked() {\n if (this.blockHeading && this.blockHeading !== null) {\n console.warn('blockHeadingLevel is required when blockHeading is set');\n return undefined;\n }\n return this.blockHeadingLevel;\n }\n\n get hasVideo() {\n if (this.videoSrc !== null && this.videoSrc !== 'undefined') {\n return true;\n }\n return false;\n }\n\n get hasImage() {\n if (this.imageSrc !== null && this.imageSrc !== 'undefined') {\n return true;\n }\n return false;\n }\n\n private observerScroll: IntersectionObserver;\n private observerSnap: IntersectionObserver;\n\n componentWillLoad() {\n this.hasButtonSlot = !!this.block.querySelector('[slot=\"cta-button\"]');\n }\n\n async componentDidLoad() {\n const scrollTrigger = document.getElementById('scroll-trigger');\n this.calculatedBlockHeight = this.block.offsetHeight;\n\n const overlayElement = this.block.querySelector('#mediaBlockOverlay') as HTMLElement;\n if (this.customOverlayBackground != null || this.customOverlayBackground != 'undefined') {\n overlayElement.style.background = `${this.customOverlayBackground}`;\n }\n\n if (this.parallaxScroll) {\n this.observerScroll = new IntersectionObserver(\n entries => {\n entries.forEach(entry => {\n if (entry.isIntersecting) {\n window.addEventListener('scroll', this.handleScroll);\n } else {\n window.removeEventListener('scroll', this.handleScroll);\n }\n });\n },\n { rootMargin: `0px 0px` },\n );\n\n this.observerScroll.observe(scrollTrigger);\n }\n\n if (this.scrollSnapBlock) {\n this.observerSnap = new IntersectionObserver(\n entries => {\n entries.forEach(entry => {\n if (entry.isIntersecting) {\n // The block is within 100px of the viewport, scroll it into view\n if (this.block instanceof HTMLElement) {\n setTimeout(() => {\n this.block.scrollIntoView({ behavior: 'smooth', block: 'start' });\n }, 1000); // Adjust the delay as needed\n } else {\n console.error('this.block is not a valid HTMLElement');\n }\n }\n });\n },\n {\n root: document,\n rootMargin: '100px 0px 100px 0px',\n threshold: 0,\n },\n );\n\n this.observerSnap.observe(scrollTrigger);\n }\n }\n\n disconnectedCallback() {\n // Clean up the observer and event listener when the component is removed\n if (this.observerScroll) {\n this.observerScroll.disconnect();\n }\n if (this.observerSnap) {\n this.observerSnap.disconnect();\n }\n window.removeEventListener('scroll', this.handleScroll);\n }\n\n handleScroll = () => {\n const mediaBlockElement = this.block.firstElementChild as HTMLElement;\n const scrollTrigger = this.block.querySelector('#scroll-trigger') as HTMLElement;\n const videoPauseButton = this.block.querySelector('#overlayed-button-pause-video') as HTMLButtonElement;\n\n const scrollTriggerTop = scrollTrigger.getBoundingClientRect().top;\n const mediaBlockElementHeight = mediaBlockElement.offsetHeight;\n\n const scrollPosition = mediaBlockElementHeight - scrollTriggerTop;\n\n const parallaxSpeedContent = 0.3;\n const parallaxSpeedMedia = 0.2;\n\n const mediaContainer = this.block.querySelector('.media-block__media-container') as HTMLElement;\n const content = this.block.querySelector('.media-block__content-container') as HTMLElement;\n\n if (mediaContainer != null) {\n // Move the image or video at a slower speed\n mediaContainer.style.transform = `translate(0, ${scrollPosition * (0.1 + parallaxSpeedMedia)}px)`;\n\n if (videoPauseButton != null) {\n // Move the pause button up\n videoPauseButton.style.transform = `translate(0, ${-scrollPosition * (0.3 + parallaxSpeedMedia)}px)`;\n }\n }\n\n if (content) {\n // Move the content at a faster speed\n content.style.transform = `translate(0, ${scrollPosition * (0.5 + parallaxSpeedContent)}px)`;\n\n // Change the opacity based on the scroll position\n const opacity = Math.max(0, 1 - scrollPosition / 600);\n content.style.opacity = `${opacity}`;\n }\n };\n\n render() {\n const { showOverlayLayer, fixedBackground, blockHeight, scrollSnapBlock, blockHeadingLevelChecked, hasButtonSlot, hasVideo, hasImage, animateOverlayBackground } = this;\n const HeadingTag = `h${blockHeadingLevelChecked ?? 2}`;\n const isVideo = hasVideo;\n const isImage = hasImage;\n\n const classes = [\n 'media-block',\n blockHeight ? `media-block--height-${blockHeight}` : '',\n showOverlayLayer ? 'media-block--with-overlay' : '',\n animateOverlayBackground ? `media-block--animate-overlay-background` : '',\n isVideo ? 'media-block--video' : '',\n scrollSnapBlock ? 'scroll-snap' : 'no-scroll-snap',\n fixedBackground ? 'media-block--fixed-background' : '',\n ].join(' ');\n\n const pnPlayOnScrollObserverOptions: IntersectionObserverInit = {\n root: this.blockHeight === \"100svh\" ? this.block : null,\n threshold: [0, 0.5, 1], // Callback will be executed when 0%, 50%, and 100% of the target is visible\n };\n\n return (\n <div class={classes}>\n <div class=\"media-block__block-container\">\n <div class=\"media-block__media-container\">\n {isVideo ? (\n <pn-play-on-scroll show-overlay={this.showOverlayLayer} observerOptions={pnPlayOnScrollObserverOptions} video-src={this.videoSrc}></pn-play-on-scroll>\n ) : isImage ? (\n <picture>\n <source media=\"(min-width: 1400px)\" srcSet={this.imageSrc} />\n <source media=\"(min-width: 1224px)\" srcSet={this.imageSrc} />\n <source media=\"(min-width: 1140px)\" srcSet={this.imageSrc} />\n <source\n media=\"(min-width: 1023px)\"\n srcSet={this.imageSrcSmallScreenFormat && this.imageSrcSmallScreenFormat !== 'undefined' ? this.imageSrcSmallScreenFormat : this.imageSrc}\n />\n <source\n media=\"(min-width: 768px)\"\n srcSet={this.imageSrcSmallScreenFormat && this.imageSrcSmallScreenFormat !== 'undefined' ? this.imageSrcSmallScreenFormat : this.imageSrc}\n />\n <source\n media=\"(min-width: 500px)\"\n srcSet={this.imageSrcSmallScreenFormat && this.imageSrcSmallScreenFormat !== 'undefined' ? this.imageSrcSmallScreenFormat : this.imageSrc}\n />\n <img\n src={this.imageSrcSmallScreenFormat !== 'undefined' ? this.imageSrcSmallScreenFormat : this.imageSrc}\n alt={this.imageAltText !== 'undefined' ? this.imageAltText : ''}\n role={this.imageAltText !== 'undefined' ? 'img' : 'presentation'}\n aria-hidden={this.imageAltText !== 'undefined' ? 'false' : 'true'}\n />\n </picture>\n ) : null}\n </div>\n\n {!isVideo && <div class=\"media-block__overlay-filter\" id=\"mediaBlockOverlay\"></div>}\n\n {(this.blockHeading || this.blockPreamble) && (\n <div class=\"media-block__content-container\">\n {this.blockHeading && <HeadingTag class=\"media-block__block-heading\">{this.blockHeading}</HeadingTag>}\n {this.blockPreamble && <p class=\"media-block__preamble\">{this.blockPreamble}</p>}\n {hasButtonSlot && (\n <div class=\"media-block__cta-link\">\n <slot name=\"cta-button\" />\n </div>\n )}\n </div>\n )}\n </div>\n\n <div id=\"scroll-trigger\"></div>\n </div>\n );\n }\n}\n"],"version":3}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@postnord/pn-marketweb-components",
3
- "version": "3.3.1",
3
+ "version": "3.3.3",
4
4
  "description": "PostNord Market Websites Components",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -0,0 +1,2 @@
1
+ import{r as e,g as i,h as o}from"./p-06555615.js";const a="pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}pn-media-block .media-block .media-block__block-container{display:grid;overflow:hidden}pn-media-block .media-block .media-block__media-container,pn-media-block .media-block .media-block__content-container,pn-media-block .media-block .media-block__overlay-filter{grid-area:1/1;width:100%;position:relative}pn-media-block .media-block .media-block__media-container{height:100vh;overflow:hidden;position:relative}pn-media-block .media-block .media-block__media-container img,pn-media-block .media-block .media-block__media-container video{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);object-fit:cover;pointer-events:none;max-width:100%;max-height:none;height:100%;width:100%;pointer-events:none}pn-media-block .media-block .media-block__media-container pn-play-on-scroll{width:100%;height:100%}pn-media-block .media-block .media-block__media-container .scroll-wrapper{width:100%;height:100%}pn-media-block .media-block .media-block__media-container [slot=scroll-affected]{width:100%;height:100%;display:flex}pn-media-block .media-block .media-block__media-container .scroll-wrapper,pn-media-block .media-block .media-block__media-container .scroll-affected{width:100%;height:100%;display:flex}pn-media-block .media-block .media-block__media-container video{width:100%;height:100%}pn-media-block .media-block .media-block__overlay-filter{z-index:2}pn-media-block .media-block .media-block__content-container{z-index:3;display:flex;align-items:center;justify-content:center;transition:opacity 1s;flex-direction:column;margin:0 auto;padding:3.4rem 0;width:100%;padding-right:15px;padding-left:15px;margin-right:auto;margin-left:auto}@media (min-width: 576px){pn-media-block .media-block .media-block__content-container{max-width:540px}}@media (min-width: 768px){pn-media-block .media-block .media-block__content-container{max-width:720px}}@media (min-width: 992px){pn-media-block .media-block .media-block__content-container{max-width:960px}}@media (min-width: 1200px){pn-media-block .media-block .media-block__content-container{max-width:1140px}}@media (min-width: 1640px){pn-media-block .media-block .media-block__content-container{max-width:1440px}}@media screen and (min-width: 992px){pn-media-block .media-block .media-block__content-container{padding:6.4rem 0}}@media screen and (min-width: 1200px){pn-media-block .media-block .media-block__content-container{padding:7.2rem 0}}@media screen and (min-width: 1640px){pn-media-block .media-block .media-block__content-container{padding:8rem 0}}pn-media-block .media-block .media-block__content-container .media-block__block-heading{max-width:100rem;text-wrap:balance;color:white;font-size:3.2rem;text-align:center;font-weight:700;line-height:1.1;margin-bottom:3rem}@media screen and (min-width: 576px){pn-media-block .media-block .media-block__content-container .media-block__block-heading{font-size:4rem}}@media screen and (min-width: 768px){pn-media-block .media-block .media-block__content-container .media-block__block-heading{font-size:4.8rem}}@media screen and (min-width: 992px){pn-media-block .media-block .media-block__content-container .media-block__block-heading{font-size:5.6rem}}@media screen and (min-width: 1200px){pn-media-block .media-block .media-block__content-container .media-block__block-heading{font-size:8rem}}@media screen and (min-width: 1640px){pn-media-block .media-block .media-block__content-container .media-block__block-heading{font-size:8.8rem}}pn-media-block .media-block .media-block__content-container .media-block__preamble{max-width:80rem;max-width:80ch;text-wrap:balance;display:flex;color:white;font-size:1.8rem;text-align:center;font-weight:300}@media screen and (min-width: 576px){pn-media-block .media-block .media-block__content-container .media-block__preamble{font-size:2rem}}@media screen and (min-width: 1200px){pn-media-block .media-block .media-block__content-container .media-block__preamble{font-size:2.4rem}}@media screen and (min-width: 1640px){pn-media-block .media-block .media-block__content-container .media-block__preamble{font-weight:500}}pn-media-block .media-block .media-block__content-container .media-block__cta-link{margin-top:3rem}pn-media-block .media-block--height-100svh{min-height:100vh}@supports (height: 100svh){pn-media-block .media-block--height-100svh{height:100svh}}pn-media-block .media-block--height-100svh .media-block__block-container{height:100vh}@supports (max-height: 100svh){pn-media-block .media-block--height-100svh .media-block__block-container{max-height:100svh}}pn-media-block .media-block--height-100svh .media-block__block-container .media-block__media-container,pn-media-block .media-block--height-100svh .media-block__block-container .media-block__content-container,pn-media-block .media-block--height-100svh .media-block__block-container .media-block__overlay-filter{height:100vh}@supports (max-height: 100svh){pn-media-block .media-block--height-100svh .media-block__block-container .media-block__media-container,pn-media-block .media-block--height-100svh .media-block__block-container .media-block__content-container,pn-media-block .media-block--height-100svh .media-block__block-container .media-block__overlay-filter{max-height:100svh}}pn-media-block .media-block--height-100svh .media-block__block-container .media-block__media-container picture{height:100vh}@supports (max-height: 100svh){pn-media-block .media-block--height-100svh .media-block__block-container .media-block__media-container picture{max-height:100svh}}pn-media-block .media-block--height-65svh{min-height:65svh;overflow:auto}pn-media-block .media-block--height-65svh .media-block__block-container{height:65vh}@supports (max-height: 100svh){pn-media-block .media-block--height-65svh .media-block__block-container{max-height:65svh}}pn-media-block .media-block--height-65svh .media-block__block-container .media-block__media-container,pn-media-block .media-block--height-65svh .media-block__block-container .media-block__content-container,pn-media-block .media-block--height-65svh .media-block__block-container .media-block__overlay-filter{height:65vh}@supports (max-height: 100svh){pn-media-block .media-block--height-65svh .media-block__block-container .media-block__media-container,pn-media-block .media-block--height-65svh .media-block__block-container .media-block__content-container,pn-media-block .media-block--height-65svh .media-block__block-container .media-block__overlay-filter{max-height:65svh}}pn-media-block .media-block--height-65svh .media-block__media-container picture{max-height:none !important;height:auto !important}pn-media-block .media-block--height-dynamic{height:auto;overflow:auto}pn-media-block .media-block--height-dynamic .media-block__block-container{height:auto;max-height:none}pn-media-block .media-block--height-dynamic .media-block__block-container .media-block__media-container,pn-media-block .media-block--height-dynamic .media-block__block-container .media-block__content-container,pn-media-block .media-block--height-dynamic .media-block__block-container .media-block__overlay-filter{height:auto;max-height:none}pn-media-block .media-block--with-overlay .media-block__block-container .media-block__overlay-filter{z-index:2;background:radial-gradient(circle, rgba(13, 35, 75, 0.68) 7%, rgba(13, 35, 75, 0) 80%)}pn-media-block .media-block--fixed-background .media-block__block-container .media-block__media-container,pn-media-block .media-block--fixed-background .media-block__block-container .media-block__overlay-filter{position:relative;overflow:hidden;top:0;width:100%;display:flex !important;clip-path:inset(0)}pn-media-block .media-block--fixed-background .media-block__block-container .media-block__media-container picture{position:absolute;top:0;width:100%;display:flex !important;height:100%}pn-media-block .media-block--fixed-background .media-block__block-container .media-block__media-container picture img{position:fixed;width:100%;height:100%;object-fit:cover;z-index:1}pn-media-block .media-block--video .media-block__content-container{max-width:80%}pn-media-block .media-block--animate-overlay-background .media-block__overlay-filter{background-size:200% 200% !important;animation:overlayBackgroundAnimation 20s ease infinite}@keyframes overlayBackgroundAnimation{0%{background-position:100% 100%}50%{background-position:50% 60%}100%{background-position:100% 100%}}pn-media-block .media-block--margin-bottom{margin-bottom:3.2rem}@media screen and (min-width: 768px){pn-media-block .media-block--margin-bottom{margin-bottom:4rem}}@media screen and (min-width: 992px){pn-media-block .media-block--margin-bottom{margin-bottom:5.6rem}}@media screen and (min-width: 1200px){pn-media-block .media-block--margin-bottom{margin-bottom:7.2rem}}";const n=a;const t=class{constructor(i){e(this,i);this.blockHeight=null;this.imageSrc=null;this.imageSrcSmallScreenFormat=undefined;this.imageAltText="";this.videoSrc=null;this.parallaxScroll=false;this.showOverlayLayer=false;this.customOverlayBackground=null;this.animateOverlayBackground=false;this.scrollSnapBlock=false;this.fixedBackground=false;this.blockHeading=null;this.blockHeadingLevel=2;this.blockPreamble=null;this.pnPlayOnScrollObserverOptions={root:document,threshold:1,rootMargin:"220px 0px 220px 0px"};this.calculatedBlockHeight=undefined;this.hasButtonSlot=true}get block(){return i(this)}get blockHeadingLevelChecked(){if(this.blockHeading&&this.blockHeading!==null){console.warn("blockHeadingLevel is required when blockHeading is set");return undefined}return this.blockHeadingLevel}get hasVideo(){if(this.videoSrc!==null&&this.videoSrc!=="undefined"){return true}return false}get hasImage(){if(this.imageSrc!==null&&this.imageSrc!=="undefined"){return true}return false}observerScroll;observerSnap;componentWillLoad(){this.hasButtonSlot=!!this.block.querySelector('[slot="cta-button"]')}async componentDidLoad(){const e=document.getElementById("scroll-trigger");this.calculatedBlockHeight=this.block.offsetHeight;const i=this.block.querySelector("#mediaBlockOverlay");if(this.customOverlayBackground!=null||this.customOverlayBackground!="undefined"){i.style.background=`${this.customOverlayBackground}`}if(this.parallaxScroll){this.observerScroll=new IntersectionObserver((e=>{e.forEach((e=>{if(e.isIntersecting){window.addEventListener("scroll",this.handleScroll)}else{window.removeEventListener("scroll",this.handleScroll)}}))}),{rootMargin:`0px 0px`});this.observerScroll.observe(e)}if(this.scrollSnapBlock){this.observerSnap=new IntersectionObserver((e=>{e.forEach((e=>{if(e.isIntersecting){if(this.block instanceof HTMLElement){setTimeout((()=>{this.block.scrollIntoView({behavior:"smooth",block:"start"})}),1e3)}else{console.error("this.block is not a valid HTMLElement")}}}))}),{root:document,rootMargin:"100px 0px 100px 0px",threshold:0});this.observerSnap.observe(e)}}disconnectedCallback(){if(this.observerScroll){this.observerScroll.disconnect()}if(this.observerSnap){this.observerSnap.disconnect()}window.removeEventListener("scroll",this.handleScroll)}handleScroll=()=>{const e=this.block.firstElementChild;const i=this.block.querySelector("#scroll-trigger");const o=this.block.querySelector("#overlayed-button-pause-video");const a=i.getBoundingClientRect().top;const n=e.offsetHeight;const t=n-a;const c=.3;const d=.2;const l=this.block.querySelector(".media-block__media-container");const m=this.block.querySelector(".media-block__content-container");if(l!=null){l.style.transform=`translate(0, ${t*(.1+d)}px)`;if(o!=null){o.style.transform=`translate(0, ${-t*(.3+d)}px)`}}if(m){m.style.transform=`translate(0, ${t*(.5+c)}px)`;const e=Math.max(0,1-t/600);m.style.opacity=`${e}`}};render(){const{showOverlayLayer:e,fixedBackground:i,blockHeight:a,scrollSnapBlock:n,blockHeadingLevelChecked:t,hasButtonSlot:c,hasVideo:d,hasImage:l,animateOverlayBackground:m}=this;const b=`h${t??2}`;const h=d;const r=l;const k=["media-block",a?`media-block--height-${a}`:"",e?"media-block--with-overlay":"",m?`media-block--animate-overlay-background`:"",h?"media-block--video":"",n?"scroll-snap":"no-scroll-snap",i?"media-block--fixed-background":""].join(" ");const s={root:this.blockHeight==="100svh"?this.block:null,threshold:[0,.5,1]};return o("div",{key:"ecced5b0bf6d2a859e77c79a10e6691b67dac996",class:k},o("div",{key:"49b925b7e2f0726fdde6cc5f37aeecdd542d1579",class:"media-block__block-container"},o("div",{key:"496847f2fa31bc56d51bc2fc57d76f90f91e43de",class:"media-block__media-container"},h?o("pn-play-on-scroll",{"show-overlay":this.showOverlayLayer,observerOptions:s,"video-src":this.videoSrc}):r?o("picture",null,o("source",{media:"(min-width: 1400px)",srcSet:this.imageSrc}),o("source",{media:"(min-width: 1224px)",srcSet:this.imageSrc}),o("source",{media:"(min-width: 1140px)",srcSet:this.imageSrc}),o("source",{media:"(min-width: 1023px)",srcSet:this.imageSrcSmallScreenFormat&&this.imageSrcSmallScreenFormat!=="undefined"?this.imageSrcSmallScreenFormat:this.imageSrc}),o("source",{media:"(min-width: 768px)",srcSet:this.imageSrcSmallScreenFormat&&this.imageSrcSmallScreenFormat!=="undefined"?this.imageSrcSmallScreenFormat:this.imageSrc}),o("source",{media:"(min-width: 500px)",srcSet:this.imageSrcSmallScreenFormat&&this.imageSrcSmallScreenFormat!=="undefined"?this.imageSrcSmallScreenFormat:this.imageSrc}),o("img",{src:this.imageSrcSmallScreenFormat!=="undefined"?this.imageSrcSmallScreenFormat:this.imageSrc,alt:this.imageAltText!=="undefined"?this.imageAltText:"",role:this.imageAltText!=="undefined"?"img":"presentation","aria-hidden":this.imageAltText!=="undefined"?"false":"true"})):null),!h&&o("div",{key:"2738b9052d0d5d66330b5ba6abfe65eee1a5a6d2",class:"media-block__overlay-filter",id:"mediaBlockOverlay"}),(this.blockHeading||this.blockPreamble)&&o("div",{key:"199f4a644a1f19f6165b7426de824dc82ae60dd4",class:"media-block__content-container"},this.blockHeading&&o(b,{key:"bf840616f0a52383d6fba1d183a08fa5abf2cb6e",class:"media-block__block-heading"},this.blockHeading),this.blockPreamble&&o("p",{key:"7040983d8f422af63452d6ed04d026829507c8eb",class:"media-block__preamble"},this.blockPreamble),c&&o("div",{key:"6e3440cf418fa5196926aefdd76465c8e0ece2c2",class:"media-block__cta-link"},o("slot",{key:"15b22fe51024c91a7073aa6ae75350d0f9068d6a",name:"cta-button"})))),o("div",{key:"7f670bd4220934049a3b231bd4efc8b2b5430d1e",id:"scroll-trigger"}))}};t.style=n;export{t as pn_media_block};
2
+ //# sourceMappingURL=p-42c9386d.entry.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["pnMediaBlockCss","PnMediaBlockStyle0","PnmediaBlock","undefined","root","document","threshold","rootMargin","blockHeadingLevelChecked","this","blockHeading","console","warn","blockHeadingLevel","hasVideo","videoSrc","hasImage","imageSrc","observerScroll","observerSnap","componentWillLoad","hasButtonSlot","block","querySelector","componentDidLoad","scrollTrigger","getElementById","calculatedBlockHeight","offsetHeight","overlayElement","customOverlayBackground","style","background","parallaxScroll","IntersectionObserver","entries","forEach","entry","isIntersecting","window","addEventListener","handleScroll","removeEventListener","observe","scrollSnapBlock","HTMLElement","setTimeout","scrollIntoView","behavior","error","disconnectedCallback","disconnect","mediaBlockElement","firstElementChild","videoPauseButton","scrollTriggerTop","getBoundingClientRect","top","mediaBlockElementHeight","scrollPosition","parallaxSpeedContent","parallaxSpeedMedia","mediaContainer","content","transform","opacity","Math","max","render","showOverlayLayer","fixedBackground","blockHeight","animateOverlayBackground","HeadingTag","isVideo","isImage","classes","join","pnPlayOnScrollObserverOptions","h","key","class","observerOptions","media","srcSet","imageSrcSmallScreenFormat","src","alt","imageAltText","role","id","blockPreamble","name"],"sources":["src/components/media/pn-media-block/pn-media-block.scss?tag=pn-media-block","src/components/media/pn-media-block/pn-media-block.tsx"],"sourcesContent":["@import '../../../globals/main.scss';\n\n$animationDuration: 20s;\n\npn-media-block {\n .media-block {\n .media-block__block-container {\n display: grid;\n overflow: hidden;\n }\n .media-block__media-container,\n .media-block__content-container,\n .media-block__overlay-filter {\n grid-area: 1 / 1;\n width: 100%;\n position: relative;\n }\n\n .media-block__media-container {\n height: 100vh;\n overflow: hidden;\n position: relative;\n\n img,\n video {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n object-fit: cover;\n pointer-events: none;\n max-width: 100%;\n max-height: none;\n height: 100%;\n width: 100%;\n pointer-events: none;\n }\n\n pn-play-on-scroll {\n width: 100%;\n height: 100%;\n }\n\n .scroll-wrapper {\n width: 100%;\n height: 100%;\n }\n\n [slot='scroll-affected'] {\n width: 100%;\n height: 100%;\n display: flex;\n }\n\n .scroll-wrapper,\n .scroll-affected {\n width: 100%;\n height: 100%;\n display: flex;\n }\n video {\n width: 100%;\n height: 100%;\n }\n }\n\n .media-block__overlay-filter {\n z-index: 2;\n }\n\n .media-block__content-container {\n z-index: 3;\n display: flex;\n align-items: center;\n justify-content: center;\n transition: opacity 1s;\n flex-direction: column;\n margin: 0 auto;\n padding: 3.4rem 0;\n\n @include inner-container;\n\n @media screen and (min-width: 992px) {\n padding: 6.4rem 0;\n }\n\n @media screen and (min-width: 1200px) {\n padding: 7.2rem 0;\n }\n\n @media screen and (min-width: 1640px) {\n padding: 8rem 0;\n }\n\n .media-block__block-heading {\n max-width: 100rem;\n text-wrap: balance;\n color: white;\n font-size: 3.2rem;\n text-align: center;\n font-weight: 700;\n line-height: 1.1;\n margin-bottom: 3rem;\n\n @media screen and (min-width: 576px) {\n font-size: 4rem;\n }\n\n @media screen and (min-width: 768px) {\n font-size: 4.8rem;\n }\n\n @media screen and (min-width: 992px) {\n font-size: 5.6rem;\n }\n\n @media screen and (min-width: 1200px) {\n font-size: 8rem;\n }\n\n @media screen and (min-width: 1640px) {\n font-size: 8.8rem;\n }\n }\n\n .media-block__preamble {\n max-width: 80rem;\n max-width: 80ch;\n text-wrap: balance;\n display: flex;\n color: white;\n font-size: 1.8rem;\n text-align: center;\n font-weight: 300;\n\n @media screen and (min-width: 576px) {\n font-size: 2rem;\n }\n\n @media screen and (min-width: 1200px) {\n font-size: 2.4rem;\n }\n\n @media screen and (min-width: 1640px) {\n font-weight: 500;\n }\n }\n\n .media-block__cta-link {\n margin-top: 3rem;\n }\n }\n }\n\n .media-block--height-100svh {\n min-height: 100vh;\n\n @supports (height: 100svh) {\n height: 100svh;\n }\n\n .media-block__block-container {\n height: 100vh;\n\n @supports (max-height: 100svh) {\n max-height: 100svh;\n }\n\n .media-block__media-container,\n .media-block__content-container,\n .media-block__overlay-filter {\n height: 100vh;\n\n @supports (max-height: 100svh) {\n max-height: 100svh;\n }\n }\n\n .media-block__media-container picture {\n height: 100vh;\n\n @supports (max-height: 100svh) {\n max-height: 100svh;\n }\n }\n }\n }\n\n .media-block--height-65svh {\n min-height: 65svh;\n overflow: auto;\n\n .media-block__block-container {\n height: 65vh;\n\n @supports (max-height: 100svh) {\n max-height: 65svh;\n }\n\n .media-block__media-container,\n .media-block__content-container,\n .media-block__overlay-filter {\n height: 65vh;\n\n @supports (max-height: 100svh) {\n max-height: 65svh;\n }\n }\n }\n\n .media-block__media-container picture {\n max-height: none !important;\n height: auto !important;\n }\n }\n\n .media-block--height-dynamic {\n height: auto;\n overflow: auto;\n\n .media-block__block-container {\n height: auto;\n max-height: none;\n\n .media-block__media-container,\n .media-block__content-container,\n .media-block__overlay-filter {\n height: auto;\n max-height: none;\n }\n }\n }\n\n .media-block--with-overlay {\n .media-block__block-container .media-block__overlay-filter {\n z-index: 2;\n background: radial-gradient(circle, rgba(13, 35, 75, 0.68) 7%, rgba(13, 35, 75, 0) 80%);\n }\n }\n\n .media-block--fixed-background {\n .media-block__block-container {\n .media-block__media-container,\n .media-block__overlay-filter {\n position: relative;\n overflow: hidden;\n top: 0;\n width: 100%;\n display: flex !important;\n clip-path: inset(0);\n }\n\n .media-block__media-container {\n picture {\n position: absolute;\n top: 0;\n width: 100%;\n display: flex !important;\n height: 100%;\n\n img {\n position: fixed;\n width: 100%;\n height: 100%;\n object-fit: cover;\n z-index: 1;\n }\n }\n }\n }\n }\n\n .media-block--video {\n .media-block__content-container {\n max-width: 80%;\n }\n }\n\n .media-block--animate-overlay-background {\n .media-block__overlay-filter {\n background-size: 200% 200% !important;\n animation: overlayBackgroundAnimation $animationDuration ease infinite;\n }\n }\n\n @keyframes overlayBackgroundAnimation {\n 0% {\n background-position: 100% 100%;\n }\n 50% {\n background-position: 50% 60%;\n }\n 100% {\n background-position: 100% 100%;\n }\n }\n\n .media-block--margin-bottom {\n margin-bottom: 3.2rem;\n\n @media screen and (min-width:768px) {\n margin-bottom: 4rem;\n }\n\n @media screen and (min-width:992px) {\n margin-bottom: 5.6rem;\n }\n\n @media screen and (min-width:1200px) {\n margin-bottom: 7.2rem;\n }\n }\n}\n","import { Component, Element, Prop, h, State } from '@stencil/core';\n\nfunction userPrefersReducedMotion(): boolean {\n return window.matchMedia('(prefers-reduced-motion: reduce)').matches;\n}\n\n@Component({\n tag: 'pn-media-block',\n styleUrl: 'pn-media-block.scss',\n})\nexport class PnmediaBlock {\n @Prop() blockHeight: string = null;\n @Prop() imageSrc?: string = null;\n @Prop() imageSrcSmallScreenFormat?: string = undefined;\n @Prop() imageAltText?: string = '';\n @Prop() videoSrc?: string = null;\n @Prop() parallaxScroll: boolean = false;\n @Prop() showOverlayLayer: boolean = false;\n @Prop() customOverlayBackground?: string = null;\n @Prop() animateOverlayBackground: boolean = false;\n @Prop() scrollSnapBlock: boolean = false;\n @Prop() fixedBackground: boolean = false;\n @Prop() blockHeading?: string = null;\n @Prop() blockHeadingLevel?: number = 2;\n @Prop() blockPreamble?: string = null;\n\n @State() pnPlayOnScrollObserverOptions: IntersectionObserverInit = {\n root: document,\n threshold: 1,\n rootMargin: '220px 0px 220px 0px',\n };\n\n @State() calculatedBlockHeight: number;\n @State() hasButtonSlot: boolean = true;\n\n @Element() block: HTMLElement;\n\n get blockHeadingLevelChecked() {\n if (this.blockHeading && this.blockHeading !== null) {\n console.warn('blockHeadingLevel is required when blockHeading is set');\n return undefined;\n }\n return this.blockHeadingLevel;\n }\n\n get hasVideo() {\n if (this.videoSrc !== null && this.videoSrc !== 'undefined') {\n return true;\n }\n return false;\n }\n\n get hasImage() {\n if (this.imageSrc !== null && this.imageSrc !== 'undefined') {\n return true;\n }\n return false;\n }\n\n private observerScroll: IntersectionObserver;\n private observerSnap: IntersectionObserver;\n\n componentWillLoad() {\n this.hasButtonSlot = !!this.block.querySelector('[slot=\"cta-button\"]');\n }\n\n async componentDidLoad() {\n const scrollTrigger = document.getElementById('scroll-trigger');\n this.calculatedBlockHeight = this.block.offsetHeight;\n\n const overlayElement = this.block.querySelector('#mediaBlockOverlay') as HTMLElement;\n if (this.customOverlayBackground != null || this.customOverlayBackground != 'undefined') {\n overlayElement.style.background = `${this.customOverlayBackground}`;\n }\n\n if (this.parallaxScroll) {\n this.observerScroll = new IntersectionObserver(\n entries => {\n entries.forEach(entry => {\n if (entry.isIntersecting) {\n window.addEventListener('scroll', this.handleScroll);\n } else {\n window.removeEventListener('scroll', this.handleScroll);\n }\n });\n },\n { rootMargin: `0px 0px` },\n );\n\n this.observerScroll.observe(scrollTrigger);\n }\n\n if (this.scrollSnapBlock) {\n this.observerSnap = new IntersectionObserver(\n entries => {\n entries.forEach(entry => {\n if (entry.isIntersecting) {\n // The block is within 100px of the viewport, scroll it into view\n if (this.block instanceof HTMLElement) {\n setTimeout(() => {\n this.block.scrollIntoView({ behavior: 'smooth', block: 'start' });\n }, 1000); // Adjust the delay as needed\n } else {\n console.error('this.block is not a valid HTMLElement');\n }\n }\n });\n },\n {\n root: document,\n rootMargin: '100px 0px 100px 0px',\n threshold: 0,\n },\n );\n\n this.observerSnap.observe(scrollTrigger);\n }\n }\n\n disconnectedCallback() {\n // Clean up the observer and event listener when the component is removed\n if (this.observerScroll) {\n this.observerScroll.disconnect();\n }\n if (this.observerSnap) {\n this.observerSnap.disconnect();\n }\n window.removeEventListener('scroll', this.handleScroll);\n }\n\n handleScroll = () => {\n const mediaBlockElement = this.block.firstElementChild as HTMLElement;\n const scrollTrigger = this.block.querySelector('#scroll-trigger') as HTMLElement;\n const videoPauseButton = this.block.querySelector('#overlayed-button-pause-video') as HTMLButtonElement;\n\n const scrollTriggerTop = scrollTrigger.getBoundingClientRect().top;\n const mediaBlockElementHeight = mediaBlockElement.offsetHeight;\n\n const scrollPosition = mediaBlockElementHeight - scrollTriggerTop;\n\n const parallaxSpeedContent = 0.3;\n const parallaxSpeedMedia = 0.2;\n\n const mediaContainer = this.block.querySelector('.media-block__media-container') as HTMLElement;\n const content = this.block.querySelector('.media-block__content-container') as HTMLElement;\n\n if (mediaContainer != null) {\n // Move the image or video at a slower speed\n mediaContainer.style.transform = `translate(0, ${scrollPosition * (0.1 + parallaxSpeedMedia)}px)`;\n\n if (videoPauseButton != null) {\n // Move the pause button up\n videoPauseButton.style.transform = `translate(0, ${-scrollPosition * (0.3 + parallaxSpeedMedia)}px)`;\n }\n }\n\n if (content) {\n // Move the content at a faster speed\n content.style.transform = `translate(0, ${scrollPosition * (0.5 + parallaxSpeedContent)}px)`;\n\n // Change the opacity based on the scroll position\n const opacity = Math.max(0, 1 - scrollPosition / 600);\n content.style.opacity = `${opacity}`;\n }\n };\n\n render() {\n const { showOverlayLayer, fixedBackground, blockHeight, scrollSnapBlock, blockHeadingLevelChecked, hasButtonSlot, hasVideo, hasImage, animateOverlayBackground } = this;\n const HeadingTag = `h${blockHeadingLevelChecked ?? 2}`;\n const isVideo = hasVideo;\n const isImage = hasImage;\n\n const classes = [\n 'media-block',\n blockHeight ? `media-block--height-${blockHeight}` : '',\n showOverlayLayer ? 'media-block--with-overlay' : '',\n animateOverlayBackground ? `media-block--animate-overlay-background` : '',\n isVideo ? 'media-block--video' : '',\n scrollSnapBlock ? 'scroll-snap' : 'no-scroll-snap',\n fixedBackground ? 'media-block--fixed-background' : '',\n ].join(' ');\n\n const pnPlayOnScrollObserverOptions: IntersectionObserverInit = {\n root: this.blockHeight === \"100svh\" ? this.block : null,\n threshold: [0, 0.5, 1], // Callback will be executed when 0%, 50%, and 100% of the target is visible\n };\n\n return (\n <div class={classes}>\n <div class=\"media-block__block-container\">\n <div class=\"media-block__media-container\">\n {isVideo ? (\n <pn-play-on-scroll show-overlay={this.showOverlayLayer} observerOptions={pnPlayOnScrollObserverOptions} video-src={this.videoSrc}></pn-play-on-scroll>\n ) : isImage ? (\n <picture>\n <source media=\"(min-width: 1400px)\" srcSet={this.imageSrc} />\n <source media=\"(min-width: 1224px)\" srcSet={this.imageSrc} />\n <source media=\"(min-width: 1140px)\" srcSet={this.imageSrc} />\n <source\n media=\"(min-width: 1023px)\"\n srcSet={this.imageSrcSmallScreenFormat && this.imageSrcSmallScreenFormat !== 'undefined' ? this.imageSrcSmallScreenFormat : this.imageSrc}\n />\n <source\n media=\"(min-width: 768px)\"\n srcSet={this.imageSrcSmallScreenFormat && this.imageSrcSmallScreenFormat !== 'undefined' ? this.imageSrcSmallScreenFormat : this.imageSrc}\n />\n <source\n media=\"(min-width: 500px)\"\n srcSet={this.imageSrcSmallScreenFormat && this.imageSrcSmallScreenFormat !== 'undefined' ? this.imageSrcSmallScreenFormat : this.imageSrc}\n />\n <img\n src={this.imageSrcSmallScreenFormat !== 'undefined' ? this.imageSrcSmallScreenFormat : this.imageSrc}\n alt={this.imageAltText !== 'undefined' ? this.imageAltText : ''}\n role={this.imageAltText !== 'undefined' ? 'img' : 'presentation'}\n aria-hidden={this.imageAltText !== 'undefined' ? 'false' : 'true'}\n />\n </picture>\n ) : null}\n </div>\n\n {!isVideo && <div class=\"media-block__overlay-filter\" id=\"mediaBlockOverlay\"></div>}\n\n {(this.blockHeading || this.blockPreamble) && (\n <div class=\"media-block__content-container\">\n {this.blockHeading && <HeadingTag class=\"media-block__block-heading\">{this.blockHeading}</HeadingTag>}\n {this.blockPreamble && <p class=\"media-block__preamble\">{this.blockPreamble}</p>}\n {hasButtonSlot && (\n <div class=\"media-block__cta-link\">\n <slot name=\"cta-button\" />\n </div>\n )}\n </div>\n )}\n </div>\n\n <div id=\"scroll-trigger\"></div>\n </div>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
@@ -0,0 +1,2 @@
1
+ import{r as t,c as i,g as s,h as e,d as l}from"./p-06555615.js";import{F as n,M as o}from"./p-73cef33c.js";import{d as h}from"./p-aed52bc1.js";const a="pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}pn-address-autofill pn-marketweb-input{width:50%}pn-address-autofill .input-container-row{display:flex;gap:1rem;margin-bottom:1rem}pn-address-autofill .label-container{color:#5e554a;font-size:0.875em;display:flex;justify-content:space-between;align-items:flex-end}pn-address-autofill .autocomplete-items{position:absolute;border-radius:0.8rem;border:0.1rem solid #5e554a;width:100%;max-height:30rem;overflow-y:auto}pn-address-autofill .autocomplete-items:hover,pn-address-autofill .autocomplete-items :focus{border:0.1rem solid #00a0d6}pn-address-autofill .autocomplete-items div{padding:1.6rem;cursor:pointer;background-color:#fff;border:0.1rem solid transparent}pn-address-autofill .autocomplete-items div:first-child{border-radius:0.8rem 0.8rem 0 0}pn-address-autofill .autocomplete-items div:last-child{border-radius:0 0 0.8rem 0.8rem}pn-address-autofill .autocomplete-items div:hover{background-color:#e0f8ff}pn-address-autofill .autocomplete-items .autocomplete-active{background-color:#e0f8ff}";const r=a;const u=class{constructor(s){t(this,s);this.addresscomplete=i(this,"addresscomplete",7);this.market=null;this.environment=null;this.endpoint=null;this.cache=true;this.countryCode=null;this.postalCodeProps=null;this.cityProps=null;this.streetAddressProps=null;this.streetNumberProps=null;this.streetAdressArr=null;this.streetNumberArr=null;this.city=null;this.postalCode=null;this.streetAddress=null;this.streetNumber=null;this.fullAddress=null}get hostElement(){return s(this)}pnInputPostalCode=null;pnInputCity=null;pnInputStreetAddress=null;pnInputStreetNumber=null;postalCodeInputField=null;streetAddressInputField=null;streetNumberInputField=null;pnInputHiddenValue=null;endpointPath="/api/location/get-by-location";_postalCodeProps=null;_cityProps=null;_streetAddressProps=null;_streetNumberProps=null;addresscomplete;fetchHelper=new n("PostalCodeCityAutofill");componentWillLoad(){this.setInitialValues();this._postalCodeProps=this.setProps(this.postalCodeProps);this._cityProps=this.setProps(this.cityProps);this._streetAddressProps=this.setProps(this.streetAddressProps);this._streetNumberProps=this.setProps(this.streetNumberProps)}setProps(t){if(typeof t==="string"){return JSON.parse(t)}else{return t}}componentDidLoad(){this.postalCodeInputField=this.pnInputPostalCode.querySelector("input");this.streetAddressInputField=this.pnInputStreetAddress.querySelector("input");this.streetNumberInputField=this.pnInputStreetNumber.querySelector("input");this.addEventHandlers()}async setInitialValues(t=window.location.href){const i=new o(t);if(!this.environment){this.environment=await i.getEnvironmentName()}if(!this.endpoint&&this.environment?.indexOf("local")===-1){this.endpoint=await i.getEndpoint(this.environment,this.market)}if(!this.endpoint){this.endpoint=""}}addEventHandlers(){const t=h(this.fetchData.bind(this,this.postalCodeInputField),1e3);this.postalCodeInputField.addEventListener("keyup",t);this.streetAddressInputField.addEventListener("keyup",this.handleStreetAddressDropdown.bind(this));this.streetNumberInputField.addEventListener("focus",this.handleStreetNumberDropdown.bind(this));this.addFormFieldEvent()}addFormFieldEvent(){const t=this.hostElement.querySelectorAll("input");t.forEach((t=>{["keyup","change"].forEach((i=>{const s=h(this.updateHiddenValue.bind(this),1e3);t.addEventListener(i,s)}))}))}updateHiddenValue(t){if(t.target===this.streetNumberInputField){this.streetNumber=this.streetNumberInputField.value}if(this.postalCode&&this.city&&this.streetAddress&&this.streetNumber){this.fullAddress=`${this.streetAddress} ${this.streetNumber}, ${this.city} ${this.postalCode}`}else{this.fullAddress=""}this.addresscomplete.emit(this.fullAddress)}async fetchData(t,i){if(i){i.preventDefault();if(i.key==="Tab"){if(this.city){return}}}let s="";const e=i&&i.target===this.postalCodeInputField;const l=t===this.streetAddressInputField&&this.city&&this.city.length;const n=t===this.streetNumberInputField&&this.city&&this.city.length&&this.streetAddress&&this.streetAddress.length;if(e){s=this.postalCodeInputField.value;this.streetAdressArr=null;this.streetAddressInputField.value="";this.streetNumberArr=null;this.streetNumberInputField.value="";this.city=null;this.streetAddress=null;this.streetNumber=null}if(l){s=`${this.streetAddressInputField.value}, ${this.city}`;this.streetNumberArr=null;this.streetNumberInputField.value="";this.streetNumber=null}if(n){this.streetAdressArr=null;s=`${this.streetAddress}, ${this.city}`}if(s.length>0){const t=this.endpoint.lastIndexOf("/")===this.endpoint.length-1?this.endpoint.substring(0,this.endpoint.length-1):this.endpoint;const i=`${t}${this.endpointPath}?countryCode=${this.countryCode}&query=${s}&maxHits=1000`;const o=await this.fetchHelper.fetchJson(i,{mode:"cors"},this.cache);if(o){if(e){this.city=o.postalCodes?o.postalCodes[0]?.postalCity:null}if(l&&o.addresses){this.postalCode=this.postalCodeInputField.value;this.filterStreetNames(o)}if(n&&o.addresses){this.filterStreetNumbers(o)}}}}filterStreetNames=t=>{const i=[];this.streetAdressArr=null;t.addresses.forEach((t=>{if(t.postalCode.postalCity===this.city&&!i.includes(t.street)){i.push(t.street)}}));this.streetAdressArr=i};filterStreetNumbers=t=>{const i=[];t.addresses.forEach((t=>{if(t.postalCode.postalCode===this.postalCode){const{numberFrom:s,numberTo:e}=t;const l=parseInt(s);const n=parseInt(e);for(let t=l;t<=n;t++){const s=t.toString();if(!i.includes(s)){i.push(t.toString())}}}}));this.streetNumberArr=i};async handleStreetAddressDropdown(t){const i=t.target;if(i===this.streetAddressInputField&&i.value.length){if(!this.streetAdressArr||!this.streetAdressArr.length){await this.fetchData(this.streetAddressInputField,null)}}if(!i.value||!i.value.length){this.streetAdressArr=null}if(this.streetAdressArr&&this.streetAdressArr.length){this.autoComplete(t,this.streetAdressArr)}}async handleStreetNumberDropdown(t){t.preventDefault();const i=t.target;if(i===this.streetNumberInputField){if(!this.streetNumberArr||!this.streetNumberArr.length){await this.fetchData(this.streetNumberInputField,null)}if(this.streetNumberArr){this.autoComplete(t,this.streetNumberArr)}}}autoComplete(t,i){const s=t.target;if(i.length<1){return}let e=0;s.addEventListener("input",(()=>{const t=s.value;this.closeAllLists(s);if(!t){return}e=-1;let l=document.createElement("div");l.setAttribute("id","autocomplete-list"+s.name);l.setAttribute("class","autocomplete-items");s.parentElement.appendChild(l);for(let e=0;e<i.length;e++){if(i[e].substring(0,t.length).toUpperCase()==t.toUpperCase()){let n=document.createElement("div");n.innerHTML="<strong>"+i[e].substring(0,t.length)+"</strong>";n.innerHTML+=i[e].substring(t.length);n.innerHTML+="<input type='hidden' value='"+i[e]+"'>";n.addEventListener("click",(t=>{const i=s.closest("pn-marketweb-input");let e=t.target;if(e.nodeName==="STRONG"){e=e.parentElement}i.value=e.getElementsByTagName("input")[0].value;if(s===this.streetNumberInputField){this.streetNumber=i.value}if(s===this.streetAddressInputField){this.streetAddress=i.value}this.closeAllLists(t.target);s.focus()}));l.appendChild(n)}}}));s.addEventListener("keydown",(t=>{const i=document.getElementById("autocomplete-list"+s.name);let l;if(i){l=i.getElementsByTagName("div")}else{l=i}if(t.keyCode==40){e++;this.addActive(l,e)}if(t.keyCode==38){e--;this.addActive(l,e)}if(t.keyCode==13){t.preventDefault();if(e>-1){if(l){l[e].click()}}}}))}closeAllLists(t){const i=document.getElementsByClassName("autocomplete-items");for(let s=0;s<i.length;s++){if(t!=i[s]){i[s].parentNode.removeChild(i[s])}}}addActive(t,i){if(!t)return;this.removeActive(t);if(i>=t.length)i=0;if(i<0)i=t.length-1;t[i].classList.add("autocomplete-active")}removeActive(t){for(let i=0;i<t.length;i++){t[i].classList.remove("autocomplete-active")}}render(){return e(l,{key:"e0f667ef808c53f3d40b514b3a648447a6a57fd2",class:"pn-address-autofill"},this._postalCodeProps?.postalCodeCityLabel?e("div",{class:"label-container"},e("label",null,`${this._postalCodeProps.postalCodeCityLabel}`)):null,e("div",{key:"6e4b2cdefa11b88e5904f1cf9e234abb9a9387f4",class:"input-container-row"},e("pn-marketweb-input",{key:"599a06260d24a6a2a857e25072388177a09f14c9",type:"text",name:this._postalCodeProps?.postalCodeInputName,required:this._postalCodeProps?.postalCodeInputRequired,placeholder:this._postalCodeProps?.postalCodeInputPlaceholder,ref:t=>this.pnInputPostalCode=t,autocomplete:"off",helpertext:this._postalCodeProps?.postalCodeInputHelpertext}),e("pn-marketweb-input",{key:"251e676f25c64be78351ea3663c36ead103f4c3f",type:"text",name:this._cityProps?.cityInputName,disabled:true,value:this.city,placeholder:this._cityProps?.cityInputPlaceholder,autocomplete:"off",helpertext:this._cityProps?.cityInputHelpertext})),this._streetAddressProps?.streetAddressNumberLabel?e("div",{class:"label-container"},e("label",null,`${this._streetAddressProps.streetAddressNumberLabel}`)):null,e("div",{key:"71fdc61d6fa1f0b0f4fe8f02eb5d64254f4ca7fd",class:"input-container-row"},e("pn-marketweb-input",{key:"d7c21bc51aa24541c910cc2f1adf1708a5897245",type:"text",name:this._streetAddressProps?.streetAddressInputName,required:this._streetAddressProps?.streetAddressInputRequired,value:this.streetAddress,placeholder:this._streetAddressProps?.streetAddressInputPlaceholder,ref:t=>this.pnInputStreetAddress=t,autocomplete:"off",helpertext:this._streetAddressProps?.streetAddressInputHelpertext}),e("pn-marketweb-input",{key:"b96c0b5ab0632528b44d9e2477208750b61dc8b3",type:"text",name:this._streetNumberProps?.streetNumberInputName,required:this._streetNumberProps?.streetNumberInputRequired,value:this.streetNumber,placeholder:this._streetNumberProps?.streetNumberInputPlaceholder,ref:t=>this.pnInputStreetNumber=t,autocomplete:"off",helpertext:this._streetNumberProps?.streetNumberInputHelpertext})))}};u.style=r;export{u as pn_address_autofill};
2
+ //# sourceMappingURL=p-d5a4ada5.entry.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["pnAddressAutofillCss","PnAddressAutofillStyle0","PnAddressAutofill","pnInputPostalCode","pnInputCity","pnInputStreetAddress","pnInputStreetNumber","postalCodeInputField","streetAddressInputField","streetNumberInputField","pnInputHiddenValue","endpointPath","_postalCodeProps","_cityProps","_streetAddressProps","_streetNumberProps","addresscomplete","fetchHelper","FetchHelper","componentWillLoad","this","setInitialValues","setProps","postalCodeProps","cityProps","streetAddressProps","streetNumberProps","props","JSON","parse","componentDidLoad","querySelector","addEventHandlers","href","window","location","marketWebContextService","MarketWebContextService","environment","getEnvironmentName","endpoint","indexOf","getEndpoint","market","postalCodeSearch","debounce","fetchData","bind","addEventListener","handleStreetAddressDropdown","handleStreetNumberDropdown","addFormFieldEvent","allInputs","hostElement","querySelectorAll","forEach","element","eventName","debounceUpdate","updateHiddenValue","e","target","streetNumber","value","postalCode","city","streetAddress","fullAddress","emit","field","preventDefault","key","query","isPostalCodeSearch","isStreetAddressSearch","length","isStreetNumberSearch","streetAdressArr","streetNumberArr","endpointBase","lastIndexOf","substring","fetchUrl","countryCode","data","fetchJson","mode","cache","postalCodes","postalCity","addresses","filterStreetNames","filterStreetNumbers","item","includes","street","push","streetNumbersResult","numberFrom","numberTo","from","parseInt","to","i","nrString","toString","autoComplete","arr","inputField","currentFocus","val","closeAllLists","list","document","createElement","setAttribute","name","parentElement","appendChild","toUpperCase","option","innerHTML","clickEvent","inputParrent","closest","eventTarget","nodeName","getElementsByTagName","focus","keydownEvent","listElement","getElementById","keyCode","addActive","click","elmnt","lists","getElementsByClassName","parentNode","removeChild","removeActive","classList","add","remove","render","h","Host","class","postalCodeCityLabel","type","postalCodeInputName","required","postalCodeInputRequired","placeholder","postalCodeInputPlaceholder","ref","el","autocomplete","helpertext","postalCodeInputHelpertext","cityInputName","disabled","cityInputPlaceholder","cityInputHelpertext","streetAddressNumberLabel","streetAddressInputName","streetAddressInputRequired","streetAddressInputPlaceholder","streetAddressInputHelpertext","streetNumberInputName","streetNumberInputRequired","streetNumberInputPlaceholder","streetNumberInputHelpertext"],"sources":["src/components/input/pn-address-autofill/pn-address-autofill.scss?tag=pn-address-autofill","src/components/input/pn-address-autofill/pn-address-autofill.tsx"],"sourcesContent":["@import '../../../globals/main.scss';\n\npn-address-autofill {\n pn-marketweb-input {\n width: 50%;\n }\n\n .input-container-row {\n display: flex;\n //flex-grow: 1;\n gap: 1rem;\n margin-bottom: 1rem;\n }\n\n .label-container {\n color: $gray700;\n font-size: 0.875em;\n display: flex;\n justify-content: space-between;\n align-items: flex-end;\n }\n\n .autocomplete-items {\n position: absolute;\n border-radius: 0.8rem;\n border: 0.1rem solid $gray700;\n width: 100%;\n max-height: 30rem;\n overflow-y: auto;\n\n &:hover,\n :focus {\n border: 0.1rem solid $blue400;\n }\n\n div {\n padding: 1.6rem;\n cursor: pointer;\n background-color: #fff;\n border: 0.1rem solid transparent;\n\n &:first-child {\n border-radius: 0.8rem 0.8rem 0 0;\n }\n\n &:last-child {\n border-radius: 0 0 0.8rem 0.8rem;\n }\n\n &:hover {\n background-color: #e0f8ff;\n }\n }\n\n .autocomplete-active {\n background-color: #e0f8ff;\n }\n }\n}\n","import { Component, Prop, h, Element, State, Host, EventEmitter, Event } from '@stencil/core';\nimport { MarketWebContextService } from '../../../globals/MarketWebContextService';\nimport { FetchHelper } from '../../../globals/FetchHelper';\nimport { Root, PostalCodeProps, CityProps, StreetAddressProps, StreetNumberProps } from './types';\nimport debounce from 'debounce';\n\n@Component({\n tag: 'pn-address-autofill',\n styleUrl: 'pn-address-autofill.scss',\n})\nexport class PnAddressAutofill {\n @Element() hostElement: Element;\n pnInputPostalCode: HTMLElement = null;\n pnInputCity: HTMLElement = null;\n pnInputStreetAddress: HTMLElement = null;\n pnInputStreetNumber: HTMLElement = null;\n postalCodeInputField: HTMLInputElement = null;\n streetAddressInputField: HTMLInputElement = null;\n streetNumberInputField: HTMLInputElement = null;\n pnInputHiddenValue: HTMLElement = null;\n endpointPath = '/api/location/get-by-location';\n private _postalCodeProps: PostalCodeProps = null;\n private _cityProps: CityProps = null;\n private _streetAddressProps: StreetAddressProps = null;\n private _streetNumberProps: StreetNumberProps = null;\n\n /** Specifies which market we want to show (se,dk,fi,no,com) */\n @Prop({ mutable: true, reflect: true }) market: string = null; //se\n /** Specifies which environment we're fetching data from. (production, preproduction, integration, localhost) */\n @Prop({ mutable: true, reflect: true }) environment: string = null; //sv\n @Prop() endpoint: string = null;\n @Prop() cache: boolean = true;\n @Prop() countryCode: string = null;\n @Prop() postalCodeProps: string | PostalCodeProps = null;\n @Prop() cityProps: string | CityProps = null;\n @Prop() streetAddressProps: string | StreetAddressProps = null;\n @Prop() streetNumberProps: string | StreetNumberProps = null;\n\n @State() streetAdressArr: string[] = null;\n @State() streetNumberArr: string[] = null;\n @State() city: string = null;\n @State() postalCode: string = null;\n @State() streetAddress: string = null;\n @State() streetNumber: string = null;\n @State() fullAddress: string = null;\n\n @Event() addresscomplete: EventEmitter<string>;\n\n fetchHelper = new FetchHelper('PostalCodeCityAutofill');\n\n componentWillLoad() {\n this.setInitialValues();\n this._postalCodeProps = this.setProps(this.postalCodeProps);\n this._cityProps = this.setProps(this.cityProps);\n this._streetAddressProps = this.setProps(this.streetAddressProps);\n this._streetNumberProps = this.setProps(this.streetNumberProps);\n }\n\n setProps(props) {\n if (typeof props === 'string') {\n return JSON.parse(props);\n } else {\n return props;\n }\n }\n\n componentDidLoad() {\n this.postalCodeInputField = this.pnInputPostalCode.querySelector('input');\n this.streetAddressInputField = this.pnInputStreetAddress.querySelector('input');\n this.streetNumberInputField = this.pnInputStreetNumber.querySelector('input');\n this.addEventHandlers();\n }\n\n async setInitialValues(href = window.location.href) {\n const marketWebContextService = new MarketWebContextService(href);\n if (!this.environment) {\n this.environment = await marketWebContextService.getEnvironmentName();\n }\n\n if (!this.endpoint && this.environment?.indexOf('local') === -1) {\n this.endpoint = await marketWebContextService.getEndpoint(this.environment, this.market);\n }\n\n if (!this.endpoint) {\n this.endpoint = '';\n }\n }\n\n addEventHandlers() {\n const postalCodeSearch = debounce(this.fetchData.bind(this, this.postalCodeInputField), 1000);\n this.postalCodeInputField.addEventListener('keyup', postalCodeSearch);\n this.streetAddressInputField.addEventListener('keyup', this.handleStreetAddressDropdown.bind(this));\n this.streetNumberInputField.addEventListener('focus', this.handleStreetNumberDropdown.bind(this));\n this.addFormFieldEvent();\n }\n\n addFormFieldEvent() {\n const allInputs = this.hostElement.querySelectorAll('input');\n allInputs.forEach(element => {\n ['keyup', 'change'].forEach(eventName => {\n const debounceUpdate = debounce(this.updateHiddenValue.bind(this), 1000);\n element.addEventListener(eventName, debounceUpdate);\n });\n });\n }\n\n updateHiddenValue(e) {\n if (e.target === this.streetNumberInputField) {\n this.streetNumber = this.streetNumberInputField.value;\n }\n\n if (this.postalCode && this.city && this.streetAddress && this.streetNumber) {\n this.fullAddress = `${this.streetAddress} ${this.streetNumber}, ${this.city} ${this.postalCode}`;\n } else {\n this.fullAddress = '';\n }\n\n this.addresscomplete.emit(this.fullAddress);\n }\n\n async fetchData(field, e: KeyboardEvent) {\n if (e) {\n e.preventDefault();\n\n if (e.key === 'Tab') {\n if (this.city) {\n return;\n }\n }\n }\n\n let query = '';\n const isPostalCodeSearch = e && e.target === this.postalCodeInputField;\n const isStreetAddressSearch = field === this.streetAddressInputField && this.city && this.city.length;\n const isStreetNumberSearch = field === this.streetNumberInputField && this.city && this.city.length && this.streetAddress && this.streetAddress.length;\n\n if (isPostalCodeSearch) {\n query = this.postalCodeInputField.value;\n this.streetAdressArr = null;\n this.streetAddressInputField.value = '';\n this.streetNumberArr = null;\n this.streetNumberInputField.value = '';\n this.city = null;\n this.streetAddress = null;\n this.streetNumber = null;\n }\n if (isStreetAddressSearch) {\n query = `${this.streetAddressInputField.value}, ${this.city}`;\n this.streetNumberArr = null;\n this.streetNumberInputField.value = '';\n this.streetNumber = null;\n }\n if (isStreetNumberSearch) {\n this.streetAdressArr = null;\n query = `${this.streetAddress}, ${this.city}`;\n }\n\n if (query.length > 0) {\n const endpointBase = this.endpoint.lastIndexOf('/') === this.endpoint.length - 1 ? this.endpoint.substring(0, this.endpoint.length - 1) : this.endpoint;\n const fetchUrl = `${endpointBase}${this.endpointPath}?countryCode=${this.countryCode}&query=${query}&maxHits=1000`;\n const data = (await this.fetchHelper.fetchJson(\n fetchUrl,\n {\n mode: 'cors',\n },\n this.cache,\n )) as Root;\n\n if (data) {\n if (isPostalCodeSearch) {\n this.city = data.postalCodes ? data.postalCodes[0]?.postalCity : null;\n }\n\n if (isStreetAddressSearch && data.addresses) {\n this.postalCode = this.postalCodeInputField.value;\n this.filterStreetNames(data);\n }\n\n if (isStreetNumberSearch && data.addresses) {\n this.filterStreetNumbers(data);\n }\n }\n }\n }\n\n filterStreetNames = (data: Root) => {\n const addresses: string[] = [];\n this.streetAdressArr = null;\n data.addresses.forEach(item => {\n if (item.postalCode.postalCity === this.city && !addresses.includes(item.street)) {\n addresses.push(item.street);\n }\n });\n this.streetAdressArr = addresses;\n };\n\n filterStreetNumbers = (data: Root) => {\n const streetNumbersResult: string[] = [];\n data.addresses.forEach(item => {\n if (item.postalCode.postalCode === this.postalCode) {\n const { numberFrom, numberTo } = item;\n const from = parseInt(numberFrom);\n const to = parseInt(numberTo);\n\n for (let i = from; i <= to; i++) {\n const nrString = i.toString();\n if (!streetNumbersResult.includes(nrString)) {\n streetNumbersResult.push(i.toString());\n }\n }\n }\n });\n this.streetNumberArr = streetNumbersResult;\n };\n\n async handleStreetAddressDropdown(e) {\n const target = e.target;\n\n if (target === this.streetAddressInputField && target.value.length) {\n if (!this.streetAdressArr || !this.streetAdressArr.length) {\n await this.fetchData(this.streetAddressInputField, null);\n }\n }\n\n if (!target.value || !target.value.length) {\n this.streetAdressArr = null;\n }\n\n if (this.streetAdressArr && this.streetAdressArr.length) {\n this.autoComplete(e, this.streetAdressArr);\n }\n }\n\n async handleStreetNumberDropdown(e) {\n e.preventDefault();\n const target = e.target;\n\n if (target === this.streetNumberInputField) {\n if (!this.streetNumberArr || !this.streetNumberArr.length) {\n await this.fetchData(this.streetNumberInputField, null);\n }\n if (this.streetNumberArr) {\n this.autoComplete(e, this.streetNumberArr);\n }\n }\n }\n\n autoComplete(e, arr: string[]) {\n const inputField = e.target;\n if (arr.length < 1) {\n return;\n }\n\n let currentFocus = 0;\n\n inputField.addEventListener('input', () => {\n const val = inputField.value;\n this.closeAllLists(inputField);\n\n if (!val) {\n return;\n }\n\n currentFocus = -1;\n let list = document.createElement('div');\n list.setAttribute('id', 'autocomplete-list' + inputField.name);\n list.setAttribute('class', 'autocomplete-items');\n inputField.parentElement.appendChild(list);\n for (let i = 0; i < arr.length; i++) {\n if (arr[i].substring(0, val.length).toUpperCase() == val.toUpperCase()) {\n let option = document.createElement('div');\n option.innerHTML = '<strong>' + arr[i].substring(0, val.length) + '</strong>';\n option.innerHTML += arr[i].substring(val.length);\n option.innerHTML += \"<input type='hidden' value='\" + arr[i] + \"'>\";\n option.addEventListener('click', clickEvent => {\n const inputParrent = inputField.closest('pn-marketweb-input');\n let eventTarget = clickEvent.target as HTMLElement;\n if (eventTarget.nodeName === 'STRONG') {\n eventTarget = eventTarget.parentElement;\n }\n inputParrent.value = eventTarget.getElementsByTagName('input')[0].value;\n\n if (inputField === this.streetNumberInputField) {\n this.streetNumber = inputParrent.value;\n }\n if (inputField === this.streetAddressInputField) {\n this.streetAddress = inputParrent.value;\n }\n\n this.closeAllLists(clickEvent.target);\n inputField.focus();\n });\n\n list.appendChild(option);\n }\n }\n });\n\n inputField.addEventListener('keydown', keydownEvent => {\n const listElement = document.getElementById('autocomplete-list' + inputField.name);\n let element;\n if (listElement) {\n element = listElement.getElementsByTagName('div');\n } else {\n element = listElement;\n }\n\n //If arrow DOWN key is pressed\n if (keydownEvent.keyCode == 40) {\n currentFocus++;\n this.addActive(element, currentFocus);\n }\n\n //If the arrow UP key is pressed\n if (keydownEvent.keyCode == 38) {\n currentFocus--;\n this.addActive(element, currentFocus);\n }\n\n //If the ENTER key is pressed\n if (keydownEvent.keyCode == 13) {\n keydownEvent.preventDefault();\n if (currentFocus > -1) {\n if (element) {\n element[currentFocus].click();\n }\n }\n }\n });\n }\n\n //close all autocomplete lists in the document, except the one passed as an argument:\n closeAllLists(elmnt) {\n const lists = document.getElementsByClassName('autocomplete-items');\n for (let i = 0; i < lists.length; i++) {\n if (elmnt != lists[i]) {\n lists[i].parentNode.removeChild(lists[i]);\n }\n }\n }\n\n //a function to classify an item as \"active\":\n addActive(elmnt, currentFocus) {\n if (!elmnt) return;\n this.removeActive(elmnt);\n if (currentFocus >= elmnt.length) currentFocus = 0;\n if (currentFocus < 0) currentFocus = elmnt.length - 1;\n elmnt[currentFocus].classList.add('autocomplete-active');\n }\n\n //a function to remove the \"active\" class from all autocomplete items:\n removeActive(elmnt) {\n for (let i = 0; i < elmnt.length; i++) {\n elmnt[i].classList.remove('autocomplete-active');\n }\n }\n\n render() {\n return (\n <Host class=\"pn-address-autofill\">\n {this._postalCodeProps?.postalCodeCityLabel ? (\n <div class=\"label-container\">\n <label>{`${this._postalCodeProps.postalCodeCityLabel}`}</label>\n </div>\n ) : null}\n <div class=\"input-container-row\">\n <pn-marketweb-input\n type=\"text\"\n name={this._postalCodeProps?.postalCodeInputName}\n required={this._postalCodeProps?.postalCodeInputRequired}\n placeholder={this._postalCodeProps?.postalCodeInputPlaceholder}\n ref={el => (this.pnInputPostalCode = el as HTMLElement)}\n autocomplete=\"off\"\n helpertext={this._postalCodeProps?.postalCodeInputHelpertext}\n ></pn-marketweb-input>\n\n <pn-marketweb-input\n type=\"text\"\n name={this._cityProps?.cityInputName}\n disabled\n value={this.city}\n placeholder={this._cityProps?.cityInputPlaceholder}\n autocomplete=\"off\"\n helpertext={this._cityProps?.cityInputHelpertext}\n ></pn-marketweb-input>\n </div>\n\n {this._streetAddressProps?.streetAddressNumberLabel ? (\n <div class=\"label-container\">\n <label>{`${this._streetAddressProps.streetAddressNumberLabel}`}</label>\n </div>\n ) : null}\n <div class=\"input-container-row\">\n <pn-marketweb-input\n type=\"text\"\n name={this._streetAddressProps?.streetAddressInputName}\n required={this._streetAddressProps?.streetAddressInputRequired}\n value={this.streetAddress}\n placeholder={this._streetAddressProps?.streetAddressInputPlaceholder}\n ref={el => (this.pnInputStreetAddress = el as HTMLElement)}\n autocomplete=\"off\"\n helpertext={this._streetAddressProps?.streetAddressInputHelpertext}\n ></pn-marketweb-input>\n\n <pn-marketweb-input\n type=\"text\"\n name={this._streetNumberProps?.streetNumberInputName}\n required={this._streetNumberProps?.streetNumberInputRequired}\n value={this.streetNumber}\n placeholder={this._streetNumberProps?.streetNumberInputPlaceholder}\n ref={el => (this.pnInputStreetNumber = el as HTMLElement)}\n autocomplete=\"off\"\n helpertext={this._streetNumberProps?.streetNumberInputHelpertext}\n ></pn-marketweb-input>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
@@ -1,2 +1,2 @@
1
- import{p as e,H as t,b as a}from"./p-06555615.js";export{s as setNonce}from"./p-06555615.js";import{g as n}from"./p-e1255160.js";var o=()=>{{r(t.prototype)}const a=import.meta.url;const n={};if(a!==""){n.resourcesUrl=new URL(".",a).href}return e(n)};var r=e=>{const t=e.cloneNode;e.cloneNode=function(e){if(this.nodeName==="TEMPLATE"){return t.call(this,e)}const a=t.call(this,false);const n=this.childNodes;if(e){for(let e=0;e<n.length;e++){if(n[e].nodeType!==2){a.appendChild(n[e].cloneNode(true))}}}return a}};o().then((async e=>{await n();return a(JSON.parse('[["p-b765e4a9",[[4,"pn-marketweb-siteheader",{"market":[1537],"language":[1537],"siteid":[1],"environment":[1537],"userToken":[1,"user-token"],"userFullname":[1,"user-fullname"],"userLoggedin":[516,"user-loggedin"],"endpoint":[1],"hideSiteSelector":[1540,"hide-site-selector"],"hideHomeMenuItem":[1540,"hide-home-menu-item"],"hideLanguageSelector":[1540,"hide-language-selector"],"hideSearch":[1540,"hide-search"],"hideLogin":[1540,"hide-login"],"showProfileSelection":[1540,"show-profile-selection"],"showUnifiedLogin":[4,"show-unified-login"],"siteDomainInUrls":[4,"site-domain-in-urls"],"AutocompleteEndpoint":[1,"autocomplete-endpoint"],"sessionForward":[4,"session-forward"],"cache":[4],"searchPlaceholder":[1,"search-placeholder"],"spaMode":[4,"spa-mode"],"checkUserLoggedInStateInterval":[2,"check-user-logged-in-state-interval"],"pageId":[1,"page-id"],"i18n":[32],"gotData":[32],"fetchingData":[32],"homePageLink":[32],"menuItems":[32],"siteDefinition":[32],"search":[32],"siteSelector":[32],"languageSelector":[32],"languageOptions":[32],"loginDialog":[32],"minimizeSearch":[32],"loggedIn":[32]},[[0,"setLanguage","onLanguageSelectorChange"],[0,"loginStateChange","onLoginStateChange"],[9,"resize","handleResize"]],{"language":["onLanguageChange"],"market":["onMarketChange"]}]]],["p-63505736",[[0,"pn-proxio-findprice",{"endpoint":[1025],"language":[1025],"market":[1025],"showMedium":[4,"show-medium"],"showInternational":[4,"show-international"],"maxAbroadKg":[2,"max-abroad-kg"],"weightListName":[1,"weight-list-name"],"cache":[4],"filteredItems":[32],"weight":[32],"weightvalue":[32],"countrycodevalue":[32],"sizecategory":[32],"data":[32]},null,{"market":["setState"],"language":["setState"],"sizecategory":["filterItems"],"weightvalue":["filterItems"],"countrycodevalue":["filterItems"]}]]],["p-4372d10e",[[0,"pn-find-price",{"source":[1],"language":[1025],"market":[1025],"filteredItems":[32],"weight":[32],"weightvalue":[32],"sourceData":[32],"sizecategory":[32]},null,{"market":["setState"],"language":["setState"],"sizecategory":["filterItems"],"weightvalue":["filterItems"]}]]],["p-796ebfee",[[0,"pn-find-service-and-price",{"source":[1],"language":[1025],"market":[1025],"filteredItems":[32],"postagetype":[32],"weight":[32],"weightvalue":[32],"deliveryscope":[32],"sourceData":[32]},null,{"market":["setState"],"language":["setState"],"postagetype":["filterItems"],"deliveryscope":["filterItems"],"weightvalue":["filterItems"]}]]],["p-721598b8",[[4,"pn-product-pricelist",{"source":[1],"language":[1025],"market":[1025],"productid":[1],"filteredItems":[32],"sourceData":[32],"gotData":[32],"loading":[32],"postagetype":[32],"weight":[32],"weightvalue":[32]},null,{"market":["setState"],"language":["setState"],"postagetype":["filterItems"],"weightvalue":["filterItems"]}]]],["p-7b05d7c7",[[0,"pn-proxio-pricegroup",{"endpoint":[1025],"language":[1],"market":[1],"tariffid":[1],"cache":[4],"activeWeightIndex":[32],"data":[32],"i18n":[32]},[[0,"activeWeightIndex","setActiveWeightIndex"],[0,"language","setLanguage"]]]]],["p-f0568315",[[0,"pn-product-pricelist-result",{"item":[1040],"description":[16],"shownitems":[16],"showMeasurement":[4,"show-measurement"],"weightText":[32]},null,{"item":["composeItems"]}]]],["p-e5345c69",[[4,"pn-marketweb-sitefooter",{"market":[1537],"language":[1537],"environment":[1537],"endpoint":[1],"siteDomainInUrls":[4,"site-domain-in-urls"],"cache":[4],"theme":[513],"backgroundcolor":[513],"showSwan":[4,"show-swan"],"siteDefinition":[32],"footerContent":[32],"i18n":[32],"gotData":[32],"fetchingData":[32]},null,{"language":["onLanguageChange"],"market":["onMarketChange"]}]]],["p-c5856c0b",[[4,"pn-media-block",{"blockHeight":[1,"block-height"],"imageSrc":[1,"image-src"],"imageSrcSmallScreenFormat":[1,"image-src-small-screen-format"],"imageAltText":[1,"image-alt-text"],"videoSrc":[1,"video-src"],"parallaxScroll":[4,"parallax-scroll"],"showOverlayLayer":[4,"show-overlay-layer"],"customOverlayBackground":[1,"custom-overlay-background"],"animateOverlayBackground":[4,"animate-overlay-background"],"scrollSnapBlock":[4,"scroll-snap-block"],"fixedBackground":[4,"fixed-background"],"blockHeading":[1,"block-heading"],"blockHeadingLevel":[2,"block-heading-level"],"blockPreamble":[1,"block-preamble"],"pnPlayOnScrollObserverOptions":[32],"calculatedBlockHeight":[32],"hasButtonSlot":[32]}]]],["p-5ac23b38",[[0,"pn-multi-row-connected-dropdown",{"dropdownData":[1,"dropdown-data"],"languageCode":[1,"language-code"],"label":[1],"firstDropdownLabel":[1,"first-dropdown-label"],"secondDropdownLabel":[1,"second-dropdown-label"],"dropdownPlaceholder":[1,"dropdown-placeholder"],"addRowText":[1,"add-row-text"],"inputFildLabel":[1,"input-fild-label"],"inputFildPlaceholder":[1,"input-fild-placeholder"],"dateButtonText":[1,"date-button-text"],"datePlaceholder":[1,"date-placeholder"],"dateDaysFromToday":[2,"date-days-from-today"],"allowMultipleRows":[4,"allow-multiple-rows"],"allowMultipleDates":[4,"allow-multiple-dates"],"startDateLabel":[1,"start-date-label"],"endDateLabel":[1,"end-date-label"],"multiDateHelperText":[1,"multi-date-helper-text"],"generateDatesButtonText":[1,"generate-dates-button-text"],"saveDateButtonText":[1,"save-date-button-text"],"noDatesText":[1,"no-dates-text"],"yearsToAddToEndDate":[2,"years-to-add-to-end-date"],"rowCount":[32],"rowData":[32],"formValues":[32]},[[0,"rowValueChange","predefinedValueChange"],[0,"deleteRowEvent","deleteRowEvent"]]]]],["p-781ef432",[[0,"pn-dropdown-with-multi-input-rows",{"dropdownData":[1,"dropdown-data"],"languageCode":[1,"language-code"],"firstDropdownLabel":[1,"first-dropdown-label"],"firstDropdownHelperText":[1,"first-dropdown-helper-text"],"secondDropdownLabel":[1,"second-dropdown-label"],"secondDropdownHelperText":[1,"second-dropdown-helper-text"],"secondDropdownMax":[2,"second-dropdown-max"],"deleteMultipleRowsWarningText":[1,"delete-multiple-rows-warning-text"],"confirmDeleteButtonText":[1,"confirm-delete-button-text"],"abortDeleteButtonText":[1,"abort-delete-button-text"],"fristInputLabel":[1,"frist-input-label"],"fristInputPlaceholder":[1,"frist-input-placeholder"],"firstInputMin":[2,"first-input-min"],"firstInputMax":[2,"first-input-max"],"firstInputWarning":[2,"first-input-warning"],"firstInputWarningText":[1,"first-input-warning-text"],"firstInputLowErrorText":[1,"first-input-low-error-text"],"firstInputHighErrorText":[1,"first-input-high-error-text"],"secondInputLabel":[1,"second-input-label"],"secondInputPlaceholder":[1,"second-input-placeholder"],"secondInputMin":[2,"second-input-min"],"secondInputMax":[2,"second-input-max"],"secondInputWarning":[2,"second-input-warning"],"secondInputWarningText":[1,"second-input-warning-text"],"secondInputLowErrorText":[1,"second-input-low-error-text"],"secondInputHighErrorText":[1,"second-input-high-error-text"],"dateLabel":[1,"date-label"],"datePlaceholder":[1,"date-placeholder"],"dateDaysFromToday":[2,"date-days-from-today"],"yearsToAddToEndDate":[2,"years-to-add-to-end-date"],"sumFieldLabel":[1,"sum-field-label"],"addRowText":[1,"add-row-text"],"elementHelperText":[1,"element-helper-text"],"dropdownDataRoot":[32],"secondDropdownArr":[32],"rowCount":[32],"rowData":[32],"formValues":[32],"firstValidDateString":[32],"lastValidDateString":[32],"rowSum":[32],"minRowCount":[32],"showDelteConfirm":[32]},[[0,"rowValueChange","predefinedValueChange"],[0,"firstInputChange","predefinedValueChange"],[0,"secondInputChange","predefinedValueChange"],[0,"deleteRowEvent","deleteRowEvent"]]]]],["p-acbe60df",[[0,"pn-address-autofill",{"market":[1537],"environment":[1537],"endpoint":[1],"cache":[4],"countryCode":[1,"country-code"],"postalCodeProps":[1,"postal-code-props"],"cityProps":[1,"city-props"],"streetAddressProps":[1,"street-address-props"],"streetNumberProps":[1,"street-number-props"],"streetAdressArr":[32],"streetNumberArr":[32],"city":[32],"postalCode":[32],"streetAddress":[32],"streetNumber":[32],"fullAddress":[32]}]]],["p-e9501c6f",[[4,"pn-dropdown-choice-adds-row",{"dropdownData":[1,"dropdown-data"],"languageCode":[1,"language-code"],"addRowDropdownName":[1,"add-row-dropdown-name"],"addRowDropdownPlaceholder":[1,"add-row-dropdown-placeholder"],"addRowDropdownLabel":[1,"add-row-dropdown-label"],"rowNameLabel":[1,"row-name-label"],"rowHasDropdown":[4,"row-has-dropdown"],"rowDropdownLabel":[1,"row-dropdown-label"],"rowDropdownPlaceholder":[1,"row-dropdown-placeholder"],"rowInputLabel":[1,"row-input-label"],"rowDeleteButtonText":[1,"row-delete-button-text"],"totalInputLimit":[2,"total-input-limit"],"inputLimitWarning":[1,"input-limit-warning"],"nextRowIndex":[32],"rowSelectDropdownArr":[32],"columnCount":[32],"showWarning":[32],"formValue":[32]},null,{"dropdownData":["dropdownDataWatcher"]}]]],["p-391970af",[[0,"pn-multiple-input",{"label":[1],"placeholder":[1],"addRowButtonText":[1,"add-row-button-text"],"rowData":[32]}]]],["p-ebaeee5e",[[0,"pn-parcel-tracker",{"formActionUrl":[1,"form-action-url"],"heading":[1],"buttonLabel":[1,"button-label"],"locale":[1],"placeholder":[1],"inputName":[1,"input-name"],"currentWidth":[32]},[[9,"resize","handleViewportSizeChange"]]]]],["p-95c10b7e",[[0,"pn-pex-pricefinder",{"language":[1],"currency":[1],"apiUrl":[1,"api-url"],"i18n":[32],"fromzip":[32],"tozip":[32],"weight":[32],"when":[32],"response":[32]},[[0,"language","setLanguage"]]]]],["p-40538914",[[0,"pn-share",{"link":[1],"language":[1537],"i18n":[32]},null,{"language":["onLanguageChange"]}]]],["p-34689c97",[[4,"pn-stats-info",{"heading":[1],"dataArray":[1,"data-array"],"backgroundUrl":[1,"background-url"],"myParsedArray":[32]},null,{"dataArray":["parseMyArrayProp"]}]]],["p-68aa55f7",[[4,"pn-animated-tile",{"toggled":[32],"transitionClassName":[32],"animateIcon":[32]},null,{"toggled":["onToggledHandler"]}]]],["p-586a1e3c",[[0,"pn-app-banner",{"appName":[1,"app-name"],"appDescription":[1,"app-description"],"ctaText":[1,"cta-text"],"appleStoreLink":[1,"apple-store-link"],"googleStoreLink":[1,"google-store-link"],"isClosed":[32],"storeLink":[32],"isLocalStorageAvailable":[32]}]]],["p-16f70311",[[4,"pn-bonus-progressbar",{"icon":[1],"heading":[1],"sumtext":[513],"theme":[513],"bonuspercentage":[1],"currency":[513],"value":[1538],"min":[1538],"max":[1538],"valuepercentage":[32],"progresspercentage":[32],"levelValues":[32],"currentLevelAdjustedValue":[32]},null,{"currentLevelAdjustedValue":["setValuePercentage"],"value":["setValuePercentage"],"min":["setValuePercentage"],"max":["setValuePercentage"]}]]],["p-a8220c88",[[0,"pn-bonus-progressbar-level",{"current":[516],"value":[1538],"bonuspercentage":[1537],"visualpercentage":[1538],"percentage":[32],"max":[32],"min":[32],"currency":[32]}]]],["p-56bd346e",[[0,"pn-breakpoints",{"breakPointClass":[1,"break-point-class"],"currentWidth":[32]},[[9,"resize","handleViewportSizeChange"]]]]],["p-1317587f",[[0,"pn-chart",{"labels":[1],"dataSets":[1,"data-sets"],"dataChartType":[8,"data-chart-type"],"myChartCtxRef":[32]},null,{"dataSets":["dataChangeHandler"],"labels":["labelsChangeHandler"]}]]],["p-190c671b",[[4,"pn-charts-card",{"header":[1],"highlight":[1],"preamble":[1],"label":[1],"source":[1],"sourceUrl":[1,"source-url"],"ctaLinkText":[1,"cta-link-text"],"openInNewWindow":[4,"open-in-new-window"]}]]],["p-69a56d5c",[[4,"pn-cta-block",{"heading":[1],"bodyText":[1,"body-text"],"pnBackgroundColor":[1,"pn-background-color"],"isLarge":[4,"is-large"],"isCentered":[4,"is-centered"],"isSmall":[4,"is-small"],"contentTop":[4,"content-top"]}]]],["p-95e054fd",[[4,"pn-customernumber-selector",{"language":[1537],"open":[1540],"heading":[1],"description":[1],"i18n":[32]}]]],["p-09b9cc06",[[4,"pn-customernumber-selector-option",{"heading":[1],"description":[1],"url":[1]}]]],["p-d8a57eba",[[0,"pn-date-and-time",{"languageCode":[1,"language-code"],"dateAndTimeLabel":[1,"date-and-time-label"],"dateDaysFromToday":[2,"date-days-from-today"],"validTimeRangeMinutes":[2,"valid-time-range-minutes"],"errorMessage":[1,"error-message"],"dateHelperText":[1,"date-helper-text"],"timeHelperText":[1,"time-helper-text"],"disableWeekends":[4,"disable-weekends"],"datePlacehodler":[1,"date-placehodler"],"language":[32],"hourArr":[32],"minuteArr":[32],"formValue":[32],"invalidTimespan":[32],"selectedDate":[32],"selectedFromHour":[32],"selectedFromMin":[32],"selectedToHour":[32],"selectedToMin":[32],"firstValidDateString":[32],"lastValidDateString":[32]}]]],["p-fbe70284",[[4,"pn-hero-block-international",{"heading":[1],"subHeading":[1,"sub-heading"],"preamble":[1],"animateLogo":[4,"animate-logo"],"showSideLoader":[4,"show-side-loader"],"centeredLayout":[4,"centered-layout"]}]]],["p-e42f0fbe",[[0,"pn-line-shape"]]],["p-ade7ffcf",[[4,"pn-link-list",{"heading":[1],"label":[1],"preamble":[1],"url":[1],"showMoreLabel":[1,"show-more-label"],"showMoreUrl":[1,"show-more-url"]}]]],["p-c25acf85",[[0,"pn-marketweb-icon",{"symbol":[1],"small":[4],"color":[1]}]]],["p-2044eddc",[[1,"pn-marketweb-search",{"disabled":[4],"placeholder":[1],"inputid":[1],"name":[1],"autocomplete":[1],"list":[1],"value":[1],"label":[1],"loading":[4],"button":[1],"light":[4],"suggestionObserver":[32],"hasClonedInput":[32],"listSuggestion":[32]},[[0,"input","inputHandler"]]]]],["p-c0fd8e61",[[4,"pn-product-tile"]]],["p-90ba1d8e",[[4,"pn-profile-modal",{"heading":[1],"continueCtaText":[1,"continue-cta-text"],"choosenCompanyText":[1,"choosen-company-text"],"toText":[1,"to-text"],"chooseCustomerNumberText":[1,"choose-customer-number-text"],"isLoading":[32]},[[0,"urlSelected","onUrlSelected"]]]]],["p-c9f21ea3",[[4,"pn-profile-modal-customernumber",{"url":[513],"customernumber":[513],"selected":[516]}]]],["p-f62879f6",[[4,"pn-profile-modal-profile",{"heading":[513],"description":[513],"url":[513],"selected":[1028],"showCustomerNumbers":[516,"show-customer-numbers"],"pleaseSelectText":[513,"please-select-text"],"visible":[1540],"identifier":[32]}]]],["p-931d3a9b",[[4,"pn-profile-modal-type",{"typeid":[513],"name":[1025],"selected":[1028],"selectedprofile":[1025]},null,{"selected":["onSelectedChange"]}]]],["p-74203d3e",[[4,"pn-profile-selector",{"language":[1537],"returnUrl":[1,"return-url"],"heading":[1],"i18n":[32],"isLoading":[32],"numberOfProfiles":[32]}]]],["p-f2d0d0cc",[[0,"pn-profile-selector-option",{"heading":[1],"description":[1],"url":[1]}]]],["p-5a467ca6",[[4,"pn-quick-cta",{"heading":[1],"preamble":[1]}]]],["p-e4c7aaec",[[4,"pn-quote-card",{"quote":[1],"name":[1],"occupation":[1]}]]],["p-67d862ac",[[4,"pn-sidenav",{"language":[1],"navLabel":[1,"nav-label"],"i18n":[32]},[[0,"language","setLanguage"],[0,"openSubMenuLevelChange","onOpenSubMenuLevelChange"]]]]],["p-1535a09f",[[4,"pn-sidenav-level",{"level":[32],"levelId":[32],"isOpen":[32],"parentName":[32],"parentHref":[32],"parentLinkId":[32],"alignment":[32]},null,{"isOpen":["onOpen"]}]]],["p-6e9875e5",[[4,"pn-sidenav-link",{"name":[1],"href":[1],"target":[1],"linkid":[1],"icon":[1],"current":[4],"levelId":[32],"open":[32],"hasChildren":[32]}]]],["p-7021985c",[[4,"pn-sidenav-togglebutton",{"label":[1],"i18n":[32]}]]],["p-0a522476",[[4,"pn-spotlight",{"heading":[1],"preamble":[1],"isDynamic":[4,"is-dynamic"],"addDynamic":[32]}]]],["p-73db2c9c",[[4,"pn-teaser-card",{"text":[1],"heading":[1],"label":[1],"dataCardColor":[513,"data-card-color"],"dataCardAlignment":[513,"data-card-alignment"],"hasCtaSlotContent":[32],"hasIllustrationSlot":[32]}]]],["p-69ee0033",[[4,"pn-usp-promoter",{"heading":[1],"headingExtension":[1,"heading-extension"],"bodyText":[1,"body-text"],"backgroundGradient":[1,"background-gradient"],"fullWidth":[4,"full-width"],"rightAlign":[4,"right-align"],"hideMobileImage":[4,"hide-mobile-image"]}]]],["p-9776a1c5",[[0,"pn-proxio-findprice-result",{"item":[1040],"activeweight":[1026],"shownitems":[16],"Usp1":[1,"usp-1"],"Usp2":[1,"usp-2"],"Usp3":[1,"usp-3"],"description":[16],"showMeasurement":[4,"show-measurement"],"showInternational":[4,"show-international"],"selectedCountrycode":[1,"selected-countrycode"],"market":[1],"language":[1025],"weightText":[32],"linkId":[32],"shopLabel":[32],"shopUrl":[32],"shopId":[32],"i18n":[32]},null,{"item":["composeItems"],"activeweight":["getPriceString","getProductLink"]}]]],["p-2f779414",[[0,"pn-find-service-and-price-result",{"item":[1040],"shownitems":[16],"weightText":[32]},null,{"item":["composeItems"]}]]],["p-85d57c9d",[[0,"pn-multi-row-connected-dropdown-row",{"dropdownData":[1,"dropdown-data"],"languageCode":[1,"language-code"],"label":[1],"firstDropdownLabel":[1,"first-dropdown-label"],"secondDropdownLabel":[1,"second-dropdown-label"],"dropdownPlaceholder":[1,"dropdown-placeholder"],"addRowText":[1,"add-row-text"],"inputFildLabel":[1,"input-fild-label"],"inputFildPlaceholder":[1,"input-fild-placeholder"],"dateButtonText":[1,"date-button-text"],"datePlaceholder":[1,"date-placeholder"],"dateDaysFromToday":[2,"date-days-from-today"],"allowMultipleDates":[4,"allow-multiple-dates"],"startDateLabel":[1,"start-date-label"],"endDateLabel":[1,"end-date-label"],"multiDateHelperText":[1,"multi-date-helper-text"],"generateDatesButtonText":[1,"generate-dates-button-text"],"saveDateButtonText":[1,"save-date-button-text"],"noDatesText":[1,"no-dates-text"],"index":[2],"predefinedValue":[1,"predefined-value"],"yearsToAddToEndDate":[2,"years-to-add-to-end-date"],"buttonsArray":[32],"firstDropdownArr":[32],"secondDropdownArr":[32],"firstDropdownClass":[32],"secondDropdownClass":[32],"firstValidDateString":[32],"lastValidDateString":[32],"firstDropdownPlaceholder":[32],"secondDropdownPlaceholder":[32],"starDateValue":[32],"endDateValue":[32],"generatedDatesArr":[32],"selectedButtonValue":[32],"inputFieldValue":[32],"dateValue":[32],"daysArr":[32]},null,{"predefinedValue":["applyPredefinedValue"]}]]],["p-c696bedf",[[0,"pn-play-on-scroll",{"videoSrc":[1,"video-src"],"observerOptions":[16],"showOverlay":[4,"show-overlay"],"videoId":[32],"isManuallyPaused":[32],"isPaused":[32]}]]],["p-d40ff187",[[0,"pn-dropdown-with-multi-input-rows-row",{"languageCode":[1,"language-code"],"fristInputPlaceholder":[1,"frist-input-placeholder"],"firstInputMin":[2,"first-input-min"],"firstInputMax":[2,"first-input-max"],"firstInputWarning":[2,"first-input-warning"],"firstInputWarningText":[1,"first-input-warning-text"],"firstInputLowErrorText":[1,"first-input-low-error-text"],"firstInputHighErrorText":[1,"first-input-high-error-text"],"secondInputPlaceholder":[1,"second-input-placeholder"],"secondInputMin":[2,"second-input-min"],"secondInputMax":[2,"second-input-max"],"secondInputWarning":[2,"second-input-warning"],"secondInputWarningText":[1,"second-input-warning-text"],"secondInputLowErrorText":[1,"second-input-low-error-text"],"secondInputHighErrorText":[1,"second-input-high-error-text"],"dateLabel":[1,"date-label"],"datePlaceholder":[1,"date-placeholder"],"firstValidDate":[1,"first-valid-date"],"lastValidDate":[1,"last-valid-date"],"predefinedValue":[1,"predefined-value"],"rowIndex":[2,"row-index"],"minRowCount":[2,"min-row-count"],"showFirstInputWarning":[32],"showFirstInputLowError":[32],"showFirstInputHighError":[32],"showSecondInputWarning":[32],"showSecondInputLowError":[32],"showSecondInputHighError":[32],"firstInputValue":[32],"secondInputValue":[32],"dateValue":[32]},null,{"predefinedValue":["applyPredefinedValue"]}]]],["p-81b3e038",[[4,"pn-share-item",{"link":[1],"text":[1]}]]],["p-1bd5fa26",[[0,"pn-stats-info-data",{"format":[1],"formatStyle":[1,"format-style"],"startValue":[2,"start-value"],"data":[2],"unit":[1],"preamble":[1],"duration":[2],"index":[2],"hasBeenShown":[32],"compId":[32]},null,{"hasBeenShown":["watchStateHandlder"]}]]],["p-7b598d81",[[0,"pn-find-price-result",{"item":[1040],"shownitems":[16],"Usp1":[1,"usp-1"],"Usp2":[1,"usp-2"],"Usp3":[1,"usp-3"],"description":[16],"showMeasurement":[4,"show-measurement"],"weightText":[32],"linkId":[32],"shopLabel":[32],"shopUrl":[32],"shopId":[32]},null,{"item":["composeItems"]}]]],["p-370829c6",[[1,"pn-filter-checkbox",{"value":[520],"name":[1],"checkboxid":[1],"disabled":[4],"checked":[4],"indeterminate":[1028]},[[0,"change","handlechange"]]]]],["p-c224d7c4",[[4,"pn-mainnav-link",{"name":[1],"href":[1],"target":[1],"linkid":[1],"levelId":[32],"open":[32],"hasChildren":[32]}]]],["p-78fbc88c",[[4,"pn-site-footer",{"url":[1],"linktitle":[1],"theme":[513]}],[4,"pn-site-footer-col",{"theme":[513]}],[0,"pn-swan",{"licenseNumber":[1,"license-number"],"language":[1537],"linkTo":[1,"link-to"],"i18n":[32]},null,{"language":["onLanguageChange"]}]]],["p-9be27d72",[[4,"pn-choice-button",{"value":[520],"name":[1],"choiceid":[1],"type":[1],"disabled":[4],"checked":[4],"indeterminate":[1028]},[[0,"change","handlechange"]]]]],["p-1217d60f",[[0,"pn-product-tile-info",{"label":[1],"text":[1],"icon":[1]}],[0,"pn-product-tile-price",{"label":[1],"amount":[1],"currency":[1],"url":[1]}]]],["p-828449da",[[4,"pn-scroll",{"observerOptions":[16],"behaviourClasses":[1,"behaviour-classes"],"transitionDurationSeconds":[2,"transition-duration-seconds"],"shouldLoop":[4,"should-loop"],"intersectFunc":[16],"notIntersectFunc":[16],"compId":[32]}],[0,"pn-video-overlay",{"language":[1],"isPaused":[4,"is-paused"],"showOverlay":[4,"show-overlay"],"i18n":[32]},null,{"language":["onLanguageChange"]}]]],["p-b2dcce7c",[[0,"pn-marketweb-siteheader-login-linklist",{"heading":[1],"links":[16],"idNamespace":[1,"id-namespace"],"showUnifiedLogin":[4,"show-unified-login"]}]]],["p-1578e02e",[[4,"pn-titletag",{"icon":[1],"color":[1537]}]]],["p-9998c29d",[[0,"pn-marketweb-input",{"disabled":[4],"error":[1],"invalid":[4],"helpertext":[1],"label":[1],"placeholder":[1],"inputid":[1],"name":[1],"required":[4],"type":[1025],"autocomplete":[1],"valid":[4],"value":[1],"maxlength":[1],"min":[1],"max":[1],"step":[1],"pattern":[1],"showText":[32]}]]],["p-9a7abcee",[[0,"pn-marketweb-siteheader-unified-login",{"loggedIn":[4,"logged-in"],"myPageLabel":[1,"my-page-label"],"myPageUrl":[1,"my-page-url"],"logInLabel":[1,"log-in-label"]}],[0,"pn-marketweb-siteheader-login-links",{"loginDialog":[1040],"idNamespace":[1,"id-namespace"],"loggedin":[516],"username":[1],"showUnifiedLogin":[4,"show-unified-login"]},null,{"loginDialog":["init"]}],[0,"pn-marketweb-siteheader-login-profileselection",{"loginDialog":[1040],"endpoint":[1],"loggedin":[4],"idNamespace":[1,"id-namespace"],"heading":[1],"i18n":[16],"currentProfile":[1040],"profileoptions":[1040],"user":[32],"logoutLink":[32],"userName":[32],"userEmail":[32]}],[0,"pn-marketweb-siteheader-login-button",{"label":[1]}],[0,"pn-marketweb-siteheader-login-mypage-button",{"label":[1],"myPageUrl":[1,"my-page-url"]}]]],["p-4ea1409d",[[0,"pn-marketweb-siteheader-login",{"endpoint":[1],"token":[1],"i18n":[16],"siteUrl":[1,"site-url"],"emitEvents":[4,"emit-events"],"loginDialog":[1040],"fullname":[1],"loggedin":[4],"showProfileSelection":[1028,"show-profile-selection"],"showUnifiedLogin":[4,"show-unified-login"],"checkUserLoggedInStateInterval":[2,"check-user-logged-in-state-interval"],"environment":[1],"loginLinks":[32],"toggleButtonText":[32],"username":[32]},null,{"i18n":["init"],"loginDialog":["init"]}],[4,"pn-mainnav-level",{"label":[1537],"level":[32],"levelId":[32],"isOpen":[32],"parentName":[32],"parentHref":[32],"parentLinkId":[32],"listCount":[32],"alignment":[32]},null,{"label":["setState"],"isOpen":["onOpen"]}],[4,"pn-language-selector",{"value":[1537],"selectedLanguageName":[32],"options":[32],"i18n":[32]},null,{"value":["setSelectedLanguageName","setTranslations","onValueChange"]}],[0,"pn-language-selector-option",{"name":[1],"code":[1],"url":[1],"selected":[4],"currentLanguage":[1,"current-language"]}],[4,"pn-mainnav",{"market":[1],"language":[1],"navigationId":[1,"navigation-id"],"openMenu":[1028,"open-menu"],"navLabel":[1,"nav-label"]},[[0,"language","setLanguage"],[0,"market","setMarket"],[0,"menuLanguageChange","onLanguageChange"],[0,"setmenuopenstate","setMenuOpenState"],[0,"openMenuLevelChange","onOpenMenuLevelChange"]]],[4,"pn-mainnav-list",{"heading":[1],"linkCount":[32]}],[0,"pn-marketweb-siteheader-search",{"i18n":[8,"i-1-8n"],"showOnlyLink":[1028,"show-only-link"],"hideSearch":[1028,"hide-search"],"language":[1537],"siteid":[1],"search":[1040],"primary":[4],"icononly":[4],"autoCompleteOptions":[32]}],[4,"pn-site-selector",{"buttontext":[1537],"heading":[1537],"language":[1537],"i18n":[32]}],[0,"pn-site-selector-item",{"url":[1],"heading":[1],"description":[1],"newwindow":[4]}]]],["p-75a09bb2",[[4,"pn-proxio-productcard"],[0,"pn-proxio-productcard-description",{"heading":[1],"highlight":[1],"description":[1],"list":[1040]}],[0,"pn-proxio-productcard-information",{"label":[1],"information":[16]}],[0,"pn-proxio-productcard-pricelink",{"price":[1],"vatText":[1,"vat-text"],"link":[1],"linktext":[1]}]]],["p-609da67c",[[0,"pn-product-card-info",{"rulle":[1],"paket":[1],"label":[1],"text":[1]}],[0,"pn-product-card-price",{"label":[1],"amount":[1],"currency":[1],"note":[1],"url":[1],"service":[1],"linkid":[1]}],[4,"pn-product-card"]]]]'),e)}));
1
+ import{p as e,H as t,b as a}from"./p-06555615.js";export{s as setNonce}from"./p-06555615.js";import{g as n}from"./p-e1255160.js";var o=()=>{{r(t.prototype)}const a=import.meta.url;const n={};if(a!==""){n.resourcesUrl=new URL(".",a).href}return e(n)};var r=e=>{const t=e.cloneNode;e.cloneNode=function(e){if(this.nodeName==="TEMPLATE"){return t.call(this,e)}const a=t.call(this,false);const n=this.childNodes;if(e){for(let e=0;e<n.length;e++){if(n[e].nodeType!==2){a.appendChild(n[e].cloneNode(true))}}}return a}};o().then((async e=>{await n();return a(JSON.parse('[["p-b765e4a9",[[4,"pn-marketweb-siteheader",{"market":[1537],"language":[1537],"siteid":[1],"environment":[1537],"userToken":[1,"user-token"],"userFullname":[1,"user-fullname"],"userLoggedin":[516,"user-loggedin"],"endpoint":[1],"hideSiteSelector":[1540,"hide-site-selector"],"hideHomeMenuItem":[1540,"hide-home-menu-item"],"hideLanguageSelector":[1540,"hide-language-selector"],"hideSearch":[1540,"hide-search"],"hideLogin":[1540,"hide-login"],"showProfileSelection":[1540,"show-profile-selection"],"showUnifiedLogin":[4,"show-unified-login"],"siteDomainInUrls":[4,"site-domain-in-urls"],"AutocompleteEndpoint":[1,"autocomplete-endpoint"],"sessionForward":[4,"session-forward"],"cache":[4],"searchPlaceholder":[1,"search-placeholder"],"spaMode":[4,"spa-mode"],"checkUserLoggedInStateInterval":[2,"check-user-logged-in-state-interval"],"pageId":[1,"page-id"],"i18n":[32],"gotData":[32],"fetchingData":[32],"homePageLink":[32],"menuItems":[32],"siteDefinition":[32],"search":[32],"siteSelector":[32],"languageSelector":[32],"languageOptions":[32],"loginDialog":[32],"minimizeSearch":[32],"loggedIn":[32]},[[0,"setLanguage","onLanguageSelectorChange"],[0,"loginStateChange","onLoginStateChange"],[9,"resize","handleResize"]],{"language":["onLanguageChange"],"market":["onMarketChange"]}]]],["p-63505736",[[0,"pn-proxio-findprice",{"endpoint":[1025],"language":[1025],"market":[1025],"showMedium":[4,"show-medium"],"showInternational":[4,"show-international"],"maxAbroadKg":[2,"max-abroad-kg"],"weightListName":[1,"weight-list-name"],"cache":[4],"filteredItems":[32],"weight":[32],"weightvalue":[32],"countrycodevalue":[32],"sizecategory":[32],"data":[32]},null,{"market":["setState"],"language":["setState"],"sizecategory":["filterItems"],"weightvalue":["filterItems"],"countrycodevalue":["filterItems"]}]]],["p-4372d10e",[[0,"pn-find-price",{"source":[1],"language":[1025],"market":[1025],"filteredItems":[32],"weight":[32],"weightvalue":[32],"sourceData":[32],"sizecategory":[32]},null,{"market":["setState"],"language":["setState"],"sizecategory":["filterItems"],"weightvalue":["filterItems"]}]]],["p-796ebfee",[[0,"pn-find-service-and-price",{"source":[1],"language":[1025],"market":[1025],"filteredItems":[32],"postagetype":[32],"weight":[32],"weightvalue":[32],"deliveryscope":[32],"sourceData":[32]},null,{"market":["setState"],"language":["setState"],"postagetype":["filterItems"],"deliveryscope":["filterItems"],"weightvalue":["filterItems"]}]]],["p-721598b8",[[4,"pn-product-pricelist",{"source":[1],"language":[1025],"market":[1025],"productid":[1],"filteredItems":[32],"sourceData":[32],"gotData":[32],"loading":[32],"postagetype":[32],"weight":[32],"weightvalue":[32]},null,{"market":["setState"],"language":["setState"],"postagetype":["filterItems"],"weightvalue":["filterItems"]}]]],["p-7b05d7c7",[[0,"pn-proxio-pricegroup",{"endpoint":[1025],"language":[1],"market":[1],"tariffid":[1],"cache":[4],"activeWeightIndex":[32],"data":[32],"i18n":[32]},[[0,"activeWeightIndex","setActiveWeightIndex"],[0,"language","setLanguage"]]]]],["p-f0568315",[[0,"pn-product-pricelist-result",{"item":[1040],"description":[16],"shownitems":[16],"showMeasurement":[4,"show-measurement"],"weightText":[32]},null,{"item":["composeItems"]}]]],["p-e5345c69",[[4,"pn-marketweb-sitefooter",{"market":[1537],"language":[1537],"environment":[1537],"endpoint":[1],"siteDomainInUrls":[4,"site-domain-in-urls"],"cache":[4],"theme":[513],"backgroundcolor":[513],"showSwan":[4,"show-swan"],"siteDefinition":[32],"footerContent":[32],"i18n":[32],"gotData":[32],"fetchingData":[32]},null,{"language":["onLanguageChange"],"market":["onMarketChange"]}]]],["p-42c9386d",[[4,"pn-media-block",{"blockHeight":[1,"block-height"],"imageSrc":[1,"image-src"],"imageSrcSmallScreenFormat":[1,"image-src-small-screen-format"],"imageAltText":[1,"image-alt-text"],"videoSrc":[1,"video-src"],"parallaxScroll":[4,"parallax-scroll"],"showOverlayLayer":[4,"show-overlay-layer"],"customOverlayBackground":[1,"custom-overlay-background"],"animateOverlayBackground":[4,"animate-overlay-background"],"scrollSnapBlock":[4,"scroll-snap-block"],"fixedBackground":[4,"fixed-background"],"blockHeading":[1,"block-heading"],"blockHeadingLevel":[2,"block-heading-level"],"blockPreamble":[1,"block-preamble"],"pnPlayOnScrollObserverOptions":[32],"calculatedBlockHeight":[32],"hasButtonSlot":[32]}]]],["p-5ac23b38",[[0,"pn-multi-row-connected-dropdown",{"dropdownData":[1,"dropdown-data"],"languageCode":[1,"language-code"],"label":[1],"firstDropdownLabel":[1,"first-dropdown-label"],"secondDropdownLabel":[1,"second-dropdown-label"],"dropdownPlaceholder":[1,"dropdown-placeholder"],"addRowText":[1,"add-row-text"],"inputFildLabel":[1,"input-fild-label"],"inputFildPlaceholder":[1,"input-fild-placeholder"],"dateButtonText":[1,"date-button-text"],"datePlaceholder":[1,"date-placeholder"],"dateDaysFromToday":[2,"date-days-from-today"],"allowMultipleRows":[4,"allow-multiple-rows"],"allowMultipleDates":[4,"allow-multiple-dates"],"startDateLabel":[1,"start-date-label"],"endDateLabel":[1,"end-date-label"],"multiDateHelperText":[1,"multi-date-helper-text"],"generateDatesButtonText":[1,"generate-dates-button-text"],"saveDateButtonText":[1,"save-date-button-text"],"noDatesText":[1,"no-dates-text"],"yearsToAddToEndDate":[2,"years-to-add-to-end-date"],"rowCount":[32],"rowData":[32],"formValues":[32]},[[0,"rowValueChange","predefinedValueChange"],[0,"deleteRowEvent","deleteRowEvent"]]]]],["p-781ef432",[[0,"pn-dropdown-with-multi-input-rows",{"dropdownData":[1,"dropdown-data"],"languageCode":[1,"language-code"],"firstDropdownLabel":[1,"first-dropdown-label"],"firstDropdownHelperText":[1,"first-dropdown-helper-text"],"secondDropdownLabel":[1,"second-dropdown-label"],"secondDropdownHelperText":[1,"second-dropdown-helper-text"],"secondDropdownMax":[2,"second-dropdown-max"],"deleteMultipleRowsWarningText":[1,"delete-multiple-rows-warning-text"],"confirmDeleteButtonText":[1,"confirm-delete-button-text"],"abortDeleteButtonText":[1,"abort-delete-button-text"],"fristInputLabel":[1,"frist-input-label"],"fristInputPlaceholder":[1,"frist-input-placeholder"],"firstInputMin":[2,"first-input-min"],"firstInputMax":[2,"first-input-max"],"firstInputWarning":[2,"first-input-warning"],"firstInputWarningText":[1,"first-input-warning-text"],"firstInputLowErrorText":[1,"first-input-low-error-text"],"firstInputHighErrorText":[1,"first-input-high-error-text"],"secondInputLabel":[1,"second-input-label"],"secondInputPlaceholder":[1,"second-input-placeholder"],"secondInputMin":[2,"second-input-min"],"secondInputMax":[2,"second-input-max"],"secondInputWarning":[2,"second-input-warning"],"secondInputWarningText":[1,"second-input-warning-text"],"secondInputLowErrorText":[1,"second-input-low-error-text"],"secondInputHighErrorText":[1,"second-input-high-error-text"],"dateLabel":[1,"date-label"],"datePlaceholder":[1,"date-placeholder"],"dateDaysFromToday":[2,"date-days-from-today"],"yearsToAddToEndDate":[2,"years-to-add-to-end-date"],"sumFieldLabel":[1,"sum-field-label"],"addRowText":[1,"add-row-text"],"elementHelperText":[1,"element-helper-text"],"dropdownDataRoot":[32],"secondDropdownArr":[32],"rowCount":[32],"rowData":[32],"formValues":[32],"firstValidDateString":[32],"lastValidDateString":[32],"rowSum":[32],"minRowCount":[32],"showDelteConfirm":[32]},[[0,"rowValueChange","predefinedValueChange"],[0,"firstInputChange","predefinedValueChange"],[0,"secondInputChange","predefinedValueChange"],[0,"deleteRowEvent","deleteRowEvent"]]]]],["p-d5a4ada5",[[0,"pn-address-autofill",{"market":[1537],"environment":[1537],"endpoint":[1],"cache":[4],"countryCode":[1,"country-code"],"postalCodeProps":[1,"postal-code-props"],"cityProps":[1,"city-props"],"streetAddressProps":[1,"street-address-props"],"streetNumberProps":[1,"street-number-props"],"streetAdressArr":[32],"streetNumberArr":[32],"city":[32],"postalCode":[32],"streetAddress":[32],"streetNumber":[32],"fullAddress":[32]}]]],["p-e9501c6f",[[4,"pn-dropdown-choice-adds-row",{"dropdownData":[1,"dropdown-data"],"languageCode":[1,"language-code"],"addRowDropdownName":[1,"add-row-dropdown-name"],"addRowDropdownPlaceholder":[1,"add-row-dropdown-placeholder"],"addRowDropdownLabel":[1,"add-row-dropdown-label"],"rowNameLabel":[1,"row-name-label"],"rowHasDropdown":[4,"row-has-dropdown"],"rowDropdownLabel":[1,"row-dropdown-label"],"rowDropdownPlaceholder":[1,"row-dropdown-placeholder"],"rowInputLabel":[1,"row-input-label"],"rowDeleteButtonText":[1,"row-delete-button-text"],"totalInputLimit":[2,"total-input-limit"],"inputLimitWarning":[1,"input-limit-warning"],"nextRowIndex":[32],"rowSelectDropdownArr":[32],"columnCount":[32],"showWarning":[32],"formValue":[32]},null,{"dropdownData":["dropdownDataWatcher"]}]]],["p-391970af",[[0,"pn-multiple-input",{"label":[1],"placeholder":[1],"addRowButtonText":[1,"add-row-button-text"],"rowData":[32]}]]],["p-ebaeee5e",[[0,"pn-parcel-tracker",{"formActionUrl":[1,"form-action-url"],"heading":[1],"buttonLabel":[1,"button-label"],"locale":[1],"placeholder":[1],"inputName":[1,"input-name"],"currentWidth":[32]},[[9,"resize","handleViewportSizeChange"]]]]],["p-95c10b7e",[[0,"pn-pex-pricefinder",{"language":[1],"currency":[1],"apiUrl":[1,"api-url"],"i18n":[32],"fromzip":[32],"tozip":[32],"weight":[32],"when":[32],"response":[32]},[[0,"language","setLanguage"]]]]],["p-40538914",[[0,"pn-share",{"link":[1],"language":[1537],"i18n":[32]},null,{"language":["onLanguageChange"]}]]],["p-34689c97",[[4,"pn-stats-info",{"heading":[1],"dataArray":[1,"data-array"],"backgroundUrl":[1,"background-url"],"myParsedArray":[32]},null,{"dataArray":["parseMyArrayProp"]}]]],["p-68aa55f7",[[4,"pn-animated-tile",{"toggled":[32],"transitionClassName":[32],"animateIcon":[32]},null,{"toggled":["onToggledHandler"]}]]],["p-586a1e3c",[[0,"pn-app-banner",{"appName":[1,"app-name"],"appDescription":[1,"app-description"],"ctaText":[1,"cta-text"],"appleStoreLink":[1,"apple-store-link"],"googleStoreLink":[1,"google-store-link"],"isClosed":[32],"storeLink":[32],"isLocalStorageAvailable":[32]}]]],["p-16f70311",[[4,"pn-bonus-progressbar",{"icon":[1],"heading":[1],"sumtext":[513],"theme":[513],"bonuspercentage":[1],"currency":[513],"value":[1538],"min":[1538],"max":[1538],"valuepercentage":[32],"progresspercentage":[32],"levelValues":[32],"currentLevelAdjustedValue":[32]},null,{"currentLevelAdjustedValue":["setValuePercentage"],"value":["setValuePercentage"],"min":["setValuePercentage"],"max":["setValuePercentage"]}]]],["p-a8220c88",[[0,"pn-bonus-progressbar-level",{"current":[516],"value":[1538],"bonuspercentage":[1537],"visualpercentage":[1538],"percentage":[32],"max":[32],"min":[32],"currency":[32]}]]],["p-56bd346e",[[0,"pn-breakpoints",{"breakPointClass":[1,"break-point-class"],"currentWidth":[32]},[[9,"resize","handleViewportSizeChange"]]]]],["p-1317587f",[[0,"pn-chart",{"labels":[1],"dataSets":[1,"data-sets"],"dataChartType":[8,"data-chart-type"],"myChartCtxRef":[32]},null,{"dataSets":["dataChangeHandler"],"labels":["labelsChangeHandler"]}]]],["p-190c671b",[[4,"pn-charts-card",{"header":[1],"highlight":[1],"preamble":[1],"label":[1],"source":[1],"sourceUrl":[1,"source-url"],"ctaLinkText":[1,"cta-link-text"],"openInNewWindow":[4,"open-in-new-window"]}]]],["p-69a56d5c",[[4,"pn-cta-block",{"heading":[1],"bodyText":[1,"body-text"],"pnBackgroundColor":[1,"pn-background-color"],"isLarge":[4,"is-large"],"isCentered":[4,"is-centered"],"isSmall":[4,"is-small"],"contentTop":[4,"content-top"]}]]],["p-95e054fd",[[4,"pn-customernumber-selector",{"language":[1537],"open":[1540],"heading":[1],"description":[1],"i18n":[32]}]]],["p-09b9cc06",[[4,"pn-customernumber-selector-option",{"heading":[1],"description":[1],"url":[1]}]]],["p-d8a57eba",[[0,"pn-date-and-time",{"languageCode":[1,"language-code"],"dateAndTimeLabel":[1,"date-and-time-label"],"dateDaysFromToday":[2,"date-days-from-today"],"validTimeRangeMinutes":[2,"valid-time-range-minutes"],"errorMessage":[1,"error-message"],"dateHelperText":[1,"date-helper-text"],"timeHelperText":[1,"time-helper-text"],"disableWeekends":[4,"disable-weekends"],"datePlacehodler":[1,"date-placehodler"],"language":[32],"hourArr":[32],"minuteArr":[32],"formValue":[32],"invalidTimespan":[32],"selectedDate":[32],"selectedFromHour":[32],"selectedFromMin":[32],"selectedToHour":[32],"selectedToMin":[32],"firstValidDateString":[32],"lastValidDateString":[32]}]]],["p-fbe70284",[[4,"pn-hero-block-international",{"heading":[1],"subHeading":[1,"sub-heading"],"preamble":[1],"animateLogo":[4,"animate-logo"],"showSideLoader":[4,"show-side-loader"],"centeredLayout":[4,"centered-layout"]}]]],["p-e42f0fbe",[[0,"pn-line-shape"]]],["p-ade7ffcf",[[4,"pn-link-list",{"heading":[1],"label":[1],"preamble":[1],"url":[1],"showMoreLabel":[1,"show-more-label"],"showMoreUrl":[1,"show-more-url"]}]]],["p-c25acf85",[[0,"pn-marketweb-icon",{"symbol":[1],"small":[4],"color":[1]}]]],["p-2044eddc",[[1,"pn-marketweb-search",{"disabled":[4],"placeholder":[1],"inputid":[1],"name":[1],"autocomplete":[1],"list":[1],"value":[1],"label":[1],"loading":[4],"button":[1],"light":[4],"suggestionObserver":[32],"hasClonedInput":[32],"listSuggestion":[32]},[[0,"input","inputHandler"]]]]],["p-c0fd8e61",[[4,"pn-product-tile"]]],["p-90ba1d8e",[[4,"pn-profile-modal",{"heading":[1],"continueCtaText":[1,"continue-cta-text"],"choosenCompanyText":[1,"choosen-company-text"],"toText":[1,"to-text"],"chooseCustomerNumberText":[1,"choose-customer-number-text"],"isLoading":[32]},[[0,"urlSelected","onUrlSelected"]]]]],["p-c9f21ea3",[[4,"pn-profile-modal-customernumber",{"url":[513],"customernumber":[513],"selected":[516]}]]],["p-f62879f6",[[4,"pn-profile-modal-profile",{"heading":[513],"description":[513],"url":[513],"selected":[1028],"showCustomerNumbers":[516,"show-customer-numbers"],"pleaseSelectText":[513,"please-select-text"],"visible":[1540],"identifier":[32]}]]],["p-931d3a9b",[[4,"pn-profile-modal-type",{"typeid":[513],"name":[1025],"selected":[1028],"selectedprofile":[1025]},null,{"selected":["onSelectedChange"]}]]],["p-74203d3e",[[4,"pn-profile-selector",{"language":[1537],"returnUrl":[1,"return-url"],"heading":[1],"i18n":[32],"isLoading":[32],"numberOfProfiles":[32]}]]],["p-f2d0d0cc",[[0,"pn-profile-selector-option",{"heading":[1],"description":[1],"url":[1]}]]],["p-5a467ca6",[[4,"pn-quick-cta",{"heading":[1],"preamble":[1]}]]],["p-e4c7aaec",[[4,"pn-quote-card",{"quote":[1],"name":[1],"occupation":[1]}]]],["p-67d862ac",[[4,"pn-sidenav",{"language":[1],"navLabel":[1,"nav-label"],"i18n":[32]},[[0,"language","setLanguage"],[0,"openSubMenuLevelChange","onOpenSubMenuLevelChange"]]]]],["p-1535a09f",[[4,"pn-sidenav-level",{"level":[32],"levelId":[32],"isOpen":[32],"parentName":[32],"parentHref":[32],"parentLinkId":[32],"alignment":[32]},null,{"isOpen":["onOpen"]}]]],["p-6e9875e5",[[4,"pn-sidenav-link",{"name":[1],"href":[1],"target":[1],"linkid":[1],"icon":[1],"current":[4],"levelId":[32],"open":[32],"hasChildren":[32]}]]],["p-7021985c",[[4,"pn-sidenav-togglebutton",{"label":[1],"i18n":[32]}]]],["p-0a522476",[[4,"pn-spotlight",{"heading":[1],"preamble":[1],"isDynamic":[4,"is-dynamic"],"addDynamic":[32]}]]],["p-73db2c9c",[[4,"pn-teaser-card",{"text":[1],"heading":[1],"label":[1],"dataCardColor":[513,"data-card-color"],"dataCardAlignment":[513,"data-card-alignment"],"hasCtaSlotContent":[32],"hasIllustrationSlot":[32]}]]],["p-69ee0033",[[4,"pn-usp-promoter",{"heading":[1],"headingExtension":[1,"heading-extension"],"bodyText":[1,"body-text"],"backgroundGradient":[1,"background-gradient"],"fullWidth":[4,"full-width"],"rightAlign":[4,"right-align"],"hideMobileImage":[4,"hide-mobile-image"]}]]],["p-9776a1c5",[[0,"pn-proxio-findprice-result",{"item":[1040],"activeweight":[1026],"shownitems":[16],"Usp1":[1,"usp-1"],"Usp2":[1,"usp-2"],"Usp3":[1,"usp-3"],"description":[16],"showMeasurement":[4,"show-measurement"],"showInternational":[4,"show-international"],"selectedCountrycode":[1,"selected-countrycode"],"market":[1],"language":[1025],"weightText":[32],"linkId":[32],"shopLabel":[32],"shopUrl":[32],"shopId":[32],"i18n":[32]},null,{"item":["composeItems"],"activeweight":["getPriceString","getProductLink"]}]]],["p-2f779414",[[0,"pn-find-service-and-price-result",{"item":[1040],"shownitems":[16],"weightText":[32]},null,{"item":["composeItems"]}]]],["p-85d57c9d",[[0,"pn-multi-row-connected-dropdown-row",{"dropdownData":[1,"dropdown-data"],"languageCode":[1,"language-code"],"label":[1],"firstDropdownLabel":[1,"first-dropdown-label"],"secondDropdownLabel":[1,"second-dropdown-label"],"dropdownPlaceholder":[1,"dropdown-placeholder"],"addRowText":[1,"add-row-text"],"inputFildLabel":[1,"input-fild-label"],"inputFildPlaceholder":[1,"input-fild-placeholder"],"dateButtonText":[1,"date-button-text"],"datePlaceholder":[1,"date-placeholder"],"dateDaysFromToday":[2,"date-days-from-today"],"allowMultipleDates":[4,"allow-multiple-dates"],"startDateLabel":[1,"start-date-label"],"endDateLabel":[1,"end-date-label"],"multiDateHelperText":[1,"multi-date-helper-text"],"generateDatesButtonText":[1,"generate-dates-button-text"],"saveDateButtonText":[1,"save-date-button-text"],"noDatesText":[1,"no-dates-text"],"index":[2],"predefinedValue":[1,"predefined-value"],"yearsToAddToEndDate":[2,"years-to-add-to-end-date"],"buttonsArray":[32],"firstDropdownArr":[32],"secondDropdownArr":[32],"firstDropdownClass":[32],"secondDropdownClass":[32],"firstValidDateString":[32],"lastValidDateString":[32],"firstDropdownPlaceholder":[32],"secondDropdownPlaceholder":[32],"starDateValue":[32],"endDateValue":[32],"generatedDatesArr":[32],"selectedButtonValue":[32],"inputFieldValue":[32],"dateValue":[32],"daysArr":[32]},null,{"predefinedValue":["applyPredefinedValue"]}]]],["p-c696bedf",[[0,"pn-play-on-scroll",{"videoSrc":[1,"video-src"],"observerOptions":[16],"showOverlay":[4,"show-overlay"],"videoId":[32],"isManuallyPaused":[32],"isPaused":[32]}]]],["p-d40ff187",[[0,"pn-dropdown-with-multi-input-rows-row",{"languageCode":[1,"language-code"],"fristInputPlaceholder":[1,"frist-input-placeholder"],"firstInputMin":[2,"first-input-min"],"firstInputMax":[2,"first-input-max"],"firstInputWarning":[2,"first-input-warning"],"firstInputWarningText":[1,"first-input-warning-text"],"firstInputLowErrorText":[1,"first-input-low-error-text"],"firstInputHighErrorText":[1,"first-input-high-error-text"],"secondInputPlaceholder":[1,"second-input-placeholder"],"secondInputMin":[2,"second-input-min"],"secondInputMax":[2,"second-input-max"],"secondInputWarning":[2,"second-input-warning"],"secondInputWarningText":[1,"second-input-warning-text"],"secondInputLowErrorText":[1,"second-input-low-error-text"],"secondInputHighErrorText":[1,"second-input-high-error-text"],"dateLabel":[1,"date-label"],"datePlaceholder":[1,"date-placeholder"],"firstValidDate":[1,"first-valid-date"],"lastValidDate":[1,"last-valid-date"],"predefinedValue":[1,"predefined-value"],"rowIndex":[2,"row-index"],"minRowCount":[2,"min-row-count"],"showFirstInputWarning":[32],"showFirstInputLowError":[32],"showFirstInputHighError":[32],"showSecondInputWarning":[32],"showSecondInputLowError":[32],"showSecondInputHighError":[32],"firstInputValue":[32],"secondInputValue":[32],"dateValue":[32]},null,{"predefinedValue":["applyPredefinedValue"]}]]],["p-81b3e038",[[4,"pn-share-item",{"link":[1],"text":[1]}]]],["p-1bd5fa26",[[0,"pn-stats-info-data",{"format":[1],"formatStyle":[1,"format-style"],"startValue":[2,"start-value"],"data":[2],"unit":[1],"preamble":[1],"duration":[2],"index":[2],"hasBeenShown":[32],"compId":[32]},null,{"hasBeenShown":["watchStateHandlder"]}]]],["p-7b598d81",[[0,"pn-find-price-result",{"item":[1040],"shownitems":[16],"Usp1":[1,"usp-1"],"Usp2":[1,"usp-2"],"Usp3":[1,"usp-3"],"description":[16],"showMeasurement":[4,"show-measurement"],"weightText":[32],"linkId":[32],"shopLabel":[32],"shopUrl":[32],"shopId":[32]},null,{"item":["composeItems"]}]]],["p-370829c6",[[1,"pn-filter-checkbox",{"value":[520],"name":[1],"checkboxid":[1],"disabled":[4],"checked":[4],"indeterminate":[1028]},[[0,"change","handlechange"]]]]],["p-c224d7c4",[[4,"pn-mainnav-link",{"name":[1],"href":[1],"target":[1],"linkid":[1],"levelId":[32],"open":[32],"hasChildren":[32]}]]],["p-78fbc88c",[[4,"pn-site-footer",{"url":[1],"linktitle":[1],"theme":[513]}],[4,"pn-site-footer-col",{"theme":[513]}],[0,"pn-swan",{"licenseNumber":[1,"license-number"],"language":[1537],"linkTo":[1,"link-to"],"i18n":[32]},null,{"language":["onLanguageChange"]}]]],["p-9be27d72",[[4,"pn-choice-button",{"value":[520],"name":[1],"choiceid":[1],"type":[1],"disabled":[4],"checked":[4],"indeterminate":[1028]},[[0,"change","handlechange"]]]]],["p-1217d60f",[[0,"pn-product-tile-info",{"label":[1],"text":[1],"icon":[1]}],[0,"pn-product-tile-price",{"label":[1],"amount":[1],"currency":[1],"url":[1]}]]],["p-828449da",[[4,"pn-scroll",{"observerOptions":[16],"behaviourClasses":[1,"behaviour-classes"],"transitionDurationSeconds":[2,"transition-duration-seconds"],"shouldLoop":[4,"should-loop"],"intersectFunc":[16],"notIntersectFunc":[16],"compId":[32]}],[0,"pn-video-overlay",{"language":[1],"isPaused":[4,"is-paused"],"showOverlay":[4,"show-overlay"],"i18n":[32]},null,{"language":["onLanguageChange"]}]]],["p-b2dcce7c",[[0,"pn-marketweb-siteheader-login-linklist",{"heading":[1],"links":[16],"idNamespace":[1,"id-namespace"],"showUnifiedLogin":[4,"show-unified-login"]}]]],["p-1578e02e",[[4,"pn-titletag",{"icon":[1],"color":[1537]}]]],["p-9998c29d",[[0,"pn-marketweb-input",{"disabled":[4],"error":[1],"invalid":[4],"helpertext":[1],"label":[1],"placeholder":[1],"inputid":[1],"name":[1],"required":[4],"type":[1025],"autocomplete":[1],"valid":[4],"value":[1],"maxlength":[1],"min":[1],"max":[1],"step":[1],"pattern":[1],"showText":[32]}]]],["p-9a7abcee",[[0,"pn-marketweb-siteheader-unified-login",{"loggedIn":[4,"logged-in"],"myPageLabel":[1,"my-page-label"],"myPageUrl":[1,"my-page-url"],"logInLabel":[1,"log-in-label"]}],[0,"pn-marketweb-siteheader-login-links",{"loginDialog":[1040],"idNamespace":[1,"id-namespace"],"loggedin":[516],"username":[1],"showUnifiedLogin":[4,"show-unified-login"]},null,{"loginDialog":["init"]}],[0,"pn-marketweb-siteheader-login-profileselection",{"loginDialog":[1040],"endpoint":[1],"loggedin":[4],"idNamespace":[1,"id-namespace"],"heading":[1],"i18n":[16],"currentProfile":[1040],"profileoptions":[1040],"user":[32],"logoutLink":[32],"userName":[32],"userEmail":[32]}],[0,"pn-marketweb-siteheader-login-button",{"label":[1]}],[0,"pn-marketweb-siteheader-login-mypage-button",{"label":[1],"myPageUrl":[1,"my-page-url"]}]]],["p-4ea1409d",[[0,"pn-marketweb-siteheader-login",{"endpoint":[1],"token":[1],"i18n":[16],"siteUrl":[1,"site-url"],"emitEvents":[4,"emit-events"],"loginDialog":[1040],"fullname":[1],"loggedin":[4],"showProfileSelection":[1028,"show-profile-selection"],"showUnifiedLogin":[4,"show-unified-login"],"checkUserLoggedInStateInterval":[2,"check-user-logged-in-state-interval"],"environment":[1],"loginLinks":[32],"toggleButtonText":[32],"username":[32]},null,{"i18n":["init"],"loginDialog":["init"]}],[4,"pn-mainnav-level",{"label":[1537],"level":[32],"levelId":[32],"isOpen":[32],"parentName":[32],"parentHref":[32],"parentLinkId":[32],"listCount":[32],"alignment":[32]},null,{"label":["setState"],"isOpen":["onOpen"]}],[4,"pn-language-selector",{"value":[1537],"selectedLanguageName":[32],"options":[32],"i18n":[32]},null,{"value":["setSelectedLanguageName","setTranslations","onValueChange"]}],[0,"pn-language-selector-option",{"name":[1],"code":[1],"url":[1],"selected":[4],"currentLanguage":[1,"current-language"]}],[4,"pn-mainnav",{"market":[1],"language":[1],"navigationId":[1,"navigation-id"],"openMenu":[1028,"open-menu"],"navLabel":[1,"nav-label"]},[[0,"language","setLanguage"],[0,"market","setMarket"],[0,"menuLanguageChange","onLanguageChange"],[0,"setmenuopenstate","setMenuOpenState"],[0,"openMenuLevelChange","onOpenMenuLevelChange"]]],[4,"pn-mainnav-list",{"heading":[1],"linkCount":[32]}],[0,"pn-marketweb-siteheader-search",{"i18n":[8,"i-1-8n"],"showOnlyLink":[1028,"show-only-link"],"hideSearch":[1028,"hide-search"],"language":[1537],"siteid":[1],"search":[1040],"primary":[4],"icononly":[4],"autoCompleteOptions":[32]}],[4,"pn-site-selector",{"buttontext":[1537],"heading":[1537],"language":[1537],"i18n":[32]}],[0,"pn-site-selector-item",{"url":[1],"heading":[1],"description":[1],"newwindow":[4]}]]],["p-75a09bb2",[[4,"pn-proxio-productcard"],[0,"pn-proxio-productcard-description",{"heading":[1],"highlight":[1],"description":[1],"list":[1040]}],[0,"pn-proxio-productcard-information",{"label":[1],"information":[16]}],[0,"pn-proxio-productcard-pricelink",{"price":[1],"vatText":[1,"vat-text"],"link":[1],"linktext":[1]}]]],["p-609da67c",[[0,"pn-product-card-info",{"rulle":[1],"paket":[1],"label":[1],"text":[1]}],[0,"pn-product-card-price",{"label":[1],"amount":[1],"currency":[1],"note":[1],"url":[1],"service":[1],"linkid":[1]}],[4,"pn-product-card"]]]]'),e)}));
2
2
  //# sourceMappingURL=pn-market-web-components.esm.js.map
@@ -1,2 +0,0 @@
1
- import{r as t,c as i,g as s,h as e,d as l}from"./p-06555615.js";import{F as n,M as o}from"./p-73cef33c.js";import{d as h}from"./p-aed52bc1.js";const a="pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}pn-address-autofill pn-marketweb-input{width:50%}pn-address-autofill .input-container-row{display:flex;gap:1rem;margin-bottom:1rem}pn-address-autofill .label-container{color:#5e554a;font-size:0.875em;display:flex;justify-content:space-between;align-items:flex-end}pn-address-autofill .autocomplete-items{position:absolute;border-radius:0.8rem;border:0.1rem solid #5e554a;width:100%;max-height:30rem;overflow-y:auto}pn-address-autofill .autocomplete-items:hover,pn-address-autofill .autocomplete-items :focus{border:0.1rem solid #00a0d6}pn-address-autofill .autocomplete-items div{padding:1.6rem;cursor:pointer;background-color:#fff;border:0.1rem solid transparent}pn-address-autofill .autocomplete-items div:first-child{border-radius:0.8rem 0.8rem 0 0}pn-address-autofill .autocomplete-items div:last-child{border-radius:0 0 0.8rem 0.8rem}pn-address-autofill .autocomplete-items div:hover{background-color:#e0f8ff}pn-address-autofill .autocomplete-items .autocomplete-active{background-color:#e0f8ff}";const r=a;const u=class{constructor(s){t(this,s);this.addresscomplete=i(this,"addresscomplete",7);this.market=null;this.environment=null;this.endpoint=null;this.cache=true;this.countryCode=null;this.postalCodeProps=null;this.cityProps=null;this.streetAddressProps=null;this.streetNumberProps=null;this.streetAdressArr=null;this.streetNumberArr=null;this.city=null;this.postalCode=null;this.streetAddress=null;this.streetNumber=null;this.fullAddress=null}get hostElement(){return s(this)}pnInputPostalCode=null;pnInputCity=null;pnInputStreetAddress=null;pnInputStreetNumber=null;postalCodeInputField=null;streetAddressInputField=null;streetNumberInputField=null;pnInputHiddenValue=null;endpointPath="/api/location/get-by-location";_postalCodeProps=null;_cityProps=null;_streetAddressProps=null;_streetNumberProps=null;addresscomplete;fetchHelper=new n("PostalCodeCityAutofill");componentWillLoad(){this.setInitialValues();this._postalCodeProps=this.setProps(this.postalCodeProps);this._cityProps=this.setProps(this.cityProps);this._streetAddressProps=this.setProps(this.streetAddressProps);this._streetNumberProps=this.setProps(this.streetNumberProps)}setProps(t){if(typeof t==="string"){return JSON.parse(t)}else{return t}}componentDidLoad(){this.postalCodeInputField=this.pnInputPostalCode.querySelector("input");this.streetAddressInputField=this.pnInputStreetAddress.querySelector("input");this.streetNumberInputField=this.pnInputStreetNumber.querySelector("input");this.addEventHandlers()}async setInitialValues(t=window.location.href){const i=new o(t);if(!this.environment){this.environment=await i.getEnvironmentName()}if(!this.endpoint&&this.environment?.indexOf("local")===-1){this.endpoint=await i.getEndpoint(this.environment,this.market)}if(!this.endpoint){this.endpoint=""}}addEventHandlers(){const t=h(this.fetchData.bind(this,this.postalCodeInputField),1e3);this.postalCodeInputField.addEventListener("keyup",t);this.streetAddressInputField.addEventListener("keyup",this.handleStreetAddressDropdown.bind(this));this.streetNumberInputField.addEventListener("focus",this.handleStreetNumberDropdown.bind(this));this.addFormFieldEvent()}addFormFieldEvent(){const t=this.hostElement.querySelectorAll("input");t.forEach((t=>{["keyup","change"].forEach((i=>{const s=h(this.updateHiddenValue.bind(this),1e3);t.addEventListener(i,s)}))}))}updateHiddenValue(t){if(t.target===this.streetNumberInputField){this.streetNumber=this.streetNumberInputField.value}if(this.postalCode&&this.city&&this.streetAddress&&this.streetNumber){this.fullAddress=`${this.streetAddress} ${this.streetNumber}, ${this.city} ${this.postalCode}`}else{this.fullAddress=""}this.addresscomplete.emit(this.fullAddress)}async fetchData(t,i){if(i){i.preventDefault();if(i.key==="Tab"){if(this.city){return}}}let s="";const e=i&&i.target===this.postalCodeInputField;const l=t===this.streetAddressInputField&&this.city&&this.city.length;const n=t===this.streetNumberInputField&&this.city&&this.city.length&&this.streetAddress&&this.streetAddress.length;if(e){s=this.postalCodeInputField.value;this.streetAdressArr=null;this.streetAddressInputField.value="";this.streetNumberArr=null;this.streetNumberInputField.value="";this.city=null;this.streetAddress=null;this.streetNumber=null}if(l){s=`${this.streetAddressInputField.value}, ${this.city}`;this.streetNumberArr=null;this.streetNumberInputField.value="";this.streetNumber=null}if(n){this.streetAdressArr=null;s=`${this.streetAddress}, ${this.city}`}if(s.length>0){const t=this.endpoint.lastIndexOf("/")===this.endpoint.length-1?this.endpoint.substring(0,this.endpoint.length-1):this.endpoint;const i=`${t}${this.endpointPath}?countryCode=${this.countryCode}&query=${s}`;const o=await this.fetchHelper.fetchJson(i,{mode:"cors"},this.cache);if(o){if(e){this.city=o.postalCodes?o.postalCodes[0]?.postalCity:null}if(l&&o.addresses){this.postalCode=this.postalCodeInputField.value;this.filterStreetNames(o)}if(n&&o.addresses){this.filterStreetNumbers(o)}}}}filterStreetNames=t=>{const i=[];this.streetAdressArr=null;t.addresses.forEach((t=>{if(t.postalCode.postalCity===this.city&&!i.includes(t.street)){i.push(t.street)}}));this.streetAdressArr=i};filterStreetNumbers=t=>{const i=[];t.addresses.forEach((t=>{if(t.postalCode.postalCode===this.postalCode){const{numberFrom:s,numberTo:e}=t;const l=parseInt(s);const n=parseInt(e);for(let t=l;t<=n;t++){const s=t.toString();if(!i.includes(s)){i.push(t.toString())}}}}));this.streetNumberArr=i};async handleStreetAddressDropdown(t){const i=t.target;if(i===this.streetAddressInputField&&i.value.length){if(!this.streetAdressArr||!this.streetAdressArr.length){await this.fetchData(this.streetAddressInputField,null)}}if(!i.value||!i.value.length){this.streetAdressArr=null}if(this.streetAdressArr&&this.streetAdressArr.length){this.autoComplete(t,this.streetAdressArr)}}async handleStreetNumberDropdown(t){t.preventDefault();const i=t.target;if(i===this.streetNumberInputField){if(!this.streetNumberArr||!this.streetNumberArr.length){await this.fetchData(this.streetNumberInputField,null)}if(this.streetNumberArr){this.autoComplete(t,this.streetNumberArr)}}}autoComplete(t,i){const s=t.target;if(i.length<1){return}let e=0;s.addEventListener("input",(()=>{const t=s.value;this.closeAllLists(s);if(!t){return}e=-1;let l=document.createElement("div");l.setAttribute("id","autocomplete-list"+s.name);l.setAttribute("class","autocomplete-items");s.parentElement.appendChild(l);for(let e=0;e<i.length;e++){if(i[e].substring(0,t.length).toUpperCase()==t.toUpperCase()){let n=document.createElement("div");n.innerHTML="<strong>"+i[e].substring(0,t.length)+"</strong>";n.innerHTML+=i[e].substring(t.length);n.innerHTML+="<input type='hidden' value='"+i[e]+"'>";n.addEventListener("click",(t=>{const i=s.closest("pn-marketweb-input");let e=t.target;if(e.nodeName==="STRONG"){e=e.parentElement}i.value=e.getElementsByTagName("input")[0].value;if(s===this.streetNumberInputField){this.streetNumber=i.value}if(s===this.streetAddressInputField){this.streetAddress=i.value}this.closeAllLists(t.target);s.focus()}));l.appendChild(n)}}}));s.addEventListener("keydown",(t=>{const i=document.getElementById("autocomplete-list"+s.name);let l;if(i){l=i.getElementsByTagName("div")}else{l=i}if(t.keyCode==40){e++;this.addActive(l,e)}if(t.keyCode==38){e--;this.addActive(l,e)}if(t.keyCode==13){t.preventDefault();if(e>-1){if(l){l[e].click()}}}}))}closeAllLists(t){const i=document.getElementsByClassName("autocomplete-items");for(let s=0;s<i.length;s++){if(t!=i[s]){i[s].parentNode.removeChild(i[s])}}}addActive(t,i){if(!t)return;this.removeActive(t);if(i>=t.length)i=0;if(i<0)i=t.length-1;t[i].classList.add("autocomplete-active")}removeActive(t){for(let i=0;i<t.length;i++){t[i].classList.remove("autocomplete-active")}}render(){return e(l,{key:"31d54cc786afb2a8b9ea3f0122fc146e837e8e97",class:"pn-address-autofill"},this._postalCodeProps?.postalCodeCityLabel?e("div",{class:"label-container"},e("label",null,`${this._postalCodeProps.postalCodeCityLabel}`)):null,e("div",{key:"b4ec3793c6895ba3b52795e80891b842973d6545",class:"input-container-row"},e("pn-marketweb-input",{key:"e1c3e2f0623a2c012c11db7d197f041dbffebcd6",type:"text",name:this._postalCodeProps?.postalCodeInputName,required:this._postalCodeProps?.postalCodeInputRequired,placeholder:this._postalCodeProps?.postalCodeInputPlaceholder,ref:t=>this.pnInputPostalCode=t,autocomplete:"off",helpertext:this._postalCodeProps?.postalCodeInputHelpertext}),e("pn-marketweb-input",{key:"3c88411b408874109fc7014b2306549d6f75cfcd",type:"text",name:this._cityProps?.cityInputName,disabled:true,value:this.city,placeholder:this._cityProps?.cityInputPlaceholder,autocomplete:"off",helpertext:this._cityProps?.cityInputHelpertext})),this._streetAddressProps?.streetAddressNumberLabel?e("div",{class:"label-container"},e("label",null,`${this._streetAddressProps.streetAddressNumberLabel}`)):null,e("div",{key:"1f3f232bebd83bff4d31b3b79a86d03117e2136d",class:"input-container-row"},e("pn-marketweb-input",{key:"3fae08f0de34286a23b145ffdf02d63ba63981ab",type:"text",name:this._streetAddressProps?.streetAddressInputName,required:this._streetAddressProps?.streetAddressInputRequired,value:this.streetAddress,placeholder:this._streetAddressProps?.streetAddressInputPlaceholder,ref:t=>this.pnInputStreetAddress=t,autocomplete:"off",helpertext:this._streetAddressProps?.streetAddressInputHelpertext}),e("pn-marketweb-input",{key:"9293d6d05fea0fb4df8bfb9a45d608efa6feb202",type:"text",name:this._streetNumberProps?.streetNumberInputName,required:this._streetNumberProps?.streetNumberInputRequired,value:this.streetNumber,placeholder:this._streetNumberProps?.streetNumberInputPlaceholder,ref:t=>this.pnInputStreetNumber=t,autocomplete:"off",helpertext:this._streetNumberProps?.streetNumberInputHelpertext})))}};u.style=r;export{u as pn_address_autofill};
2
- //# sourceMappingURL=p-acbe60df.entry.js.map