@postnord/pn-marketweb-components 2.4.24 → 2.4.26

package/esm/pn-marketweb-sitefooter.entry.js

@@ -10,7 +10,7 @@ const getSocialMediaIconsByType = (linkType = '', fill = '#005D92') => {
       </svg>`;
     case 'twitter':
       return `<svg width="56" height="56" viewBox="0 0 56 56" fill="none" xmlns="http://www.w3.org/2000/svg">
-              <circle cx="28" cy="28" r="28" fill="#005D92"/>
+              <circle cx="28" cy="28" r="28" fill="${fill}"/>
               <path d="M34.8996 17.5H38.5996L30.5996 26.4L39.9996 38.6H32.5996L26.7996 31.2L20.1996 38.6H16.4996L25.0996 29L16.0996 17.5H23.5996L28.7996 24.2L34.8996 17.5ZM33.5996 36.4H35.5996L22.4996 19.5H20.2996L33.5996 36.4Z" fill="white"/>
               </svg>`;
     case 'linkedin':
@@ -118,7 +118,7 @@ const translations = {
   },
 };
 
-const pnMarketwebSitefooterCss = "pn-marketweb-sitefooter .social-media a[target=_blank]:not(.pn-button):after{content:none}@media screen and (min-width: 60em){pn-marketweb-sitefooter:not([theme=dotcom]) pn-site-footer-col:has(div[slot=bottomsocialmediadesktop]){display:-ms-flexbox;display:flex;-ms-flex-line-pack:start;align-content:flex-start;-ms-flex-align:start;align-items:flex-start;-ms-flex-direction:column;flex-direction:column;-ms-flex-wrap:wrap;flex-wrap:wrap;min-width:-webkit-min-content;min-width:-moz-min-content;min-width:min-content}pn-marketweb-sitefooter:not([theme=dotcom]) pn-site-footer-col:has(div[slot=bottomsocialmediadesktop]) div[slot=bottomsocialmediadesktop]{display:block;margin-top:auto;margin-bottom:1.6rem}pn-marketweb-sitefooter:not([theme=dotcom]) pn-site-footer-col:has(div[slot=bottomsocialmediadesktop]) div[slot=bottomsocialmediadesktop] .trustpilot-widget{display:-ms-flexbox;display:flex;-ms-flex-pack:start;justify-content:flex-start}}pn-marketweb-sitefooter:not([theme=dotcom]) [slot=bottomsocialmediamobile]{display:block;margin-top:1rem;margin-bottom:2.3rem}pn-marketweb-sitefooter:not([theme=dotcom]) [slot=bottomsocialmediamobile] .trustpilot-widget{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center}@media screen and (min-width: 33.125em){pn-marketweb-sitefooter:not([theme=dotcom]) [slot=bottomsocialmediamobile] .trustpilot-widget{-ms-flex-pack:start;justify-content:flex-start}}@media screen and (min-width: 60em){pn-marketweb-sitefooter:not([theme=dotcom]) [slot=bottomsocialmediamobile]{display:none}}div[slot=middle-extra-mobile],div[slot=middle-extra]{display:none}pn-marketweb-sitefooter[theme=dotcom]{width:100%}pn-marketweb-sitefooter[theme=dotcom] div[slot=bottomsocialmediamobile],pn-marketweb-sitefooter[theme=dotcom] div[slot=bottomsocialmediadesktop]{display:none}pn-marketweb-sitefooter[theme=dotcom] div[slot=middle-extra-mobile]{display:block;width:100%;text-align:-webkit-center;margin:2.4rem 0}@media screen and (min-width: 1024px){pn-marketweb-sitefooter[theme=dotcom] div[slot=middle-extra-mobile]{display:none}pn-marketweb-sitefooter[theme=dotcom] div[slot=middle-extra]{display:block;width:100%;text-align:-webkit-center;margin:3.2rem 0}}pn-marketweb-sitefooter[theme=dotcom] div[slot=bottom] .social-media.social-media--swan{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center}@media screen and (min-width: 769px){pn-marketweb-sitefooter[theme=dotcom] div[slot=bottom] .social-media.social-media--swan{-ms-flex-direction:row;flex-direction:row}}pn-marketweb-sitefooter[theme=dotcom] div[slot=bottom] .social-media.social-media--swan ul{margin-bottom:1.6rem}@media screen and (min-width: 768px){pn-marketweb-sitefooter[theme=dotcom] div[slot=bottom] .social-media.social-media--swan ul{margin-bottom:0;margin-right:4.8rem}}pn-marketweb-sitefooter[theme=dotcom] div[slot=bottom] .social-media.social-media--swan .swan-wrapper{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;width:100%}@media screen and (min-width: 768px){pn-marketweb-sitefooter[theme=dotcom] div[slot=bottom] .social-media.social-media--swan .swan-wrapper{width:auto;-ms-flex-direction:row;flex-direction:row}}pn-marketweb-sitefooter[theme=dotcom] div[slot=bottom] .social-media.social-media--swan .swan-wrapper .separator{border-top:1px solid #d3cecb;margin-bottom:1.6rem}@media screen and (min-width: 768px){pn-marketweb-sitefooter[theme=dotcom] div[slot=bottom] .social-media.social-media--swan .swan-wrapper .separator{display:-ms-flexbox;display:flex;width:1px;height:auto;min-height:90%;background-color:#d3cecb;margin-right:4.8rem;margin-bottom:0}}pn-marketweb-sitefooter[theme=dotcom] div[slot=bottom] .social-media.social-media--swan .swan-wrapper .swan{justify-self:center;-ms-flex-item-align:center;align-self:center}pn-marketweb-sitefooter[theme=dotcom][backgroundcolor=darkestblue] pn-site-footer[theme=dotcom] pn-site-footer-col[theme=dotcom] svg path{fill:#FFFFFF}pn-marketweb-sitefooter[theme=dotcom][backgroundcolor=blue] pn-site-footer[theme=dotcom]{background-color:#005D92}pn-marketweb-sitefooter[theme=dotcom][backgroundcolor=blue] pn-site-footer[theme=dotcom] .pn-sitefooter-top,pn-marketweb-sitefooter[theme=dotcom][backgroundcolor=blue] pn-site-footer[theme=dotcom] .pn-sitefooter-bottom{background-color:#005D92}pn-marketweb-sitefooter[theme=dotcom][backgroundcolor=blue] pn-site-footer[theme=dotcom]>svg path{fill:#005D92}pn-marketweb-sitefooter[theme=dotcom][backgroundcolor=blue] pn-site-footer[theme=dotcom] .pn-sitefooter-bottom .social-media{border-top:0.1rem solid #D3CECB;border-bottom:0.1rem solid #D3CECB}pn-marketweb-sitefooter[theme=dotcom][backgroundcolor=blue] pn-site-footer[theme=dotcom] .pn-sitefooter-bottom .social-media>ul>li:hover svg>circle{fill:#8EDDF9}pn-marketweb-sitefooter[theme=dotcom][backgroundcolor=blue] pn-site-footer[theme=dotcom] pn-site-footer-col[theme=dotcom] svg path{fill:#FFFFFF}pn-marketweb-sitefooter[theme=dotcom][backgroundcolor=gray] pn-site-footer[theme=dotcom]{background-color:#F3F2F2}pn-marketweb-sitefooter[theme=dotcom][backgroundcolor=gray] pn-site-footer[theme=dotcom]>svg path{fill:#F3F2F2}pn-marketweb-sitefooter[theme=dotcom][backgroundcolor=gray] pn-site-footer[theme=dotcom] .pn-sitefooter-top,pn-marketweb-sitefooter[theme=dotcom][backgroundcolor=gray] pn-site-footer[theme=dotcom] .pn-sitefooter-bottom{background-color:#F3F2F2}pn-marketweb-sitefooter[theme=dotcom][backgroundcolor=gray] pn-site-footer[theme=dotcom] .pn-sitefooter-bottom .social-media{border-top:0.1rem solid #D3CECB;border-bottom:0.1rem solid #D3CECB}pn-marketweb-sitefooter[theme=dotcom][backgroundcolor=gray] pn-site-footer[theme=dotcom] .pn-sitefooter-bottom .social-media li svg circle{fill:#005D92}pn-marketweb-sitefooter[theme=dotcom][backgroundcolor=gray] pn-site-footer[theme=dotcom] .pn-sitefooter-bottom .social-media li svg:hover>circle{fill:#00A0D6}pn-marketweb-sitefooter[theme=dotcom][backgroundcolor=gray] pn-site-footer[theme=dotcom] .pn-sitefooter-bottom>[slot=bottom]>.copyright *{color:#005D92}pn-marketweb-sitefooter[theme=dotcom][backgroundcolor=gray] pn-site-footer[theme=dotcom] pn-site-footer-col[theme=dotcom] *{color:#0D234B}pn-marketweb-sitefooter[theme=dotcom][backgroundcolor=gray] pn-site-footer[theme=dotcom] pn-site-footer-col[theme=dotcom] svg path{fill:#0D234B}pn-marketweb-sitefooter[theme=dotcom][backgroundcolor=gray] pn-site-footer[theme=dotcom] pn-site-footer-col[theme=dotcom] a:not(h3){color:#005D92}pn-marketweb-sitefooter[theme=tpl] pn-site-footer{background-color:#0D234B;padding-top:6rem}@media screen and (max-width: 33.125em){pn-marketweb-sitefooter[theme=tpl] pn-site-footer{padding-left:2.6rem;padding-right:2.6rem}}pn-marketweb-sitefooter[theme=tpl] pn-site-footer>svg{display:none}pn-marketweb-sitefooter[theme=tpl] div.pn-sitefooter-bottom{background-color:#0D234B;color:#FFFFFF;margin:2.5rem 0}pn-marketweb-sitefooter[theme=tpl] div.pn-sitefooter-bottom div[slot=bottom]{border-top:1px solid #005D92;border-bottom:1px solid #005D92}pn-marketweb-sitefooter[theme=tpl] div.pn-sitefooter-bottom a{color:#FFFFFF}pn-marketweb-sitefooter[theme=tpl] div.pn-sitefooter-bottom a:hover{text-decoration:underline;color:#FFFFFF}pn-marketweb-sitefooter[theme=tpl] .pn-sitefooter-top,pn-marketweb-sitefooter[theme=tpl] .pn-sitefooter-logo{background-color:#0D234B;color:#FFFFFF}pn-marketweb-sitefooter[theme=tpl] .pn-sitefooter-top a,pn-marketweb-sitefooter[theme=tpl] .pn-sitefooter-logo a{color:#FBC2C1}pn-marketweb-sitefooter[theme=tpl] .pn-sitefooter-top a:hover,pn-marketweb-sitefooter[theme=tpl] .pn-sitefooter-logo a:hover{text-decoration:underline;color:#FBC2C1}@media screen and (max-width: 60em){pn-marketweb-sitefooter[theme=tpl] .pn-sitefooter-top .pn-sitefooter-cols{padding:0 8rem}}@media screen and (max-width: 60em){pn-marketweb-sitefooter[theme=tpl] .pn-sitefooter-top .pn-sitefooter-cols{padding:0 5rem}}@media screen and (max-width: 48em){pn-marketweb-sitefooter[theme=tpl] .pn-sitefooter-top .pn-sitefooter-cols{padding:0 3rem}}@media screen and (min-width: 33.125em){pn-marketweb-sitefooter[theme=tpl] .pn-sitefooter-top .pn-sitefooter-cols{width:114rem;-ms-flex-pack:justify;justify-content:space-between}}pn-marketweb-sitefooter[theme=tpl] div.pn-sitefooter-logo a svg path{fill:#00A0D6}@media screen and (min-width: 33.125em){pn-marketweb-sitefooter[theme=tpl] div pn-site-footer-col{width:unset;min-width:unset}pn-marketweb-sitefooter[theme=tpl] div pn-site-footer-col:first-child{min-width:45%}}@media screen and (max-width: 60em){pn-marketweb-sitefooter[theme=tpl] div pn-site-footer-col:first-child{min-width:100%;padding-top:0}}pn-marketweb-sitefooter[theme=tpl] div pn-site-footer-col a{display:-ms-inline-flexbox;display:inline-flex;gap:0.7rem;-ms-flex-align:start;align-items:flex-start}pn-marketweb-sitefooter[theme=tpl] div pn-site-footer-col a h3{color:#FFFFFF}pn-marketweb-sitefooter[theme=tpl] div pn-site-footer-col a span.footer-tpl-links{display:none}pn-marketweb-sitefooter[theme=tpl] div pn-site-footer-col a:hover{text-decoration:underline;color:#FBC2C1}pn-marketweb-sitefooter[theme=tpl] div pn-site-footer-col a pn-icon svg{background-color:#FBC2C1;border-radius:0.3rem;height:1.7rem;width:1.7rem;margin-top:0.3rem}pn-marketweb-sitefooter[theme=tpl] div pn-site-footer-col a pn-icon svg path{fill:#0D234B}pn-marketweb-sitefooter[theme=tpl] div pn-site-footer-col h3{margin-bottom:3.5rem}pn-marketweb-sitefooter[theme=tpl] div pn-site-footer-col ul.social-media{-ms-flex-direction:column;flex-direction:column;gap:0.5rem;row-gap:0rem}pn-marketweb-sitefooter[theme=tpl] div pn-site-footer-col ul.social-media li{max-height:4rem}pn-marketweb-sitefooter[theme=tpl] div pn-site-footer-col ul.social-media a{-ms-flex-align:center;align-items:center;gap:0}pn-marketweb-sitefooter[theme=tpl] div pn-site-footer-col ul.social-media a circle{display:none}pn-marketweb-sitefooter[theme=tpl] div pn-site-footer-col ul.social-media a span.footer-tpl-links{display:block}pn-marketweb-sitefooter[theme=tpl] div pn-site-footer-col ul.social-media a svg{height:3.7rem;width:3.7rem}pn-marketweb-sitefooter[theme=tpl] div pn-site-footer-col ul.social-media a svg path{fill:#FBC2C1}";
+const pnMarketwebSitefooterCss = "pn-marketweb-sitefooter .social-media a[target=_blank]:not(.pn-button):after{content:none}@media screen and (min-width: 60em){pn-marketweb-sitefooter:not([theme=dotcom]) pn-site-footer-col:has(div[slot=bottomsocialmediadesktop]){display:-ms-flexbox;display:flex;-ms-flex-line-pack:start;align-content:flex-start;-ms-flex-align:start;align-items:flex-start;-ms-flex-direction:column;flex-direction:column;-ms-flex-wrap:wrap;flex-wrap:wrap;min-width:-webkit-min-content;min-width:-moz-min-content;min-width:min-content}pn-marketweb-sitefooter:not([theme=dotcom]) pn-site-footer-col:has(div[slot=bottomsocialmediadesktop]) div[slot=bottomsocialmediadesktop]{display:block;margin-top:auto;margin-bottom:1.6rem}pn-marketweb-sitefooter:not([theme=dotcom]) pn-site-footer-col:has(div[slot=bottomsocialmediadesktop]) div[slot=bottomsocialmediadesktop] .trustpilot-widget{display:-ms-flexbox;display:flex;-ms-flex-pack:start;justify-content:flex-start}}pn-marketweb-sitefooter:not([theme=dotcom]) [slot=bottomsocialmediamobile]{display:block;margin-top:1rem;margin-bottom:2.3rem}pn-marketweb-sitefooter:not([theme=dotcom]) [slot=bottomsocialmediamobile] .trustpilot-widget{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center}@media screen and (min-width: 33.125em){pn-marketweb-sitefooter:not([theme=dotcom]) [slot=bottomsocialmediamobile] .trustpilot-widget{-ms-flex-pack:start;justify-content:flex-start}}@media screen and (min-width: 60em){pn-marketweb-sitefooter:not([theme=dotcom]) [slot=bottomsocialmediamobile]{display:none}}div[slot=middle-extra-mobile],div[slot=middle-extra]{display:none}pn-marketweb-sitefooter[theme=dotcom]{width:100%}pn-marketweb-sitefooter[theme=dotcom] div[slot=bottomsocialmediamobile],pn-marketweb-sitefooter[theme=dotcom] div[slot=bottomsocialmediadesktop]{display:none}pn-marketweb-sitefooter[theme=dotcom] div[slot=middle-extra-mobile]{display:block;width:100%;text-align:-webkit-center;margin:2.4rem 0}@media screen and (min-width: 1024px){pn-marketweb-sitefooter[theme=dotcom] div[slot=middle-extra-mobile]{display:none}pn-marketweb-sitefooter[theme=dotcom] div[slot=middle-extra]{display:block;width:100%;text-align:-webkit-center;margin:3.2rem 0}}pn-marketweb-sitefooter[theme=dotcom] div[slot=bottom] .social-media.social-media--swan{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center}@media screen and (min-width: 769px){pn-marketweb-sitefooter[theme=dotcom] div[slot=bottom] .social-media.social-media--swan{-ms-flex-direction:row;flex-direction:row}}pn-marketweb-sitefooter[theme=dotcom] div[slot=bottom] .social-media.social-media--swan ul{margin-bottom:1.6rem}@media screen and (min-width: 768px){pn-marketweb-sitefooter[theme=dotcom] div[slot=bottom] .social-media.social-media--swan ul{margin-bottom:0;margin-right:4.8rem}}pn-marketweb-sitefooter[theme=dotcom] div[slot=bottom] .social-media.social-media--swan .swan-wrapper{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;width:100%}@media screen and (min-width: 768px){pn-marketweb-sitefooter[theme=dotcom] div[slot=bottom] .social-media.social-media--swan .swan-wrapper{width:auto;-ms-flex-direction:row;flex-direction:row}}pn-marketweb-sitefooter[theme=dotcom] div[slot=bottom] .social-media.social-media--swan .swan-wrapper .separator{border-top:1px solid #d3cecb;margin-bottom:1.6rem}@media screen and (min-width: 768px){pn-marketweb-sitefooter[theme=dotcom] div[slot=bottom] .social-media.social-media--swan .swan-wrapper .separator{display:-ms-flexbox;display:flex;width:1px;height:auto;min-height:90%;background-color:#d3cecb;margin-right:4.8rem;margin-bottom:0}}pn-marketweb-sitefooter[theme=dotcom] div[slot=bottom] .social-media.social-media--swan .swan-wrapper .swan{justify-self:center;-ms-flex-item-align:center;align-self:center}pn-marketweb-sitefooter[theme=dotcom][backgroundcolor=bluedarkest] pn-site-footer[theme=dotcom] pn-site-footer-col[theme=dotcom] svg path{fill:#FFFFFF}pn-marketweb-sitefooter[theme=dotcom][backgroundcolor=bluedarkest] pn-site-footer[theme=dotcom] pn-swan *{color:white}pn-marketweb-sitefooter[theme=dotcom][backgroundcolor=blue] pn-site-footer[theme=dotcom]{background-color:#005D92}pn-marketweb-sitefooter[theme=dotcom][backgroundcolor=blue] pn-site-footer[theme=dotcom] .pn-sitefooter-top,pn-marketweb-sitefooter[theme=dotcom][backgroundcolor=blue] pn-site-footer[theme=dotcom] .pn-sitefooter-bottom{background-color:#005D92}pn-marketweb-sitefooter[theme=dotcom][backgroundcolor=blue] pn-site-footer[theme=dotcom]>svg path{fill:#005D92}pn-marketweb-sitefooter[theme=dotcom][backgroundcolor=blue] pn-site-footer[theme=dotcom] .pn-sitefooter-bottom .social-media{border-top:0.1rem solid #D3CECB;border-bottom:0.1rem solid #D3CECB}pn-marketweb-sitefooter[theme=dotcom][backgroundcolor=blue] pn-site-footer[theme=dotcom] .pn-sitefooter-bottom .social-media>ul>li:hover svg>circle{fill:#8EDDF9}pn-marketweb-sitefooter[theme=dotcom][backgroundcolor=blue] pn-site-footer[theme=dotcom] pn-site-footer-col[theme=dotcom] svg path{fill:#FFFFFF}pn-marketweb-sitefooter[theme=dotcom][backgroundcolor=blue] pn-site-footer[theme=dotcom] pn-swan *{color:white}pn-marketweb-sitefooter[theme=dotcom][backgroundcolor=gray] pn-site-footer[theme=dotcom]{background-color:#F3F2F2}pn-marketweb-sitefooter[theme=dotcom][backgroundcolor=gray] pn-site-footer[theme=dotcom]>svg path{fill:#F3F2F2}pn-marketweb-sitefooter[theme=dotcom][backgroundcolor=gray] pn-site-footer[theme=dotcom] .pn-sitefooter-top,pn-marketweb-sitefooter[theme=dotcom][backgroundcolor=gray] pn-site-footer[theme=dotcom] .pn-sitefooter-bottom{background-color:#F3F2F2}pn-marketweb-sitefooter[theme=dotcom][backgroundcolor=gray] pn-site-footer[theme=dotcom] .pn-sitefooter-bottom .social-media{border-top:0.1rem solid #D3CECB;border-bottom:0.1rem solid #D3CECB}pn-marketweb-sitefooter[theme=dotcom][backgroundcolor=gray] pn-site-footer[theme=dotcom] .pn-sitefooter-bottom .social-media li svg circle{fill:#005D92}pn-marketweb-sitefooter[theme=dotcom][backgroundcolor=gray] pn-site-footer[theme=dotcom] .pn-sitefooter-bottom .social-media li svg:hover>circle{fill:#00A0D6}pn-marketweb-sitefooter[theme=dotcom][backgroundcolor=gray] pn-site-footer[theme=dotcom] .pn-sitefooter-bottom>[slot=bottom]>.copyright *{color:#005D92}pn-marketweb-sitefooter[theme=dotcom][backgroundcolor=gray] pn-site-footer[theme=dotcom] pn-site-footer-col[theme=dotcom] *{color:#0D234B}pn-marketweb-sitefooter[theme=dotcom][backgroundcolor=gray] pn-site-footer[theme=dotcom] pn-site-footer-col[theme=dotcom] svg path{fill:#0D234B}pn-marketweb-sitefooter[theme=dotcom][backgroundcolor=gray] pn-site-footer[theme=dotcom] pn-site-footer-col[theme=dotcom] a:not(h3){color:#005D92}pn-marketweb-sitefooter[theme=tpl] pn-site-footer{background-color:#0D234B;padding-top:6rem}@media screen and (max-width: 33.125em){pn-marketweb-sitefooter[theme=tpl] pn-site-footer{padding-left:2.6rem;padding-right:2.6rem}}pn-marketweb-sitefooter[theme=tpl] pn-site-footer>svg{display:none}pn-marketweb-sitefooter[theme=tpl] div.pn-sitefooter-bottom{background-color:#0D234B;color:#FFFFFF;margin:2.5rem 0}pn-marketweb-sitefooter[theme=tpl] div.pn-sitefooter-bottom div[slot=bottom]{border-top:1px solid #005D92;border-bottom:1px solid #005D92}pn-marketweb-sitefooter[theme=tpl] div.pn-sitefooter-bottom a{color:#FFFFFF}pn-marketweb-sitefooter[theme=tpl] div.pn-sitefooter-bottom a:hover{text-decoration:underline;color:#FFFFFF}pn-marketweb-sitefooter[theme=tpl] .pn-sitefooter-top,pn-marketweb-sitefooter[theme=tpl] .pn-sitefooter-logo{background-color:#0D234B;color:#FFFFFF}pn-marketweb-sitefooter[theme=tpl] .pn-sitefooter-top a,pn-marketweb-sitefooter[theme=tpl] .pn-sitefooter-logo a{color:#FBC2C1}pn-marketweb-sitefooter[theme=tpl] .pn-sitefooter-top a:hover,pn-marketweb-sitefooter[theme=tpl] .pn-sitefooter-logo a:hover{text-decoration:underline;color:#FBC2C1}@media screen and (max-width: 60em){pn-marketweb-sitefooter[theme=tpl] .pn-sitefooter-top .pn-sitefooter-cols{padding:0 8rem}}@media screen and (max-width: 60em){pn-marketweb-sitefooter[theme=tpl] .pn-sitefooter-top .pn-sitefooter-cols{padding:0 5rem}}@media screen and (max-width: 48em){pn-marketweb-sitefooter[theme=tpl] .pn-sitefooter-top .pn-sitefooter-cols{padding:0 3rem}}@media screen and (min-width: 33.125em){pn-marketweb-sitefooter[theme=tpl] .pn-sitefooter-top .pn-sitefooter-cols{width:114rem;-ms-flex-pack:justify;justify-content:space-between}}pn-marketweb-sitefooter[theme=tpl] div.pn-sitefooter-logo a svg path{fill:#00A0D6}@media screen and (min-width: 33.125em){pn-marketweb-sitefooter[theme=tpl] div pn-site-footer-col{width:unset;min-width:unset}pn-marketweb-sitefooter[theme=tpl] div pn-site-footer-col:first-child{min-width:45%}}@media screen and (max-width: 60em){pn-marketweb-sitefooter[theme=tpl] div pn-site-footer-col:first-child{min-width:100%;padding-top:0}}pn-marketweb-sitefooter[theme=tpl] div pn-site-footer-col a{display:-ms-inline-flexbox;display:inline-flex;gap:0.7rem;-ms-flex-align:start;align-items:flex-start}pn-marketweb-sitefooter[theme=tpl] div pn-site-footer-col a h3{color:#FFFFFF}pn-marketweb-sitefooter[theme=tpl] div pn-site-footer-col a span.footer-tpl-links{display:none}pn-marketweb-sitefooter[theme=tpl] div pn-site-footer-col a:hover{text-decoration:underline;color:#FBC2C1}pn-marketweb-sitefooter[theme=tpl] div pn-site-footer-col a pn-icon svg{background-color:#FBC2C1;border-radius:0.3rem;height:1.7rem;width:1.7rem;margin-top:0.3rem}pn-marketweb-sitefooter[theme=tpl] div pn-site-footer-col a pn-icon svg path{fill:#0D234B}pn-marketweb-sitefooter[theme=tpl] div pn-site-footer-col h3{margin-bottom:3.5rem}pn-marketweb-sitefooter[theme=tpl] div pn-site-footer-col ul.social-media{-ms-flex-direction:column;flex-direction:column;gap:0.5rem;row-gap:0rem}pn-marketweb-sitefooter[theme=tpl] div pn-site-footer-col ul.social-media li{max-height:4rem}pn-marketweb-sitefooter[theme=tpl] div pn-site-footer-col ul.social-media a{-ms-flex-align:center;align-items:center;gap:0}pn-marketweb-sitefooter[theme=tpl] div pn-site-footer-col ul.social-media a circle{display:none}pn-marketweb-sitefooter[theme=tpl] div pn-site-footer-col ul.social-media a span.footer-tpl-links{display:block}pn-marketweb-sitefooter[theme=tpl] div pn-site-footer-col ul.social-media a svg{height:3.7rem;width:3.7rem}pn-marketweb-sitefooter[theme=tpl] div pn-site-footer-col ul.social-media a svg path{fill:#FBC2C1}";
 
 const PnMarketwebSiteheader = class {
   constructor(hostRef) {

package/esm/pn-multi-row-connected-dropdown-row.entry.js

@@ -0,0 +1,368 @@
+import { r as registerInstance, c as createEvent, h, a as Host, g as getElement } from './index-ee44c065.js';
+import { d as debounce_1 } from './index-8976f360.js';
+import { v as v4 } from './v4-f450efa7.js';
+
+const pnMultiRowConnectedDropdownRowCss = "pn-multi-row-connected-dropdown-row{gap:1rem}pn-multi-row-connected-dropdown-row .connected-dropdown-parent-element{margin-bottom:0.5rem}pn-multi-row-connected-dropdown-row pn-select{width:35%}pn-multi-row-connected-dropdown-row pn-marketweb-input{width:10%}pn-multi-row-connected-dropdown-row pn-marketweb-input input{height:4.3rem}pn-multi-row-connected-dropdown-row .connected-dropdown{padding:1rem;border-left:0.2rem solid #005D92}pn-multi-row-connected-dropdown-row .connected-dropdown:hover{background-color:#F9F8F8}pn-multi-row-connected-dropdown-row .connected-dropdown__toggle-date-button{width:20%;margin-bottom:0.5rem}pn-multi-row-connected-dropdown-row .connected-dropdown__row{display:-ms-flexbox;display:flex;-ms-flex-align:end;align-items:flex-end;gap:1rem;margin-bottom:1rem;-ms-flex-pack:justify;justify-content:space-between}pn-multi-row-connected-dropdown-row .connected-dropdown__row__no-margin{margin:0}pn-multi-row-connected-dropdown-row .connected-dropdown__multi-date-row{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;gap:1rem;margin-bottom:1rem}pn-multi-row-connected-dropdown-row .connected-dropdown__button-container{display:-ms-flexbox;display:flex;-ms-flex-align:end;align-items:flex-end;gap:1rem}pn-multi-row-connected-dropdown-row .connected-dropdown__button{background-color:#ffffff;border:solid;border-width:0.1rem;border-radius:0.8rem;border-color:#005D92;padding:0.4rem 0.8rem;color:#005D92;font-size:1.4rem;text-align:center;text-decoration:none;cursor:pointer}pn-multi-row-connected-dropdown-row .connected-dropdown__button:hover,pn-multi-row-connected-dropdown-row .connected-dropdown__button.active{background-color:#0D234B;border-color:#0D234B;color:#ffffff}pn-multi-row-connected-dropdown-row .connected-dropdown__buttom-container-right{display:-ms-flexbox;display:flex}pn-multi-row-connected-dropdown-row .connected-dropdown__button-right{margin-left:auto}pn-multi-row-connected-dropdown-row .connected-dropdown__label-container{margin-bottom:0.4rem;color:#5E554A;font-size:0.875em;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-align:end;align-items:flex-end}pn-multi-row-connected-dropdown-row .connected-dropdown__checkbox{display:-ms-flexbox;display:flex;gap:0.5rem}pn-multi-row-connected-dropdown-row .connected-dropdown__date-slot{border:0.1rem solid #005D92;margin-bottom:1rem;padding:1rem}pn-multi-row-connected-dropdown-row .generated-date-row{border-bottom:0.1rem solid #005D92}";
+
+const PnMultiRowConnectedDropdownRow = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.rowValueChange = createEvent(this, "rowValueChange", 7);
+    this.deleteRowEvent = createEvent(this, "deleteRowEvent", 7);
+    this.pnConnectedDropdown = null;
+    this.pnConnectedDropdownSlotElement = null;
+    this.pnAddFieldButton = null;
+    this.pnFirstDropdown = null;
+    this.pnSecondDropdown = null;
+    this.pnInputField = null;
+    this.pnSingleDatePicker = null;
+    this.pnStartDate = null;
+    this.pnEndDate = null;
+    this.pnShowDateRangeFiledButton = null;
+    this.pnDateRangeContainer = null;
+    this.pnGenerateDatesButton = null;
+    this.pnDaysRow = null;
+    this.pnGeneratedDatesSlot = null;
+    this.pnSaveGeneratedDatesButton = null;
+    this.pnDeleteRowButton = null;
+    this.dropdownData = null;
+    this.languageCode = null;
+    this.label = null;
+    this.firstDropdownLabel = null;
+    this.secondDropdownLabel = null;
+    this.dropdownPlaceholder = null;
+    this.addRowText = null;
+    this.inputFildLabel = null;
+    this.inputFildPlaceholder = null;
+    this.dateButtonText = null;
+    this.datePlaceholder = null;
+    this.dateDaysFromToday = 1;
+    this.allowMultipleDates = null;
+    this.startDateLabel = null;
+    this.endDateLabel = null;
+    this.multiDateHelperText = null;
+    this.generateDatesButtonText = null;
+    this.saveDateButtonText = null;
+    this.noDatesText = null;
+    this.index = null;
+    this.predefinedValue = null;
+    this.yearsToAddToEndDate = null;
+    this.buttonsArray = null;
+    this.firstDropdownArr = null;
+    this.secondDropdownArr = [];
+    this.firstDropdownClass = null;
+    this.secondDropdownClass = null;
+    this.firstValidDateString = '';
+    this.lastValidDateString = '';
+    this.firstDropdownPlaceholder = '-';
+    this.secondDropdownPlaceholder = '-';
+    this.starDateValue = '';
+    this.endDateValue = '';
+    this.generatedDatesArr = [];
+    this.selectedButtonValue = '';
+    this.inputFieldValue = '';
+    this.dateValue = '';
+    this.daysArr = null;
+  }
+  componentWillLoad() {
+    this.getPredefinedValues();
+    this.setDropDownData();
+    this.setFirstValidDate();
+  }
+  componentDidLoad() {
+    this.setInitialValues();
+    this.addEventHandlers();
+    this.emittRowValues();
+  }
+  setDropDownData() {
+    if (typeof this.dropdownData === 'string') {
+      this._dropdownData = JSON.parse(this.dropdownData);
+    }
+    else {
+      this._dropdownData = this.dropdownData;
+    }
+  }
+  getPredefinedValues() {
+    this._predefinedValue = JSON.parse(this.predefinedValue);
+  }
+  applyPredefinedValue() {
+    this.getPredefinedValues();
+    this.setInitialValues();
+  }
+  setInitialValues() {
+    this.setButtonsValue();
+    this.setFirstDropdownValues();
+    this.setSecondDropdownValues();
+    this.setInputField();
+    this.setDateValue();
+    this.setDateRangeDefaults();
+    this.firstDropdownClass = this.firstDropdownLabel.replace(' ', '_') + '-dropdown';
+    this.secondDropdownClass = this.secondDropdownLabel.replace(' ', '_') + '-dropdown';
+  }
+  setButtonsValue() {
+    var _a;
+    this.buttonsArray = [];
+    if ((_a = this._predefinedValue.buttons) === null || _a === void 0 ? void 0 : _a.length) {
+      this.buttonsArray = this._predefinedValue.buttons;
+      this.buttonsArray.forEach(item => {
+        if (item.selected) {
+          this.selectedButtonValue = item.value;
+        }
+      });
+    }
+    else {
+      this._dropdownData.forEach(item => {
+        const button = { selected: false, value: item.caption, caption: item.caption };
+        this.buttonsArray.push(button);
+      });
+    }
+  }
+  setFirstDropdownValues() {
+    var _a;
+    this.firstDropdownArr = [];
+    if ((_a = this._predefinedValue.firstDropdown) === null || _a === void 0 ? void 0 : _a.length) {
+      this.firstDropdownArr = [...this._predefinedValue.firstDropdown];
+    }
+  }
+  setSecondDropdownValues() {
+    var _a;
+    this.secondDropdownArr = [];
+    if ((_a = this._predefinedValue.secondDropdown) === null || _a === void 0 ? void 0 : _a.length) {
+      this.secondDropdownArr = [...this._predefinedValue.secondDropdown];
+    }
+  }
+  setInputField() {
+    var _a;
+    this.inputFieldValue = ((_a = this._predefinedValue.input) === null || _a === void 0 ? void 0 : _a.length) ? this._predefinedValue.input : '';
+  }
+  setDateValue() {
+    var _a, _b, _c;
+    if (this.allowMultipleDates) {
+      this.pnDateRangeContainer.style.display = ((_a = this._predefinedValue.dates) === null || _a === void 0 ? void 0 : _a.length) ? '' : 'none';
+      this.generatedDatesArr = ((_b = this._predefinedValue.dates) === null || _b === void 0 ? void 0 : _b.length) ? this._predefinedValue.dates.split(',') : [];
+      this.saveGeneratedDates();
+    }
+    else {
+      this.dateValue = ((_c = this._predefinedValue.dates) === null || _c === void 0 ? void 0 : _c.length) ? this._predefinedValue.dates : '';
+    }
+  }
+  setDateRangeDefaults() {
+    var _a, _b;
+    this.daysArr = this._predefinedValue.dateRange.days;
+    this.starDateValue = ((_a = this._predefinedValue.dateRange.startDate) === null || _a === void 0 ? void 0 : _a.length) ? this._predefinedValue.dateRange.startDate : '';
+    this.endDateValue = ((_b = this._predefinedValue.dateRange.endDate) === null || _b === void 0 ? void 0 : _b.length) ? this._predefinedValue.dateRange.endDate : '';
+  }
+  setFirstValidDate() {
+    var _a;
+    const yearsToadd = this.yearsToAddToEndDate ? this.yearsToAddToEndDate : 2;
+    const date = new Date();
+    date.setDate((_a = date.getDate() + this.dateDaysFromToday) !== null && _a !== void 0 ? _a : 0);
+    const year = date.getFullYear();
+    const month = (date.getMonth() + 1).toString().padStart(2, '0');
+    const day = date.getDate().toString().padStart(2, '0');
+    const endYear = year + yearsToadd;
+    this.firstValidDateString = `${year.toString()}-${month}-${day}`;
+    this.lastValidDateString = `${endYear.toString()}-${month}-${day}`;
+  }
+  addEventHandlers() {
+    const emmitValues = debounce_1.debounce(this.emittRowValues.bind(this), 500);
+    this.pnInputField.addEventListener('keyup', this.handleInput.bind(this));
+    this.pnInputField.addEventListener('change', this.handleInput.bind(this));
+    this.pnInputField.addEventListener('keyup', emmitValues);
+    this.pnInputField.addEventListener('change', emmitValues);
+    if (this.allowMultipleDates) {
+      this.pnShowDateRangeFiledButton.addEventListener('click', this.showDateRangeRow.bind(this));
+      this.pnStartDate.addEventListener('dateselection', this.HandleRangeDatePickers.bind(this));
+      this.pnEndDate.addEventListener('dateselection', this.HandleRangeDatePickers.bind(this));
+      this.pnGenerateDatesButton.addEventListener('click', this.generateDates.bind(this));
+      this.pnSaveGeneratedDatesButton.addEventListener('click', this.saveGeneratedDates.bind(this));
+      this.pnSaveGeneratedDatesButton.addEventListener('click', emmitValues);
+    }
+    else {
+      this.pnSingleDatePicker.addEventListener('dateselection', this.setSingleDateValue.bind(this));
+      this.pnSingleDatePicker.addEventListener('dateselection', emmitValues);
+    }
+    if (this.index > 0) {
+      this.pnDeleteRowButton.addEventListener('click', this.deleteRow.bind(this));
+    }
+  }
+  generateUniqueId() {
+    return v4();
+  }
+  updateSelectItemArr(arr, val) {
+    arr.forEach(item => {
+      if (item.value === val) {
+        item.selected = !item.selected;
+      }
+      else {
+        item.selected = false;
+      }
+    });
+    return arr;
+  }
+  handleOptionButtonClick(e) {
+    var _a;
+    e.preventDefault();
+    const elmValue = e.target.innerHTML;
+    this.buttonsArray = [...this.updateSelectItemArr(this.buttonsArray, elmValue)];
+    this.selectedButtonValue = this.buttonsArray.filter(e => e.selected === true).length > 0 ? elmValue : '';
+    if ((_a = this.selectedButtonValue) === null || _a === void 0 ? void 0 : _a.length) {
+      this.firstDropdownArr = [];
+      const selectionChildren = this._dropdownData.find(arr => arr.caption === elmValue);
+      selectionChildren.values.forEach(item => {
+        this.firstDropdownArr.push({ selected: false, value: item.caption, caption: item.caption });
+      });
+      this.firstDropdownArr = [...this.firstDropdownArr];
+      this.firstDropdownPlaceholder = this.dropdownPlaceholder;
+      const firstDropdownText = this.pnFirstDropdown.querySelector('.current-selection .pn-option-content');
+      firstDropdownText.innerHTML = this.dropdownPlaceholder;
+      this.secondDropdownArr = [];
+      this.secondDropdownPlaceholder = '-';
+      const secondDropdownText = this.pnSecondDropdown.querySelector('.current-selection .pn-option-content');
+      secondDropdownText.innerHTML = this.secondDropdownPlaceholder;
+    }
+    else {
+      this.firstDropdownArr = [];
+      this.firstDropdownPlaceholder = '-';
+      const firstDropdownText = this.pnFirstDropdown.querySelector('.current-selection .pn-option-content');
+      firstDropdownText.innerHTML = this.firstDropdownPlaceholder;
+      this.secondDropdownArr = [];
+      this.secondDropdownPlaceholder = '-';
+      const secondDropdownText = this.pnSecondDropdown.querySelector('.current-selection .pn-option-content');
+      secondDropdownText.innerHTML = this.secondDropdownPlaceholder;
+    }
+    this.emittRowValues();
+  }
+  handleFirstDropdownChange() {
+    const selected = this.pnFirstDropdown.querySelector('.current-selection .pn-option-content');
+    const selectedValue = selected === null || selected === void 0 ? void 0 : selected.textContent;
+    this.firstDropdownArr = [...this.updateSelectItemArr(this.firstDropdownArr, selectedValue)];
+    this.secondDropdownArr = [];
+    const selectedButton = this.buttonsArray.findIndex(item => item.selected === true);
+    const firstChildren = this._dropdownData.find(arr => arr.caption === this.buttonsArray[selectedButton].value);
+    const secondChildren = firstChildren.values.find(arr => arr.caption === selectedValue);
+    secondChildren.values.forEach(item => {
+      this.secondDropdownArr.push({ selected: false, value: item.caption, caption: item.caption });
+    });
+    this.secondDropdownPlaceholder = this.dropdownPlaceholder;
+    const secondDropdownText = this.pnSecondDropdown.querySelector('.current-selection .pn-option-content');
+    secondDropdownText.innerHTML = this.secondDropdownPlaceholder;
+    this.emittRowValues();
+  }
+  handleSecondDropdownChange() {
+    const selected = this.pnSecondDropdown.querySelector('.current-selection .pn-option-content');
+    const selectedValue = selected === null || selected === void 0 ? void 0 : selected.textContent;
+    this.secondDropdownArr = [...this.updateSelectItemArr(this.secondDropdownArr, selectedValue)];
+    this.emittRowValues();
+  }
+  handleInput(e) {
+    const elm = e.target;
+    if (elm.value !== '0') {
+      this.inputFieldValue = elm.value;
+    }
+  }
+  showDateRangeRow() {
+    if (this.pnDateRangeContainer.style.display === 'none') {
+      this.pnDateRangeContainer.style.display = '';
+    }
+    else {
+      this.pnDateRangeContainer.style.display = 'none';
+    }
+  }
+  HandleRangeDatePickers(e) {
+    const elm = e.target;
+    if (elm === this.pnStartDate) {
+      this.starDateValue = e.detail;
+    }
+    if (elm === this.pnEndDate) {
+      this.endDateValue = e.detail;
+    }
+  }
+  generateDates(e) {
+    var _a;
+    e.preventDefault();
+    const allCheckboxes = this.pnDaysRow.querySelectorAll('pn-filter-checkbox');
+    const selectedDays = [];
+    this.generatedDatesArr = [];
+    allCheckboxes.forEach(element => {
+      const input = element.querySelector('input');
+      if (input.value) {
+        selectedDays.push(input.value);
+      }
+    });
+    if (selectedDays.length && this.starDateValue && this.endDateValue) {
+      this.daysArr.forEach(item => {
+        if (selectedDays.some(x => x === item.value)) {
+          item.selected = true;
+        }
+        else {
+          item.selected = false;
+        }
+      });
+      const startDate = new Date(Date.parse(this.starDateValue));
+      const endDate = new Date(Date.parse(this.endDateValue));
+      for (var d = startDate; d <= endDate; d.setDate(d.getDate() + 1)) {
+        const i = this.daysArr.findIndex(item => parseInt(item.value) === d.getDay());
+        if ((_a = this.daysArr[i]) === null || _a === void 0 ? void 0 : _a.selected) {
+          const year = d.getFullYear();
+          const month = (d.getMonth() + 1).toString().padStart(2, '0');
+          const day = d.getDate().toString().padStart(2, '0');
+          this.generatedDatesArr.push(`${year}-${month}-${day}`);
+        }
+      }
+    }
+  }
+  deleteGeneratedDateRow(index) {
+    this.generatedDatesArr.splice(index, 1);
+    this.generatedDatesArr = [...this.generatedDatesArr];
+  }
+  saveGeneratedDates() {
+    var _a;
+    if ((_a = this.generatedDatesArr) === null || _a === void 0 ? void 0 : _a.length) {
+      this.dateValue = String(this.generatedDatesArr);
+      const dateCount = this.generatedDatesArr.length;
+      const buttonTextElm = this.pnShowDateRangeFiledButton.querySelector('.pn-button-content');
+      buttonTextElm.innerHTML = dateCount > 0 ? `${this.dateButtonText} (${dateCount})` : this.dateButtonText;
+      this.showDateRangeRow();
+    }
+  }
+  setSingleDateValue(e) {
+    const elm = e.target;
+    if (elm === this.pnSingleDatePicker) {
+      this.dateValue = e.detail;
+    }
+  }
+  emittRowValues() {
+    this.rowValueChange.emit({
+      id: this._predefinedValue.id,
+      buttons: this.buttonsArray,
+      firstDropdown: this.firstDropdownArr,
+      secondDropdown: this.secondDropdownArr,
+      input: this.inputFieldValue,
+      dates: this.dateValue,
+      dateRange: {
+        days: this.daysArr,
+        startDate: this.starDateValue,
+        endDate: this.endDateValue,
+      },
+    });
+  }
+  deleteRow() {
+    this.deleteRowEvent.emit(this._predefinedValue.id);
+  }
+  setActive(active) {
+    return active ? 'connected-dropdown__button active' : 'connected-dropdown__button';
+  }
+  render() {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j;
+    return (h(Host, null, h("div", { ref: el => (this.pnConnectedDropdownSlotElement = el), class: "connected-dropdown-slot-element" }, h("div", { class: "connected-dropdown-parent-element connected-dropdown" }, h("div", { class: "connected-dropdown__row__no-margin" }, h("label", null, this.label)), h("div", { class: "connected-dropdown__row button-row" }, h("div", { class: "connected-dropdown__button-container option-buttons" }, (_a = this.buttonsArray) === null || _a === void 0 ? void 0 : _a.map(item => (h("button", { class: `${this.setActive(item.selected)}`, id: this.generateUniqueId(), onClick: this.handleOptionButtonClick.bind(this) }, item.value)))), h("div", { class: "connected-dropdown__button-container delete-button" }, this.index > 0 ? (h("pn-button", { ref: el => (this.pnDeleteRowButton = el), small: "true", "icon-only": "true", icon: "minus", appearance: "warning", index: this.index }, "Delete")) : null)), h("div", { class: "connected-dropdown__row input-row" }, h("pn-select", { ref: el => (this.pnFirstDropdown = el), class: "pn-row-select-dropdown dropDown1-dropdown", placeholder: this.firstDropdownPlaceholder, label: this.firstDropdownLabel }, (_b = this.firstDropdownArr) === null || _b === void 0 ? void 0 : _b.map((item, i) => (h("pn-option", { index: i, value: item.value, selected: item.selected, onClick: debounce_1.debounce(this.handleFirstDropdownChange.bind(this), 500) }, item.value)))), h("pn-select", { ref: el => (this.pnSecondDropdown = el), class: "pn-row-select-dropdown dropDown2-dropdown", placeholder: this.secondDropdownPlaceholder, label: this.secondDropdownLabel }, (_c = this.secondDropdownArr) === null || _c === void 0 ? void 0 : _c.map((item, i) => (h("pn-option", { index: i, value: item.value, selected: item.selected, onClick: debounce_1.debounce(this.handleSecondDropdownChange.bind(this), 500) }, item.value)))), h("pn-marketweb-input", { ref: el => (this.pnInputField = el), type: "number", placeholder: "0", label: this.inputFildLabel, value: this.inputFieldValue, min: "1" }), this.allowMultipleDates ? (h("pn-button", { ref: el => (this.pnShowDateRangeFiledButton = el), class: "connected-dropdown__toggle-date-button", small: "true", appearance: "light" }, this.dateButtonText)) : (h("div", { class: "connected-dropdown__date-container" }, h("div", { class: "connected-dropdown__label-container" }, h("label", null, this.dateButtonText)), h("pn-date-picker", { ref: el => (this.pnSingleDatePicker = el), range: "false", "disable-weekends": true, "min-date": this.firstValidDateString, language: this.languageCode, placeholder: this.datePlaceholder, class: "connected-dropdown__date-picker", start: ((_d = this.dateValue) === null || _d === void 0 ? void 0 : _d.length) ? this.dateValue : null })))), this.allowMultipleDates ? (h("div", { ref: el => (this.pnDateRangeContainer = el), class: "connected-dropdown__date-container", style: { display: 'none' } }, this.multiDateHelperText ? (h("div", { class: "connected-dropdown__row" }, h("p", null, this.multiDateHelperText))) : null, h("div", { class: "connected-dropdown__multi-date-row" }, h("div", { class: "connected-dropdown__date-container" }, h("div", { class: "connected-dropdown__label-container" }, h("label", null, this.startDateLabel)), h("pn-date-picker", { ref: el => (this.pnStartDate = el), range: "false", "disable-weekends": true, class: "connected-dropdown__date-picker", "min-date": this.firstValidDateString, "max-date": this.lastValidDateString, language: this.languageCode, placeholder: this.datePlaceholder, start: ((_e = this.starDateValue) === null || _e === void 0 ? void 0 : _e.length) ? this.starDateValue : null })), h("div", { class: "connected-dropdown__date-container" }, h("div", { class: "connected-dropdown__label-container" }, h("label", null, this.endDateLabel)), h("pn-date-picker", { ref: el => (this.pnEndDate = el), range: "false", "disable-weekends": true, class: "connected-dropdown__date-picker", "min-date": this.firstValidDateString, "max-date": this.lastValidDateString, language: this.languageCode, placeholder: this.datePlaceholder, start: ((_f = this.endDateValue) === null || _f === void 0 ? void 0 : _f.length) ? this.endDateValue : null }))), h("div", { ref: el => (this.pnDaysRow = el), class: "connected-dropdown__multi-date-row" }, (_g = this.daysArr) === null || _g === void 0 ? void 0 : _g.map((day) => (h("div", { class: "connected-dropdown__checkbox" }, h("pn-filter-checkbox", { checkboxid: 'day-' + day.value, name: '__' + day.caption, value: day.value, checked: day.selected }), h("label", { htmlFor: 'day-' + day.value }, day.caption))))), h("div", { class: "connected-dropdown__row" }, h("pn-button", { ref: el => (this.pnGenerateDatesButton = el), small: "true" }, this.generateDatesButtonText)), h("div", { ref: el => (this.pnGeneratedDatesSlot = el), class: "connected-dropdown__date-slot" }, (_h = this.generatedDatesArr) === null || _h === void 0 ? void 0 :
+      _h.map((date, i) => (h("div", { class: "connected-dropdown__row generated-date-row" }, h("p", null, date), h("pn-button", { index: i, small: "true", "icon-only": "true", icon: "minus", appearance: "warning", id: 'delete-date-' + i, onClick: this.deleteGeneratedDateRow.bind(this, i) }, date)))), !((_j = this.generatedDatesArr) === null || _j === void 0 ? void 0 : _j.length) ? h("p", null, this.noDatesText) : null), h("div", { class: "connected-dropdown__row" }, h("pn-button", { ref: el => (this.pnSaveGeneratedDatesButton = el), class: "connected-dropdown__button-right", small: "true" }, this.saveDateButtonText)))) : null))));
+  }
+  get hostElement() { return getElement(this); }
+  static get watchers() { return {
+    "predefinedValue": ["applyPredefinedValue"]
+  }; }
+};
+PnMultiRowConnectedDropdownRow.style = pnMultiRowConnectedDropdownRowCss;
+
+export { PnMultiRowConnectedDropdownRow as pn_multi_row_connected_dropdown_row };

package/esm/pn-multi-row-connected-dropdown.entry.js

@@ -0,0 +1,201 @@
+import { r as registerInstance, c as createEvent, h, a as Host, g as getElement } from './index-ee44c065.js';
+import { v as v4 } from './v4-f450efa7.js';
+
+const pnMultiRowConnectedDropdownCss = "pn-multi-row-connected-dropdown{gap:1rem}pn-multi-row-connected-dropdown .connected-dropdown__row{display:-ms-flexbox;display:flex;-ms-flex-align:end;align-items:flex-end;gap:1rem;margin-bottom:1rem;-ms-flex-pack:justify;justify-content:space-between}pn-multi-row-connected-dropdown .connected-dropdown__row__no-margin{margin:0}pn-multi-row-connected-dropdown .connected-dropdown__button-right{margin-left:auto}";
+
+const PnMultiRowConnectedDropdown = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.allFormValues = createEvent(this, "allFormValues", 7);
+    this._buttonValueName = null;
+    this._firstDropdownValueName = null;
+    this._secondDropdownValueName = null;
+    this._inputValueName = null;
+    this._dateValueName = null;
+    this._defaultRow = {
+      id: this.generateUniqueId(),
+      buttons: [],
+      firstDropdown: [],
+      secondDropdown: [],
+      input: '',
+      dates: '',
+      dateRange: {
+        days: [],
+        startDate: '',
+        endDate: '',
+      },
+    };
+    this.dropdownData = null;
+    this.languageCode = null;
+    this.label = null;
+    this.firstDropdownLabel = null;
+    this.secondDropdownLabel = null;
+    this.dropdownPlaceholder = null;
+    this.addRowText = null;
+    this.inputFildLabel = null;
+    this.inputFildPlaceholder = null;
+    this.dateButtonText = null;
+    this.datePlaceholder = null;
+    this.dateDaysFromToday = null;
+    this.allowMultipleRows = false;
+    this.allowMultipleDates = false;
+    this.startDateLabel = null;
+    this.endDateLabel = null;
+    this.multiDateHelperText = null;
+    this.generateDatesButtonText = null;
+    this.saveDateButtonText = null;
+    this.noDatesText = null;
+    this.yearsToAddToEndDate = null;
+    this.rowCount = null;
+    this.rowData = null;
+    this.formValues = null;
+  }
+  componentWillLoad() {
+    var _a, _b, _c, _d, _e;
+    this.setDaysArr();
+    this.formValues = [];
+    this.rowData = [this._defaultRow];
+    this.rowCount = this.rowData.length;
+    this._buttonValueName = ((_a = this.label) === null || _a === void 0 ? void 0 : _a.length) ? this.label : 'value0';
+    this._firstDropdownValueName = ((_b = this.firstDropdownLabel) === null || _b === void 0 ? void 0 : _b.length) ? this.firstDropdownLabel : 'value1';
+    this._secondDropdownValueName = ((_c = this.secondDropdownLabel) === null || _c === void 0 ? void 0 : _c.length) ? this.secondDropdownLabel : 'value2';
+    this._inputValueName = ((_d = this.inputFildLabel) === null || _d === void 0 ? void 0 : _d.length) ? this.inputFildLabel : 'value3';
+    this._dateValueName = ((_e = this.dateButtonText) === null || _e === void 0 ? void 0 : _e.length) ? this.dateButtonText : 'value4';
+  }
+  componentDidLoad() { }
+  emittValuesIfValid() {
+    this.formValues = [];
+    this.rowData.forEach(item => {
+      const rowValue = { row: [] };
+      const buttonSelection = item.buttons.find(x => x.selected === true);
+      if (buttonSelection) {
+        const buttonValue = { name: this._buttonValueName, value: buttonSelection.caption };
+        rowValue.row.push(buttonValue);
+      }
+      const firstDropdownSelection = item.firstDropdown.find(x => x.selected === true);
+      if (firstDropdownSelection) {
+        const firstDropdownValue = { name: this._firstDropdownValueName, value: firstDropdownSelection.caption };
+        rowValue.row.push(firstDropdownValue);
+      }
+      const secondDropdownSelection = item.secondDropdown.find(x => x.selected === true);
+      if (secondDropdownSelection) {
+        const secondDropdownValue = { name: this._secondDropdownValueName, value: secondDropdownSelection.caption };
+        rowValue.row.push(secondDropdownValue);
+      }
+      const input = item.input;
+      if (input === null || input === void 0 ? void 0 : input.length) {
+        const inputValue = { name: this._inputValueName, value: input };
+        rowValue.row.push(inputValue);
+      }
+      const dates = item.dates;
+      if (dates === null || dates === void 0 ? void 0 : dates.length) {
+        const datestValue = { name: this._dateValueName, value: dates };
+        rowValue.row.push(datestValue);
+      }
+      if (rowValue.row.length === 5) {
+        this.formValues.push(rowValue);
+      }
+    });
+    if (this.formValues.length === this.rowData.length) {
+      const valueJsonString = JSON.stringify(this.formValues);
+      this.allFormValues.emit(valueJsonString);
+    }
+    else {
+      this.allFormValues.emit('');
+    }
+  }
+  predefinedValueChange(e) {
+    const indexToUpdate = this.rowData.findIndex(data => data.id === e.detail.id);
+    const val = e.detail;
+    this.rowData[indexToUpdate] = Object.assign(Object.assign({}, this.rowData[indexToUpdate]), { buttons: val.buttons, firstDropdown: val.firstDropdown, secondDropdown: val.secondDropdown, input: val.input, dates: val.dates, dateRange: val.dateRange });
+    this.emittValuesIfValid();
+  }
+  deleteRowEvent(e) {
+    const indexToRemove = this.rowData.findIndex(data => data.id === e.detail);
+    this.rowData.splice(indexToRemove, 1);
+    this.rowData = [...this.rowData];
+    this.rowCount = this.rowData.length;
+    this.emittValuesIfValid();
+  }
+  generateUniqueId() {
+    return v4();
+  }
+  addRow() {
+    const newRow = this._defaultRow;
+    newRow.id = this.generateUniqueId();
+    this.rowData = [...this.rowData, newRow];
+    this.rowCount = this.rowData.length;
+  }
+  setDaysArr() {
+    const language = this.languageCode.toLowerCase();
+    switch (language) {
+      case 'en':
+        this._defaultRow.dateRange.days = [
+          { caption: 'Monday', value: '1', selected: false },
+          { caption: 'Tuesday', value: '2', selected: false },
+          { caption: 'Wednesday', value: '3', selected: false },
+          { caption: 'Thursday', value: '4', selected: false },
+          { caption: 'Friday', value: '5', selected: false },
+        ];
+        break;
+      case 'sv':
+        this._defaultRow.dateRange.days = [
+          { caption: 'Måndag', value: '1', selected: false },
+          { caption: 'Tisdag', value: '2', selected: false },
+          { caption: 'Onsdag', value: '3', selected: false },
+          { caption: 'Torsdag', value: '4', selected: false },
+          { caption: 'Fredag', value: '5', selected: false },
+        ];
+        break;
+      case 'da':
+        this._defaultRow.dateRange.days = [
+          { caption: 'Mandag', value: '1', selected: false },
+          { caption: 'Tirsdag', value: '2', selected: false },
+          { caption: 'Onsdag', value: '3', selected: false },
+          { caption: 'Torsdag', value: '4', selected: false },
+          { caption: 'Fredag', value: '5', selected: false },
+        ];
+        break;
+      case 'fi':
+        this._defaultRow.dateRange.days = [
+          { caption: 'Maanantai', value: '1', selected: false },
+          { caption: 'Tiistai', value: '2', selected: false },
+          { caption: 'Keskiviikko', value: '3', selected: false },
+          { caption: 'Torstai', value: '4', selected: false },
+          { caption: 'Perjantai', value: '5', selected: false },
+        ];
+        break;
+      case 'no':
+        this._defaultRow.dateRange.days = [
+          { caption: 'Mandag', value: '1', selected: false },
+          { caption: 'Tirsdag', value: '2', selected: false },
+          { caption: 'Onsdag', value: '3', selected: false },
+          { caption: 'Torsdag', value: '4', selected: false },
+          { caption: 'Fredag', value: '5', selected: false },
+        ];
+        break;
+      default:
+        this._defaultRow.dateRange.days = [
+          { caption: 'Monday', value: '1', selected: false },
+          { caption: 'Tuesday', value: '2', selected: false },
+          { caption: 'Wednesday', value: '3', selected: false },
+          { caption: 'Thursday', value: '4', selected: false },
+          { caption: 'Friday', value: '5', selected: false },
+        ];
+        break;
+    }
+  }
+  render() {
+    var _a;
+    return (h(Host, null, (_a = this.rowData) === null || _a === void 0 ? void 0 :
+      _a.map((data, i) => {
+        return (h("div", { class: 'generated-row-' + i, id: 'generated-row-connected-dropdown-' + i }, h("pn-multi-row-connected-dropdown-row", { "dropdown-data": this.dropdownData, "language-code": this.languageCode, label: this.label, "first-dropdown-label": this.firstDropdownLabel, "second-dropdown-label": this.secondDropdownLabel, "dropdown-placeholder": this.dropdownPlaceholder, "add-row-text": this.addRowText, "input-fild-label": this.inputFildLabel, "input-fild-placeholder": this.inputFildPlaceholder, "date-button-text": this.dateButtonText, "date-placeholder": this.datePlaceholder, "date-days-from-today": 1, "allow-multiple-dates": this.allowMultipleDates, "start-date-label": this.startDateLabel, "end-date-label": this.endDateLabel, "multi-date-helper-text": this.multiDateHelperText, "generate-dates-button-text": this.generateDatesButtonText, "save-date-button-text": this.saveDateButtonText, "no-dates-text": this.noDatesText, index: i, "predefined-value": JSON.stringify(data), "years-to-add-to-end-date": this.yearsToAddToEndDate })));
+      }), this.allowMultipleRows ? (h("div", { class: "connected-dropdown__row" }, h("pn-button", { "icon-only": this.addRowText ? false : true, "left-icon": "true", "aria-label": "Add", icon: "plus", appearance: "light", variant: "borderless", class: "connected-dropdown__button-right", onClick: () => {
+        this.addRow();
+      } }, this.addRowText))) : null));
+  }
+  get hostElement() { return getElement(this); }
+};
+PnMultiRowConnectedDropdown.style = pnMultiRowConnectedDropdownCss;
+
+export { PnMultiRowConnectedDropdown as pn_multi_row_connected_dropdown };

package/esm/pn-site-footer_3.entry.js

@@ -16,7 +16,7 @@ const PnSiteFooter = class {
 };
 PnSiteFooter.style = pnSiteFooterCss;
 
-const pnSiteFooterColCss = "pn-site-footer-col:not([theme=dotcom]){min-width:15em;padding:2.5em 1.5rem 0;width:100%}@media screen and (min-width: 33.125em){pn-site-footer-col:not([theme=dotcom]){width:50%}}@media screen and (min-width: 60em){pn-site-footer-col:not([theme=dotcom]){max-width:25%}}pn-site-footer-col:not([theme=dotcom]) ul{list-style-type:none;padding:0;margin:0}pn-site-footer-col:not([theme=dotcom]) li{margin-bottom:1.6rem}pn-site-footer-col:not([theme=dotcom]) a{text-decoration:none;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}pn-site-footer-col:not([theme=dotcom]) a h3{color:#000000}pn-site-footer-col:not([theme=dotcom]) p{margin-top:0;margin-bottom:1rem}pn-site-footer-col[theme=dotcom]{width:100%;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}pn-site-footer-col[theme=dotcom] *{color:#FFFFFF}@media screen and (min-width: 768px){pn-site-footer-col[theme=dotcom]{width:33%;padding-left:0.8rem;padding-right:0.8rem}pn-site-footer-col[theme=dotcom]:nth-child(1),pn-site-footer-col[theme=dotcom]:nth-child(4){padding-left:0}pn-site-footer-col[theme=dotcom]:nth-child(3),pn-site-footer-col[theme=dotcom]:nth-child(5){padding-right:0}}@media screen and (min-width: 1024px){pn-site-footer-col[theme=dotcom]{width:20%;padding-left:1.6rem;padding-right:1.6rem}pn-site-footer-col[theme=dotcom]:nth-child(1){width:20%;padding-left:0}pn-site-footer-col[theme=dotcom]:nth-child(4){padding-left:1.6rem}pn-site-footer-col[theme=dotcom]:nth-child(3){padding-right:1.6rem}pn-site-footer-col[theme=dotcom]:nth-child(5){padding-right:0}}pn-site-footer-col[theme=dotcom] h3{margin-bottom:1rem;font-weight:700;font-size:2rem;line-height:2.2rem}@media screen and (min-width: 1200px){pn-site-footer-col[theme=dotcom] h3{font-size:2.4rem;line-height:2.64rem}}pn-site-footer-col[theme=dotcom] ul{list-style-type:none;padding:0;margin:0;margin-bottom:1.4rem}pn-site-footer-col[theme=dotcom] ul li{margin-bottom:1rem}pn-site-footer-col[theme=dotcom] a{text-decoration:none;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;font-weight:400;font-size:1.6rem;line-height:2.24rem}pn-site-footer-col[theme=dotcom] a h3{color:#FFFFFF}pn-site-footer-col[theme=dotcom] p{margin-top:0;margin-bottom:1rem}pn-site-footer-col[theme=dotcom] div{min-height:150px;margin-bottom:1.4rem}pn-site-footer-col[theme=dotcom] div p:nth-child(odd){font-weight:500}";
+const pnSiteFooterColCss = "pn-site-footer-col:not([theme=dotcom]){min-width:15em;padding:2.5em 1.5rem 0;width:100%}@media screen and (min-width: 33.125em){pn-site-footer-col:not([theme=dotcom]){width:50%}}@media screen and (min-width: 60em){pn-site-footer-col:not([theme=dotcom]){max-width:25%}}pn-site-footer-col:not([theme=dotcom]) ul{list-style-type:none;padding:0;margin:0}pn-site-footer-col:not([theme=dotcom]) li{margin-bottom:1.6rem}pn-site-footer-col:not([theme=dotcom]) a{text-decoration:none;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}pn-site-footer-col:not([theme=dotcom]) a h3{color:#000000}pn-site-footer-col:not([theme=dotcom]) p{margin-top:0;margin-bottom:1rem}pn-site-footer-col[theme=dotcom]{width:100%;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}pn-site-footer-col[theme=dotcom] *{color:#FFFFFF}@media screen and (min-width: 768px){pn-site-footer-col[theme=dotcom]{width:33%;padding-left:0.8rem;padding-right:0.8rem}pn-site-footer-col[theme=dotcom]:nth-child(1),pn-site-footer-col[theme=dotcom]:nth-child(4){padding-left:0}pn-site-footer-col[theme=dotcom]:nth-child(3),pn-site-footer-col[theme=dotcom]:nth-child(5){padding-right:0}}@media screen and (min-width: 1024px){pn-site-footer-col[theme=dotcom]{width:20%;padding-left:1.6rem;padding-right:1.6rem}pn-site-footer-col[theme=dotcom]:nth-child(1){width:20%;padding-left:0}pn-site-footer-col[theme=dotcom]:nth-child(4){padding-left:1.6rem}pn-site-footer-col[theme=dotcom]:nth-child(3){padding-right:1.6rem}pn-site-footer-col[theme=dotcom]:nth-child(5){padding-right:0}}pn-site-footer-col[theme=dotcom] h3{margin-bottom:1rem;font-weight:700;font-size:2rem;line-height:2.2rem}@media screen and (min-width: 1200px){pn-site-footer-col[theme=dotcom] h3{font-size:2.4rem;line-height:2.64rem}}pn-site-footer-col[theme=dotcom] ul{list-style-type:none;padding:0;margin:0;margin-bottom:1.4rem}pn-site-footer-col[theme=dotcom] ul li{margin-bottom:1rem}pn-site-footer-col[theme=dotcom] a{display:-ms-flexbox;display:flex;-ms-flex-align:baseline;align-items:baseline;text-decoration:none;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;font-weight:400;font-size:1.6rem;line-height:2.24rem}pn-site-footer-col[theme=dotcom] a h3{color:#FFFFFF}pn-site-footer-col[theme=dotcom] p{margin-top:0;margin-bottom:1rem}pn-site-footer-col[theme=dotcom] div{min-height:150px;margin-bottom:1.4rem}pn-site-footer-col[theme=dotcom] div p:nth-child(odd){font-weight:500}";
 
 const PnSiteFooterCol = class {
   constructor(hostRef) {