@postnord/pn-marketweb-components 2.4.20 → 2.4.22

package/components/index3.js

@@ -1,70 +1,59 @@
-/**
- * Returns a function, that, as long as it continues to be invoked, will not
- * be triggered. The function will be called after it stops being called for
- * N milliseconds. If `immediate` is passed, trigger the function on the
- * leading edge, instead of the trailing. The function also has a property 'clear' 
- * that is a function which will clear the timer to prevent previously scheduled executions. 
- *
- * @source underscore.js
- * @see http://unscriptable.com/2009/03/20/debouncing-javascript-methods/
- * @param {Function} function to wrap
- * @param {Number} timeout in ms (`100`)
- * @param {Boolean} whether to execute at the beginning (`false`)
- * @api public
- */
-function debounce(func, wait, immediate){
-  var timeout, args, context, timestamp, result;
-  if (null == wait) wait = 100;
+import { c as createCommonjsModule } from './_commonjsHelpers.js';
 
-  function later() {
-    var last = Date.now() - timestamp;
+var classnames = createCommonjsModule(function (module) {
+/*!
+	Copyright (c) 2018 Jed Watson.
+	Licensed under the MIT License (MIT), see
+	http://jedwatson.github.io/classnames
+*/
+/* global define */
 
-    if (last < wait && last >= 0) {
-      timeout = setTimeout(later, wait - last);
-    } else {
-      timeout = null;
-      if (!immediate) {
-        result = func.apply(context, args);
-        context = args = null;
-      }
-    }
-  }
-  var debounced = function(){
-    context = this;
-    args = arguments;
-    timestamp = Date.now();
-    var callNow = immediate && !timeout;
-    if (!timeout) timeout = setTimeout(later, wait);
-    if (callNow) {
-      result = func.apply(context, args);
-      context = args = null;
-    }
+(function () {
 
-    return result;
-  };
+	var hasOwn = {}.hasOwnProperty;
 
-  debounced.clear = function() {
-    if (timeout) {
-      clearTimeout(timeout);
-      timeout = null;
-    }
-  };
-  
-  debounced.flush = function() {
-    if (timeout) {
-      result = func.apply(context, args);
-      context = args = null;
-      
-      clearTimeout(timeout);
-      timeout = null;
-    }
-  };
+	function classNames() {
+		var classes = [];
 
-  return debounced;
-}
-// Adds compatibility for ES modules
-debounce.debounce = debounce;
+		for (var i = 0; i < arguments.length; i++) {
+			var arg = arguments[i];
+			if (!arg) continue;
 
-var debounce_1 = debounce;
+			var argType = typeof arg;
 
-export { debounce_1 as d };
+			if (argType === 'string' || argType === 'number') {
+				classes.push(arg);
+			} else if (Array.isArray(arg)) {
+				if (arg.length) {
+					var inner = classNames.apply(null, arg);
+					if (inner) {
+						classes.push(inner);
+					}
+				}
+			} else if (argType === 'object') {
+				if (arg.toString !== Object.prototype.toString && !arg.toString.toString().includes('[native code]')) {
+					classes.push(arg.toString());
+					continue;
+				}
+
+				for (var key in arg) {
+					if (hasOwn.call(arg, key) && arg[key]) {
+						classes.push(key);
+					}
+				}
+			}
+		}
+
+		return classes.join(' ');
+	}
+
+	if (module.exports) {
+		classNames.default = classNames;
+		module.exports = classNames;
+	} else {
+		window.classNames = classNames;
+	}
+}());
+});
+
+export { classnames as c };

