@postnord/pn-marketweb-components 2.2.0 → 2.2.2

package/collection/components/layout-components/pn-marketweb-siteheader/pn-marketweb-siteheader.css

@@ -299,9 +299,6 @@ header[data-header-theme=dotcom] > pn-marketweb-siteheader > header nav.mainnav
     top: 6.4em;
   }
 }
-header[data-header-theme=dotcom] > pn-marketweb-siteheader > header nav.mainnav a {
-  color: #FFFFFF;
-}
 header[data-header-theme=dotcom] > pn-marketweb-siteheader > header nav.mainnav pn-mainnav-level [slot=top].siteheader-menu-top pn-marketweb-siteheader-search {
   padding-bottom: 0.5rem;
   background-color: #0D234B;
@@ -360,7 +357,7 @@ header[data-header-theme=dotcom] > pn-marketweb-siteheader > header nav.mainnav
   background-color: #00A0D6;
   text-decoration: none;
 }
-header[data-header-theme=dotcom] > pn-marketweb-siteheader > header nav.mainnav pn-marketweb-siteheader-login-linklist ul li a {
+header[data-header-theme=dotcom] > pn-marketweb-siteheader > header nav.mainnav pn-marketweb-siteheader-login-linklist ul li a:not(.pn-button) {
   color: #005D92;
 }
 header[data-header-theme=dotcom] > pn-marketweb-siteheader > header [data-level="1"] pn-mainnav-link pn-icon.first-level_arrow svg > path {

package/collection/components/layout-components/pn-marketweb-siteheader/pn-marketweb-siteheader.stories.js

@@ -479,7 +479,7 @@ DotComSiteHeader.args = {
   language: 'sv',
   endpoint: 'https://com-integration.postnord.com',
   name: 'DotCom User',
-  loggedin: false,
+  loggedin: true,
   loginInfo: encodeURIComponent('Hello i am a <a href="#">link!</a>'),
   unified: true,
   showProfileSelection: false,

package/collection/components/widgets/pn-proxio-findprice/data.js

@@ -6,34 +6,56 @@ const sizeCategories = [
 ];
 
 const weights = {
-"S": [
-  { name: "50 g",   abbreviation: 'g', value: 50 },
-  { name: "100 g",  abbreviation: 'g', value: 100 },
-  { name: "250 g",  abbreviation: 'g', value: 250 },
-  { name: "500 g",  abbreviation: 'g', value: 500 },
-  { name: "1 kg",   abbreviation: 'kg', value: 1000 },
-  { name: "2 kg",   abbreviation: 'kg', value: 2000 },
-],
-"M": [
-  { name: "1 kg",   abbreviation: 'kg', value: 1000 },
-  { name: "2 kg",   abbreviation: 'kg', value: 2000},
-  { name: "3 kg",   abbreviation: 'kg', value: 3000 },
-  { name: "5 kg",   abbreviation: 'kg', value: 5000 },
-  { name: "10 kg",  abbreviation: 'kg', value: 10000 },
-  { name: "15 kg",  abbreviation: 'kg', value: 15000 },
-  { name: "20 kg",  abbreviation: 'kg', value: 20000 },    
-],
-"L": [
-  { name: "3 kg",   abbreviation: 'kg', value: 3000 },
-  { name: "5 kg",   abbreviation: 'kg', value: 5000 },
-  { name: "10 kg",  abbreviation: 'kg', value: 10000 },
-  { name: "15 kg",  abbreviation: 'kg', value: 15000 },
-  { name: "20 kg",  abbreviation: 'kg', value: 20000 }, 
-]
+  "se": {
+    "S": [
+      { name: "50 g", abbreviation: 'g', value: 50 },
+      { name: "100 g", abbreviation: 'g', value: 100 },
+      { name: "250 g", abbreviation: 'g', value: 250 },
+      { name: "500 g", abbreviation: 'g', value: 500 },
+      { name: "1 kg", abbreviation: 'kg', value: 1000 },
+      { name: "2 kg", abbreviation: 'kg', value: 2000 },
+    ],
+    "M": [
+      { name: "1 kg", abbreviation: 'kg', value: 1000 },
+      { name: "2 kg", abbreviation: 'kg', value: 2000 },
+      { name: "3 kg", abbreviation: 'kg', value: 3000 },
+      { name: "5 kg", abbreviation: 'kg', value: 5000 },
+      { name: "10 kg", abbreviation: 'kg', value: 10000 },
+      { name: "15 kg", abbreviation: 'kg', value: 15000 },
+      { name: "20 kg", abbreviation: 'kg', value: 20000 },
+    ],
+    "L": [
+      { name: "3 kg", abbreviation: 'kg', value: 3000 },
+      { name: "5 kg", abbreviation: 'kg', value: 5000 },
+      { name: "10 kg", abbreviation: 'kg', value: 10000 },
+      { name: "15 kg", abbreviation: 'kg', value: 15000 },
+      { name: "20 kg", abbreviation: 'kg', value: 20000 },
+    ]
+  },
+  "dk": {
+    "S": [
+      { name: "50 g", abbreviation: 'g', value: 50 },
+      { name: "100 g", abbreviation: 'g', value: 100 },
+      { name: "250 g", abbreviation: 'g', value: 250 },
+      { name: "500 g", abbreviation: 'g', value: 500 },
+      { name: "1 kg", abbreviation: 'kg', value: 1000 },
+      { name: "2 kg", abbreviation: 'kg', value: 2000 },
+    ],
+    "M": [],
+    "L": [
+      { name: "2 kg", abbreviation: 'kg', value: 2000 },
+      { name: "5 kg", abbreviation: 'kg', value: 5000 },
+      { name: "10 kg", abbreviation: 'kg', value: 10000 },
+      { name: "15 kg", abbreviation: 'kg', value: 15000 },
+      { name: "20 kg", abbreviation: 'kg', value: 20000 },
+      { name: "25 kg", abbreviation: 'kg', value: 25000 },
+      { name: "30 kg", abbreviation: 'kg', value: 30000 },
+      { name: "35 kg", abbreviation: 'kg', value: 35000 },
+    ]
+  }
 };
 
 
-
 const RealValues =
   { 
     WebUrl:  "https://riktigavykort.postnord.se/sv",   

package/collection/components/widgets/pn-proxio-findprice/pn-proxio-findprice-store.js

@@ -17,7 +17,9 @@ const { state, onChange } = createStore({
     servicePointLink: '',
     realPostcard: '',
     realPostcardMobile: '',
-    ombudHeader: ''
+    ombudHeader: '',
+    noResultMessage: '',
+    clearFilterButton: ''
   },
   market: {
     currency: "",

package/collection/components/widgets/pn-proxio-findprice/pn-proxio-findprice-translations.js

@@ -18,7 +18,9 @@ export const translations = {
     'ombudHeader': 'Köp via ombud',
     "from": "Från ",
     "labelMaxDimensionsRoll": "Rulle",
-    "labelMaxDimensions": "Maxmått"
+    "labelMaxDimensions": "Maxmått",
+    'noResultMessage': 'Inga produkter matchar dina kriterier',
+    'clearFilterButton': 'Rensa alla filter'
   },
   'en': {
     'componentheading': 'Our prices and terms and conditions for domestic shipments for you as a direct paying customer',
@@ -39,7 +41,9 @@ export const translations = {
     'ombudHeader': 'Purchase by agent',
     "from": "From ",
     "labelMaxDimensionsRoll": "Roll",
-    "labelMaxDimensions": "Maximum dimensions"
+    "labelMaxDimensions": "Maximum dimensions",
+    'noResultMessage': 'No products match your criterias',
+    'clearFilterButton': 'Clear all filters'
   },
   'da': {
     'componentheading': 'Vad vill du skicka?',
@@ -59,7 +63,9 @@ export const translations = {
     'ombudHeader': 'Køb af agent',
     "from": "Från ",
     "labelMaxDimensionsRoll": "Rulle",
-    "labelMaxDimensions": "Maks måle"
+    "labelMaxDimensions": "Maks måle",
+    'noResultMessage': 'Ingen produkter matcher dine kriterier',
+    'clearFilterButton': 'Ryd alle filtre'
   },
   'no': {
     'componentheading': 'Vad vill du skicka?',
@@ -70,6 +76,8 @@ export const translations = {
     'maxmeasurementlabel': 'Maks volum',
     'senddirectcta': 'Buy shipping in Send Direct',
     'stampshopcta': 'Order home stamps from the webshop',
+    'noResultMessage': 'No products match your criterias',
+    'clearFilterButton': 'Clear all filters'
   },
   'fi': {
     'componentheading': 'Vad vill du skicka?',
@@ -80,6 +88,8 @@ export const translations = {
     'maxmeasurementlabel': 'Max äänenvoimakkuus',
     'senddirectcta': 'Buy shipping in Send Direct',
     'stampshopcta': 'Order home stamps from the webshop',
+    'noResultMessage': 'No products match your criterias',
+    'clearFilterButton': 'Clear all filters'
   }
 };
 export const markets = {

package/collection/components/widgets/pn-proxio-findprice/pn-proxio-findprice.css

@@ -54,6 +54,16 @@ pn-proxio-findprice .resultHeading {
   font-weight: bold;
   margin-bottom: 2em;
 }
+pn-proxio-findprice .findprice__clear-all-filters {
+  display: flex;
+  justify-content: center;
+  margin: 2.4rem;
+  color: #005D92;
+}
+pn-proxio-findprice .findprice__clear-all-filters .findprice__clear-all-filters__btn {
+  width: fit-content;
+  cursor: pointer;
+}
 pn-proxio-findprice .sizecategory {
   margin-top: 1em;
   margin-bottom: 3rem;

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

@@ -14,6 +14,7 @@ export class PnProxioFindPrice {
     this.endpoint = null;
     this.language = "da";
     this.market = "dk";
+    this.showMedium = false;
     this.cache = false;
     this.filteredItems = [];
     this.weight = { value: 0, name: "" };
@@ -46,7 +47,6 @@ export class PnProxioFindPrice {
   }
   async getDataSource() {
     try {
-      //for keeping small value preselected
       this.sizecategory = sizeCategories.filter(x => x.value === "S")[0];
       this.filterItems();
     }
@@ -82,6 +82,7 @@ export class PnProxioFindPrice {
     }
   }
   filterItems() {
+    var _a;
     if (!this.data) {
       console.log('Data has not yet been loaded');
       return;
@@ -107,8 +108,45 @@ export class PnProxioFindPrice {
         });
       });
     }
+    (_a = weightFilteredData === null || weightFilteredData === void 0 ? void 0 : weightFilteredData.sort((a, b) => {
+      var _a, _b, _c, _d, _e, _f, _g, _h;
+      let aIndex = a.proxioProduct.productWeightGroupList.findIndex(weightGroup => weightGroup.item1 === comparisonWeight);
+      if (aIndex < 0)
+        aIndex = 0;
+      let aValue = (_d = (_c = (_b = (_a = a === null || a === void 0 ? void 0 : a.proxioProduct) === null || _a === void 0 ? void 0 : _a.weightAndPriceList[aIndex]) === null || _b === void 0 ? void 0 : _b.item2) === null || _c === void 0 ? void 0 : _c.toLowerCase()) !== null && _d !== void 0 ? _d : "";
+      let aNumber = this.parseFloatFromString(aValue);
+      let bIndex = b.proxioProduct.productWeightGroupList.findIndex(weightGroup => weightGroup.item1 === comparisonWeight);
+      if (bIndex < 0)
+        bIndex = 0;
+      let bValue = (_h = (_g = (_f = (_e = b === null || b === void 0 ? void 0 : b.proxioProduct) === null || _e === void 0 ? void 0 : _e.weightAndPriceList[bIndex]) === null || _f === void 0 ? void 0 : _f.item2) === null || _g === void 0 ? void 0 : _g.toLowerCase()) !== null && _h !== void 0 ? _h : "";
+      let bNumber = this.parseFloatFromString(bValue);
+      if (aNumber && bNumber) {
+        return aNumber - bNumber;
+      }
+      if (aNumber < bNumber) {
+        return -1;
+      }
+      if (aNumber > bNumber) {
+        return 1;
+      }
+      return 0;
+    })) !== null && _a !== void 0 ? _a : [];
     this.filteredItems = weightFilteredData;
   }
+  parseFloatFromString(text) {
+    var _a;
+    return parseFloat((_a = text === null || text === void 0 ? void 0 : text.replace(/[^\d\.\,]*/g, '')) !== null && _a !== void 0 ? _a : 100000);
+  }
+  resetFilters() {
+    this.weight = { value: 0, name: "" };
+    this.sizecategory = sizeCategories.filter(x => x.value === "S")[0];
+    this.weightvalue = 0;
+  }
+  getWeights() {
+    var _a;
+    let marketWeightsArray = (_a = weights[this.market]) !== null && _a !== void 0 ? _a : { "S": [], "M": [], "L": [] };
+    return marketWeightsArray[this.sizecategory.unit];
+  }
   render() {
     return (h("div", { class: "findprice-form" },
       h("div", { class: "findprice-form-wrapper" },
@@ -121,27 +159,31 @@ export class PnProxioFindPrice {
                 h("img", { class: "firstCell", src: person })),
               h("td", null,
                 h("img", { src: S })),
-              h("td", null,
-                h("img", { src: M })),
+              this.showMedium ? h("td", null,
+                h("img", { src: M })) : null,
               h("td", null,
                 h("img", { src: L }))),
             h("tr", null,
               h("td", null),
-              sizeCategories.map((sizeCategory) => (h("td", null,
+              sizeCategories.map((sizeCategory) => (!this.showMedium && sizeCategory.value === "M" ? null : (h("td", null,
                 h("pn-radio-button", { id: 'findpricecategory-' + sizeCategory.value, radioid: sizeCategory.value, value: sizeCategory.value, name: "sizecategory", checked: sizeCategory.value === this.sizecategory.value, onChange: () => {
                     this.sizecategory = sizeCategories.filter(x => x.value === sizeCategory.value)[0];
                     this.weight = { value: 0, name: "" };
                     this.weightvalue = this.weight.value;
-                  } }))))))),
+                  } })))))))),
         h("h4", { class: "findprice__heading findprice__subheading" }, state.i18n.weightheading),
-        (this.sizecategory.value && weights[this.sizecategory.unit]) ? (h("div", { class: "weightoption" }, h("div", { class: "weightoption-content" }, weights[this.sizecategory.unit].map((wght) => (h("pn-choice-button", { id: 'findpriceweight-' + wght.value, choiceid: this.sizecategory.value + wght.value, name: "weight", type: "radio", value: (!this.weight.value) ? 0 : weights[this.sizecategory.unit].findIndex((x) => x.value === this.weightvalue), checked: wght.value === this.weight.value, onChange: () => {
-            this.weight = weights[this.sizecategory.unit].filter(x => x.value === wght.value)[0];
+        (this.sizecategory.value && this.getWeights()) ? (h("div", { class: "weightoption" }, h("div", { class: "weightoption-content" }, this.getWeights().map((wght) => (h("pn-choice-button", { id: 'findpriceweight-' + wght.value, choiceid: this.sizecategory.value + wght.value, name: "weight", type: "radio", value: (!this.weight.value) ? 0 : this.getWeights().findIndex((x) => x.value === this.weightvalue), checked: wght.value === this.weight.value, onChange: () => {
+            this.weight = this.getWeights().filter(x => x.value === wght.value)[0];
             this.weightvalue = this.weight.value;
-          } }, wght.name)))))) : null),
+          } }, wght.name)))))) : null,
+        h("div", { class: 'findprice__clear-all-filters', role: 'button' },
+          h("div", { class: 'findprice__clear-all-filters__btn', onClick: () => this.resetFilters() },
+            h("pn-icon", { symbol: "trash-can", color: "blue700" }),
+            h("span", { class: 'clear-all-filters__text' }, state.i18n.clearFilterButton)))),
       (this.filteredItems && this.filteredItems.length > 0) ? (h("div", { class: "resultlist" },
         (state.i18n.resultlistheading) ? (h("div", { class: "resultHeading" }, state.i18n.resultlistheading)) : null,
         this.filteredItems.map((item) => (h("div", null,
-          h("pn-proxio-findprice-result", { activeweight: this.weight.value, item: item })))))) : null));
+          h("pn-proxio-findprice-result", { activeweight: this.weight.value, item: item })))))) : ((this.weightvalue !== 0) ? (h("h4", { class: "resultHeading" }, state.i18n.noResultMessage)) : null)));
   }
   static get is() { return "pn-proxio-findprice"; }
   static get originalStyleUrls() { return {
@@ -205,6 +247,24 @@ export class PnProxioFindPrice {
       "reflect": false,
       "defaultValue": "\"dk\""
     },
+    "showMedium": {
+      "type": "boolean",
+      "mutable": false,
+      "complexType": {
+        "original": "boolean",
+        "resolved": "boolean",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "show-medium",
+      "reflect": false,
+      "defaultValue": "false"
+    },
     "cache": {
       "type": "boolean",
       "mutable": false,