@postnord/pn-marketweb-components 2.3.0 → 2.3.2

package/cjs/{MarketWebContextService-392b4585.js → MarketWebContextService-f77b4a5f.js}

@@ -86,80 +86,80 @@ class FetchHelper {
 
 class MarketWebContextService {
   constructor(href = window.location.href) {
-    this.href = "";
-    this.market = "";
-    this.language = "";
-    this.environment = "";
+    this.href = '';
+    this.market = '';
+    this.language = '';
+    this.environment = '';
     this.url = null;
-    this.allowedLanguages = ["sv", "da", "fi", "no", "en", "de"];
-    this.allowedMarkets = ["se", "dk", "fi", "no", "com", "de", "tpl"];
-    this.wwwMarkets = ["se", "dk", "fi", "no", "de", "com"];
-    this.developmentDomains = ["localhost", ".local", "local.", ".dev", "dev."];
+    this.allowedLanguages = ['sv', 'da', 'fi', 'no', 'en', 'de', 'zh', 'fr', 'es'];
+    this.allowedMarkets = ['se', 'dk', 'fi', 'no', 'com', 'de', 'tpl'];
+    this.wwwMarkets = ['se', 'dk', 'fi', 'no', 'de', 'com'];
+    this.developmentDomains = ['localhost', '.local', 'local.', '.dev', 'dev.'];
     this.markets = {
-      "se": {
-        fallbackLanguage: "sv",
+      se: {
+        fallbackLanguage: 'sv',
         integration: 'se-integration.postnord.com',
         preproduction: 'se-preproduction.postnord.com',
         production: 'se-production.postnord.com',
-        live: 'www.postnord.se'
+        live: 'www.postnord.se',
       },
-      "dk": {
-        fallbackLanguage: "da",
+      dk: {
+        fallbackLanguage: 'da',
         integration: 'dk-integration.postnord.com',
         preproduction: 'dk-preproduction.postnord.com',
         production: 'dk-production.postnord.com',
-        live: 'www.postnord.dk'
+        live: 'www.postnord.dk',
       },
-      "fi": {
-        fallbackLanguage: "fi",
+      fi: {
+        fallbackLanguage: 'fi',
         integration: 'fi-integration.postnord.com',
         preproduction: 'fi-preproduction.postnord.com',
         production: 'fi-production.postnord.com',
-        live: 'www.postnord.fi'
+        live: 'www.postnord.fi',
       },
-      "no": {
-        fallbackLanguage: "no",
+      no: {
+        fallbackLanguage: 'no',
         integration: 'no-integration.postnord.com',
         preproduction: 'no-preproduction.postnord.com',
         production: 'no-production.postnord.com',
-        live: 'www.postnord.no'
+        live: 'www.postnord.no',
       },
-      "com": {
-        fallbackLanguage: "en",
+      com: {
+        fallbackLanguage: 'en',
         integration: 'com-integration.postnord.com',
         preproduction: 'com-preproduction.postnord.com',
         production: 'com-production.postnord.com',
-        live: 'www.postnord.com'
+        live: 'www.postnord.com',
       },
-      "de": {
-        fallbackLanguage: "en",
+      de: {
+        fallbackLanguage: 'en',
         integration: 'de-integration.postnord.com',
         preproduction: 'de-preproduction.postnord.com',
         production: 'de-production.postnord.com',
-        live: 'www.postnord.de'
+        live: 'www.postnord.de',
       },
-      "tpl": {
-        fallbackLanguage: "sv",
+      tpl: {
+        fallbackLanguage: 'sv',
         integration: 'tpl-integration.postnord.com',
         preproduction: 'tpl-preproduction.postnord.com',
         production: 'tpl-production.postnord.com',
-        live: 'tpl.postnord.com'
+        live: 'tpl.postnord.com',
       },
     };
-    this.environmentTypes = ["integration", "preproduction", "production"];
+    this.environmentTypes = ['integration', 'preproduction', 'production'];
     this.environments = {
-      "production": {
-        "name": "production",
-        "url": "https://www.postnord.xx/"
+      production: {
+        name: 'production',
+        url: 'https://www.postnord.xx/',
       },
-      "preproduction": {
-        "name": "preproduction",
-        "url": "https://com-preproduction.postnord.com/"
+      preproduction: {
+        name: 'preproduction',
+        url: 'https://com-preproduction.postnord.com/',
+      },
+      integration: {
+        name: 'integration',
+        url: 'https://com-integration.postnord.com/',
       },
-      "integration": {
-        "name": "integration",
-        "url": "https://com-integration.postnord.com/"
-      }
     };
     this.href = href;
     this.url = new URL(this.href);
@@ -178,7 +178,7 @@ class MarketWebContextService {
     await this.resolveMarket();
     return this.market;
   }
-  async getEndpoint(environmentName, marketName = "") {
+  async getEndpoint(environmentName, marketName = '') {
     let url = this.environments.production.url;
     if (this.markets[marketName] && this.markets[marketName][environmentName]) {
       if (environmentName === 'production' && window.location.hostname.indexOf(this.markets[marketName]['live']) === 0) {
@@ -195,18 +195,18 @@ class MarketWebContextService {
       if (environmentName === this.environments.production.name) {
         if (this.wwwMarkets.indexOf(marketName) !== -1) {
           // Handles www.postnord.xx domains
-          url = url.replace(".xx", "." + marketName);
+          url = url.replace('.xx', '.' + marketName);
         }
         else {
-          url = url.replace(".xx", ".com"); // Expect URL to end in postnord.com
-          url = url.replace("www.", marketName + ".");
+          url = url.replace('.xx', '.com'); // Expect URL to end in postnord.com
+          url = url.replace('www.', marketName + '.');
         }
       }
     }
     return url;
   }
   async getEnvironmentName() {
-    const likelyEnvironment = this.environmentTypes.filter(x => this.url.hostname.indexOf(('-' + x)) !== -1)[0];
+    const likelyEnvironment = this.environmentTypes.filter(x => this.url.hostname.indexOf('-' + x) !== -1)[0];
     if (likelyEnvironment) {
       this.environment = likelyEnvironment;
       return this.environment;
@@ -224,17 +224,17 @@ class MarketWebContextService {
   }
   async resolveMarket() {
     // Resolve market from www domains
-    if (this.href.indexOf("//www.") !== -1) {
+    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);
+        console.warn('Unable to define market from www. domain', this.href);
       }
     }
     // Check if domains are on one of the integration/preproduction/production environments urls
-    const likelyEnvironment = this.environmentTypes.filter(x => this.url.hostname.indexOf(('-' + x)) !== -1);
+    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));
@@ -242,14 +242,14 @@ class MarketWebContextService {
         this.market = marketPrefix;
       }
       else {
-        console.warn("Unable to define market from preset environment names", this.href);
+        console.warn('Unable to define market from preset environment names', this.href);
       }
     }
     if (!this.market) {
       if (this.url.hostname.indexOf('www') === -1 && this.url.hostname.indexOf('.postnord.') > 0) {
         const start = this.url.hostname.indexOf('.') !== this.url.hostname.indexOf('.postnord') ? this.url.hostname.indexOf('.') : 0;
         const potentialMarket = this.url.hostname.substring(start, this.url.hostname.indexOf('.postnord.'));
-        // Break down the subdomain to the word closest to .postnord. and take that word. 
+        // Break down the subdomain to the word closest to .postnord. and take that word.
         // Supports sub-sub domain down to 1 level.
         if (this.allowedMarkets.indexOf(potentialMarket) !== -1) {
           this.market = potentialMarket;
@@ -257,7 +257,7 @@ class MarketWebContextService {
         }
       }
     }
-    // Check if we're on a development environment    
+    // 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) {
@@ -265,7 +265,7 @@ class MarketWebContextService {
         this.market = this.allowedMarkets[0];
         return;
       }
-      const urlWithoutDomain = this.href.replace(matchedDevEnvironment, "");
+      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/
@@ -277,7 +277,7 @@ class MarketWebContextService {
       }
       else {
         // We do a similar filter for subpaths but for language this time
-        let filteredMarket = Object.entries(this.markets).filter((item) => {
+        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;
@@ -288,7 +288,7 @@ class MarketWebContextService {
       }
     }
     if (!this.market) {
-      console.info("Was unable to detect market, used fallback");
+      console.info('Was unable to detect market, used fallback');
       this.market = this.allowedMarkets[0];
     }
   }
@@ -298,12 +298,14 @@ class MarketWebContextService {
       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"),
+      (_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) => {
+    potentialLanguages
+      .filter(x => x)
+      .forEach(language => {
       if (this.allowedLanguages.indexOf(language)) {
         this.language = language;
         return;

package/cjs/pn-language-selector_9.cjs.entry.js

@@ -8,24 +8,33 @@ const pnMarketwebSiteheaderStore = require('./pn-marketweb-siteheader-store-e29a
 const index$1 = require('./index-28bbc937.js');
 
 const translations$1 = {
-  'sv': {
-    "heading": "Språk",
+  sv: {
+    heading: 'Språk',
   },
-  'en': {
-    "heading": "Language"
+  en: {
+    heading: 'Language',
   },
-  'da': {
-    "heading": "Sprog"
+  da: {
+    heading: 'Sprog',
   },
-  'no': {
-    "heading": "Språk"
+  no: {
+    heading: 'Språk',
   },
-  'fi': {
-    "heading": "Kieli"
+  fi: {
+    heading: 'Kieli',
+  },
+  de: {
+    heading: 'Sprache',
+  },
+  zh: {
+    heading: '语言',
+  },
+  fr: {
+    heading: 'Langue',
+  },
+  es: {
+    heading: 'Idioma',
   },
-  'de': {
-    "heading": "Sprache"
-  }
 };
 
 const pnLanguageSelectorCss = "pn-language-selector{max-height:5.2rem}pn-language-selector pn-nav-dropdown:not([data-open]) .nav-dropdown-content-container,pn-language-selector pn-nav-dropdown[data-open=false] .nav-dropdown-content-container{display:none}pn-language-selector pn-nav-dropdown{display:block}.languageselector{position:relative}.languageselector-togglebtn{cursor:pointer;border:0;padding:0.64rem 0;background-color:#FFFFFF;color:#005D92;font-size:1.6rem}.languageselector-togglebtn:hover,.languageselector-togglebtn:focus,.languageselector-togglebtn:active{color:#0D234B;text-decoration:underline}.languageselector-togglebtn svg{width:1.9rem;height:1.9rem}.languageselector-title{padding:0.8rem 1.6rem;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}.languageselector-list{margin:0;padding:0;list-style:none}";

package/cjs/pn-marketweb-sitefooter.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-e3e27c79.js');
-const MarketWebContextService = require('./MarketWebContextService-392b4585.js');
+const MarketWebContextService = require('./MarketWebContextService-f77b4a5f.js');
 
 const getSocialMediaIconsByType = (linkType = '', fill = '#005D92') => {
   switch (linkType) {

package/cjs/pn-marketweb-siteheader.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-e3e27c79.js');
-const MarketWebContextService = require('./MarketWebContextService-392b4585.js');
+const MarketWebContextService = require('./MarketWebContextService-f77b4a5f.js');
 const pnMarketwebSiteheaderStore = require('./pn-marketweb-siteheader-store-e29ad918.js');
 require('./index-28bbc937.js');
 

package/cjs/pn-proxio-findprice.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index$1 = require('./index-e3e27c79.js');
-const MarketWebContextService = require('./MarketWebContextService-392b4585.js');
+const MarketWebContextService = require('./MarketWebContextService-f77b4a5f.js');
 const index = require('./index-28bbc937.js');
 
 const translations = {
@@ -254,8 +254,9 @@ let PnProxioFindPrice = class {
   }
   init() {
     this.setState();
-    this.getDataSource();
-    this.fetchData();
+    this.fetchData().then(() => {
+      this.getDataSource();
+    });
   }
   async getDataSource() {
     try {
@@ -275,7 +276,7 @@ let PnProxioFindPrice = class {
     //const fetchUrl = `http://localhost:51444/api/proxio/price-list-groups?market=${this.market}&language=${this.language}&cached=${this.cache}`;
     const data = await this.fetchHelper.fetchJson(fetchUrl, {
       'mode': 'cors',
-    }, this.cache, this.onFetchData.bind(this));
+    }, false, this.onFetchData.bind(this));
     if (data) {
       this.data.proxioProducts = data;
     }
@@ -295,9 +296,14 @@ let PnProxioFindPrice = class {
   }
   filterItems() {
     var _a;
-    if (!this.data) {
-      console.log('Data has not yet been loaded');
-      return;
+    if (!this.data || !this.data.proxioProducts) {
+      console.log('Data has not yet been loaded, fetching again');
+      this.fetchData().then(() => {
+        if (!this.data) {
+          console.log('Data could not be loaded');
+          return;
+        }
+      });
     }
     const sizeItemData = this.data.proxioProducts.filter(item => {
       return item.proxioProduct.productWeightGroupList.some(weightGroup => {

package/cjs/pn-proxio-pricegroup.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-e3e27c79.js');
-const MarketWebContextService = require('./MarketWebContextService-392b4585.js');
+const MarketWebContextService = require('./MarketWebContextService-f77b4a5f.js');
 const translations = require('./translations-aef1609e.js');
 
 const pnProxioPricegroupCss = "pn-proxio-pricegroup div.proxio-pricegroup-container{max-width:99.4rem}pn-proxio-pricegroup div.weightcontainer{margin:2.8rem 0}pn-proxio-pricegroup div.weightvaluecontainer{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-line-pack:center;align-content:center;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-align:start;align-items:flex-start}pn-proxio-pricegroup div.weightvaluecontainer pn-button{-webkit-transform:translateY(-0.4rem);transform:translateY(-0.4rem)}pn-proxio-pricegroup div.weightvaluecontainer pn-button button::before{display:none}pn-proxio-pricegroup div.weightradios{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-align:center;align-items:center;-ms-flex-wrap:wrap;flex-wrap:wrap;color:#005D92;width:80%;margin:0 3.6rem;position:relative;width:0%}pn-proxio-pricegroup div.weightradios[data-carousel-container-position=end50]{width:45%;margin-left:auto;margin-right:3.6rem}@media screen and (max-width: 48em){pn-proxio-pricegroup div.weightradios[data-carousel-container-position=end50]{width:40%}}pn-proxio-pricegroup div.weightradios[data-carousel-container-position=end75]{width:65%;margin-left:auto;margin-right:3.6rem}@media screen and (max-width: 48em){pn-proxio-pricegroup div.weightradios[data-carousel-container-position=end75]{margin-right:auto}}pn-proxio-pricegroup div.weightradios[data-carousel-container-position=start50]{width:45%;margin-right:auto;margin-left:3.6rem}@media screen and (max-width: 48em){pn-proxio-pricegroup div.weightradios[data-carousel-container-position=start50]{width:40%}}pn-proxio-pricegroup div.weightradios[data-carousel-container-position=start75]{width:65%;margin-right:auto;margin-left:3.6rem}@media screen and (max-width: 48em){pn-proxio-pricegroup div.weightradios[data-carousel-container-position=start75]{margin-left:auto}}pn-proxio-pricegroup div.weightradios[data-carousel-container-position=default]{-ms-flex:0 0 auto;flex:0 0 auto;width:80%}@media screen and (max-width: 48em){pn-proxio-pricegroup div.weightradios[data-carousel-container-position=default]{width:65%}}pn-proxio-pricegroup div.weightdata{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;-ms-flex-line-pack:center;align-content:center;-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-flex-pack:justify;justify-content:space-between;gap:1.2rem;min-width:4rem;cursor:pointer}pn-proxio-pricegroup div.weightdata label{font-size:1.4rem;cursor:pointer}pn-proxio-pricegroup div.weightdata[data-carousel-position=\"0\"]{font-size:2rem;font-weight:700}@media screen and (max-width: 48em){pn-proxio-pricegroup div.weightdata[data-carousel-position=\"2\"],pn-proxio-pricegroup div.weightdata[data-carousel-position=\"-2\"]{display:none}}pn-proxio-pricegroup div.weightdata[data-carousel-position=outside]{display:none}pn-proxio-pricegroup div.weightdata input[type=radio]{-webkit-appearance:none;-moz-appearance:none;width:1.2rem;height:1.2rem;background-color:#005D92;border-radius:50%;margin:0;cursor:pointer}pn-proxio-pricegroup div.weightdata input[type=radio]:checked{z-index:1;-webkit-transform:translateY(-0.1rem);transform:translateY(-0.1rem);height:1.4rem;width:1.4rem;-webkit-box-shadow:0 0 0 0.3rem #FFFFFF, 0 0 0 0.4rem #005D92;box-shadow:0 0 0 0.3rem #FFFFFF, 0 0 0 0.4rem #005D92}pn-proxio-pricegroup div.weightline{width:100%;background-color:#F3F2F2;z-index:-1;height:0.8rem;-webkit-transform:translateX(2.1rem) translateY(1.32rem);transform:translateX(2.1rem) translateY(1rem);border-radius:2rem;margin-right:3.5rem}pn-proxio-pricegroup pn-button[disabled=disabled]{opacity:0.2}pn-proxio-pricegroup pn-button[disabled=disabled] button{cursor:default}pn-proxio-pricegroup pn-button[disabled=disabled] button.pn-button-light .pn-button-bg:after{background-color:#FFFFFF}pn-proxio-pricegroup pn-button[disabled=disabled] button[data-tooltip-open]:before{display:none}pn-proxio-pricegroup pn-button button div.button-tooltip{display:none}pn-proxio-pricegroup pn-button button:focus .pn-button-bg{-webkit-box-shadow:none;box-shadow:none}";

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

@@ -26,6 +26,7 @@ export default {
         { name: 'Danish', value: 'da' },
         { name: 'Finnish', value: 'fi' },
         { name: 'Norwegian', value: 'no' },
+        { name: 'Chinese', value: 'zh' },
       ],
     },
     endpoint: {
@@ -475,8 +476,8 @@ const DotComSiteHeaderTemplate = ({ ...args }) => {
 
 export const DotComSiteHeader = DotComSiteHeaderTemplate.bind({});
 DotComSiteHeader.args = {
-  market: 'se',
-  language: 'sv',
+  market: 'com',
+  language: 'zh',
   endpoint: 'https://com-integration.postnord.com',
   name: 'DotCom User',
   loggedin: true,

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

@@ -1,20 +1,29 @@
 export const translations = {
-  'sv': {
-    "heading": "Språk",
+  sv: {
+    heading: 'Språk',
   },
-  'en': {
-    "heading": "Language"
+  en: {
+    heading: 'Language',
   },
-  'da': {
-    "heading": "Sprog"
+  da: {
+    heading: 'Sprog',
   },
-  'no': {
-    "heading": "Språk"
+  no: {
+    heading: 'Språk',
   },
-  'fi': {
-    "heading": "Kieli"
+  fi: {
+    heading: 'Kieli',
+  },
+  de: {
+    heading: 'Sprache',
+  },
+  zh: {
+    heading: '语言',
+  },
+  fr: {
+    heading: 'Langue',
+  },
+  es: {
+    heading: 'Idioma',
   },
-  'de': {
-    "heading": "Sprache"
-  }
 };

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

@@ -42,8 +42,9 @@ export class PnProxioFindPrice {
   }
   init() {
     this.setState();
-    this.getDataSource();
-    this.fetchData();
+    this.fetchData().then(() => {
+      this.getDataSource();
+    });
   }
   async getDataSource() {
     try {
@@ -63,7 +64,7 @@ export class PnProxioFindPrice {
     //const fetchUrl = `http://localhost:51444/api/proxio/price-list-groups?market=${this.market}&language=${this.language}&cached=${this.cache}`;
     const data = await this.fetchHelper.fetchJson(fetchUrl, {
       'mode': 'cors',
-    }, this.cache, this.onFetchData.bind(this));
+    }, false, this.onFetchData.bind(this));
     if (data) {
       this.data.proxioProducts = data;
     }
@@ -83,9 +84,14 @@ export class PnProxioFindPrice {
   }
   filterItems() {
     var _a;
-    if (!this.data) {
-      console.log('Data has not yet been loaded');
-      return;
+    if (!this.data || !this.data.proxioProducts) {
+      console.log('Data has not yet been loaded, fetching again');
+      this.fetchData().then(() => {
+        if (!this.data) {
+          console.log('Data could not be loaded');
+          return;
+        }
+      });
     }
     const sizeItemData = this.data.proxioProducts.filter(item => {
       return item.proxioProduct.productWeightGroupList.some(weightGroup => {