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

package/collection/components/charts/pn-charts-card/pn-charts-card.js

@@ -1,157 +1,161 @@
-import { h, Host, } from '@stencil/core';
+import { Component, Element, h, Host, Prop, State, } from '@stencil/core';
 export class PnChartsCard {
   constructor() {
-    this.header = undefined;
-    this.highlight = undefined;
-    this.preamble = undefined;
-    this.label = undefined;
-    this.source = undefined;
-    this.sourceUrl = undefined;
     this.openInNewWindow = false;
-    this.someState = undefined;
   }
   render() {
-    return (h(Host, null, h("slot", { name: "clickable-block-wrapper" }), h("div", { class: "pn-charts-card__wrapper" }, h("div", { class: "pn-charts-card__heading__wrapper pn-charts-card__heading__wrapper--vertical" }, h("div", { class: "pn-charts-card__heading" }, this.header), h("div", { class: "pn-charts-card__heading__highlight" }, this.highlight)), h("div", { class: "pn-charts-card__content__wrapper" }, h("slot", { name: "chart" }), h("div", { class: "pn-charts-card__text__container" }, h("div", { class: "pn-charts-card__heading__wrapper pn-charts-card__heading__wrapper--horizontal" }, h("div", { class: "pn-charts-card__heading pn-charts-card__heading" }, this.header), h("div", { class: "pn-charts-card__heading__highlight" }, this.highlight)), h("span", { class: "pn-charts-card__preamble" }, this.preamble), h("div", { class: "pn-charts-card__text__wrapper" }, h("div", { class: "pn-charts-card__source" }, h("label", null, this.label), h("h3", { class: "pn-chart-card__text__heading" }, this.source), h("a", { class: "link--animated", href: this.sourceUrl, rel: this.openInNewWindow ? 'noopener nofollower noreferrer' : null, target: this.openInNewWindow ? '_blank' : null }, "Read the report ", h("pn-icon", { symbol: "arrow-right" }, " ")))))))));
+    return (h(Host, null,
+      h("slot", { name: "clickable-block-wrapper" }),
+      h("div", { class: "pn-charts-card__wrapper" },
+        h("div", { class: "pn-charts-card__heading__wrapper pn-charts-card__heading__wrapper--vertical" },
+          h("div", { class: "pn-charts-card__heading" }, this.header),
+          h("div", { class: "pn-charts-card__heading__highlight" }, this.highlight)),
+        h("div", { class: "pn-charts-card__content__wrapper" },
+          h("slot", { name: "chart" }),
+          h("div", { class: "pn-charts-card__text__container" },
+            h("div", { class: "pn-charts-card__heading__wrapper pn-charts-card__heading__wrapper--horizontal" },
+              h("div", { class: "pn-charts-card__heading pn-charts-card__heading" }, this.header),
+              h("div", { class: "pn-charts-card__heading__highlight" }, this.highlight)),
+            h("span", { class: "pn-charts-card__preamble" }, this.preamble),
+            h("div", { class: "pn-charts-card__text__wrapper" },
+              h("div", { class: "pn-charts-card__source" },
+                h("label", null, this.label),
+                h("h3", { class: "pn-chart-card__text__heading" }, this.source),
+                h("a", { class: "link--animated", href: this.sourceUrl, rel: this.openInNewWindow ? 'noopener nofollower noreferrer' : null, target: this.openInNewWindow ? '_blank' : null },
+                  "Read the report ",
+                  h("pn-icon", { symbol: "arrow-right" }, " ")))))))));
   }
   static get is() { return "pn-charts-card"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["pn-charts-card.scss"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["pn-charts-card.css"]
-    };
-  }
-  static get properties() {
-    return {
-      "header": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "header",
-        "reflect": false
+  static get originalStyleUrls() { return {
+    "$": ["pn-charts-card.scss"]
+  }; }
+  static get styleUrls() { return {
+    "$": ["pn-charts-card.css"]
+  }; }
+  static get properties() { return {
+    "header": {
+      "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": ""
       },
-      "preamble": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "preamble",
-        "reflect": false
+      "attribute": "header",
+      "reflect": false
+    },
+    "highlight": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
       },
-      "label": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "label",
-        "reflect": false
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
       },
-      "source": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "source",
-        "reflect": false
+      "attribute": "highlight",
+      "reflect": false
+    },
+    "preamble": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
       },
-      "sourceUrl": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "source-url",
-        "reflect": false
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
       },