package/components/pn-address-autofill.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface PnAddressAutofill extends Components.PnAddressAutofill, HTMLElement {}
+export const PnAddressAutofill: {
+  prototype: PnAddressAutofill;
+  new (): PnAddressAutofill;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/components/pn-address-autofill.js

@@ -0,0 +1,359 @@
+import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
+import { F as FetchHelper, M as MarketWebContextService } from './FetchHelper.js';
+import { d as debounce_1 } from './index2.js';
+import { d as defineCustomElement$2 } from './pn-marketweb-input2.js';
+
+const pnAddressAutofillCss = "pn-address-autofill pn-marketweb-input{width:50%}pn-address-autofill .input-container-row{display:-ms-flexbox;display:flex;gap:1rem;margin-bottom:1rem}pn-address-autofill .label-container{color:#5E554A;font-size:0.875em;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-align:end;align-items:flex-end}pn-address-autofill .autocomplete-items{position:absolute;border-radius:0.8rem;border:0.1rem solid #5E554A;width:100%;max-height:30rem;overflow-y:auto}pn-address-autofill .autocomplete-items:hover,pn-address-autofill .autocomplete-items :focus{border:0.1rem solid #00A0D6}pn-address-autofill .autocomplete-items div{padding:1.6rem;cursor:pointer;background-color:#fff;border:0.1rem solid transparent}pn-address-autofill .autocomplete-items div:first-child{border-radius:0.8rem 0.8rem 0 0}pn-address-autofill .autocomplete-items div:last-child{border-radius:0 0 0.8rem 0.8rem}pn-address-autofill .autocomplete-items div:hover{background-color:#e0f8ff}pn-address-autofill .autocomplete-items .autocomplete-active{background-color:#e0f8ff}";
+
+const PnAddressAutofill$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.addresscomplete = createEvent(this, "addresscomplete", 7);
+    this.pnInputPostalCode = null;
+    this.pnInputCity = null;
+    this.pnInputStreetAddress = null;
+    this.pnInputStreetNumber = null;
+    this.postalCodeInputField = null;
+    this.streetAddressInputField = null;
+    this.streetNumberInputField = null;
+    this.pnInputHiddenValue = null;
+    this.endpointPath = '/api/location/get-by-location';
+    this._postalCodeProps = null;
+    this._cityProps = null;
+    this._streetAddressProps = null;
+    this._streetNumberProps = null;
+    this.fetchHelper = new FetchHelper('PostalCodeCityAutofill');
+    this.filterStreetNames = (data) => {
+      const addresses = [];
+      this.streetAdressArr = null;
+      data.addresses.forEach(item => {
+        if (item.postalCode.postalCity === this.city && !addresses.includes(item.street)) {
+          addresses.push(item.street);
+        }
+      });
+      this.streetAdressArr = addresses;
+    };
+    this.filterStreetNumbers = (data) => {
+      const streetNumbersResult = [];
+      data.addresses.forEach(item => {
+        if (item.postalCode.postalCode === this.postalCode) {
+          const { numberFrom, numberTo } = item;
+          const from = parseInt(numberFrom);
+          const to = parseInt(numberTo);
+          for (let i = from; i <= to; i++) {
+            const nrString = i.toString();
+            if (!streetNumbersResult.includes(nrString)) {
+              streetNumbersResult.push(i.toString());
+            }
+          }
+        }
+      });
+      this.streetNumberArr = streetNumbersResult;
+    };
+    this.market = null;
+    this.environment = null;
+    this.endpoint = null;
+    this.cache = true;
+    this.countryCode = null;
+    this.postalCodeProps = null;
+    this.cityProps = null;
+    this.streetAddressProps = null;
+    this.streetNumberProps = null;
+    this.streetAdressArr = null;
+    this.streetNumberArr = null;
+    this.city = null;
+    this.postalCode = null;
+    this.streetAddress = null;
+    this.streetNumber = null;
+    this.fullAddress = null;
+  }
+  componentWillLoad() {
+    this.setInitialValues();
+    this._postalCodeProps = this.setProps(this.postalCodeProps);
+    this._cityProps = this.setProps(this.cityProps);
+    this._streetAddressProps = this.setProps(this.streetAddressProps);
+    this._streetNumberProps = this.setProps(this.streetNumberProps);
+  }
+  setProps(props) {
+    if (typeof props === 'string') {
+      return JSON.parse(props);
+    }
+    else {
+      return props;
+    }
+  }
+  componentDidLoad() {
+    this.postalCodeInputField = this.pnInputPostalCode.querySelector('input');
+    this.streetAddressInputField = this.pnInputStreetAddress.querySelector('input');
+    this.streetNumberInputField = this.pnInputStreetNumber.querySelector('input');
+    this.addEventHandlers();
+  }
+  async setInitialValues(href = window.location.href) {
+    var _a;
+    const marketWebContextService = new MarketWebContextService(href);
+    if (!this.environment) {
+      this.environment = await marketWebContextService.getEnvironmentName();
+    }
+    if (!this.endpoint && ((_a = this.environment) === null || _a === void 0 ? void 0 : _a.indexOf('local')) === -1) {
+      this.endpoint = await marketWebContextService.getEndpoint(this.environment, this.market);
+    }
+    if (!this.endpoint) {
+      this.endpoint = '';
+    }
+  }
+  addEventHandlers() {
+    const postalCodeSearch = debounce_1.debounce(this.fetchData.bind(this, this.postalCodeInputField), 1000);
+    this.postalCodeInputField.addEventListener('keyup', postalCodeSearch);
+    this.streetAddressInputField.addEventListener('keyup', this.handleStreetAddressDropdown.bind(this));
+    this.streetNumberInputField.addEventListener('focus', this.handleStreetNumberDropdown.bind(this));
+    this.addFormFieldEvent();
+  }
+  addFormFieldEvent() {
+    const allInputs = this.hostElement.querySelectorAll('input');
+    allInputs.forEach(element => {
+      ['keyup', 'change'].forEach(eventName => {
+        const debounceUpdate = debounce_1.debounce(this.updateHiddenValue.bind(this), 1000);
+        element.addEventListener(eventName, debounceUpdate);
+      });
+    });
+  }
+  updateHiddenValue(e) {
+    if (e.target === this.streetNumberInputField) {
+      this.streetNumber = this.streetNumberInputField.value;
+    }
+    if (this.postalCode && this.city && this.streetAddress && this.streetNumber) {
+      this.fullAddress = `${this.streetAddress} ${this.streetNumber}, ${this.city} ${this.postalCode}`;
+    }
+    else {
+      this.fullAddress = '';
+    }
+    this.addresscomplete.emit(this.fullAddress);
+  }
+  async fetchData(field, e) {
+    var _a;
+    if (e) {
+      e.preventDefault();
+      if (e.key === 'Tab') {
+        if (this.city) {
+          return;
+        }
+      }
+    }
+    let query = '';
+    const isPostalCodeSearch = e && e.target === this.postalCodeInputField;
+    const isStreetAddressSearch = field === this.streetAddressInputField && this.city && this.city.length;
+    const isStreetNumberSearch = field === this.streetNumberInputField && this.city && this.city.length && this.streetAddress && this.streetAddress.length;
+    if (isPostalCodeSearch) {
+      query = this.postalCodeInputField.value;
+      this.streetAdressArr = null;
+      this.streetAddressInputField.value = '';
+      this.streetNumberArr = null;
+      this.streetNumberInputField.value = '';
+      this.city = null;
+      this.streetAddress = null;
+      this.streetNumber = null;
+    }
+    if (isStreetAddressSearch) {
+      query = `${this.streetAddressInputField.value}, ${this.city}`;
+      this.streetNumberArr = null;
+      this.streetNumberInputField.value = '';
+      this.streetNumber = null;
+    }
+    if (isStreetNumberSearch) {
+      this.streetAdressArr = null;
+      query = `${this.streetAddress}, ${this.city}`;
+    }
+    if (query.length > 0) {
+      const endpointBase = this.endpoint.lastIndexOf('/') === this.endpoint.length - 1 ? this.endpoint.substring(0, this.endpoint.length - 1) : this.endpoint;
+      const fetchUrl = `${endpointBase}${this.endpointPath}?countryCode=${this.countryCode}&query=${query}`;
+      const data = (await this.fetchHelper.fetchJson(fetchUrl, {
+        mode: 'cors',
+      }, this.cache));
+      if (data) {
+        if (isPostalCodeSearch) {
+          this.city = data.postalCodes ? (_a = data.postalCodes[0]) === null || _a === void 0 ? void 0 : _a.postalCity : null;
+        }
+        if (isStreetAddressSearch && data.addresses) {
+          this.postalCode = this.postalCodeInputField.value;
+          this.filterStreetNames(data);
+        }
+        if (isStreetNumberSearch && data.addresses) {
+          this.filterStreetNumbers(data);
+        }
+      }
+    }
+  }
+  async handleStreetAddressDropdown(e) {
+    const target = e.target;
+    if (target === this.streetAddressInputField && target.value.length) {
+      if (!this.streetAdressArr || !this.streetAdressArr.length) {
+        await this.fetchData(this.streetAddressInputField, null);
+      }
+    }
+    if (!target.value || !target.value.length) {
+      this.streetAdressArr = null;
+    }
+    if (this.streetAdressArr && this.streetAdressArr.length) {
+      this.autoComplete(e, this.streetAdressArr);
+    }
+  }
+  async handleStreetNumberDropdown(e) {
+    e.preventDefault();
+    const target = e.target;
+    if (target === this.streetNumberInputField) {
+      if (!this.streetNumberArr || !this.streetNumberArr.length) {
+        await this.fetchData(this.streetNumberInputField, null);
+      }
+      if (this.streetNumberArr) {
+        this.autoComplete(e, this.streetNumberArr);
+      }
+    }
+  }
+  autoComplete(e, arr) {
+    const inputField = e.target;
+    if (arr.length < 1) {
+      return;
+    }
+    let currentFocus = 0;
+    inputField.addEventListener('input', () => {
+      const val = inputField.value;
+      this.closeAllLists(inputField);
+      if (!val) {
+        return;
+      }
+      currentFocus = -1;
+      let list = document.createElement('div');
+      list.setAttribute('id', 'autocomplete-list' + inputField.name);
+      list.setAttribute('class', 'autocomplete-items');
+      inputField.parentElement.appendChild(list);
+      for (let i = 0; i < arr.length; i++) {
+        if (arr[i].substring(0, val.length).toUpperCase() == val.toUpperCase()) {
+          let option = document.createElement('div');
+          option.innerHTML = '<strong>' + arr[i].substring(0, val.length) + '</strong>';
+          option.innerHTML += arr[i].substring(val.length);
+          option.innerHTML += "<input type='hidden' value='" + arr[i] + "'>";
+          option.addEventListener('click', clickEvent => {
+            const inputParrent = inputField.closest('pn-marketweb-input');
+            let eventTarget = clickEvent.target;
+            if (eventTarget.nodeName === 'STRONG') {
+              eventTarget = eventTarget.parentElement;
+            }
+            inputParrent.value = eventTarget.getElementsByTagName('input')[0].value;
+            if (inputField === this.streetNumberInputField) {
+              this.streetNumber = inputParrent.value;
+            }
+            if (inputField === this.streetAddressInputField) {
+              this.streetAddress = inputParrent.value;
+            }
+            this.closeAllLists(clickEvent.target);
+            inputField.focus();
+          });
+          list.appendChild(option);
+        }
+      }
+    });
+    inputField.addEventListener('keydown', keydownEvent => {
+      const listElement = document.getElementById('autocomplete-list' + inputField.name);
+      let element;
+      if (listElement) {
+        element = listElement.getElementsByTagName('div');
+      }
+      else {
+        element = listElement;
+      }
+      //If arrow DOWN key is pressed
+      if (keydownEvent.keyCode == 40) {
+        currentFocus++;
+        this.addActive(element, currentFocus);
+      }
+      //If the arrow UP key is pressed
+      if (keydownEvent.keyCode == 38) {
+        currentFocus--;
+        this.addActive(element, currentFocus);
+      }
+      //If the ENTER key is pressed
+      if (keydownEvent.keyCode == 13) {
+        keydownEvent.preventDefault();
+        if (currentFocus > -1) {
+          if (element) {
+            element[currentFocus].click();
+          }
+        }
+      }
+    });
+  }
+  //close all autocomplete lists in the document, except the one passed as an argument:
+  closeAllLists(elmnt) {
+    const lists = document.getElementsByClassName('autocomplete-items');
+    for (let i = 0; i < lists.length; i++) {
+      if (elmnt != lists[i]) {
+        lists[i].parentNode.removeChild(lists[i]);
+      }
+    }
+  }
+  //a function to classify an item as "active":
+  addActive(elmnt, currentFocus) {
+    if (!elmnt)
+      return;
+    this.removeActive(elmnt);
+    if (currentFocus >= elmnt.length)
+      currentFocus = 0;
+    if (currentFocus < 0)
+      currentFocus = elmnt.length - 1;
+    elmnt[currentFocus].classList.add('autocomplete-active');
+  }
+  //a function to remove the "active" class from all autocomplete items:
+  removeActive(elmnt) {
+    for (let i = 0; i < elmnt.length; i++) {
+      elmnt[i].classList.remove('autocomplete-active');
+    }
+  }
+  render() {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s;
+    return (h(Host, { class: "pn-address-autofill" }, ((_a = this._postalCodeProps) === null || _a === void 0 ? void 0 : _a.postalCodeCityLabel) ? (h("div", { class: "label-container" }, h("label", null, `${this._postalCodeProps.postalCodeCityLabel}`))) : null, h("div", { class: "input-container-row" }, h("pn-marketweb-input", { type: "text", name: (_b = this._postalCodeProps) === null || _b === void 0 ? void 0 : _b.postalCodeInputName, required: (_c = this._postalCodeProps) === null || _c === void 0 ? void 0 : _c.postalCodeInputRequired, placeholder: (_d = this._postalCodeProps) === null || _d === void 0 ? void 0 : _d.postalCodeInputPlaceholder, ref: el => (this.pnInputPostalCode = el), autocomplete: "off", helpertext: (_e = this._postalCodeProps) === null || _e === void 0 ? void 0 : _e.postalCodeInputHelpertext }), h("pn-marketweb-input", { type: "text", name: (_f = this._cityProps) === null || _f === void 0 ? void 0 : _f.cityInputName, disabled: true, value: this.city, placeholder: (_g = this._cityProps) === null || _g === void 0 ? void 0 : _g.cityInputPlaceholder, autocomplete: "off", helpertext: (_h = this._cityProps) === null || _h === void 0 ? void 0 : _h.cityInputHelpertext })), ((_j = this._streetAddressProps) === null || _j === void 0 ? void 0 : _j.streetAddressNumberLabel) ? (h("div", { class: "label-container" }, h("label", null, `${this._streetAddressProps.streetAddressNumberLabel}`))) : null, h("div", { class: "input-container-row" }, h("pn-marketweb-input", { type: "text", name: (_k = this._streetAddressProps) === null || _k === void 0 ? void 0 : _k.streetAddressInputName, required: (_l = this._streetAddressProps) === null || _l === void 0 ? void 0 : _l.streetAddressInputRequired, value: this.streetAddress, placeholder: (_m = this._streetAddressProps) === null || _m === void 0 ? void 0 : _m.streetAddressInputPlaceholder, ref: el => (this.pnInputStreetAddress = el), autocomplete: "off", helpertext: (_o = this._streetAddressProps) === null || _o === void 0 ? void 0 : _o.streetAddressInputHelpertext }), h("pn-marketweb-input", { type: "text", name: (_p = this._streetNumberProps) === null || _p === void 0 ? void 0 : _p.streetNumberInputName, required: (_q = this._streetNumberProps) === null || _q === void 0 ? void 0 : _q.streetNumberInputRequired, value: this.streetNumber, placeholder: (_r = this._streetNumberProps) === null || _r === void 0 ? void 0 : _r.streetNumberInputPlaceholder, ref: el => (this.pnInputStreetNumber = el), autocomplete: "off", helpertext: (_s = this._streetNumberProps) === null || _s === void 0 ? void 0 : _s.streetNumberInputHelpertext }))));
+  }
+  get hostElement() { return this; }
+  static get style() { return pnAddressAutofillCss; }
+}, [0, "pn-address-autofill", {
+    "market": [1537],
+    "environment": [1537],
+    "endpoint": [1],
+    "cache": [4],
+    "countryCode": [1, "country-code"],
+    "postalCodeProps": [1, "postal-code-props"],
+    "cityProps": [1, "city-props"],
+    "streetAddressProps": [1, "street-address-props"],
+    "streetNumberProps": [1, "street-number-props"],
+    "streetAdressArr": [32],
+    "streetNumberArr": [32],
+    "city": [32],
+    "postalCode": [32],
+    "streetAddress": [32],
+    "streetNumber": [32],
+    "fullAddress": [32]
+  }]);
+function defineCustomElement$1() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["pn-address-autofill", "pn-marketweb-input"];
+  components.forEach(tagName => { switch (tagName) {
+    case "pn-address-autofill":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, PnAddressAutofill$1);
+      }
+      break;
+    case "pn-marketweb-input":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$2();
+      }
+      break;
+  } });
+}
+defineCustomElement$1();
+
+const PnAddressAutofill = PnAddressAutofill$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { PnAddressAutofill, defineCustomElement };

