@postnord/pn-marketweb-components 1.0.49-beta4 → 2.0.1

package/custom-elements/index.js

@@ -1,4 +1,4 @@
-import { HTMLElement, h, Host, createEvent, getRenderingRef, forceUpdate, proxyCustomElement } from '@stencil/core/internal/client';
+import { HTMLElement, h, Host, getRenderingRef, forceUpdate, createEvent, proxyCustomElement } from '@stencil/core/internal/client';
 export { setAssetPath, setPlatformOptions } from '@stencil/core/internal/client';
 
 const pnBonusProgressbarCss = "pn-bonus-progressbar{width:100%}.bonusprogressbar-top{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}.bonusprogressbar-top-icon{border-radius:100%;height:5rem;width:5rem;padding:1rem;display:-ms-inline-flexbox;display:inline-flex;margin-right:1em;margin-left:0.5em;background-color:#E0F8FF}[theme=red] .bonusprogressbar-top-icon{background-color:#FBC2C1}.bonusprogressbar-top-icon pn-icon svg{width:100%;height:100%}.bonusprogressbar-top-percentage{margin-left:auto;padding:0.5em}.bonusprogressbar-wrapper{position:relative;display:-ms-flexbox;display:flex;min-height:5em;-ms-flex-align:center;align-items:center}.bonusprogressbar-currentlevel{position:absolute}.bonusprogressbar-progress[value]{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:1.7rem;border:0.1rem solid #00A0D6;border-radius:1.7rem;padding:0;margin:0;overflow:hidden}[theme=red] .bonusprogressbar-progress[value]{border-color:#F06365}.bonusprogressbar-progress[value]::-webkit-progress-bar{border:0;border-radius:1.7rem;margin:0;padding:0;background:#E0F8FF}[theme=red] .bonusprogressbar-progress[value]::-webkit-progress-bar{background:#FDEFEE}.bonusprogressbar-progress[value]::-webkit-progress-value{margin:0;padding:0;border-radius:1.7rem;background:#00A0D6}[theme=red] .bonusprogressbar-progress[value]::-webkit-progress-value{background:#F06365}";
@@ -217,75 +217,10 @@ let PnFilterCheckbox$1 = class extends HTMLElement {
   static get style() { return pnFilterCheckboxCss; }
 };
 
