@postnord/pn-marketweb-components 1.0.3 → 1.0.7

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

@@ -1,295 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-0f43b450.js');
-
-class PNLoginManager {
-  constructor(options = null) {
-    var _a;
-    this.eventTarget = (window !== null && window !== void 0 ? window : document === null || document === void 0 ? void 0 : document.body);
-    this.endpoint = "";
-    this.storagePrefix = "pn-user";
-    this.baseUrls = {
-      at: 'https://atportal.postnord.com/api/unified-login/backend',
-      prod: 'https://portal.postnord.com/api/unified-login/backend',
-    };
-    this.events = {
-      loginstatechange: "loginstatechange"
-    };
-    this.endpoints = {
-      authorizationEndpoint: `/authorization`,
-      tokenExchangeEndpoint: `/token`,
-      userInfoEndpoint: `/user`,
-      logoutEndpoint: `/logout`,
-    };
-    this.keys = {
-      token: 'token',
-      user: 'user',
-      expire: 'expire',
-      expireDate: 'expiredate'
-    };
-    this.store = {
-      get: (key) => {
-        const value = window.sessionStorage.getItem(`${this.storagePrefix}-${key}`);
-        if (!value) {
-          return value;
-        }
-        if (value.indexOf('{') === 0) {
-          try {
-            return JSON.parse(value);
-          }
-          catch (e) {
-          }
-        }
-        if (value.indexOf(',') !== -1) {
-          return value.split(',');
-        }
-        return value;
-      },
-      set: (key, value) => {
-        if (typeof value === "object" && typeof value.length === "undefined") {
-          window.sessionStorage.setItem(`${this.storagePrefix}-${key}`, JSON.stringify(value));
-          return;
-        }
-        window.sessionStorage.setItem(`${this.storagePrefix}-${key}`, value);
-      },
-      remove: (key) => {
-        window.sessionStorage.removeItem(`${this.storagePrefix}-${key}`);
-      },
-    };
-    if (!options) {
-      return;
-    }
-    this.eventTarget = (options.eventTarget) ? options.eventTarget : this.eventTarget;
-    this.endpoint = options.endpoint ? options.endpoint : `${window.location.protocol}//${window.location.host}`;
-    (_a = this.storagePrefix) !== null && _a !== void 0 ? _a : (this.storagePrefix = options.storagePrefix);
-  }
-  init() {
-    this.checkParameters();
-    this.checkExpireTime();
-    if (this.store.get(this.keys.token) && !this.store.get(this.keys.user)) {
-      this.fetchUserInfo();
-    }
-    this.loginStateChange();
-  }
-  isLoggedIn() {
-    const isLoggedIn = (this.store.get(this.keys.token) && this.store.get(this.keys.user)) ? true : false;
-    return isLoggedIn;
-  }
-  getLoginUrl(redirectPage = "") {
-    const currentPage = window.location.href;
-    redirectPage = redirectPage ? redirectPage : currentPage;
-    return `${this.getBaseUrl()}${this.endpoints.authorizationEndpoint}?redirectionUrl=${redirectPage}`;
-  }
-  getLogoutUrl(redirectPage = "") {
-    const currentPage = window.location.href;
-    redirectPage = redirectPage ? redirectPage : currentPage;
-    return `${this.getBaseUrl()}${this.endpoints.logoutEndpoint}?redirectionUrl=${redirectPage}&authorization=${this.store.get(this.keys.token)}`;
-  }
-  getUserInfo() {
-    if (this.isLoggedIn()) {
-      return this.store.get(this.keys.user);
-    }
-  }
-  getEventTarget() {
-    return this.eventTarget;
-  }
-  checkExpireTime() {
-    const expire = this.store.get(this.keys.expire);
-    if (!expire) {
-      return;
-    }
-    const now = new Date();
-    const expireDate = new Date(Math.floor(parseInt(expire, 10) * 1000));
-    if (now > expireDate) {
-      console.info('Login time has expired');
-      this.clearUserData();
-      this.loginStateChange();
-    }
-  }
-  checkParameters() {
-    if (!(window === null || window === void 0 ? void 0 : window.location)) {
-      return;
-    }
-    const params = new URLSearchParams(window.location.search);
-    if (params.get("oneTimeCode")) {
-      const oneTimeCode = params.get("oneTimeCode");
-      this.getToken(oneTimeCode);
-      const currentHref = window.location.href;
-      const paramPrefix = (currentHref.indexOf('?oneTimeCode') !== -1) ? "?" : "&";
-      history.replaceState({}, document.querySelector('title').innerText, currentHref.replace(`${paramPrefix}oneTimeCode=${oneTimeCode}`, ''));
-    }
-  }
-  async fetchUserInfo() {
-    const token = this.store.get(this.keys.token);
-    const reqConfig = {
-      method: 'GET',
-      headers: {
-        'Accept': 'application/json',
-        'Content-Type': 'application/json',
-        'Authorization': token
-      },
-    };
-    const response = await fetch(`${this.getBaseUrl()}${this.endpoints.userInfoEndpoint}`, reqConfig);
-    const data = await response.json();
-    if (data) {
-      try {
-        const { idToken, expiryTime } = data;
-        const userInfo = this.parseUserInfo(idToken);
-        this.store.set(this.keys.user, userInfo);
-        // 10 Min early expire
-        this.store.set(this.keys.expire, expiryTime);
-        this.store.set(this.keys.expireDate, new Date(Math.floor(parseInt(expiryTime, 10) * 1000)));
-        this.loginStateChange();
-      }
-      catch (e) {
-        console.error('Unable to get user information', e);
-      }
-    }
-  }
-  clearUserData() {
-    this.store.remove(this.keys.user);
-    this.store.remove(this.keys.token);
-    this.store.remove(this.keys.expire);
-    this.store.remove(this.keys.expireDate);
-  }
-  async getToken(oneTimeCode) {
-    this.clearUserData();
-    const response = await fetch(`${this.getBaseUrl()}${this.endpoints.tokenExchangeEndpoint}?oneTimeCode=${oneTimeCode}`);
-    const { token } = await response.json();
-    if (typeof token === "string" && token) {
-      this.store.set(this.keys.token, token);
-    }
-    this.fetchUserInfo();
-  }
-  loginStateChange() {
-    if (!this.eventTarget) {
-      return;
-    }
-    this.eventTarget.dispatchEvent(new CustomEvent(this.events.loginstatechange, {
-      detail: this.isLoggedIn()
-    }));
-  }
-  getBaseUrl() {
-    const atEnvironments = ["localhost", "integration.", 'local.'];
-    const useATEnv = atEnvironments.filter(x => this.endpoint.indexOf(x) !== -1).length > 0;
-    if (useATEnv) {
-      return this.baseUrls.at;
-    }
-    return this.baseUrls.prod;
-  }
-  parseUserInfo(idToken) {
-    var base64Url = idToken.split('.')[1];
-    var base64 = base64Url.replace(/-/g, '+').replace(/_/g, '/');
-    var jsonPayload = decodeURIComponent(atob(base64).split('').map(function (c) {
-      return '%' + ('00' + c.charCodeAt(0).toString(16)).slice(-2);
-    }).join(''));
-    return JSON.parse(jsonPayload);
-  }
-}
-
-const pnSiteheaderLoginCss = "pn-siteheader-login{padding:1rem 0;margin-right:1.6rem}pn-siteheader-login strong{padding:0.8rem 1.6rem;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}pn-siteheader-login ul,pn-siteheader-login li{list-style:none;margin:0;padding:0}pn-siteheader-login li{padding:0.8rem 1.6rem}pn-siteheader-login li a{display:block;width:100%}pn-siteheader-login li a[tabindex],pn-siteheader-login li a[style]{text-decoration:none}pn-siteheader-login li pn-button{display:block;width:100%}pn-siteheader-login pn-nav-dropdown{display:none}pn-siteheader-login.hydrated pn-nav-dropdown{display:block}";
-
-const PnSiteheaderLogin = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    /** Specifies which endpoint domain we should load from */
-    this.endpoint = "";
-    // Login dialog
-    this.loginDialog = null;
-    this.loginManager = null;
-    this.loggedIn = false;
-    this.toggleButtonText = "";
-  }
-  componentWillLoad() {
-    this.loginManager = new PNLoginManager({ endpoint: this.endpoint, eventTarget: this.hostElement });
-    this.init();
-  }
-  async init() {
-    this.toggleButtonText = this.loginDialog.loginMenuLinkText;
-    this.hostElement.addEventListener(this.loginManager.events.loginstatechange, this.onLoginStateChange.bind(this));
-    this.loginManager.init();
-    this.setToggleButtonText();
-  }
-  setToggleButtonText() {
-    const userInfo = this.loginManager.getUserInfo();
-    if (this.loggedIn) {
-      if (userInfo === null || userInfo === void 0 ? void 0 : userInfo.given_name) {
-        this.toggleButtonText = userInfo.given_name + ((userInfo === null || userInfo === void 0 ? void 0 : userInfo.family_name) ? ` ${userInfo === null || userInfo === void 0 ? void 0 : userInfo.family_name}` : "");
-      }
-      else {
-        this.toggleButtonText = this.loginDialog.loggedInButtonText;
-      }
-    }
-    else {
-      this.toggleButtonText = this.loginDialog.loginMenuLinkText;
-    }
-  }
-  onLoginStateChange(e) {
-    this.loggedIn = e.detail;
-    this.setToggleButtonText();
-  }
-  render() {
-    var _a, _b, _c;
-    if (!this.loginDialog) {
-      return;
-    }
-    return (index.h("pn-nav-dropdown", { label: this.toggleButtonText, icon: "user", class: "siteheader-logindialog" }, (!this.loginDialog.overrideLoginMenu) ?
-      index.h("div", { "data-loggedin": this.loggedIn + '' }, (!this.loggedIn) ?
-        index.h("div", null, (_a = this.loginDialog.loginTitle) !== null && _a !== void 0 ? _a : index.h("strong", null, this.loginDialog.loginTitle), ((_b = this.loginDialog.loginMenuLinks) === null || _b === void 0 ? void 0 : _b.length) > 0 ?
-          index.h("ul", null, this.loginDialog.loginMenuLinks.map((link, i) => {
-            const href = (i === 0 && !link.href) ? this.loginManager.getLoginUrl() : link.href;
-            return (index.h("li", null, index.h("a", Object.assign({ href: href }, (link.openInNewWindow && { target: '_blank' })), index.h("pn-button", { appearance: (link.primaryLinkApperance ? "dark" : "light") }, link.linkText))));
-          }))
-          : (index.h("ul", null, index.h("li", null, index.h("a", { href: this.loginManager.getLoginUrl(this.loginDialog.loginUrl), target: "_top" }, index.h("pn-button", null, this.loginDialog.loginLinkText))), index.h("li", null, index.h("a", { href: this.loginDialog.registerUrl, target: "_top" }, index.h("pn-button", { appearance: "light", variant: "outlined" }, this.loginDialog.createLoginLinkText))))))
-        :
-          index.h("div", null, index.h("ul", null, this.loginDialog.loggedInLinks.map((link) => {
-            const isLogoutLink = link.href.indexOf('logout');
-            const href = (isLogoutLink) ? this.loginManager.getLogoutUrl(link.href.replace('logout', '')) : link.href;
-            return (index.h("li", null, index.h("a", Object.assign({ href: href }, (link.openInNewWindow && { target: '_blank' })), index.h("pn-button", { appearance: (link.primaryLinkApperance ? "dark" : "light"), onClick: () => {
-                if (isLogoutLink) {
-                  this.loginManager.clearUserData();
-                }
-              } }, link.linkText))));
-          }))))
-      :
-        index.h("div", null, index.h("ul", null, (_c = this.loginDialog.loginMenuLinks) === null || _c === void 0 ? void 0 : _c.map(link => index.h("li", null, index.h("a", { href: link.href, target: link.openInNewWindow ? "_blank" : "_self", class: "btn btn-link" }, link.linkText)))))));
-  }
-  get hostElement() { return index.getElement(this); }
-};
-PnSiteheaderLogin.style = pnSiteheaderLoginCss;
-
-const pnSiteheaderSearchCss = ".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}";
-
-const PnSiteheaderSearch = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    // Display option, show only link
-    this.showOnlyLink = false;
-    // Hide search option
-    this.hideSearch = false;
-    // Search data
-    this.search = {};
-  }
-  componentWillLoad() {
-  }
-  render() {
-    if (!this.search.formActionUrl || this.hideSearch) {
-      return;
-    }
-    return (index.h("div", { class: "siteheader-search" }, (this.showOnlyLink) ? (index.h("a", { href: this.search.formActionUrl, title: this.i18n.searchlabel }, index.h("pn-button", { appearance: "light", icon: "search" }))) :
-      (index.h("form", { method: "get", action: this.search.formActionUrl, role: "search" }, index.h("pn-search-field", { label: this.i18n.searchlabel, name: "q", button: "icon", onSearch: () => {
-          const form = this.hostElement.querySelector('form');
-          console.log('form', form);
-          if (form) {
-            form.submit();
-          }
-        }, placeholder: this.i18n.searchplaceholder })))));
-  }
-  get hostElement() { return index.getElement(this); }
-};
-PnSiteheaderSearch.style = pnSiteheaderSearchCss;
-
-exports.pn_siteheader_login = PnSiteheaderLogin;
-exports.pn_siteheader_search = PnSiteheaderSearch;

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