package/components/pn-animated-tile.js

@@ -1,5 +1,5 @@
 import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
-import { c as classnames } from './index2.js';
+import { c as classnames } from './index3.js';
 
 const pnAnimatedTileCss = "pn-animated-tile .pn-animated-tile__container{position:relative;border-radius:2.4rem;height:56rem;cursor:default}pn-animated-tile .pn-animated-tile__content{position:relative;display:-ms-flexbox;display:flex;height:100%;width:100%;background-color:transparent}pn-animated-tile [slot=side-a],pn-animated-tile [slot=side-b]{position:absolute;-ms-flex-item-align:stretch;align-self:stretch;top:0;left:0;width:100%;height:100%}pn-animated-tile [slot=side-a]{padding:0;opacity:1}pn-animated-tile [slot=side-b]{z-index:-1;padding:2.4rem 2.4rem 7rem 2.4rem;opacity:0;-webkit-transform:translateY(50px);transform:translateY(50px)}pn-animated-tile .pn-animated-tile__toggle{z-index:2;position:absolute;bottom:2.4rem;right:2.4rem;padding:0.8rem;border-radius:50%;border:none;cursor:pointer;background-color:#FFFFFF;-webkit-transition:background-color 0.45s ease-in-out;transition:background-color 0.45s ease-in-out}pn-animated-tile .pn-animated-tile__toggle pn-icon{background-color:#FFFFFF;-webkit-transition:background-color 0.45s ease-in-out, -webkit-transform 0.45s ease-in-out 0.5s;transition:background-color 0.45s ease-in-out, -webkit-transform 0.45s ease-in-out 0.5s;transition:background-color 0.45s ease-in-out, transform 0.45s ease-in-out 0.5s;transition:background-color 0.45s ease-in-out, transform 0.45s ease-in-out 0.5s, -webkit-transform 0.45s ease-in-out 0.5s}pn-animated-tile .pn-animated-tile__toggle:hover{background-color:#e9e6e5}pn-animated-tile .pn-animated-tile__toggle:hover pn-icon{background-color:#e9e6e5}pn-animated-tile .button-tooltip{display:none}.cat-animate [slot=side-a],.cat-animate [slot=side-b]{-webkit-transition:opacity 0.45s ease-in-out, -webkit-transform 0.45s ease-in-out 0.5s;transition:opacity 0.45s ease-in-out, -webkit-transform 0.45s ease-in-out 0.5s;transition:opacity 0.45s ease-in-out, transform 0.45s ease-in-out 0.5s;transition:opacity 0.45s ease-in-out, transform 0.45s ease-in-out 0.5s, -webkit-transform 0.45s ease-in-out 0.5s}.cat-animate.fade [slot=side-a]{opacity:0;z-index:-1}.cat-animate.fade [slot=side-b]{z-index:1;opacity:1;-webkit-transform:translateY(0);transform:translateY(0);-webkit-transition-delay:0.5s;transition-delay:0.5s}.cat-animate.fade--reversed [slot=side-a]{opacity:1;-webkit-transition-delay:0.5s;transition-delay:0.5s}.cat-animate.fade--reversed [slot=side-b]{opacity:0;-webkit-transform:translateY(50px);transform:translateY(50px)}.cat-animate.toggle.animate pn-icon{-webkit-transform:rotate(45deg);transform:rotate(45deg)}[data-cat-theme=white] .pn-animated-tile__container{background-color:#FFFFFF}[data-cat-theme=white] .pn-animated-tile__toggle{background-color:#00A0D6}[data-cat-theme=white] .pn-animated-tile__toggle pn-icon{background-color:#00A0D6}[data-cat-theme=white] .pn-animated-tile__toggle pn-icon svg>path{fill:#FFFFFF}[data-cat-theme=white] .pn-animated-tile__toggle:hover{background-color:#005D92}[data-cat-theme=white] .pn-animated-tile__toggle:hover pn-icon{background-color:#005D92}[data-cat-theme=white] .pn-animated-tile__toggle:focus,[data-cat-theme=white] .pn-animated-tile__toggle:focus-visible{outline-color:#005D92}[data-cat-theme=coral400] .pn-animated-tile__container{background-color:#F06365}[data-cat-theme=coral400] .pn-animated-tile__toggle{background-color:#FFFFFF}[data-cat-theme=coral400] .pn-animated-tile__toggle pn-icon{background-color:#FFFFFF}[data-cat-theme=coral400] .pn-animated-tile__toggle pn-icon svg>path{fill:#F06365}[data-cat-theme=coral400] .pn-animated-tile__toggle:focus,[data-cat-theme=coral400] .pn-animated-tile__toggle:focus-visible{outline-color:#F06365}[data-cat-theme=private] .pn-animated-tile__container{background-color:#00A0D6}[data-cat-theme=private] .pn-animated-tile__toggle{background-color:#FFFFFF}[data-cat-theme=private] .pn-animated-tile__toggle pn-icon{background-color:#FFFFFF}[data-cat-theme=private] .pn-animated-tile__toggle pn-icon svg>path{fill:#00A0D6}[data-cat-theme=private] .pn-animated-tile__toggle:focus,[data-cat-theme=private] .pn-animated-tile__toggle:focus-visible{outline-color:#00A0D6}[data-cat-theme=business] .pn-animated-tile__container{background-color:#0D234B}[data-cat-theme=business] .pn-animated-tile__toggle{background-color:#FFFFFF}[data-cat-theme=business] .pn-animated-tile__toggle pn-icon{background-color:#FFFFFF}[data-cat-theme=business] .pn-animated-tile__toggle pn-icon svg>path{fill:#0D234B}[data-cat-theme=business] .pn-animated-tile__toggle:focus,[data-cat-theme=business] .pn-animated-tile__toggle:focus-visible{outline-color:#0D234B}[data-cat-theme=hybrid] .pn-animated-tile__container{background-color:#e9e6e5}[data-cat-theme=hybrid] .pn-animated-tile__toggle{background-color:#FFFFFF}[data-cat-theme=hybrid] .pn-animated-tile__toggle pn-icon{background-color:#FFFFFF}[data-cat-theme=hybrid] .pn-animated-tile__toggle pn-icon svg>path{fill:#005D92}[data-cat-theme=hybrid] .pn-animated-tile__toggle:focus,[data-cat-theme=hybrid] .pn-animated-tile__toggle:focus-visible{outline-color:#005D92}[data-cat-firstpage-only=true] [slot=side-b],[data-cat-firstpage-only=true] .pn-animated-tile__toggle{display:none}";
 

