@postnord/pn-marketweb-components 2.0.149 → 2.0.150-test

package/collection/components/widgets/pn-proxio-pricegroup/pn-proxio-pricegroup.js

@@ -1,11 +1,12 @@
-import { h, Host } from "@stencil/core";
+import { Component, h, Host, Listen, Prop, State } from "@stencil/core";
 import { FetchHelper } from "../../../globals/FetchHelper";
 import { MarketWebContextService } from "../../../globals/MarketWebContextService";
 import { translations } from "./translations";
 export class PnProxioPricegroup {
   constructor() {
-    this.fetchHelper = new FetchHelper("proxiopricegroup");
+    /** Specifies which endpoint domain we should load from */
     this.endpoint = null;
+    //@Prop() culture: string = "sv-SE";
     this.language = "sv";
     this.market = "se";
     this.tariffid = "";
@@ -13,6 +14,7 @@ export class PnProxioPricegroup {
     this.activeWeightIndex = 0;
     this.data = null;
     this.i18n = translations["sv"];
+    this.fetchHelper = new FetchHelper("proxiopricegroup");
   }
   componentWillLoad() {
     this.setInitialValues().then(() => {
@@ -121,138 +123,151 @@ export class PnProxioPricegroup {
   }
   render() {
     var _a, _b, _c;
-    return (h(Host, null, ((_a = this.data) === null || _a === void 0 ? void 0 : _a.proxioProduct) ? (h("div", { class: "proxio-pricegroup-container" }, h("div", { class: "weightcontainer" }, this.data.proxioProduct.weightAndPriceList ?
-      (h("div", { class: "weightvaluecontainer" }, h("pn-button", { disabled: this.activeWeightIndex === 0 ? ("disabled") : (null), "icon-only": "true", icon: "arrow-left", appearance: "light", small: "true", onClick: () => this.setActiveWeightIndex(this.activeWeightIndex - 1) }), h("div", { class: "weightradios ", "data-carousel-container-position": this.getContainerPosition() }, h("div", { class: "weightline" }), this.data.proxioProduct.weightAndPriceList.map((weightItem, index) => this.getCarouselPosition(index) !== null ?
-        h("div", { class: "weightdata", "data-carousel-position": this.getCarouselPosition(index), onClick: () => this.setActiveWeightIndex(index) }, h("input", { type: "radio", id: "weightradio" + index, name: "weightradio", value: index, checked: this.isActive(index) }), h("label", { htmlFor: "weightradio" + index }, weightItem.item1)) : null)), h("pn-button", { disabled: this.activeWeightIndex === ((_c = (_b = this.data.proxioProduct) === null || _b === void 0 ? void 0 : _b.weightAndPriceList) === null || _c === void 0 ? void 0 : _c.length) - 1 ? ("disabled") : (null), icon: "arrow-right", appearance: "light", "icon-only": "true", small: "true", onClick: () => this.setActiveWeightIndex(this.activeWeightIndex + 1) }))) : (null)), h("pn-proxio-productcard", null, h("pn-illustration", { slot: "illustrationmobile", illustration: this.data.proxioProduct.productIcon }), h("h2", { slot: "title" }, this.data.proxioProduct.productTitle), h("pn-proxio-productcard-description", { slot: "description", heading: this.data.proxioProduct.productPreamble, highlight: this.data.proxioProduct.deliveryDateInformation, list: this.data.proxioProduct.productDescriptionBulletListItems }), h("div", { slot: "information" }, h("pn-proxio-productcard-information", { label: this.i18n.labelMaxDimensions, information: this.data.proxioProduct.productPackageDimensionsList }), h("pn-proxio-productcard-information", { label: this.i18n.labelMaxDimensionsRoll, information: this.data.proxioProduct.productRollDimensionsList })), h("div", { slot: "bottomtags" }, this.data.proxioProduct.usp1 ?
-      (h("pn-titletag", { color: "gray50" }, this.data.proxioProduct.usp1)) : (null), this.data.proxioProduct.usp2 ?
-      (h("pn-titletag", { color: "gray50" }, this.data.proxioProduct.usp2)) : (null), this.data.proxioProduct.usp3 ?
-      (h("pn-titletag", { color: "gray50" }, this.data.proxioProduct.usp3)) : (null)), h("pn-illustration", { slot: "illustration", illustration: this.data.proxioProduct.productIcon }), h("div", { slot: "pricelink" }, h("pn-proxio-productcard-pricelink", { price: this.getPriceString(this.data.proxioProduct), link: this.getProductLink(this.data.proxioProduct, this.data.proxioProduct.productWeightGroupList), linktext: this.data.proxioProduct.productLinkText }), this.data.relatedProxioProducts ? (this.data.relatedProxioProducts.map((product) => (h("pn-proxio-productcard-pricelink", { price: this.getPriceString(product), link: product.productLink, linktext: product.productLinkText })))) : (null))))) : (null)));
+    return (h(Host, null, ((_a = this.data) === null || _a === void 0 ? void 0 : _a.proxioProduct) ? (h("div", { class: "proxio-pricegroup-container" },
+      h("div", { class: "weightcontainer" }, this.data.proxioProduct.weightAndPriceList ?
+        (h("div", { class: "weightvaluecontainer" },
+          h("pn-button", { disabled: this.activeWeightIndex === 0 ? ("disabled") : (null), "icon-only": "true", icon: "arrow-left", appearance: "light", small: "true", onClick: () => this.setActiveWeightIndex(this.activeWeightIndex - 1) }),
+          h("div", { class: "weightradios ", "data-carousel-container-position": this.getContainerPosition() },
+            h("div", { class: "weightline" }),
+            this.data.proxioProduct.weightAndPriceList.map((weightItem, index) => this.getCarouselPosition(index) !== null ?
+              h("div", { class: "weightdata", "data-carousel-position": this.getCarouselPosition(index), onClick: () => this.setActiveWeightIndex(index) },
+                h("input", { type: "radio", id: "weightradio" + index, name: "weightradio", value: index, checked: this.isActive(index) }),
+                h("label", { htmlFor: "weightradio" + index }, weightItem.item1)) : null)),
+          h("pn-button", { disabled: this.activeWeightIndex === ((_c = (_b = this.data.proxioProduct) === null || _b === void 0 ? void 0 : _b.weightAndPriceList) === null || _c === void 0 ? void 0 : _c.length) - 1 ? ("disabled") : (null), icon: "arrow-right", appearance: "light", "icon-only": "true", small: "true", onClick: () => this.setActiveWeightIndex(this.activeWeightIndex + 1) }))) : (null)),
+      h("pn-proxio-productcard", null,
+        h("pn-illustration", { slot: "illustrationmobile", illustration: this.data.proxioProduct.productIcon }),
+        h("h2", { slot: "title" }, this.data.proxioProduct.productTitle),
+        h("pn-proxio-productcard-description", { slot: "description", heading: this.data.proxioProduct.productPreamble, highlight: this.data.proxioProduct.deliveryDateInformation, list: this.data.proxioProduct.productDescriptionBulletListItems }),
+        h("div", { slot: "information" },
+          h("pn-proxio-productcard-information", { label: this.i18n.labelMaxDimensions, information: this.data.proxioProduct.productPackageDimensionsList }),
+          h("pn-proxio-productcard-information", { label: this.i18n.labelMaxDimensionsRoll, information: this.data.proxioProduct.productRollDimensionsList })),
+        h("div", { slot: "bottomtags" },
+          this.data.proxioProduct.usp1 ?
+            (h("pn-titletag", { color: "gray50" }, this.data.proxioProduct.usp1)) : (null),
+          this.data.proxioProduct.usp2 ?
+            (h("pn-titletag", { color: "gray50" }, this.data.proxioProduct.usp2)) : (null),
+          this.data.proxioProduct.usp3 ?
+            (h("pn-titletag", { color: "gray50" }, this.data.proxioProduct.usp3)) : (null)),
+        h("pn-illustration", { slot: "illustration", illustration: this.data.proxioProduct.productIcon }),
+        h("div", { slot: "pricelink" },
+          h("pn-proxio-productcard-pricelink", { price: this.getPriceString(this.data.proxioProduct), link: this.getProductLink(this.data.proxioProduct, this.data.proxioProduct.productWeightGroupList), linktext: this.data.proxioProduct.productLinkText }),
+          this.data.relatedProxioProducts ? (this.data.relatedProxioProducts.map((product) => (h("pn-proxio-productcard-pricelink", { price: this.getPriceString(product), link: product.productLink, linktext: product.productLinkText })))) : (null))))) : (null)));
   }
   static get is() { return "pn-proxio-pricegroup"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["pn-proxio-pricegroup.scss"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["pn-proxio-pricegroup.css"]
-    };
-  }
-  static get properties() {
-    return {
-      "endpoint": {
-        "type": "string",
-        "mutable": true,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Specifies which endpoint domain we should load from"
-        },
-        "attribute": "endpoint",
-        "reflect": false,
-        "defaultValue": "null"
+  static get originalStyleUrls() { return {
+    "$": ["pn-proxio-pricegroup.scss"]
+  }; }
+  static get styleUrls() { return {
+    "$": ["pn-proxio-pricegroup.css"]
+  }; }
+  static get properties() { return {
+    "endpoint": {
+      "type": "string",
+      "mutable": true,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
       },
-      "language": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "language",
-        "reflect": false,
-        "defaultValue": "\"sv\""
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "Specifies which endpoint domain we should load from"
       },
-      "market": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "market",
-        "reflect": false,
-        "defaultValue": "\"se\""
+      "attribute": "endpoint",
+      "reflect": false,
+      "defaultValue": "null"
+    },
+    "language": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
       },
-      "tariffid": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "tariffid",
-        "reflect": false,
-        "defaultValue": "\"\""
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
       },
-      "cache": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "cache",
-        "reflect": false,
-        "defaultValue": "true"
-      }
-    };
-  }
-  static get states() {
-    return {
-      "activeWeightIndex": {},
-      "data": {},
-      "i18n": {}
-    };
-  }
-  static get listeners() {
-    return [{
-        "name": "activeWeightIndex",
-        "method": "setActiveWeightIndex",
-        "target": undefined,
-        "capture": false,
-        "passive": false
-      }, {
-        "name": "language",
-        "method": "setLanguage",
-        "target": undefined,
-        "capture": false,
-        "passive": false
-      }];
-  }
+      "attribute": "language",
+      "reflect": false,
+      "defaultValue": "\"sv\""
+    },
+    "market": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "market",
+      "reflect": false,
+      "defaultValue": "\"se\""
+    },
+    "tariffid": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "tariffid",
+      "reflect": false,
+      "defaultValue": "\"\""
+    },
+    "cache": {
+      "type": "boolean",
+      "mutable": false,
+      "complexType": {
+        "original": "boolean",
+        "resolved": "boolean",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "cache",
+      "reflect": false,
+      "defaultValue": "true"
+    }
+  }; }
+  static get states() { return {
+    "activeWeightIndex": {},
+    "data": {},
+    "i18n": {}
+  }; }
+  static get listeners() { return [{
+      "name": "activeWeightIndex",
+      "method": "setActiveWeightIndex",
+      "target": undefined,
+      "capture": false,
+      "passive": false
+    }, {
+      "name": "language",
+      "method": "setLanguage",
+      "target": undefined,
+      "capture": false,
+      "passive": false
+    }]; }
 }

