@postnord/pn-marketweb-components 2.1.7 → 2.1.9

package/collection/components/minor/pn-titletag/pn-titletag.js

@@ -1,60 +1,62 @@
-import { Component, Prop, h, Host, Element } from "@stencil/core";
+import { h, Host } from "@stencil/core";
 export class PnTiletag {
   constructor() {
-    /** Icon of the tag */
     this.icon = null;
-    /** Icon of the tag */
     this.color = "green700";
   }
   render() {
-    return (h(Host, null,
-      h("slot", null),
-      this.icon ? (h("pn-icon", { symbol: this.icon, small: "false", color: this.color })) : null));
+    return (h(Host, null, h("slot", null), this.icon ? (h("pn-icon", { symbol: this.icon, small: "false", color: this.color })) : null));
   }
   static get is() { return "pn-titletag"; }
-  static get originalStyleUrls() { return {
-    "$": ["pn-titletag.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["pn-titletag.css"]
-  }; }
-  static get properties() { return {
-    "icon": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Icon of the tag"
-      },
-      "attribute": "icon",
-      "reflect": false,
-      "defaultValue": "null"
-    },
-    "color": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Icon of the tag"
+  static get originalStyleUrls() {
+    return {
+      "$": ["pn-titletag.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["pn-titletag.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "icon": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Icon of the tag"
+        },
+        "attribute": "icon",
+        "reflect": false,
+        "defaultValue": "null"
       },
-      "attribute": "color",
-      "reflect": true,
-      "defaultValue": "\"green700\""
-    }
-  }; }
+      "color": {
+        "type": "string",
+        "mutable": true,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Icon of the tag"
+        },
+        "attribute": "color",
+        "reflect": true,
+        "defaultValue": "\"green700\""
+      }
+    };
+  }
   static get elementRef() { return "hostElement"; }
 }

package/collection/components/navigation/pn-language-selector/pn-language-selector-option.js