package/components/pn-dropdown-choice-adds-row.js

@@ -1,5 +1,5 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-import { d as debounce_1 } from './index3.js';
+import { d as debounce_1 } from './index2.js';
 import { d as defineCustomElement$2 } from './pn-marketweb-input2.js';
 
 const pnDropdownChoiceAddsRowCss = "pn-dropdown-choice-adds-row{gap:1rem}pn-dropdown-choice-adds-row .dropdown-choice-form-row{display:-ms-flexbox;display:flex;gap:1rem}pn-dropdown-choice-adds-row .pn-row-select-dropdown{width:50%;margin-bottom:1rem}@media only screen and (max-width: 640px){pn-dropdown-choice-adds-row .pn-row-select-dropdown{width:100%}}pn-dropdown-choice-adds-row .pn-dropdown-choice-table{width:100%;border-spacing:0rem}pn-dropdown-choice-adds-row .pn-dropdown-choice-table thead th{text-align:left;padding:1rem 0.5rem}pn-dropdown-choice-adds-row .pn-dropdown-choice-table thead th label{color:#5E554A;font-size:1.4rem;font-weight:400}pn-dropdown-choice-adds-row .pn-dropdown-choice-table thead .table-header--name{width:40%}pn-dropdown-choice-adds-row .pn-dropdown-choice-table thead .table-header--dropdown{width:40%}pn-dropdown-choice-adds-row .pn-dropdown-choice-table thead .table-header--input{width:10%}pn-dropdown-choice-adds-row .pn-dropdown-choice-table thead .table-header--delete{width:10%}pn-dropdown-choice-adds-row .pn-dropdown-choice-table tbody td{padding:0.5rem}pn-dropdown-choice-adds-row .pn-dropdown-choice-table tbody tr:nth-child(even){background-color:#effbff}pn-dropdown-choice-adds-row .pn-dropdown-choice-table tbody .tr-delete{text-align:center}pn-dropdown-choice-adds-row .pn-dropdown-choice-table tfoot td small{color:#A70707;vertical-align:middle}pn-dropdown-choice-adds-row .pn-dropdown-choice-table tfoot td pn-icon{margin-right:0.25em;vertical-align:middle}";