package/collection/components/widgets/pn-proxio-productcard/pn-proxio-productcard-description.js

@@ -1,98 +1,93 @@
-import { h, Host } from "@stencil/core";
+import { Component, h, Prop, Host } from "@stencil/core";
 export class PnProxioProductcardDescription {
   constructor() {
-    this.heading = undefined;
-    this.highlight = undefined;
-    this.description = undefined;
     this.list = [];
   }
   render() {
-    return (h(Host, null, this.heading ? (h("h3", null, this.heading)) : (null), this.highlight ? (h("h3", { class: "highlight" }, this.highlight)) : (null), this.description ? (h("span", null, this.description)) : (null), this.list ?
-      (h("ul", null, this.list.map((text) => {
-        return (h("li", null, text));
-      })))
-      : (null)));
+    return (h(Host, null,
+      this.heading ? (h("h3", null, this.heading)) : (null),
+      this.highlight ? (h("h3", { class: "highlight" }, this.highlight)) : (null),
+      this.description ? (h("span", null, this.description)) : (null),
+      this.list ?
+        (h("ul", null, this.list.map((text) => {
+          return (h("li", null, text));
+        })))
+        : (null)));
   }
   static get is() { return "pn-proxio-productcard-description"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["pn-proxio-productcard-description.scss"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["pn-proxio-productcard-description.css"]
-    };
-  }
-  static get properties() {
-    return {
-      "heading": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "heading",
-        "reflect": false
+  static get originalStyleUrls() { return {
+    "$": ["pn-proxio-productcard-description.scss"]
+  }; }
+  static get styleUrls() { return {
+    "$": ["pn-proxio-productcard-description.css"]
+  }; }
+  static get properties() { return {
+    "heading": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
       },
-      "highlight": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "highlight",
-        "reflect": false
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
       },
-      "description": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "description",
-        "reflect": false
+      "attribute": "heading",
+      "reflect": false
+    },
+    "highlight": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
       },
-      "list": {
-        "type": "unknown",
-        "mutable": true,
-        "complexType": {
-          "original": "string[]",
-          "resolved": "string[]",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "defaultValue": "[]"
-      }
-    };
-  }
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "highlight",
+      "reflect": false
+    },
+    "description": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "description",
+      "reflect": false
+    },
+    "list": {
+      "type": "unknown",
+      "mutable": true,
+      "complexType": {
+        "original": "string[]",
+        "resolved": "string[]",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "defaultValue": "[]"
+    }
+  }; }
 }