@@ -1,11 +1,11 @@
-import { Component, Prop, h, Host, Event } from "@stencil/core";
+import { h, Host } from "@stencil/core";
 export class PnlanguageSelectorOption {
   constructor() {
-    /** What you write in the comment block above each prop is what ends up in the description fields in the prop table in the documentation */
     this.name = "";
     this.code = "";
     this.url = "";
     this.selected = false;
+    this.currentLanguage = undefined;
   }
   onOptionClick() {
     const currentlanguage = {
@@ -17,132 +17,128 @@ export class PnlanguageSelectorOption {
     this.setCurrentLanguage.emit(currentlanguage);
   }
   render() {
-    return (h(Host, { role: "listitem", selected: (this.selected) + '', code: this.code, name: this.name }, !this.url ? (h("button", { class: "languageselector-button", "data-langcode": this.code, onClick: this.onOptionClick.bind(this) },
-      h("span", { class: "languageselector-radio-outer" },
-        h("span", { class: "languageselector-radio-inner" })),
-      h("span", { class: "languageselector-itemtext" },
-        this.name,
-        " - ",
-        this.code))) : (h("a", { href: this.url, target: "_self", class: "languageselector-link", "data-langcode": this.code },
-      h("span", { class: "languageselector-radio-outer" },
-        h("span", { class: "languageselector-radio-inner" })),
-      h("span", { class: "languageselector-itemtext" },
-        this.name,
-        " - ",
-        this.code)))));
+    return (h(Host, { role: "listitem", selected: (this.selected) + '', code: this.code, name: this.name }, !this.url ? (h("button", { class: "languageselector-button", "data-langcode": this.code, onClick: this.onOptionClick.bind(this) }, h("span", { class: "languageselector-radio-outer" }, h("span", { class: "languageselector-radio-inner" })), h("span", { class: "languageselector-itemtext" }, this.name, " - ", this.code))) : (h("a", { href: this.url, target: "_self", class: "languageselector-link", "data-langcode": this.code }, h("span", { class: "languageselector-radio-outer" }, h("span", { class: "languageselector-radio-inner" })), h("span", { class: "languageselector-itemtext" }, this.name, " - ", this.code)))));
   }
   static get is() { return "pn-language-selector-option"; }
-  static get originalStyleUrls() { return {
-    "$": ["pn-language-selector-option.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["pn-language-selector-option.css"]
-  }; }
-  static get properties() { return {
-    "name": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "What you write in the comment block above each prop is what ends up in the description fields in the prop table in the documentation"
-      },
-      "attribute": "name",
-      "reflect": false,
-      "defaultValue": "\"\""
-    },
-    "code": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "code",
-      "reflect": false,
-      "defaultValue": "\"\""
-    },
-    "url": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "url",
-      "reflect": false,
-      "defaultValue": "\"\""
-    },
-    "selected": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
+  static get originalStyleUrls() {
+    return {
+      "$": ["pn-language-selector-option.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["pn-language-selector-option.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "name": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "What you write in the comment block above each prop is what ends up in the description fields in the prop table in the documentation"
+        },
+        "attribute": "name",
+        "reflect": false,
+        "defaultValue": "\"\""
       },
-      "attribute": "selected",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "currentLanguage": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
+      "code": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "code",
+        "reflect": false,
+        "defaultValue": "\"\""
       },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
+      "url": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "url",
+        "reflect": false,
+        "defaultValue": "\"\""
       },
-      "attribute": "current-language",
-      "reflect": false
-    }
-  }; }
-  static get events() { return [{
-      "method": "setCurrentLanguage",
-      "name": "setCurrentLanguage",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": ""
+      "selected": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "selected",
+        "reflect": false,
+        "defaultValue": "false"
       },
-      "complexType": {
-        "original": "any",
-        "resolved": "any",
-        "references": {}
+      "currentLanguage": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "current-language",
+        "reflect": false
       }
-    }]; }
+    };
+  }
+  static get events() {
+    return [{
+        "method": "setCurrentLanguage",
+        "name": "setCurrentLanguage",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "complexType": {
+          "original": "any",
+          "resolved": "any",
+          "references": {}
+        }
+      }];
+  }
 }

package/collection/components/navigation/pn-language-selector/pn-language-selector.js

@@ -1,11 +1,11 @@
-import { Component, Prop, h, State, Host, Watch, Element, Event } from "@stencil/core";
+import { h, Host } from "@stencil/core";
 import { translations } from "./translations";
 export class PnlanguageSelector {
   constructor() {
-    /* Current language code  */
     this.value = "";
     this.selectedLanguageName = "";
     this.options = [];
+    this.i18n = undefined;
   }
   componentWillLoad() {
     this.setInitialSelectedLanguageName();
@@ -76,70 +76,77 @@ export class PnlanguageSelector {
     });
   }
   render() {
-    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))))));
+    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))))));
   }
   static get is() { return "pn-language-selector"; }