package/components/pn-marketweb-input2.js

@@ -7,23 +7,23 @@ const PnMarketwebInput = /*@__PURE__*/ proxyCustomElement(class extends HTMLElem
     super();
     this.__registerHost();
     this.disabled = false;
-    this.error = '';
+    this.error = "";
     this.invalid = false;
-    this.helpertext = '';
-    this.label = '';
-    this.placeholder = '';
+    this.helpertext = "";
+    this.label = "";
+    this.placeholder = "";
     this.inputid = `${Math.random()}`;
-    this.name = '';
-    this.required = null;
-    this.type = 'text';
-    this.autocomplete = '';
+    this.name = "";
+    this.required = false;
+    this.type = "text";
+    this.autocomplete = "";
     this.valid = null;
-    this.value = '';
-    this.maxlength = '';
-    this.min = '';
-    this.max = '';
-    this.step = '';
-    this.pattern = '';
+    this.value = "";
+    this.maxlength = "";
+    this.min = "";
+    this.max = "";
+    this.step = "";
+    this.pattern = "";
     this.showText = false;
   }
   getTextMessage() {
@@ -37,8 +37,21 @@ const PnMarketwebInput = /*@__PURE__*/ proxyCustomElement(class extends HTMLElem
     this.showText = !this.showText;
   }
   getInputType() {
-    let types = ['text', 'password', 'url', 'tel', 'search', 'number', 'email', 'date', 'datetime-local', 'month', 'week', 'time'];
-    return (types.includes(this.type) && !this.showText) ? this.type : 'text';
+    let types = [
+      "text",
+      "password",
+      "url",
+      "tel",
+      "search",
+      "number",
+      "email",
+      "date",
+      "datetime-local",
+      "month",
+      "week",
+      "time",
+    ];
+    return types.includes(this.type) && !this.showText ? this.type : "text";
   }
   setVal(e) {
     var _a;
@@ -46,21 +59,19 @@ const PnMarketwebInput = /*@__PURE__*/ proxyCustomElement(class extends HTMLElem
     this.value = target.value;
   }
   getClassNames() {
-    let classNames = 'pn-input ';
+    let classNames = "pn-input ";
     if (this.error.length > 0 || this.invalid)
-      classNames += 'error ';
+      classNames += "error ";
     if (this.valid)
-      classNames += 'valid ';
-    if (this.type === 'password')
-      classNames += 'password ';
+      classNames += "valid ";
+    if (this.type === "password")
+      classNames += "password ";
     if (this.error || this.invalid || this.valid)
-      classNames += 'icon ';
+      classNames += "icon ";
     return classNames;
   }
   render() {
-    return (h(Host, { class: this.getClassNames() }, (this.label || this.maxlength) &&
-      h("div", { class: "label-container" }, this.label && h("label", { htmlFor: this.inputid }, this.label), parseInt(this.maxlength) > 0 && h("label", { class: "char-count", htmlFor: this.inputid }, `${this.value.length}/${this.maxlength}`)), h("div", { class: "input-container" }, h("input", { type: this.getInputType(), value: this.value, id: this.inputid, name: this.name, placeholder: this.placeholder, disabled: this.disabled, autocomplete: this.autocomplete, onInput: (e) => this.setVal(e), maxlength: this.maxlength ? this.maxlength : null, min: (this.min ? this.min : null), max: (this.max ? this.max : null), step: (this.step ? this.step : null), pattern: (this.pattern ? this.pattern : null) }), h("svg", { class: "pn-input-checkmark", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none" }, h("polyline", { class: "checkmark-path", points: "4,12 9,17 20,6", "stroke-width": "3" })), this.type === 'password' && !this.disabled && h("button", { onClick: () => this.toggleTextVisibility() }, "Show")), this.getTextMessage() &&
-      h("small", null, this.error && h("pn-icon", { symbol: "alert-exclamation-circle", small: true, color: "warning" }), this.getTextMessage())));
+    return (h(Host, { class: this.getClassNames() }, (this.label || this.maxlength) && (h("div", { class: "label-container" }, this.label && h("label", { htmlFor: this.inputid }, this.label), parseInt(this.maxlength) > 0 && (h("label", { class: "char-count", htmlFor: this.inputid }, `${this.value.length}/${this.maxlength}`)))), h("div", { class: "input-container" }, h("input", { type: this.getInputType(), value: this.value, id: this.inputid, name: this.name, placeholder: this.placeholder, disabled: this.disabled, required: this.required, autocomplete: this.autocomplete, onInput: (e) => this.setVal(e), maxlength: this.maxlength ? this.maxlength : null, min: this.min ? this.min : null, max: this.max ? this.max : null, step: this.step ? this.step : null, pattern: this.pattern ? this.pattern : null }), h("svg", { class: "pn-input-checkmark", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none" }, h("polyline", { class: "checkmark-path", points: "4,12 9,17 20,6", "stroke-width": "3" })), this.type === "password" && !this.disabled && (h("button", { onClick: () => this.toggleTextVisibility() }, "Show"))), this.getTextMessage() && (h("small", null, this.error && h("pn-icon", { symbol: "alert-exclamation-circle", small: true, color: "warning" }), this.getTextMessage()))));
   }
   static get style() { return pnMarketwebInputCss; }
 }, [0, "pn-marketweb-input", {

package/components/pn-marketweb-sitefooter.js

@@ -1,5 +1,5 @@
 import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
-import { F as FetchHelper, M as MarketWebContextService } from './MarketWebContextService.js';
+import { F as FetchHelper, M as MarketWebContextService } from './FetchHelper.js';
 import { d as defineCustomElement$4 } from './pn-site-footer2.js';
 import { d as defineCustomElement$3 } from './pn-site-footer-col2.js';
 import { d as defineCustomElement$2 } from './pn-swan2.js';
@@ -139,6 +139,7 @@ const PnMarketwebSiteheader = /*@__PURE__*/ proxyCustomElement(class extends HTM
     this.cache = false;
     this.theme = 'default';
     this.backgroundcolor = 'darkestblue';
+    this.showSwan = false;
     this.siteDefinition = undefined;
     this.footerContent = undefined;
     this.i18n = undefined;
@@ -299,11 +300,11 @@ const PnMarketwebSiteheader = /*@__PURE__*/ proxyCustomElement(class extends HTM
   }
   renderSwanComponent() {
     var _a, _b, _c, _d;
-    return (((_b = (_a = this.footerContent) === null || _a === void 0 ? void 0 : _a.swanInfo) === null || _b === void 0 ? void 0 : _b.showSwan) && (h("div", { class: "swan-wrapper" }, h("div", { class: "separator" }), h("pn-swan", { language: this.language, "license-number": (_d = (_c = this.footerContent) === null || _c === void 0 ? void 0 : _c.swanInfo) === null || _d === void 0 ? void 0 : _d.swanLicense }))));
+    return (this.showSwan && (h("div", { class: "swan-wrapper" }, h("div", { class: "separator" }), h("pn-swan", { language: this.language, "license-number": (_b = (_a = this.footerContent) === null || _a === void 0 ? void 0 : _a.swanInfo) === null || _b === void 0 ? void 0 : _b.swanLicense, "link-to": (_d = (_c = this.footerContent) === null || _c === void 0 ? void 0 : _c.swanInfo) === null || _d === void 0 ? void 0 : _d.swanLink }))));
   }
   renderDotComFooter() {
-    var _a, _b, _c, _d, _e, _f;
-    return (h(Host, { language: this.language, market: this.market, environment: this.environment }, h("pn-site-footer", { theme: this.theme, url: (_b = (_a = this.siteDefinition) === null || _a === void 0 ? void 0 : _a.url) !== null && _b !== void 0 ? _b : '' }, this.renderCols(), h("slot", { name: "middle-extra" }), h("slot", { name: "middle-extra-mobile" }), h("div", { slot: "bottom" }, h("div", { class: `social-media ${((_d = (_c = this.footerContent) === null || _c === void 0 ? void 0 : _c.swanInfo) === null || _d === void 0 ? void 0 : _d.showSwan) ? 'social-media--swan' : ''}` }, h("ul", null, this.renderSocialMeidaIconListElements()), this.renderSwanComponent()), h("div", { class: "copyright" }, this.gotData && ((_e = this.footerContent) === null || _e === void 0 ? void 0 : _e.copyrightText) ? h("span", null, this.footerContent.copyrightText) : null, this.gotData && ((_f = this.footerContent) === null || _f === void 0 ? void 0 : _f.bottomLinks) ? h("ul", null, this.renderBottomLinks()) : null)))));
+    var _a, _b, _c, _d;
+    return (h(Host, { language: this.language, market: this.market, environment: this.environment }, h("pn-site-footer", { theme: this.theme, url: (_b = (_a = this.siteDefinition) === null || _a === void 0 ? void 0 : _a.url) !== null && _b !== void 0 ? _b : '' }, this.renderCols(), h("slot", { name: "middle-extra" }), h("slot", { name: "middle-extra-mobile" }), h("div", { slot: "bottom" }, h("div", { class: `social-media ${this.showSwan ? 'social-media--swan' : ''}` }, h("ul", null, this.renderSocialMeidaIconListElements()), this.renderSwanComponent()), h("div", { class: "copyright" }, this.gotData && ((_c = this.footerContent) === null || _c === void 0 ? void 0 : _c.copyrightText) ? h("span", null, this.footerContent.copyrightText) : null, this.gotData && ((_d = this.footerContent) === null || _d === void 0 ? void 0 : _d.bottomLinks) ? h("ul", null, this.renderBottomLinks()) : null)))));
   }
   render() {
     switch (this.theme) {
@@ -328,6 +329,7 @@ const PnMarketwebSiteheader = /*@__PURE__*/ proxyCustomElement(class extends HTM
     "cache": [4],
     "theme": [513],
     "backgroundcolor": [513],
+    "showSwan": [4, "show-swan"],
     "siteDefinition": [32],
     "footerContent": [32],
     "i18n": [32],

package/components/pn-marketweb-siteheader.js

@@ -1,5 +1,5 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-import { F as FetchHelper, M as MarketWebContextService } from './MarketWebContextService.js';
+import { F as FetchHelper, M as MarketWebContextService } from './FetchHelper.js';
 import { s as state, d as defineCustomElement$9 } from './pn-marketweb-siteheader-login-linklist2.js';
 import { d as defineCustomElement$h } from './pn-language-selector2.js';
 import { d as defineCustomElement$g } from './pn-language-selector-option2.js';