-      "openInNewWindow": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "open-in-new-window",
-        "reflect": false,
-        "defaultValue": "false"
-      }
-    };
-  }
-  static get states() {
-    return {
-      "someState": {}
-    };
-  }
+      "attribute": "preamble",
+      "reflect": false
+    },
+    "label": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "label",
+      "reflect": false
+    },
+    "source": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "source",
+      "reflect": false
+    },
+    "sourceUrl": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "source-url",
+      "reflect": false
+    },
+    "openInNewWindow": {
+      "type": "boolean",
+      "mutable": false,
+      "complexType": {
+        "original": "boolean",
+        "resolved": "boolean",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "open-in-new-window",
+      "reflect": false,
+      "defaultValue": "false"
+    }
+  }; }
+  static get states() { return {
+    "someState": {}
+  }; }
   static get elementRef() { return "hostElement"; }
 }

package/collection/components/cta/pn-parcel-tracker/pn-parcel-tracker.js

@@ -1,4 +1,4 @@
-import { h, Host, } from '@stencil/core';
+import { Component, Element, h, Host, Listen, Prop, State, } from '@stencil/core';
 export class PnSpotlight {
   constructor() {
     this.formActionUrl = null;
@@ -13,144 +13,139 @@ export class PnSpotlight {
     this.currentWidth = event.target.innerWidth;
   }
   render() {
-    return (h(Host, null, h("div", { class: "pn-parcel-tracker__container" }, h("form", { method: "GET", action: this.formActionUrl }, h("h3", { class: "pn-parcel-tracker__container__heading" }, this.heading), h("pn-marketweb-input", { name: this.inputName, placeholder: this.placeholder }), h("pn-button", { type: "submit", icon: "search", "icon-only": this.currentWidth < 412 }, this.currentWidth >= 412 && this.buttonLabel)))));
+    return (h(Host, null,
+      h("div", { class: "pn-parcel-tracker__container" },
+        h("form", { method: "GET", action: this.formActionUrl },
+          h("h3", { class: "pn-parcel-tracker__container__heading" }, this.heading),
+          h("pn-marketweb-input", { name: this.inputName, placeholder: this.placeholder }),
+          h("pn-button", { type: "submit", icon: "search", "icon-only": this.currentWidth < 412 }, this.currentWidth >= 412 && this.buttonLabel)))));
   }
   static get is() { return "pn-parcel-tracker"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["pn-parcel-tracker.scss"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["pn-parcel-tracker.css"]
-    };
-  }
-  static get properties() {
-    return {
-      "formActionUrl": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "form-action-url",
-        "reflect": false,
-        "defaultValue": "null"
+  static get originalStyleUrls() { return {
+    "$": ["pn-parcel-tracker.scss"]
+  }; }
+  static get styleUrls() { return {
+    "$": ["pn-parcel-tracker.css"]
+  }; }
+  static get properties() { return {
+    "formActionUrl": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
       },
-      "heading": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "heading",
-        "reflect": false,
-        "defaultValue": "'Track your parcel'"
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
       },
-      "buttonLabel": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "button-label",
-        "reflect": false,
-        "defaultValue": "null"
+      "attribute": "form-action-url",
+      "reflect": false,
+      "defaultValue": "null"
+    },
+    "heading": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
       },
-      "locale": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "locale",
-        "reflect": false,
-        "defaultValue": "'en'"
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
       },
-      "placeholder": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "placeholder",
-        "reflect": false,
-        "defaultValue": "'Enter shipment ID'"
+      "attribute": "heading",
+      "reflect": false,
+      "defaultValue": "'Track your parcel'"
+    },
+    "buttonLabel": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
       },
-      "inputName": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "input-name",
-        "reflect": false,
-        "defaultValue": "'shipmentID'"
-      }
-    };
-  }
-  static get states() {
-    return {
-      "currentWidth": {}
-    };
-  }
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "button-label",
+      "reflect": false,
+      "defaultValue": "null"
+    },
+    "locale": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "locale",
+      "reflect": false,
+      "defaultValue": "'en'"
+    },
+    "placeholder": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "placeholder",
+      "reflect": false,
+      "defaultValue": "'Enter shipment ID'"
+    },
+    "inputName": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "input-name",
+      "reflect": false,
+      "defaultValue": "'shipmentID'"
+    }
+  }; }
+  static get states() { return {
+    "currentWidth": {}
+  }; }
   static get elementRef() { return "hostElement"; }
-  static get listeners() {
-    return [{
-        "name": "resize",
-        "method": "handleViewportSizeChange",
-        "target": "window",
-        "capture": false,
-        "passive": true
-      }];
-  }
+  static get listeners() { return [{
+      "name": "resize",
+      "method": "handleViewportSizeChange",
+      "target": "window",
+      "capture": false,
+      "passive": true
+    }]; }
 }