package/collection/components/widgets/pn-proxio-productcard/pn-proxio-productcard-information.js

@@ -1,65 +1,67 @@
-import { h, Host } from "@stencil/core";
+import { Component, h, Prop, Host } from "@stencil/core";
 export class PnProxioProductcardInformation {
   constructor() {
-    this.label = undefined;
     this.information = [];
   }
   render() {
-    return (h(Host, null, h("div", { class: "cardinfocontent" }, this.information && this.information.length > 0 && this.label ? (h("div", { class: "cardinfocontent-item" }, this.label ? (h("p", { class: "cardinfocontent-title" }, h("strong", null, this.label))) : (null), this.information.map((item) => (item ?
-      (h("p", null, h("strong", { class: "cardinfocontent-label" }, item.item1, ":"), " ", item.item2))
-      : (null))))) : null)));
+    return (h(Host, null,
+      h("div", { class: "cardinfocontent" }, this.information && this.information.length > 0 && this.label ? (h("div", { class: "cardinfocontent-item" },
+        this.label ? (h("p", { class: "cardinfocontent-title" },
+          h("strong", null, this.label))) : (null),
+        this.information.map((item) => (item ?
+          (h("p", null,
+            h("strong", { class: "cardinfocontent-label" },
+              item.item1,
+              ":"),
+            " ",
+            item.item2))
+          : (null))))) : null)));
   }
   static get is() { return "pn-proxio-productcard-information"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["pn-proxio-productcard-information.scss"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["pn-proxio-productcard-information.css"]
-    };
-  }
-  static get properties() {
-    return {
-      "label": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "label",
-        "reflect": false
+  static get originalStyleUrls() { return {
+    "$": ["pn-proxio-productcard-information.scss"]
+  }; }
+  static get styleUrls() { return {
+    "$": ["pn-proxio-productcard-information.css"]
+  }; }
+  static get properties() { return {
+    "label": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
       },
-      "information": {
-        "type": "unknown",
-        "mutable": false,
-        "complexType": {
-          "original": "ProductGenericItem[]",
-          "resolved": "ProductGenericItem[]",
-          "references": {
-            "ProductGenericItem": {
-              "location": "import",
-              "path": "../pn-proxio-pricegroup/types"
-            }
+      "attribute": "label",
+      "reflect": false
+    },
+    "information": {
+      "type": "unknown",
+      "mutable": false,
+      "complexType": {
+        "original": "ProductGenericItem[]",
+        "resolved": "ProductGenericItem[]",
+        "references": {
+          "ProductGenericItem": {
+            "location": "import",
+            "path": "../pn-proxio-pricegroup/types"
           }
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "defaultValue": "[]"
-      }
-    };
-  }
+        }
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "defaultValue": "[]"
+    }
+  }; }
 }