@postnord/pn-marketweb-components 3.0.3 → 3.0.4

package/pn-market-web-components/{p-787e20a1.entry.js.map → p-c5856c0b.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["pnMediaBlockCss","PnMediaBlockStyle0","PnmediaBlock","this","handleScroll","mediaBlockElement","block","firstElementChild","scrollTrigger","querySelector","videoPauseButton","scrollTriggerTop","getBoundingClientRect","top","mediaBlockElementHeight","offsetHeight","scrollPosition","parallaxSpeedContent","parallaxSpeedMedia","mediaContainer","content","style","transform","opacity","Math","max","undefined","root","document","threshold","rootMargin","blockHeadingLevelChecked","blockHeading","console","warn","blockHeadingLevel","hasVideo","videoSrc","hasImage","imageSrc","componentWillLoad","hasButtonSlot","componentDidLoad","getElementById","calculatedBlockHeight","overlayElement","customOverlayBackground","background","parallaxScroll","observerScroll","IntersectionObserver","entries","forEach","entry","isIntersecting","window","addEventListener","removeEventListener","observe","scrollSnapBlock","observerSnap","HTMLElement","setTimeout","scrollIntoView","behavior","error","disconnectedCallback","disconnect","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 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"],"mappings":"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","ignoreList":[]}
+{"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 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"],"mappings":"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","ignoreList":[]}

package/pn-market-web-components/p-c696bedf.entry.js

@@ -0,0 +1,2 @@
+import{r as s,g as e,h as t,d as o}from"./p-06555615.js";import{v as i}from"./p-4ed69de7.js";const l="pn-play-on-scroll pn-scroll [slot=scroll-affected]{position:relative;display:flex}pn-play-on-scroll pn-scroll [slot=scroll-affected] video{width:100%}pn-play-on-scroll pn-scroll [slot=scroll-affected] video:hover{cursor:pointer}";const a=l;const r={root:null,threshold:1,rootMargin:"0px 0px 0px 0px"};const c=(s,e,t)=>{if(!e){s&&s.play();t(false)}};const n=(s,e)=>{s&&s.pause();e(true)};const h=class{constructor(e){s(this,e);this.videoSrc="";this.observerOptions=r;this.showOverlay=false;this.videoId="";this.isManuallyPaused=false;this.isPaused=false}get hostElement(){return e(this)}localObserverOptions;testAdditionalParamIntoCallback=true;video;generateUniqueId(){return i()}componentWillLoad(){this.videoId=this.generateUniqueId()}componentDidLoad(){this.video=document.getElementById(this.videoId);this.video.addEventListener("click",this.handlePlayPauseClicked);this.localObserverOptions=this.observerOptions}handlePlayPauseClicked=()=>{if(this.video.paused||this.video.ended){this.video.play();this.isManuallyPaused=false;this.isPaused=false}else{this.video.pause();this.isManuallyPaused=true;this.isPaused=true}};togglePaused=s=>{this.isPaused=s};render(){return t(o,{key:"b76be7833abdd0c16b2b865e343a764fb5762466"},t("pn-scroll",{key:"c3dbb68e12611706fb4a3cbbbad84287ac3c2e73",intersectFunc:()=>c(this.video,this.isManuallyPaused,this.togglePaused),notIntersectFunc:()=>n(this.video,this.togglePaused),shouldLoop:true,behaviourClasses:"some-behaviour-class",observerOptions:this.localObserverOptions},t("div",{key:"461df9fcf966d409345e945117418eb35d58f540",slot:"scroll-affected"},t("video",{key:"1b23bfb0e5f2ad71d1bbe0740bc7823784ff80c0",playsinline:true,muted:true,autoPlay:true,id:`${this.videoId}`},t("source",{key:"8bf03c50ae3d3245acaae0beb3b7fc7ee048c0d8",src:this.videoSrc,type:"video/mp4"})),t("pn-video-overlay",{key:"21a69fa7ed440704f2e9aa5017f4616322fe9a4b",showOverlay:this.showOverlay,isPaused:this.isManuallyPaused||this.isPaused,onPlayPauseClicked:this.handlePlayPauseClicked}))))}};h.style=a;export{h as pn_play_on_scroll};
+//# sourceMappingURL=p-c696bedf.entry.js.map

package/pn-market-web-components/{p-012ee486.entry.js.map → p-c696bedf.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["pnPlayOnScrollCss","PnPlayOnScrollStyle0","defaultObserverOptions","root","threshold","rootMargin","onIntersecting","video","isManualPaused","togglePaused","play","onNotIntersecting","pause","PnPlayOnScroll","this","testAdditionalParamIntoCallback","handlePlayPauseClicked","paused","ended","isManuallyPaused","isPaused","generateUniqueId","uuidv4","componentWillLoad","videoId","componentDidLoad","document","getElementById","addEventListener","localObserverOptions","observerOptions","render","h","Host","key","intersectFunc","notIntersectFunc","shouldLoop","behaviourClasses","slot","playsinline","muted","autoPlay","id","src","videoSrc","type","showOverlay","onPlayPauseClicked"],"sources":["src/components/animation/pn-play-on-scroll/pn-play-on-scroll.scss?tag=pn-play-on-scroll","src/components/animation/pn-play-on-scroll/pn-play-on-scroll.tsx"],"sourcesContent":["pn-play-on-scroll {\n  pn-scroll {\n    [slot='scroll-affected'] {\n      position: relative;\n      display: flex;\n\n      video {\n        width: 100%;\n\n        &:hover {\n          cursor: pointer;\n        }\n      }\n    }\n  }\n}\n","import { v4 as uuidv4 } from 'uuid';\n\nimport { Component, Element, h, Host, Prop, State } from '@stencil/core';\n\n/*\n    play content when scoll observer sees content as inview\n*/\n\nconst defaultObserverOptions: IntersectionObserverInit = {\n  root: null,\n  threshold: 1,\n  rootMargin: '0px 0px 0px 0px',\n};\n\nconst onIntersecting = (video: HTMLVideoElement, isManualPaused: boolean, togglePaused: (arg: boolean) => void) => {\n  //what to do when intersecting, eg video.play()\n  if (!isManualPaused) {\n    video && video.play();\n    togglePaused(false);\n  }\n};\n\nconst onNotIntersecting = (video: HTMLVideoElement, togglePaused: (arg: boolean) => void) => {\n  //what to do when not intersecting, eg video.pause()\n  video && video.pause();\n  togglePaused(true);\n};\n\n@Component({\n  tag: 'pn-play-on-scroll',\n  styleUrl: 'pn-play-on-scroll.scss',\n})\nexport class PnPlayOnScroll {\n  @Element() hostElement: HTMLElement;\n  @Prop() videoSrc: string = '';\n  @Prop() observerOptions: IntersectionObserverInit = defaultObserverOptions;\n  @Prop() showOverlay: boolean = false;\n  @State() videoId: string = '';\n  @State() isManuallyPaused: boolean = false;\n  @State() isPaused: boolean = false;\n  localObserverOptions: IntersectionObserverInit;\n\n  testAdditionalParamIntoCallback: boolean = true;\n  video: HTMLVideoElement;\n\n  generateUniqueId() {\n    return uuidv4();\n  }\n\n  componentWillLoad() {\n    this.videoId = this.generateUniqueId();\n  }\n\n  componentDidLoad() {\n    this.video = document.getElementById(this.videoId) as HTMLVideoElement;\n    this.video.addEventListener('click', this.handlePlayPauseClicked);\n    this.localObserverOptions = this.observerOptions;\n  }\n\n  handlePlayPauseClicked = () => {\n    if (this.video.paused || this.video.ended) {\n      this.video.play();\n      this.isManuallyPaused = false;\n      this.isPaused = false;\n    } else {\n      this.video.pause();\n      this.isManuallyPaused = true;\n      this.isPaused = true;\n    }\n  };\n\n  togglePaused = (paused: boolean) => {\n    this.isPaused = paused;\n  };\n\n  render() {\n    return (\n      <Host>\n        <pn-scroll\n          intersectFunc={() => onIntersecting(this.video, this.isManuallyPaused, this.togglePaused)}\n          notIntersectFunc={() => onNotIntersecting(this.video, this.togglePaused)}\n          shouldLoop={true}\n          behaviourClasses={'some-behaviour-class'}\n          observerOptions={this.localObserverOptions}\n        >\n          <div slot=\"scroll-affected\">\n            <video playsinline muted autoPlay id={`${this.videoId}`}>\n              <source src={this.videoSrc} type=\"video/mp4\" />\n            </video>\n            <pn-video-overlay showOverlay={this.showOverlay} isPaused={this.isManuallyPaused || this.isPaused} onPlayPauseClicked={this.handlePlayPauseClicked}></pn-video-overlay>\n          </div>\n        </pn-scroll>\n      </Host>\n    );\n  }\n}\n"],"mappings":"6FAAA,MAAMA,EAAoB,uOAC1B,MAAAC,EAAeD,ECOf,MAAME,EAAmD,CACvDC,KAAM,KACNC,UAAW,EACXC,WAAY,mBAGd,MAAMC,EAAiB,CAACC,EAAyBC,EAAyBC,KAExE,IAAKD,EAAgB,CACnBD,GAASA,EAAMG,OACfD,EAAa,M,GAIjB,MAAME,EAAoB,CAACJ,EAAyBE,KAElDF,GAASA,EAAMK,QACfH,EAAa,KAAK,E,MAOPI,EAAc,M,yBAUzBC,KAAAC,gCAA2C,KAiB3CD,KAAAE,uBAAyB,KACvB,GAAIF,KAAKP,MAAMU,QAAUH,KAAKP,MAAMW,MAAO,CACzCJ,KAAKP,MAAMG,OACXI,KAAKK,iBAAmB,MACxBL,KAAKM,SAAW,K,KACX,CACLN,KAAKP,MAAMK,QACXE,KAAKK,iBAAmB,KACxBL,KAAKM,SAAW,I,GAIpBN,KAAAL,aAAgBQ,IACdH,KAAKM,SAAWH,CAAM,E,cAtCG,G,qBACyBf,E,iBACrB,M,aACJ,G,sBACU,M,cACR,K,CAM7B,gBAAAmB,GACE,OAAOC,G,CAGT,iBAAAC,GACET,KAAKU,QAAUV,KAAKO,kB,CAGtB,gBAAAI,GACEX,KAAKP,MAAQmB,SAASC,eAAeb,KAAKU,SAC1CV,KAAKP,MAAMqB,iBAAiB,QAASd,KAAKE,wBAC1CF,KAAKe,qBAAuBf,KAAKgB,e,CAmBnC,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,aAAAE,IAAA,2CACEC,cAAe,IAAM7B,EAAeQ,KAAKP,MAAOO,KAAKK,iBAAkBL,KAAKL,cAC5E2B,iBAAkB,IAAMzB,EAAkBG,KAAKP,MAAOO,KAAKL,cAC3D4B,WAAY,KACZC,iBAAkB,uBAClBR,gBAAiBhB,KAAKe,sBAEtBG,EAAA,OAAAE,IAAA,2CAAKK,KAAK,mBACRP,EAAA,SAAAE,IAAA,2CAAOM,YAAW,KAACC,MAAK,KAACC,SAAQ,KAACC,GAAI,GAAG7B,KAAKU,WAC5CQ,EAAA,UAAAE,IAAA,2CAAQU,IAAK9B,KAAK+B,SAAUC,KAAK,eAEnCd,EAAA,oBAAAE,IAAA,2CAAkBa,YAAajC,KAAKiC,YAAa3B,SAAUN,KAAKK,kBAAoBL,KAAKM,SAAU4B,mBAAoBlC,KAAKE,2B","ignoreList":[]}
+{"version":3,"names":["pnPlayOnScrollCss","PnPlayOnScrollStyle0","defaultObserverOptions","root","threshold","rootMargin","onIntersecting","video","isManualPaused","togglePaused","play","onNotIntersecting","pause","PnPlayOnScroll","localObserverOptions","testAdditionalParamIntoCallback","generateUniqueId","uuidv4","componentWillLoad","this","videoId","componentDidLoad","document","getElementById","addEventListener","handlePlayPauseClicked","observerOptions","paused","ended","isManuallyPaused","isPaused","render","h","Host","key","intersectFunc","notIntersectFunc","shouldLoop","behaviourClasses","slot","playsinline","muted","autoPlay","id","src","videoSrc","type","showOverlay","onPlayPauseClicked"],"sources":["src/components/animation/pn-play-on-scroll/pn-play-on-scroll.scss?tag=pn-play-on-scroll","src/components/animation/pn-play-on-scroll/pn-play-on-scroll.tsx"],"sourcesContent":["pn-play-on-scroll {\n  pn-scroll {\n    [slot='scroll-affected'] {\n      position: relative;\n      display: flex;\n\n      video {\n        width: 100%;\n\n        &:hover {\n          cursor: pointer;\n        }\n      }\n    }\n  }\n}\n","import { v4 as uuidv4 } from 'uuid';\n\nimport { Component, Element, h, Host, Prop, State } from '@stencil/core';\n\n/*\n    play content when scoll observer sees content as inview\n*/\n\nconst defaultObserverOptions: IntersectionObserverInit = {\n  root: null,\n  threshold: 1,\n  rootMargin: '0px 0px 0px 0px',\n};\n\nconst onIntersecting = (video: HTMLVideoElement, isManualPaused: boolean, togglePaused: (arg: boolean) => void) => {\n  //what to do when intersecting, eg video.play()\n  if (!isManualPaused) {\n    video && video.play();\n    togglePaused(false);\n  }\n};\n\nconst onNotIntersecting = (video: HTMLVideoElement, togglePaused: (arg: boolean) => void) => {\n  //what to do when not intersecting, eg video.pause()\n  video && video.pause();\n  togglePaused(true);\n};\n\n@Component({\n  tag: 'pn-play-on-scroll',\n  styleUrl: 'pn-play-on-scroll.scss',\n})\nexport class PnPlayOnScroll {\n  @Element() hostElement: HTMLElement;\n  @Prop() videoSrc: string = '';\n  @Prop() observerOptions: IntersectionObserverInit = defaultObserverOptions;\n  @Prop() showOverlay: boolean = false;\n  @State() videoId: string = '';\n  @State() isManuallyPaused: boolean = false;\n  @State() isPaused: boolean = false;\n  localObserverOptions: IntersectionObserverInit;\n\n  testAdditionalParamIntoCallback: boolean = true;\n  video: HTMLVideoElement;\n\n  generateUniqueId() {\n    return uuidv4();\n  }\n\n  componentWillLoad() {\n    this.videoId = this.generateUniqueId();\n  }\n\n  componentDidLoad() {\n    this.video = document.getElementById(this.videoId) as HTMLVideoElement;\n    this.video.addEventListener('click', this.handlePlayPauseClicked);\n    this.localObserverOptions = this.observerOptions;\n  }\n\n  handlePlayPauseClicked = () => {\n    if (this.video.paused || this.video.ended) {\n      this.video.play();\n      this.isManuallyPaused = false;\n      this.isPaused = false;\n    } else {\n      this.video.pause();\n      this.isManuallyPaused = true;\n      this.isPaused = true;\n    }\n  };\n\n  togglePaused = (paused: boolean) => {\n    this.isPaused = paused;\n  };\n\n  render() {\n    return (\n      <Host>\n        <pn-scroll\n          intersectFunc={() => onIntersecting(this.video, this.isManuallyPaused, this.togglePaused)}\n          notIntersectFunc={() => onNotIntersecting(this.video, this.togglePaused)}\n          shouldLoop={true}\n          behaviourClasses={'some-behaviour-class'}\n          observerOptions={this.localObserverOptions}\n        >\n          <div slot=\"scroll-affected\">\n            <video playsinline muted autoPlay id={`${this.videoId}`}>\n              <source src={this.videoSrc} type=\"video/mp4\" />\n            </video>\n            <pn-video-overlay showOverlay={this.showOverlay} isPaused={this.isManuallyPaused || this.isPaused} onPlayPauseClicked={this.handlePlayPauseClicked}></pn-video-overlay>\n          </div>\n        </pn-scroll>\n      </Host>\n    );\n  }\n}\n"],"mappings":"6FAAA,MAAMA,EAAoB,uOAC1B,MAAAC,EAAeD,ECOf,MAAME,EAAmD,CACvDC,KAAM,KACNC,UAAW,EACXC,WAAY,mBAGd,MAAMC,EAAiB,CAACC,EAAyBC,EAAyBC,KAExE,IAAKD,EAAgB,CACnBD,GAASA,EAAMG,OACfD,EAAa,M,GAIjB,MAAME,EAAoB,CAACJ,EAAyBE,KAElDF,GAASA,EAAMK,QACfH,EAAa,KAAK,E,MAOPI,EAAc,M,uCAEE,G,qBACyBX,E,iBACrB,M,aACJ,G,sBACU,M,cACR,K,kCAC7BY,qBAEAC,gCAA2C,KAC3CR,MAEA,gBAAAS,GACE,OAAOC,G,CAGT,iBAAAC,GACEC,KAAKC,QAAUD,KAAKH,kB,CAGtB,gBAAAK,GACEF,KAAKZ,MAAQe,SAASC,eAAeJ,KAAKC,SAC1CD,KAAKZ,MAAMiB,iBAAiB,QAASL,KAAKM,wBAC1CN,KAAKL,qBAAuBK,KAAKO,e,CAGnCD,uBAAyB,KACvB,GAAIN,KAAKZ,MAAMoB,QAAUR,KAAKZ,MAAMqB,MAAO,CACzCT,KAAKZ,MAAMG,OACXS,KAAKU,iBAAmB,MACxBV,KAAKW,SAAW,K,KACX,CACLX,KAAKZ,MAAMK,QACXO,KAAKU,iBAAmB,KACxBV,KAAKW,SAAW,I,GAIpBrB,aAAgBkB,IACdR,KAAKW,SAAWH,CAAM,EAGxB,MAAAI,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,aAAAE,IAAA,2CACEC,cAAe,IAAM7B,EAAea,KAAKZ,MAAOY,KAAKU,iBAAkBV,KAAKV,cAC5E2B,iBAAkB,IAAMzB,EAAkBQ,KAAKZ,MAAOY,KAAKV,cAC3D4B,WAAY,KACZC,iBAAkB,uBAClBZ,gBAAiBP,KAAKL,sBAEtBkB,EAAA,OAAAE,IAAA,2CAAKK,KAAK,mBACRP,EAAA,SAAAE,IAAA,2CAAOM,YAAW,KAACC,MAAK,KAACC,SAAQ,KAACC,GAAI,GAAGxB,KAAKC,WAC5CY,EAAA,UAAAE,IAAA,2CAAQU,IAAKzB,KAAK0B,SAAUC,KAAK,eAEnCd,EAAA,oBAAAE,IAAA,2CAAkBa,YAAa5B,KAAK4B,YAAajB,SAAUX,KAAKU,kBAAoBV,KAAKW,SAAUkB,mBAAoB7B,KAAKM,2B","ignoreList":[]}