@@ -1,34 +0,0 @@
-pn-siteheader-login {
-  padding: 1rem 0;
-  margin-right: 1.6rem;
-}
-pn-siteheader-login strong {
-  padding: 0.8rem 1.6rem;
-  display: flex;
-  align-items: center;
-}
-pn-siteheader-login ul, pn-siteheader-login li {
-  list-style: none;
-  margin: 0;
-  padding: 0;
-}
-pn-siteheader-login li {
-  padding: 0.8rem 1.6rem;
-}
-pn-siteheader-login li a {
-  display: block;
-  width: 100%;
-}
-pn-siteheader-login li a[tabindex], pn-siteheader-login li a[style] {
-  text-decoration: none;
-}
-pn-siteheader-login li pn-button {
-  display: block;
-  width: 100%;
-}
-pn-siteheader-login pn-nav-dropdown {
-  display: none;
-}
-pn-siteheader-login.hydrated pn-nav-dropdown {
-  display: block;
-}

package/esm/pn-siteheader-login_2.entry.js

@@ -1,290 +0,0 @@
-import { r as registerInstance, h, g as getElement } from './index-1e3839a0.js';
-
-class PNLoginManager {
-  constructor(options = null) {
-    var _a;
-    this.eventTarget = (window !== null && window !== void 0 ? window : document === null || document === void 0 ? void 0 : document.body);
-    this.endpoint = "";
-    this.storagePrefix = "pn-user";
-    this.baseUrls = {
-      at: 'https://atportal.postnord.com/api/unified-login/backend',
-      prod: 'https://portal.postnord.com/api/unified-login/backend',
-    };
-    this.events = {
-      loginstatechange: "loginstatechange"
-    };
-    this.endpoints = {
-      authorizationEndpoint: `/authorization`,
-      tokenExchangeEndpoint: `/token`,
-      userInfoEndpoint: `/user`,
-      logoutEndpoint: `/logout`,
-    };
-    this.keys = {
-      token: 'token',
-      user: 'user',
-      expire: 'expire',
-      expireDate: 'expiredate'
-    };
-    this.store = {
-      get: (key) => {
-        const value = window.sessionStorage.getItem(`${this.storagePrefix}-${key}`);
-        if (!value) {
-          return value;
-        }
-        if (value.indexOf('{') === 0) {
-          try {
-            return JSON.parse(value);
-          }
-          catch (e) {
-          }
-        }
-        if (value.indexOf(',') !== -1) {
-          return value.split(',');
-        }
-        return value;
-      },
-      set: (key, value) => {
-        if (typeof value === "object" && typeof value.length === "undefined") {
-          window.sessionStorage.setItem(`${this.storagePrefix}-${key}`, JSON.stringify(value));
-          return;
-        }
-        window.sessionStorage.setItem(`${this.storagePrefix}-${key}`, value);
-      },
-      remove: (key) => {
-        window.sessionStorage.removeItem(`${this.storagePrefix}-${key}`);
-      },
-    };
-    if (!options) {
-      return;
-    }
-    this.eventTarget = (options.eventTarget) ? options.eventTarget : this.eventTarget;
-    this.endpoint = options.endpoint ? options.endpoint : `${window.location.protocol}//${window.location.host}`;
-    (_a = this.storagePrefix) !== null && _a !== void 0 ? _a : (this.storagePrefix = options.storagePrefix);
-  }
-  init() {
-    this.checkParameters();
-    this.checkExpireTime();
-    if (this.store.get(this.keys.token) && !this.store.get(this.keys.user)) {
-      this.fetchUserInfo();
-    }
-    this.loginStateChange();
-  }
-  isLoggedIn() {
-    const isLoggedIn = (this.store.get(this.keys.token) && this.store.get(this.keys.user)) ? true : false;
-    return isLoggedIn;
-  }
-  getLoginUrl(redirectPage = "") {
-    const currentPage = window.location.href;
-    redirectPage = redirectPage ? redirectPage : currentPage;
-    return `${this.getBaseUrl()}${this.endpoints.authorizationEndpoint}?redirectionUrl=${redirectPage}`;
-  }
-  getLogoutUrl(redirectPage = "") {
-    const currentPage = window.location.href;
-    redirectPage = redirectPage ? redirectPage : currentPage;
-    return `${this.getBaseUrl()}${this.endpoints.logoutEndpoint}?redirectionUrl=${redirectPage}&authorization=${this.store.get(this.keys.token)}`;
-  }
-  getUserInfo() {
-    if (this.isLoggedIn()) {
-      return this.store.get(this.keys.user);
-    }
-  }
-  getEventTarget() {
-    return this.eventTarget;
-  }
-  checkExpireTime() {
-    const expire = this.store.get(this.keys.expire);
-    if (!expire) {
-      return;
-    }
-    const now = new Date();
-    const expireDate = new Date(Math.floor(parseInt(expire, 10) * 1000));
-    if (now > expireDate) {
-      console.info('Login time has expired');
-      this.clearUserData();
-      this.loginStateChange();
-    }
-  }
-  checkParameters() {
-    if (!(window === null || window === void 0 ? void 0 : window.location)) {
-      return;
-    }
-    const params = new URLSearchParams(window.location.search);
-    if (params.get("oneTimeCode")) {
-      const oneTimeCode = params.get("oneTimeCode");
-      this.getToken(oneTimeCode);
-      const currentHref = window.location.href;
-      const paramPrefix = (currentHref.indexOf('?oneTimeCode') !== -1) ? "?" : "&";
-      history.replaceState({}, document.querySelector('title').innerText, currentHref.replace(`${paramPrefix}oneTimeCode=${oneTimeCode}`, ''));
-    }
-  }
-  async fetchUserInfo() {
-    const token = this.store.get(this.keys.token);
-    const reqConfig = {
-      method: 'GET',
-      headers: {
-        'Accept': 'application/json',
-        'Content-Type': 'application/json',
-        'Authorization': token
-      },
-    };
-    const response = await fetch(`${this.getBaseUrl()}${this.endpoints.userInfoEndpoint}`, reqConfig);
-    const data = await response.json();
-    if (data) {
-      try {
-        const { idToken, expiryTime } = data;
-        const userInfo = this.parseUserInfo(idToken);
-        this.store.set(this.keys.user, userInfo);
-        // 10 Min early expire
-        this.store.set(this.keys.expire, expiryTime);
-        this.store.set(this.keys.expireDate, new Date(Math.floor(parseInt(expiryTime, 10) * 1000)));
-        this.loginStateChange();
-      }
-      catch (e) {
-        console.error('Unable to get user information', e);
-      }
-    }
-  }
-  clearUserData() {
-    this.store.remove(this.keys.user);
-    this.store.remove(this.keys.token);
-    this.store.remove(this.keys.expire);
-    this.store.remove(this.keys.expireDate);
-  }
-  async getToken(oneTimeCode) {
-    this.clearUserData();
-    const response = await fetch(`${this.getBaseUrl()}${this.endpoints.tokenExchangeEndpoint}?oneTimeCode=${oneTimeCode}`);
-    const { token } = await response.json();
-    if (typeof token === "string" && token) {
-      this.store.set(this.keys.token, token);
-    }
-    this.fetchUserInfo();
-  }
-  loginStateChange() {
-    if (!this.eventTarget) {
-      return;
-    }
-    this.eventTarget.dispatchEvent(new CustomEvent(this.events.loginstatechange, {
-      detail: this.isLoggedIn()
-    }));
-  }
-  getBaseUrl() {
-    const atEnvironments = ["localhost", "integration.", 'local.'];
-    const useATEnv = atEnvironments.filter(x => this.endpoint.indexOf(x) !== -1).length > 0;
-    if (useATEnv) {
-      return this.baseUrls.at;
-    }
-    return this.baseUrls.prod;
-  }
-  parseUserInfo(idToken) {
-    var base64Url = idToken.split('.')[1];
-    var base64 = base64Url.replace(/-/g, '+').replace(/_/g, '/');
-    var jsonPayload = decodeURIComponent(atob(base64).split('').map(function (c) {
-      return '%' + ('00' + c.charCodeAt(0).toString(16)).slice(-2);
-    }).join(''));
-    return JSON.parse(jsonPayload);
-  }
-}
-
-const pnSiteheaderLoginCss = "pn-siteheader-login{padding:1rem 0;margin-right:1.6rem}pn-siteheader-login strong{padding:0.8rem 1.6rem;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}pn-siteheader-login ul,pn-siteheader-login li{list-style:none;margin:0;padding:0}pn-siteheader-login li{padding:0.8rem 1.6rem}pn-siteheader-login li a{display:block;width:100%}pn-siteheader-login li a[tabindex],pn-siteheader-login li a[style]{text-decoration:none}pn-siteheader-login li pn-button{display:block;width:100%}pn-siteheader-login pn-nav-dropdown{display:none}pn-siteheader-login.hydrated pn-nav-dropdown{display:block}";
-
-const PnSiteheaderLogin = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    /** Specifies which endpoint domain we should load from */
-    this.endpoint = "";
-    // Login dialog
-    this.loginDialog = null;
-    this.loginManager = null;
-    this.loggedIn = false;
-    this.toggleButtonText = "";
-  }
-  componentWillLoad() {
-    this.loginManager = new PNLoginManager({ endpoint: this.endpoint, eventTarget: this.hostElement });
-    this.init();
-  }
-  async init() {
-    this.toggleButtonText = this.loginDialog.loginMenuLinkText;
-    this.hostElement.addEventListener(this.loginManager.events.loginstatechange, this.onLoginStateChange.bind(this));
-    this.loginManager.init();
-    this.setToggleButtonText();
-  }
-  setToggleButtonText() {
-    const userInfo = this.loginManager.getUserInfo();
-    if (this.loggedIn) {
-      if (userInfo === null || userInfo === void 0 ? void 0 : userInfo.given_name) {
-        this.toggleButtonText = userInfo.given_name + ((userInfo === null || userInfo === void 0 ? void 0 : userInfo.family_name) ? ` ${userInfo === null || userInfo === void 0 ? void 0 : userInfo.family_name}` : "");
-      }
-      else {
-        this.toggleButtonText = this.loginDialog.loggedInButtonText;
-      }
-    }
-    else {
-      this.toggleButtonText = this.loginDialog.loginMenuLinkText;
-    }
-  }
-  onLoginStateChange(e) {
-    this.loggedIn = e.detail;
-    this.setToggleButtonText();
-  }
-  render() {
-    var _a, _b, _c;
-    if (!this.loginDialog) {
-      return;
-    }
-    return (h("pn-nav-dropdown", { label: this.toggleButtonText, icon: "user", class: "siteheader-logindialog" }, (!this.loginDialog.overrideLoginMenu) ?
-      h("div", { "data-loggedin": this.loggedIn + '' }, (!this.loggedIn) ?
-        h("div", null, (_a = this.loginDialog.loginTitle) !== null && _a !== void 0 ? _a : h("strong", null, this.loginDialog.loginTitle), ((_b = this.loginDialog.loginMenuLinks) === null || _b === void 0 ? void 0 : _b.length) > 0 ?
-          h("ul", null, this.loginDialog.loginMenuLinks.map((link, i) => {
-            const href = (i === 0 && !link.href) ? this.loginManager.getLoginUrl() : link.href;
-            return (h("li", null, h("a", Object.assign({ href: href }, (link.openInNewWindow && { target: '_blank' })), h("pn-button", { appearance: (link.primaryLinkApperance ? "dark" : "light") }, link.linkText))));
-          }))
-          : (h("ul", null, h("li", null, h("a", { href: this.loginManager.getLoginUrl(this.loginDialog.loginUrl), target: "_top" }, h("pn-button", null, this.loginDialog.loginLinkText))), h("li", null, h("a", { href: this.loginDialog.registerUrl, target: "_top" }, h("pn-button", { appearance: "light", variant: "outlined" }, this.loginDialog.createLoginLinkText))))))
-        :
-          h("div", null, h("ul", null, this.loginDialog.loggedInLinks.map((link) => {
-            const isLogoutLink = link.href.indexOf('logout');
-            const href = (isLogoutLink) ? this.loginManager.getLogoutUrl(link.href.replace('logout', '')) : link.href;
-            return (h("li", null, h("a", Object.assign({ href: href }, (link.openInNewWindow && { target: '_blank' })), h("pn-button", { appearance: (link.primaryLinkApperance ? "dark" : "light"), onClick: () => {
-                if (isLogoutLink) {
-                  this.loginManager.clearUserData();
-                }
-              } }, link.linkText))));
-          }))))
-      :
-        h("div", null, h("ul", null, (_c = this.loginDialog.loginMenuLinks) === null || _c === void 0 ? void 0 : _c.map(link => h("li", null, h("a", { href: link.href, target: link.openInNewWindow ? "_blank" : "_self", class: "btn btn-link" }, link.linkText)))))));
-  }
-  get hostElement() { return getElement(this); }
-};
-PnSiteheaderLogin.style = pnSiteheaderLoginCss;
-
-const pnSiteheaderSearchCss = ".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}";
-
-const PnSiteheaderSearch = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    // Display option, show only link
-    this.showOnlyLink = false;
-    // Hide search option
-    this.hideSearch = false;
-    // Search data
-    this.search = {};
-  }
-  componentWillLoad() {
-  }
-  render() {
-    if (!this.search.formActionUrl || this.hideSearch) {
-      return;
-    }
-    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: () => {
-          const form = this.hostElement.querySelector('form');
-          console.log('form', form);
-          if (form) {
-            form.submit();
-          }
-        }, placeholder: this.i18n.searchplaceholder })))));
-  }
-  get hostElement() { return getElement(this); }
-};
-PnSiteheaderSearch.style = pnSiteheaderSearchCss;
-
-export { PnSiteheaderLogin as pn_siteheader_login, PnSiteheaderSearch as pn_siteheader_search };