-  static get originalStyleUrls() { return {
-    "$": ["pn-language-selector.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["pn-language-selector.css"]
-  }; }
-  static get properties() { return {
-    "value": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "value",
-      "reflect": true,
-      "defaultValue": "\"\""
-    }
-  }; }
-  static get states() { return {
-    "selectedLanguageName": {},
-    "options": {},
-    "i18n": {}
-  }; }
-  static get events() { return [{
-      "method": "setLanguage",
-      "name": "setLanguage",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "complexType": {
-        "original": "any",
-        "resolved": "any",
-        "references": {}
+  static get originalStyleUrls() {
+    return {
+      "$": ["pn-language-selector.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["pn-language-selector.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "value": {
+        "type": "string",
+        "mutable": true,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "value",
+        "reflect": true,
+        "defaultValue": "\"\""
       }
-    }]; }
+    };
+  }
+  static get states() {
+    return {
+      "selectedLanguageName": {},
+      "options": {},
+      "i18n": {}
+    };
+  }
+  static get events() {
+    return [{
+        "method": "setLanguage",
+        "name": "setLanguage",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "complexType": {
+          "original": "any",
+          "resolved": "any",
+          "references": {}
+        }
+      }];
+  }
   static get elementRef() { return "hostElement"; }
-  static get watchers() { return [{
-      "propName": "value",
-      "methodName": "setSelectedLanguageName"
-    }, {
-      "propName": "value",
-      "methodName": "setTranslations"
-    }, {
-      "propName": "value",
-      "methodName": "onValueChange"
-    }]; }
+  static get watchers() {
+    return [{
+        "propName": "value",
+        "methodName": "setSelectedLanguageName"
+      }, {
+        "propName": "value",
+        "methodName": "setTranslations"
+      }, {
+        "propName": "value",
+        "methodName": "onValueChange"
+      }];
+  }
 }

package/collection/components/navigation/pn-mainnav/pn-mainnav-level.js

@@ -1,4 +1,4 @@
-import { Component, State, h, Host, Element, Watch, Prop } from "@stencil/core";
+import { h, Host } from "@stencil/core";
 import { state, onChange } from "./pn-mainnav-store";
 export class PnMainnavLevel {
   constructor() {
@@ -66,64 +66,64 @@ export class PnMainnavLevel {
     state.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.i18n.menuGoBackButton),
-        h("button", { class: "secondlevel-backbtn", onClick: () => {
-            state.openLevel = '';
-            state.currentLevel = 1;
-          }, "aria-expanded": (state.openLevel === this.levelId) + '' },
-          h("pn-icon", { symbol: "arrow-left", color: "blue700" }),
-          state.i18n.menuStartButton),
-        (this.parentHref && this.label) ? h("pn-mainnav-link", { href: this.parentHref, name: this.label, 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.i18n.menuGoBackButton), h("button", { class: "secondlevel-backbtn", onClick: () => {
+        state.openLevel = '';
+        state.currentLevel = 1;
+      }, "aria-expanded": (state.openLevel === this.levelId) + '' }, h("pn-icon", { symbol: "arrow-left", color: "blue700" }), state.i18n.menuStartButton), (this.parentHref && this.label) ? h("pn-mainnav-link", { href: this.parentHref, name: this.label, linkid: this.parentLinkId }) : null)) : null, h("slot", { name: "top" }), h("slot", null), h("slot", { name: "additional" }), h("slot", { name: "footer" })));
   }
   static get is() { return "pn-mainnav-level"; }
-  static get originalStyleUrls() { return {
-    "$": ["pn-mainnav-level.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["pn-mainnav-level.css"]
-  }; }
-  static get properties() { return {
-    "label": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "label",
-      "reflect": true,
-      "defaultValue": "\"\""
-    }
-  }; }
-  static get states() { return {
-    "level": {},
-    "levelId": {},
-    "isOpen": {},
-    "parentName": {},
-    "parentHref": {},
-    "parentLinkId": {},
-    "listCount": {},
-    "alignment": {}
-  }; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["pn-mainnav-level.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["pn-mainnav-level.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "label": {
+        "type": "string",
+        "mutable": true,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "label",
+        "reflect": true,
+        "defaultValue": "\"\""
+      }
+    };
+  }
+  static get states() {
+    return {
+      "level": {},
+      "levelId": {},
+      "isOpen": {},
+      "parentName": {},
+      "parentHref": {},
+      "parentLinkId": {},
+      "listCount": {},
+      "alignment": {}
+    };
+  }
   static get elementRef() { return "hostElement"; }
-  static get watchers() { return [{
-      "propName": "label",
-      "methodName": "setState"
-    }, {
-      "propName": "isOpen",
-      "methodName": "onOpen"
-    }]; }
+  static get watchers() {
+    return [{
+        "propName": "label",
+        "methodName": "setState"
+      }, {
+        "propName": "isOpen",
+        "methodName": "onOpen"
+      }];
+  }
 }