-const pnFilterSearchCss = ":host{display:-ms-inline-flexbox;display:inline-flex}:host>pn-button{margin-left:0.35em}:host>pn-button button .pn-button-bg{-webkit-transition:width 0.2s cubic-bezier(0.7, 0, 0.3, 1) 0.2s, background 0.1s, left 0.2s, -webkit-box-shadow 0.1s, -webkit-transform 0.2s;transition:width 0.2s cubic-bezier(0.7, 0, 0.3, 1) 0.2s, background 0.1s, left 0.2s, -webkit-box-shadow 0.1s, -webkit-transform 0.2s;transition:width 0.2s cubic-bezier(0.7, 0, 0.3, 1) 0.2s, background 0.1s, box-shadow 0.1s, left 0.2s, transform 0.2s;transition:width 0.2s cubic-bezier(0.7, 0, 0.3, 1) 0.2s, background 0.1s, box-shadow 0.1s, left 0.2s, transform 0.2s, -webkit-box-shadow 0.1s, -webkit-transform 0.2s}:host>pn-button[data-loading=true] .pn-button-bg{left:0;-webkit-transform:translateX(0);transform:translateX(0);-webkit-transition:width 0.2s cubic-bezier(0.7, 0, 0.3, 1) 0.2s, background 0.1s, -webkit-box-shadow 0.1s;transition:width 0.2s cubic-bezier(0.7, 0, 0.3, 1) 0.2s, background 0.1s, -webkit-box-shadow 0.1s;transition:width 0.2s cubic-bezier(0.7, 0, 0.3, 1) 0.2s, background 0.1s, box-shadow 0.1s;transition:width 0.2s cubic-bezier(0.7, 0, 0.3, 1) 0.2s, background 0.1s, box-shadow 0.1s, -webkit-box-shadow 0.1s}:host>pn-button[data-loading=true] pn-spinner{left:0.75em}:host input{padding:0.75em;min-height:3em;font-size:1em;height:100%;font-weight:500;-webkit-font-smoothing:antialiased;outline:none;border-radius:3em;border:0.1rem solid #5E554A;-webkit-transition:border 0.15s, -webkit-box-shadow 0.15s;transition:border 0.15s, -webkit-box-shadow 0.15s;transition:box-shadow 0.15s, border 0.15s;transition:box-shadow 0.15s, border 0.15s, -webkit-box-shadow 0.15s;color:#000000;width:100%}:host input::-webkit-search-cancel-button{display:none}:host input::-webkit-input-placeholder{color:#969087;font-weight:normal}:host input::-moz-placeholder{color:#969087;font-weight:normal}:host input:-ms-input-placeholder{color:#969087;font-weight:normal}:host input::-ms-input-placeholder{color:#969087;font-weight:normal}:host input::placeholder{color:#969087;font-weight:normal}:host input:focus{border:0.1rem solid #005D92;-webkit-box-shadow:0 0 0 0.2rem #fff, 0 0 0 0.4rem #005D92;box-shadow:0 0 0 0.2rem #fff, 0 0 0 0.4rem #005D92}:host input:hover{border:0.1rem solid #00A0D6}:host input:disabled{background:#F3F2F2;border:none}:host>.input-container{width:100%;position:relative}:host>.input-container .button-container{position:absolute;top:0;right:0;background:transparent;width:3em;height:100%;overflow:hidden;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}:host>.input-container button{position:absolute;left:50%;top:50%;-webkit-transform:translate(100%, -50%);transform:translate(100%, -50%);background:none;border:none;color:#005D92;padding:0.3rem;border-radius:50%;outline:none;-webkit-transition:border 0.1s, background 0.2s, opacity 0.2s, -webkit-box-shadow 0.1s, -webkit-transform cubic-bezier(0.7, 0, 0.3, 1) 0.2s;transition:border 0.1s, background 0.2s, opacity 0.2s, -webkit-box-shadow 0.1s, -webkit-transform cubic-bezier(0.7, 0, 0.3, 1) 0.2s;transition:border 0.1s, background 0.2s, box-shadow 0.1s, transform cubic-bezier(0.7, 0, 0.3, 1) 0.2s, opacity 0.2s;transition:border 0.1s, background 0.2s, box-shadow 0.1s, transform cubic-bezier(0.7, 0, 0.3, 1) 0.2s, opacity 0.2s, -webkit-box-shadow 0.1s, -webkit-transform cubic-bezier(0.7, 0, 0.3, 1) 0.2s;border:0.1rem solid transparent}:host>.input-container button.clear,:host>.input-container button.search{cursor:pointer}:host>.input-container button:focus{-webkit-box-shadow:0 0 0 0.2rem #fff, 0 0 0 0.4rem #005D92;box-shadow:0 0 0 0.2rem #fff, 0 0 0 0.4rem #005D92;background:#8EDDF9}:host>.input-container button:hover{background:#E0F8FF}:host>.input-container button:active{background:#005D92}:host>.input-container button:active pn-icon svg,:host>.input-container button:active pn-icon svg path{fill:white}:host.searching button.search{-webkit-transform:translate(150%, -50%);transform:translate(150%, -50%)}:host.searching button.clear{-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%)}:host.button-none input,:host.button-icon-inline input{padding-right:3.3em}:host.button-none pn-spinner,:host.button-icon-inline pn-spinner{position:absolute;left:50%;top:50%;-webkit-transform:translate(100%, -50%);transform:translate(100%, -50%);-webkit-transition:-webkit-transform cubic-bezier(0.7, 0, 0.3, 1) 0.2s;transition:-webkit-transform cubic-bezier(0.7, 0, 0.3, 1) 0.2s;transition:transform cubic-bezier(0.7, 0, 0.3, 1) 0.2s;transition:transform cubic-bezier(0.7, 0, 0.3, 1) 0.2s, -webkit-transform cubic-bezier(0.7, 0, 0.3, 1) 0.2s}:host.button-none button.search,:host.button-icon-inline button.search{-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%)}:host.button-none.loading button,:host.button-icon-inline.loading button{-webkit-transform:translate(100%, -50%);transform:translate(100%, -50%)}:host.button-none.loading pn-spinner,:host.button-icon-inline.loading pn-spinner{-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%)}:host.button-none.searching button.search{-webkit-transform:translate(100%, -50%);transform:translate(100%, -50%)}:host.button-icon>pn-button[data-loading=true] .pn-button-bg{left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%)}";
-
-let PnFilterSearch$1 = class extends HTMLElement {
-  constructor() {
-    super();
-    this.__registerHost();
-    this.__attachShadow();
-    this.search = createEvent(this, "search", 7);
-    this.update = createEvent(this, "update", 7);
-    this.disabled = false;
-    this.placeholder = null;
-    this.inputid = null;
-    this.name = null;
-    this.autocomplete = null;
-    this.value = null;
-    /** Label for the button */
-    this.label = null;
-    /** Loading animation */
-    this.loading = false;
-    /** Button type, options are 'none' for no button, 'icon' for a labelless button with just a search icon and 'icon-inline' for a search button inside of the search field (this last option disables the clear field button) */
-    this.button = '';
-    /** Light instead of dark search button */
-    this.light = false;
-  }
-  inputHandler() {
-    this.update.emit(this.value);
-  }
-  emitSearch(e) {
-    if (e.type === 'click' ||
-      (e.type === 'keydown' && e.key === 'Enter')) {
-      // We prevent the native search event since it's not supported in IE and FF, then we emit our own instead
-      e.preventDefault();
-      this.search.emit(this.value);
-    }
-  }
-  setVal(e) {
-    this.value = e.target.value;
-  }
-  clearInput() {
-    this.value = '';
-    this.update.emit(this.value);
-    this.hostElement.querySelector('input').focus();
-  }
-  getClassNames() {
-    let classNames = '';
-    const buttonTypes = ['none', 'icon', 'icon-inline'];
-    if (this.value)
-      classNames += 'searching ';
-    if (this.loading)
-      classNames += 'loading ';
-    if (buttonTypes.includes(this.button))
-      classNames += `button-${this.button} `;
-    return classNames;
-  }
-  render() {
-    return (h(Host, { class: this.getClassNames() }, h("div", { class: "input-container" }, h("input", { type: "search", value: this.value, id: this.inputid, name: this.name, placeholder: this.placeholder, disabled: this.disabled, autocomplete: this.autocomplete, onKeyDown: (e) => this.emitSearch(e), onInput: (e) => this.setVal(e) }), h("div", { class: "button-container" }, (this.button === 'none' || this.button === 'icon-inline') &&
-      h("button", { class: "search", tabindex: this.button === 'icon-inline' ? '0' : '-1', onClick: (e) => this.emitSearch(e), "aria-label": "search", title: "search" }, h("pn-icon", { symbol: "search", color: "blue700" })), (this.button !== 'icon-inline') &&
-      h("button", { class: "clear", "aria-label": "clear", title: "clear search field", tabindex: this.value && (!this.loading || this.button !== 'none') ? '0' : '-1', onClick: () => this.clearInput() }, h("pn-icon", { symbol: "close-small", color: "blue700" })), this.button === 'none' || this.button === 'icon-inline' && h("pn-spinner", null))), (this.button !== 'none' && this.button !== 'icon-inline') &&
-      h("pn-button", { onClick: (e) => this.emitSearch(e), loading: this.loading, icon: "search", appearance: this.light ? 'light' : 'dark', "icon-only": this.button === 'icon' }, this.label)));
-  }
-  get hostElement() { return this; }
-  static get style() { return pnFilterSearchCss; }
-};
-
 const translations$9 = {
   'sv': {
     'componentheading': 'Våra priser och villkor för inrikesförsändelser för dig som direktbetalande kund?',
     'deliveryscopeheading': 'Endast leveranser inom Sverige',
-    'sizeheading': 'Uppskatta storlek och vikt på din försändelse',
     'resultlistheading': 'Några bra alternativ för dig',
     'weightlabel': 'Vikt',
     'maxweightlabel': 'Maxvikt',
@@ -294,12 +229,11 @@ const translations$9 = {
     'stampshopcta': 'Beställ fysiska frimärken',
     'message': '*Vid köp hos valfritt ombud',
     'servicePointHeader': 'Eller hitta närmaste serviceställe',
-    'servicePointLink': 'Sök brevlåda eller serviceställe'
+    'servicePointLink': 'Sök serviceställe eller brevlåda'
   },
   'en': {
     'componentheading': 'Our prices and terms and conditions for domestic shipments for you as a direct paying customer',
     'deliveryscopeheading': 'Deliveries within Sweden only',
-    'sizeheading': 'Estimate the size and weight of your shipment',
     'resultlistheading': 'Some suitable options for you',
     'weightlabel': 'Weight',
     'maxweightlabel': 'Max weight',
@@ -313,7 +247,6 @@ const translations$9 = {
   'da': {
     'componentheading': 'Vad vill du skicka?',
     'deliveryscopeheading': 'Kun leveringer indenfor Sverige',
-    'sizeheading': 'How much does it weigh?',
     'resultlistheading': 'Some suitable options for you',
     'weightlabel': 'Vægt',
     'maxweightlabel': 'Max vægt',
@@ -324,7 +257,6 @@ const translations$9 = {
   'no': {
     'componentheading': 'Vad vill du skicka?',
     'deliveryscopeheading': 'Kun leveranser innen Sverige',
-    'sizeheading': 'How much does it weigh?',
     'resultlistheading': 'Some suitable options for you',
     'weightlabel': 'Vekt',
     'maxweightlabel': 'Maks vekt',
@@ -335,7 +267,6 @@ const translations$9 = {
   'fi': {
     'componentheading': 'Vad vill du skicka?',
     'deliveryscopeheading': 'Toimitukset vain Ruotsin sisällä',
-    'sizeheading': 'How much does it weigh?',
     'resultlistheading': 'Some suitable options for you',
     'weightlabel': 'Paino',
     'maxweightlabel': 'Max paino',
@@ -2417,11 +2348,10 @@ const createStore = (defaultState, shouldUpdate) => {
 };
 
 // Read more about how stencil stores work here: https://stenciljs.com/docs/stencil-store
-const { state: state$4, onChange: onChange$4 } = createStore({
+const { state: state$5, onChange: onChange$5 } = createStore({
   i18n: {
     componentheading: '',
     deliveryscopeheading: '',
-    sizeheading: '',
     resultlistheading: '',
     weightlabel: '',
     maxweightlabel: '',
@@ -2445,7 +2375,9 @@ const largePackageSvg = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iOTciIGhlaWdod
 
 const postnordPerson1Svg = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTA0IiBoZWlnaHQ9IjE2MiIgdmlld0JveD0iMCAwIDEwNCAxNjIiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik0yOS4wMDE2IDE0My4zOTlIMTkuNjAxNlYxNTIuMTk5SDI5LjAwMTZWMTQzLjM5OVoiIGZpbGw9IiM5OTI5MEEiLz4KPHBhdGggZD0iTTE5LjYgMTUyLjJMMTcgMTU5SDMyTDI4LjkgMTUwLjNMMTkuNiAxNTIuMloiIGZpbGw9IiMwRDIzNEIiLz4KPHBhdGggZD0iTTQ5LjEgMTQ3LjVIMzlWMTU0LjhINDkuMVYxNDcuNVoiIGZpbGw9IiM5OTI5MEEiLz4KPHBhdGggZD0iTTM5IDE1Mi45VjE1OS4ySDY1LjVMNDkuMSAxNTEuNVYxNDkuM0wzOSAxNTIuOVoiIGZpbGw9IiMwRDIzNEIiLz4KPHBhdGggZD0iTTY1LjUgMTU5LjE5OUgzOVYxNjEuNzk5SDY1LjVWMTU5LjE5OVoiIGZpbGw9IndoaXRlIi8+CjxwYXRoIGQ9Ik00NC41MDE2IDE1Ny4xQzQ1LjU1MDkgMTU3LjEgNDYuNDAxNiAxNTYuMjQ5IDQ2LjQwMTYgMTU1LjJDNDYuNDAxNiAxNTQuMTUgNDUuNTUwOSAxNTMuMyA0NC41MDE2IDE1My4zQzQzLjQ1MjIgMTUzLjMgNDIuNjAxNiAxNTQuMTUgNDIuNjAxNiAxNTUuMkM0Mi42MDE2IDE1Ni4yNDkgNDMuNDUyMiAxNTcuMSA0NC41MDE2IDE1Ny4xWiIgZmlsbD0iIzAwNUQ5MiIvPgo8cGF0aCBkPSJNMjkuMDAxNiAxNDMuMzk5SDE5LjYwMTZWMTUyLjE5OUgyOS4wMDE2VjE0My4zOTlaIiBmaWxsPSIjOTkyOTBBIi8+CjxwYXRoIGQ9Ik0xOS42IDE1Mi4yTDE3IDE1OUgzMkwyOC45IDE1MC4zTDE5LjYgMTUyLjJaIiBmaWxsPSIjMEQyMzRCIi8+CjxwYXRoIGQ9Ik00OS4xIDE0Ny41SDM5VjE1NC44SDQ5LjFWMTQ3LjVaIiBmaWxsPSIjOTkyOTBBIi8+CjxwYXRoIGQ9Ik0xMS42MDE2IDg0LjQ5OTJMMTIuODAxNiA4Ni44OTkyQzEzLjcwMTYgODguNjk5MiAxNS4zMDE2IDg5Ljk5OTIgMTcuMjAxNiA5MC40OTkyTDE4LjIwMTYgOTAuNzk5MkwxNS4yMDE2IDgzLjE5OTJMMTEuNjAxNiA4NC40OTkyWiIgZmlsbD0iIzk5MjkwQSIvPgo8cGF0aCBkPSJNMzkgMTUyLjlWMTU5SDY1LjVMNDkuMSAxNTEuNVYxNDkuM0wzOSAxNTIuOVoiIGZpbGw9IiMwRDIzNEIiLz4KPHBhdGggZD0iTTIwLjYgODUuMUgxMi4zQzExLjMgODUuMSAxMC41IDg0LjMgMTAuNSA4My4zVjYySDIwLjZWODUuMVoiIGZpbGw9IiNGQkMyQzEiLz4KPHBhdGggZD0iTTMzLjM5ODQgNjUuNjk5MlYxNDcuODk5SDE0Ljg5ODRWODkuNTk5MkMxNC44OTg0IDgwLjk5OTIgMTcuMzk4NCA3Mi44OTkyIDIyLjA5ODQgNjUuNjk5MkgzMy4zOTg0WiIgZmlsbD0iIzAwNUQ5MiIvPgo8cGF0aCBkPSJNMzMuODk5MiA2NS42OTkySDQ0LjQ5OTJMNTUuMTk5MiAxMDMuNjk5QzU1Ljg5OTIgMTA2LjA5OSA1Ni4yOTkyIDEwOC42OTkgNTYuMjk5MiAxMTEuMTk5VjE0Ny44OTlIMzguOTk5MlYxMTEuNTk5TDMyLjY5OTIgODYuNzk5MlY2NS42OTkySDMzLjg5OTJaIiBmaWxsPSIjMDA1RDkyIi8+CjxwYXRoIG9wYWNpdHk9IjAuMiIgZD0iTTM3LjggODIuNUwzOSAxMTEuNkwzMy41IDg5LjlMMzMuNiA4NC4yTDM0LjIgODMuNkwzNy44IDgyLjVaIiBmaWxsPSIjMEQyMzRCIi8+CjxwYXRoIGQ9Ik0yOC4zOTg0IDM1LjFIMTYuMzk4NFYxOS4zQzE2LjM5ODQgMTUgMTkuODk4NCAxMS41IDI0LjE5ODQgMTEuNUgyOC40OTg0VjM1LjFIMjguMzk4NFoiIGZpbGw9ImJsYWNrIi8+CjxwYXRoIGQ9Ik00Mi41IDM1LjA5OTZIMjBWMTIuMzk5NkMyMCA2LjE5OTYxIDI1IDEuMDk5NjEgMzEuMyAxLjA5OTYxQzM3LjUgMS4xOTk2MSA0Mi41IDYuMTk5NjEgNDIuNSAxMi4zOTk2VjM1LjA5OTZaIiBmaWxsPSJibGFjayIvPgo8cGF0aCBkPSJNMzMuNTk5IDI1LjY5OTJIMzIuMjk5QzI4LjA5OSAyNS41OTkyIDI0LjY5OSAyMS45OTkyIDI0Ljg5OSAxNy43OTkyTDI1LjA5OSAxMi40OTkyQzI1LjE5OSA4LjI5OTIxIDI4Ljc5OSA0Ljg5OTIxIDMyLjk5OSA1LjA5OTIxQzM3LjE5OSA1LjE5OTIxIDQwLjU5OSA4Ljc5OTIxIDQwLjM5OSAxMi45OTkyTDQwLjE5OSAxOS42OTkyQzM5Ljk5OSAyMy4wOTkyIDM3LjA5OSAyNS43OTkyIDMzLjU5OSAyNS42OTkyWiIgZmlsbD0iIzk5MjkwQSIvPgo8cGF0aCBkPSJNMjUuODAwOCAxNS40OTkySDI3LjUwMDhDMjguNzAwOCAxNS40OTkyIDI5LjcwMDggMTQuNDk5MiAyOS43MDA4IDEzLjI5OTJWMTEuNTk5MkMzNC4zMDA4IDE0LjA5OTIgNDEuODAwOCAxMi42OTkyIDQxLjgwMDggMTIuNjk5Mkw0MC4xMDA4IDYuMTk5MjJMMjguODAwOCA3Ljk5OTIyTDI1LjgwMDggMTUuNDk5MloiIGZpbGw9ImJsYWNrIi8+CjxwYXRoIGQ9Ik0yNS44IDE1LjQ5OThIMjEuNUwyNS44IDQuNzk5OEwzMS42IDMuMjk5OEwzNy45IDQuMzk5OEwzOS44IDguNzk5OEwyOC4zIDkuMzk5ODFMMjUuOCAxNS40OTk4WiIgZmlsbD0iYmxhY2siLz4KPHBhdGggZD0iTTI0LjQ5OTIgMTguNjk5NkMyNS43Njk1IDE4LjY5OTYgMjYuNzk5MiAxNy42Njk5IDI2Ljc5OTIgMTYuMzk5NkMyNi43OTkyIDE1LjEyOTQgMjUuNzY5NSAxNC4wOTk2IDI0LjQ5OTIgMTQuMDk5NkMyMy4yMjkgMTQuMDk5NiAyMi4xOTkyIDE1LjEyOTQgMjIuMTk5MiAxNi4zOTk2QzIyLjE5OTIgMTcuNjY5OSAyMy4yMjkgMTguNjk5NiAyNC40OTkyIDE4LjY5OTZaIiBmaWxsPSIjOTkyOTBBIi8+CjxwYXRoIGQ9Ik0zNC43MDE2IDMxLjRIMjYuMTAxNkwyNi45MDE2IDIyLjVMMzQuNzAxNiAyMy44VjMxLjRaIiBmaWxsPSIjOTkyOTBBIi8+CjxwYXRoIGQ9Ik0zNC41IDI1LjY5OTRDMzQuNSAyNS42OTk0IDMxLjcgMjYuMDk5NCAyOS41IDI0Ljg5OTQiIHN0cm9rZT0iIzRGMTYwMCIgc3Ryb2tlLXdpZHRoPSIwLjciIHN0cm9rZS1taXRlcmxpbWl0PSIxMCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+CjxwYXRoIGQ9Ik02NS41IDE1OUgzOVYxNjJINjUuNVYxNTlaIiBmaWxsPSIjMDA1RDkyIi8+CjxwYXRoIGQ9Ik0zMiAxNTlIMTdWMTYySDMyVjE1OVoiIGZpbGw9IiMwMDVEOTIiLz4KPHBhdGggZD0iTTQ1LjUgNjYuNDA5OEwxMC41IDY1LjYwOThWMzkuMzA5OEMxMC41IDM0LjEwOTggMTQuNyAzMC4wMDk4IDE5LjggMzAuMDA5OEg0MUw0NS41IDQwLjMwOThWNjYuNDA5OFoiIGZpbGw9IiNGQkMyQzEiLz4KPHBhdGggZD0iTTM3LjIwMDggNzIuMTk5MkgyMS4xMDA4QzE4LjcwMDggNzIuMTk5MiAxNi44MDA4IDY5Ljg5OTIgMTcuNDAwOCA2Ny40OTkyTDIzLjcwMDggNDYuODk5MkwzNy4yMDA4IDQ2LjE5OTJWNzIuMTk5MloiIGZpbGw9IiNGQkMyQzEiLz4KPHBhdGggZD0iTTQ2LjQwMTYgNDkuODk5NEw0Ni41MDE2IDcyLjc5OTRIMTUuNjAxNlY0Ny4zOTk0TDQ2LjQwMTYgNDkuODk5NFoiIGZpbGw9IiNGQkMyQzEiLz4KPHBhdGggZD0iTTMzLjYwMTYgOTAuNTk5OFY4My43OTk4IiBzdHJva2U9IiMwRDIzNEIiIHN0cm9rZS13aWR0aD0iMC43IiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPgo8cGF0aCBkPSJNMzMuNjAxNiA4My44TDM3LjgwMTYgODIuNSIgc3Ryb2tlPSIjMEQyMzRCIiBzdHJva2Utd2lkdGg9IjAuNyIgc3Ryb2tlLW1pdGVybGltaXQ9IjEwIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPHBhdGggZD0iTTM3LjQwMTYgMjcuMTk5MkgyNC4xMDE2VjM1LjI5OTJIMzcuNDAxNlYyNy4xOTkyWiIgZmlsbD0iI0ZCQzJDMSIvPgo8cGF0aCBkPSJNMzMuMzk4NCAxNDEuOEgxNC44OTg0VjE0OEgzMy4zOTg0VjE0MS44WiIgZmlsbD0iIzAwNUQ5MiIvPgo8cGF0aCBkPSJNNTYuMiAxNDEuOEgzOVYxNDhINTYuMlYxNDEuOFoiIGZpbGw9IiMwMDVEOTIiLz4KPHBhdGggZD0iTTQ0LjUwMTYgMTU3LjFDNDUuNTUwOSAxNTcuMSA0Ni40MDE2IDE1Ni4yNDkgNDYuNDAxNiAxNTUuMkM0Ni40MDE2IDE1NC4xNSA0NS41NTA5IDE1My4zIDQ0LjUwMTYgMTUzLjNDNDMuNDUyMiAxNTMuMyA0Mi42MDE2IDE1NC4xNSA0Mi42MDE2IDE1NS4yQzQyLjYwMTYgMTU2LjI0OSA0My40NTIyIDE1Ny4xIDQ0LjUwMTYgMTU3LjFaIiBmaWxsPSIjMDA1RDkyIi8+CjxwYXRoIGQ9Ik01Ni4yIDE0My4zOTlIMzkiIHN0cm9rZT0iIzBEMjM0QiIgc3Ryb2tlLXdpZHRoPSIwLjciIHN0cm9rZS1taXRlcmxpbWl0PSIxMCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+CjxwYXRoIGQ9Ik0zMy4zOTg0IDE0My4zOTlIMTQuODk4NCIgc3Ryb2tlPSIjMEQyMzRCIiBzdHJva2Utd2lkdGg9IjAuNSIgc3Ryb2tlLW1pdGVybGltaXQ9IjEwIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPHBhdGggb3BhY2l0eT0iMC4zIiBkPSJNMjYuMTAxNiAyOC4zOTk0VjMxLjU5OTQiIHN0cm9rZT0iI0YwNjM2NSIgc3Ryb2tlLXdpZHRoPSIwLjciIHN0cm9rZS1taXRlcmxpbWl0PSIxMCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+CjxwYXRoIG9wYWNpdHk9IjAuMyIgZD0iTTI4LjUgMjguMzk5NFYzMS41OTk0IiBzdHJva2U9IiNGMDYzNjUiIHN0cm9rZS13aWR0aD0iMC43IiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIvPgo8cGF0aCBvcGFjaXR5PSIwLjMiIGQ9Ik0zMC44MDA4IDI4LjM5OTRWMzEuNTk5NCIgc3Ryb2tlPSIjRjA2MzY1IiBzdHJva2Utd2lkdGg9IjAuNyIgc3Ryb2tlLW1pdGVybGltaXQ9IjEwIiBzdHJva2UtbGluZWNhcD0icm91bmQiLz4KPHBhdGggb3BhY2l0eT0iMC4zIiBkPSJNMzMuMTAxNiAyOC4zOTk0VjMxLjU5OTQiIHN0cm9rZT0iI0YwNjM2NSIgc3Ryb2tlLXdpZHRoPSIwLjciIHN0cm9rZS1taXRlcmxpbWl0PSIxMCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+CjxwYXRoIG9wYWNpdHk9IjAuMyIgZD0iTTM1LjUgMjguMzk5NFYzMS41OTk0IiBzdHJva2U9IiNGMDYzNjUiIHN0cm9rZS13aWR0aD0iMC43IiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIvPgo8cGF0aCBkPSJNMzAuNjAxNiA4MC43OTk4TDE1LjYwMTYgNzYuMzk5OFY3Mi43OTk4SDMyLjYwMTZMMzAuNjAxNiA4MC43OTk4WiIgZmlsbD0id2hpdGUiLz4KPHBhdGggZD0iTTQ5LjgwMTYgNzguOTk5MkwzNS42MDE2IDc4Ljc5OTJMMzIuNjAxNiA3Mi43OTkyTDQ2LjYwMTYgNzIuNjk5Mkw0OS44MDE2IDc4Ljk5OTJaIiBmaWxsPSJ3aGl0ZSIvPgo8cGF0aCBkPSJNMTUuNjAxNiA3Mi43OTk0VjQ3LjM5OTQiIHN0cm9rZT0iIzJEMjAxMyIgc3Ryb2tlLXdpZHRoPSIwLjciIHN0cm9rZS1taXRlcmxpbWl0PSIxMCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNNDguMDAxMyA1NS4wOTkzTDM2LjMwMTMgNDAuMDk5M0MzNC4wMDEzIDM3LjM5OTMgMzQuNTAxMyAzMy4yOTkzIDM3LjMwMTMgMzEuMjk5M0M0MC4xMDEzIDI5LjA5OTMgNDQuMTAxMyAyOS43OTkzIDQ2LjAwMTMgMzIuNzk5M0w1Ni4wMDEzIDQ5LjA5OTNMNDguMDAxMyA1NS4wOTkzWiIgZmlsbD0iI0ZCQzJDMSIvPgo8cGF0aCBkPSJNNDYuMzk4NCA1My4zOTkyVjQ3LjE5OTIiIHN0cm9rZT0iIzJEMjAxMyIgc3Ryb2tlLXdpZHRoPSIwLjciIHN0cm9rZS1taXRlcmxpbWl0PSIxMCIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIi8+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNODQuMTUxMSA0OC44TDc0LjY5NiA0N0M3NC42OTYgNDcgNzQuNDk2OSA0NyA3NC4zOTc0IDQ3SDUyVjU3TDc0LjE5ODMgNTIuMUM3NS4wOTQxIDUxLjkgNzUuNDkyMiA1MS42IDc1Ljc5MDggNTAuOEw4My43NTMgNTEuMkM4NC4zNTAxIDUxLjIgODQuNzQ4MyA1MC45IDg0Ljk0NzMgNTAuM0M4NS4wNDY4IDQ5LjggODUuMDQ2OCA0OS4zIDg0LjU0OTIgNDlDODQuNDQ5NyA0OC45IDg0LjM1MDEgNDguOSA4NC4xNTExIDQ4LjhaIiBmaWxsPSIjOTkyOTBBIi8+CjxwYXRoIGQ9Ik02OS42MTkyIDU1LjI5MTlMNTIgNTdWNDdINzIuMDAwMkw3MS41MDQxIDUzLjA4NzdDNzEuNDA0OSA1NC4yNDIzIDcwLjYxMTMgNTUuMTg2OSA2OS42MTkyIDU1LjI5MTlaIiBmaWxsPSIjRkJDMkMxIi8+CjxyZWN0IHg9IjQ3IiB5PSI0NyIgd2lkdGg9IjEwIiBoZWlnaHQ9IjEwIiByeD0iNSIgZmlsbD0iI0ZCQzJDMSIvPgo8cGF0aCBvcGFjaXR5PSIwLjIiIGQ9Ik01NC41IDQ3TDUzIDUwTDU3IDQ3SDU0LjVaIiBmaWxsPSIjRTU0NzRDIi8+Cjwvc3ZnPgo=';
 
-const pnFindPriceCss = "@charset \"UTF-8\";pn-find-price .sizeTable{border-style:none !important;border:0 !important}pn-find-price .sizeTable>tr td{margin-bottom:1em;text-align:center;vertical-align:bottom;padding-right:1em}pn-find-price .firstCell{margin-right:0;margin-left:auto}pn-find-price .findprice-form{max-width:60em;margin:0 auto 3em auto}pn-find-price h2,pn-find-price .heading,pn-find-price .resultHeading{text-align:center;font-size:1.5em;line-height:1.1;font-weight:bold;margin-bottom:1rem}pn-find-price .sizeheading{text-align:center;font-size:1.25em;line-height:1.1;font-weight:bold;margin-bottom:1rem}pn-find-price .sizecategory{margin-top:5em;margin-bottom:3rem;font-size:0.9em;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}pn-find-price .weightoption{font-size:0.9em;max-width:41rem;margin:0 auto}pn-find-price .weightoption-content{text-align:center}pn-find-price .weightoption-content pn-choice-button{width:7em;line-height:3.3em;font-size:0.9em;vertical-align:bottom}pn-find-price .weightoption-content pn-choice-button>label{-ms-flex-line-pack:center;align-content:center;-ms-flex-pack:center;justify-content:center}pn-find-price .weightoption-content pn-choice-button ::before{content:\"Max  \";font-weight:lighter}pn-find-price .resultlist{margin:3em 0}pn-find-price .servicePoint{text-align:center}pn-find-price .servicePoint pn-illustration{display:block;max-width:5em;max-height:5em;margin:1.5em auto 0 auto}pn-find-price .servicePoint h3{margin-top:1.8em;margin-bottom:0.9em}pn-find-price .servicePoint a{color:#005D92}";
+const cloudsSvg = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjc4IiBoZWlnaHQ9IjU1IiB2aWV3Qm94PSIwIDAgMjc4IDU1IiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgo8cGF0aCBkPSJNMjQ3LjM1NSA0OS42ODE1QzI0Ny42OTQgNTIuNDc5IDI0OS43MjIgNTQuNjI2MSAyNTIuMTgxIDU0LjYyNjFIMjcyLjkyNkMyNzUuNjIgNTQuNjI2MSAyNzcuNzk4IDUyLjA1MjIgMjc3Ljc5OCA0OC44Njg2VjQ4LjgwMDhDMjc3Ljc5OCA0NS42MTczIDI3NS42MiA0My4wNDMzIDI3Mi45MjYgNDMuMDQzM0gyNzAuNTM3QzI2OS42MDggMzkuMjQzOSAyNjYuODQ2IDM2LjQ3MyAyNjMuNTg1IDM2LjQ3M0gyNTkuNzE3QzI1OS4zNzMgMzEuODQxIDI1Ni4xMDEgMjguMjA5MiAyNTIuMTI0IDI4LjIwOTJDMjQ4LjE0NiAyOC4yMDkyIDI0NC44OCAzMS44NDEgMjQ0LjUzIDM2LjQ3M0gyNDIuMDk1QzIzOC4wODMgMzYuNDczIDIzNC44MTYgNDAuNjcyNiAyMzQuODE2IDQ1LjgyMDVWNDkuNjgxNUgyNDcuMzU1WiIgZmlsbD0iI0UwRjhGRiIvPgo8cGF0aCBkPSJNMTIuMDM5MSA0Ni4xMDIyQzEyLjMxNzYgNDguNTU2OSAxNC4wODY3IDUwLjQzNzMgMTYuMjQyMSA1MC40MzczSDM0LjU4MDdDMzYuOTMwNCA1MC40MzczIDM4LjgyMTYgNDguMjAyIDM4LjgyMTYgNDUuNDI0OFY0NS4zNTcxQzM4LjgyMTYgNDIuNTc5OSAzNi45MzA0IDQwLjM0NDYgMzQuNTgwNyA0MC4zNDQ2SDMyLjQ2ODRDMzEuNjY3OCAzNy4wMjA5IDI5LjIyNyAzNC41ODcyIDI2LjMyODMgMzQuNTg3MkgyMi45MTc5QzIyLjYwMDQgMzAuNTU5NyAxOS43MzI3IDI3LjQwNzEgMTYuMjQyMSAyNy40MDcxQzEyLjc1MTQgMjcuNDA3MSA5Ljg4MzcxIDMwLjU1OTcgOS41NjYyMiAzNC41ODcySDcuNDE2NThDMy44NjM0NiAzNC41ODcyIDAuOTk4MDQ3IDM4LjI0NDggMC45OTgwNDcgNDIuNzE1NFY0Ni4xMDIySDEyLjAzOTFaIiBmaWxsPSIjRTBGOEZGIi8+CjxwYXRoIGQ9Ik0xMzEuMDU2IDI2LjU4NjRDMTMxLjQ0OSAzMC4wNDIzIDEzMy45NDggMzIuNjg5NSAxMzYuOTkxIDMyLjY4OTVIMTYyLjg5MUMxNjYuMjA5IDMyLjY4OTUgMTY4Ljg4IDI5LjU0MjYgMTY4Ljg4IDI1LjYzMjhWMjUuNTM3NUMxNjguODggMjEuNjI3NyAxNjYuMjA5IDE4LjQ4MDggMTYyLjg5MSAxOC40ODA4SDE1OS45MDdDMTU4Ljc3NyAxMy44MDE1IDE1NS4zMyAxMC4zNzUzIDE1MS4yMzYgMTAuMzc1M0gxNDYuNDJDMTQ1Ljk3MSA0LjcwNTMzIDE0MS45MjEgMC4yNjcwOSAxMzYuOTkxIDAuMjY3MDlDMTMyLjA2MiAwLjI2NzA5IDEyOC4wMTIgNC43MDUzMyAxMjcuNTYzIDEwLjM3NTNIMTI0LjUyOEMxMTkuNTEgMTAuMzc1MyAxMTUuNDYzIDE1LjUyNDcgMTE1LjQ2MyAyMS44MTg0VjI2LjU4NjRIMTMxLjA1NloiIGZpbGw9IiNFMEY4RkYiLz4KPC9zdmc+Cg==';
+
+const pnFindPriceCss = "@charset \"UTF-8\";pn-find-price .sizeTable{border-style:none !important;border:0 !important}pn-find-price .sizeTable>tr td{margin-bottom:1em;text-align:center;vertical-align:bottom;padding-right:1em}pn-find-price .firstCell{margin-right:0;margin-left:auto}pn-find-price .findprice-form{max-width:60em;margin:0 auto 3em auto}pn-find-price h2,pn-find-price .heading{text-align:center;font-size:1.5em;line-height:1.1;font-weight:bold;margin-bottom:1rem}pn-find-price .resultHeading{text-align:center;font-size:1.5em;line-height:1.1;font-weight:bold;margin-bottom:2em}pn-find-price .sizecategory{margin-top:5em;margin-bottom:3rem;font-size:0.9em;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}pn-find-price .sizecategory #clouds{position:absolute;top:4.87em;left:26.3em}pn-find-price .weightoption{font-size:0.9em;max-width:41rem;margin:0 auto}pn-find-price .weightoption-content{text-align:center}pn-find-price .weightoption-content pn-choice-button{width:7em;line-height:3.3em;font-size:0.9em;vertical-align:bottom}pn-find-price .weightoption-content pn-choice-button>label{-ms-flex-line-pack:center;align-content:center;-ms-flex-pack:center;justify-content:center}pn-find-price .weightoption-content pn-choice-button ::before{content:\"Max  \";font-weight:lighter}pn-find-price .resultlist{margin:3em 0}pn-find-price .servicePoint{text-align:center}pn-find-price .servicePoint pn-illustration{display:block;max-width:5em;max-height:5em;margin:1.5em auto 0 auto}pn-find-price .servicePoint h3{margin-top:1.8em;margin-bottom:0.9em}pn-find-price .servicePoint a{color:#005D92;text-decoration:none}pn-find-price .servicePoint a:hover{color:#0D234B;text-decoration:underline}";
 
 let PnfindPrice = class extends HTMLElement {
   constructor() {
@@ -2481,10 +2413,10 @@ let PnfindPrice = class extends HTMLElement {
   }
   setState() {
     if (this.market) {
-      state$4.market = markets$2[this.market];
+      state$5.market = markets$2[this.market];
     }
     if (this.language && translations$9[this.language]) {
-      state$4.i18n = translations$9[this.language];
+      state$5.i18n = translations$9[this.language];
     }
   }
   filterItems() {
@@ -2524,14 +2456,14 @@ let PnfindPrice = class extends HTMLElement {
     this.filteredItems = weightFilteredData;
   }
   render() {
-    return (h("div", { class: "findprice-form" }, h("div", null, (h("div", { class: "sizeheading" }, state$4.i18n.sizeheading)), h("div", { class: "sizecategory" }, h("table", { class: "sizeTable" }, h("tr", null, h("td", null, h("img", { class: "firstCell", src: postnordPerson1Svg })), h("td", null, h("img", { src: smallPackageSvg })), h("td", null, h("img", { src: mediumPackageSvg })), h("td", null, h("img", { src: largePackageSvg }))), h("tr", null, h("td", null), sizeCategories.map((sizeCategory) => (h("td", null, h("pn-radio-button", { radioid: sizeCategory.value, value: sizeCategory.value, name: "sizecategory", checked: sizeCategory.value === this.sizecategory.value, onChange: () => {
+    return (h("div", { class: "findprice-form" }, h("div", null, h("div", { class: "sizecategory" }, h("img", { id: "clouds", src: cloudsSvg }), h("table", { class: "sizeTable" }, h("tr", null, h("td", null, h("img", { class: "firstCell", src: postnordPerson1Svg })), h("td", null, h("img", { src: smallPackageSvg })), h("td", null, h("img", { src: mediumPackageSvg })), h("td", null, h("img", { src: largePackageSvg }))), h("tr", null, h("td", null), sizeCategories.map((sizeCategory) => (h("td", null, h("pn-radio-button", { 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;
       } })))))))), (this.sizecategory.value && weights$2[this.sizecategory.unit]) ? (h("div", { class: "weightoption" }, h("div", { class: "weightoption-content" }, weights$2[this.sizecategory.unit].map((wght) => (h("pn-choice-button", { choiceid: this.sizecategory.value + wght.value, name: "weight", type: "radio", value: (!this.weight.value) ? 0 : weights$2[this.sizecategory.unit].findIndex((x) => x.value === this.weightvalue), checked: wght.value === this.weight.value, onChange: () => {
         this.weight = weights$2[this.sizecategory.unit].filter(x => x.value === wght.value)[0];
         this.weightvalue = this.weight.value;
-      } }, wght.name)))))) : null, (this.filteredItems && this.filteredItems.length > 0) ? (h("div", { class: "resultlist" }, (state$4.i18n.resultlistheading) ? (h("div", { class: "resultHeading" }, state$4.i18n.resultlistheading)) : null, this.filteredItems.map((item) => (h("div", null, h("pn-find-price-result", { item: item })))), h("div", { class: "servicePoint" }, h("pn-illustration", { illustration: "character-box-letters-house" }), h("h3", null, state$4.i18n.servicePointHeader), h("a", { href: ServicePointUrl, target: "_blank" }, state$4.i18n.servicePointLink, h("pn-icon", { symbol: "map-marker", color: "blue700" }))))) : null));
+      } }, wght.name)))))) : null, (this.filteredItems && this.filteredItems.length > 0) ? (h("div", { class: "resultlist" }, (state$5.i18n.resultlistheading) ? (h("div", { class: "resultHeading" }, state$5.i18n.resultlistheading)) : null, this.filteredItems.map((item) => (h("div", null, h("pn-find-price-result", { item: item })))), h("div", { class: "servicePoint" }, h("pn-illustration", { illustration: "character-box-letters-house" }), h("h3", null, state$5.i18n.servicePointHeader), h("a", { href: ServicePointUrl, target: "_blank" }, h("pn-icon", { symbol: "map-marker", color: "blue700" }), state$5.i18n.servicePointLink)))) : null));
   }
   static get watchers() { return {
     "market": ["setState"],
@@ -2570,8 +2502,8 @@ let PnfindPriceResult = class extends HTMLElement {
   render() {
     return (h(Host, null, h("pn-product-card", null, h("pn-illustration", { slot: "illustration", illustration: this.item.illustration }), h("div", { slot: "title" }, h("h2", null, this.item.name, " "), (this.item.highestrankusp) ?
       (this.item.highestrankusp === "Billigast") ?
-        (h("span", { slot: "Biligast" }, this.item.highestrankusp, h("pn-icon", { symbol: "box-label", small: "false", color: "green700" })))
-        : (h("span", { slot: "Snabbast" }, this.item.highestrankusp, h("pn-icon", { symbol: "bolt", small: "false", color: "blue700" }))) : null), h("div", { slot: "content" }, h("div", { class: "content" }, (this.item.description) ? (h("div", { class: "description" }, this.description.map((desc) => (h("li", null, desc))))) : null, (this.item.info) ? (h("div", { class: "description" }, this.item.info)) : null)), this.item.note ? (h("small", { slot: "note" }, h("p", null, this.item.note))) : null, this.item.additionalusp ? (h("div", { slot: "additionalUSP" }, this.Usp1 ? (h("span", null, this.Usp1)) : null, this.Usp2 ? (h("span", null, this.Usp2)) : null, this.Usp3 ? (h("span", null, this.Usp3)) : null)) : null, this.item.paket ? (h("pn-product-card-info", { paket: this.item.paket, rulle: this.item.rulle })) : null, h("div", { slot: "cardprice" }, this.item.priceagent ? (h("pn-product-card-price", { slot: "price", label: "", amount: this.item.priceagent + '', currency: state$4.market.currency, url: "https://shop.postnord.se/ebutik/default.aspx", service: this.item.name + "-eshop" })) : null, this.item.pricesenddirect ? (h("pn-product-card-price", { slot: "sendDirectPrice", label: state$4.i18n.senddirectcta, amount: this.item.pricesenddirect + '', currency: state$4.market.currency, url: "https://portal.postnord.com/skickadirekt/", service: this.item.name + "-portal" })) : null, this.item.pricestamps ? (h("pn-product-card-price", { slot: "stampPrice", label: state$4.i18n.stampshopcta, amount: this.item.pricestamps + '', currency: state$4.market.currency, url: "https://shop.postnord.se/ebutik/default.aspx", service: this.item.name + "-eshop", note: state$4.i18n.message })) : null))));
+        (h("span", { slot: "Billigast" }, this.item.highestrankusp, h("pn-icon", { symbol: "box-label", small: "false", color: "green700" })))
+        : (h("span", { slot: "Snabbast" }, this.item.highestrankusp, h("pn-icon", { symbol: "bolt", small: "false", color: "blue700" }))) : null), h("div", { slot: "content" }, h("div", { class: "content" }, (this.item.description) ? (h("div", { class: "description" }, this.description.map((desc) => (h("li", null, desc))))) : null, (this.item.info) ? (h("div", { class: "description" }, this.item.info)) : null)), this.item.note ? (h("small", { slot: "note" }, h("p", null, this.item.note))) : null, this.item.additionalusp ? (h("div", { slot: "additionalUSP" }, this.Usp1 ? (h("span", null, this.Usp1)) : null, this.Usp2 ? (h("span", null, this.Usp2)) : null, this.Usp3 ? (h("span", null, this.Usp3)) : null)) : null, this.item.paket ? (h("pn-product-card-info", { paket: this.item.paket, rulle: this.item.rulle })) : null, h("div", { slot: "cardprice" }, this.item.priceagent ? (h("pn-product-card-price", { slot: "price", label: "", amount: this.item.priceagent + '', currency: state$5.market.currency, url: "https://shop.postnord.se/ebutik/default.aspx", service: this.item.name + "-eshop" })) : null, this.item.pricesenddirect ? (h("pn-product-card-price", { slot: "sendDirectPrice", label: state$5.i18n.senddirectcta, amount: this.item.pricesenddirect + '', currency: state$5.market.currency, url: "https://portal.postnord.com/skickadirekt/", service: this.item.name + "-portal" })) : null, this.item.pricestamps ? (h("pn-product-card-price", { slot: "stampPrice", label: state$5.i18n.stampshopcta, amount: this.item.pricestamps + '', currency: state$5.market.currency, url: "https://shop.postnord.se/ebutik/default.aspx", service: this.item.name + "-eshop" })) : null))));
   }
   static get watchers() { return {
     "item": ["composeItems"]
@@ -2702,7 +2634,7 @@ const weights$1 = {
 };
 
 // Read more about how stencil stores work here: https://stenciljs.com/docs/stencil-store
-const { state: state$3, onChange: onChange$3 } = createStore({
+const { state: state$4, onChange: onChange$4 } = createStore({
   i18n: {
     componentheading: '',
     deliveryscopeheading: '',
@@ -2760,10 +2692,10 @@ let PnfindServiceAndPrice = class extends HTMLElement {
   }
   setState() {
     if (this.market) {
-      state$3.market = markets$1[this.market];
+      state$4.market = markets$1[this.market];
     }
     if (this.language && translations$8[this.language]) {
-      state$3.i18n = translations$8[this.language];
+      state$4.i18n = translations$8[this.language];
     }
   }
   filterItems() {
@@ -2801,18 +2733,18 @@ let PnfindServiceAndPrice = class extends HTMLElement {
     this.filteredItems = weightFilteredData;
   }
   render() {
-    return (h("div", null, h("div", { class: "findprice-form" }, (state$3.i18n.componentheading) ? (h("h2", null, state$3.i18n.componentheading)) : null, h("div", { class: "postagetypes" }, postagetypes.map((postagetype) => (h("pn-choice-button", { choiceid: postagetype.value, value: postagetype.value, name: "postagetype", type: "radio", checked: postagetype.value === this.postagetype.value, onChange: () => {
+    return (h("div", null, h("div", { class: "findprice-form" }, (state$4.i18n.componentheading) ? (h("h2", null, state$4.i18n.componentheading)) : null, h("div", { class: "postagetypes" }, postagetypes.map((postagetype) => (h("pn-choice-button", { choiceid: postagetype.value, value: postagetype.value, name: "postagetype", type: "radio", checked: postagetype.value === this.postagetype.value, onChange: () => {
         this.postagetype = postagetypes.filter(x => x.value === postagetype.value)[0];
         this.deliveryscope = { value: "", name: "", icon: "" };
         this.weight = { value: 0, name: "" };
         this.weightvalue = this.weight.value;
-      } }, h("pn-illustration", { illustration: postagetype.illustration }), " ", postagetype.name)))), this.postagetype.value && deliveryscopes[this.postagetype.value] ? (h("div", null, (state$3.i18n.deliveryscopeheading) ? (h("div", { class: "heading" }, state$3.i18n.deliveryscopeheading)) : null, h("div", { class: "deliveryscope" }, deliveryscopes[this.postagetype.value].map((deliveryscope) => (h("pn-choice-button", { choiceid: this.postagetype.value + deliveryscope.value, value: deliveryscope.value, name: "deliveryscope", type: "radio", checked: deliveryscope.value === this.deliveryscope.value, onChange: () => {
+      } }, h("pn-illustration", { illustration: postagetype.illustration }), " ", postagetype.name)))), this.postagetype.value && deliveryscopes[this.postagetype.value] ? (h("div", null, (state$4.i18n.deliveryscopeheading) ? (h("div", { class: "heading" }, state$4.i18n.deliveryscopeheading)) : null, h("div", { class: "deliveryscope" }, deliveryscopes[this.postagetype.value].map((deliveryscope) => (h("pn-choice-button", { choiceid: this.postagetype.value + deliveryscope.value, value: deliveryscope.value, name: "deliveryscope", type: "radio", checked: deliveryscope.value === this.deliveryscope.value, onChange: () => {
         this.deliveryscope = deliveryscopes[this.postagetype.value].filter(x => x.value === deliveryscope.value)[0];
         if (this.weight.value === 0) {
           this.weight = weights$1[this.postagetype.value][0];
           this.weightvalue = this.weight.value;
         }
-      } }, h("pn-illustration", { illustration: deliveryscope.illustration }), " ", deliveryscope.name)))))) : null, (this.postagetype.value && weights$1[this.postagetype.value] && this.deliveryscope.value) ? (h("div", null, (state$3.i18n.sizeheading) ? (h("div", { class: "heading" }, state$3.i18n.sizeheading)) : null, h("div", { class: "weightoption" }, h("div", { class: "weightoption-input" }, h("pn-input", { inputid: "weightvalue", name: "weightvalue", type: "number", label: state$3.i18n.weightlabel, value: this.weightvalue, onChange: (e) => {
+      } }, h("pn-illustration", { illustration: deliveryscope.illustration }), " ", deliveryscope.name)))))) : null, (this.postagetype.value && weights$1[this.postagetype.value] && this.deliveryscope.value) ? (h("div", null, (state$4.i18n.sizeheading) ? (h("div", { class: "heading" }, state$4.i18n.sizeheading)) : null, h("div", { class: "weightoption" }, h("div", { class: "weightoption-input" }, h("pn-input", { inputid: "weightvalue", name: "weightvalue", type: "number", label: state$4.i18n.weightlabel, value: this.weightvalue, onChange: (e) => {
         if (e && e.target && e.target.value) {
           const weightNum = parseInt(e.target.value, 10);
           if (!isNaN(weightNum)) {
@@ -2838,7 +2770,7 @@ let PnfindServiceAndPrice = class extends HTMLElement {
         labelText = (weightindex % 5 === 0 || weightindex === 0 || weightindex === weights$1[this.postagetype.value].length - 1) ? weight.name : '';
       }
       return (h("option", Object.assign({ value: weightindex }, (labelText ? { label: labelText } : {}))));
-    })))))) : null), (this.filteredItems && this.filteredItems.length > 0) ? (h("div", { class: "resultlist" }, (state$3.i18n.resultlistheading) ? (h("div", { class: "heading" }, state$3.i18n.resultlistheading)) : null, this.filteredItems.map((item) => (h("div", null, h("pn-find-service-and-price-result", { item: item })))))) : null));
+    })))))) : null), (this.filteredItems && this.filteredItems.length > 0) ? (h("div", { class: "resultlist" }, (state$4.i18n.resultlistheading) ? (h("div", { class: "heading" }, state$4.i18n.resultlistheading)) : null, this.filteredItems.map((item) => (h("div", null, h("pn-find-service-and-price-result", { item: item })))))) : null));
   }
   static get watchers() { return {
     "market": ["setState"],
@@ -2879,7 +2811,7 @@ let PnfindServiceAndPriceResult = class extends HTMLElement {
       (this.item.what === "letter" && this.item.maxweight > 999) ? Math.round(this.item.maxweight / 1000) + " kg" : this.item.maxweight + " g";
   }
   render() {
-    return (h(Host, null, this.shownitems.map((item) => (h("pn-product-tile", null, h("pn-illustration", { slot: "illustration", illustration: item.illustration }), h("div", { slot: "content" }, h("div", { class: "content" }, h("h3", null, item.name), (item.description) ? (h("div", { class: "description" }, item.description)) : null, (item.info) ? (h("div", { class: "description" }, item.info)) : null)), item.maxweight ? (h("pn-product-tile-info", { label: state$3.i18n.maxweightlabel, text: this.weightText })) : null, item.maximummeasurements ? (h("pn-product-tile-info", { label: state$3.i18n.maxmeasurementlabel, text: item.maximummeasurements })) : null, item.pricestamps ? (h("pn-product-tile-price", { slot: "price", label: state$3.i18n.stampshopcta, amount: item.pricestamps + '', currency: state$3.market.currency })) : null, item.priceagent ? (h("pn-product-tile-price", { slot: "price", label: "", amount: item.priceagent + '', currency: state$3.market.currency, url: "https://shop.postnord.se/ebutik/default.aspx" })) : null, item.pricesenddirect ? (h("pn-product-tile-price", { slot: "price", label: state$3.i18n.senddirectcta, amount: item.pricesenddirect + '', currency: state$3.market.currency, url: "https://portal.postnord.com/skickadirekt/" })) : null, item.note ? (h("small", { slot: "note" }, h("p", null, item.note))) : null)))));
+    return (h(Host, null, this.shownitems.map((item) => (h("pn-product-tile", null, h("pn-illustration", { slot: "illustration", illustration: item.illustration }), h("div", { slot: "content" }, h("div", { class: "content" }, h("h3", null, item.name), (item.description) ? (h("div", { class: "description" }, item.description)) : null, (item.info) ? (h("div", { class: "description" }, item.info)) : null)), item.maxweight ? (h("pn-product-tile-info", { label: state$4.i18n.maxweightlabel, text: this.weightText })) : null, item.maximummeasurements ? (h("pn-product-tile-info", { label: state$4.i18n.maxmeasurementlabel, text: item.maximummeasurements })) : null, item.pricestamps ? (h("pn-product-tile-price", { slot: "price", label: state$4.i18n.stampshopcta, amount: item.pricestamps + '', currency: state$4.market.currency })) : null, item.priceagent ? (h("pn-product-tile-price", { slot: "price", label: "", amount: item.priceagent + '', currency: state$4.market.currency, url: "https://shop.postnord.se/ebutik/default.aspx" })) : null, item.pricesenddirect ? (h("pn-product-tile-price", { slot: "price", label: state$4.i18n.senddirectcta, amount: item.pricesenddirect + '', currency: state$4.market.currency, url: "https://portal.postnord.com/skickadirekt/" })) : null, item.note ? (h("small", { slot: "note" }, h("p", null, item.note))) : null)))));
   }
   static get watchers() { return {
     "item": ["composeItems"]
@@ -3062,7 +2994,7 @@ const translations$6 = {
 };
 
 // Read more about how stencil stores work here: https://stenciljs.com/docs/stencil-store
-const { state: state$2, onChange: onChange$2 } = createStore({
+const { state: state$3, onChange: onChange$3 } = createStore({
   openLevel: '',
   currentLevel: 1,
   openMenu: false,
@@ -3107,7 +3039,7 @@ let PnMainnav$1 = class extends HTMLElement {
   _onClickOutside(event) {
     const clickedOutside = !this.hostElement.contains(event.target);
     if (clickedOutside) {
-      state$2.openLevel = "";
+      state$3.openLevel = "";
     }
   }
   setLanguage() {
@@ -3118,21 +3050,21 @@ let PnMainnav$1 = class extends HTMLElement {
   }
   onLanguageChange(event) {
     if (translations$6[event.detail]) {
-      state$2.i18n = translations$6[event.detail];
+      state$3.i18n = translations$6[event.detail];
       if (!this.navLabel) {
-        this.navLabel = state$2.i18n.navLabel;
+        this.navLabel = state$3.i18n.navLabel;
       }
     }
   }
   setMenuOpenState() {
-    state$2.openMenu = (!state$2.openMenu);
-    this.menuOpenChange.emit(state$2.openMenu);
+    state$3.openMenu = (!state$3.openMenu);
+    this.menuOpenChange.emit(state$3.openMenu);
   }
   onOpenMenuLevelChange(event) {
-    state$2.openLevel = event.detail;
+    state$3.openLevel = event.detail;
   }
   render() {
-    return (h(Host, null, h("div", { class: "mainnav-toggle" }, h("button", { "aria-controls": this.navigationId, "aria-expanded": state$2.openMenu + '', onClick: this.setMenuOpenState.bind(this) }, state$2.i18n.mainMenuButton, h("pn-icon", { symbol: state$2.openMenu ? "close" : "bars", color: "white" }))), h("nav", { class: "mainnav", "aria-label": this.navLabel, "data-menu-open": state$2.openMenu + '', "data-menu-currentlevel": state$2.currentLevel, id: this.navigationId }, h("slot", null))));
+    return (h(Host, null, h("div", { class: "mainnav-toggle" }, h("button", { "aria-controls": this.navigationId, "aria-expanded": state$3.openMenu + '', onClick: this.setMenuOpenState.bind(this) }, state$3.i18n.mainMenuButton, h("pn-icon", { symbol: state$3.openMenu ? "close" : "bars", color: "white" }))), h("nav", { class: "mainnav", "aria-label": this.navLabel, "data-menu-open": state$3.openMenu + '', "data-menu-currentlevel": state$3.currentLevel, id: this.navigationId }, h("slot", null))));
   }
   get hostElement() { return this; }
   static get style() { return pnMainnavCss; }
@@ -3166,7 +3098,7 @@ let PnMainnavLevel$1 = class extends HTMLElement {
       const parentLinkName = this.parentName.toLowerCase().replace(/\W/gi, '_');
       this.levelId = `mainnav-lvl${this.level}-${parentLinkName}`;
     }
-    onChange$2("openLevel", () => {
+    onChange$3("openLevel", () => {
       this.onChangeOpenLevel();
     });
   }
@@ -3197,14 +3129,14 @@ let PnMainnavLevel$1 = class extends HTMLElement {
     }
   }
   onChangeOpenLevel() {
-    this.isOpen = state$2.openLevel === this.levelId;
-    state$2.currentLevel = this.level;
+    this.isOpen = state$3.openLevel === this.levelId;
+    state$3.currentLevel = this.level;
   }
   render() {
-    return (h(Host, Object.assign({ role: "navigation" }, ((this.level > 1 && this.levelId) ? { 'aria-hidden': (!this.isOpen) + '' } : {}), { "data-level-listcount": this.listCount + '', "data-level-alignment": this.alignment, "data-level": this.level + '' }, (this.levelId ? { id: this.levelId } : {})), (this.level > 1) ? (h("div", { class: "mainnav-level-header" }, h("label", { htmlFor: this.levelId }, state$2.i18n.menuGoBackButton), h("button", { class: "secondlevel-backbtn", onClick: () => {
-        state$2.openLevel = '';
-        state$2.currentLevel = 1;
-      }, "aria-expanded": (state$2.openLevel === this.levelId) + '' }, h("pn-icon", { symbol: "arrow-left", color: "blue700" }), state$2.i18n.menuStartButton), (this.parentHref && this.parentName) ? h("pn-mainnav-link", { href: this.parentHref, name: this.parentName, linkid: this.parentLinkId }) : null)) : null, h("slot", { name: "top" }), h("slot", null), h("slot", { name: "additional" }), h("slot", { name: "footer" })));
+    return (h(Host, Object.assign({ role: "navigation" }, ((this.level > 1 && this.levelId) ? { 'aria-hidden': (!this.isOpen) + '' } : {}), { "data-level-listcount": this.listCount + '', "data-level-alignment": this.alignment, "data-level": this.level + '' }, (this.levelId ? { id: this.levelId } : {})), (this.level > 1) ? (h("div", { class: "mainnav-level-header" }, h("label", { htmlFor: this.levelId }, state$3.i18n.menuGoBackButton), h("button", { class: "secondlevel-backbtn", onClick: () => {
+        state$3.openLevel = '';
+        state$3.currentLevel = 1;
+      }, "aria-expanded": (state$3.openLevel === this.levelId) + '' }, h("pn-icon", { symbol: "arrow-left", color: "blue700" }), state$3.i18n.menuStartButton), (this.parentHref && this.parentName) ? h("pn-mainnav-link", { href: this.parentHref, name: this.parentName, linkid: this.parentLinkId }) : null)) : null, h("slot", { name: "top" }), h("slot", null), h("slot", { name: "additional" }), h("slot", { name: "footer" })));
   }
   get hostElement() { return this; }
   static get watchers() { return {
@@ -3241,10 +3173,10 @@ let PnMainnavLink$1 = class extends HTMLElement {
     }
   }
   setOpenMenuLevel() {
-    state$2.openLevel = (state$2.openLevel + "" === this.levelId + "") ? '' : this.levelId;
+    state$3.openLevel = (state$3.openLevel + "" === this.levelId + "") ? '' : this.levelId;
   }
   render() {
-    return (h(Host, { role: "listitem", name: this.name, href: this.href, linkid: this.linkid }, this.hasChildren ? (h("button", { onClick: this.setOpenMenuLevel.bind(this), "aria-controls": this.levelId, "aria-pressed": "", "aria-expanded": ((state$2.openLevel + "" === this.levelId + "")) + '' }, this.name, h("pn-icon", { class: "first-level_icon", symbol: "angle-small-down", color: "blue700" }), h("pn-icon", { class: "first-level_arrow", symbol: "arrow-right", color: "blue700" }))) : (h("a", Object.assign({ href: this.href }, (this.target ? { target: this.target } : {}), (this.target === "_blank" ? { rel: "nofollow noopener" } : {}), (this.linkid ? { id: this.linkid } : {})), this.name, this.target === "_blank" ? (h("pn-icon", { symbol: "open-in-new", color: "blue700" })) : null)), h("slot", null)));
+    return (h(Host, { role: "listitem", name: this.name, href: this.href, linkid: this.linkid }, this.hasChildren ? (h("button", { onClick: this.setOpenMenuLevel.bind(this), "aria-controls": this.levelId, "aria-pressed": "", "aria-expanded": ((state$3.openLevel + "" === this.levelId + "")) + '' }, this.name, h("pn-icon", { class: "first-level_icon", symbol: "angle-small-down", color: "blue700" }), h("pn-icon", { class: "first-level_arrow", symbol: "arrow-right", color: "blue700" }))) : (h("a", Object.assign({ href: this.href }, (this.target ? { target: this.target } : {}), (this.target === "_blank" ? { rel: "nofollow noopener" } : {}), (this.linkid ? { id: this.linkid } : {})), this.name, this.target === "_blank" ? (h("pn-icon", { symbol: "open-in-new", color: "blue700" })) : null)), h("slot", null)));
   }
   get hostElement() { return this; }
   static get style() { return pnMainnavLinkCss; }
@@ -3269,6 +3201,174 @@ let PnMainnavList$1 = class extends HTMLElement {
   static get style() { return pnMainnavListCss; }
 };
 
+const pnMarketwebInputCss = "pn--marketweb-input{display:-ms-inline-flexbox;display:inline-flex;-ms-flex-direction:column;flex-direction:column}pn-marketweb-input input{padding:0.75em;font-size:1em;font-weight:500;-webkit-font-smoothing:antialiased;outline:none;border-radius:0.8rem;border:0.1rem solid #5E554A;-webkit-transition:border 0.15s, -webkit-box-shadow 0.15s;transition:border 0.15s, -webkit-box-shadow 0.15s;transition:box-shadow 0.15s, border 0.15s;transition:box-shadow 0.15s, border 0.15s, -webkit-box-shadow 0.15s;color:#000000;width:100%}pn-marketweb-input input::-webkit-input-placeholder{color:#969087;font-weight:normal}pn-marketweb-input input::-moz-placeholder{color:#969087;font-weight:normal}pn-marketweb-input input:-ms-input-placeholder{color:#969087;font-weight:normal}pn-marketweb-input input::-ms-input-placeholder{color:#969087;font-weight:normal}pn-marketweb-input input::placeholder{color:#969087;font-weight:normal}pn-marketweb-input input:focus{border:0.1rem solid #005D92;-webkit-box-shadow:0 0 0 0.2rem #fff, 0 0 0 0.4rem #005D92;box-shadow:0 0 0 0.2rem #fff, 0 0 0 0.4rem #005D92}pn-marketweb-input input:hover{border:0.1rem solid #00A0D6}pn-marketweb-input input:disabled{background:#F3F2F2;border:none}pn-marketweb-input>.input-container{position:relative}pn-marketweb-input>.input-container>button{position:absolute;right:1.2rem;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);background:none;border:none;cursor:pointer;color:#005D92;padding:0.6rem;border-radius:0.8rem;outline:none;-webkit-transition:border 0.1s, background 0.2s, color 0.1s;transition:border 0.1s, background 0.2s, color 0.1s;border:0.1rem solid transparent}pn-marketweb-input>.input-container>button:focus{border:0.1rem solid #005D92}pn-marketweb-input>.input-container>button:hover{background:#E0F8FF}pn-marketweb-input>.input-container>button:active{background:#005D92;color:white}pn-marketweb-input>.input-container>svg{position:absolute;right:0.75em;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);height:1.5em;width:1.5em;pointer-events:none}pn-marketweb-input>.input-container>svg polyline{stroke-linecap:round;-webkit-transition:stroke-dashoffset 0.2s cubic-bezier(0.79, 0.14, 0.15, 0.86);transition:stroke-dashoffset 0.2s cubic-bezier(0.79, 0.14, 0.15, 0.86)}pn-marketweb-input>.input-container>svg.pn-input-checkmark polyline{stroke:#005E41;stroke-dashoffset:23;stroke-dasharray:23}pn-marketweb-input .label-container{margin-bottom:0.4rem;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-marketweb-input .label-container label{cursor:pointer;-webkit-transition:color 0.2s;transition:color 0.2s}.label-container label.char-count{-ms-flex-negative:0;flex-shrink:0;padding-left:0.5em}pn-marketweb-input small{font-size:0.75em;font-size:max(.6em, 1.2rem);-webkit-transition:-webkit-transform 0.2s cubic-bezier(0.79, 0.14, 0.15, 0.86);transition:-webkit-transform 0.2s cubic-bezier(0.79, 0.14, 0.15, 0.86);transition:transform 0.2s cubic-bezier(0.79, 0.14, 0.15, 0.86);transition:transform 0.2s cubic-bezier(0.79, 0.14, 0.15, 0.86), -webkit-transform 0.2s cubic-bezier(0.79, 0.14, 0.15, 0.86);margin-top:0.5em;color:#5E554A}pn-input.error{color:#A70707}pn-input.error label{color:#A70707}pn-input.error small{color:#A70707}pn-input.error small>pn-icon{margin-right:0.25em}pn-input.error input{border:0.1rem solid #A70707}pn-input.error input:focus{border:0.1rem solid #A70707;-webkit-box-shadow:0 0 0 0.2rem #fff, 0 0 0 0.4rem #A70707;box-shadow:0 0 0 0.2rem #fff, 0 0 0 0.4rem #A70707}pn-input.error input:hover{border:0.1rem solid #F06365}pn-input.valid{color:#005E41}pn-input.valid .input-container>svg.pn-input-checkmark polyline{stroke-dashoffset:0}pn-input.valid label{color:#005E41}pn-input.valid input{border:0.1rem solid #005E41}pn-input.valid input:focus{border:0.1rem solid #005E41;-webkit-box-shadow:0 0 0 0.2rem #fff, 0 0 0 0.4rem #005E41;box-shadow:0 0 0 0.2rem #fff, 0 0 0 0.4rem #005E41}pn-input.valid input:hover{border:0.1rem solid #5EC584}pn-marketweb-input.password input{padding-right:4em}pn-marketweb-input.icon input{padding-right:2.3em}";
+
+let PnMarketwebInput$1 = class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.disabled = false;
+    /** Error message; will take precedence over helpertext if both are provided (applies invalid styles automatically) */
+    this.error = '';
+    /** Error state without message (If you want to control the error messaging on your own) */
+    this.invalid = false;
+    /** Text message placed underneath the input field */
+    this.helpertext = '';
+    /** Text label placed above the input field */
+    this.label = '';
+    this.placeholder = '';
+    this.inputid = `${Math.random()}`;
+    this.name = '';
+    this.required = null;
+    this.type = 'text';
+    this.autocomplete = '';
+    this.valid = null;
+    this.value = '';
+    /** The maximum number of characters the user should be able to add, also adds a visible counter */
+    this.maxlength = '';
+    this.min = '';
+    this.max = '';
+    this.step = '';
+    this.pattern = '';
+    this.showText = false;
+  }
+  getTextMessage() {
+    if (this.error)
+      return this.error;
+    if (this.helpertext)
+      return this.helpertext;
+    return null;
+  }
+  toggleTextVisibility() {
+    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';
+  }
+  setVal(e) {
+    var _a;
+    const target = (_a = e.composedPath) === null || _a === void 0 ? void 0 : _a.call(e)[0];
+    this.value = target.value;
+  }
+  getClassNames() {
+    let classNames = 'pn-input ';
+    if (this.error.length > 0 || this.invalid)
+      classNames += 'error ';
+    if (this.valid)
+      classNames += 'valid ';
+    if (this.type === 'password')
+      classNames += 'password ';
+    if (this.error || this.invalid || this.valid)
+      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())));
+  }
+  static get style() { return pnMarketwebInputCss; }
+};
+
+const pnMarketwebSearchCss = ":host{display:-ms-inline-flexbox;display:inline-flex}:host>pn-button{margin-left:0.35em}:host>pn-button button .pn-button-bg{-webkit-transition:width 0.2s cubic-bezier(0.7, 0, 0.3, 1) 0.2s, background 0.1s, left 0.2s, -webkit-box-shadow 0.1s, -webkit-transform 0.2s;transition:width 0.2s cubic-bezier(0.7, 0, 0.3, 1) 0.2s, background 0.1s, left 0.2s, -webkit-box-shadow 0.1s, -webkit-transform 0.2s;transition:width 0.2s cubic-bezier(0.7, 0, 0.3, 1) 0.2s, background 0.1s, box-shadow 0.1s, left 0.2s, transform 0.2s;transition:width 0.2s cubic-bezier(0.7, 0, 0.3, 1) 0.2s, background 0.1s, box-shadow 0.1s, left 0.2s, transform 0.2s, -webkit-box-shadow 0.1s, -webkit-transform 0.2s}:host>pn-button[data-loading=true] .pn-button-bg{left:0;-webkit-transform:translateX(0);transform:translateX(0);-webkit-transition:width 0.2s cubic-bezier(0.7, 0, 0.3, 1) 0.2s, background 0.1s, -webkit-box-shadow 0.1s;transition:width 0.2s cubic-bezier(0.7, 0, 0.3, 1) 0.2s, background 0.1s, -webkit-box-shadow 0.1s;transition:width 0.2s cubic-bezier(0.7, 0, 0.3, 1) 0.2s, background 0.1s, box-shadow 0.1s;transition:width 0.2s cubic-bezier(0.7, 0, 0.3, 1) 0.2s, background 0.1s, box-shadow 0.1s, -webkit-box-shadow 0.1s}:host>pn-button[data-loading=true] pn-spinner{left:0.75em}:host input{padding:0.75em;min-height:3em;font-size:1em;height:100%;font-weight:500;-webkit-font-smoothing:antialiased;outline:none;border-radius:3em;border:0.1rem solid #5E554A;-webkit-transition:border 0.15s, -webkit-box-shadow 0.15s;transition:border 0.15s, -webkit-box-shadow 0.15s;transition:box-shadow 0.15s, border 0.15s;transition:box-shadow 0.15s, border 0.15s, -webkit-box-shadow 0.15s;color:#000000;width:100%}:host input::-webkit-search-cancel-button{display:none}:host input::-webkit-input-placeholder{color:#969087;font-weight:normal}:host input::-moz-placeholder{color:#969087;font-weight:normal}:host input:-ms-input-placeholder{color:#969087;font-weight:normal}:host input::-ms-input-placeholder{color:#969087;font-weight:normal}:host input::placeholder{color:#969087;font-weight:normal}:host input:focus{border:0.1rem solid #005D92;-webkit-box-shadow:0 0 0 0.2rem #fff, 0 0 0 0.4rem #005D92;box-shadow:0 0 0 0.2rem #fff, 0 0 0 0.4rem #005D92}:host input:hover{border:0.1rem solid #00A0D6}:host input:disabled{background:#F3F2F2;border:none}:host>.input-container{width:100%;position:relative}:host>.input-container .button-container{position:absolute;top:0;right:0;background:transparent;width:3em;height:100%;overflow:hidden;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}:host[list] :host>.input-container .button-container{display:none}:host>.input-container button{position:absolute;left:50%;top:50%;-webkit-transform:translate(100%, -50%);transform:translate(100%, -50%);background:#FFFFFF;border:none;color:#005D92;padding:0.3rem;margin:0;font-size:0.875em;border-radius:50%;outline:none;-webkit-transition:border 0.1s, background 0.2s, opacity 0.2s, -webkit-box-shadow 0.1s, -webkit-transform cubic-bezier(0.7, 0, 0.3, 1) 0.2s;transition:border 0.1s, background 0.2s, opacity 0.2s, -webkit-box-shadow 0.1s, -webkit-transform cubic-bezier(0.7, 0, 0.3, 1) 0.2s;transition:border 0.1s, background 0.2s, box-shadow 0.1s, transform cubic-bezier(0.7, 0, 0.3, 1) 0.2s, opacity 0.2s;transition:border 0.1s, background 0.2s, box-shadow 0.1s, transform cubic-bezier(0.7, 0, 0.3, 1) 0.2s, opacity 0.2s, -webkit-box-shadow 0.1s, -webkit-transform cubic-bezier(0.7, 0, 0.3, 1) 0.2s;border:0.1rem solid transparent;-webkit-tap-highlight-color:transparent}:host>.input-container button.clear,:host>.input-container button.search{cursor:pointer}:host>.input-container button:focus{-webkit-box-shadow:0 0 0 0.2rem #fff, 0 0 0 0.4rem #005D92;box-shadow:0 0 0 0.2rem #fff, 0 0 0 0.4rem #005D92}:host>.input-container button:hover,:host>.input-container button:focus{background:#E0F8FF}:host>.input-container button:active{background:#005D92}:host>.input-container button:active pn-icon svg,:host>.input-container button:active pn-icon svg path{fill:white}:host .searching button.search{-webkit-transform:translate(150%, -50%);transform:translate(150%, -50%)}:host .searching button.clear{-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%)}:host .button-none input,:host .button-icon-inline input{padding-right:3.3em}:host .button-none pn-spinner,:host .button-icon-inline pn-spinner{position:absolute;left:50%;top:50%;-webkit-transform:translate(100%, -50%);transform:translate(100%, -50%);-webkit-transition:-webkit-transform cubic-bezier(0.7, 0, 0.3, 1) 0.2s;transition:-webkit-transform cubic-bezier(0.7, 0, 0.3, 1) 0.2s;transition:transform cubic-bezier(0.7, 0, 0.3, 1) 0.2s;transition:transform cubic-bezier(0.7, 0, 0.3, 1) 0.2s, -webkit-transform cubic-bezier(0.7, 0, 0.3, 1) 0.2s}:host .button-none button.search,:host .button-icon-inline button.search{-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%)}:host .button-none.loading button,:host .button-icon-inline.loading button{-webkit-transform:translate(100%, -50%);transform:translate(100%, -50%)}:host .button-none.loading pn-spinner,:host .button-icon-inline.loading pn-spinner{-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%)}:host .button-none.searching button.search{-webkit-transform:translate(100%, -50%);transform:translate(100%, -50%)}:host .button-icon>pn-button[data-loading=true] .pn-button-bg{left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%)}";
+
+let PnMarketwebSearch$1 = class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.__attachShadow();
+    this.search = createEvent(this, "search", 7);
+    this.update = createEvent(this, "update", 7);
+    this.disabled = false;
+    this.placeholder = null;
+    this.inputid = null;
+    this.name = null;
+    this.autocomplete = null;
+    this.list = null;
+    this.value = null;
+    /** Label for the button */
+    this.label = null;
+    /** Loading animation */
+    this.loading = false;
+    /** Button type, options are 'none' for no button, 'icon' for a labelless button with just a search icon and 'icon-inline' for a search button inside of the search field (this last option disables the clear field button) */
+    this.button = '';
+    /** Light instead of dark search button */
+    this.light = false;
+    this.suggestionObserver = null;
+    this.hasClonedInput = false;
+    this.listSuggestion = [];
+  }
+  inputHandler() {
+    this.update.emit(this.value);
+  }
+  emitSearch(e) {
+    if (e.type === 'click' ||
+      (e.type === 'keydown' && e.key === 'Enter')) {
+      // We prevent the native search event since it's not supported in IE and FF, then we emit our own instead
+      e.preventDefault();
+      this.search.emit(this.value);
+    }
+  }
+  setVal(e) {
+    this.value = e.target.value;
+  }
+  clearInput() {
+    this.value = '';
+    this.update.emit(this.value);
+    this.hostElement.querySelector('input').focus();
+  }
+  getClassNames() {
+    let classNames = '';
+    const buttonTypes = ['none', 'icon', 'icon-inline'];
+    if (this.value)
+      classNames += 'searching ';
+    if (this.loading)
+      classNames += 'loading ';
+    if (buttonTypes.includes(this.button))
+      classNames += `button-${this.button} `;
+    return classNames;
+  }
+  componentWillRender() {
+    this.cloneListContent();
+    this.autocompleteEventBinding();
+  }
+  onSuggestionUpdate() {
+    this.cloneListContent();
+  }
+  autocompleteEventBinding() {
+    if (this.suggestionObserver !== null || !this.list || (!this.hostElement) || !document.getElementById(this.list)) {
+      return;
+    }
+    const targetNode = document.getElementById(this.list);
+    this.suggestionObserver = new MutationObserver(this.onSuggestionUpdate.bind(this));
+    this.suggestionObserver.observe(targetNode, { attributes: true, childList: true, subtree: true });
+  }
+  cloneListContent() {
+    if (!this.list || (!this.hostElement) || !document.getElementById(this.list)) {
+      return;
+    }
+    const options = [...document.getElementById(this.list).querySelectorAll('option')];
+    this.listSuggestion = options.map((item) => {
+      if (item.hasAttribute('value')) {
+        return item.getAttribute('value');
+      }
+      return item.innerText;
+    });
+  }
+  render() {
+    return (h(Host, null, h("div", { class: `input-container ${this.getClassNames()}`, "data-haslist": (this.list !== null) + '' }, h("input", { type: "search", value: this.value, id: this.inputid, name: this.name, placeholder: this.placeholder, disabled: this.disabled, autocomplete: this.autocomplete, list: this.list, onKeyDown: (e) => this.emitSearch(e), onInput: (e) => this.setVal(e) }), h("div", { class: "button-container" }, (this.button === 'none' || this.button === 'icon-inline') &&
+      h("button", { class: "search", tabindex: this.button === 'icon-inline' ? '0' : '-1', onClick: (e) => this.emitSearch(e), "aria-label": "search", title: "search" }, h("pn-icon", { symbol: "search", color: "blue700" })), (this.button !== 'icon-inline') &&
+      h("button", { class: "clear", "aria-label": "clear", title: "clear search field", tabindex: this.value && (!this.loading || this.button !== 'none') ? '0' : '-1', onClick: () => this.clearInput() }, h("pn-icon", { symbol: "close-small", color: "blue700" })), this.button === 'none' || this.button === 'icon-inline' && h("pn-spinner", null))), (this.button !== 'none' && this.button !== 'icon-inline') &&
+      h("pn-button", { onClick: (e) => this.emitSearch(e), loading: this.loading, icon: "search", appearance: this.light ? 'light' : 'dark', "icon-only": this.button === 'icon' }, this.label), (this.list) &&
+      h("datalist", { id: this.list }, this.listSuggestion.map((item) => {
+        return (h("option", null, item));
+      }))));
+  }
+  get hostElement() { return this; }
+  static get style() { return pnMarketwebSearchCss; }
+};
+
 const translations$5 = {
   'sv': {
     "searchlabel": "Sök",
@@ -4029,6 +4129,8 @@ let PnMarketwebSiteheader$1 = class extends HTMLElement {
     this.hideSearch = false;
     /** Hides the login if set to true*/
     this.hideLogin = false;
+    /** Autocomplete endpoint */
+    this.AutocompleteEndpoint = "";
     /** Forward session to backend */
     this.sessionForward = false;
     /** If the component should use cached requests */
@@ -4041,7 +4143,7 @@ let PnMarketwebSiteheader$1 = class extends HTMLElement {
     // Menu state
     this.menuItems = [];
     // Search
-    this.search = {};
+    this.search = { AutocompleteEndpoint: this.AutocompleteEndpoint };
     // Site selector
     this.siteSelector = null;
     // Language Selector
@@ -4155,7 +4257,7 @@ let PnMarketwebSiteheader$1 = class extends HTMLElement {
       });
     }
     // Set search
-    this.search = data.search;
+    this.search = Object.assign(Object.assign({}, data.search), { AutocompleteEndpoint: this.AutocompleteEndpoint });
     // Set site selector
     this.siteSelector = data.siteSelectorViewModel;
     // Set language selector
@@ -4259,7 +4361,7 @@ let PnMarketwebSiteheader$1 = class extends HTMLElement {
     })), h("div", { slot: "footer", class: "siteheader-menu-footer" }, (this.gotData && this.loginDialog && !this.hideLogin) && (h("pn-marketweb-siteheader-login", { emitEvents: false, loginDialog: this.loginDialog, endpoint: this.endpoint, i18n: this.i18n })), (this.gotData && this.languageOptions && this.languageOptions.length) && !this.hideLanguageSelector &&
       h("pn-language-selector", { value: this.language }, this.languageOptions.map(language => h("pn-language-selector-option", { name: language.nativeName, code: language.twoLetterISOLanguageName, selected: language.isCurrent, url: this.getLanguageVersionUrl(language) }))), !this.hideSiteSelector &&
       h("pn-site-selector", { language: this.language }, (this.gotData && ((_e = this.siteSelector) === null || _e === void 0 ? void 0 : _e.currentSiteTitle)) &&
-        h("pn-site-selector-item", { heading: this.siteSelector.currentSiteTitle, description: this.siteSelector.currentSiteDescription }), (this.gotData && ((_f = this.siteSelector) === null || _f === void 0 ? void 0 : _f.siteSelections)) && this.siteSelector.siteSelections.map((site) => h("pn-site-selector-item", { heading: site.linkText, description: site.linkDescription, url: site.pageLink, newwindow: site.openInNewWindow })))), h("div", { slot: "top", class: "siteheader-menu-top" }, h("pn-marketweb-siteheader-search", { search: this.search, "hide-search": this.hideSearch, i18n: this.i18n })))))), h("pn-marketweb-siteheader-search", { search: this.search, "hide-search": this.hideSearch, "show-only-link": this.minimizeSearch, i18n: this.i18n })))));
+        h("pn-site-selector-item", { heading: this.siteSelector.currentSiteTitle, description: this.siteSelector.currentSiteDescription }), (this.gotData && ((_f = this.siteSelector) === null || _f === void 0 ? void 0 : _f.siteSelections)) && this.siteSelector.siteSelections.map((site) => h("pn-site-selector-item", { heading: site.linkText, description: site.linkDescription, url: site.pageLink, newwindow: site.openInNewWindow })))), h("div", { slot: "top", class: "siteheader-menu-top" }, h("pn-marketweb-siteheader-search", { search: this.search, "hide-search": this.hideSearch, i18n: this.i18n })))))), h("pn-marketweb-siteheader-search", { primary: true, search: this.search, "hide-search": this.hideSearch, "show-only-link": this.minimizeSearch, i18n: this.i18n })))));
   }
   get hostElement() { return this; }
   static get watchers() { return {
@@ -4415,6 +4517,13 @@ let PnMarketwebSiteheaderLogin$1 = class extends HTMLElement {
   static get style() { return pnMarketwebSiteheaderLoginCss; }
 };
 
+// Read more about how stencil stores work here: https://stenciljs.com/docs/stencil-store
+const { state: state$2, onChange: onChange$2 } = createStore({
+  searchValue: '',
+  autocompleteSuggestions: {},
+  requestAbortController: new AbortController()
+});
+
 const pnMarketwebSiteheaderSearchCss = ".siteheader-search a{display:none}@media screen and (min-width: 48em){.siteheader-search a{display:block}}.siteheader-search pn-search-field.button-icon pn-button,.siteheader-search pn-button{display:-ms-inline-flexbox;display:inline-flex}.siteheader-search pn-search-field.button-icon pn-button button,.siteheader-search pn-button button{-ms-flex-item-align:center;align-self:center;padding:0;height:2.3em;width:2.3em;line-height:0;min-height:unset;min-width:unset}.siteheader-search pn-search-field.button-icon pn-button pn-icon,.siteheader-search pn-button pn-icon{margin-left:0}.siteheader-search form{-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;width:auto;-ms-flex:none;flex:none;display:-ms-flexbox;display:flex;padding:0;margin:0 0 0 0.4rem;position:relative}@media screen and (min-width: 60em){.siteheader-search form{margin-right:1.6rem}}.siteheader-search form pn-search-field{min-width:13.5em}.siteheader-search form pn-search-field .input-container{-ms-flex-item-align:center;align-self:center}.siteheader-search form pn-search-field input{height:auto;min-height:1em;padding:0.6em 0.75em}";
 
 let PnMarketwebSiteheaderSearch$1 = class extends HTMLElement {
@@ -4427,20 +4536,73 @@ let PnMarketwebSiteheaderSearch$1 = class extends HTMLElement {
     this.hideSearch = false;
     // Search data
     this.search = {};
+    // Is this the primary instance?
+    this.primary = false;
+    // Autocomplete options
+    this.autoCompleteOptions = [];
+  }
+  onSearchValueUpdate() {
+    this.getAutocomplete(state$2.searchValue);
+  }
+  async getAutocomplete(prefix) {
+    if (!this.search.AutocompleteEndpoint || (prefix.length < 2)) {
+      this.autoCompleteOptions = [];
+      return;
+    }
+    if (state$2.autocompleteSuggestions[prefix]) {
+      this.setAutocompleteSuggestions(state$2.autocompleteSuggestions[prefix]);
+      return;
+    }
+    const req = await fetch(`${this.search.AutocompleteEndpoint}?prefix=${prefix}&size=10`, { signal: state$2.requestAbortController.signal }).catch((e) => {
+      console.log('Unable to fetch autocomplete suggestions', e);
+    });
+    if (!req) {
+      return;
+    }
+    const data = await req.json();
+    if (!data || !data.hits || !data.hits.length) {
+      return;
+    }
+    const suggestions = data.hits.map((item) => {
+      return item.query;
+    });
+    // Store query in store
+    state$2.autocompleteSuggestions[prefix] = suggestions;
+    this.setAutocompleteSuggestions(suggestions);
+  }
+  setAutocompleteSuggestions(suggestions) {
+    if (typeof suggestions !== "object" || typeof suggestions.length !== "number" || suggestions.length === 0) {
+      return;
+    }
+    this.autoCompleteOptions = suggestions;
   }
   componentWillLoad() {
+    onChange$2("searchValue", () => {
+      this.onSearchValueUpdate();
+    });
+  }
+  componentDidRender() {
+    const inputSearchElm = this.hostElement.querySelector('pn-search-field input:not([list])');
+    if (inputSearchElm && this.search.AutocompleteEndpoint) {
+      inputSearchElm.setAttribute("list", "siteheader-search-autocomplete");
+    }
   }
   render() {
     if (!this.search.formActionUrl || this.hideSearch) {
       return;
     }
+    const autocompleteAttribute = (this.search.AutocompleteEndpoint) ? { "list": "siteheader-search-autocomplete" } : {};
     return (h("div", { class: "siteheader-search" }, (this.showOnlyLink) ? (h("a", { href: this.search.formActionUrl, title: this.i18n.searchlabel }, h("pn-button", { appearance: "light", icon: "search" }))) :
-      (h("form", { method: "get", action: this.search.formActionUrl, role: "search" }, h("pn-search-field", { label: this.i18n.searchlabel, name: "q", button: "icon", onSearch: () => {
+      (h("form", { method: "get", action: this.search.formActionUrl, role: "search" }, h("pn-search-field", Object.assign({ label: this.i18n.searchlabel, name: "q", button: "icon" }, autocompleteAttribute, { onUpdate: (e) => {
+          state$2.searchValue = e.detail;
+        }, onSearch: () => {
           const form = this.hostElement.querySelector('form');
           if (form) {
             form.submit();
           }
-        }, placeholder: this.i18n.searchplaceholder })))));
+        }, placeholder: this.i18n.searchplaceholder })), this.primary && this.search.AutocompleteEndpoint ? (h("datalist", { id: "siteheader-search-autocomplete" }, this.autoCompleteOptions.map((item) => {
+        return (h("option", null, item));
+      }))) : null))));
   }
   get hostElement() { return this; }
   static get style() { return pnMarketwebSiteheaderSearchCss; }
@@ -4485,16 +4647,24 @@ let PnPexPricefinder$1 = class extends HTMLElement {
     this.fromzip = null;
     this.tozip = null;
     this.weight = 100;
-    this.when = (new Date()).toISOString().split('T')[0];
+    this.when = '';
     this.response = null;
   }
   componentWillLoad() {
     this.init();
   }
   async init() {
+    this.setInitialTime();
     this.checkParameters();
     this.setLanguage();
   }
+  setInitialTime() {
+    const initialTime = (new Date());
+    initialTime.setHours(initialTime.getHours() + 1);
+    initialTime.setMinutes(0);
+    const splitTime = initialTime.toLocaleString('sv', { timeZoneName: 'short' }).split(' ');
+    this.when = `${splitTime[0]}T${splitTime[1].substring(0, 5)}`;
+  }
   checkParameters() {
     const params = new URLSearchParams(window.location.href);
     if (!params) {
@@ -4555,13 +4725,13 @@ let PnPexPricefinder$1 = class extends HTMLElement {
     console.error('onFetchError(error', error);
   }
   render() {
-    return (h(Host, null, h("div", { class: "pex-pricefinder-top" }, h("pn-illustration", { illustration: "PEX-truck" }), h("h2", null, this.i18n.heading)), h("form", { method: "get", action: "", class: "pex-pricefinder-form", onSubmit: this.onSubmit.bind(this) }, h("fieldset", null, h("div", null, h("pn-input", { type: "number", label: this.i18n.labelFrom, inputid: "fromzip", name: "fromzip", placeholder: this.i18n.zipPlaceholder, required: true, value: this.fromzip }), h("pn-input", { type: "number", label: this.i18n.labelTo, inputid: "tozip", name: "tozip", placeholder: this.i18n.zipPlaceholder, required: true, value: this.tozip }))), h("fieldset", null, h("div", null, h("pn-input", { type: "number", label: this.i18n.labelWeight, inputid: "weight", name: "weight", placeholder: this.i18n.weightPlaceholder, required: true, value: this.weight }), h("div", { class: "datepicker" }, h("label", { htmlFor: "when" }, this.i18n.labelWhen), h("pn-date-picker", { inputid: "when", name: "when", "start-of-week": "1", min: (new Date()).toISOString().split('T')[0], language: this.language, value: this.when })))), h("fieldset", null, h("div", null, h("pn-button", { type: "submit" }, this.i18n.submitButtonText)))), this.response ? (h("div", { class: "pex-pricefinder-response" }, h("strong", null, this.response.data.value, " ", this.currency))) : null));
+    return (h(Host, null, h("div", { class: "pex-pricefinder-top" }, h("pn-illustration", { illustration: "PEX-truck" }), h("h2", null, this.i18n.heading)), h("form", { method: "get", action: "", class: "pex-pricefinder-form", onSubmit: this.onSubmit.bind(this) }, h("fieldset", null, h("div", null, h("pn-input", { type: "number", label: this.i18n.labelFrom, inputid: "fromzip", name: "fromzip", placeholder: this.i18n.zipPlaceholder, required: true, value: this.fromzip }), h("pn-input", { type: "number", label: this.i18n.labelTo, inputid: "tozip", name: "tozip", placeholder: this.i18n.zipPlaceholder, required: true, value: this.tozip }))), h("fieldset", null, h("div", null, h("pn-input", { type: "number", label: this.i18n.labelWeight, inputid: "weight", name: "weight", placeholder: this.i18n.weightPlaceholder, required: true, value: this.weight }), h("div", { class: "datepicker" }, h("label", { htmlFor: "when" }, this.i18n.labelWhen), h("pn-marketweb-input", { inputid: "when", name: "when", type: "datetime-local", min: (new Date()).toISOString().split('T')[0], value: this.when })))), h("fieldset", null, h("div", null, h("pn-button", { type: "submit" }, this.i18n.submitButtonText)))), this.response ? (h("div", { class: "pex-pricefinder-response" }, h("strong", null, this.response.data.value, " ", this.currency))) : null));
   }
   get hostElement() { return this; }
   static get style() { return pnPexPricefinderCss; }
 };
 
-const pnProductCardCss = "pn-product-card{margin-bottom:1em;border:0.1rem solid #D3CECB;outline:none;background:#FFFFFF;-webkit-box-shadow:0px 0.6px 1.8px rgba(0, 0, 0, 0.1), 0px 3.2px 7.2px rgba(0, 0, 0, 0.13);box-shadow:0px 0.6px 1.8px rgba(0, 0, 0, 0.1), 0px 3.2px 7.2px rgba(0, 0, 0, 0.13);display:-ms-flexbox;display:flex;padding:1.5em;word-break:break-word;text-decoration:none;border-radius:0.8rem}pn-product-card [slot=title]{display:-ms-flexbox;display:flex;width:100%;margin-bottom:0.5em}pn-product-card [slot=title]>[slot=Biligast]{color:#005E41;background:#DCF6E7;border-radius:0.37em;width:6.3em;height:2em;margin-left:1.5em;font-weight:normal;font-size:0.75em;text-align:center;vertical-align:bottom;padding-top:0.25em}pn-product-card [slot=title]>[slot=Biligast] pn-icon{vertical-align:middle;margin-left:0.6em}pn-product-card [slot=title]>[slot=Snabbast]{background:#E0F8FF;color:#005D92;border-radius:0.37em;width:7em;height:2em;margin-left:1.5em;font-weight:normal;font-size:0.75em;text-align:center;vertical-align:bottom;padding-top:0.25em}pn-product-card [slot=title]>[slot=Snabbast] pn-icon{vertical-align:middle;margin-left:0.6em}pn-product-card [slot=note]{margin-top:1em;margin-bottom:1em}pn-product-card [slot=additionalUSP]{display:-ms-flexbox;display:flex}pn-product-card [slot=additionalUSP] :first-child{margin-left:0em}pn-product-card [slot=additionalUSP] span{margin-left:1em;background:#D3CECB;color:#2D2013;border-radius:0.25em;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;padding:0.3em;margin-top:0.5em;font-size:0.75em}pn-product-card>pn-illustration{min-width:8rem;width:8rem;height:8rem;margin-right:3rem;-ms-flex-item-align:center;align-self:center}pn-product-card .cardcontent{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:center;justify-content:center;-ms-flex-positive:1;flex-grow:1}pn-product-card [slot=cardprice]{display:block;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:end;align-items:flex-end;-ms-flex-pack:center;justify-content:center;-ms-flex-positive:1;flex-grow:1}pn-product-card .details{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:justify;justify-content:space-between;width:100%}pn-product-card .info{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-positive:1;flex-grow:1;-ms-flex-flow:wrap;flex-flow:wrap;padding:0 1em 0 0}pn-product-card .info>*{min-width:6em;margin:0.5em 2em 0.5em 0}";
+const pnProductCardCss = "pn-product-card{border:0.1rem solid #D3CECB;outline:none;background:#FFFFFF;-webkit-box-shadow:0px 0.6px 1.8px rgba(0, 0, 0, 0.1), 0px 3.2px 7.2px rgba(0, 0, 0, 0.13);box-shadow:0px 0.6px 1.8px rgba(0, 0, 0, 0.1), 0px 3.2px 7.2px rgba(0, 0, 0, 0.13);display:-ms-flexbox;display:flex;word-break:break-word;text-decoration:none;border-radius:0.8rem;position:relative;padding:11rem 2.4rem 2.4rem;margin-bottom:1.6rem}@media screen and (min-width: 36em){pn-product-card{padding:2.4rem}}pn-product-card [slot=title]{display:-ms-flexbox;display:flex;width:100%;margin-bottom:0.8rem;gap:1.6rem;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center}@media screen and (min-width: 36em){pn-product-card [slot=title]{-ms-flex-direction:row;flex-direction:row;-ms-flex-align:inherit;align-items:inherit}}pn-product-card [slot=title] h2{width:100%}@media screen and (min-width: 36em){pn-product-card [slot=title] h2{width:auto}}pn-product-card [slot=title]>[slot]{border-radius:0.4rem;height:2.5em;font-weight:normal;font-size:0.75em;text-align:center;vertical-align:bottom;padding:0.6rem}pn-product-card [slot=title]>[slot] pn-icon{vertical-align:middle;margin-left:0.6em}pn-product-card [slot=title]>[slot=Billigast]{color:#005E41;background:#DCF6E7}pn-product-card [slot=title]>[slot=Snabbast]{background:#E0F8FF;color:#005D92}pn-product-card [slot=note]{margin-top:1em;margin-bottom:1em}pn-product-card [slot=additionalUSP]{display:-ms-flexbox;display:flex}pn-product-card [slot=additionalUSP] :first-child{margin-left:0em}pn-product-card [slot=additionalUSP] span{margin-left:1em;background:#D3CECB;color:#2D2013;border-radius:0.25em;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;padding:0.3em;margin-top:0.5em;font-size:0.75em}pn-product-card>pn-illustration{min-width:8rem;width:8rem;height:8rem;-ms-flex-item-align:center;align-self:center;position:absolute;top:1.6rem;-webkit-transform:translateX(-50%);transform:translateX(-50%);left:50%;-webkit-box-shadow:0px 0.6px 1.8px rgba(0, 0, 0, 0.1), 0px 3.2px 7.2px rgba(0, 0, 0, 0.13);box-shadow:0px 0.6px 1.8px rgba(0, 0, 0, 0.1), 0px 3.2px 7.2px rgba(0, 0, 0, 0.13);border-radius:100%}@media screen and (min-width: 36em){pn-product-card>pn-illustration{-webkit-box-shadow:none;box-shadow:none;top:1.6rem;right:1.6rem;left:auto;-webkit-transform:none;transform:none}}@media screen and (min-width: 48em){pn-product-card>pn-illustration{position:static;top:auto;right:auto;margin-right:3rem}}pn-product-card .cardcontent{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center;-ms-flex-positive:1;flex-grow:1}@media screen and (min-width: 48em){pn-product-card .cardcontent{-ms-flex-direction:row;flex-direction:row;gap:1.6rem}}pn-product-card .cardcontent .description :first-child{max-width:calc(100% - 10rem)}@media screen and (min-width: 48em){pn-product-card .cardcontent .description :first-child{max-width:none}}pn-product-card [slot=cardprice]{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center;-ms-flex-positive:1;flex-grow:1}@media screen and (min-width: 36em){pn-product-card [slot=cardprice]{-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:justify;justify-content:space-between}}@media screen and (min-width: 48em){pn-product-card [slot=cardprice]{-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center;-ms-flex-align:end;align-items:flex-end}}pn-product-card .details{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:justify;justify-content:space-between;width:100%}pn-product-card .info{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-positive:1;flex-grow:1;-ms-flex-flow:wrap;flex-flow:wrap;padding:0 1em 0 0}pn-product-card .info>*{min-width:6em;margin:0.5em 2em 0.5em 0}";
 
 let PnProductCard$1 = class extends HTMLElement {
   constructor() {
@@ -4569,12 +4739,12 @@ let PnProductCard$1 = class extends HTMLElement {
     this.__registerHost();
   }
   render() {
-    return (h(Host, null, h("slot", { name: "illustration" }), h("div", { class: "cardcontent" }, h("div", { class: "details" }, h("slot", { name: "title" }), h("slot", { name: "content" }), h("div", { class: "info" }, h("slot", null)), h("slot", { name: "note" }), h("slot", { name: "additionalUSP" })), h("div", null, h("slot", { name: "cardprice" })))));
+    return (h(Host, null, h("slot", { name: "illustration" }), h("div", { class: "cardcontent" }, h("div", { class: "details" }, h("slot", { name: "title" }), h("slot", { name: "content" }), h("div", { class: "info" }, h("slot", null)), h("slot", { name: "note" }), h("slot", { name: "additionalUSP" })), h("div", { class: "cardprice" }, h("slot", { name: "cardprice" })))));
   }
   static get style() { return pnProductCardCss; }
 };
 
-const pnProductCardInfoCss = "pn-product-card-info{-ms-flex-item-align:center;align-self:center}.cardinfocontent{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-positive:1;flex-grow:1;font-size:0.875em}.cardinfocontent>div p{margin:0.25em 0.25em 0 0}.cardinfocontent #sp{width:5em}[slot=formatPre]{font-family:\"PostNordSans\", \"Verdana\";margin:0.5em 3em 0 0}[slot=formatPre]>strong{font-weight:bold}.cardinfoprice{display:-ms-flexbox;display:flex;font-size:1em;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:center;justify-content:center;-ms-flex-positive:1;flex-grow:1}";
+const pnProductCardInfoCss = "pn-product-card-info{-ms-flex-item-align:center;align-self:center}.cardinfocontent{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-positive:1;flex-grow:1;font-size:0.875em;gap:1.6rem}@media screen and (min-width: 36em){.cardinfocontent{-ms-flex-direction:row;flex-direction:row}}[slot=formatPre]{font-family:\"PostNordSans\", \"Verdana\";margin:0.5em 3em 0 0}[slot=formatPre]>strong{font-weight:bold}.cardinfoprice{display:-ms-flexbox;display:flex;font-size:1em;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:center;justify-content:center;-ms-flex-positive:1;flex-grow:1}";
 
 let PnProductCardInfo$1 = class extends HTMLElement {
   constructor() {
@@ -4582,10 +4752,10 @@ let PnProductCardInfo$1 = class extends HTMLElement {
     this.__registerHost();
   }
   render() {
-    return (this.label) ? (h(Host, null, h("div", { class: "cardinfocontent" }, (this.text) ? (h("pre", { slot: "formatPre" }, this.text)) : null))) : (h(Host, null, h("div", { class: "cardinfocontent" }, h("div", null, h("strong", null, "Paket:"), this.paket.split("/").map((item) => ((item.split(":").length > 0) ?
+    return (this.label) ? (h(Host, null, h("div", { class: "cardinfocontent" }, (this.text) ? (h("pre", { slot: "formatPre" }, this.text)) : null))) : (h(Host, null, h("div", { class: "cardinfocontent" }, h("div", { class: "cardinfocontent-item" }, h("strong", null, "Paket:"), this.paket.split("/").map((item) => ((item.split(":").length > 0) ?
       h("p", null, h("strong", null, item.split(":")[0] + ": "), " ", item.split(":")[1]) :
-      h("p", null, item)))), h("div", { id: "sp" }), (this.rulle) ?
-      (h("div", null, h("strong", null, "Rulle:"), this.rulle.split("/").map((item) => ((item.split(":").length > 0) ?
+      h("p", null, item)))), (this.rulle) ?
+      (h("div", { class: "cardinfocontent-item" }, h("strong", null, "Rulle:"), this.rulle.split("/").map((item) => ((item.split(":").length > 0) ?
         h("p", null, h("strong", null, item.split(":")[0] + ": "), " ", item.split(":")[1]) :
         h("p", null, item))))) : null)));
   }
@@ -4593,7 +4763,7 @@ let PnProductCardInfo$1 = class extends HTMLElement {
 };
 h("pn-icon", { symbol: "align-center", small: "false", color: "black" });
 
-const pnProductCardPriceCss = "pn-product-card-price{margin-top:1em;white-space:nowrap;text-align:center}pn-product-card-price span:last-child{display:inline-block;margin-left:0.2em}pn-product-card-price+pn-product-card-price{margin-right:0}pn-product-card-price pn-icon{display:inline-block;-ms-flex-item-align:center;align-self:center}pn-product-card-price pn-button{width:12.8em;margin-bottom:1em;margin-top:0.5em;font-size:1.25}pn-product-card-price p{font-weight:lighter;font-size:0.875em;-ms-flex-item-align:center;align-self:center;margin-top:0.5em}pn-product-card-price a{text-decoration:none;color:#005D92}pn-product-card-price a h3{text-decoration:underline}";
+const pnProductCardPriceCss = "pn-product-card-price{margin-top:1.6rem;white-space:nowrap;text-align:center;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}pn-product-card-price span:last-child{display:inline-block;margin-left:0.2em}pn-product-card-price+pn-product-card-price{margin-right:0}pn-product-card-price pn-icon{display:inline-block;-ms-flex-item-align:center;align-self:center}pn-product-card-price pn-button{min-width:12.8em;margin-top:0.8rem;font-size:1.25;-ms-flex-order:2;order:2}@media screen and (min-width: 48em){pn-product-card-price pn-button{-ms-flex-order:3;order:3;margin-bottom:1.6rem}}pn-product-card-price h3{-ms-flex-order:1;order:1}pn-product-card-price p{font-weight:lighter;font-size:0.875em;-ms-flex-item-align:center;align-self:center;margin-top:0.8rem;-ms-flex-order:3;order:3}@media screen and (min-width: 48em){pn-product-card-price p{-ms-flex-order:2;order:2}}pn-product-card-price a{text-decoration:none;color:#005D92}pn-product-card-price a h3{text-decoration:underline}";
 
 let PnProductCardPrice$1 = class extends HTMLElement {
   constructor() {
@@ -4604,7 +4774,7 @@ let PnProductCardPrice$1 = class extends HTMLElement {
     if (!this.amount) {
       return;
     }
-    return (this.url) ? (h(Host, null, h("h3", null, (this.amount) ? (h("span", null, this.amount)) : null, (this.currency) ? (h("span", null, " " + this.currency)) : null), (this.note) ? (h("p", null, this.note)) : null, (this.label) ? (h("pn-button", { small: "true", icon: "arrow-right", appearance: "secondary", href: this.url, target: "_blank", id: this.service.split(" ").join("-").toLocaleLowerCase() }, this.label)) : null)) : (h(Host, null, h("h3", null, (this.amount) ? (h("span", null, this.amount)) : null, (this.currency) ? (h("span", null, this.currency)) : null)));
+    return (this.url) ? (h(Host, null, h("h3", null, (this.amount) ? (h("span", null, this.amount)) : null, (this.currency) ? (h("span", null, " " + this.currency)) : null), (this.note) ? (h("p", null, this.note)) : null, (this.label) ? (h("pn-button", { small: "true", icon: "open-in-new", appearance: "light", href: this.url, target: "_blank", id: this.service.split(" ").join("-").toLocaleLowerCase() }, this.label)) : null)) : (h(Host, null, h("h3", null, (this.amount) ? (h("span", null, this.amount)) : null, (this.currency) ? (h("span", null, this.currency)) : null)));
   }
   static get style() { return pnProductCardPriceCss; }
 };
@@ -4713,7 +4883,7 @@ const { state: state$1, onChange: onChange$1 } = createStore({
   }
 });
 
-const pnProductPricelistCss = "pn-product-pricelist pn-spinner{margin:1em auto}pn-product-pricelist h2,pn-product-pricelist .heading{text-align:center;font-size:1.5em;line-height:1.1;font-weight:bold;margin-bottom:1rem}pn-product-pricelist .content,pn-product-pricelist .weightselection{max-width:50em;margin:0 auto 1em}pn-product-pricelist .weightoption{display:-ms-flexbox;display:flex;gap:1em}pn-product-pricelist .weightoption-input{width:5em;position:relative}pn-product-pricelist .weightoption-input input::-webkit-outer-spin-button,pn-product-pricelist .weightoption-input input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}pn-product-pricelist .weightoption-input-abbreviation{position:absolute;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);right:1.2em;margin-top:1.55rem;font-weight:500}pn-product-pricelist .weightoption-range{-ms-flex-positive:1;flex-grow:1;-ms-flex-item-align:end;align-self:flex-end;position:relative;top:0.5em}pn-product-pricelist .weightoption-range input{width:calc(100% - 1.5em)}pn-product-pricelist .weightoption-range datalist{width:100%;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;font-size:0.75em}pn-product-pricelist .resultlist:not([data-list-count=\"0\"]){margin-top:2em}";
+const pnProductPricelistCss = "pn-product-pricelist pn-spinner{margin:1em auto}pn-product-pricelist h2,pn-product-pricelist .heading{text-align:center;font-size:1.5em;line-height:1.1;font-weight:bold;margin-bottom:1rem}pn-product-pricelist .content,pn-product-pricelist .weightselection{max-width:50em;margin:0 auto 1em}pn-product-pricelist .weightoption{display:-ms-flexbox;display:flex;gap:1em}pn-product-pricelist .weightoption-input{width:5em;position:relative;display:none}pn-product-pricelist .weightoption-input input::-webkit-outer-spin-button,pn-product-pricelist .weightoption-input input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}pn-product-pricelist .weightoption-input-abbreviation{position:absolute;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);right:1.2em;margin-top:1.55rem;font-weight:500}pn-product-pricelist .weightoption-range{-ms-flex-positive:1;flex-grow:1;-ms-flex-item-align:end;align-self:flex-end;position:relative;top:0.5em}pn-product-pricelist .weightoption-range input{width:calc(100% - 1.5em)}pn-product-pricelist .weightoption-range datalist{width:100%;display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;font-size:0.75em}pn-product-pricelist .resultlist:not([data-list-count=\"0\"]){margin-top:2em}";
 
 let PnFindProductPricelist = class extends HTMLElement {
   constructor() {
@@ -5277,7 +5447,6 @@ const PnBonusProgressbar = /*@__PURE__*/proxyCustomElement(PnBonusProgressbar$1,
 const PnBonusProgressbarLevel = /*@__PURE__*/proxyCustomElement(PnBonusProgressbarLevel$1, [0,"pn-bonus-progressbar-level",{"current":[516],"value":[1538],"bonuspercentage":[1537],"visualpercentage":[1538],"percentage":[32],"max":[32],"min":[32],"currency":[32]}]);
 const PnChoiceButton = /*@__PURE__*/proxyCustomElement(PnChoiceButton$1, [4,"pn-choice-button",{"value":[520],"name":[1],"choiceid":[1],"type":[1],"disabled":[4],"checked":[4],"indeterminate":[1028]},[[0,"change","handlechange"]]]);
 const PnFilterCheckbox = /*@__PURE__*/proxyCustomElement(PnFilterCheckbox$1, [1,"pn-filter-checkbox",{"value":[520],"name":[1],"checkboxid":[1],"disabled":[4],"checked":[4],"indeterminate":[1028]},[[0,"change","handlechange"]]]);
-const PnFilterSearch = /*@__PURE__*/proxyCustomElement(PnFilterSearch$1, [1,"pn-filter-search",{"disabled":[4],"placeholder":[1],"inputid":[1],"name":[1],"autocomplete":[1],"value":[1],"label":[1],"loading":[4],"button":[1],"light":[4]},[[0,"input","inputHandler"]]]);
 const PnFindPrice = /*@__PURE__*/proxyCustomElement(PnfindPrice, [0,"pn-find-price",{"source":[1],"language":[1025],"market":[1025],"filteredItems":[32],"weight":[32],"weightvalue":[32],"sourceData":[32],"sizecategory":[32]}]);
 const PnFindPriceResult = /*@__PURE__*/proxyCustomElement(PnfindPriceResult, [0,"pn-find-price-result",{"item":[1040],"shownitems":[16],"Usp1":[1,"usp-1"],"Usp2":[1,"usp-2"],"Usp3":[1,"usp-3"],"description":[16],"weightText":[32]}]);
 const PnFindServiceAndPrice = /*@__PURE__*/proxyCustomElement(PnfindServiceAndPrice, [0,"pn-find-service-and-price",{"source":[1],"language":[1025],"market":[1025],"filteredItems":[32],"postagetype":[32],"weight":[32],"weightvalue":[32],"deliveryscope":[32],"sourceData":[32]}]);
@@ -5288,10 +5457,12 @@ const PnMainnav = /*@__PURE__*/proxyCustomElement(PnMainnav$1, [4,"pn-mainnav",{
 const PnMainnavLevel = /*@__PURE__*/proxyCustomElement(PnMainnavLevel$1, [4,"pn-mainnav-level",{"level":[32],"levelId":[32],"isOpen":[32],"parentName":[32],"parentHref":[32],"parentLinkId":[32],"listCount":[32],"alignment":[32]}]);
 const PnMainnavLink = /*@__PURE__*/proxyCustomElement(PnMainnavLink$1, [4,"pn-mainnav-link",{"name":[1],"href":[1],"target":[1],"linkid":[1],"levelId":[32],"open":[32],"hasChildren":[32]}]);
 const PnMainnavList = /*@__PURE__*/proxyCustomElement(PnMainnavList$1, [4,"pn-mainnav-list",{"heading":[1],"linkCount":[32]}]);
+const PnMarketwebInput = /*@__PURE__*/proxyCustomElement(PnMarketwebInput$1, [0,"pn-marketweb-input",{"disabled":[4],"error":[1],"invalid":[4],"helpertext":[1],"label":[1],"placeholder":[1],"inputid":[1],"name":[1],"required":[4],"type":[1025],"autocomplete":[1],"valid":[4],"value":[1],"maxlength":[1],"min":[1],"max":[1],"step":[1],"pattern":[1],"showText":[32]}]);
+const PnMarketwebSearch = /*@__PURE__*/proxyCustomElement(PnMarketwebSearch$1, [1,"pn-marketweb-search",{"disabled":[4],"placeholder":[1],"inputid":[1],"name":[1],"autocomplete":[1],"list":[1],"value":[1],"label":[1],"loading":[4],"button":[1],"light":[4],"suggestionObserver":[32],"hasClonedInput":[32],"listSuggestion":[32]},[[0,"input","inputHandler"]]]);
 const PnMarketwebSitefooter = /*@__PURE__*/proxyCustomElement(PnMarketwebSiteheader$2, [0,"pn-marketweb-sitefooter",{"market":[1537],"language":[1537],"environment":[1537],"endpoint":[1],"cache":[4],"siteDefinition":[32],"footerContent":[32],"i18n":[32],"gotData":[32],"fetchingData":[32]}]);
-const PnMarketwebSiteheader = /*@__PURE__*/proxyCustomElement(PnMarketwebSiteheader$1, [4,"pn-marketweb-siteheader",{"market":[1537],"language":[1537],"environment":[1537],"token":[1],"endpoint":[1],"hideSiteSelector":[1540,"hide-site-selector"],"hideLanguageSelector":[1540,"hide-language-selector"],"hideSearch":[1540,"hide-search"],"hideLogin":[1540,"hide-login"],"sessionForward":[4,"session-forward"],"cache":[4],"spaMode":[4,"spa-mode"],"i18n":[32],"gotData":[32],"fetchingData":[32],"homePageLink":[32],"menuItems":[32],"siteDefinition":[32],"search":[32],"siteSelector":[32],"languageSelector":[32],"languageOptions":[32],"loginDialog":[32],"minimizeSearch":[32],"loggedIn":[32],"loginManager":[32]},[[0,"setLanguage","onLanguageSelectorChange"],[0,"loginStateChange","onLoginStateChange"],[9,"resize","handleResize"]]]);
+const PnMarketwebSiteheader = /*@__PURE__*/proxyCustomElement(PnMarketwebSiteheader$1, [4,"pn-marketweb-siteheader",{"market":[1537],"language":[1537],"environment":[1537],"token":[1],"endpoint":[1],"hideSiteSelector":[1540,"hide-site-selector"],"hideLanguageSelector":[1540,"hide-language-selector"],"hideSearch":[1540,"hide-search"],"hideLogin":[1540,"hide-login"],"AutocompleteEndpoint":[1,"autocomplete-endpoint"],"sessionForward":[4,"session-forward"],"cache":[4],"spaMode":[4,"spa-mode"],"i18n":[32],"gotData":[32],"fetchingData":[32],"homePageLink":[32],"menuItems":[32],"siteDefinition":[32],"search":[32],"siteSelector":[32],"languageSelector":[32],"languageOptions":[32],"loginDialog":[32],"minimizeSearch":[32],"loggedIn":[32],"loginManager":[32]},[[0,"setLanguage","onLanguageSelectorChange"],[0,"loginStateChange","onLoginStateChange"],[9,"resize","handleResize"]]]);
 const PnMarketwebSiteheaderLogin = /*@__PURE__*/proxyCustomElement(PnMarketwebSiteheaderLogin$1, [0,"pn-marketweb-siteheader-login",{"endpoint":[1],"token":[1],"i18n":[8,"i-1-8n"],"emitEvents":[4,"emit-events"],"loginDialog":[1040],"loginManager":[32],"loggedIn":[32],"toggleButtonText":[32],"username":[32]}]);
-const PnMarketwebSiteheaderSearch = /*@__PURE__*/proxyCustomElement(PnMarketwebSiteheaderSearch$1, [0,"pn-marketweb-siteheader-search",{"i18n":[8,"i-1-8n"],"showOnlyLink":[1028,"show-only-link"],"hideSearch":[1028,"hide-search"],"search":[1040]}]);
+const PnMarketwebSiteheaderSearch = /*@__PURE__*/proxyCustomElement(PnMarketwebSiteheaderSearch$1, [0,"pn-marketweb-siteheader-search",{"i18n":[8,"i-1-8n"],"showOnlyLink":[1028,"show-only-link"],"hideSearch":[1028,"hide-search"],"search":[1040],"primary":[4],"autoCompleteOptions":[32]}]);
 const PnPexPricefinder = /*@__PURE__*/proxyCustomElement(PnPexPricefinder$1, [0,"pn-pex-pricefinder",{"language":[1],"currency":[1],"apiUrl":[1,"api-url"],"i18n":[32],"fromzip":[32],"tozip":[32],"weight":[32],"when":[32],"response":[32]},[[0,"language","setLanguage"]]]);
 const PnProductCard = /*@__PURE__*/proxyCustomElement(PnProductCard$1, [4,"pn-product-card"]);
 const PnProductCardInfo = /*@__PURE__*/proxyCustomElement(PnProductCardInfo$1, [0,"pn-product-card-info",{"rulle":[1],"paket":[1],"label":[1],"text":[1]}]);
@@ -5317,7 +5488,6 @@ const defineCustomElements = (opts) => {
   PnBonusProgressbarLevel,
   PnChoiceButton,
   PnFilterCheckbox,
-  PnFilterSearch,
   PnFindPrice,
   PnFindPriceResult,
   PnFindServiceAndPrice,
@@ -5328,6 +5498,8 @@ const defineCustomElements = (opts) => {
   PnMainnavLevel,
   PnMainnavLink,
   PnMainnavList,
+  PnMarketwebInput,
+  PnMarketwebSearch,
   PnMarketwebSitefooter,
   PnMarketwebSiteheader,
   PnMarketwebSiteheaderLogin,
@@ -5358,4 +5530,4 @@ const defineCustomElements = (opts) => {
   }
 };
 
-export { PnBonusProgressbar, PnBonusProgressbarLevel, PnChoiceButton, PnFilterCheckbox, PnFilterSearch, PnFindPrice, PnFindPriceResult, PnFindServiceAndPrice, PnFindServiceAndPriceResult, PnLanguageSelector, PnLanguageSelectorOption, PnMainnav, PnMainnavLevel, PnMainnavLink, PnMainnavList, PnMarketwebSitefooter, PnMarketwebSiteheader, PnMarketwebSiteheaderLogin, PnMarketwebSiteheaderSearch, PnPexPricefinder, PnProductCard, PnProductCardInfo, PnProductCardPrice, PnProductPricelist, PnProductPricelistResult, PnProductTile, PnProductTileInfo, PnProductTilePrice, PnProfileSelector, PnProfileSelectorOption, PnSidenav, PnSidenavLevel, PnSidenavLink, PnSiteFooter, PnSiteFooterCol, PnSiteSelector, PnSiteSelectorItem, defineCustomElements };
+export { PnBonusProgressbar, PnBonusProgressbarLevel, PnChoiceButton, PnFilterCheckbox, PnFindPrice, PnFindPriceResult, PnFindServiceAndPrice, PnFindServiceAndPriceResult, PnLanguageSelector, PnLanguageSelectorOption, PnMainnav, PnMainnavLevel, PnMainnavLink, PnMainnavList, PnMarketwebInput, PnMarketwebSearch, PnMarketwebSitefooter, PnMarketwebSiteheader, PnMarketwebSiteheaderLogin, PnMarketwebSiteheaderSearch, PnPexPricefinder, PnProductCard, PnProductCardInfo, PnProductCardPrice, PnProductPricelist, PnProductPricelistResult, PnProductTile, PnProductTileInfo, PnProductTilePrice, PnProfileSelector, PnProfileSelectorOption, PnSidenav, PnSidenavLevel, PnSidenavLink, PnSiteFooter, PnSiteFooterCol, PnSiteSelector, PnSiteSelectorItem, defineCustomElements };