package/pn-market-web-components/p-c9f21ea3.entry.js

@@ -0,0 +1,2 @@
+import{r as t,c as e,g as o,h as n,d as r}from"./p-06555615.js";const s="pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}.pn-profile-modal-customernumber-button{display:block;border:0;margin:0;background:#fff;cursor:pointer;appearance:none;border:0;outline:0;padding:0.8rem;font-weight:400;font-size:1.4rem;border-radius:0.8rem;line-height:1.4;transition:background 0.15s ease;text-align:left;width:100%}.pn-profile-modal-customernumber-button:hover,.pn-profile-modal-customernumber-button:focus,.pn-profile-modal-customernumber-button:active{background:#effbff}";const i=s;const u=class{constructor(o){t(this,o);this.urlSelected=e(this,"urlSelected",7);this.url=null;this.customernumber=null;this.selected=false}get hostElement(){return o(this)}urlSelected;onCustomerNumberClick(){this.selected=true;this.urlSelected.emit(this.url)}render(){return n(r,{key:"bf305b3a541226f48c8384b4bcff5fe23d630db9"},n("button",{key:"46d03f22933b2539ab13d84db2a309e5ea49ac64",class:"pn-profile-modal-customernumber-button",onClick:this.onCustomerNumberClick.bind(this)},n("slot",{key:"98cc7fd67a9267c7bf4b6019eca1bb26fd87b5df"})))}};u.style=i;export{u as pn_profile_modal_customernumber};
+//# sourceMappingURL=p-c9f21ea3.entry.js.map

package/pn-market-web-components/{p-03cb46c2.entry.js.map → p-c9f21ea3.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["pnProfileModalCustomernumberCss","PnProfileModalCustomernumberStyle0","PnProfileModalCustomernumber","onCustomerNumberClick","this","selected","urlSelected","emit","url","render","h","Host","key","class","onClick","bind"],"sources":["src/components/profile/pn-profile-modal/pn-profile-modal-customernumber.scss?tag=pn-profile-modal-customernumber","src/components/profile/pn-profile-modal/pn-profile-modal-customernumber.tsx"],"sourcesContent":["@import '../../../globals/main.scss';\n\npn-profile-modal-customernumber {\n}\n.pn-profile-modal-customernumber-button {\n  display: block;\n  border: 0;\n  margin: 0;\n  background: #fff;\n  cursor: pointer;\n  appearance: none;\n  border: 0;\n  outline: 0;\n  padding: 0.8rem;\n  font-weight: 400;\n  font-size: 1.4rem;\n  border-radius: 0.8rem;\n  line-height: 1.4;\n\n  transition: background 0.15s ease;\n  text-align: left;\n  width: 100%;\n  &:hover,\n  &:focus,\n  &:active {\n    background: $blue25;\n  }\n}\n","import { Component, Prop, h, Event, EventEmitter, Element, Host } from '@stencil/core';\n@Component({\n  tag: 'pn-profile-modal-customernumber',\n  styleUrl: 'pn-profile-modal-customernumber.scss',\n})\nexport class PnProfileModalCustomernumber {\n  @Element() hostElement: Element;\n\n  @Prop({ reflect: true }) url: string = null;\n  @Prop({ reflect: true }) customernumber: string = null;\n  @Prop({ reflect: true }) selected: boolean = false;\n\n  @Event() urlSelected: EventEmitter;\n\n  onCustomerNumberClick() {\n    this.selected = true;\n    this.urlSelected.emit(this.url);\n  }\n  render() {\n    return (\n      <Host>\n        <button class=\"pn-profile-modal-customernumber-button\" onClick={this.onCustomerNumberClick.bind(this)}>\n          <slot />\n        </button>\n      </Host>\n    );\n  }\n}\n"],"mappings":"gEAAA,MAAMA,EAAkC,2gBACxC,MAAAC,EAAeD,E,MCIFE,EAA4B,M,2EAGA,K,oBACW,K,cACL,K,CAI7C,qBAAAC,GACEC,KAAKC,SAAW,KAChBD,KAAKE,YAAYC,KAAKH,KAAKI,I,CAE7B,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,UAAAE,IAAA,2CAAQC,MAAM,yCAAyCC,QAASV,KAAKD,sBAAsBY,KAAKX,OAC9FM,EAAA,QAAAE,IAAA,8C","ignoreList":[]}
+{"version":3,"names":["pnProfileModalCustomernumberCss","PnProfileModalCustomernumberStyle0","PnProfileModalCustomernumber","urlSelected","onCustomerNumberClick","this","selected","emit","url","render","h","Host","key","class","onClick","bind"],"sources":["src/components/profile/pn-profile-modal/pn-profile-modal-customernumber.scss?tag=pn-profile-modal-customernumber","src/components/profile/pn-profile-modal/pn-profile-modal-customernumber.tsx"],"sourcesContent":["@import '../../../globals/main.scss';\n\npn-profile-modal-customernumber {\n}\n.pn-profile-modal-customernumber-button {\n  display: block;\n  border: 0;\n  margin: 0;\n  background: #fff;\n  cursor: pointer;\n  appearance: none;\n  border: 0;\n  outline: 0;\n  padding: 0.8rem;\n  font-weight: 400;\n  font-size: 1.4rem;\n  border-radius: 0.8rem;\n  line-height: 1.4;\n\n  transition: background 0.15s ease;\n  text-align: left;\n  width: 100%;\n  &:hover,\n  &:focus,\n  &:active {\n    background: $blue25;\n  }\n}\n","import { Component, Prop, h, Event, EventEmitter, Element, Host } from '@stencil/core';\n@Component({\n  tag: 'pn-profile-modal-customernumber',\n  styleUrl: 'pn-profile-modal-customernumber.scss',\n})\nexport class PnProfileModalCustomernumber {\n  @Element() hostElement: Element;\n\n  @Prop({ reflect: true }) url: string = null;\n  @Prop({ reflect: true }) customernumber: string = null;\n  @Prop({ reflect: true }) selected: boolean = false;\n\n  @Event() urlSelected: EventEmitter;\n\n  onCustomerNumberClick() {\n    this.selected = true;\n    this.urlSelected.emit(this.url);\n  }\n  render() {\n    return (\n      <Host>\n        <button class=\"pn-profile-modal-customernumber-button\" onClick={this.onCustomerNumberClick.bind(this)}>\n          <slot />\n        </button>\n      </Host>\n    );\n  }\n}\n"],"mappings":"gEAAA,MAAMA,EAAkC,2gBACxC,MAAAC,EAAeD,E,MCIFE,EAA4B,M,2EAGA,K,oBACW,K,cACL,K,kCAEpCC,YAET,qBAAAC,GACEC,KAAKC,SAAW,KAChBD,KAAKF,YAAYI,KAAKF,KAAKG,I,CAE7B,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,UAAAE,IAAA,2CAAQC,MAAM,yCAAyCC,QAAST,KAAKD,sBAAsBW,KAAKV,OAC9FK,EAAA,QAAAE,IAAA,8C","ignoreList":[]}

package/pn-market-web-components/{p-87aa1f73.entry.js → p-d07cf4c8.entry.js}

@@ -1,2 +1,2 @@
-import{r as t,h as e,d as o,g as r}from"./p-06555615.js";const p="pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}pn-usp-promoter{width:80%}pn-usp-promoter .usp-promoter{display:flex;justify-content:center;padding:3rem 0.8rem}pn-usp-promoter .usp-promoter--full-width{overflow:hidden;margin:0 calc(-50vw + 50%)}@media screen and (min-width: 768px){pn-usp-promoter .usp-promoter--full-width{padding:8rem 4rem}}pn-usp-promoter .usp-promoter__content{display:flex;flex-direction:row;width:100%;max-width:114rem}@media screen and (min-width: 768px){pn-usp-promoter .usp-promoter__content{align-items:center;text-align:left;justify-content:center}}pn-usp-promoter .usp-promoter__content-wrapper{display:flex;flex-direction:column;width:100%;max-width:75rem}@media screen and (min-width: 768px){pn-usp-promoter .usp-promoter__content-wrapper{align-items:flex-start;padding-left:4rem}}pn-usp-promoter .usp-promoter__content-heading{margin-bottom:0.8rem}@media screen and (min-width: 768px){pn-usp-promoter .usp-promoter__content-heading{font-size:4.2rem}}@media screen and (min-width: 1140px){pn-usp-promoter .usp-promoter__content-heading{font-size:4.8rem}}@media screen and (min-width: 1440px){pn-usp-promoter .usp-promoter__content-heading{font-size:5.6rem}}pn-usp-promoter .usp-promoter__no-margin-bottom{margin-bottom:0 !important}pn-usp-promoter .usp-promoter__content-text{font-size:1.6rem;max-width:47rem;margin-bottom:2.6rem}@media screen and (min-width: 768px){pn-usp-promoter .usp-promoter__content-text{text-wrap:balance}}@media screen and (min-width: 1140px){pn-usp-promoter .usp-promoter__content-text{font-size:1.8rem;max-width:60rem}}@media screen and (min-width: 1440px){pn-usp-promoter .usp-promoter__content-text{font-size:2rem;max-width:70rem}}pn-usp-promoter [slot=app-store]{display:flex;align-items:flex-start;margin-bottom:2.6rem;gap:1rem}pn-usp-promoter [slot=app-store]>a{background-color:black;border:0.1rem solid #a6a6a6;border-radius:0.8rem;color:#fff;display:inline-block;line-height:0;text-decoration:none;transition:background-color 0.2s ease-in-out}pn-usp-promoter [slot=app-store]>a::after{margin-left:0 !important;margin-right:0.5rem;top:0.2rem;position:relative}pn-usp-promoter [slot=app-store]>a:hover{background-color:#0d234b}pn-usp-promoter [slot=app-store]>a:focus{background-color:#0d234b;box-shadow:0 0 0 0.2rem #fff, 0 0 0 0.4rem #0d234b}pn-usp-promoter [slot=app-store]>a:focus-visible{outline:none}pn-usp-promoter [slot=usp-buttons] pn-button{margin-bottom:1.6rem}pn-usp-promoter [slot=usp-buttons]>a{color:#005d92;font-weight:500;font-size:1.6rem;padding:0.1rem;text-decoration:none}pn-usp-promoter [slot=usp-buttons]>a pn-icon svg{transition:transform 0.3s ease-in-out}pn-usp-promoter [slot=usp-buttons]>a pn-icon svg path{fill:#005d92}pn-usp-promoter [slot=usp-buttons]>a:hover pn-icon svg{transition:transform 0.3s ease-in-out;transform:translateX(0.3rem)}pn-usp-promoter [slot=usp-buttons]>a:hover pn-icon svg path{fill:#005d92}pn-usp-promoter [slot=app-store],pn-usp-promoter [slot=usp-buttons]{flex-direction:column}@media screen and (min-width: 768px){pn-usp-promoter [slot=app-store],pn-usp-promoter [slot=usp-buttons]{display:flex;flex-direction:row;gap:1.6rem}}pn-usp-promoter [slot=illustration]{max-width:25%;position:relative;left:-1.6rem}pn-usp-promoter [slot=illustration] pn-scroll{position:sticky;top:0}@media screen and (min-width: 768px){pn-usp-promoter [slot=illustration]{display:block}}pn-usp-promoter [slot=illustration] picture img{max-width:100%}@media screen and (min-width: 1140px){pn-usp-promoter [slot=illustration] picture img{width:32rem}}@media screen and (min-width: 1440px){pn-usp-promoter [slot=illustration] picture img{width:33.6rem}}pn-usp-promoter .usp-promoter__heading-extension{display:flex;flex-direction:column}pn-usp-promoter .usp-promoter--right-align .usp-promoter__content{flex-direction:row-reverse;text-align:right}@media screen and (min-width: 768px){pn-usp-promoter .usp-promoter--right-align .usp-promoter__content{align-items:center}}pn-usp-promoter .usp-promoter--right-align .usp-promoter__content-wrapper{display:flex;flex-direction:column;align-items:flex-end;padding-left:0}@media screen and (min-width: 768px){pn-usp-promoter .usp-promoter--right-align .usp-promoter__content-wrapper{padding-right:4rem}}pn-usp-promoter .usp-promoter--right-align [slot=app-store],pn-usp-promoter .usp-promoter--right-align [slot=usp-buttons]{align-items:flex-end}pn-usp-promoter .usp-promoter--right-align [slot=illustration]{left:1.6rem}@media screen and (max-width: 768px){pn-usp-promoter .usp-promoter--hide-image-small-screen [slot=illustration] picture img{display:none}pn-usp-promoter .usp-promoter--hide-image-small-screen .usp-promoter__content{text-align:center}pn-usp-promoter .usp-promoter--hide-image-small-screen .usp-promoter__content-wrapper{align-items:center;padding-right:0}pn-usp-promoter .usp-promoter--hide-image-small-screen [slot=app-store],pn-usp-promoter .usp-promoter--hide-image-small-screen [slot=usp-buttons]{display:flex;flex-direction:row;justify-content:center}}";const n=p;const s=class{constructor(e){t(this,e);this.heading=null;this.headingExtension=null;this.bodyText=null;this.backgroundGradient=null;this.fullWidth=false;this.rightAlign=false;this.hideMobileImage=false}centerMobileContent(){const t=this.hostElement.querySelector('[slot="illustration"]');if(this.hideMobileImage||t==null){return"usp-promoter--hide-image-small-screen"}return""}render(){const{fullWidth:t,rightAlign:r}=this;const p=["usp-promoter",t?"usp-promoter--full-width":"",r?"usp-promoter--right-align":""].join(" ");const n=this.headingExtension?"usp-promoter__heading-extension":"";return e(o,{key:"8974befbef406ab8ec5487b26d639c3029ca3c28"},e("div",{key:"376ab3f6277b3275166a03da05556de80401f741",class:` ${p} ${this.centerMobileContent()}`,style:{background:`${this.backgroundGradient}`}},e("div",{key:"eca02253ebcadb30f15521007faf078145e26584",class:"usp-promoter__content"},e("slot",{key:"ab1816f4edc0f7a13d2ff80ed6b494b88475892a",name:"illustration"}),e("div",{key:"eb351fd5e6493d33ec236125a45f3d3d4db94ce1",class:"usp-promoter__content-wrapper"},e("h2",{key:"f407944ee01af230a02c38555c3aef9344bd2aca",class:`usp-promoter__content-heading ${n}`},e("span",{key:"5061991946b31aab88c2ef846b1f32325a5689b9"},this.heading),this.headingExtension?e("span",null,this.headingExtension):null),e("p",{key:"89e3a84910fe0eaa5490628228548be16db8f049",class:"usp-promoter__content-text"},this.bodyText),e("slot",{key:"f743a7618e9dd439af7267615217b7feff2281df",name:"app-store"}),e("slot",{key:"6784ae05d8ef3ac0882472241a25822a345eea92",name:"usp-buttons"})))))}get hostElement(){return r(this)}};s.style=n;export{s as pn_usp_promoter};
-//# sourceMappingURL=p-87aa1f73.entry.js.map
+import{r as t,g as e,h as o,d as r}from"./p-06555615.js";const p="pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}pn-usp-promoter{width:80%}pn-usp-promoter .usp-promoter{display:flex;justify-content:center;padding:3rem 0.8rem}pn-usp-promoter .usp-promoter--full-width{overflow:hidden;margin:0 calc(-50vw + 50%)}@media screen and (min-width: 768px){pn-usp-promoter .usp-promoter--full-width{padding:8rem 4rem}}pn-usp-promoter .usp-promoter__content{display:flex;flex-direction:row;width:100%;max-width:114rem}@media screen and (min-width: 768px){pn-usp-promoter .usp-promoter__content{align-items:center;text-align:left;justify-content:center}}pn-usp-promoter .usp-promoter__content-wrapper{display:flex;flex-direction:column;width:100%;max-width:75rem}@media screen and (min-width: 768px){pn-usp-promoter .usp-promoter__content-wrapper{align-items:flex-start;padding-left:4rem}}pn-usp-promoter .usp-promoter__content-heading{margin-bottom:0.8rem}@media screen and (min-width: 768px){pn-usp-promoter .usp-promoter__content-heading{font-size:4.2rem}}@media screen and (min-width: 1140px){pn-usp-promoter .usp-promoter__content-heading{font-size:4.8rem}}@media screen and (min-width: 1440px){pn-usp-promoter .usp-promoter__content-heading{font-size:5.6rem}}pn-usp-promoter .usp-promoter__no-margin-bottom{margin-bottom:0 !important}pn-usp-promoter .usp-promoter__content-text{font-size:1.6rem;max-width:47rem;margin-bottom:2.6rem}@media screen and (min-width: 768px){pn-usp-promoter .usp-promoter__content-text{text-wrap:balance}}@media screen and (min-width: 1140px){pn-usp-promoter .usp-promoter__content-text{font-size:1.8rem;max-width:60rem}}@media screen and (min-width: 1440px){pn-usp-promoter .usp-promoter__content-text{font-size:2rem;max-width:70rem}}pn-usp-promoter [slot=app-store]{display:flex;align-items:flex-start;margin-bottom:2.6rem;gap:1rem}pn-usp-promoter [slot=app-store]>a{background-color:black;border:0.1rem solid #a6a6a6;border-radius:0.8rem;color:#fff;display:inline-block;line-height:0;text-decoration:none;transition:background-color 0.2s ease-in-out}pn-usp-promoter [slot=app-store]>a::after{margin-left:0 !important;margin-right:0.5rem;top:0.2rem;position:relative}pn-usp-promoter [slot=app-store]>a:hover{background-color:#0d234b}pn-usp-promoter [slot=app-store]>a:focus{background-color:#0d234b;box-shadow:0 0 0 0.2rem #fff, 0 0 0 0.4rem #0d234b}pn-usp-promoter [slot=app-store]>a:focus-visible{outline:none}pn-usp-promoter [slot=usp-buttons] pn-button{margin-bottom:1.6rem}pn-usp-promoter [slot=usp-buttons]>a{color:#005d92;font-weight:500;font-size:1.6rem;padding:0.1rem;text-decoration:none}pn-usp-promoter [slot=usp-buttons]>a pn-icon svg{transition:transform 0.3s ease-in-out}pn-usp-promoter [slot=usp-buttons]>a pn-icon svg path{fill:#005d92}pn-usp-promoter [slot=usp-buttons]>a:hover pn-icon svg{transition:transform 0.3s ease-in-out;transform:translateX(0.3rem)}pn-usp-promoter [slot=usp-buttons]>a:hover pn-icon svg path{fill:#005d92}pn-usp-promoter [slot=app-store],pn-usp-promoter [slot=usp-buttons]{flex-direction:column}@media screen and (min-width: 768px){pn-usp-promoter [slot=app-store],pn-usp-promoter [slot=usp-buttons]{display:flex;flex-direction:row;gap:1.6rem}}pn-usp-promoter [slot=illustration]{max-width:25%;position:relative;left:-1.6rem}pn-usp-promoter [slot=illustration] pn-scroll{position:sticky;top:0}@media screen and (min-width: 768px){pn-usp-promoter [slot=illustration]{display:block}}pn-usp-promoter [slot=illustration] picture img{max-width:100%}@media screen and (min-width: 1140px){pn-usp-promoter [slot=illustration] picture img{width:32rem}}@media screen and (min-width: 1440px){pn-usp-promoter [slot=illustration] picture img{width:33.6rem}}pn-usp-promoter .usp-promoter__heading-extension{display:flex;flex-direction:column}pn-usp-promoter .usp-promoter--right-align .usp-promoter__content{flex-direction:row-reverse;text-align:right}@media screen and (min-width: 768px){pn-usp-promoter .usp-promoter--right-align .usp-promoter__content{align-items:center}}pn-usp-promoter .usp-promoter--right-align .usp-promoter__content-wrapper{display:flex;flex-direction:column;align-items:flex-end;padding-left:0}@media screen and (min-width: 768px){pn-usp-promoter .usp-promoter--right-align .usp-promoter__content-wrapper{padding-right:4rem}}pn-usp-promoter .usp-promoter--right-align [slot=app-store],pn-usp-promoter .usp-promoter--right-align [slot=usp-buttons]{align-items:flex-end}pn-usp-promoter .usp-promoter--right-align [slot=illustration]{left:1.6rem}@media screen and (max-width: 768px){pn-usp-promoter .usp-promoter--hide-image-small-screen [slot=illustration] picture img{display:none}pn-usp-promoter .usp-promoter--hide-image-small-screen .usp-promoter__content{text-align:center}pn-usp-promoter .usp-promoter--hide-image-small-screen .usp-promoter__content-wrapper{align-items:center;padding-right:0}pn-usp-promoter .usp-promoter--hide-image-small-screen [slot=app-store],pn-usp-promoter .usp-promoter--hide-image-small-screen [slot=usp-buttons]{display:flex;flex-direction:row;justify-content:center}}";const n=p;const s=class{constructor(e){t(this,e);this.heading=null;this.headingExtension=null;this.bodyText=null;this.backgroundGradient=null;this.fullWidth=false;this.rightAlign=false;this.hideMobileImage=false}get hostElement(){return e(this)}centerMobileContent(){const t=this.hostElement.querySelector('[slot="illustration"]');if(this.hideMobileImage||t==null){return"usp-promoter--hide-image-small-screen"}return""}render(){const{fullWidth:t,rightAlign:e}=this;const p=["usp-promoter",t?"usp-promoter--full-width":"",e?"usp-promoter--right-align":""].join(" ");const n=this.headingExtension?"usp-promoter__heading-extension":"";return o(r,{key:"8974befbef406ab8ec5487b26d639c3029ca3c28"},o("div",{key:"376ab3f6277b3275166a03da05556de80401f741",class:` ${p} ${this.centerMobileContent()}`,style:{background:`${this.backgroundGradient}`}},o("div",{key:"eca02253ebcadb30f15521007faf078145e26584",class:"usp-promoter__content"},o("slot",{key:"ab1816f4edc0f7a13d2ff80ed6b494b88475892a",name:"illustration"}),o("div",{key:"eb351fd5e6493d33ec236125a45f3d3d4db94ce1",class:"usp-promoter__content-wrapper"},o("h2",{key:"f407944ee01af230a02c38555c3aef9344bd2aca",class:`usp-promoter__content-heading ${n}`},o("span",{key:"5061991946b31aab88c2ef846b1f32325a5689b9"},this.heading),this.headingExtension?o("span",null,this.headingExtension):null),o("p",{key:"89e3a84910fe0eaa5490628228548be16db8f049",class:"usp-promoter__content-text"},this.bodyText),o("slot",{key:"f743a7618e9dd439af7267615217b7feff2281df",name:"app-store"}),o("slot",{key:"6784ae05d8ef3ac0882472241a25822a345eea92",name:"usp-buttons"})))))}};s.style=n;export{s as pn_usp_promoter};
+//# sourceMappingURL=p-d07cf4c8.entry.js.map

