@postnord/pn-marketweb-components 1.0.17 → 1.0.21

package/custom-elements/index.js

@@ -34,6 +34,68 @@ let PnChoiceButton$1 = class extends HTMLElement {
   static get style() { return pnChoiceButtonCss; }
 };
 
+const pnFilterCheckboxCss = ":host{display:inline-block;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:host input{opacity:0;position:absolute}:host input[type=checkbox]+label.pn-checkbox{width:1.5em;min-width:1.5em;height:1.5em;min-height:1.5em;background:#fff;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;position:relative;border:0.1rem solid #969087;cursor:pointer;border-radius:0.4rem;cursor:pointer;-webkit-transition-duration:220ms;transition-duration:220ms;-webkit-transition-timing-function:cubic-bezier(0.79, 0.14, 0.15, 0.86);transition-timing-function:cubic-bezier(0.79, 0.14, 0.15, 0.86);-webkit-transition-property:border, background, -webkit-box-shadow;transition-property:border, background, -webkit-box-shadow;transition-property:border, background, box-shadow;transition-property:border, background, box-shadow, -webkit-box-shadow}:host input[type=checkbox]+label.pn-checkbox svg{width:80%;fill:none}:host input[type=checkbox]+label.pn-checkbox svg polyline{stroke:#FFF;-webkit-transform-origin:0 0;transform-origin:0 0;stroke-linecap:round;stroke-dasharray:23;stroke-dashoffset:23;-webkit-transition-delay:none;transition-delay:none;-webkit-transition:stroke-dashoffset 180ms cubic-bezier(0.79, 0.14, 0.15, 0.86);transition:stroke-dashoffset 180ms cubic-bezier(0.79, 0.14, 0.15, 0.86)}:host input[type=checkbox]:hover+label.pn-checkbox{border:0.1rem solid #005D92;background:#E0F8FF}:host input[type=checkbox]:checked+label.pn-checkbox,:host input[type=checkbox]:indeterminate+label.pn-checkbox{background:#005D92;border:0.1rem solid #005D92}:host input[type=checkbox]:checked+label.pn-checkbox svg polyline,:host input[type=checkbox]:indeterminate+label.pn-checkbox svg polyline{-webkit-transition-delay:220ms;transition-delay:220ms}:host input[type=checkbox]:checked+label.pn-checkbox svg polyline.checkmark-path{stroke-dashoffset:0}:host input[type=checkbox]:indeterminate+label.pn-checkbox svg polyline.indeterminate-path{stroke-dashoffset:0}:host input[type=checkbox]:focus+label.pn-checkbox,:host input[type=checkbox]:active+label.pn-checkbox{-webkit-box-shadow:0 0 0 0.1rem white, 0 0 0 0.3rem #005D92;box-shadow:0 0 0 0.1rem white, 0 0 0 0.3rem #005D92}:host input[type=checkbox]:disabled+label.pn-checkbox{background-color:#D3CECB;border:0.1rem solid #969087;cursor:not-allowed}:host input[type=checkbox]:disabled+label.pn-checkbox svg polyline{stroke:#969087}:host input[type=checkbox]:disabled:checked+label.pn-checkbox{border:0.1rem solid transparent}:host input[type=checkbox]:disabled:active+label.pn-checkbox{-webkit-box-shadow:none;box-shadow:none}";
+
+let PnFilterCheckbox$1 = class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.__attachShadow();
+    this.disabled = false;
+    this.checked = false;
+    this.indeterminate = false;
+  }
+  handlechange() {
+    this.indeterminate = false;
+  }
+  componentDidLoad() {
+    this.checkAndSetIndeterminateState();
+    this.bindEvents();
+  }
+  componentDidUpdate() {
+    this.checkAndSetIndeterminateState();
+  }
+  bindEvents() {
+    const labels = document.querySelectorAll('label[for="' + this.checkboxid + '"]');
+    labels.forEach((label) => {
+      label.addEventListener('click', () => {
+        this.hostElement.shadowRoot.querySelector('label').click();
+      });
+    });
+    const checkboxInput = this.hostElement.shadowRoot.querySelector('input');
+    checkboxInput.addEventListener('change', this.onCheckboxChange.bind(this, checkboxInput));
+  }
+  onCheckboxChange(checkboxInput) {
+    let outsideInput = this.hostElement.querySelector("input.hidden-" + this.checkboxid);
+    if (outsideInput) {
+      outsideInput.value = (checkboxInput.checked) ? this.value : "";
+    }
+  }
+  checkAndSetIndeterminateState() {
+    let checkbox = this.hostElement.querySelector(`#${this.checkboxid}`);
+    if (checkbox) {
+      checkbox.indeterminate = this.indeterminate;
+    }
+  }
+  renderInputOutsideShadowRoot() {
+    var _a;
+    let input = this.hostElement.querySelector("input.hidden-" + this.checkboxid);
+    if (!input) {
+      input = this.hostElement.ownerDocument.createElement("input");
+      input.type = "hidden";
+      input.classList.add("hidden-" + this.checkboxid);
+      this.hostElement.appendChild(input);
+    }
+    input.name = (_a = this.name) !== null && _a !== void 0 ? _a : this.checkboxid;
+  }
+  render() {
+    this.renderInputOutsideShadowRoot();
+    return (h(Host, { checked: this.checked, id: this.checkboxid }, h("input", { type: "checkbox", id: this.checkboxid, value: this.value, name: this.name || this.checkboxid, disabled: this.disabled, checked: this.checked }), h("label", { htmlFor: this.checkboxid, class: "pn-checkbox" }, h("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none" }, h("polyline", { class: "checkmark-path", points: "4,12 9,17 20,6", "stroke-width": "3" }), h("polyline", { class: "indeterminate-path", points: "4,12 20,12", "stroke-width": "3" })))));
+  }
+  get hostElement() { return this; }
+  static get style() { return pnFilterCheckboxCss; }
+};
+
 const pnFilterSearchCss = ":host{display:-ms-inline-flexbox;display:inline-flex}:host>pn-button{margin-left:0.35em}:host>pn-button button .pn-button-bg{-webkit-transition:width 0.2s cubic-bezier(0.7, 0, 0.3, 1) 0.2s, background 0.1s, left 0.2s, -webkit-box-shadow 0.1s, -webkit-transform 0.2s;transition:width 0.2s cubic-bezier(0.7, 0, 0.3, 1) 0.2s, background 0.1s, left 0.2s, -webkit-box-shadow 0.1s, -webkit-transform 0.2s;transition:width 0.2s cubic-bezier(0.7, 0, 0.3, 1) 0.2s, background 0.1s, box-shadow 0.1s, left 0.2s, transform 0.2s;transition:width 0.2s cubic-bezier(0.7, 0, 0.3, 1) 0.2s, background 0.1s, box-shadow 0.1s, left 0.2s, transform 0.2s, -webkit-box-shadow 0.1s, -webkit-transform 0.2s}:host>pn-button[data-loading=true] .pn-button-bg{left:0;-webkit-transform:translateX(0);transform:translateX(0);-webkit-transition:width 0.2s cubic-bezier(0.7, 0, 0.3, 1) 0.2s, background 0.1s, -webkit-box-shadow 0.1s;transition:width 0.2s cubic-bezier(0.7, 0, 0.3, 1) 0.2s, background 0.1s, -webkit-box-shadow 0.1s;transition:width 0.2s cubic-bezier(0.7, 0, 0.3, 1) 0.2s, background 0.1s, box-shadow 0.1s;transition:width 0.2s cubic-bezier(0.7, 0, 0.3, 1) 0.2s, background 0.1s, box-shadow 0.1s, -webkit-box-shadow 0.1s}:host>pn-button[data-loading=true] pn-spinner{left:0.75em}:host input{padding:0.75em;min-height:3em;font-size:1em;height:100%;font-weight:500;-webkit-font-smoothing:antialiased;outline:none;border-radius:3em;border:0.1rem solid #5E554A;-webkit-transition:border 0.15s, -webkit-box-shadow 0.15s;transition:border 0.15s, -webkit-box-shadow 0.15s;transition:box-shadow 0.15s, border 0.15s;transition:box-shadow 0.15s, border 0.15s, -webkit-box-shadow 0.15s;color:#000000;width:100%}:host input::-webkit-search-cancel-button{display:none}:host input::-webkit-input-placeholder{color:#969087;font-weight:normal}:host input::-moz-placeholder{color:#969087;font-weight:normal}:host input:-ms-input-placeholder{color:#969087;font-weight:normal}:host input::-ms-input-placeholder{color:#969087;font-weight:normal}:host input::placeholder{color:#969087;font-weight:normal}:host input:focus{border:0.1rem solid #005D92;-webkit-box-shadow:0 0 0 0.2rem #fff, 0 0 0 0.4rem #005D92;box-shadow:0 0 0 0.2rem #fff, 0 0 0 0.4rem #005D92}:host input:hover{border:0.1rem solid #00A0D6}:host input:disabled{background:#F3F2F2;border:none}:host>.input-container{width:100%;position:relative}:host>.input-container .button-container{position:absolute;top:0;right:0;background:transparent;width:3em;height:100%;overflow:hidden;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}:host>.input-container button{position:absolute;left:50%;top:50%;-webkit-transform:translate(100%, -50%);transform:translate(100%, -50%);background:none;border:none;color:#005D92;padding:0.3rem;border-radius:50%;outline:none;-webkit-transition:border 0.1s, background 0.2s, opacity 0.2s, -webkit-box-shadow 0.1s, -webkit-transform cubic-bezier(0.7, 0, 0.3, 1) 0.2s;transition:border 0.1s, background 0.2s, opacity 0.2s, -webkit-box-shadow 0.1s, -webkit-transform cubic-bezier(0.7, 0, 0.3, 1) 0.2s;transition:border 0.1s, background 0.2s, box-shadow 0.1s, transform cubic-bezier(0.7, 0, 0.3, 1) 0.2s, opacity 0.2s;transition:border 0.1s, background 0.2s, box-shadow 0.1s, transform cubic-bezier(0.7, 0, 0.3, 1) 0.2s, opacity 0.2s, -webkit-box-shadow 0.1s, -webkit-transform cubic-bezier(0.7, 0, 0.3, 1) 0.2s;border:0.1rem solid transparent}:host>.input-container button.clear,:host>.input-container button.search{cursor:pointer}:host>.input-container button:focus{-webkit-box-shadow:0 0 0 0.2rem #fff, 0 0 0 0.4rem #005D92;box-shadow:0 0 0 0.2rem #fff, 0 0 0 0.4rem #005D92;background:#8EDDF9}:host>.input-container button:hover{background:#E0F8FF}:host>.input-container button:active{background:#005D92}:host>.input-container button:active pn-icon svg,:host>.input-container button:active pn-icon svg path{fill:white}:host.searching button.search{-webkit-transform:translate(150%, -50%);transform:translate(150%, -50%)}:host.searching button.clear{-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%)}:host.button-none input,:host.button-icon-inline input{padding-right:3.3em}:host.button-none pn-spinner,:host.button-icon-inline pn-spinner{position:absolute;left:50%;top:50%;-webkit-transform:translate(100%, -50%);transform:translate(100%, -50%);-webkit-transition:-webkit-transform cubic-bezier(0.7, 0, 0.3, 1) 0.2s;transition:-webkit-transform cubic-bezier(0.7, 0, 0.3, 1) 0.2s;transition:transform cubic-bezier(0.7, 0, 0.3, 1) 0.2s;transition:transform cubic-bezier(0.7, 0, 0.3, 1) 0.2s, -webkit-transform cubic-bezier(0.7, 0, 0.3, 1) 0.2s}:host.button-none button.search,:host.button-icon-inline button.search{-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%)}:host.button-none.loading button,:host.button-icon-inline.loading button{-webkit-transform:translate(100%, -50%);transform:translate(100%, -50%)}:host.button-none.loading pn-spinner,:host.button-icon-inline.loading pn-spinner{-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%)}:host.button-none.searching button.search{-webkit-transform:translate(100%, -50%);transform:translate(100%, -50%)}:host.button-icon>pn-button[data-loading=true] .pn-button-bg{left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%)}";
 
 let PnFilterSearch$1 = class extends HTMLElement {
@@ -1302,7 +1364,7 @@ function isInteger(x) {
   return (x | 0) === x;
 }
 
-function URL() {} // URL regexp explanation:
+function URL$1() {} // URL regexp explanation:
 //
 // /^
 //
@@ -1686,7 +1748,7 @@ function parseValueOfType(value, type, options) {
         value: value
       };
 
-    case URL:
+    case URL$1:
       if (typeof value === 'string') {
         if (isURL(value)) {
           return {
@@ -2353,18 +2415,30 @@ let PnlanguageSelector = class extends HTMLElement {
     this.initialize();
   }
   initialize() {
+    this.setSelectedLanguageName();
+    this.addEventBindingsToOptions();
+  }
+  addEventBindingsToOptions() {
     const options = [].slice.apply(this.hostElement.querySelectorAll("pn-language-selector-option"));
     options.map((option) => {
-      // Set current label of language selector
-      if (option.getAttribute("code") == this.value || option.getAttribute("selected") == "true") {
-        this.selectedLanguageName = option.getAttribute("name");
-      }
+      option.removeEventListener("setCurrentLanguage", (event) => {
+        this.onSetCurrentLanguage(event.detail);
+      });
       // Bind event listener for when a user change language
       option.addEventListener("setCurrentLanguage", (event) => {
         this.onSetCurrentLanguage(event.detail);
       });
     });
   }
+  setSelectedLanguageName() {
+    const options = [].slice.apply(this.hostElement.querySelectorAll("pn-language-selector-option"));
+    options.map((option) => {
+      // Set current label of language selector
+      if (option.getAttribute("code") == this.value) { //  || option.getAttribute("selected") == "true"
+        this.selectedLanguageName = option.getAttribute("name");
+      }
+    });
+  }
   onSetCurrentLanguage(option) {
     this.value = option.code;
     this.selectedLanguageName = option.name;
@@ -2380,15 +2454,18 @@ let PnlanguageSelector = class extends HTMLElement {
     components.forEach((component) => {
       // Pass values as props into slotted components
       // component.setAttribute("current-language", this.value);
-      component.setAttribute("selected", (component.getAttribute("code") === this.value) + '');
+      const isSelected = (component.getAttribute("code") === this.value) + '';
+      if ((component.getAttribute('selected') + '') !== isSelected) {
+        component.setAttribute("selected", isSelected);
+      }
     });
   }
   render() {
-    return (h(Host, null, h("pn-nav-dropdown", { label: this.selectedLanguageName, icon: "globe" }, h("nav", { class: "languageselector-nav", "aria-label": this.i18n.heading }, h("strong", { class: "languageselector-title" }, this.i18n.heading), h("div", { class: "languageselector-list", role: "list" }, h("slot", null))))));
+    return (h(Host, { value: this.value }, h("pn-nav-dropdown", { label: this.selectedLanguageName, icon: "globe" }, h("nav", { class: "languageselector-nav", "aria-label": this.i18n.heading }, h("strong", { class: "languageselector-title" }, this.i18n.heading), h("div", { class: "languageselector-list", role: "list" }, h("slot", null))))));
   }
   get hostElement() { return this; }
   static get watchers() { return {
-    "value": ["onValueChange"]
+    "value": ["setSelectedLanguageName", "setTranslations", "onValueChange"]
   }; }
   static get style() { return pnLanguageSelectorCss; }
 };
@@ -2462,6 +2539,7 @@ const translations$4 = {
 // Read more about how stencil stores work here: https://stenciljs.com/docs/stencil-store
 const { state: state$2, onChange: onChange$2 } = createStore({
   openLevel: '',
+  currentLevel: 1,
   openMenu: false,
   i18n: {
     menuHomeButton: '',
@@ -2529,13 +2607,13 @@ let PnMainnav$1 = class extends HTMLElement {
     state$2.openLevel = event.detail;
   }
   render() {
-    return (h(Host, null, h("div", { class: "mainnav-toggle" }, h("button", { "aria-controls": this.navigationId, "aria-expanded": state$2.openMenu + '', onClick: this.setMenuOpenState.bind(this) }, state$2.i18n.mainMenuButton, h("pn-icon", { symbol: state$2.openMenu ? "close" : "bars", color: "white" }))), h("nav", { class: "mainnav", "aria-label": this.navLabel, "data-menu-open": state$2.openMenu + '', id: this.navigationId }, h("slot", null))));
+    return (h(Host, null, h("div", { class: "mainnav-toggle" }, h("button", { "aria-controls": this.navigationId, "aria-expanded": state$2.openMenu + '', onClick: this.setMenuOpenState.bind(this) }, state$2.i18n.mainMenuButton, h("pn-icon", { symbol: state$2.openMenu ? "close" : "bars", color: "white" }))), h("nav", { class: "mainnav", "aria-label": this.navLabel, "data-menu-open": state$2.openMenu + '', "data-menu-currentlevel": state$2.currentLevel, id: this.navigationId }, h("slot", null))));
   }
   get hostElement() { return this; }
   static get style() { return pnMainnavCss; }
 };
 
-const pnMainnavLevelCss = "pn-mainnav-level{display:block}pn-mainnav-level[data-level=\"1\"]{width:100%;right:0;overflow-y:scroll;overflow-x:hidden;-ms-flex:1;flex:1}@media screen and (min-width: 64em){pn-mainnav-level[data-level=\"1\"]{width:auto;overflow:initial}pn-mainnav-level[data-level=\"1\"]::-webkit-scrollbar{display:none}}pn-mainnav-level[data-level=\"2\"]{position:absolute;top:0;bottom:0;left:0;width:100vw;padding:0;background-color:#FFFFFF;z-index:1;-webkit-transform:translateX(100vw);transform:translateX(100vw);-webkit-transition:-webkit-transform 0.2s 0s;transition:-webkit-transform 0.2s 0s;transition:transform 0.2s 0s;transition:transform 0.2s 0s, -webkit-transform 0.2s 0s;-webkit-transition-property:visibility, -webkit-transform;transition-property:visibility, -webkit-transform;transition-property:transform, visibility;transition-property:transform, visibility, -webkit-transform;overflow:scroll;visibility:hidden}@media screen and (min-width: 64em){pn-mainnav-level[data-level=\"2\"]{left:0;top:calc(100% + 1rem);bottom:auto;border-radius:1.6rem;width:auto;padding:1.6rem 1.6rem 0 1.6rem;-webkit-box-shadow:0 0.06rem 0.18rem rgba(0, 0, 0, 0.1), 0 0.32rem 0.72rem rgba(0, 0, 0, 0.13);-moz-box-shadow:0 0.06rem 0.18rem rgba(0, 0, 0, 0.1), 0 0.32rem 0.72rem rgba(0, 0, 0, 0.13);box-shadow:0 0.06rem 0.18rem rgba(0, 0, 0, 0.1), 0 0.32rem 0.72rem rgba(0, 0, 0, 0.13);height:auto;z-index:3;display:none}pn-mainnav-level[data-level=\"2\"][data-menuitem-rightaligned=true]{right:0;left:unset}}@media screen and (max-height: 33.125em){pn-mainnav-level[data-level=\"2\"]{-ms-overflow-style:none;scrollbar-width:none}pn-mainnav-level[data-level=\"2\"]::-webkit-scrollbar{display:none}}pn-mainnav-level[data-level=\"2\"][aria-hidden=false]{-webkit-transform:translateX(0);transform:translateX(0);visibility:visible}@media screen and (min-width: 64em){pn-mainnav-level[data-level=\"2\"][aria-hidden=false]{display:block;overflow:visible}pn-mainnav-level[data-level=\"2\"][aria-hidden=false]:not([data-level-listcount=\"1\"]){display:grid;grid-template-columns:minmax(12em, 20em) 1fr;grid-template-rows:auto auto;gap:0px 1.6rem;grid-template-areas:\"top top\" \"left right\"}}@media screen and (min-width: 64em){pn-mainnav-level[data-level=\"2\"][data-level-alignment=left]{right:0;left:unset}}@media screen and (min-width: 64em){pn-mainnav-level[data-level=\"2\"][data-level-alignment=center]{left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%)}}pn-mainnav-level[data-level=\"2\"] a{color:#005D92;text-decoration:none}pn-mainnav-level [slot=top]{display:-ms-flexbox;display:flex}@media screen and (min-width: 48em){pn-mainnav-level [slot=top]{display:none}}.mainnav-level-header{grid-area:top}.mainnav-level-header>label{position:absolute;width:0.1rem;height:0.1rem;padding:0;margin:-0.1rem;overflow:hidden;clip:rect(0, 0, 0, 0);border:0;white-space:nowrap}.mainnav-level-header>button{display:block;position:relative;border:none;background-color:transparent;color:#005D92;padding:2.4rem 0 2.4rem 6.2rem;width:100%;text-align:left}@media screen and (min-width: 64em){.mainnav-level-header>button{display:none;speak:none}}.mainnav-level-header>button>pn-icon{speak:none;position:absolute;height:2.4rem;width:2.4rem;left:3rem;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}[data-level=\"2\"] .mainnav-level-header>pn-mainnav-link>a{font-size:2.4rem}";
+const pnMainnavLevelCss = "pn-mainnav-level{display:block}pn-mainnav-level[data-level=\"1\"]{width:100%;right:0;overflow-y:scroll;overflow-x:hidden;-ms-flex:1;flex:1}@media screen and (min-width: 64em){pn-mainnav-level[data-level=\"1\"]{width:auto;overflow:initial}pn-mainnav-level[data-level=\"1\"]::-webkit-scrollbar{display:none}}pn-mainnav-level[data-level=\"2\"]{position:absolute;top:0;bottom:0;left:0;width:100vw;padding:0;background-color:#FFFFFF;z-index:1;-webkit-transform:translateX(100vw);transform:translateX(100vw);-webkit-transition:-webkit-transform 0.2s 0s;transition:-webkit-transform 0.2s 0s;transition:transform 0.2s 0s;transition:transform 0.2s 0s, -webkit-transform 0.2s 0s;-webkit-transition-property:visibility, -webkit-transform;transition-property:visibility, -webkit-transform;transition-property:transform, visibility;transition-property:transform, visibility, -webkit-transform;overflow:scroll;visibility:hidden}@media screen and (min-width: 64em){pn-mainnav-level[data-level=\"2\"]{left:0;top:calc(100% + 1rem);bottom:auto;border-radius:1.6rem;width:auto;padding:1.6rem 1.6rem 0 1.6rem;-webkit-box-shadow:0 0.06rem 0.18rem rgba(0, 0, 0, 0.1), 0 0.32rem 0.72rem rgba(0, 0, 0, 0.13);-moz-box-shadow:0 0.06rem 0.18rem rgba(0, 0, 0, 0.1), 0 0.32rem 0.72rem rgba(0, 0, 0, 0.13);box-shadow:0 0.06rem 0.18rem rgba(0, 0, 0, 0.1), 0 0.32rem 0.72rem rgba(0, 0, 0, 0.13);height:auto;z-index:3;display:none}pn-mainnav-level[data-level=\"2\"][data-menuitem-rightaligned=true]{right:0;left:unset}}@media screen and (max-height: 33.125em){pn-mainnav-level[data-level=\"2\"]{-ms-overflow-style:none;scrollbar-width:none}pn-mainnav-level[data-level=\"2\"]::-webkit-scrollbar{display:none}}pn-mainnav-level[data-level=\"2\"][aria-hidden=false]{-webkit-transform:translateX(0);transform:translateX(0);visibility:visible}@media screen and (min-width: 64em){pn-mainnav-level[data-level=\"2\"][aria-hidden=false]{display:block;overflow:visible}pn-mainnav-level[data-level=\"2\"][aria-hidden=false]:not([data-level-listcount=\"1\"]){display:grid;grid-template-columns:minmax(12em, 20em) 1fr;grid-template-rows:auto auto;gap:0px 1.6rem;grid-template-areas:\"top top\" \"left right\"}}@media screen and (min-width: 64em){pn-mainnav-level[data-level=\"2\"][data-level-alignment=left]{right:0;left:unset}}@media screen and (min-width: 64em){pn-mainnav-level[data-level=\"2\"][data-level-alignment=center]{left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%)}}pn-mainnav-level[data-level=\"2\"] a{color:#005D92;text-decoration:none}pn-mainnav-level [slot=top]{display:-ms-flexbox;display:flex}@media screen and (min-width: 48em){pn-mainnav-level [slot=top]{display:none}}[data-menu-currentlevel=\"2\"] pn-mainnav-level [slot=footer]{display:none}.mainnav-level-header{grid-area:top}.mainnav-level-header>label{position:absolute;width:0.1rem;height:0.1rem;padding:0;margin:-0.1rem;overflow:hidden;clip:rect(0, 0, 0, 0);border:0;white-space:nowrap}.mainnav-level-header>button{display:block;position:relative;border:none;background-color:transparent;color:#005D92;padding:2.4rem 0 2.4rem 6.2rem;width:100%;text-align:left}@media screen and (min-width: 64em){.mainnav-level-header>button{display:none;speak:none}}.mainnav-level-header>button>pn-icon{speak:none;position:absolute;height:2.4rem;width:2.4rem;left:3rem;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}[data-level=\"2\"] .mainnav-level-header>pn-mainnav-link>a{font-size:2.4rem}";
 
 let PnMainnavLevel$1 = class extends HTMLElement {
   constructor() {
@@ -2595,9 +2673,13 @@ let PnMainnavLevel$1 = class extends HTMLElement {
   }
   onChangeOpenLevel() {
     this.isOpen = state$2.openLevel === this.levelId;
+    state$2.currentLevel = this.level;
   }
   render() {
-    return (h(Host, Object.assign({ role: "navigation" }, ((this.level > 1 && this.levelId) ? { 'aria-hidden': (!this.isOpen) + '' } : {}), { "data-level-listcount": this.listCount + '', "data-level-alignment": this.alignment, "data-level": this.level + '' }, (this.levelId ? { id: this.levelId } : {})), (this.level > 1) ? (h("div", { class: "mainnav-level-header" }, h("label", { htmlFor: this.levelId }, state$2.i18n.menuGoBackButton), h("button", { class: "secondlevel-backbtn", onClick: () => state$2.openLevel = '', "aria-expanded": (state$2.openLevel === this.levelId) + '' }, h("pn-icon", { symbol: "arrow-left", color: "blue700" }), state$2.i18n.menuStartButton), (this.parentHref && this.parentName) ? h("pn-mainnav-link", { href: this.parentHref, name: this.parentName, linkid: this.parentLinkId }) : null)) : null, h("slot", { name: "top" }), h("slot", null), h("slot", { name: "additional" }), h("slot", { name: "footer" })));
+    return (h(Host, Object.assign({ role: "navigation" }, ((this.level > 1 && this.levelId) ? { 'aria-hidden': (!this.isOpen) + '' } : {}), { "data-level-listcount": this.listCount + '', "data-level-alignment": this.alignment, "data-level": this.level + '' }, (this.levelId ? { id: this.levelId } : {})), (this.level > 1) ? (h("div", { class: "mainnav-level-header" }, h("label", { htmlFor: this.levelId }, state$2.i18n.menuGoBackButton), h("button", { class: "secondlevel-backbtn", onClick: () => {
+        state$2.openLevel = '';
+        state$2.currentLevel = 1;
+      }, "aria-expanded": (state$2.openLevel === this.levelId) + '' }, h("pn-icon", { symbol: "arrow-left", color: "blue700" }), state$2.i18n.menuStartButton), (this.parentHref && this.parentName) ? h("pn-mainnav-link", { href: this.parentHref, name: this.parentName, linkid: this.parentLinkId }) : null)) : null, h("slot", { name: "top" }), h("slot", null), h("slot", { name: "additional" }), h("slot", { name: "footer" })));
   }
   get hostElement() { return this; }
   static get watchers() { return {
@@ -2710,6 +2792,169 @@ const translations$3 = {
   }
 };
 
+class MarketWebContextService {
+  constructor(href = window.location.href) {
+    this.href = "";
+    this.market = "";
+    this.language = "";
+    this.environment = "";
+    this.url = null;
+    this.allowedLanguages = ["sv", "da", "fi", "no", "en"];
+    this.allowedMarkets = ["se", "dk", "fi", "no", "com"];
+    this.developmentDomains = ["localhost", ".local", "local.", ".dev", "dev."];
+    this.markets = {
+      "se": {
+        fallbackLanguage: "sv",
+      },
+      "dk": {
+        fallbackLanguage: "da",
+      },
+      "fi": {
+        fallbackLanguage: "fi",
+      },
+      "no": {
+        fallbackLanguage: "no",
+      },
+      "com": {
+        fallbackLanguage: "en",
+      },
+    };
+    this.environmentTypes = ["integration", "preproduction", "production"];
+    this.environments = {
+      "production": {
+        "name": "production",
+        "url": "https://com-production.postnord.com/"
+      },
+      "preproduction": {
+        "name": "preproduction",
+        "url": "https://com-preproduction.postnord.com/"
+      },
+      "integration": {
+        "name": "integration",
+        "url": "https://com-integration.postnord.com/"
+      }
+    };
+    this.href = href;
+    this.url = new URL(this.href);
+  }
+  async getLanguage() {
+    if (this.language) {
+      return this.language;
+    }
+    await this.resolveLanguage();
+    return this.language;
+  }
+  async getMarket() {
+    if (this.market) {
+      return this.market;
+    }
+    await this.resolveMarket();
+    return this.market;
+  }
+  async getEndpoint(environmentName) {
+    if (this.environments[environmentName]) {
+      return this.environments[environmentName].url;
+    }
+    return this.environments.production.url;
+  }
+  async getEnvironmentName() {
+    const likelyEnvironment = this.environmentTypes.filter(x => this.url.hostname.indexOf(('-' + x)) !== -1)[0];
+    if (likelyEnvironment) {
+      this.environment = likelyEnvironment;
+      return this.environment;
+    }
+    if (this.url.hostname.indexOf('www.') !== -1) {
+      this.environment = this.environments.production.name;
+      return this.environment;
+    }
+    this.environment = this.environments.integration.name;
+    return this.environment;
+  }
+  isDevEnvironment() {
+    const matchedDevEnvironment = this.developmentDomains.filter(x => this.url.hostname.indexOf(x) !== -1)[0];
+    return matchedDevEnvironment.length > 0;
+  }
+  async resolveMarket() {
+    // Resolve market from www domains
+    if (this.href.indexOf("//www.") !== -1) {
+      const domainRoot = this.url.hostname.substring(this.url.hostname.lastIndexOf('.') + 1, this.url.hostname.length);
+      if (domainRoot && this.markets[domainRoot]) {
+        this.market = domainRoot;
+      }
+      else {
+        console.warn("Unable to define market from www. domain", this.href);
+      }
+    }
+    // Check if domains are on one of the integration environments
+    const likelyEnvironment = this.environmentTypes.filter(x => this.url.hostname.indexOf(('-' + x)) !== -1);
+    if (!this.market && likelyEnvironment && likelyEnvironment.length > 0) {
+      const matchedEnvironment = likelyEnvironment[0];
+      const marketPrefix = this.url.hostname.substring(0, this.url.hostname.indexOf('-' + matchedEnvironment));
+      if (marketPrefix && this.markets[marketPrefix]) {
+        this.market = marketPrefix;
+      }
+      else {
+        console.warn("Unable to define market from preset environment names", this.href);
+      }
+    }
+    // Check if we're on a development environment    
+    if (!this.market) {
+      const matchedDevEnvironment = this.developmentDomains.filter(x => this.url.hostname.indexOf(x) !== -1)[0];
+      if (!matchedDevEnvironment) {
+        // Fallback to first allowed market
+        this.market = this.allowedMarkets[0];
+        return;
+      }
+      const urlWithoutDomain = this.href.replace(matchedDevEnvironment, "");
+      // We see if the dev environment contains something like /dk
+      let matchedMarket = this.allowedMarkets.filter(x => {
+        const typesOfFallback = ['.' + x, x + '.', '/' + x + '/']; // Ex /dk, dk.html, /dk/
+        const matchedTypeOfFallback = typesOfFallback.filter(y => urlWithoutDomain.indexOf(y) !== -1);
+        return matchedTypeOfFallback.length > 0;
+      })[0];
+      if (matchedMarket) {
+        this.market = matchedMarket;
+      }
+      else {
+        // We do a similar filter for subpaths but for language this time
+        let filteredMarket = Object.entries(this.markets).filter((item) => {
+          const typesOfFallback = ['.' + item[1].fallbackLanguage, item[1].fallbackLanguage + '.', '/' + item[1].fallbackLanguage + '/']; // Ex /dk, dk.html, /dk/
+          const matchedTypeOfFallback = typesOfFallback.filter(y => urlWithoutDomain.indexOf(y) !== -1);
+          return matchedTypeOfFallback.length > 0;
+        })[0];
+        if (filteredMarket && filteredMarket[0]) {
+          this.market = filteredMarket[0];
+        }
+      }
+      if (!this.market) {
+        console.info("Was unable to detect market, used fallback");
+        this.market = this.allowedMarkets[0];
+      }
+    }
+  }
+  async resolveLanguage() {
+    var _a, _b, _c, _d;
+    if (this.language) {
+      return;
+    }
+    const potentialLanguages = [
+      (_a = document.querySelector("html[lang]")) === null || _a === void 0 ? void 0 : _a.getAttribute("lang"),
+      (_b = document.querySelector('[http-equiv="content-language"][content]')) === null || _b === void 0 ? void 0 : _b.getAttribute("content"),
+      (_c = document.querySelector('[property="og:locale"][content]')) === null || _c === void 0 ? void 0 : _c.getAttribute("content"),
+      (_d = document.querySelector("[lang]")) === null || _d === void 0 ? void 0 : _d.getAttribute("lang"),
+    ];
+    potentialLanguages.filter(x => x).forEach((language) => {
+      if (this.allowedLanguages.indexOf(language)) {
+        this.language = language;
+        return;
+      }
+    });
+    if (!this.language && this.market) {
+      this.language = this.markets[this.market].fallbackLanguage;
+    }
+  }
+}
+
 const pnMarketwebSitefooterCss = "";
 
 let PnMarketwebSiteheader$2 = class extends HTMLElement {
@@ -2721,27 +2966,64 @@ let PnMarketwebSiteheader$2 = class extends HTMLElement {
     this.market = "se";
     /** Specifies which language we want to show (sv,da,fi,no,en) */
     this.language = "sv";
+    /** Specifies which environment we're fetching data from. (production, preproduction, integration, localhost) */
+    this.environment = null; //sv
     /** Specifies which endpoint domain we should load from */
-    this.endpoint = "";
+    this.endpoint = null;
     this.gotData = false;
     this.fetchingData = false;
   }
   componentWillLoad() {
-    this.setTranslations();
-    this.init();
+    this.setInitialValues().then(() => {
+      this.init();
+    });
+  }
+  async setInitialValues(href = window.location.href) {
+    var _a;
+    const marketWebContextService = new MarketWebContextService(href);
+    if (this.market === null) {
+      const resolvedMarket = await marketWebContextService.getMarket();
+      this.market = resolvedMarket;
+    }
+    if (this.language === null) {
+      const resolvedMarket = await marketWebContextService.getLanguage();
+      this.language = resolvedMarket;
+    }
+    if (this.environment === null) {
+      this.environment = await marketWebContextService.getEnvironmentName();
+    }
+    if (this.endpoint === null && ((_a = this.environment) === null || _a === void 0 ? void 0 : _a.indexOf('local')) === -1) {
+      this.endpoint = await marketWebContextService.getEndpoint(this.environment);
+    }
+    if (this.endpoint === null) {
+      this.endpoint = "";
+    }
   }
   async init() {
+    this.setTranslations();
     await this.fetchData();
   }
   setTranslations() {
-    if (translations$3[this.language]) {
+    if (this.language && translations$3[this.language]) {
       this.i18n = translations$3[this.language];
     }
   }
+  onLanguageChange() {
+    this.setTranslations();
+    this.fetchData();
+  }
+  onMarketChange() {
+    this.fetchData();
+  }
   async fetchData() {
+    if (this.endpoint === null || !this.market || !this.language) {
+      // console.warn(`One or more values where not specified.\nEndpoint: ${this.endpoint}\nMarket: ${this.market}\nLanguage: ${this.language}`)
+      return;
+    }
     this.fetchingData = true;
     const endpointBase = (this.endpoint.lastIndexOf("/") === this.endpoint.length - 1) ? this.endpoint.substring(0, this.endpoint.length - 1) : this.endpoint;
-    const response = await fetch(`${endpointBase}${this.endpointPath}?market=${this.market}&language=${this.language}`);
+    const fetchUrl = `${endpointBase}${this.endpointPath}?market=${this.market}&language=${this.language}`;
+    const response = await fetch(fetchUrl);
     const data = await response.json();
     this.setStateFromData(data);
   }
@@ -2784,7 +3066,7 @@ let PnMarketwebSiteheader$2 = class extends HTMLElement {
   }
   render() {
     var _a, _b, _c, _d, _e;
-    return (h(Host, null, h("pn-site-footer", { url: (_b = (_a = this.siteDefinition) === null || _a === void 0 ? void 0 : _a.url) !== null && _b !== void 0 ? _b : "" }, (this.gotData && ((_c = this.footerContent) === null || _c === void 0 ? void 0 : _c.columns)) ? this.footerContent.columns.map((column) => (h("pn-site-footer-col", null, h("h3", null, column.heading), column.links ? (h("ul", Object.assign({}, ((column.links && column.links[0] && column.links[0].linkType) && { 'class': 'social-media' })), column.links.map((link) => {
+    return (h(Host, { language: this.language, market: this.market, environment: this.environment }, h("pn-site-footer", { url: (_b = (_a = this.siteDefinition) === null || _a === void 0 ? void 0 : _a.url) !== null && _b !== void 0 ? _b : "" }, (this.gotData && ((_c = this.footerContent) === null || _c === void 0 ? void 0 : _c.columns)) ? this.footerContent.columns.map((column) => (h("pn-site-footer-col", null, h("h3", null, column.heading), column.links ? (h("ul", Object.assign({}, ((column.links && column.links[0] && column.links[0].linkType) && { 'class': 'social-media' })), column.links.map((link) => {
       var linkText = link.linkText;
       if (link.linkType) {
         linkText = this.getLinkContentByType(link.linkType);
@@ -2798,6 +3080,10 @@ let PnMarketwebSiteheader$2 = class extends HTMLElement {
     }))) : null))));
   }
   get hostElement() { return this; }
+  static get watchers() { return {
+    "language": ["onLanguageChange"],
+    "market": ["onMarketChange"]
+  }; }
   static get style() { return pnMarketwebSitefooterCss; }
 };
 
@@ -2855,13 +3141,19 @@ let PnMarketwebSiteheader$1 = class extends HTMLElement {
   constructor() {
     super();
     this.__registerHost();
+    this.changeLanguage = createEvent(this, "changeLanguage", 7);
+    this.changeMarket = createEvent(this, "changeMarket", 7);
     this.endpointPath = "/api/navigation/header";
+    // allowedLanguages = ["sv","da","fi","no","en"];
+    // allowedMarkets = ["se","dk","fi","no","com"];
     /** Specifies which market we want to show (se,dk,fi,no,com) */
-    this.market = "se";
+    this.market = null; //se 
     /** Specifies which language we want to show (sv,da,fi,no,en) */
-    this.language = "sv";
+    this.language = null; //sv
+    /** Specifies which environment we're fetching data from. (production, preproduction, integration, localhost) */
+    this.environment = null; //sv
     /** Specifies which endpoint domain we should load from */
-    this.endpoint = "";
+    this.endpoint = null;
     /** Hides the site selector if set to true*/
     this.hideSiteSelector = false;
     /** Hides the language selector if set to true*/
@@ -2885,22 +3177,64 @@ let PnMarketwebSiteheader$1 = class extends HTMLElement {
     this.minimizeSearch = false;
   }
   componentWillLoad() {
-    this.setTranslations();
-    this.init();
+    this.setInitialValues().then(() => {
+      this.init();
+    });
   }
+  async setInitialValues(href = window.location.href) {
+    var _a;
+    const marketWebContextService = new MarketWebContextService(href);
+    if (this.market === null) {
+      const resolvedMarket = await marketWebContextService.getMarket();
+      this.market = resolvedMarket;
+    }
+    if (this.language === null) {
+      const resolvedMarket = await marketWebContextService.getLanguage();
+      this.language = resolvedMarket;
+    }
+    if (this.environment === null) {
+      this.environment = await marketWebContextService.getEnvironmentName();
+    }
+    if (this.endpoint === null && ((_a = this.environment) === null || _a === void 0 ? void 0 : _a.indexOf('local')) === -1) {
+      this.endpoint = await marketWebContextService.getEndpoint(this.environment);
+    }
+    if (this.endpoint === null) {
+      this.endpoint = "";
+    }
+  }
+  // TODO
+  //* Expose market and language attributes when changed internally
+  //* Business logic to select market and language depending on domains / html tag. 
+  //* Property to stop language change from changeing url, throw an event instead. 
+  //* Fetch new data when langauge or market is changed
   async init() {
+    this.setTranslations();
     await this.fetchData();
     window.setTimeout(() => { this.checkMenuOverflow(); }, 50);
   }
   setTranslations() {
-    if (translations$2[this.language]) {
+    if (this.language && translations$2[this.language]) {
       this.i18n = translations$2[this.language];
     }
   }
+  onLanguageChange() {
+    this.setTranslations();
+    this.changeLanguage.emit(this.language);
+    this.fetchData();
+  }
+  onMarketChange() {
+    this.changeMarket.emit(this.market);
+    this.fetchData();
+  }
   async fetchData() {
+    if (this.endpoint === null || !this.market || !this.language) {
+      // console.warn(`One or more values where not specified.\nEndpoint: ${this.endpoint}\nMarket: ${this.market}\nLanguage: ${this.language}`)
+      return;
+    }
     this.fetchingData = true;
     const endpointBase = (this.endpoint.lastIndexOf("/") === this.endpoint.length - 1) ? this.endpoint.substring(0, this.endpoint.length - 1) : this.endpoint;
-    const response = await fetch(`${endpointBase}${this.endpointPath}?market=${this.market}&language=${this.language}`);
+    const fetchUrl = `${endpointBase}${this.endpointPath}?market=${this.market}&language=${this.language}`;
+    const response = await fetch(fetchUrl);
     const data = await response.json();
     this.setStateFromData(data);
   }
@@ -2971,7 +3305,7 @@ let PnMarketwebSiteheader$1 = class extends HTMLElement {
   }
   render() {
     var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
-    return (h("header", null, h("div", { class: "siteheader-row" }, h("div", { class: "siteheader-topleft" }, h("slot", { name: "topleft" }), !this.hideSiteSelector &&
+    return (h(Host, { language: this.language, market: this.market, environment: this.environment }, h("header", null, h("div", { class: "siteheader-row" }, h("div", { class: "siteheader-topleft" }, h("slot", { name: "topleft" }), !this.hideSiteSelector &&
       h("pn-site-selector", { language: this.language, buttontext: (_b = (_a = this.siteSelector) === null || _a === void 0 ? void 0 : _a.currentSiteTitle) !== null && _b !== void 0 ? _b : 'postnord' }, (this.gotData && ((_c = this.siteSelector) === null || _c === void 0 ? void 0 : _c.currentSiteTitle)) &&
         h("pn-site-selector-item", { heading: this.siteSelector.currentSiteTitle, description: this.siteSelector.currentSiteDescription }), (this.gotData && ((_d = this.siteSelector) === null || _d === void 0 ? void 0 : _d.siteSelections)) && this.siteSelector.siteSelections.map((site) => h("pn-site-selector-item", { heading: site.linkText, description: site.linkDescription, url: site.href, newwindow: site.openInNewWindow })))), h("div", { class: "siteheader-logocontainer" }, h("a", { href: (_f = (_e = this.siteDefinition) === null || _e === void 0 ? void 0 : _e.url) !== null && _f !== void 0 ? _f : document.location.hostname, title: "Home", class: "siteheader-logolink" }, h("svg", { class: "siteheader-logo", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 141.73 26.65" }, h("path", { d: "M108.84,13.35c0,6.34-5.17,9-10,9S89,19.76,89,13.63c0-6.28,5.08-9,10-9S108.84,7.25,108.84,13.35Zm-6.56.18a3.4,3.4,0,1,0-6.8,0,3.29,3.29,0,0,0,3.42,3.41A3.24,3.24,0,0,0,102.28,13.54Zm-83,0c0,4.83-3.32,8.82-8.49,8.82a6.54,6.54,0,0,1-4.65-1.57v5.86H0V5.16H6.17V6.8a6.43,6.43,0,0,1,5.11-2.18C16.41,4.62,19.31,8.58,19.31,13.54Zm-6.53,0A3.27,3.27,0,0,0,9.4,10,3.28,3.28,0,0,0,6,13.54,3.29,3.29,0,0,0,9.4,16.95,3.24,3.24,0,0,0,12.78,13.54Zm103.69,0.27c0-2.54,1.54-3.32,3.6-3.32a6.56,6.56,0,0,1,2.08.3L122.3,5.1a3.92,3.92,0,0,0-1.45-.18c-3.45,0-4.38,2.18-4.38,2.18V5.16H110.3V21.84h6.17v-8ZM141.73,0V21.84h-6.16V20.21a6.43,6.43,0,0,1-5.11,2.18c-5.14,0-8-4-8-8.91s3.32-8.82,8.49-8.82a6.54,6.54,0,0,1,4.65,1.57v-5Zm-6,13.48a3.28,3.28,0,0,0-3.41-3.41A3.24,3.24,0,0,0,129,13.47,3.4,3.4,0,1,0,135.75,13.47ZM81.35,4.62c-3.6,0-4.9,2.18-4.9,2.18V5.16H70.29V21.84h6.16V13.29c0-2.11.79-3.08,2.69-3.08s2.18,1.57,2.18,3.57v8.07h6.22V11.6C87.55,7,85.34,4.62,81.35,4.62ZM64.07,1.42H57.9V21.84h6.16V10.36H67l2.81-5.2H64.07V1.42ZM50.26,11.21c-2-.3-2.87-0.3-2.87-1.09s0.81-.94,2.42-0.94a16.15,16.15,0,0,1,5.11.91L56,5.41a24.56,24.56,0,0,0-6.13-.75c-5.89,0-9,2.27-9,5.89,0,2.81,1.66,4.47,6.53,5.11,2.06,0.27,2.81.39,2.81,1.15s-0.82,1-2.24,1a16.67,16.67,0,0,1-6-1.3L40.77,21.3a22.14,22.14,0,0,0,6.68,1c6.35,0,9.28-2.24,9.28-5.89C56.72,13.54,55.15,12,50.26,11.21ZM40.19,13.35c0,6.34-5.17,9-10,9s-9.82-2.6-9.82-8.73c0-6.28,5.08-9,10-9S40.19,7.25,40.19,13.35Zm-6.56.18a3.4,3.4,0,1,0-6.8,0,3.28,3.28,0,0,0,3.41,3.41A3.24,3.24,0,0,0,33.63,13.54Z", fill: "#00A0D6", transform: "translate(0 0)" })))), h("div", { class: "siteheader-topright" }, h("slot", { name: "toprightstart" }), (this.gotData && this.loginDialog && !this.hideLogin) && (h("pn-marketweb-siteheader-login", { loginDialog: this.loginDialog, endpoint: this.endpoint, i18n: this.i18n })), (this.gotData && ((_g = this.languageSelector) === null || _g === void 0 ? void 0 : _g.languages)) && !this.hideLanguageSelector &&
       h("pn-language-selector", { value: this.language }, this.languageSelector.languages.map(language => h("pn-language-selector-option", { name: language.nativeName, code: language.twoLetterISOLanguageName, selected: language.isCurrent, url: this.getLanguageVersionUrl(language) }))), h("slot", { name: "toprightend" }))), h("div", { class: "siteheader-row" }, h("div", { class: "siteheader-menu" }, h("pn-mainnav", { market: this.market, language: this.language, onMenuOpenChange: (e) => {
@@ -2988,9 +3322,13 @@ let PnMarketwebSiteheader$1 = class extends HTMLElement {
     })), h("div", { slot: "footer", class: "siteheader-menu-footer" }, (this.gotData && this.loginDialog && !this.hideLogin) && (h("pn-marketweb-siteheader-login", { loginDialog: this.loginDialog, endpoint: this.endpoint, i18n: this.i18n })), (this.gotData && ((_h = this.languageSelector) === null || _h === void 0 ? void 0 : _h.languages)) && !this.hideLanguageSelector &&
       h("pn-language-selector", { value: this.language }, this.languageSelector.languages.map(language => h("pn-language-selector-option", { name: language.nativeName, code: language.twoLetterISOLanguageName, selected: language.isCurrent, url: this.getLanguageVersionUrl(language) }))), !this.hideSiteSelector &&
       h("pn-site-selector", { language: this.language }, (this.gotData && ((_j = this.siteSelector) === null || _j === void 0 ? void 0 : _j.currentSiteTitle)) &&
-        h("pn-site-selector-item", { heading: this.siteSelector.currentSiteTitle, description: this.siteSelector.currentSiteDescription }), (this.gotData && ((_k = this.siteSelector) === null || _k === void 0 ? void 0 : _k.siteSelections)) && this.siteSelector.siteSelections.map((site) => h("pn-site-selector-item", { heading: site.linkText, description: site.linkDescription, url: site.pageLink, newwindow: site.openInNewWindow })))), h("div", { slot: "top", class: "siteheader-menu-top" }, h("pn-marketweb-siteheader-search", { search: this.search, "hide-search": this.hideSearch, i18n: this.i18n }))))), h("pn-marketweb-siteheader-search", { search: this.search, "hide-search": this.hideSearch, "show-only-link": this.minimizeSearch, i18n: this.i18n }))));
+        h("pn-site-selector-item", { heading: this.siteSelector.currentSiteTitle, description: this.siteSelector.currentSiteDescription }), (this.gotData && ((_k = this.siteSelector) === null || _k === void 0 ? void 0 : _k.siteSelections)) && this.siteSelector.siteSelections.map((site) => h("pn-site-selector-item", { heading: site.linkText, description: site.linkDescription, url: site.pageLink, newwindow: site.openInNewWindow })))), h("div", { slot: "top", class: "siteheader-menu-top" }, h("pn-marketweb-siteheader-search", { search: this.search, "hide-search": this.hideSearch, i18n: this.i18n }))))), h("pn-marketweb-siteheader-search", { search: this.search, "hide-search": this.hideSearch, "show-only-link": this.minimizeSearch, i18n: this.i18n })))));
   }
   get hostElement() { return this; }
+  static get watchers() { return {
+    "language": ["onLanguageChange"],
+    "market": ["onMarketChange"]
+  }; }
   static get style() { return pnMarketwebSiteheaderCss; }
 };
 
@@ -3248,6 +3586,10 @@ let PnMarketwebSiteheaderLogin$1 = class extends HTMLElement {
         h("div", null, h("ul", null, (_c = this.loginDialog.loginMenuLinks) === null || _c === void 0 ? void 0 : _c.map(link => h("li", null, h("a", { href: link.href, target: link.openInNewWindow ? "_blank" : "_self", class: "btn btn-link" }, link.linkText)))))));
   }
   get hostElement() { return this; }
+  static get watchers() { return {
+    "i18n": ["init"],
+    "loginDialog": ["init"]
+  }; }
   static get style() { return pnMarketwebSiteheaderLoginCss; }
 };
 
@@ -3881,17 +4223,18 @@ let PnSiteSelectorItem$1 = class extends HTMLElement {
 };
 
 const PnChoiceButton = /*@__PURE__*/proxyCustomElement(PnChoiceButton$1, [4,"pn-choice-button",{"value":[520],"name":[1],"choiceid":[1],"type":[1],"disabled":[4],"checked":[4],"indeterminate":[1028]},[[0,"change","handlechange"]]]);
+const PnFilterCheckbox = /*@__PURE__*/proxyCustomElement(PnFilterCheckbox$1, [1,"pn-filter-checkbox",{"value":[520],"name":[1],"checkboxid":[1],"disabled":[4],"checked":[4],"indeterminate":[1028]},[[0,"change","handlechange"]]]);
 const PnFilterSearch = /*@__PURE__*/proxyCustomElement(PnFilterSearch$1, [1,"pn-filter-search",{"disabled":[4],"placeholder":[1],"inputid":[1],"name":[1],"autocomplete":[1],"value":[1],"label":[1],"loading":[4],"button":[1],"light":[4]},[[0,"input","inputHandler"]]]);
 const PnFindServiceAndPrice = /*@__PURE__*/proxyCustomElement(PnfindServiceAndPrice, [0,"pn-find-service-and-price",{"source":[1],"language":[1025],"market":[1025],"filteredItems":[32],"postagetype":[32],"weight":[32],"weightvalue":[32],"deliveryscope":[32],"sourceData":[32]}]);
 const PnFindServiceAndPriceResult = /*@__PURE__*/proxyCustomElement(PnfindServiceAndPriceResult, [0,"pn-find-service-and-price-result",{"item":[1040],"shownitems":[16],"weightText":[32]}]);
-const PnLanguageSelector = /*@__PURE__*/proxyCustomElement(PnlanguageSelector, [4,"pn-language-selector",{"value":[1537],"selectedLanguageName":[32],"options":[32],"i18n":[32]}]);
+const PnLanguageSelector = /*@__PURE__*/proxyCustomElement(PnlanguageSelector, [4,"pn-language-selector",{"value":[513],"selectedLanguageName":[32],"options":[32],"i18n":[32]}]);
 const PnLanguageSelectorOption = /*@__PURE__*/proxyCustomElement(PnlanguageSelectorOption, [0,"pn-language-selector-option",{"name":[1],"code":[1],"url":[1],"selected":[4],"currentLanguage":[1,"current-language"]}]);
 const PnMainnav = /*@__PURE__*/proxyCustomElement(PnMainnav$1, [4,"pn-mainnav",{"market":[1],"language":[1],"navigationId":[1,"navigation-id"],"openMenu":[1028,"open-menu"],"navLabel":[1,"nav-label"]},[[0,"language","setLanguage"],[0,"market","setMarket"],[0,"menuLanguageChange","onLanguageChange"],[0,"setmenuopenstate","setMenuOpenState"],[0,"openMenuLevelChange","onOpenMenuLevelChange"]]]);
 const PnMainnavLevel = /*@__PURE__*/proxyCustomElement(PnMainnavLevel$1, [4,"pn-mainnav-level",{"level":[32],"levelId":[32],"isOpen":[32],"parentName":[32],"parentHref":[32],"parentLinkId":[32],"listCount":[32],"alignment":[32]}]);
 const PnMainnavLink = /*@__PURE__*/proxyCustomElement(PnMainnavLink$1, [4,"pn-mainnav-link",{"name":[1],"href":[1],"target":[1],"linkid":[1],"levelId":[32],"open":[32],"hasChildren":[32]}]);
 const PnMainnavList = /*@__PURE__*/proxyCustomElement(PnMainnavList$1, [4,"pn-mainnav-list",{"heading":[1],"linkCount":[32]}]);
-const PnMarketwebSitefooter = /*@__PURE__*/proxyCustomElement(PnMarketwebSiteheader$2, [0,"pn-marketweb-sitefooter",{"market":[1],"language":[1],"endpoint":[1],"siteDefinition":[32],"footerContent":[32],"i18n":[32],"gotData":[32],"fetchingData":[32]}]);
-const PnMarketwebSiteheader = /*@__PURE__*/proxyCustomElement(PnMarketwebSiteheader$1, [4,"pn-marketweb-siteheader",{"market":[1],"language":[1],"endpoint":[1],"hideSiteSelector":[1028,"hide-site-selector"],"hideLanguageSelector":[1028,"hide-language-selector"],"hideSearch":[1028,"hide-search"],"hideLogin":[1028,"hide-login"],"i18n":[32],"gotData":[32],"fetchingData":[32],"menuItems":[32],"siteDefinition":[32],"search":[32],"siteSelector":[32],"languageSelector":[32],"loginDialog":[32],"minimizeSearch":[32]},[[9,"resize","handleResize"]]]);
+const PnMarketwebSitefooter = /*@__PURE__*/proxyCustomElement(PnMarketwebSiteheader$2, [0,"pn-marketweb-sitefooter",{"market":[1537],"language":[1537],"environment":[1537],"endpoint":[1],"siteDefinition":[32],"footerContent":[32],"i18n":[32],"gotData":[32],"fetchingData":[32]}]);
+const PnMarketwebSiteheader = /*@__PURE__*/proxyCustomElement(PnMarketwebSiteheader$1, [4,"pn-marketweb-siteheader",{"market":[1537],"language":[1537],"environment":[1537],"endpoint":[1],"hideSiteSelector":[1540,"hide-site-selector"],"hideLanguageSelector":[1540,"hide-language-selector"],"hideSearch":[1540,"hide-search"],"hideLogin":[1540,"hide-login"],"i18n":[32],"gotData":[32],"fetchingData":[32],"menuItems":[32],"siteDefinition":[32],"search":[32],"siteSelector":[32],"languageSelector":[32],"loginDialog":[32],"minimizeSearch":[32]},[[9,"resize","handleResize"]]]);
 const PnMarketwebSiteheaderLogin = /*@__PURE__*/proxyCustomElement(PnMarketwebSiteheaderLogin$1, [0,"pn-marketweb-siteheader-login",{"endpoint":[1],"i18n":[8,"i-1-8n"],"loginDialog":[1040],"loginManager":[32],"loggedIn":[32],"toggleButtonText":[32]}]);
 const PnMarketwebSiteheaderSearch = /*@__PURE__*/proxyCustomElement(PnMarketwebSiteheaderSearch$1, [0,"pn-marketweb-siteheader-search",{"i18n":[8,"i-1-8n"],"showOnlyLink":[1028,"show-only-link"],"hideSearch":[1028,"hide-search"],"search":[1040]}]);
 const PnProductPricelist = /*@__PURE__*/proxyCustomElement(PnFindProductPricelist, [4,"pn-product-pricelist",{"source":[1],"language":[1025],"market":[1025],"productid":[1],"filteredItems":[32],"sourceData":[32],"gotData":[32],"loading":[32],"postagetype":[32],"weight":[32],"weightvalue":[32]}]);
@@ -3904,12 +4247,13 @@ const PnSidenavLevel = /*@__PURE__*/proxyCustomElement(PnSidenavLevel$1, [4,"pn-
 const PnSidenavLink = /*@__PURE__*/proxyCustomElement(PnSidenavLink$1, [4,"pn-sidenav-link",{"name":[1],"href":[1],"target":[1],"linkid":[1],"icon":[1],"current":[4],"levelId":[32],"open":[32],"hasChildren":[32]}]);
 const PnSiteFooter = /*@__PURE__*/proxyCustomElement(PnSiteFooter$1, [4,"pn-site-footer",{"url":[1]}]);
 const PnSiteFooterCol = /*@__PURE__*/proxyCustomElement(PnSiteFooterCol$1, [4,"pn-site-footer-col"]);
-const PnSiteSelector = /*@__PURE__*/proxyCustomElement(PnSiteSelector$1, [4,"pn-site-selector",{"buttontext":[1],"heading":[1],"language":[1],"i18n":[32]}]);
+const PnSiteSelector = /*@__PURE__*/proxyCustomElement(PnSiteSelector$1, [4,"pn-site-selector",{"buttontext":[1537],"heading":[1537],"language":[1537],"i18n":[32]}]);
 const PnSiteSelectorItem = /*@__PURE__*/proxyCustomElement(PnSiteSelectorItem$1, [0,"pn-site-selector-item",{"url":[1],"heading":[1],"description":[1],"newwindow":[4]}]);
 const defineCustomElements = (opts) => {
   if (typeof customElements !== 'undefined') {
     [
       PnChoiceButton,
+  PnFilterCheckbox,
   PnFilterSearch,
   PnFindServiceAndPrice,
   PnFindServiceAndPriceResult,
@@ -3943,4 +4287,4 @@ const defineCustomElements = (opts) => {
   }
 };
 
-export { PnChoiceButton, PnFilterSearch, PnFindServiceAndPrice, PnFindServiceAndPriceResult, PnLanguageSelector, PnLanguageSelectorOption, PnMainnav, PnMainnavLevel, PnMainnavLink, PnMainnavList, PnMarketwebSitefooter, PnMarketwebSiteheader, PnMarketwebSiteheaderLogin, PnMarketwebSiteheaderSearch, PnProductPricelist, PnProductPricelistResult, PnProductTile, PnProductTileInfo, PnProductTilePrice, PnSidenav, PnSidenavLevel, PnSidenavLink, PnSiteFooter, PnSiteFooterCol, PnSiteSelector, PnSiteSelectorItem, defineCustomElements };
+export { PnChoiceButton, PnFilterCheckbox, PnFilterSearch, PnFindServiceAndPrice, PnFindServiceAndPriceResult, PnLanguageSelector, PnLanguageSelectorOption, PnMainnav, PnMainnavLevel, PnMainnavLink, PnMainnavList, PnMarketwebSitefooter, PnMarketwebSiteheader, PnMarketwebSiteheaderLogin, PnMarketwebSiteheaderSearch, PnProductPricelist, PnProductPricelistResult, PnProductTile, PnProductTileInfo, PnProductTilePrice, PnSidenav, PnSidenavLevel, PnSidenavLink, PnSiteFooter, PnSiteFooterCol, PnSiteSelector, PnSiteSelectorItem, defineCustomElements };