package/pn-market-web-components/{p-87aa1f73.entry.js.map → p-d07cf4c8.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["pnUspPromoterCss","PnUspPromoterStyle0","PnUspPromoter","centerMobileContent","slot","this","hostElement","querySelector","hideMobileImage","render","fullWidth","rightAlign","classes","join","hasHeadingExtension","headingExtension","h","Host","key","class","style","background","backgroundGradient","name","heading","bodyText"],"sources":["src/components/widgets/pn-usp-promoter/pn-usp-promoter.scss?tag=pn-usp-promoter","src/components/widgets/pn-usp-promoter/pn-usp-promoter.tsx"],"sourcesContent":["@import '../../../globals/main.scss';\n\n$borderWhiteShadowSmall: 0 0 0 0.2rem #fff;\n$borderBlueShadowMedium: 0 0 0 0.4rem $blue900;\n\npn-usp-promoter {\n  width: 80%;\n\n  .usp-promoter {\n    display: flex;\n    justify-content: center;\n    padding: 3rem 0.8rem;\n  }\n\n  .usp-promoter--full-width {\n    overflow: hidden;\n    margin: 0 calc(-50vw + 50%);\n\n    @media screen and (min-width: 768px) {\n      padding: 8rem 4rem;\n    }\n  }\n\n  .usp-promoter__content {\n    display: flex;\n    flex-direction: row;\n    width: 100%;\n    max-width: 114rem;\n\n    @media screen and (min-width: 768px) {\n      align-items: center;\n      text-align: left;\n      justify-content: center;\n    }\n  }\n\n  .usp-promoter__content-wrapper {\n    display: flex;\n    flex-direction: column;\n    width: 100%;\n    max-width: 75rem;\n\n    @media screen and (min-width: 768px) {\n      align-items: flex-start;\n      padding-left: 4rem;\n    }\n  }\n\n  .usp-promoter__content-heading {\n    margin-bottom: 0.8rem;\n\n    @media screen and (min-width:768px) {\n      font-size: 4.2rem;\n    }\n\n    @media screen and (min-width:1140px) {\n      font-size: 4.8rem;\n    }\n\n    @media screen and (min-width:1440px) {\n      font-size: 5.6rem;\n    }\n  }\n\n  .usp-promoter__no-margin-bottom {\n    margin-bottom: 0 !important;\n  }\n\n  .usp-promoter__content-text {\n    font-size: 1.6rem;\n    max-width: 47rem;\n    margin-bottom: 2.6rem;\n\n    @media screen and (min-width:768px){\n      text-wrap: balance;\n    }\n\n    @media screen and (min-width:1140px) {\n      font-size: 1.8rem;\n      max-width: 60rem;\n    }\n\n    @media screen and (min-width:1440px) {\n      font-size: 2rem;\n      max-width: 70rem;\n    }\n  }\n\n  [slot='app-store'] {\n    display: flex;\n    align-items: flex-start;\n    margin-bottom: 2.6rem;\n    gap: 1rem;\n\n    & > a {\n      background-color: black;\n      border: 0.1rem solid #a6a6a6;\n      border-radius: 0.8rem;\n      color: #fff;\n      display: inline-block;\n      line-height: 0;\n      text-decoration: none;\n      transition: background-color 0.2s ease-in-out;\n\n      &::after {\n        margin-left: 0 !important;\n        margin-right: 0.5rem;\n        top: 0.2rem;\n        position: relative;\n      }\n\n      &:hover {\n        background-color: $blue900;\n      }\n\n      &:focus {\n        background-color: $blue900;\n        box-shadow: $borderWhiteShadowSmall, $borderBlueShadowMedium;\n      }\n\n      &:focus-visible {\n        outline: none;\n      }\n    }\n  }\n\n  [slot='usp-buttons'] {\n    pn-button {\n      margin-bottom: 1.6rem;\n    }\n\n    & > a {\n      color: $blue700;\n      font-weight: 500;\n      font-size: 1.6rem;\n      padding: 0.1rem;\n      text-decoration: none;\n\n      pn-icon svg {\n        transition: transform 0.3s ease-in-out;\n\n        path {\n          fill: $blue700;\n        }\n      }\n\n      &:hover {\n        pn-icon svg {\n          transition: transform 0.3s ease-in-out;\n          transform: translateX(0.3rem);\n\n          path {\n            fill: $blue700;\n          }\n        }\n      }\n    }\n  }\n\n  [slot='app-store'],\n  [slot='usp-buttons'] {\n    flex-direction: column;\n\n    @media screen and (min-width: 768px) {\n      display: flex;\n      flex-direction: row;\n      gap: 1.6rem;\n    }\n  }\n\n  [slot='illustration'] {\n    max-width: 25%;\n    position: relative;\n    left: -1.6rem;\n\n    pn-scroll {\n      position: sticky;\n      top: 0;\n    }\n\n    @media screen and (min-width: 768px) {\n      display: block;\n    }\n\n    & picture img {\n      max-width: 100%;\n\n      @media screen and (min-width: 1140px) {\n        width: 32rem;\n      }\n\n      @media screen and (min-width: 1440px) {\n        width: 33.6rem;\n      }\n    }\n  }\n\n  .usp-promoter__heading-extension {\n    display: flex;\n    flex-direction: column;\n  }\n\n  .usp-promoter--right-align {\n    .usp-promoter__content {\n      flex-direction: row-reverse;\n      text-align: right;\n\n      @media screen and (min-width: 768px) {\n        align-items: center;\n      }\n    }\n\n    .usp-promoter__content-wrapper {\n      display: flex;\n      flex-direction: column;\n      align-items: flex-end;\n      padding-left: 0;\n\n      @media screen and (min-width: 768px) {\n        padding-right: 4rem;\n      }\n    }\n\n    [slot='app-store'],\n    [slot='usp-buttons'] {\n      align-items: flex-end;\n    }\n\n    [slot='illustration'] {\n      left: 1.6rem;\n    }\n  }\n\n  .usp-promoter--hide-image-small-screen {\n    @media screen and (max-width: 768px) {\n      [slot='illustration'] picture img {\n        display: none;\n      }\n\n      .usp-promoter__content {\n        text-align: center;\n      }\n\n      .usp-promoter__content-wrapper {\n        align-items: center;\n        padding-right: 0;\n      }\n\n      [slot='app-store'],\n      [slot='usp-buttons'] {\n        display: flex;\n        flex-direction: row;\n        justify-content: center;\n      }\n    }\n  }\n}\n","import { Component, Prop, h, Host, Element } from '@stencil/core';\n\n@Component({\n  tag: 'pn-usp-promoter',\n  styleUrl: 'pn-usp-promoter.scss',\n})\nexport class PnUspPromoter {\n  @Element() hostElement: HTMLElement;\n\n  @Prop() heading: string = null;\n  @Prop() headingExtension: string = null;\n  @Prop() bodyText: string = null;\n  @Prop() backgroundGradient: string = null;\n  @Prop() fullWidth: boolean = false;\n  @Prop() rightAlign: boolean = false;\n  @Prop() hideMobileImage: boolean = false;\n\n  private centerMobileContent() {\n    const slot = this.hostElement.querySelector('[slot=\"illustration\"]');\n    if (this.hideMobileImage || slot == null) {\n      return 'usp-promoter--hide-image-small-screen';\n    }\n    return \"\";\n  }\n\n  render() {\n    const { fullWidth, rightAlign } = this;\n    const classes = [\n      'usp-promoter',\n      fullWidth ? \"usp-promoter--full-width\" : \"\",\n      rightAlign ? \"usp-promoter--right-align\" : \"\",\n    ].join(' ');\n    const hasHeadingExtension = this.headingExtension ? \"usp-promoter__heading-extension\" : \"\";\n\n    return (\n      <Host>\n        <div class={` ${classes} ${this.centerMobileContent()}`} style={{ 'background': `${this.backgroundGradient}` }}>\n          <div class=\"usp-promoter__content\">\n            <slot name=\"illustration\"></slot>\n            <div class=\"usp-promoter__content-wrapper\">\n              <h2 class={`usp-promoter__content-heading ${hasHeadingExtension}`}>\n                <span>{this.heading}</span>\n                {this.headingExtension ? <span>{this.headingExtension}</span> : null}\n              </h2>\n              <p class=\"usp-promoter__content-text\">{this.bodyText}</p>\n              <slot name=\"app-store\"></slot>\n              <slot name=\"usp-buttons\"></slot>\n            </div>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"yDAAA,MAAMA,EAAmB,q7JACzB,MAAAC,EAAeD,E,MCKFE,EAAa,M,sCAGE,K,sBACS,K,cACR,K,wBACU,K,eACR,M,gBACC,M,qBACK,K,CAE3B,mBAAAC,GACN,MAAMC,EAAOC,KAAKC,YAAYC,cAAc,yBAC5C,GAAIF,KAAKG,iBAAmBJ,GAAQ,KAAM,CACxC,MAAO,uC,CAET,MAAO,E,CAGT,MAAAK,GACE,MAAMC,UAAEA,EAASC,WAAEA,GAAeN,KAClC,MAAMO,EAAU,CACd,eACAF,EAAY,2BAA6B,GACzCC,EAAa,4BAA8B,IAC3CE,KAAK,KACP,MAAMC,EAAsBT,KAAKU,iBAAmB,kCAAoC,GAExF,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,OAAAE,IAAA,2CAAKC,MAAO,IAAIP,KAAWP,KAAKF,wBAAyBiB,MAAO,CAAEC,WAAc,GAAGhB,KAAKiB,uBACtFN,EAAA,OAAAE,IAAA,2CAAKC,MAAM,yBACTH,EAAA,QAAAE,IAAA,2CAAMK,KAAK,iBACXP,EAAA,OAAAE,IAAA,2CAAKC,MAAM,iCACTH,EAAA,MAAAE,IAAA,2CAAIC,MAAO,iCAAiCL,KAC1CE,EAAA,QAAAE,IAAA,4CAAOb,KAAKmB,SACXnB,KAAKU,iBAAmBC,EAAA,YAAOX,KAAKU,kBAA2B,MAElEC,EAAA,KAAAE,IAAA,2CAAGC,MAAM,8BAA8Bd,KAAKoB,UAC5CT,EAAA,QAAAE,IAAA,2CAAMK,KAAK,cACXP,EAAA,QAAAE,IAAA,2CAAMK,KAAK,mB","ignoreList":[]}
+{"version":3,"names":["pnUspPromoterCss","PnUspPromoterStyle0","PnUspPromoter","centerMobileContent","slot","this","hostElement","querySelector","hideMobileImage","render","fullWidth","rightAlign","classes","join","hasHeadingExtension","headingExtension","h","Host","key","class","style","background","backgroundGradient","name","heading","bodyText"],"sources":["src/components/widgets/pn-usp-promoter/pn-usp-promoter.scss?tag=pn-usp-promoter","src/components/widgets/pn-usp-promoter/pn-usp-promoter.tsx"],"sourcesContent":["@import '../../../globals/main.scss';\n\n$borderWhiteShadowSmall: 0 0 0 0.2rem #fff;\n$borderBlueShadowMedium: 0 0 0 0.4rem $blue900;\n\npn-usp-promoter {\n  width: 80%;\n\n  .usp-promoter {\n    display: flex;\n    justify-content: center;\n    padding: 3rem 0.8rem;\n  }\n\n  .usp-promoter--full-width {\n    overflow: hidden;\n    margin: 0 calc(-50vw + 50%);\n\n    @media screen and (min-width: 768px) {\n      padding: 8rem 4rem;\n    }\n  }\n\n  .usp-promoter__content {\n    display: flex;\n    flex-direction: row;\n    width: 100%;\n    max-width: 114rem;\n\n    @media screen and (min-width: 768px) {\n      align-items: center;\n      text-align: left;\n      justify-content: center;\n    }\n  }\n\n  .usp-promoter__content-wrapper {\n    display: flex;\n    flex-direction: column;\n    width: 100%;\n    max-width: 75rem;\n\n    @media screen and (min-width: 768px) {\n      align-items: flex-start;\n      padding-left: 4rem;\n    }\n  }\n\n  .usp-promoter__content-heading {\n    margin-bottom: 0.8rem;\n\n    @media screen and (min-width:768px) {\n      font-size: 4.2rem;\n    }\n\n    @media screen and (min-width:1140px) {\n      font-size: 4.8rem;\n    }\n\n    @media screen and (min-width:1440px) {\n      font-size: 5.6rem;\n    }\n  }\n\n  .usp-promoter__no-margin-bottom {\n    margin-bottom: 0 !important;\n  }\n\n  .usp-promoter__content-text {\n    font-size: 1.6rem;\n    max-width: 47rem;\n    margin-bottom: 2.6rem;\n\n    @media screen and (min-width:768px){\n      text-wrap: balance;\n    }\n\n    @media screen and (min-width:1140px) {\n      font-size: 1.8rem;\n      max-width: 60rem;\n    }\n\n    @media screen and (min-width:1440px) {\n      font-size: 2rem;\n      max-width: 70rem;\n    }\n  }\n\n  [slot='app-store'] {\n    display: flex;\n    align-items: flex-start;\n    margin-bottom: 2.6rem;\n    gap: 1rem;\n\n    & > a {\n      background-color: black;\n      border: 0.1rem solid #a6a6a6;\n      border-radius: 0.8rem;\n      color: #fff;\n      display: inline-block;\n      line-height: 0;\n      text-decoration: none;\n      transition: background-color 0.2s ease-in-out;\n\n      &::after {\n        margin-left: 0 !important;\n        margin-right: 0.5rem;\n        top: 0.2rem;\n        position: relative;\n      }\n\n      &:hover {\n        background-color: $blue900;\n      }\n\n      &:focus {\n        background-color: $blue900;\n        box-shadow: $borderWhiteShadowSmall, $borderBlueShadowMedium;\n      }\n\n      &:focus-visible {\n        outline: none;\n      }\n    }\n  }\n\n  [slot='usp-buttons'] {\n    pn-button {\n      margin-bottom: 1.6rem;\n    }\n\n    & > a {\n      color: $blue700;\n      font-weight: 500;\n      font-size: 1.6rem;\n      padding: 0.1rem;\n      text-decoration: none;\n\n      pn-icon svg {\n        transition: transform 0.3s ease-in-out;\n\n        path {\n          fill: $blue700;\n        }\n      }\n\n      &:hover {\n        pn-icon svg {\n          transition: transform 0.3s ease-in-out;\n          transform: translateX(0.3rem);\n\n          path {\n            fill: $blue700;\n          }\n        }\n      }\n    }\n  }\n\n  [slot='app-store'],\n  [slot='usp-buttons'] {\n    flex-direction: column;\n\n    @media screen and (min-width: 768px) {\n      display: flex;\n      flex-direction: row;\n      gap: 1.6rem;\n    }\n  }\n\n  [slot='illustration'] {\n    max-width: 25%;\n    position: relative;\n    left: -1.6rem;\n\n    pn-scroll {\n      position: sticky;\n      top: 0;\n    }\n\n    @media screen and (min-width: 768px) {\n      display: block;\n    }\n\n    & picture img {\n      max-width: 100%;\n\n      @media screen and (min-width: 1140px) {\n        width: 32rem;\n      }\n\n      @media screen and (min-width: 1440px) {\n        width: 33.6rem;\n      }\n    }\n  }\n\n  .usp-promoter__heading-extension {\n    display: flex;\n    flex-direction: column;\n  }\n\n  .usp-promoter--right-align {\n    .usp-promoter__content {\n      flex-direction: row-reverse;\n      text-align: right;\n\n      @media screen and (min-width: 768px) {\n        align-items: center;\n      }\n    }\n\n    .usp-promoter__content-wrapper {\n      display: flex;\n      flex-direction: column;\n      align-items: flex-end;\n      padding-left: 0;\n\n      @media screen and (min-width: 768px) {\n        padding-right: 4rem;\n      }\n    }\n\n    [slot='app-store'],\n    [slot='usp-buttons'] {\n      align-items: flex-end;\n    }\n\n    [slot='illustration'] {\n      left: 1.6rem;\n    }\n  }\n\n  .usp-promoter--hide-image-small-screen {\n    @media screen and (max-width: 768px) {\n      [slot='illustration'] picture img {\n        display: none;\n      }\n\n      .usp-promoter__content {\n        text-align: center;\n      }\n\n      .usp-promoter__content-wrapper {\n        align-items: center;\n        padding-right: 0;\n      }\n\n      [slot='app-store'],\n      [slot='usp-buttons'] {\n        display: flex;\n        flex-direction: row;\n        justify-content: center;\n      }\n    }\n  }\n}\n","import { Component, Prop, h, Host, Element } from '@stencil/core';\n\n@Component({\n  tag: 'pn-usp-promoter',\n  styleUrl: 'pn-usp-promoter.scss',\n})\nexport class PnUspPromoter {\n  @Element() hostElement: HTMLElement;\n\n  @Prop() heading: string = null;\n  @Prop() headingExtension: string = null;\n  @Prop() bodyText: string = null;\n  @Prop() backgroundGradient: string = null;\n  @Prop() fullWidth: boolean = false;\n  @Prop() rightAlign: boolean = false;\n  @Prop() hideMobileImage: boolean = false;\n\n  private centerMobileContent() {\n    const slot = this.hostElement.querySelector('[slot=\"illustration\"]');\n    if (this.hideMobileImage || slot == null) {\n      return 'usp-promoter--hide-image-small-screen';\n    }\n    return \"\";\n  }\n\n  render() {\n    const { fullWidth, rightAlign } = this;\n    const classes = [\n      'usp-promoter',\n      fullWidth ? \"usp-promoter--full-width\" : \"\",\n      rightAlign ? \"usp-promoter--right-align\" : \"\",\n    ].join(' ');\n    const hasHeadingExtension = this.headingExtension ? \"usp-promoter__heading-extension\" : \"\";\n\n    return (\n      <Host>\n        <div class={` ${classes} ${this.centerMobileContent()}`} style={{ 'background': `${this.backgroundGradient}` }}>\n          <div class=\"usp-promoter__content\">\n            <slot name=\"illustration\"></slot>\n            <div class=\"usp-promoter__content-wrapper\">\n              <h2 class={`usp-promoter__content-heading ${hasHeadingExtension}`}>\n                <span>{this.heading}</span>\n                {this.headingExtension ? <span>{this.headingExtension}</span> : null}\n              </h2>\n              <p class=\"usp-promoter__content-text\">{this.bodyText}</p>\n              <slot name=\"app-store\"></slot>\n              <slot name=\"usp-buttons\"></slot>\n            </div>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"yDAAA,MAAMA,EAAmB,q7JACzB,MAAAC,EAAeD,E,MCKFE,EAAa,M,sCAGE,K,sBACS,K,cACR,K,wBACU,K,eACR,M,gBACC,M,qBACK,K,kCAE3B,mBAAAC,GACN,MAAMC,EAAOC,KAAKC,YAAYC,cAAc,yBAC5C,GAAIF,KAAKG,iBAAmBJ,GAAQ,KAAM,CACxC,MAAO,uC,CAET,MAAO,E,CAGT,MAAAK,GACE,MAAMC,UAAEA,EAASC,WAAEA,GAAeN,KAClC,MAAMO,EAAU,CACd,eACAF,EAAY,2BAA6B,GACzCC,EAAa,4BAA8B,IAC3CE,KAAK,KACP,MAAMC,EAAsBT,KAAKU,iBAAmB,kCAAoC,GAExF,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,OAAAE,IAAA,2CAAKC,MAAO,IAAIP,KAAWP,KAAKF,wBAAyBiB,MAAO,CAAEC,WAAc,GAAGhB,KAAKiB,uBACtFN,EAAA,OAAAE,IAAA,2CAAKC,MAAM,yBACTH,EAAA,QAAAE,IAAA,2CAAMK,KAAK,iBACXP,EAAA,OAAAE,IAAA,2CAAKC,MAAM,iCACTH,EAAA,MAAAE,IAAA,2CAAIC,MAAO,iCAAiCL,KAC1CE,EAAA,QAAAE,IAAA,4CAAOb,KAAKmB,SACXnB,KAAKU,iBAAmBC,EAAA,YAAOX,KAAKU,kBAA2B,MAElEC,EAAA,KAAAE,IAAA,2CAAGC,MAAM,8BAA8Bd,KAAKoB,UAC5CT,EAAA,QAAAE,IAAA,2CAAMK,KAAK,cACXP,EAAA,QAAAE,IAAA,2CAAMK,KAAK,mB","ignoreList":[]}

package/pn-market-web-components/p-d40ff187.entry.js

@@ -0,0 +1,2 @@
+import{r as t,c as i,g as e,h as s,d as n}from"./p-06555615.js";import{d as l}from"./p-aed52bc1.js";import{m as h}from"./p-b2f2fbb6.js";const a="pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}pn-dropdown-with-multi-input-rows-row .input-element-row{display:flex;gap:1rem;margin-bottom:1rem}pn-dropdown-with-multi-input-rows-row .input-element-row .input-container{width:30%}pn-dropdown-with-multi-input-rows-row .input-element-row .input-container pn-marketweb-input .input-container{width:100%}pn-dropdown-with-multi-input-rows-row .input-element-row .input-container pn-date-picker{width:100%}pn-dropdown-with-multi-input-rows-row .input-element-row .input-container .input-element-message-container{margin-top:0.3rem}pn-dropdown-with-multi-input-rows-row .input-element-row .input-container .input-element-message-container__error{color:red;line-height:1}pn-dropdown-with-multi-input-rows-row .input-element-row .input-container .input-element-message-container__warning{line-height:1}pn-dropdown-with-multi-input-rows-row .delete-button-contianer{margin-top:0.6rem}";const r=a;const u=class{constructor(e){t(this,e);this.rowValueChange=i(this,"rowValueChange",7);this.deleteRowEvent=i(this,"deleteRowEvent",7);this.firstInputChange=i(this,"firstInputChange",7);this.secondInputChange=i(this,"secondInputChange",7);this.languageCode=null;this.fristInputPlaceholder=null;this.firstInputMin=null;this.firstInputMax=null;this.firstInputWarning=null;this.firstInputWarningText=null;this.firstInputLowErrorText=null;this.firstInputHighErrorText=null;this.secondInputPlaceholder=null;this.secondInputMin=null;this.secondInputMax=null;this.secondInputWarning=null;this.secondInputWarningText=null;this.secondInputLowErrorText=null;this.secondInputHighErrorText=null;this.dateLabel=null;this.datePlaceholder=null;this.firstValidDate=null;this.lastValidDate=null;this.predefinedValue=null;this.rowIndex=null;this.minRowCount=null;this.showFirstInputWarning=false;this.showFirstInputLowError=false;this.showFirstInputHighError=false;this.showSecondInputWarning=false;this.showSecondInputLowError=false;this.showSecondInputHighError=false;this.firstInputValue="";this.secondInputValue="";this.dateValue=""}get hostElement(){return e(this)}_predefinedValue;pnFirstInputField=null;pnSecondInputField=null;pnDatePicker=null;pnDeleteRowButton=null;rowValueChange;deleteRowEvent;firstInputChange;secondInputChange;componentWillLoad(){this.getPredefinedValues();this.setInitialValues()}componentDidLoad(){this.addEventHandlers()}getPredefinedValues(){this._predefinedValue=JSON.parse(this.predefinedValue)}applyPredefinedValue(){this.getPredefinedValues();this.setInitialValues();if(this.firstInputValue?.length){this.validateFirstInput(parseInt(this.firstInputValue))}if(this.secondInputValue?.length){this.validateSecondInput(parseInt(this.secondInputValue))}if(this.rowIndex>=this.minRowCount){this.pnDeleteRowButton.addEventListener("click",this.deleteRow.bind(this))}}setInitialValues(){this.firstInputValue=this._predefinedValue.firstInput;this.secondInputValue=this._predefinedValue.secondInput;this.dateValue=this._predefinedValue.date}addEventHandlers(){const t=l(this.emitRowValues.bind(this),500);this.pnFirstInputField.addEventListener("keyup",l(this.handleFirstInput.bind(this),500));this.pnSecondInputField.addEventListener("keyup",l(this.handleSecondInput.bind(this),500));this.pnDatePicker.addEventListener("dateselection",this.handleDateChange.bind(this));this.pnDatePicker.addEventListener("dateselection",t)}handleFirstInput(t){const i=t.target;const e=parseInt(i.value);if(e>0){this.firstInputValue=i.value;this.firstInputChange.emit({id:this._predefinedValue.id,firstInput:this.firstInputValue,secondInput:this.secondInputValue,date:this.dateValue})}this.validateFirstInput(e);this.emitRowValues()}handleSecondInput(t){const i=t.target;const e=parseInt(i.value);if(e>0){this.secondInputValue=i.value;this.secondInputChange.emit({id:this._predefinedValue.id,firstInput:this.firstInputValue,secondInput:this.secondInputValue,date:this.dateValue})}this.validateSecondInput(e);this.emitRowValues()}validateFirstInput(t){this.showFirstInputWarning=false;this.showFirstInputLowError=false;this.showFirstInputHighError=false;if(t<this.firstInputWarning){this.showFirstInputWarning=true}if(t<this.firstInputMin){this.showFirstInputWarning=false;this.showFirstInputLowError=true}if(t>this.firstInputMax){this.showFirstInputWarning=false;this.showFirstInputLowError=false;this.showFirstInputHighError=true}}validateSecondInput(t){this.showSecondInputWarning=false;this.showSecondInputLowError=false;this.showSecondInputHighError=false;if(t<this.secondInputWarning){this.showSecondInputWarning=true}if(t<this.secondInputMin){this.showSecondInputWarning=false;this.showSecondInputLowError=true}if(t>this.secondInputMax){this.showSecondInputWarning=false;this.showSecondInputLowError=false;this.showSecondInputHighError=true}}handleDateChange(t){const i=t.target;if(i===this.pnDatePicker){this.dateValue=t.detail}}emitRowValues(){this.rowValueChange.emit({id:this._predefinedValue.id,firstInput:this.firstInputValue,secondInput:this.secondInputValue,date:this.dateValue})}deleteRow(){this.deleteRowEvent.emit(this._predefinedValue.id)}render(){return s(n,{key:"101265b9e24ada0da3199690b2c2f56cfd7d6a00"},s("div",{key:"fed264cfb3a052b3b2b5b26d2484e9787eaa3d36",class:"input-element-row"},s("div",{key:"6161953b428a44b37defc7c3e2d6a95d79845c36",class:"input-container"},s("pn-marketweb-input",{key:"7e155be4887029e727ac78380ab5783ce50301d4",ref:t=>this.pnFirstInputField=t,type:"number",placeholder:this.fristInputPlaceholder,value:this.firstInputValue,min:"1"}),this.showFirstInputLowError||this.showFirstInputHighError||this.showFirstInputWarning?s("div",{class:"input-element-message-container"},this.showFirstInputLowError?s("div",{class:"input-element-message-container__error"},s("small",null,this.firstInputLowErrorText)):null,this.showFirstInputHighError?s("div",{class:"input-element-message-container__error"},s("small",null,this.firstInputHighErrorText)):null,this.showFirstInputWarning?s("div",{class:"input-element-message-container__warning"},s("small",null,this.firstInputWarningText)):null):null),s("div",{key:"1bad690de5ffe9e79c18614bcd3224d9fb5940fe",class:"input-container"},s("pn-marketweb-input",{key:"7894824d20d159e2a03f131d3e348f06e7ce67a4",ref:t=>this.pnSecondInputField=t,type:"number",placeholder:this.secondInputPlaceholder,value:this.secondInputValue,min:"1"}),this.showSecondInputLowError||this.showSecondInputHighError||this.showSecondInputWarning?s("div",{class:"input-element-message-container"},this.showSecondInputLowError?s("div",{class:"input-element-message-container__error"},s("small",null,this.secondInputLowErrorText)):null,this.showSecondInputHighError?s("div",{class:"input-element-message-container__error"},s("small",null,this.secondInputHighErrorText)):null,this.showSecondInputWarning?s("div",{class:"input-element-message-container__warning"},s("small",null,this.secondInputWarningText)):null):null),s("div",{key:"209e5aa157272445cb02f7634d7b503b8be34a48",class:"input-container"},s("pn-date-picker",{key:"e284c5c8ef3eebed689d9bd3f7ec29c11d51190d",ref:t=>this.pnDatePicker=t,range:"false","disable-weekends":true,"min-date":this.firstValidDate,"max-date":this.lastValidDate,language:this.languageCode,placeholder:this.datePlaceholder,start:this.dateValue?.length?this.dateValue:null})),this.rowIndex>=this.minRowCount?s("div",{class:"delete-button-contianer"},s("pn-button",{ref:t=>this.pnDeleteRowButton=t,small:"true",icon:h,appearance:"warning",index:this.rowIndex,onClick:()=>{this.deleteRow()}},"Delete")):null))}static get watchers(){return{predefinedValue:["applyPredefinedValue"]}}};u.style=r;export{u as pn_dropdown_with_multi_input_rows_row};
+//# sourceMappingURL=p-d40ff187.entry.js.map

package/pn-market-web-components/p-d40ff187.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["pnDropdownWithMultiInputRowsRowCss","PnDropdownWithMultiInputRowsRowStyle0","PnDropdownWithMultiInputRowsRow","_predefinedValue","pnFirstInputField","pnSecondInputField","pnDatePicker","pnDeleteRowButton","rowValueChange","deleteRowEvent","firstInputChange","secondInputChange","componentWillLoad","this","getPredefinedValues","setInitialValues","componentDidLoad","addEventHandlers","JSON","parse","predefinedValue","applyPredefinedValue","firstInputValue","length","validateFirstInput","parseInt","secondInputValue","validateSecondInput","rowIndex","minRowCount","addEventListener","deleteRow","bind","firstInput","secondInput","dateValue","date","emmitValues","debounce","emitRowValues","handleFirstInput","handleSecondInput","handleDateChange","e","elm","target","value","emit","id","input","showFirstInputWarning","showFirstInputLowError","showFirstInputHighError","firstInputWarning","firstInputMin","firstInputMax","showSecondInputWarning","showSecondInputLowError","showSecondInputHighError","secondInputWarning","secondInputMin","secondInputMax","detail","render","h","Host","key","class","ref","el","type","placeholder","fristInputPlaceholder","min","firstInputLowErrorText","firstInputHighErrorText","firstInputWarningText","secondInputPlaceholder","secondInputLowErrorText","secondInputHighErrorText","secondInputWarningText","range","firstValidDate","lastValidDate","language","languageCode","datePlaceholder","start","small","icon","minus","appearance","index","onClick"],"sources":["src/components/input/pn-dropdown-with-multi-input-rows/pn-dropdown-with-multi-input-rows-row.scss?tag=pn-dropdown-with-multi-input-rows-row","src/components/input/pn-dropdown-with-multi-input-rows/pn-dropdown-with-multi-input-rows-row.tsx"],"sourcesContent":["@import '../../../globals/main.scss';\n\npn-dropdown-with-multi-input-rows-row {\n  .input-element-row {\n    display: flex;\n    gap: 1rem;\n    margin-bottom: 1rem;\n\n    .input-container {\n      width: 30%;\n\n      pn-marketweb-input {\n        .input-container {\n          width: 100%;\n        }\n      }\n\n      pn-date-picker {\n        width: 100%;\n      }\n\n      .input-element-message-container {\n        margin-top: 0.3rem;\n        &__error {\n          color: red;\n          line-height: 1;\n        }\n\n        &__warning {\n          line-height: 1;\n        }\n      }\n    }\n  }\n\n  .delete-button-contianer {\n    margin-top: 0.6rem;\n  }\n}\n","import { Component, Prop, h, Element, State, Host, Watch, Event, EventEmitter, Listen } from '@stencil/core';\nimport { FormValue, RowValue, Root, PredefinedValues } from './types';\nimport debounce from 'debounce';\nimport { minus } from 'pn-design-assets/pn-assets/icons.js';\n\n@Component({\n  tag: 'pn-dropdown-with-multi-input-rows-row',\n  styleUrl: 'pn-dropdown-with-multi-input-rows-row.scss',\n})\nexport class PnDropdownWithMultiInputRowsRow {\n  @Element() hostElement: Element;\n  private _predefinedValue: PredefinedValues;\n  pnFirstInputField: HTMLElement = null;\n  pnSecondInputField: HTMLElement = null;\n  pnDatePicker: HTMLElement = null;\n  pnDeleteRowButton: HTMLElement = null;\n\n  @Prop() languageCode: string = null;\n  @Prop() fristInputPlaceholder: string = null;\n  @Prop() firstInputMin: number = null;\n  @Prop() firstInputMax: number = null;\n  @Prop() firstInputWarning: number = null;\n  @Prop() firstInputWarningText: string = null;\n  @Prop() firstInputLowErrorText: string = null;\n  @Prop() firstInputHighErrorText: string = null;\n  @Prop() secondInputPlaceholder: string = null;\n  @Prop() secondInputMin: number = null;\n  @Prop() secondInputMax: number = null;\n  @Prop() secondInputWarning: number = null;\n  @Prop() secondInputWarningText: string = null;\n  @Prop() secondInputLowErrorText: string = null;\n  @Prop() secondInputHighErrorText: string = null;\n  @Prop() dateLabel: string = null;\n  @Prop() datePlaceholder: string = null;\n  @Prop() firstValidDate: string = null;\n  @Prop() lastValidDate: string = null;\n  @Prop() predefinedValue: string = null;\n  @Prop() rowIndex: number = null;\n  @Prop() minRowCount: number = null;\n\n  @State() showFirstInputWarning: boolean = false;\n  @State() showFirstInputLowError: boolean = false;\n  @State() showFirstInputHighError: boolean = false;\n  @State() showSecondInputWarning: boolean = false;\n  @State() showSecondInputLowError: boolean = false;\n  @State() showSecondInputHighError: boolean = false;\n\n  @State() firstInputValue: string = '';\n  @State() secondInputValue: string = '';\n  @State() dateValue: string = '';\n\n  @Event() rowValueChange: EventEmitter<PredefinedValues>;\n  @Event() deleteRowEvent: EventEmitter<string>;\n  @Event() firstInputChange: EventEmitter<PredefinedValues>;\n  @Event() secondInputChange: EventEmitter<PredefinedValues>;\n\n  componentWillLoad() {\n    this.getPredefinedValues();\n    this.setInitialValues();\n  }\n\n  componentDidLoad() {\n    this.addEventHandlers();\n  }\n\n  getPredefinedValues() {\n    this._predefinedValue = JSON.parse(this.predefinedValue);\n  }\n\n  @Watch('predefinedValue')\n  applyPredefinedValue() {\n    this.getPredefinedValues();\n    this.setInitialValues();\n\n    if (this.firstInputValue?.length) {\n      this.validateFirstInput(parseInt(this.firstInputValue));\n    }\n\n    if (this.secondInputValue?.length) {\n      this.validateSecondInput(parseInt(this.secondInputValue));\n    }\n\n    if (this.rowIndex >= this.minRowCount) {\n      this.pnDeleteRowButton.addEventListener('click', this.deleteRow.bind(this));\n    }\n  }\n\n  setInitialValues() {\n    this.firstInputValue = this._predefinedValue.firstInput;\n    this.secondInputValue = this._predefinedValue.secondInput;\n    this.dateValue = this._predefinedValue.date;\n  }\n\n  addEventHandlers() {\n    const emmitValues = debounce(this.emitRowValues.bind(this), 500);\n    this.pnFirstInputField.addEventListener('keyup', debounce(this.handleFirstInput.bind(this), 500));\n    this.pnSecondInputField.addEventListener('keyup', debounce(this.handleSecondInput.bind(this), 500));\n    this.pnDatePicker.addEventListener('dateselection', this.handleDateChange.bind(this));\n    this.pnDatePicker.addEventListener('dateselection', emmitValues);\n  }\n\n  handleFirstInput(e) {\n    const elm = e.target;\n    const value = parseInt(elm.value);\n\n    if (value > 0) {\n      this.firstInputValue = elm.value;\n      this.firstInputChange.emit({\n        id: this._predefinedValue.id,\n        firstInput: this.firstInputValue,\n        secondInput: this.secondInputValue,\n        date: this.dateValue,\n      });\n    }\n\n    this.validateFirstInput(value);\n    this.emitRowValues();\n  }\n\n  handleSecondInput(e) {\n    const elm = e.target;\n    const value = parseInt(elm.value);\n\n    if (value > 0) {\n      this.secondInputValue = elm.value;\n      this.secondInputChange.emit({\n        id: this._predefinedValue.id,\n        firstInput: this.firstInputValue,\n        secondInput: this.secondInputValue,\n        date: this.dateValue,\n      });\n    }\n\n    this.validateSecondInput(value);\n    this.emitRowValues();\n  }\n\n  validateFirstInput(input: number) {\n    this.showFirstInputWarning = false;\n    this.showFirstInputLowError = false;\n    this.showFirstInputHighError = false;\n\n    if (input < this.firstInputWarning) {\n      this.showFirstInputWarning = true;\n    }\n\n    if (input < this.firstInputMin) {\n      this.showFirstInputWarning = false;\n      this.showFirstInputLowError = true;\n    }\n\n    if (input > this.firstInputMax) {\n      this.showFirstInputWarning = false;\n      this.showFirstInputLowError = false;\n      this.showFirstInputHighError = true;\n    }\n  }\n\n  validateSecondInput(input: number) {\n    this.showSecondInputWarning = false;\n    this.showSecondInputLowError = false;\n    this.showSecondInputHighError = false;\n\n    if (input < this.secondInputWarning) {\n      this.showSecondInputWarning = true;\n    }\n\n    if (input < this.secondInputMin) {\n      this.showSecondInputWarning = false;\n      this.showSecondInputLowError = true;\n    }\n\n    if (input > this.secondInputMax) {\n      this.showSecondInputWarning = false;\n      this.showSecondInputLowError = false;\n      this.showSecondInputHighError = true;\n    }\n  }\n\n  handleDateChange(e) {\n    const elm = e.target;\n    if (elm === this.pnDatePicker) {\n      this.dateValue = e.detail;\n    }\n  }\n\n  emitRowValues() {\n    this.rowValueChange.emit({\n      id: this._predefinedValue.id,\n      firstInput: this.firstInputValue,\n      secondInput: this.secondInputValue,\n      date: this.dateValue,\n    });\n  }\n\n  deleteRow() {\n    this.deleteRowEvent.emit(this._predefinedValue.id);\n  }\n\n  render() {\n    return (\n      <Host>\n        <div class=\"input-element-row\">\n          <div class=\"input-container\">\n            <pn-marketweb-input\n              ref={el => (this.pnFirstInputField = el as HTMLElement)}\n              type=\"number\"\n              placeholder={this.fristInputPlaceholder}\n              value={this.firstInputValue}\n              min=\"1\"\n            ></pn-marketweb-input>\n            {this.showFirstInputLowError || this.showFirstInputHighError || this.showFirstInputWarning ? (\n              <div class=\"input-element-message-container\">\n                {this.showFirstInputLowError ? (\n                  <div class=\"input-element-message-container__error\">\n                    <small>{this.firstInputLowErrorText}</small>\n                  </div>\n                ) : null}\n\n                {this.showFirstInputHighError ? (\n                  <div class=\"input-element-message-container__error\">\n                    <small>{this.firstInputHighErrorText}</small>\n                  </div>\n                ) : null}\n\n                {this.showFirstInputWarning ? (\n                  <div class=\"input-element-message-container__warning\">\n                    <small>{this.firstInputWarningText}</small>\n                  </div>\n                ) : null}\n              </div>\n            ) : null}\n          </div>\n\n          <div class=\"input-container\">\n            <pn-marketweb-input\n              ref={el => (this.pnSecondInputField = el as HTMLElement)}\n              type=\"number\"\n              placeholder={this.secondInputPlaceholder}\n              value={this.secondInputValue}\n              min=\"1\"\n            ></pn-marketweb-input>\n            {this.showSecondInputLowError || this.showSecondInputHighError || this.showSecondInputWarning ? (\n              <div class=\"input-element-message-container\">\n                {this.showSecondInputLowError ? (\n                  <div class=\"input-element-message-container__error\">\n                    <small>{this.secondInputLowErrorText}</small>\n                  </div>\n                ) : null}\n\n                {this.showSecondInputHighError ? (\n                  <div class=\"input-element-message-container__error\">\n                    <small>{this.secondInputHighErrorText}</small>\n                  </div>\n                ) : null}\n\n                {this.showSecondInputWarning ? (\n                  <div class=\"input-element-message-container__warning\">\n                    <small>{this.secondInputWarningText}</small>\n                  </div>\n                ) : null}\n              </div>\n            ) : null}\n          </div>\n\n          <div class=\"input-container\">\n            <pn-date-picker\n              ref={el => (this.pnDatePicker = el as HTMLElement)}\n              range=\"false\"\n              disable-weekends={true}\n              min-date={this.firstValidDate}\n              max-date={this.lastValidDate}\n              language={this.languageCode}\n              placeholder={this.datePlaceholder}\n              start={this.dateValue?.length ? this.dateValue : null}\n            ></pn-date-picker>\n          </div>\n\n          {this.rowIndex >= this.minRowCount ? (\n            <div class=\"delete-button-contianer\">\n              <pn-button\n                ref={el => (this.pnDeleteRowButton = el as HTMLElement)}\n                small=\"true\"\n                icon={minus}\n                appearance=\"warning\"\n                index={this.rowIndex}\n                onClick={() => {\n                  this.deleteRow();\n                }}\n              >\n                Delete\n              </pn-button>\n            </div>\n          ) : null}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/pn-market-web-components/{p-f21fdae0.entry.js → p-e42f0fbe.entry.js}

@@ -1,2 +1,2 @@
-import{r as e,h as n,d as i,g as r}from"./p-06555615.js";const a="pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}pn-line-shape .pn-line-shape__container{display:flex}pn-line-shape .pn-line-shape__line{border-style:solid;border-width:0.4rem;border-radius:1.6rem;border-color:#00a0d6}pn-line-shape .pn-line-shape__dot{width:0.8rem;border-style:solid;border-width:0.4rem;border-radius:1.6rem;height:0.8rem;border-color:#00a0d6}pn-line-shape[slot=horizontal-line] .pn-line-shape__container{flex-direction:row;flex-wrap:nowrap;width:100%;gap:0.8rem;padding:2.4rem 0}pn-line-shape[slot=horizontal-line] .pn-line-shape__line{height:0.8rem;width:100%}pn-line-shape[slot=vertical-line] .pn-line-shape__container{height:100%;flex-direction:column;gap:0.8rem;padding:0.8rem 0.5rem}pn-line-shape[slot=vertical-line] .pn-line-shape__line{height:100%;width:0.8rem}";const l=a;const p=class{constructor(n){e(this,n)}render(){return n(i,{key:"6f7804eed509b1f396fabdcd82154bbc0ff35a7c"},n("div",{key:"63fb1b9e18eb96f7618dfe8bda1731c8c8e1aa0f",class:"pn-line-shape__container"},n("canvas",{key:"88bc355c48871838e141fccddab97203bb020edc",class:"pn-line-shape__line"}),n("canvas",{key:"b1836cc1f1520d7e780d82568028caeb47d0dd1b",class:"pn-line-shape__dot"})))}get hostElement(){return r(this)}};p.style=l;export{p as pn_line_shape};
-//# sourceMappingURL=p-f21fdae0.entry.js.map
+import{r as e,g as n,h as i,d as r}from"./p-06555615.js";const a="pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}pn-line-shape .pn-line-shape__container{display:flex}pn-line-shape .pn-line-shape__line{border-style:solid;border-width:0.4rem;border-radius:1.6rem;border-color:#00a0d6}pn-line-shape .pn-line-shape__dot{width:0.8rem;border-style:solid;border-width:0.4rem;border-radius:1.6rem;height:0.8rem;border-color:#00a0d6}pn-line-shape[slot=horizontal-line] .pn-line-shape__container{flex-direction:row;flex-wrap:nowrap;width:100%;gap:0.8rem;padding:2.4rem 0}pn-line-shape[slot=horizontal-line] .pn-line-shape__line{height:0.8rem;width:100%}pn-line-shape[slot=vertical-line] .pn-line-shape__container{height:100%;flex-direction:column;gap:0.8rem;padding:0.8rem 0.5rem}pn-line-shape[slot=vertical-line] .pn-line-shape__line{height:100%;width:0.8rem}";const l=a;const p=class{constructor(n){e(this,n)}get hostElement(){return n(this)}render(){return i(r,{key:"6f7804eed509b1f396fabdcd82154bbc0ff35a7c"},i("div",{key:"63fb1b9e18eb96f7618dfe8bda1731c8c8e1aa0f",class:"pn-line-shape__container"},i("canvas",{key:"88bc355c48871838e141fccddab97203bb020edc",class:"pn-line-shape__line"}),i("canvas",{key:"b1836cc1f1520d7e780d82568028caeb47d0dd1b",class:"pn-line-shape__dot"})))}};p.style=l;export{p as pn_line_shape};
+//# sourceMappingURL=p-e42f0fbe.entry.js.map

package/pn-market-web-components/{p-f21fdae0.entry.js.map → p-e42f0fbe.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["pnLineShapeCss","PnLineShapeStyle0","PnLineShape","render","h","Host","key","class"],"sources":["src/components/cards/pn-quote-card/pn-line-shape/pn-line-shape.scss?tag=pn-line-shape","src/components/cards/pn-quote-card/pn-line-shape/pn-line-shape.tsx"],"sourcesContent":["@import '../../../../globals/main';\n\npn-line-shape {\n  .pn-line-shape__container {\n    display: flex;\n  }\n\n  .pn-line-shape__line {\n    border-style: solid;\n    border-width: 0.4rem;\n    border-radius: 1.6rem;\n\n    border-color: $blue400;\n  }\n\n  .pn-line-shape__dot {\n    width: 0.8rem;\n    border-style: solid;\n    border-width: 0.4rem;\n    border-radius: 1.6rem;\n    height: 0.8rem;\n    border-color: $blue400;\n  }\n}\n\npn-line-shape[slot='horizontal-line'] {\n  .pn-line-shape__container {\n    flex-direction: row;\n    flex-wrap: nowrap;\n    width: 100%;\n    gap: 0.8rem;\n    padding: 2.4rem 0;\n  }\n\n  .pn-line-shape__line {\n    height: 0.8rem;\n    width: 100%;\n  }\n  .pn-line-shape__dot {\n  }\n}\n\npn-line-shape[slot='vertical-line'] {\n  .pn-line-shape__container {\n    height: 100%;\n    flex-direction: column;\n    gap: 0.8rem;\n    padding: 0.8rem 0.5rem;\n  }\n\n  .pn-line-shape__line {\n    height: 100%;\n    width: 0.8rem;\n  }\n}\n","import { Component, Element, h, Host } from '@stencil/core';\n\n@Component({\n  tag: 'pn-line-shape',\n  styleUrl: 'pn-line-shape.scss',\n})\nexport class PnLineShape {\n  @Element() hostElement: HTMLElement;\n  //props\n\n  render() {\n    return (\n      <Host>\n        <div class=\"pn-line-shape__container\">\n          <canvas class=\"pn-line-shape__line\"></canvas>\n          <canvas class=\"pn-line-shape__dot\"></canvas>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"yDAAA,MAAMA,EAAiB,mzBACvB,MAAAC,EAAeD,E,MCKFE,EAAW,M,yBAItB,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,OAAAE,IAAA,2CAAKC,MAAM,4BACTH,EAAA,UAAAE,IAAA,2CAAQC,MAAM,wBACdH,EAAA,UAAAE,IAAA,2CAAQC,MAAM,wB","ignoreList":[]}
+{"version":3,"names":["pnLineShapeCss","PnLineShapeStyle0","PnLineShape","render","h","Host","key","class"],"sources":["src/components/cards/pn-quote-card/pn-line-shape/pn-line-shape.scss?tag=pn-line-shape","src/components/cards/pn-quote-card/pn-line-shape/pn-line-shape.tsx"],"sourcesContent":["@import '../../../../globals/main';\n\npn-line-shape {\n  .pn-line-shape__container {\n    display: flex;\n  }\n\n  .pn-line-shape__line {\n    border-style: solid;\n    border-width: 0.4rem;\n    border-radius: 1.6rem;\n\n    border-color: $blue400;\n  }\n\n  .pn-line-shape__dot {\n    width: 0.8rem;\n    border-style: solid;\n    border-width: 0.4rem;\n    border-radius: 1.6rem;\n    height: 0.8rem;\n    border-color: $blue400;\n  }\n}\n\npn-line-shape[slot='horizontal-line'] {\n  .pn-line-shape__container {\n    flex-direction: row;\n    flex-wrap: nowrap;\n    width: 100%;\n    gap: 0.8rem;\n    padding: 2.4rem 0;\n  }\n\n  .pn-line-shape__line {\n    height: 0.8rem;\n    width: 100%;\n  }\n  .pn-line-shape__dot {\n  }\n}\n\npn-line-shape[slot='vertical-line'] {\n  .pn-line-shape__container {\n    height: 100%;\n    flex-direction: column;\n    gap: 0.8rem;\n    padding: 0.8rem 0.5rem;\n  }\n\n  .pn-line-shape__line {\n    height: 100%;\n    width: 0.8rem;\n  }\n}\n","import { Component, Element, h, Host } from '@stencil/core';\n\n@Component({\n  tag: 'pn-line-shape',\n  styleUrl: 'pn-line-shape.scss',\n})\nexport class PnLineShape {\n  @Element() hostElement: HTMLElement;\n  //props\n\n  render() {\n    return (\n      <Host>\n        <div class=\"pn-line-shape__container\">\n          <canvas class=\"pn-line-shape__line\"></canvas>\n          <canvas class=\"pn-line-shape__dot\"></canvas>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"yDAAA,MAAMA,EAAiB,mzBACvB,MAAAC,EAAeD,E,MCKFE,EAAW,M,0DAItB,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,OAAAE,IAAA,2CAAKC,MAAM,4BACTH,EAAA,UAAAE,IAAA,2CAAQC,MAAM,wBACdH,EAAA,UAAAE,IAAA,2CAAQC,MAAM,wB","ignoreList":[]}

package/pn-market-web-components/{p-4f2a7d41.entry.js → p-e4c7aaec.entry.js}

@@ -1,2 +1,2 @@
-import{r as e,h as a,d as t,g as o}from"./p-06555615.js";const n="pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}pn-quote-card .pn-quote-card__container{margin:0 auto;display:flex;flex-direction:row;min-height:262px;padding:0 2.4rem}pn-quote-card .pn-quote-card__quote__container{padding:0 3.2rem}pn-quote-card .pn-quote-card__quote{position:relative;font-weight:400;font-size:2rem;line-height:140%;margin:0}pn-quote-card .pn-quote-card__quote svg{position:absolute;left:-3.2rem;top:0.2rem}pn-quote-card .pn-quote-card__reference__container{display:flex;flex-direction:row;justify-content:flex-start;gap:1.6rem;align-items:center}pn-quote-card .pn-quote-card__reference__name{display:block;font-weight:400;font-size:2.4rem;line-height:2.9rem}pn-quote-card .pn-quote-card__reference__occupation{display:block;font-weight:400;font-size:1.4rem;line-height:1.7rem}pn-quote-card [slot=illustration]{padding:0}pn-quote-card [slot=illustration-big]{padding:0.8rem 0}pn-quote-card [slot=illustration],pn-quote-card [slot=illustration-big]{aspect-ratio:1/1}pn-quote-card [slot=illustration] picture,pn-quote-card [slot=illustration-big] picture{aspect-ratio:1/1}pn-quote-card [slot=illustration] picture img,pn-quote-card [slot=illustration-big] picture img{clip-path:circle(50%);max-width:unset}pn-quote-card [slot=horizontal-line],pn-quote-card [slot=vertical-line]{display:flex}pn-quote-card[data-line-color=white] .pn-quote-card__section{background-color:#005d92;color:#ffffff}pn-quote-card[data-line-color=white] .pn-line-shape__line,pn-quote-card[data-line-color=white] .pn-line-shape__dot{border-color:#ffffff;background-color:#ffffff}pn-quote-card[data-line-color=white] .pn-quote-card__quote svg>path{fill:#ffffff}pn-quote-card[data-line-color=blue] .pn-quote-card__section{background-color:#ffffff}pn-quote-card[data-line-color=blue] .pn-line-shape__line,pn-quote-card[data-line-color=blue] .pn-line-shape__dot{border-color:#00a0d6;background-color:#00a0d6}pn-quote-card[data-line-color=blue] .pn-quote-card__quote svg>path{fill:#00a0d6}pn-quote-card[data-line-color=blue900] .pn-quote-card__section{background-color:#ffffff}pn-quote-card[data-line-color=blue900] .pn-line-shape__line,pn-quote-card[data-line-color=blue900] .pn-line-shape__dot{border-color:#0d234b;background-color:#0d234b}pn-quote-card[data-line-color=blue900] .pn-quote-card__quote svg>path{fill:#0d234b}pn-quote-card[data-card-style=standalone][data-line-color=white] .pn-quote-card__section{border-radius:2.4rem}pn-quote-card[data-card-style=standalone][data-line-color=white] .pn-quote-card__container{padding:2.4rem}pn-quote-card[data-card-style=standalone] .pn-quote-card__section{max-width:100%;margin:0 auto}@media screen and (min-width: 992px){pn-quote-card[data-card-style=standalone] .pn-quote-card__section{max-width:70%}}@media screen and (min-width: 1200px){pn-quote-card[data-card-style=standalone] .pn-quote-card__section{max-width:60%}}pn-quote-card[data-card-style=standalone] .pn-quote-card__container{min-height:unset;padding:0}@media screen and (min-width: 768px){pn-quote-card[data-card-style=standalone] .pn-quote-card__container{padding:0 2.4rem}}pn-quote-card[data-card-style=standalone] .pn-quote-card__quote__container{display:flex;flex-direction:column;justify-content:space-between;gap:3.2rem;padding:2.4rem 1.6rem 1.6rem 1.6rem}@media screen and (min-width: 768px){pn-quote-card[data-card-style=standalone] .pn-quote-card__quote__container{padding:2.4rem 3.2rem 1.6rem 3.2rem}}pn-quote-card[data-card-style=standalone] .pn-quote-card__quote{font-size:1.6rem}@media screen and (min-width: 992px){pn-quote-card[data-card-style=standalone] .pn-quote-card__quote{font-size:2rem}}pn-quote-card[data-card-style=standalone] .pn-quote-card__quote svg{display:block;margin-bottom:0.8rem;position:relative;top:0;left:0}pn-quote-card[data-card-style=standalone] .pn-quote-card__reference__container [slot=illustration] picture img{height:6rem;width:6rem}@media screen and (min-width: 992px){pn-quote-card[data-card-style=standalone] .pn-quote-card__reference__container [slot=illustration] picture img{height:9rem;width:9rem}}pn-quote-card[data-card-style=standalone] .pn-quote-card__reference__name{font-size:1.6rem}@media screen and (min-width: 992px){pn-quote-card[data-card-style=standalone] .pn-quote-card__reference__name{font-size:2.4rem}}pn-quote-card[data-card-style=standalone] .pn-quote-card__reference__occupation{font-size:1.2rem}@media screen and (min-width: 992px){pn-quote-card[data-card-style=standalone] .pn-quote-card__reference__occupation{font-size:1.4rem}}pn-quote-card[data-card-style=standalone] .pn-quote-card__large-photo{display:none}pn-quote-card[data-card-style=combo] .pn-quote-card__section{width:100%;margin:0 auto;padding-top:4rem;padding-bottom:4rem}@media screen and (min-width: 992px){pn-quote-card[data-card-style=combo] .pn-quote-card__section{padding-bottom:0}}@media screen and (min-width: 1200px){pn-quote-card[data-card-style=combo] .pn-quote-card__section{padding-top:10rem}}pn-quote-card[data-card-style=combo] .pn-quote-card__container{min-height:10rem;padding-bottom:0}@media screen and (min-width: 768px){pn-quote-card[data-card-style=combo] .pn-quote-card__container{max-width:90%;width:100%}}@media screen and (min-width: 992px){pn-quote-card[data-card-style=combo] .pn-quote-card__container{max-width:768px;width:100%}}@media screen and (min-width: 1200px){pn-quote-card[data-card-style=combo] .pn-quote-card__container{max-width:1140px;width:100%;padding:0 5.6rem}}@media screen and (min-width: 1640px){pn-quote-card[data-card-style=combo] .pn-quote-card__container{max-width:1440px;width:100%;padding:0 12rem}}pn-quote-card[data-card-style=combo] .pn-quote-card__quote__container{padding-bottom:0;padding-left:0;padding-right:0}@media screen and (min-width: 768px){pn-quote-card[data-card-style=combo] .pn-quote-card__quote__container{padding-left:2.4rem;padding-right:2.4rem}}pn-quote-card[data-card-style=combo] .pn-quote-card__quote{font-size:2rem;padding-left:2.4rem}pn-quote-card[data-card-style=combo] .pn-quote-card__quote svg{left:-0.8rem;top:0.2rem}@media screen and (min-width: 768px){pn-quote-card[data-card-style=combo] .pn-quote-card__quote{padding-left:4rem}pn-quote-card[data-card-style=combo] .pn-quote-card__quote svg{left:0}}@media screen and (min-width: 992px){pn-quote-card[data-card-style=combo] .pn-quote-card__quote{font-size:2.4rem}pn-quote-card[data-card-style=combo] .pn-quote-card__quote svg{left:0;top:0.4rem;scale:1.3}}@media screen and (min-width: 1200px){pn-quote-card[data-card-style=combo] .pn-quote-card__quote{padding-left:0;font-size:3.2rem}pn-quote-card[data-card-style=combo] .pn-quote-card__quote svg{left:-4.8rem;top:1rem;scale:1.4}}@media screen and (min-width: 1640px){pn-quote-card[data-card-style=combo] .pn-quote-card__quote{font-size:3.8rem}pn-quote-card[data-card-style=combo] .pn-quote-card__quote svg{left:-6.4rem;top:1.6rem;scale:1.8}}pn-quote-card[data-card-style=combo] .pn-quote-card__reference__container{flex-direction:row-reverse}pn-quote-card[data-card-style=combo] [slot=illustration] picture>img{max-width:6rem;max-height:6rem}@media screen and (min-width: 768px){pn-quote-card[data-card-style=combo] [slot=illustration] picture>img{max-width:10rem;max-height:10rem}}@media screen and (min-width: 1140px){pn-quote-card[data-card-style=combo] [slot=illustration]{display:none}}pn-quote-card[data-card-style=combo] .pn-quote-card__reference{text-align:right}pn-quote-card[data-card-style=combo] .pn-quote-card__reference__name{display:block;font-size:1.4rem}@media screen and (min-width: 768px){pn-quote-card[data-card-style=combo] .pn-quote-card__reference__name{font-size:1.6rem}}@media screen and (min-width: 992px){pn-quote-card[data-card-style=combo] .pn-quote-card__reference__name{font-size:2rem}}@media screen and (min-width: 1640px){pn-quote-card[data-card-style=combo] .pn-quote-card__reference__name{font-size:3.2rem;margin-bottom:1rem}}pn-quote-card[data-card-style=combo] .pn-quote-card__reference__occupation{display:block;font-size:1.2rem}@media screen and (min-width: 992px){pn-quote-card[data-card-style=combo] .pn-quote-card__reference__occupation{font-size:1.4rem}}@media screen and (min-width: 1640px){pn-quote-card[data-card-style=combo] .pn-quote-card__reference__occupation{font-size:1.6rem}}pn-quote-card[data-card-style=combo] .pn-quote-card__large-photo{display:none}@media screen and (min-width: 1140px){pn-quote-card[data-card-style=combo] .pn-quote-card__large-photo{display:block}pn-quote-card[data-card-style=combo] .pn-quote-card__large-photo>[slot=illustration-big]{width:18rem;height:18rem}pn-quote-card[data-card-style=combo] .pn-quote-card__large-photo>[slot=illustration-big] picture>img{width:18rem;height:18rem}}@media screen and (min-width: 1640px){pn-quote-card[data-card-style=combo] .pn-quote-card__large-photo{display:block;width:24rem;height:24rem}pn-quote-card[data-card-style=combo] .pn-quote-card__large-photo>[slot=illustration-big]{position:relative;z-index:1;width:24rem;height:24rem}pn-quote-card[data-card-style=combo] .pn-quote-card__large-photo>[slot=illustration-big]>picture>img{width:24rem;height:24rem}}";const d=n;const r=class{constructor(a){e(this,a);this.quote=null;this.name=null;this.occupation=null}render(){return a(t,{key:"adf7a00980ef81bddf83262dcc24540f962abf27"},a("div",{key:"4b8ec2139d33c1d432c269ba04c8e13732b46dcd",class:"pn-quote-card__section"},a("div",{key:"67713c139963d7e2477fcf0b6d078d336a768940",class:"pn-quote-card__container"},a("slot",{key:"b68d98f863024314c4d14e6697ce2e2396041cc8",name:"vertical-line"}," "),a("div",{key:"f712e28f92b230e64fe5ffc5abf001443a9d16ec",class:"pn-quote-card__quote__container"},a("blockquote",{key:"cd1eb6e0c9d973aa816b2c8644be9c05558e7c17",class:"pn-quote-card__quote"},a("svg",{key:"947cdf4204f8e2aea7ba33cb7b2a4c1f3b919415",width:"25",height:"18",viewBox:"0 0 25 18",fill:"none",xmlns:"http://www.w3.org/2000/svg"},a("path",{key:"ec7acd41030a16824b604eda941c3cde35e69647",d:"M10.483 0V7.391C10.483 13.095 6.752 16.961 1.5 18L0.505 15.849C2.937 14.932 4.5 12.211 4.5 10H0.5V0H10.483ZM24.5 0V7.391C24.5 13.095 20.752 16.962 15.5 18L14.504 15.849C16.937 14.932 18.5 12.211 18.5 10H14.517V0H24.5Z",fill:"white"})),this.quote),a("slot",{key:"ee71250def5a98c730ae00a60761868e4cf2b2f0",name:"horizontal-line"}),a("div",{key:"41f86563902c051b7c2ec0d915244b6f6c7b8533",class:"pn-quote-card__reference__container"},a("slot",{key:"e1dce0ca310574a9da9ba5c15ba823f1e70c61fa",name:"illustration"}),a("div",{key:"a06f795ff2d1d7165b8b0f654c5ee9bd8fb4eca9",class:"pn-quote-card__reference"},a("span",{key:"3507763b1414b00076fdaa9cfb6b5c7ec1e36cb5",class:"pn-quote-card__reference__name"},this.name),a("span",{key:"ce5f2580a1cb9c00e99536228c0c2cc784ef9fe2",class:"pn-quote-card__reference__occupation"},this.occupation)))),a("div",{key:"c3c7b60385beb22bfdb9ce05b77f44199d5b8fbb",class:"pn-quote-card__large-photo"},a("slot",{key:"eb72a8ce622a9166271549bb0090c68e9847ae17",name:"illustration-big"})))))}get hostElement(){return o(this)}};r.style=d;export{r as pn_quote_card};
-//# sourceMappingURL=p-4f2a7d41.entry.js.map
+import{r as e,g as a,h as t,d as o}from"./p-06555615.js";const n="pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}pn-quote-card .pn-quote-card__container{margin:0 auto;display:flex;flex-direction:row;min-height:262px;padding:0 2.4rem}pn-quote-card .pn-quote-card__quote__container{padding:0 3.2rem}pn-quote-card .pn-quote-card__quote{position:relative;font-weight:400;font-size:2rem;line-height:140%;margin:0}pn-quote-card .pn-quote-card__quote svg{position:absolute;left:-3.2rem;top:0.2rem}pn-quote-card .pn-quote-card__reference__container{display:flex;flex-direction:row;justify-content:flex-start;gap:1.6rem;align-items:center}pn-quote-card .pn-quote-card__reference__name{display:block;font-weight:400;font-size:2.4rem;line-height:2.9rem}pn-quote-card .pn-quote-card__reference__occupation{display:block;font-weight:400;font-size:1.4rem;line-height:1.7rem}pn-quote-card [slot=illustration]{padding:0}pn-quote-card [slot=illustration-big]{padding:0.8rem 0}pn-quote-card [slot=illustration],pn-quote-card [slot=illustration-big]{aspect-ratio:1/1}pn-quote-card [slot=illustration] picture,pn-quote-card [slot=illustration-big] picture{aspect-ratio:1/1}pn-quote-card [slot=illustration] picture img,pn-quote-card [slot=illustration-big] picture img{clip-path:circle(50%);max-width:unset}pn-quote-card [slot=horizontal-line],pn-quote-card [slot=vertical-line]{display:flex}pn-quote-card[data-line-color=white] .pn-quote-card__section{background-color:#005d92;color:#ffffff}pn-quote-card[data-line-color=white] .pn-line-shape__line,pn-quote-card[data-line-color=white] .pn-line-shape__dot{border-color:#ffffff;background-color:#ffffff}pn-quote-card[data-line-color=white] .pn-quote-card__quote svg>path{fill:#ffffff}pn-quote-card[data-line-color=blue] .pn-quote-card__section{background-color:#ffffff}pn-quote-card[data-line-color=blue] .pn-line-shape__line,pn-quote-card[data-line-color=blue] .pn-line-shape__dot{border-color:#00a0d6;background-color:#00a0d6}pn-quote-card[data-line-color=blue] .pn-quote-card__quote svg>path{fill:#00a0d6}pn-quote-card[data-line-color=blue900] .pn-quote-card__section{background-color:#ffffff}pn-quote-card[data-line-color=blue900] .pn-line-shape__line,pn-quote-card[data-line-color=blue900] .pn-line-shape__dot{border-color:#0d234b;background-color:#0d234b}pn-quote-card[data-line-color=blue900] .pn-quote-card__quote svg>path{fill:#0d234b}pn-quote-card[data-card-style=standalone][data-line-color=white] .pn-quote-card__section{border-radius:2.4rem}pn-quote-card[data-card-style=standalone][data-line-color=white] .pn-quote-card__container{padding:2.4rem}pn-quote-card[data-card-style=standalone] .pn-quote-card__section{max-width:100%;margin:0 auto}@media screen and (min-width: 992px){pn-quote-card[data-card-style=standalone] .pn-quote-card__section{max-width:70%}}@media screen and (min-width: 1200px){pn-quote-card[data-card-style=standalone] .pn-quote-card__section{max-width:60%}}pn-quote-card[data-card-style=standalone] .pn-quote-card__container{min-height:unset;padding:0}@media screen and (min-width: 768px){pn-quote-card[data-card-style=standalone] .pn-quote-card__container{padding:0 2.4rem}}pn-quote-card[data-card-style=standalone] .pn-quote-card__quote__container{display:flex;flex-direction:column;justify-content:space-between;gap:3.2rem;padding:2.4rem 1.6rem 1.6rem 1.6rem}@media screen and (min-width: 768px){pn-quote-card[data-card-style=standalone] .pn-quote-card__quote__container{padding:2.4rem 3.2rem 1.6rem 3.2rem}}pn-quote-card[data-card-style=standalone] .pn-quote-card__quote{font-size:1.6rem}@media screen and (min-width: 992px){pn-quote-card[data-card-style=standalone] .pn-quote-card__quote{font-size:2rem}}pn-quote-card[data-card-style=standalone] .pn-quote-card__quote svg{display:block;margin-bottom:0.8rem;position:relative;top:0;left:0}pn-quote-card[data-card-style=standalone] .pn-quote-card__reference__container [slot=illustration] picture img{height:6rem;width:6rem}@media screen and (min-width: 992px){pn-quote-card[data-card-style=standalone] .pn-quote-card__reference__container [slot=illustration] picture img{height:9rem;width:9rem}}pn-quote-card[data-card-style=standalone] .pn-quote-card__reference__name{font-size:1.6rem}@media screen and (min-width: 992px){pn-quote-card[data-card-style=standalone] .pn-quote-card__reference__name{font-size:2.4rem}}pn-quote-card[data-card-style=standalone] .pn-quote-card__reference__occupation{font-size:1.2rem}@media screen and (min-width: 992px){pn-quote-card[data-card-style=standalone] .pn-quote-card__reference__occupation{font-size:1.4rem}}pn-quote-card[data-card-style=standalone] .pn-quote-card__large-photo{display:none}pn-quote-card[data-card-style=combo] .pn-quote-card__section{width:100%;margin:0 auto;padding-top:4rem;padding-bottom:4rem}@media screen and (min-width: 992px){pn-quote-card[data-card-style=combo] .pn-quote-card__section{padding-bottom:0}}@media screen and (min-width: 1200px){pn-quote-card[data-card-style=combo] .pn-quote-card__section{padding-top:10rem}}pn-quote-card[data-card-style=combo] .pn-quote-card__container{min-height:10rem;padding-bottom:0}@media screen and (min-width: 768px){pn-quote-card[data-card-style=combo] .pn-quote-card__container{max-width:90%;width:100%}}@media screen and (min-width: 992px){pn-quote-card[data-card-style=combo] .pn-quote-card__container{max-width:768px;width:100%}}@media screen and (min-width: 1200px){pn-quote-card[data-card-style=combo] .pn-quote-card__container{max-width:1140px;width:100%;padding:0 5.6rem}}@media screen and (min-width: 1640px){pn-quote-card[data-card-style=combo] .pn-quote-card__container{max-width:1440px;width:100%;padding:0 12rem}}pn-quote-card[data-card-style=combo] .pn-quote-card__quote__container{padding-bottom:0;padding-left:0;padding-right:0}@media screen and (min-width: 768px){pn-quote-card[data-card-style=combo] .pn-quote-card__quote__container{padding-left:2.4rem;padding-right:2.4rem}}pn-quote-card[data-card-style=combo] .pn-quote-card__quote{font-size:2rem;padding-left:2.4rem}pn-quote-card[data-card-style=combo] .pn-quote-card__quote svg{left:-0.8rem;top:0.2rem}@media screen and (min-width: 768px){pn-quote-card[data-card-style=combo] .pn-quote-card__quote{padding-left:4rem}pn-quote-card[data-card-style=combo] .pn-quote-card__quote svg{left:0}}@media screen and (min-width: 992px){pn-quote-card[data-card-style=combo] .pn-quote-card__quote{font-size:2.4rem}pn-quote-card[data-card-style=combo] .pn-quote-card__quote svg{left:0;top:0.4rem;scale:1.3}}@media screen and (min-width: 1200px){pn-quote-card[data-card-style=combo] .pn-quote-card__quote{padding-left:0;font-size:3.2rem}pn-quote-card[data-card-style=combo] .pn-quote-card__quote svg{left:-4.8rem;top:1rem;scale:1.4}}@media screen and (min-width: 1640px){pn-quote-card[data-card-style=combo] .pn-quote-card__quote{font-size:3.8rem}pn-quote-card[data-card-style=combo] .pn-quote-card__quote svg{left:-6.4rem;top:1.6rem;scale:1.8}}pn-quote-card[data-card-style=combo] .pn-quote-card__reference__container{flex-direction:row-reverse}pn-quote-card[data-card-style=combo] [slot=illustration] picture>img{max-width:6rem;max-height:6rem}@media screen and (min-width: 768px){pn-quote-card[data-card-style=combo] [slot=illustration] picture>img{max-width:10rem;max-height:10rem}}@media screen and (min-width: 1140px){pn-quote-card[data-card-style=combo] [slot=illustration]{display:none}}pn-quote-card[data-card-style=combo] .pn-quote-card__reference{text-align:right}pn-quote-card[data-card-style=combo] .pn-quote-card__reference__name{display:block;font-size:1.4rem}@media screen and (min-width: 768px){pn-quote-card[data-card-style=combo] .pn-quote-card__reference__name{font-size:1.6rem}}@media screen and (min-width: 992px){pn-quote-card[data-card-style=combo] .pn-quote-card__reference__name{font-size:2rem}}@media screen and (min-width: 1640px){pn-quote-card[data-card-style=combo] .pn-quote-card__reference__name{font-size:3.2rem;margin-bottom:1rem}}pn-quote-card[data-card-style=combo] .pn-quote-card__reference__occupation{display:block;font-size:1.2rem}@media screen and (min-width: 992px){pn-quote-card[data-card-style=combo] .pn-quote-card__reference__occupation{font-size:1.4rem}}@media screen and (min-width: 1640px){pn-quote-card[data-card-style=combo] .pn-quote-card__reference__occupation{font-size:1.6rem}}pn-quote-card[data-card-style=combo] .pn-quote-card__large-photo{display:none}@media screen and (min-width: 1140px){pn-quote-card[data-card-style=combo] .pn-quote-card__large-photo{display:block}pn-quote-card[data-card-style=combo] .pn-quote-card__large-photo>[slot=illustration-big]{width:18rem;height:18rem}pn-quote-card[data-card-style=combo] .pn-quote-card__large-photo>[slot=illustration-big] picture>img{width:18rem;height:18rem}}@media screen and (min-width: 1640px){pn-quote-card[data-card-style=combo] .pn-quote-card__large-photo{display:block;width:24rem;height:24rem}pn-quote-card[data-card-style=combo] .pn-quote-card__large-photo>[slot=illustration-big]{position:relative;z-index:1;width:24rem;height:24rem}pn-quote-card[data-card-style=combo] .pn-quote-card__large-photo>[slot=illustration-big]>picture>img{width:24rem;height:24rem}}";const d=n;const r=class{constructor(a){e(this,a);this.quote=null;this.name=null;this.occupation=null}get hostElement(){return a(this)}render(){return t(o,{key:"adf7a00980ef81bddf83262dcc24540f962abf27"},t("div",{key:"4b8ec2139d33c1d432c269ba04c8e13732b46dcd",class:"pn-quote-card__section"},t("div",{key:"67713c139963d7e2477fcf0b6d078d336a768940",class:"pn-quote-card__container"},t("slot",{key:"b68d98f863024314c4d14e6697ce2e2396041cc8",name:"vertical-line"}," "),t("div",{key:"f712e28f92b230e64fe5ffc5abf001443a9d16ec",class:"pn-quote-card__quote__container"},t("blockquote",{key:"cd1eb6e0c9d973aa816b2c8644be9c05558e7c17",class:"pn-quote-card__quote"},t("svg",{key:"947cdf4204f8e2aea7ba33cb7b2a4c1f3b919415",width:"25",height:"18",viewBox:"0 0 25 18",fill:"none",xmlns:"http://www.w3.org/2000/svg"},t("path",{key:"ec7acd41030a16824b604eda941c3cde35e69647",d:"M10.483 0V7.391C10.483 13.095 6.752 16.961 1.5 18L0.505 15.849C2.937 14.932 4.5 12.211 4.5 10H0.5V0H10.483ZM24.5 0V7.391C24.5 13.095 20.752 16.962 15.5 18L14.504 15.849C16.937 14.932 18.5 12.211 18.5 10H14.517V0H24.5Z",fill:"white"})),this.quote),t("slot",{key:"ee71250def5a98c730ae00a60761868e4cf2b2f0",name:"horizontal-line"}),t("div",{key:"41f86563902c051b7c2ec0d915244b6f6c7b8533",class:"pn-quote-card__reference__container"},t("slot",{key:"e1dce0ca310574a9da9ba5c15ba823f1e70c61fa",name:"illustration"}),t("div",{key:"a06f795ff2d1d7165b8b0f654c5ee9bd8fb4eca9",class:"pn-quote-card__reference"},t("span",{key:"3507763b1414b00076fdaa9cfb6b5c7ec1e36cb5",class:"pn-quote-card__reference__name"},this.name),t("span",{key:"ce5f2580a1cb9c00e99536228c0c2cc784ef9fe2",class:"pn-quote-card__reference__occupation"},this.occupation)))),t("div",{key:"c3c7b60385beb22bfdb9ce05b77f44199d5b8fbb",class:"pn-quote-card__large-photo"},t("slot",{key:"eb72a8ce622a9166271549bb0090c68e9847ae17",name:"illustration-big"})))))}};r.style=d;export{r as pn_quote_card};
+//# sourceMappingURL=p-e4c7aaec.entry.js.map

package/pn-market-web-components/{p-4f2a7d41.entry.js.map → p-e4c7aaec.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["pnQuoteCardCss","PnQuoteCardStyle0","PnQuoteCard","render","h","Host","key","class","name","width","height","viewBox","fill","xmlns","d","this","quote","occupation"],"sources":["src/components/cards/pn-quote-card/pn-quote-card.scss?tag=pn-quote-card","src/components/cards/pn-quote-card/pn-quote-card.tsx"],"sourcesContent":["@import '../../../globals/main';\n\npn-quote-card {\n  .pn-quote-card__section {\n  }\n\n  .pn-quote-card__container {\n    margin: 0 auto;\n    display: flex;\n    flex-direction: row;\n\n    min-height: 262px;\n    padding: 0 2.4rem;\n  }\n\n  .pn-quote-card__quote__container {\n    padding: 0 3.2rem;\n  }\n\n  .pn-quote-card__quote {\n    position: relative;\n    font-weight: 400;\n    font-size: 2rem;\n    line-height: 140%;\n    margin: 0;\n\n    svg {\n      position: absolute;\n      left: -3.2rem;\n      top: 0.2rem;\n    }\n  }\n\n  .pn-quote-card__reference__container {\n    display: flex;\n    flex-direction: row;\n    justify-content: flex-start;\n    gap: 1.6rem;\n\n    align-items: center;\n  }\n\n  .pn-quote-card__reference {\n  }\n\n  .pn-quote-card__reference__name {\n    display: block;\n    font-weight: 400;\n    font-size: 2.4rem;\n    line-height: 2.9rem;\n  }\n\n  .pn-quote-card__reference__occupation {\n    display: block;\n    font-weight: 400;\n    font-size: 1.4rem;\n    line-height: 1.7rem;\n  }\n\n  [slot='illustration'] {\n    padding: 0;\n  }\n\n  [slot='illustration-big'] {\n    padding: 0.8rem 0;\n  }\n\n  [slot='illustration'],\n  [slot='illustration-big'] {\n    aspect-ratio: 1/1;\n\n    picture {\n      aspect-ratio: 1 / 1;\n      img {\n        clip-path: circle(50%);\n        max-width: unset;\n      }\n    }\n  }\n}\n\n//line orientation\n\npn-quote-card {\n  [slot='horizontal-line'],\n  [slot='vertical-line'] {\n    display: flex;\n  }\n}\n\n//Colors\npn-quote-card[data-line-color='white'] {\n  .pn-quote-card__section {\n    background-color: $blue700;\n    color: $white;\n  }\n\n  .pn-line-shape__line,\n  .pn-line-shape__dot {\n    border-color: $white;\n    background-color: $white;\n  }\n\n  .pn-quote-card__quote {\n    svg > path {\n      fill: $white;\n    }\n  }\n}\n\npn-quote-card[data-line-color='blue'] {\n  .pn-quote-card__section {\n    background-color: $white;\n  }\n\n  .pn-line-shape__line,\n  .pn-line-shape__dot {\n    border-color: $blue400;\n    background-color: $blue400;\n  }\n\n  .pn-quote-card__quote {\n    svg > path {\n      fill: $blue400;\n    }\n  }\n}\n\npn-quote-card[data-line-color='blue900'] {\n  .pn-quote-card__section {\n    background-color: $white;\n  }\n\n  .pn-line-shape__line,\n  .pn-line-shape__dot {\n    border-color: $blue900;\n    background-color: $blue900;\n  }\n\n  .pn-quote-card__quote {\n    svg > path {\n      fill: $blue900;\n    }\n  }\n}\n\n//layouts\n\npn-quote-card[data-card-style='standalone'] {\n  &[data-line-color='white'] {\n    .pn-quote-card__section {\n      border-radius: 2.4rem;\n    }\n\n    .pn-quote-card__container {\n      padding: 2.4rem;\n    }\n  }\n  .pn-quote-card__section {\n    max-width: 100%;\n    margin: 0 auto;\n\n    @media screen and (min-width: 992px) {\n      max-width: 70%;\n    }\n    @media screen and (min-width: 1200px) {\n      max-width: 60%;\n    }\n  }\n\n  .pn-quote-card__container {\n    min-height: unset;\n    padding: 0;\n\n    @media screen and (min-width: 768px) {\n      padding: 0 2.4rem;\n    }\n  }\n\n  .pn-quote-card__quote__container {\n    display: flex;\n    flex-direction: column;\n    justify-content: space-between;\n    gap: 3.2rem;\n    padding: 2.4rem 1.6rem 1.6rem 1.6rem;\n\n    @media screen and (min-width: 768px) {\n      padding: 2.4rem 3.2rem 1.6rem 3.2rem;\n    }\n  }\n\n  .pn-quote-card__quote {\n    font-size: 1.6rem;\n\n    @media screen and (min-width: 992px) {\n      font-size: 2rem;\n    }\n\n    svg {\n      display: block;\n      margin-bottom: 0.8rem;\n      position: relative;\n      top: 0;\n      left: 0;\n    }\n  }\n\n  .pn-quote-card__reference__container {\n    [slot='illustration'] {\n      picture {\n        img {\n          height: 6rem;\n          width: 6rem;\n        }\n      }\n    }\n    @media screen and (min-width: 992px) {\n      [slot='illustration'] {\n        picture {\n          img {\n            height: 9rem;\n            width: 9rem;\n          }\n        }\n      }\n    }\n  }\n\n  .pn-quote-card__reference__name {\n    font-size: 1.6rem;\n    @media screen and (min-width: 992px) {\n      font-size: 2.4rem;\n    }\n  }\n\n  .pn-quote-card__reference__occupation {\n    font-size: 1.2rem;\n    @media screen and (min-width: 992px) {\n      font-size: 1.4rem;\n    }\n  }\n\n  .pn-quote-card__large-photo {\n    display: none;\n  }\n}\n\npn-quote-card[data-card-style='combo'] {\n  .pn-quote-card__section {\n    width: 100%;\n    margin: 0 auto;\n    padding-top: 4rem;\n    padding-bottom: 4rem;\n    @media screen and (min-width: 992px) {\n      padding-bottom: 0;\n    }\n\n    @media screen and (min-width: 1200px) {\n      padding-top: 10rem;\n    }\n  }\n\n  .pn-quote-card__container {\n    min-height: 10rem;\n    padding-bottom: 0;\n\n    @media screen and (min-width: 768px) {\n      max-width: 90%;\n      width: 100%;\n    }\n\n    @media screen and (min-width: 992px) {\n      max-width: 768px;\n      width: 100%;\n    }\n    @media screen and (min-width: 1200px) {\n      max-width: 1140px;\n      width: 100%;\n      padding: 0 5.6rem;\n    }\n    @media screen and (min-width: 1640px) {\n      max-width: 1440px;\n      width: 100%;\n      padding: 0 12rem;\n    }\n  }\n\n  .pn-quote-card__quote__container {\n    padding-bottom: 0;\n    padding-left: 0;\n    padding-right: 0;\n\n    @media screen and (min-width: 768px) {\n      padding-left: 2.4rem;\n      padding-right: 2.4rem;\n    }\n  }\n\n  .pn-quote-card__quote {\n    font-size: 2rem;\n    padding-left: 2.4rem;\n    svg {\n      left: -0.8rem;\n      top: 0.2rem;\n    }\n\n    @media screen and (min-width: 768px) {\n      padding-left: 4rem;\n      svg {\n        left: 0;\n      }\n    }\n\n    @media screen and (min-width: 992px) {\n      font-size: 2.4rem;\n      svg {\n        left: 0;\n        top: 0.4rem;\n        scale: 1.3;\n      }\n    }\n\n    @media screen and (min-width: 1200px) {\n      padding-left: 0;\n      font-size: 3.2rem;\n      svg {\n        left: -4.8rem;\n        top: 1rem;\n        scale: 1.4;\n      }\n    }\n\n    @media screen and (min-width: 1640px) {\n      font-size: 3.8rem;\n      svg {\n        left: -6.4rem;\n        top: 1.6rem;\n        scale: 1.8;\n      }\n    }\n  }\n\n  .pn-quote-card__reference__container {\n    flex-direction: row-reverse;\n  }\n\n  [slot='illustration'] {\n    picture > img {\n      max-width: 6rem;\n      max-height: 6rem;\n    }\n\n    @media screen and (min-width: 768px) {\n      picture > img {\n        max-width: 10rem;\n        max-height: 10rem;\n      }\n    }\n\n    @media screen and (min-width: 1140px) {\n      display: none;\n    }\n  }\n\n  .pn-quote-card__reference {\n    text-align: right;\n  }\n\n  .pn-quote-card__reference__name {\n    display: block;\n    font-size: 1.4rem;\n    @media screen and (min-width: 768px) {\n      font-size: 1.6rem;\n    }\n\n    @media screen and (min-width: 992px) {\n      font-size: 2rem;\n    }\n\n    @media screen and (min-width: 1640px) {\n      font-size: 3.2rem;\n      margin-bottom: 1rem;\n    }\n  }\n\n  .pn-quote-card__reference__occupation {\n    display: block;\n\n    font-size: 1.2rem;\n    @media screen and (min-width: 992px) {\n      font-size: 1.4rem;\n    }\n\n    @media screen and (min-width: 1640px) {\n      font-size: 1.6rem;\n    }\n  }\n\n  .pn-quote-card__large-photo {\n    display: none;\n\n    @media screen and (min-width: 1140px) {\n      display: block;\n\n      & > [slot='illustration-big'] {\n        width: 18rem;\n        height: 18rem;\n        & picture > img {\n          width: 18rem;\n          height: 18rem;\n        }\n      }\n    }\n\n    @media screen and (min-width: 1640px) {\n      display: block;\n      width: 24rem;\n      height: 24rem;\n      & > [slot='illustration-big'] {\n        position: relative;\n        z-index: 1;\n        width: 24rem;\n        height: 24rem;\n\n        & > picture > img {\n          width: 24rem;\n          height: 24rem;\n        }\n      }\n    }\n  }\n}\n","import { Component, Element, h, Host, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'pn-quote-card',\n  styleUrl: 'pn-quote-card.scss',\n})\nexport class PnQuoteCard {\n  @Element() hostElement: HTMLElement;\n  //props\n  @Prop() quote: string = null;\n  @Prop() name: string = null;\n  @Prop() occupation: string = null;\n  render() {\n    return (\n      <Host>\n        <div class=\"pn-quote-card__section\">\n          <div class=\"pn-quote-card__container\">\n            <slot name=\"vertical-line\"> </slot>\n            <div class=\"pn-quote-card__quote__container\">\n              <blockquote class=\"pn-quote-card__quote\">\n                <svg width=\"25\" height=\"18\" viewBox=\"0 0 25 18\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                  <path\n                    d=\"M10.483 0V7.391C10.483 13.095 6.752 16.961 1.5 18L0.505 15.849C2.937 14.932 4.5 12.211 4.5 10H0.5V0H10.483ZM24.5 0V7.391C24.5 13.095 20.752 16.962 15.5 18L14.504 15.849C16.937 14.932 18.5 12.211 18.5 10H14.517V0H24.5Z\"\n                    fill=\"white\"\n                  />\n                </svg>\n\n                {this.quote}\n              </blockquote>\n\n              <slot name=\"horizontal-line\"></slot>\n              <div class=\"pn-quote-card__reference__container\">\n                <slot name=\"illustration\" />\n                <div class=\"pn-quote-card__reference\">\n                  <span class=\"pn-quote-card__reference__name\">{this.name}</span>\n                  <span class=\"pn-quote-card__reference__occupation\">{this.occupation}</span>\n                </div>\n              </div>\n            </div>\n            <div class=\"pn-quote-card__large-photo\">\n              <slot name=\"illustration-big\" />\n            </div>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"yDAAA,MAAMA,EAAiB,w6RACvB,MAAAC,EAAeD,E,MCKFE,EAAW,M,oCAGE,K,UACD,K,gBACM,I,CAC7B,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,OAAAE,IAAA,2CAAKC,MAAM,0BACTH,EAAA,OAAAE,IAAA,2CAAKC,MAAM,4BACTH,EAAA,QAAAE,IAAA,2CAAME,KAAK,iBAAe,KAC1BJ,EAAA,OAAAE,IAAA,2CAAKC,MAAM,mCACTH,EAAA,cAAAE,IAAA,2CAAYC,MAAM,wBAChBH,EAAA,OAAAE,IAAA,2CAAKG,MAAM,KAAKC,OAAO,KAAKC,QAAQ,YAAYC,KAAK,OAAOC,MAAM,8BAChET,EAAA,QAAAE,IAAA,2CACEQ,EAAE,4NACFF,KAAK,WAIRG,KAAKC,OAGRZ,EAAA,QAAAE,IAAA,2CAAME,KAAK,oBACXJ,EAAA,OAAAE,IAAA,2CAAKC,MAAM,uCACTH,EAAA,QAAAE,IAAA,2CAAME,KAAK,iBACXJ,EAAA,OAAAE,IAAA,2CAAKC,MAAM,4BACTH,EAAA,QAAAE,IAAA,2CAAMC,MAAM,kCAAkCQ,KAAKP,MACnDJ,EAAA,QAAAE,IAAA,2CAAMC,MAAM,wCAAwCQ,KAAKE,eAI/Db,EAAA,OAAAE,IAAA,2CAAKC,MAAM,8BACTH,EAAA,QAAAE,IAAA,2CAAME,KAAK,wB","ignoreList":[]}
+{"version":3,"names":["pnQuoteCardCss","PnQuoteCardStyle0","PnQuoteCard","render","h","Host","key","class","name","width","height","viewBox","fill","xmlns","d","this","quote","occupation"],"sources":["src/components/cards/pn-quote-card/pn-quote-card.scss?tag=pn-quote-card","src/components/cards/pn-quote-card/pn-quote-card.tsx"],"sourcesContent":["@import '../../../globals/main';\n\npn-quote-card {\n  .pn-quote-card__section {\n  }\n\n  .pn-quote-card__container {\n    margin: 0 auto;\n    display: flex;\n    flex-direction: row;\n\n    min-height: 262px;\n    padding: 0 2.4rem;\n  }\n\n  .pn-quote-card__quote__container {\n    padding: 0 3.2rem;\n  }\n\n  .pn-quote-card__quote {\n    position: relative;\n    font-weight: 400;\n    font-size: 2rem;\n    line-height: 140%;\n    margin: 0;\n\n    svg {\n      position: absolute;\n      left: -3.2rem;\n      top: 0.2rem;\n    }\n  }\n\n  .pn-quote-card__reference__container {\n    display: flex;\n    flex-direction: row;\n    justify-content: flex-start;\n    gap: 1.6rem;\n\n    align-items: center;\n  }\n\n  .pn-quote-card__reference {\n  }\n\n  .pn-quote-card__reference__name {\n    display: block;\n    font-weight: 400;\n    font-size: 2.4rem;\n    line-height: 2.9rem;\n  }\n\n  .pn-quote-card__reference__occupation {\n    display: block;\n    font-weight: 400;\n    font-size: 1.4rem;\n    line-height: 1.7rem;\n  }\n\n  [slot='illustration'] {\n    padding: 0;\n  }\n\n  [slot='illustration-big'] {\n    padding: 0.8rem 0;\n  }\n\n  [slot='illustration'],\n  [slot='illustration-big'] {\n    aspect-ratio: 1/1;\n\n    picture {\n      aspect-ratio: 1 / 1;\n      img {\n        clip-path: circle(50%);\n        max-width: unset;\n      }\n    }\n  }\n}\n\n//line orientation\n\npn-quote-card {\n  [slot='horizontal-line'],\n  [slot='vertical-line'] {\n    display: flex;\n  }\n}\n\n//Colors\npn-quote-card[data-line-color='white'] {\n  .pn-quote-card__section {\n    background-color: $blue700;\n    color: $white;\n  }\n\n  .pn-line-shape__line,\n  .pn-line-shape__dot {\n    border-color: $white;\n    background-color: $white;\n  }\n\n  .pn-quote-card__quote {\n    svg > path {\n      fill: $white;\n    }\n  }\n}\n\npn-quote-card[data-line-color='blue'] {\n  .pn-quote-card__section {\n    background-color: $white;\n  }\n\n  .pn-line-shape__line,\n  .pn-line-shape__dot {\n    border-color: $blue400;\n    background-color: $blue400;\n  }\n\n  .pn-quote-card__quote {\n    svg > path {\n      fill: $blue400;\n    }\n  }\n}\n\npn-quote-card[data-line-color='blue900'] {\n  .pn-quote-card__section {\n    background-color: $white;\n  }\n\n  .pn-line-shape__line,\n  .pn-line-shape__dot {\n    border-color: $blue900;\n    background-color: $blue900;\n  }\n\n  .pn-quote-card__quote {\n    svg > path {\n      fill: $blue900;\n    }\n  }\n}\n\n//layouts\n\npn-quote-card[data-card-style='standalone'] {\n  &[data-line-color='white'] {\n    .pn-quote-card__section {\n      border-radius: 2.4rem;\n    }\n\n    .pn-quote-card__container {\n      padding: 2.4rem;\n    }\n  }\n  .pn-quote-card__section {\n    max-width: 100%;\n    margin: 0 auto;\n\n    @media screen and (min-width: 992px) {\n      max-width: 70%;\n    }\n    @media screen and (min-width: 1200px) {\n      max-width: 60%;\n    }\n  }\n\n  .pn-quote-card__container {\n    min-height: unset;\n    padding: 0;\n\n    @media screen and (min-width: 768px) {\n      padding: 0 2.4rem;\n    }\n  }\n\n  .pn-quote-card__quote__container {\n    display: flex;\n    flex-direction: column;\n    justify-content: space-between;\n    gap: 3.2rem;\n    padding: 2.4rem 1.6rem 1.6rem 1.6rem;\n\n    @media screen and (min-width: 768px) {\n      padding: 2.4rem 3.2rem 1.6rem 3.2rem;\n    }\n  }\n\n  .pn-quote-card__quote {\n    font-size: 1.6rem;\n\n    @media screen and (min-width: 992px) {\n      font-size: 2rem;\n    }\n\n    svg {\n      display: block;\n      margin-bottom: 0.8rem;\n      position: relative;\n      top: 0;\n      left: 0;\n    }\n  }\n\n  .pn-quote-card__reference__container {\n    [slot='illustration'] {\n      picture {\n        img {\n          height: 6rem;\n          width: 6rem;\n        }\n      }\n    }\n    @media screen and (min-width: 992px) {\n      [slot='illustration'] {\n        picture {\n          img {\n            height: 9rem;\n            width: 9rem;\n          }\n        }\n      }\n    }\n  }\n\n  .pn-quote-card__reference__name {\n    font-size: 1.6rem;\n    @media screen and (min-width: 992px) {\n      font-size: 2.4rem;\n    }\n  }\n\n  .pn-quote-card__reference__occupation {\n    font-size: 1.2rem;\n    @media screen and (min-width: 992px) {\n      font-size: 1.4rem;\n    }\n  }\n\n  .pn-quote-card__large-photo {\n    display: none;\n  }\n}\n\npn-quote-card[data-card-style='combo'] {\n  .pn-quote-card__section {\n    width: 100%;\n    margin: 0 auto;\n    padding-top: 4rem;\n    padding-bottom: 4rem;\n    @media screen and (min-width: 992px) {\n      padding-bottom: 0;\n    }\n\n    @media screen and (min-width: 1200px) {\n      padding-top: 10rem;\n    }\n  }\n\n  .pn-quote-card__container {\n    min-height: 10rem;\n    padding-bottom: 0;\n\n    @media screen and (min-width: 768px) {\n      max-width: 90%;\n      width: 100%;\n    }\n\n    @media screen and (min-width: 992px) {\n      max-width: 768px;\n      width: 100%;\n    }\n    @media screen and (min-width: 1200px) {\n      max-width: 1140px;\n      width: 100%;\n      padding: 0 5.6rem;\n    }\n    @media screen and (min-width: 1640px) {\n      max-width: 1440px;\n      width: 100%;\n      padding: 0 12rem;\n    }\n  }\n\n  .pn-quote-card__quote__container {\n    padding-bottom: 0;\n    padding-left: 0;\n    padding-right: 0;\n\n    @media screen and (min-width: 768px) {\n      padding-left: 2.4rem;\n      padding-right: 2.4rem;\n    }\n  }\n\n  .pn-quote-card__quote {\n    font-size: 2rem;\n    padding-left: 2.4rem;\n    svg {\n      left: -0.8rem;\n      top: 0.2rem;\n    }\n\n    @media screen and (min-width: 768px) {\n      padding-left: 4rem;\n      svg {\n        left: 0;\n      }\n    }\n\n    @media screen and (min-width: 992px) {\n      font-size: 2.4rem;\n      svg {\n        left: 0;\n        top: 0.4rem;\n        scale: 1.3;\n      }\n    }\n\n    @media screen and (min-width: 1200px) {\n      padding-left: 0;\n      font-size: 3.2rem;\n      svg {\n        left: -4.8rem;\n        top: 1rem;\n        scale: 1.4;\n      }\n    }\n\n    @media screen and (min-width: 1640px) {\n      font-size: 3.8rem;\n      svg {\n        left: -6.4rem;\n        top: 1.6rem;\n        scale: 1.8;\n      }\n    }\n  }\n\n  .pn-quote-card__reference__container {\n    flex-direction: row-reverse;\n  }\n\n  [slot='illustration'] {\n    picture > img {\n      max-width: 6rem;\n      max-height: 6rem;\n    }\n\n    @media screen and (min-width: 768px) {\n      picture > img {\n        max-width: 10rem;\n        max-height: 10rem;\n      }\n    }\n\n    @media screen and (min-width: 1140px) {\n      display: none;\n    }\n  }\n\n  .pn-quote-card__reference {\n    text-align: right;\n  }\n\n  .pn-quote-card__reference__name {\n    display: block;\n    font-size: 1.4rem;\n    @media screen and (min-width: 768px) {\n      font-size: 1.6rem;\n    }\n\n    @media screen and (min-width: 992px) {\n      font-size: 2rem;\n    }\n\n    @media screen and (min-width: 1640px) {\n      font-size: 3.2rem;\n      margin-bottom: 1rem;\n    }\n  }\n\n  .pn-quote-card__reference__occupation {\n    display: block;\n\n    font-size: 1.2rem;\n    @media screen and (min-width: 992px) {\n      font-size: 1.4rem;\n    }\n\n    @media screen and (min-width: 1640px) {\n      font-size: 1.6rem;\n    }\n  }\n\n  .pn-quote-card__large-photo {\n    display: none;\n\n    @media screen and (min-width: 1140px) {\n      display: block;\n\n      & > [slot='illustration-big'] {\n        width: 18rem;\n        height: 18rem;\n        & picture > img {\n          width: 18rem;\n          height: 18rem;\n        }\n      }\n    }\n\n    @media screen and (min-width: 1640px) {\n      display: block;\n      width: 24rem;\n      height: 24rem;\n      & > [slot='illustration-big'] {\n        position: relative;\n        z-index: 1;\n        width: 24rem;\n        height: 24rem;\n\n        & > picture > img {\n          width: 24rem;\n          height: 24rem;\n        }\n      }\n    }\n  }\n}\n","import { Component, Element, h, Host, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'pn-quote-card',\n  styleUrl: 'pn-quote-card.scss',\n})\nexport class PnQuoteCard {\n  @Element() hostElement: HTMLElement;\n  //props\n  @Prop() quote: string = null;\n  @Prop() name: string = null;\n  @Prop() occupation: string = null;\n  render() {\n    return (\n      <Host>\n        <div class=\"pn-quote-card__section\">\n          <div class=\"pn-quote-card__container\">\n            <slot name=\"vertical-line\"> </slot>\n            <div class=\"pn-quote-card__quote__container\">\n              <blockquote class=\"pn-quote-card__quote\">\n                <svg width=\"25\" height=\"18\" viewBox=\"0 0 25 18\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                  <path\n                    d=\"M10.483 0V7.391C10.483 13.095 6.752 16.961 1.5 18L0.505 15.849C2.937 14.932 4.5 12.211 4.5 10H0.5V0H10.483ZM24.5 0V7.391C24.5 13.095 20.752 16.962 15.5 18L14.504 15.849C16.937 14.932 18.5 12.211 18.5 10H14.517V0H24.5Z\"\n                    fill=\"white\"\n                  />\n                </svg>\n\n                {this.quote}\n              </blockquote>\n\n              <slot name=\"horizontal-line\"></slot>\n              <div class=\"pn-quote-card__reference__container\">\n                <slot name=\"illustration\" />\n                <div class=\"pn-quote-card__reference\">\n                  <span class=\"pn-quote-card__reference__name\">{this.name}</span>\n                  <span class=\"pn-quote-card__reference__occupation\">{this.occupation}</span>\n                </div>\n              </div>\n            </div>\n            <div class=\"pn-quote-card__large-photo\">\n              <slot name=\"illustration-big\" />\n            </div>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"yDAAA,MAAMA,EAAiB,w6RACvB,MAAAC,EAAeD,E,MCKFE,EAAW,M,oCAGE,K,UACD,K,gBACM,I,kCAC7B,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,OAAAE,IAAA,2CAAKC,MAAM,0BACTH,EAAA,OAAAE,IAAA,2CAAKC,MAAM,4BACTH,EAAA,QAAAE,IAAA,2CAAME,KAAK,iBAAe,KAC1BJ,EAAA,OAAAE,IAAA,2CAAKC,MAAM,mCACTH,EAAA,cAAAE,IAAA,2CAAYC,MAAM,wBAChBH,EAAA,OAAAE,IAAA,2CAAKG,MAAM,KAAKC,OAAO,KAAKC,QAAQ,YAAYC,KAAK,OAAOC,MAAM,8BAChET,EAAA,QAAAE,IAAA,2CACEQ,EAAE,4NACFF,KAAK,WAIRG,KAAKC,OAGRZ,EAAA,QAAAE,IAAA,2CAAME,KAAK,oBACXJ,EAAA,OAAAE,IAAA,2CAAKC,MAAM,uCACTH,EAAA,QAAAE,IAAA,2CAAME,KAAK,iBACXJ,EAAA,OAAAE,IAAA,2CAAKC,MAAM,4BACTH,EAAA,QAAAE,IAAA,2CAAMC,MAAM,kCAAkCQ,KAAKP,MACnDJ,EAAA,QAAAE,IAAA,2CAAMC,MAAM,wCAAwCQ,KAAKE,eAI/Db,EAAA,OAAAE,IAAA,2CAAKC,MAAM,8BACTH,EAAA,QAAAE,IAAA,2CAAME,KAAK,wB","ignoreList":[]}